/* ==========================================================
   GLORAVE // MYTH REBIRTH — INFRASTRUCTURE CONCEPT
   The city is the ritual space. No generic cosmic fantasy language.
   ========================================================== */

.gr-mythic-body {
  --infra-line:rgba(155,124,255,.15);
  --infra-line-soft:rgba(155,124,255,.07);
  --infra-text:rgba(231,226,244,.65);
  background:#06070b;
}
[data-theme="light"] .gr-mythic-body {
  --infra-line:rgba(72,52,120,.18);
  --infra-line-soft:rgba(72,52,120,.08);
  --infra-text:rgba(46,37,67,.66);
  background:#efedf2;
}
.gr-mythic-body::before {
  background:
    linear-gradient(rgba(155,124,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(155,124,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,transparent 0 7%,rgba(103,216,209,.025) 7% calc(7% + 1px),transparent calc(7% + 1px) 93%,rgba(215,182,106,.025) 93% calc(93% + 1px),transparent calc(93% + 1px)),
    radial-gradient(circle at 68% 9%,rgba(155,124,255,.075),transparent 24rem),
    #06070b;
  background-size:64px 64px,64px 64px,auto,auto,auto;
}
[data-theme="light"] .gr-mythic-body::before {
  background:
    linear-gradient(rgba(72,52,120,.038) 1px,transparent 1px),
    linear-gradient(90deg,rgba(72,52,120,.038) 1px,transparent 1px),
    radial-gradient(circle at 68% 9%,rgba(155,124,255,.08),transparent 24rem),
    #efedf2;
  background-size:64px 64px,64px 64px,auto,auto;
}

/* Kill the old generic fantasy markers. */
.myth-stars,.myth-hero-orbit,.myth-sigil,.myth-doctrine-orbit { display:none!important; }
.myth-cursor-field {
  background:radial-gradient(560px circle at var(--myth-pointer-x) var(--myth-pointer-y),rgba(var(--myth-violet-rgb),.065),transparent 72%);
}
.myth-noise { opacity:.11; }

/* Header/hero stays recognisable but becomes an architectural dossier. */
.myth-page { padding-top:30px; }
.myth-hero {
  min-height:650px;
  border-radius:8px;
  border-color:rgba(var(--myth-violet-rgb),.22);
  background:linear-gradient(105deg,rgba(8,8,14,.99),rgba(9,10,15,.97) 48%,rgba(6,7,11,.99));
  box-shadow:0 38px 98px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.02);
}
[data-theme="light"] .myth-hero { background:linear-gradient(105deg,#f7f3fb,#eeebf1 50%,#f7f4f1); }
.myth-hero::before {
  background:
    linear-gradient(90deg,transparent 0 52%,rgba(var(--myth-violet-rgb),.055) 52% 52.08%,transparent 52.08%),
    repeating-linear-gradient(0deg,transparent 0 63px,rgba(var(--myth-violet-rgb),.027) 63px 64px),
    repeating-linear-gradient(90deg,transparent 0 63px,rgba(var(--myth-violet-rgb),.027) 63px 64px),
    radial-gradient(circle at 16% 68%,rgba(var(--myth-violet-rgb),.08),transparent 26%);
}
.myth-era-line { margin-bottom:13px; }
.myth-era-line>span { background:linear-gradient(90deg,var(--myth-violet),var(--myth-teal)); }
.myth-era-line i { color:rgba(103,216,209,.72); }
.myth-kicker { border-radius:4px!important; box-shadow:none!important; }
.myth-hero h1 { font-size:clamp(4rem,7.2vw,8.6rem); }
.myth-hero h1 em { -webkit-text-stroke:1px rgba(155,124,255,.85); text-shadow:none; }
.myth-manifest {
  margin-top:20px;
  padding:15px 17px;
  border-left:2px solid var(--myth-violet);
  background:linear-gradient(90deg,rgba(var(--myth-violet-rgb),.075),transparent 76%);
}
.myth-manifest::after { width:62px; background:var(--myth-teal); }
.myth-actions .gr-btn { border-radius:4px!important; }
.myth-stats { gap:0!important; border-top:1px solid var(--infra-line); border-bottom:1px solid var(--infra-line); }
.myth-stats div { min-width:150px!important; padding:13px 20px 12px 0!important; border:0!important; border-right:1px solid var(--infra-line)!important; border-radius:0!important; background:transparent!important; }
.myth-stats div+div { padding-left:20px!important; }

.myth-hero-art-wrap { position:relative; }
.myth-hero-art {
  border-radius:5px!important;
  border-color:rgba(var(--myth-violet-rgb),.24)!important;
  background:#07080c!important;
  transform:perspective(1100px) rotateX(var(--my,0deg)) rotateY(var(--mx,0deg));
}
.myth-hero-art::after {
  content:""!important;
  display:block!important;
  position:absolute;
  inset:0;
  pointer-events:none;
  border:0!important;
  border-radius:inherit;
  background:
    linear-gradient(90deg,transparent 49.8%,rgba(103,216,209,.13) 50%,transparent 50.2%),
    linear-gradient(0deg,transparent 73%,rgba(155,124,255,.13) 73.2%,transparent 73.4%),
    repeating-linear-gradient(90deg,transparent 0 79px,rgba(255,255,255,.025) 79px 80px)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)!important;
}
.myth-hero-image { filter:saturate(.82) contrast(1.04); }
.myth-image-tag { border-radius:2px!important; backdrop-filter:blur(5px); }
.myth-image-tag--top { border-color:rgba(103,216,209,.36)!important; color:#9be8e3!important; }
.myth-image-tag--bottom span { color:rgba(215,182,106,.78)!important; }
.myth-image-tag--bottom b { color:#cab9ff!important; }
.myth-hero-meter i { border-radius:0!important; }

.myth-blueprint-data {
  position:absolute;
  z-index:5;
  right:26px;
  bottom:24px;
  display:grid;
  gap:5px;
  padding:11px 13px;
  border-left:1px solid rgba(103,216,209,.45);
  background:rgba(5,7,10,.58);
  backdrop-filter:blur(7px);
  pointer-events:none;
}
.myth-blueprint-data span { color:rgba(226,221,238,.48); font-size:.45rem; font-weight:950; letter-spacing:.16em; }
.myth-blueprint-data b { color:#9ce6e1; font-size:.52rem; letter-spacing:.12em; }

/* New strip: physical thresholds rather than a list of mythologies. */
.myth-marquee { border-color:var(--infra-line)!important; background:#07080c!important; }
.myth-marquee-track { color:rgba(229,223,243,.46)!important; }
.myth-marquee-track span { color:rgba(229,223,243,.55)!important; }
.myth-marquee-track i { color:var(--myth-teal)!important; font-style:normal; }
[data-theme="light"] .myth-marquee { background:#e9e6ec!important; }

/* Archive masthead */
.myth-archive { width:min(1540px,100%)!important; }
.myth-section-head { align-items:stretch!important; padding-bottom:25px; border-bottom:1px solid var(--infra-line); }
.myth-showcase-index { -webkit-text-stroke-color:rgba(var(--myth-violet-rgb),.52)!important; }
.myth-section-head h2 { font-size:clamp(3rem,6vw,6.2rem)!important; }
.myth-range-status {
  min-width:245px;
  align-self:stretch;
  justify-content:flex-end;
  padding:0 0 3px 25px!important;
  border:0!important;
  border-left:1px solid var(--infra-line)!important;
  border-radius:0!important;
  background:transparent!important;
}

.myth-threshold-intro {
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:24px;
  align-items:end;
  margin:24px 0 0;
  padding:0 0 14px;
  border-bottom:1px solid var(--infra-line);
}
.myth-threshold-intro small { color:var(--myth-teal); font-size:.49rem; font-weight:1000; letter-spacing:.17em; }
.myth-threshold-intro p { max-width:760px; margin:0; color:var(--infra-text); font-size:.78rem; line-height:1.6; }

.myth-culture-axis {
  display:grid!important;
  grid-template-columns:repeat(10,minmax(112px,1fr))!important;
  gap:0!important;
  margin:0 0 0!important;
  padding:0!important;
  overflow:auto;
  border:0!important;
  border-bottom:1px solid var(--infra-line)!important;
  border-radius:0!important;
  background:transparent!important;
}
.myth-axis-node {
  min-width:112px!important;
  min-height:98px;
  display:grid;
  align-content:center;
  gap:4px;
  padding:13px 12px!important;
  border:0!important;
  border-right:1px solid var(--infra-line)!important;
  border-radius:0!important;
  background:transparent!important;
}
.myth-axis-node:last-child { border-right:0!important; }
.myth-axis-node:hover { transform:none!important; background:linear-gradient(180deg,rgba(var(--myth-violet-rgb),.07),transparent)!important; }
.myth-axis-node b { color:transparent!important; -webkit-text-stroke:1px rgba(var(--myth-violet-rgb),.62); font-size:1.35rem!important; line-height:1; }
.myth-axis-node strong { color:#d7ccf6; font-size:.62rem; letter-spacing:.11em; text-transform:uppercase; }
.myth-axis-node span { margin-top:0!important; color:rgba(230,222,250,.42); font-size:.42rem!important; letter-spacing:.11em!important; }
.myth-axis-node i { left:12px!important; right:auto!important; bottom:8px!important; width:28px; background:linear-gradient(90deg,var(--myth-teal),transparent)!important; }
[data-theme="light"] .myth-axis-node strong { color:#4f3e73; }
[data-theme="light"] .myth-axis-node span { color:rgba(49,40,67,.52); }

/* Site reports: one physical location per myth. */
.myth-grid { display:block!important; margin-top:0; }
.myth-site {
  --site-accent:var(--myth-violet);
  position:relative;
  display:grid!important;
  grid-template-columns:102px minmax(0,1.08fr) minmax(330px,.76fr);
  gap:clamp(18px,3vw,44px);
  min-height:300px;
  align-items:start;
  padding:31px 0 30px!important;
  overflow:hidden!important;
  border:0!important;
  border-bottom:1px solid var(--infra-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:0;
  transform:translateY(18px);
  transition:opacity .5s ease var(--myth-delay),transform .5s ease var(--myth-delay),background .24s ease!important;
}
.myth-site.is-visible { opacity:1; transform:translateY(0); }
.myth-site:hover { border-color:var(--infra-line)!important; box-shadow:none!important; background:linear-gradient(90deg,rgba(var(--myth-violet-rgb),.047),transparent 46%,rgba(var(--myth-teal-rgb),.018))!important; }
.myth-site::before {
  content:attr(data-threshold);
  position:absolute;
  right:0;
  top:18px;
  color:transparent;
  -webkit-text-stroke:1px rgba(var(--myth-violet-rgb),.07);
  font-size:clamp(4.8rem,10vw,10rem);
  font-weight:1000;
  line-height:.8;
  letter-spacing:-.08em;
  pointer-events:none;
}
.myth-site::after {
  content:"";
  position:absolute;
  left:102px;
  top:0;
  width:1px;
  height:31px;
  background:var(--myth-teal);
  opacity:.38;
}
.myth-site-index { display:grid; gap:8px; align-content:start; padding-top:2px; }
.myth-site-index b { color:transparent; -webkit-text-stroke:1px rgba(var(--myth-violet-rgb),.68); font-size:clamp(2.8rem,4.5vw,4.7rem); line-height:.76; letter-spacing:-.085em; }
.myth-site-index small { color:rgba(215,182,106,.62); font-size:.46rem; font-weight:1000; letter-spacing:.16em; }
.myth-site-main { position:relative; z-index:2; min-width:0; }
.myth-site-topline { display:flex; flex-wrap:wrap; align-items:center; gap:9px; color:rgba(226,216,255,.42); font-size:.49rem; font-weight:950; letter-spacing:.14em; }
.myth-site-topline i { width:30px; height:1px; background:linear-gradient(90deg,var(--myth-violet),transparent); }
.myth-site-topline b { color:#bfaeff; }
.myth-site-threshold { display:inline-flex; align-items:center; gap:8px; margin-top:14px; color:var(--myth-teal); font-size:.55rem; font-weight:1000; letter-spacing:.16em; }
.myth-site-threshold::before { content:"//"; color:rgba(215,182,106,.72); }
.myth-site-title { margin:8px 0 0!important; color:var(--myth-white)!important; font-size:clamp(2rem,3.3vw,3.45rem)!important; line-height:.9!important; letter-spacing:-.065em!important; text-transform:uppercase; }
.myth-site-description { max-width:780px; min-height:0!important; margin:17px 0 0!important; color:var(--infra-text)!important; font-size:.85rem!important; line-height:1.68!important; }
.myth-site-location {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  margin-top:22px;
  border:1px solid var(--infra-line);
  background:var(--infra-line);
}
.myth-site-location div { min-width:0; padding:10px 11px; background:#08090e; }
[data-theme="light"] .myth-site-location div { background:#efedf2; }
.myth-site-location small { display:block; color:rgba(226,216,255,.34); font-size:.42rem; font-weight:950; letter-spacing:.14em; }
.myth-site-location strong { display:block; margin-top:5px; overflow:hidden; color:#b9e8e4; font-size:.52rem; font-weight:950; letter-spacing:.08em; text-overflow:ellipsis; white-space:nowrap; }
[data-theme="light"] .myth-site-location strong { color:#356f72; }

.myth-site-tracks { position:relative; z-index:2; padding-top:3px; }
.myth-site-tracks-head { display:flex; align-items:center; gap:10px; padding-bottom:9px; border-bottom:1px solid var(--infra-line); color:rgba(226,216,255,.36); font-size:.45rem; font-weight:1000; letter-spacing:.16em; }
.myth-site-tracks-head i { flex:1; height:1px; background:linear-gradient(90deg,var(--infra-line),transparent); }
.myth-site .myth-track-list { margin:0!important; padding:0!important; border:0!important; }
.myth-site .myth-track-list li {
  min-height:38px;
  display:grid;
  grid-template-columns:30px 1fr;
  align-items:center;
  padding:0!important;
  border-bottom:1px solid var(--infra-line-soft)!important;
}
.myth-site .myth-track-list li:hover { padding-left:7px!important; background:linear-gradient(90deg,rgba(var(--myth-violet-rgb),.055),transparent)!important; }
.myth-site .myth-track-list li span { color:var(--myth-gold)!important; font-size:.5rem; }
.myth-site .myth-track-list li b { font-size:.72rem; font-weight:820; }
.myth-site-footer { display:flex; align-items:center; gap:8px; margin-top:13px; color:rgba(226,216,255,.30); font-size:.45rem; font-weight:950; letter-spacing:.14em; }
.myth-site-footer i { flex:1; height:1px; background:var(--infra-line); }
.myth-site-footer b { color:var(--myth-teal); }
.myth-milestone {
  position:static!important;
  display:inline-flex;
  width:max-content;
  margin-top:10px;
  padding:5px 7px!important;
  border:1px solid rgba(var(--myth-gold-rgb),.27)!important;
  background:rgba(var(--myth-gold-rgb),.045)!important;
  color:#d8bd7b!important;
}

/* Doctrine — manifesto, no orbit. */
.myth-doctrine {
  width:min(1540px,100%)!important;
  grid-template-columns:minmax(0,1.35fr) minmax(340px,.75fr)!important;
  gap:clamp(30px,5vw,70px)!important;
  margin-top:clamp(76px,10vw,140px)!important;
  padding:clamp(35px,5vw,64px) 0!important;
  overflow:visible!important;
  border:0!important;
  border-top:1px solid var(--infra-line)!important;
  border-bottom:1px solid var(--infra-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.myth-doctrine::after {
  content:"INFRASTRUCTURE"!important;
  right:0!important;
  bottom:-2%!important;
  color:transparent!important;
  -webkit-text-stroke:1px rgba(var(--myth-violet-rgb),.055)!important;
  font-size:clamp(5rem,12vw,12rem)!important;
  letter-spacing:-.08em!important;
}
.myth-doctrine-copy h2 { font-size:clamp(3.1rem,6.5vw,6.8rem)!important; }
.myth-doctrine-copy h2 em { color:var(--myth-teal)!important; }
.myth-doctrine-copy p { font-size:.9rem; }
.myth-doctrine-copy blockquote { border-left:2px solid var(--myth-violet)!important; border-radius:0!important; background:linear-gradient(90deg,rgba(var(--myth-violet-rgb),.065),transparent)!important; }
.myth-doctrine-list { gap:0!important; border-top:1px solid var(--infra-line); }
.myth-doctrine-list article { padding:18px 0!important; border:0!important; border-bottom:1px solid var(--infra-line)!important; border-radius:0!important; background:transparent!important; }

/* Black Grail ends in near-empty negative space, then a red HARDLINE door. */
.myth-closing {
  width:min(1540px,100%)!important;
  min-height:390px!important;
  grid-template-columns:190px minmax(0,1fr) minmax(230px,.35fr)!important;
  gap:clamp(25px,5vw,64px)!important;
  margin-top:0!important;
  padding:clamp(45px,7vw,92px) 0!important;
  border:0!important;
  border-bottom:1px solid var(--infra-line)!important;
  background:transparent!important;
}
.myth-closing-index { font-size:clamp(7rem,14vw,14rem)!important; -webkit-text-stroke-color:rgba(var(--myth-violet-rgb),.34)!important; }
.myth-closing h2 { font-size:clamp(3rem,6vw,6.7rem)!important; }
.myth-closing h2 em { color:var(--myth-gold)!important; }
.myth-closing-links { align-self:end; width:100%; }
.myth-back-link { width:100%; justify-content:space-between; border-radius:2px!important; }
.myth-back-link--hardline {
  position:relative;
  min-height:74px;
  align-items:center;
  border-color:rgba(255,49,56,.35)!important;
  color:#ff7378!important;
  background:linear-gradient(105deg,rgba(255,49,56,.11),transparent 68%);
}
.myth-back-link--hardline::after { content:"NEXT PRESSURE STATE"; position:absolute; left:14px; bottom:7px; color:rgba(255,115,120,.44); font-size:.40rem; font-weight:950; letter-spacing:.14em; }
.myth-back-link--hardline:hover { border-color:rgba(255,49,56,.72)!important; transform:translateX(4px)!important; }

@media (max-width:1120px) {
  .myth-site { grid-template-columns:82px minmax(0,1fr) minmax(290px,.72fr); }
  .myth-site::after { left:82px; }
  .myth-closing { grid-template-columns:140px 1fr!important; }
  .myth-closing-links { grid-column:2; }
}
@media (max-width:860px) {
  .myth-threshold-intro { grid-template-columns:1fr; gap:8px; }
  .myth-site { grid-template-columns:72px 1fr; }
  .myth-site::after { left:72px; }
  .myth-site-tracks { grid-column:2; }
  .myth-doctrine { grid-template-columns:1fr!important; }
  .myth-closing { grid-template-columns:1fr!important; }
  .myth-closing-index { font-size:8rem!important; }
  .myth-closing-links { grid-column:1; max-width:440px; }
}
@media (max-width:620px) {
  .myth-section-head { display:block!important; }
  .myth-range-status { margin-top:20px; padding:12px 0 0!important; border-left:0!important; border-top:1px solid var(--infra-line)!important; }
  .myth-site { grid-template-columns:1fr; padding:26px 0!important; }
  .myth-site::after { left:0; }
  .myth-site-index { display:flex; align-items:baseline; gap:10px; }
  .myth-site-index b { font-size:3.2rem; }
  .myth-site-main,.myth-site-tracks { grid-column:1; }
  .myth-site-location { grid-template-columns:1fr; }
  .myth-site-location strong { white-space:normal; }
  .myth-blueprint-data { right:18px; bottom:18px; }
}

/* readability pass after live render */
.myth-site .myth-track-list li b { color:rgba(239,235,247,.78)!important; }
.myth-site .myth-track-list li:hover b { color:#fff!important; }
[data-theme="light"] .myth-site .myth-track-list li b { color:#342b3c!important; }

/* Correct legacy light-theme selectors that leaked into dark mode in the old sheet. */
html:not([data-theme="light"]) .myth-range-status small { color:#9b82ef!important; }
html:not([data-theme="light"]) .myth-range-status strong { color:var(--myth-gold)!important; }
html:not([data-theme="light"]) .myth-range-status span { color:rgba(226,216,255,.38)!important; }
html:not([data-theme="light"]) .myth-axis-node span { color:rgba(226,216,255,.45)!important; }
html:not([data-theme="light"]) .myth-doctrine-copy blockquote strong { color:rgba(244,240,255,.82)!important; }
html:not([data-theme="light"]) .myth-doctrine-list span { color:#b9a8f1!important; }
html:not([data-theme="light"]) .myth-doctrine-list p { color:rgba(226,219,239,.58)!important; }
html:not([data-theme="light"]) .myth-closing h2 { color:var(--myth-white)!important; }
html:not([data-theme="light"]) .myth-closing p { color:rgba(226,219,239,.60)!important; }
html:not([data-theme="light"]) .myth-back-link:hover { color:#eee8ff!important; }
html:not([data-theme="light"]) .myth-footer .gr-footer-brand span,
html:not([data-theme="light"]) .myth-footer .gr-footer-brand strong,
html:not([data-theme="light"]) .myth-footer .gr-footer-note { color:rgba(238,233,246,.70)!important; }
html:not([data-theme="light"]) .myth-footer .gr-footer-signal span { color:#bba7ff!important; }

/* ==========================================================
   V4 // SOFT INFRASTRUCTURE
   Keep the urban-myth concept, restore premium rounded depth.
   ========================================================== */
.gr-mythic-body {
  --myth-radius-xl:32px;
  --myth-radius-lg:27px;
  --myth-radius-md:19px;
  --myth-radius-sm:14px;
  --infra-surface:rgba(14,13,22,.82);
  --infra-surface-raised:rgba(18,16,28,.94);
  --infra-surface-inset:rgba(255,255,255,.03);
  --infra-border:rgba(155,124,255,.14);
  --infra-shadow:0 22px 62px rgba(0,0,0,.24);
}
[data-theme="light"] .gr-mythic-body {
  --infra-line:rgba(72,52,120,.14);
  --infra-line-soft:rgba(72,52,120,.07);
  --infra-text:rgba(46,37,67,.72);
  --infra-surface:rgba(252,249,255,.88);
  --infra-surface-raised:rgba(255,253,255,.97);
  --infra-surface-inset:rgba(72,52,120,.035);
  --infra-border:rgba(72,52,120,.14);
  --infra-shadow:0 20px 58px rgba(58,41,88,.09);
  background:#f2eef6;
}
[data-theme="light"] .gr-mythic-body::before {
  background:
    linear-gradient(rgba(72,52,120,.028) 1px,transparent 1px),
    linear-gradient(90deg,rgba(72,52,120,.028) 1px,transparent 1px),
    radial-gradient(circle at 68% 9%,rgba(155,124,255,.07),transparent 27rem),
    radial-gradient(circle at 16% 42%,rgba(103,216,209,.035),transparent 24rem),
    #f2eef6;
  background-size:64px 64px,64px 64px,auto,auto,auto;
}

/* Hero: keep its identity, lose the hard dossier edges. */
.myth-hero {
  border-radius:var(--myth-radius-xl);
  box-shadow:0 34px 92px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.025);
}
.myth-kicker { border-radius:999px!important; }
.myth-actions .gr-btn { border-radius:15px!important; }
.myth-manifest {
  padding:15px 17px;
  overflow:hidden;
  border:1px solid rgba(var(--myth-violet-rgb),.15);
  border-left:3px solid var(--myth-violet);
  border-radius:17px;
  background:linear-gradient(110deg,rgba(var(--myth-violet-rgb),.085),rgba(var(--myth-gold-rgb),.025),rgba(255,255,255,.012));
}
.myth-stats {
  gap:8px!important;
  padding:7px;
  border:1px solid var(--infra-border)!important;
  border-radius:20px;
  background:rgba(255,255,255,.018);
}
.myth-stats div,
.myth-stats div+div {
  min-width:0!important;
  flex:1;
  padding:12px 14px!important;
  border:0!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.025)!important;
}
.myth-hero-art { border-radius:var(--myth-radius-lg)!important; }
.myth-image-tag { border-radius:12px!important; }
.myth-hero-meter i { border-radius:99px!important; }
.myth-blueprint-data {
  padding:11px 13px;
  border:1px solid rgba(103,216,209,.22);
  border-left:2px solid rgba(103,216,209,.52);
  border-radius:14px;
  background:rgba(5,7,10,.62);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}

/* Masthead / ten thresholds controls. */
.myth-range-status {
  min-width:245px;
  align-self:center;
  padding:15px 18px!important;
  border:1px solid var(--infra-border)!important;
  border-radius:var(--myth-radius-md)!important;
  background:var(--infra-surface)!important;
  box-shadow:var(--infra-shadow)!important;
}
.myth-threshold-intro {
  margin-top:22px;
  padding:14px 16px;
  border:1px solid var(--infra-line);
  border-radius:17px;
  background:rgba(255,255,255,.015);
}
.myth-culture-axis {
  gap:5px!important;
  margin-top:10px!important;
  padding:6px!important;
  border:1px solid var(--infra-border)!important;
  border-radius:22px!important;
  background:var(--infra-surface)!important;
  box-shadow:var(--infra-shadow);
}
.myth-axis-node {
  min-height:88px;
  padding:12px 11px!important;
  border:1px solid transparent!important;
  border-radius:14px!important;
}
.myth-axis-node:last-child { border-right:1px solid transparent!important; }
.myth-axis-node:hover,
.myth-axis-node:focus-visible {
  border-color:rgba(var(--myth-violet-rgb),.20)!important;
  background:rgba(var(--myth-violet-rgb),.055)!important;
}

/* Every site becomes a soft archival object, not a spreadsheet row. */
.myth-grid {
  display:grid!important;
  gap:16px!important;
  margin-top:16px!important;
}
.myth-site {
  grid-template-columns:92px minmax(0,1.15fr) minmax(320px,.78fr)!important;
  gap:clamp(18px,3vw,38px)!important;
  margin:0!important;
  padding:26px 24px!important;
  overflow:hidden!important;
  border:1px solid var(--infra-border)!important;
  border-radius:var(--myth-radius-lg)!important;
  background:
    radial-gradient(circle at 0 0,rgba(var(--myth-violet-rgb),.065),transparent 31%),
    linear-gradient(145deg,rgba(255,255,255,.025),transparent 55%),
    var(--infra-surface)!important;
  box-shadow:var(--infra-shadow)!important;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
}
.myth-site:hover {
  transform:translateY(-3px)!important;
  border-color:rgba(var(--myth-violet-rgb),.29)!important;
  box-shadow:0 28px 74px rgba(0,0,0,.29)!important;
}
.myth-site::before {
  right:16px;
  top:16px;
  font-size:clamp(4.3rem,8vw,8rem);
  -webkit-text-stroke-color:rgba(var(--myth-violet-rgb),.055);
}
.myth-site::after { display:none; }
.myth-site-index {
  width:72px;
  min-height:80px;
  padding:12px 10px;
  border:1px solid rgba(var(--myth-violet-rgb),.16);
  border-radius:17px;
  background:rgba(var(--myth-violet-rgb),.035);
}
.myth-site-index b { font-size:clamp(2.3rem,3.4vw,3.65rem); }
.myth-site-location {
  gap:6px;
  margin-top:20px;
  padding:0;
  border:0;
  background:transparent;
}
.myth-site-location div {
  padding:10px 11px;
  border:1px solid var(--infra-line-soft);
  border-radius:13px;
  background:var(--infra-surface-inset);
}
.myth-site-tracks {
  padding:13px 14px 12px;
  border:1px solid var(--infra-line-soft);
  border-radius:18px;
  background:var(--infra-surface-inset);
}
.myth-site .myth-track-list li {
  min-height:36px;
  padding:0 5px!important;
  border-radius:8px;
}
.myth-site .myth-track-list li:hover { padding-left:10px!important; }
.myth-milestone { border-radius:999px!important; }

/* Doctrine is still a manifesto, but now sits in a calm premium shell. */
.myth-doctrine {
  width:min(1540px,100%)!important;
  grid-template-columns:minmax(0,1.25fr) minmax(340px,.75fr)!important;
  gap:clamp(30px,5vw,64px)!important;
  margin-top:clamp(72px,9vw,122px)!important;
  padding:clamp(34px,5vw,58px)!important;
  overflow:hidden!important;
  border:1px solid var(--infra-border)!important;
  border-radius:var(--myth-radius-xl)!important;
  background:
    radial-gradient(circle at 10% 15%,rgba(var(--myth-violet-rgb),.07),transparent 30%),
    radial-gradient(circle at 90% 85%,rgba(var(--myth-teal-rgb),.035),transparent 24%),
    var(--infra-surface)!important;
  box-shadow:var(--infra-shadow)!important;
}
.myth-doctrine-copy blockquote {
  padding:15px 17px!important;
  border:1px solid rgba(var(--myth-violet-rgb),.13)!important;
  border-left:3px solid var(--myth-violet)!important;
  border-radius:16px!important;
  background:linear-gradient(90deg,rgba(var(--myth-violet-rgb),.07),transparent)!important;
}
.myth-doctrine-list {
  display:grid!important;
  gap:9px!important;
  align-content:center;
  border-top:0!important;
}
.myth-doctrine-list article {
  padding:17px 18px!important;
  border:1px solid var(--infra-line)!important;
  border-radius:17px!important;
  background:rgba(255,255,255,.018)!important;
}

/* Black Grail: strong ending, no harsh rectangular void. */
.myth-closing {
  width:min(1540px,100%)!important;
  min-height:390px!important;
  grid-template-columns:170px minmax(0,1fr) minmax(240px,.36fr)!important;
  gap:clamp(26px,5vw,60px)!important;
  margin-top:22px!important;
  padding:clamp(38px,5.5vw,66px)!important;
  overflow:hidden;
  border:1px solid var(--infra-border)!important;
  border-radius:var(--myth-radius-xl)!important;
  background:
    radial-gradient(circle at 7% 75%,rgba(var(--myth-violet-rgb),.075),transparent 28%),
    radial-gradient(circle at 78% 38%,rgba(var(--myth-gold-rgb),.04),transparent 26%),
    var(--infra-surface)!important;
  box-shadow:var(--infra-shadow);
}
.myth-back-link {
  border-radius:16px!important;
  background:rgba(255,255,255,.02);
}
.myth-back-link--hardline {
  border-radius:18px!important;
  background:linear-gradient(105deg,rgba(255,49,56,.11),rgba(255,49,56,.025) 58%,transparent 78%);
}

/* Light mode is designed, not inverted. */
[data-theme="light"] .myth-hero {
  border-color:rgba(72,52,120,.13);
  background:linear-gradient(110deg,#fdfaff,#f3eef7 52%,#fbf8f5);
  box-shadow:0 26px 72px rgba(58,41,88,.10), inset 0 1px 0 rgba(255,255,255,.9);
}
[data-theme="light"] .myth-overline,
[data-theme="light"] .myth-era-line { color:#665875!important; }
[data-theme="light"] .myth-kicker { color:#6949b7!important; background:rgba(105,73,183,.055)!important; }
[data-theme="light"] .myth-stats { background:rgba(255,255,255,.52); }
[data-theme="light"] .myth-stats div { background:rgba(255,255,255,.72)!important; }
[data-theme="light"] .myth-blueprint-data {
  border-color:rgba(53,123,123,.19);
  border-left-color:rgba(53,123,123,.52);
  background:rgba(255,255,255,.80);
  box-shadow:0 12px 34px rgba(58,41,88,.08);
}
[data-theme="light"] .myth-blueprint-data span { color:#665875; }
[data-theme="light"] .myth-blueprint-data b { color:#2f7373; }
[data-theme="light"] .myth-marquee { background:#eee9f2!important; }
[data-theme="light"] .myth-marquee-track,
[data-theme="light"] .myth-marquee-track span { color:rgba(51,40,70,.56)!important; }
[data-theme="light"] .myth-range-status,
[data-theme="light"] .myth-culture-axis,
[data-theme="light"] .myth-doctrine,
[data-theme="light"] .myth-closing {
  border-color:rgba(72,52,120,.13)!important;
  background:rgba(255,252,255,.92)!important;
  box-shadow:0 20px 58px rgba(58,41,88,.08)!important;
}
[data-theme="light"] .myth-threshold-intro {
  border-color:rgba(72,52,120,.12);
  background:rgba(255,252,255,.64);
}
[data-theme="light"] .myth-range-status small { color:#7153bc!important; }
[data-theme="light"] .myth-range-status strong { color:#aa7d22!important; }
[data-theme="light"] .myth-range-status span { color:#65586d!important; }
[data-theme="light"] .myth-axis-node strong { color:#4b3d57!important; }
[data-theme="light"] .myth-axis-node span { color:#705c82!important; }
[data-theme="light"] .myth-axis-node:hover,
[data-theme="light"] .myth-axis-node:focus-visible { background:rgba(105,73,183,.065)!important; }
[data-theme="light"] .myth-site {
  border-color:rgba(72,52,120,.115)!important;
  background:
    radial-gradient(circle at 0 0,rgba(var(--myth-violet-rgb),.06),transparent 31%),
    linear-gradient(145deg,rgba(255,255,255,.90),rgba(255,255,255,.48)),
    #faf7fb!important;
  box-shadow:0 18px 50px rgba(58,41,88,.075)!important;
}
[data-theme="light"] .myth-site:hover {
  border-color:rgba(105,73,183,.24)!important;
  box-shadow:0 26px 62px rgba(58,41,88,.105)!important;
}
[data-theme="light"] .myth-site-index { background:rgba(105,73,183,.055); }
[data-theme="light"] .myth-site-topline { color:#75687d; }
[data-theme="light"] .myth-site-topline b { color:#6848b6; }
[data-theme="light"] .myth-site-title { color:#21172b!important; }
[data-theme="light"] .myth-site-description { color:#5e5268!important; }
[data-theme="light"] .myth-site-location div,
[data-theme="light"] .myth-site-tracks { background:rgba(72,52,120,.032); border-color:rgba(72,52,120,.08); }
[data-theme="light"] .myth-site-location small { color:#786a80; }
[data-theme="light"] .myth-site-location strong { color:#356f72; }
[data-theme="light"] .myth-site-tracks-head { color:#74677d; }
[data-theme="light"] .myth-site .myth-track-list li b { color:#302737!important; }
[data-theme="light"] .myth-site .myth-track-list li:hover b { color:#17121b!important; }
[data-theme="light"] .myth-site-footer { color:#786a80; }
[data-theme="light"] .myth-doctrine-copy h2 { color:#21172b!important; }
[data-theme="light"] .myth-doctrine-copy h2 em { color:#318f8b!important; }
[data-theme="light"] .myth-doctrine-copy p { color:#5a4e64!important; }
[data-theme="light"] .myth-doctrine-list article { background:rgba(72,52,120,.028)!important; }
[data-theme="light"] .myth-doctrine-list p { color:#5e5268!important; }
[data-theme="light"] .myth-closing h2 { color:#21172a!important; }
[data-theme="light"] .myth-closing p { color:#5a4d61!important; }
[data-theme="light"] .myth-back-link { background:rgba(72,52,120,.025)!important; }

@media (max-width:1120px) {
  .myth-site { grid-template-columns:76px minmax(0,1fr) minmax(280px,.72fr)!important; }
  .myth-site-index { width:64px; }
  .myth-closing { grid-template-columns:135px 1fr!important; }
}
@media (max-width:860px) {
  .myth-site { grid-template-columns:68px 1fr!important; }
  .myth-site-index { width:60px; }
  .myth-doctrine { grid-template-columns:1fr!important; }
  .myth-closing { grid-template-columns:1fr!important; }
}
@media (max-width:620px) {
  .myth-range-status { margin-top:18px; padding:13px 14px!important; border:1px solid var(--infra-border)!important; border-radius:16px!important; }
  .myth-threshold-intro { grid-template-columns:1fr; gap:8px; padding:13px 14px; }
  .myth-culture-axis { border-radius:18px!important; }
  .myth-site { grid-template-columns:1fr!important; padding:20px!important; border-radius:22px!important; }
  .myth-site-index { width:auto; min-height:0; display:flex; align-items:baseline; gap:10px; padding:9px 11px; border-radius:14px; }
  .myth-site-location { grid-template-columns:1fr; }
  .myth-site-tracks { border-radius:16px; }
  .myth-doctrine { padding:26px 20px!important; border-radius:24px!important; }
  .myth-closing { padding:28px 20px!important; border-radius:24px!important; }
  .myth-back-link { border-radius:14px!important; }
}

/* ==========================================================
   V5 // RHYTHM + RESPONSIVE SITE CARD FIX
   Remove the accidental double vertical offset after the marquee,
   keep the marquee alive on touch devices, and size site reports
   for the actual two-up card width.
   ========================================================== */
.myth-archive {
  padding-top: 0 !important;
  margin-top: clamp(34px,4.6vw,56px) !important;
}
.myth-marquee { margin-bottom: 0 !important; }

/* Cards are two-up on desktop, so their internal content must stack
   rather than pretending each card has full-page width. */
.myth-site {
  grid-template-columns: 72px minmax(0,1fr) !important;
  grid-auto-rows: auto;
  gap: 14px 18px !important;
  min-height: 0 !important;
  align-content: start;
  padding: 22px !important;
}
.myth-site-index {
  width: 62px;
  min-height: 72px;
  padding: 10px 8px;
}
.myth-site-main {
  grid-column: 2;
  min-width: 0;
}
.myth-site-title {
  max-width: none;
  font-size: clamp(2rem,2.7vw,2.85rem) !important;
  line-height: .92 !important;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.myth-site-description {
  max-width: none;
  margin-top: 14px !important;
  font-size: .82rem !important;
  line-height: 1.62 !important;
}
.myth-site-location {
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 6px;
  margin-top: 17px;
}
.myth-site-location div { min-width: 0; }
.myth-site-location strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  line-height: 1.28;
  overflow-wrap: anywhere;
}
.myth-site-tracks {
  grid-column: 1 / -1 !important;
  width: 100%;
  min-width: 0;
  margin-top: 2px;
}
.myth-site-tracks-head > span {
  min-width: 0;
  white-space: normal;
}

/* Base mythic.css deliberately disables animation on coarse pointers.
   Keep accessibility opt-out, but phones/tablets should animate normally. */
@media (pointer: coarse) and (prefers-reduced-motion: no-preference) {
  .myth-marquee-track {
    animation: mythMarquee 40s linear infinite !important;
    will-change: transform;
  }
}
@media (prefers-reduced-motion: reduce) {
  .myth-marquee-track { animation: none !important; }
}

@media (max-width:860px) {
  .myth-site {
    grid-template-columns: 66px minmax(0,1fr) !important;
  }
  .myth-site-index { width: 58px; }
  .myth-site-tracks { grid-column: 1 / -1 !important; }
}
@media (max-width:720px) {
  .myth-archive { margin-top: 26px !important; }
  .myth-marquee { margin-bottom: 0 !important; }
}
@media (max-width:620px) {
  .myth-site {
    grid-template-columns: 1fr !important;
    gap: 13px !important;
    padding: 18px !important;
  }
  .myth-site-index,
  .myth-site-main,
  .myth-site-tracks { grid-column: 1 !important; }
  .myth-site-index {
    width: auto;
    min-height: 0;
  }
  .myth-site-title {
    font-size: clamp(1.95rem,10vw,2.65rem) !important;
  }
  .myth-site-location {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}
@media (max-width:430px) {
  .myth-site-location { grid-template-columns: 1fr; }
}

/* ==========================================================
   V8 // MOBILE MASTHEAD + HEADER FIT
   The 06 marker and the brand stop consuming content columns on
   narrow screens. Mobile gets a deliberate composition, not a
   compressed desktop one.
   ========================================================== */
@media (max-width: 620px) {
  /* Archive masthead: 06 is decorative, copy owns the full width. */
  .myth-section-head {
    position: relative;
    display: block !important;
    padding: 18px 0 20px !important;
    overflow: visible;
  }

  .myth-section-head .gr-showcase-title-wrap {
    position: relative;
    display: block !important;
    min-width: 0;
    width: 100%;
    padding-top: 52px;
  }

  .myth-section-head .gr-showcase-title-wrap > div {
    position: relative;
    z-index: 2;
    width: 100%;
    min-width: 0;
  }

  .myth-section-head .myth-showcase-index {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    font-size: 4.6rem !important;
    line-height: .72;
    letter-spacing: -.09em;
    opacity: .46;
    pointer-events: none;
  }

  .myth-section-head .myth-kicker {
    max-width: 100%;
    min-height: 0;
    padding: 7px 11px !important;
    white-space: normal;
    line-height: 1.25;
  }

  .myth-section-head h2 {
    width: 100%;
    max-width: none;
    margin-top: 13px !important;
    font-size: clamp(2.75rem, 13vw, 3.65rem) !important;
    line-height: .88 !important;
    letter-spacing: -.07em !important;
    text-wrap: balance;
    overflow-wrap: normal;
  }

  .myth-section-head p {
    width: 100%;
    max-width: none;
    margin-top: 15px !important;
    font-size: .9rem;
    line-height: 1.6;
  }

  /* Header brand: keep GloRave legible without crushing EN/RU + theme. */
  .myth-header .gr-archive-header-inner {
    min-height: 56px;
    gap: 8px;
  }

  .myth-header .myth-logo {
    flex: 1 1 auto;
    min-width: 0;
    gap: 8px;
    margin-right: 0;
  }

  .myth-header .myth-logo > span:last-child {
    min-width: 0;
  }

  .myth-header .myth-logo .gr-archive-logo-mark {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 10px;
    font-size: .62rem;
  }

  .myth-header .myth-logo strong {
    display: block;
    max-width: 88px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem;
    line-height: 1;
    letter-spacing: -.04em;
  }

  .myth-header .myth-logo small {
    display: none !important;
  }

  .myth-header .language-toggle {
    flex: 0 0 auto;
    margin-left: 0;
    padding: 3px;
  }

  .myth-header .lang-btn {
    min-width: 31px;
    height: 29px;
    padding: 0 6px;
    font-size: .68rem;
  }

  .myth-header .theme-toggle {
    width: 34px;
    height: 34px;
    border-radius: 11px;
  }
}

@media (max-width: 390px) {
  .myth-header .gr-archive-container {
    width: min(100% - 16px, 1180px);
  }

  .myth-header .gr-archive-header-inner {
    gap: 6px;
  }

  .myth-header .myth-logo {
    gap: 7px;
  }

  .myth-header .myth-logo .gr-archive-logo-mark {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .myth-header .myth-logo strong {
    max-width: 72px;
    font-size: .94rem;
  }

  .myth-header .lang-btn {
    min-width: 29px;
    height: 28px;
    padding: 0 5px;
  }

  .myth-header .theme-toggle {
    width: 32px;
    height: 32px;
  }

  .myth-section-head .gr-showcase-title-wrap {
    padding-top: 48px;
  }

  .myth-section-head .myth-showcase-index {
    font-size: 4.25rem !important;
  }

  .myth-section-head h2 {
    font-size: clamp(2.5rem, 12.7vw, 3.15rem) !important;
  }
}

/* ==========================================================
   V13 // MYTH MOBILE HERO — ROOT LAYOUT FIX
   1) Prevent min-content from widening the one-column grid.
   2) Isolate MYTH art from the shared 01–50 mobile "era dock"
      rule in archive.css (fixed height + reserved lower inset).
   3) Keep all hero copy, stats and image overlays inside the
      actual mobile card width.
   ========================================================== */
@media (max-width: 760px) {
  .myth-hero {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .myth-hero-copy,
  .myth-hero-art-wrap,
  .myth-actions,
  .myth-stats,
  .myth-manifest,
  .myth-lead {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .myth-hero-copy > * {
    min-width: 0;
    max-width: 100%;
  }

  .myth-lead,
  .myth-manifest > span,
  .myth-manifest strong,
  .myth-manifest p {
    overflow-wrap: break-word;
    word-break: normal;
  }

  .myth-stats {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .myth-stats div,
  .myth-stats div + div {
    min-width: 0 !important;
    width: auto !important;
    padding: 11px 9px !important;
  }

  .myth-stats span {
    overflow-wrap: anywhere;
  }

  /* archive.css reserves a mobile dock in every .gr-archive-hero-art.
     MYTH has no such dock, so explicitly restore its own art geometry. */
  .myth-hero-art,
  [data-theme="light"] .myth-hero-art {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 16 / 10 !important;
    padding: 9px !important;
    overflow: hidden !important;
  }

  .myth-hero-art::before,
  [data-theme="light"] .myth-hero-art::before {
    inset: 9px !important;
    border-radius: 10px !important;
  }

  .myth-hero-image {
    top: 9px !important;
    right: 9px !important;
    bottom: 9px !important;
    left: 9px !important;
    width: calc(100% - 18px) !important;
    height: calc(100% - 18px) !important;
  }

  /* Overlay labels must shrink WITH the image instead of contributing
     a larger min-content width to the grid. */
  .myth-image-tag,
  .myth-blueprint-data {
    box-sizing: border-box;
    min-width: 0 !important;
    width: auto !important;
  }

  .myth-image-tag--top {
    top: 14px !important;
    right: 14px !important;
    left: auto !important;
    max-width: calc(100% - 28px) !important;
    padding: 6px 8px !important;
    font-size: .42rem !important;
    line-height: 1.1 !important;
    letter-spacing: .10em !important;
    white-space: nowrap;
  }

  .myth-image-tag--bottom {
    left: 14px !important;
    right: auto !important;
    bottom: 14px !important;
    max-width: 104px !important;
    padding: 5px 7px !important;
    font-size: .39rem !important;
    line-height: 1.1 !important;
    letter-spacing: .08em !important;
    white-space: nowrap;
  }

  .myth-blueprint-data {
    left: auto !important;
    right: 14px !important;
    bottom: 14px !important;
    max-width: calc(100% - 132px) !important;
    padding: 7px 8px !important;
    gap: 3px !important;
  }

  .myth-blueprint-data span,
  .myth-blueprint-data b {
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .myth-blueprint-data span {
    font-size: .34rem !important;
    line-height: 1.12 !important;
    letter-spacing: .09em !important;
  }

  .myth-blueprint-data b {
    font-size: .40rem !important;
    line-height: 1.16 !important;
    letter-spacing: .055em !important;
  }
}

@media (max-width: 390px) {
  .myth-image-tag--top { font-size: .39rem !important; }
  .myth-image-tag--bottom {
    max-width: 94px !important;
    font-size: .36rem !important;
  }
  .myth-blueprint-data { max-width: calc(100% - 118px) !important; }
  .myth-blueprint-data span { font-size: .31rem !important; }
  .myth-blueprint-data b { font-size: .37rem !important; }
}