/* ==========================================================================
   TORANA — additive reskin layer for the lostcodex theme.
   Loaded AFTER style.css / woocommerce.css / mobile.css.
   Colour + parchment work is done in style.css by torana_transform.py; this
   file carries the things a colour shift cannot express: the type system,
   the seams between sections, ornament restraint, and the hero.
   Remove the wp_enqueue_style('lostcodex-torana', ...) line to revert.
   ========================================================================== */

/* ===== self-hosted faces (replaces 4 Google Fonts round-trips) ===== */
@font-face{font-family:'Marcellus';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Marcellus';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Marcellus SC';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-sc-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Marcellus SC';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/marcellus-sc-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/inter-var-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/inter-var-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ebgaramond-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'EB Garamond';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/ebgaramond-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/ebgaramond-400-italic-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'EB Garamond';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/ebgaramond-400-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* ===== aliases: retired families keep rendering, no markup edits ===== */
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Cinzel Decorative';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-sc-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Cinzel Decorative';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-sc-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'MedievalSharp';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'MedievalSharp';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'UnifrakturMaguntia';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'UnifrakturMaguntia';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IM Fell English';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IM Fell English';font-style:normal;font-weight:400 900;font-display:swap;src:url(fonts/marcellus-400-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'IM Fell English';font-style:italic;font-weight:400 900;font-display:swap;src:url(fonts/ebgaramond-400-italic-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'IM Fell English';font-style:italic;font-weight:400 900;font-display:swap;src:url(fonts/ebgaramond-400-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}


/* ---------------------------------------------------------------- tokens -- */
:root{
  --cinnabar:#D9503C;
  --jade:#5FB39A;
  --saffron:#F0A93B;
  --peri:#7C86B0;
  --line:rgba(201,162,75,.16);
  --line-soft:rgba(201,162,75,.09);
  --ease:cubic-bezier(.22,.68,.24,1);
  /* --arcane is the site-wide "status / available / version" accent (13 uses).
     Ice-blue fought the warm ground; verdigris-on-bronze is the temple-correct
     complement. Shiva keeps his own --shiva-lit, so his identity is untouched. */
  --arcane:#6FC0A4;
  /* the motif: a lotus / torana arch, one shape at every scale */
  --arch:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 V44 C0,22 16,11 34,6 C44,3.4 47,1.6 50,0 C53,1.6 56,3.4 66,6 C84,11 100,22 100,44 V100 Z' fill='%23fff'/%3E%3C/svg%3E");
}


/* LIVE BUG (pre-existing): woocommerce.css uses var(--navy-line) 13 times but the
   variable is declared nowhere, so `border:1px solid var(--navy-line)` is invalid
   at computed-value time and the border falls back to currentColor — light sand
   boxes around the My Account panels, order tables, checkout payment box and the
   login tabs. Declaring it fixes all 13 at once. */
:root{ --navy-line:rgba(201,162,75,.18); }

/* ------------------------------------------------------------ typography -- */
body{
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-size:16px; font-weight:350; line-height:1.72;
  letter-spacing:0;
}
h1,h2,h3,h4,h5,.display{font-family:'Marcellus',Georgia,serif;font-weight:400}
/* long-form copy was set in a serif at wide tracking — hand it to Inter */
p,li,td,dd,figcaption,blockquote,.lede,.sub,.desc{letter-spacing:0}
p,li,td,dd{font-family:'Inter',system-ui,sans-serif}
em,i,blockquote{font-family:'EB Garamond',Georgia,serif}
/* small-caps labels keep their voice but stop shouting */
.kicker,.eyebrow,.sec-kicker,.role,.domain,.sub,.paths-lbl,.lbl,
.scroll-head .v,.patch .date .m,.pl-kicker{
  font-family:'Marcellus SC',Georgia,serif;letter-spacing:.18em;
}
/* nothing in running text should track above .1em */
p,li,.lede,.desc,.pdesc,.a,.art-body{letter-spacing:.005em !important}

/* --------------------------------------------------------------- buttons -- */
.btn,.btn-gold,.btn-ghost,.w3-btn,.w3-btn-war{
  font-family:'Inter',system-ui,sans-serif;font-weight:600;letter-spacing:.11em;
  border-radius:2px;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease);
}
.btn:hover,.btn-gold:hover,.btn-ghost:hover,.w3-btn:hover{transform:translateY(-2px)}

/* ----------------------------------------------------------------- seams -- */
/* one continuous ground: no 3px gold bands slicing the page into slabs */
.hero,.war,.w3-war,.download,.xstrip,.install,.herald,
.page-intro,.chronicle,.chronicle-intro,.qintro,.qhelp,.lg-intro,.ping-band{
  border-top-width:0 !important;border-bottom-width:0 !important;
}
/* the subpage intro bands butt straight into the body — fade them instead */
.page-intro,.chronicle-intro,.qintro,.lg-intro{position:relative}
.page-intro::after,.chronicle-intro::after,.qintro::after,.lg-intro::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:150px;pointer-events:none;
  background:linear-gradient(180deg,transparent,var(--ink));
}
/* sections stop declaring their own navy washes — the body ground shows through */
.herald,.atlas,.tribes{background:transparent !important}
.hero-fade{height:220px;background:linear-gradient(180deg,transparent,var(--ink)) !important}
/* full-bleed image bands dissolve into the ground instead of butting against it */
.w3-war::before,.war::before,.download::before,.install::before,.xstrip::before{
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);
}

/* ------------------------------------------------------------------ hero -- */
.hero{min-height:92vh}
.hero-bg{
  background-image:url('realms/jina.jpg') !important;
  background-position:center 44% !important;
  animation:torana-kb 34s ease-in-out infinite alternate !important;
}
@keyframes torana-kb{
  from{transform:scale(1.06) translate3d(0,0,0)}
  to{transform:scale(1.16) translate3d(-1.4%,-1.6%,0)}
}
.hero-overlay{
  background:
    linear-gradient(180deg,rgba(10,8,7,.86) 0%,rgba(10,8,7,.40) 26%,rgba(10,8,7,.54) 58%,rgba(10,8,7,.93) 88%,var(--ink) 100%),
    radial-gradient(760px 520px at 50% 46%,transparent 0%,rgba(10,8,7,.5) 78%) !important;
}
.hero-vignette{opacity:.5}
.hero-logo{max-width:min(430px,72vw);filter:drop-shadow(0 18px 44px rgba(0,0,0,.85))}
.embers .ember{opacity:.42 !important}
/* the platform line was grey-on-art and collided with the scroll cue */
.platforms{
  gap:10px !important;font-family:'Inter',system-ui,sans-serif !important;
  font-size:11px !important;letter-spacing:.09em !important;color:var(--parch-3) !important;
  margin-top:6px;
}
.platforms span{
  padding:7px 15px;border-radius:100px;
  border:1px solid var(--line-soft);background:rgba(10,8,7,.46);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:border-color .35s var(--ease),color .35s var(--ease);
}
.platforms span:hover{border-color:var(--line);color:var(--parch-2) !important}
.platforms b{color:var(--parch) !important;font-weight:600 !important}
.scrollcue{display:none !important}

/* the war band's own art is bright sandstone — sit the copy on real contrast */
.w3-war-overlay,.war-overlay{
  background:
    radial-gradient(ellipse 80% 70% at 50% 30%, rgba(30,14,11,.42), rgba(10,8,7,.90) 78%),
    linear-gradient(180deg, var(--ink) 0%, rgba(16,12,11,.72) 26%, rgba(13,10,9,.82) 62%, var(--ink) 100%) !important;
  box-shadow:inset 0 0 240px 70px rgba(0,0,0,.8) !important;
}

/* ------------------------------------------------------- ornament restraint */
/* the maroon corner diamonds and rivet studs sat on every single panel;
   removing them is what turns the page from busy into composed */
.diamond-rivet,.rivet,.corner,.z-corner{display:none !important}

/* triple-bevelled forged frames -> one brass hairline + real depth */
.forge-frame,.gold-edge,.gildframe,.parchment.gildframe{
  border:1px solid var(--line) !important;
  border-radius:3px !important;
  box-shadow:0 24px 60px -34px rgba(0,0,0,.95) !important;
}
.forge-frame{
  /* DO NOT force background-blend-mode here. .forge-frame layers grey feTurbulence
     noise OVER a dark gradient and relies on `overlay` to multiply it down; forcing
     `normal` paints the grey at full strength and the panel turns light taupe.
     Verified in a real browser on /leveling-guide/ and /quest-guide/. */
  background-color:#17120F !important;
}
/* wax seals / roman medallions: keep them, quieten the bevel */
.scroll-head .wax,.plaque .pin,.vblock .node{box-shadow:0 2px 10px rgba(0,0,0,.5) !important}
.scroll-head{border-bottom:1px solid var(--line) !important}
.scroll-head h3{color:var(--parch) !important;font-family:'Marcellus',Georgia,serif !important}
/* gold rules become hairlines */
.gold-rule,.art-rule{
  height:1px !important;
  background:linear-gradient(90deg,transparent,var(--line),transparent) !important;
}

/* ------------------------------------------------------------------- nav -- */
.nav{
  background:rgba(10,8,7,.82) !important;
  -webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15);
  border-bottom:1px solid var(--line-soft) !important;
  box-shadow:none !important;
}
.nav-crest .ttl{font-family:'Marcellus',Georgia,serif !important;font-weight:400 !important}
.nav-crest .sub{font-family:'Marcellus SC',Georgia,serif !important}
nav.links > a,.nav-drop-t,.nav-cta .login{
  font-family:'Inter',system-ui,sans-serif !important;
  font-weight:500 !important;letter-spacing:.08em !important;font-size:12.5px !important;
  transition:color .3s var(--ease);
}
.war-link{color:var(--cinnabar) !important}
.nav-drop-m{
  background:rgba(16,12,11,.96) !important;
  border:1px solid var(--line-soft) !important;
  box-shadow:0 22px 50px -22px #000 !important;
}
.nav-drop-m a{font-family:'Inter',system-ui,sans-serif !important;letter-spacing:.05em !important}
.nav-new{color:var(--jade) !important;border-color:rgba(95,179,154,.4) !important;background:transparent !important}
/* the early-access badge borrowed the old ice-blue ring */
.ea-badge{border-color:rgba(111,192,164,.34) !important;background:rgba(10,8,7,.5) !important}

/* ---------------------------------------------------------------- panels -- */
/* one card language: hairline + lift, no bevels */
.parchment,.codex-page,.faq-parch,.qtype-card,.issue-card,.bug-list,
.tos-doc,.bind-scroll,.ev-rail,.lg-marginalia,.feat-parch{
  border:1px solid var(--line-soft);
  border-radius:3px;
  box-shadow:0 24px 60px -34px rgba(0,0,0,.95);
  transition:border-color .4s var(--ease);
}
.parchment:hover,.codex-page:hover{border-color:var(--line)}
/* the binding spine down the left edge of each tome leaf -> a brass rule */
.codex-page::before,.faq-parch::before,.qtype-card::before,
.issue-card::before,.bug-list::before,.tos-doc::before{
  width:2px !important;
  background:linear-gradient(180deg,transparent,var(--line) 12%,rgba(201,162,75,.5),var(--line) 88%,transparent) !important;
  box-shadow:none !important;
}

/* --------------------------------------------------------- atlas + media -- */
/* realm thumbnails were dimmed to mud; the art is the product */
.pl-card img,.pl-shot img,.pl-card .pl-img img{
  filter:none !important;
  transition:transform 1.1s var(--ease);
}
.pl-card:hover img{transform:scale(1.05)}
.pl-card,.pl-tile{
  overflow:hidden;
  border:1px solid var(--line-soft) !important;
  border-radius:3px !important;
  box-shadow:0 18px 44px -28px rgba(0,0,0,.9) !important;
  transition:transform .4s var(--ease),border-color .4s var(--ease);
}
.pl-card:hover{transform:translateY(-3px);border-color:var(--line) !important}

/* --------------------------------------------------------------- medallions */
.medallion .ring{filter:saturate(.85)}
.medallion .glow{opacity:.55}

/* ------------------------------------------------------------------ misc -- */
.ptag,.tag,.pill,.nav-new,.ec-status{border-radius:2px}
.sticky-play{border-radius:2px}
::selection{background:rgba(201,162,75,.28);color:var(--parch)}
:focus-visible{outline:2px solid var(--saffron);outline-offset:2px}


/* leveling-guide map chips: keep the per-tier ring (it encodes the level band)
   but drop the coloured bloom — the cold tiers were washing the warm page */
.lg-gem{
  box-shadow:0 0 0 1px #16120f,0 0 0 2px var(--gem,#C9A24B),0 5px 14px rgba(0,0,0,.6) !important;
}
.lg-row:hover .lg-gem{
  box-shadow:0 0 0 1px #16120f,0 0 0 2px var(--gold),0 8px 20px rgba(0,0,0,.66) !important;
}


/* WCAG: the maroon family reads 2.6-4.0:1 on the new dark panels — it was drawn
   for cream. Every place it is used as TEXT gets a lifted cinnabar (5.9-6.5:1).
   Backgrounds keep the deep maroon, so the drop-caps and plaques are unchanged. */
.scroll-head h3,.patch .date .d,.patch .body h4 a:hover,.read-chronicle,
.faq-parch .q .qm,.faq-parch .a em,.ev-rail .rail-head h3,.ev-row .er-date .d,
.decree-note b,.vhead .vno,.cgroup li b,.feat-parch .feat-head h2,.feat-parch p em,
.feat-note b,.issue-card .ic-link,.bind-close .bc-links a,.tos-binding .bh,
.tos-binding li svg,.article .art-body a,.article .art-body strong,
.lg-marginalia h3,.tos-preamble p.dropcap a,.tos-contents .toc-head svg,
.tos-contents .toc-head .toc-ttl,.tos-contents ol li a:hover{
  color:#E87A5E !important;
}
.scroll-head h3,.feat-parch .feat-head h2,.ev-rail .rail-head h3,.lg-marginalia h3{
  color:var(--parch) !important;   /* section heads read as headings, not accents */
}


/* the tribe cards' MALE/FEMALE tags sat at #8a6a26 — 3.7:1 at 11px */
.ctribe .name span{color:var(--gold) !important;letter-spacing:.14em}


/* ==========================================================================
   Defects found by the post-deploy sweep and confirmed in a real browser.
   Provenance is noted per fix: (reskin) = introduced here, (pre-existing) = older.
   ========================================================================== */

/* (pre-existing) The Guide dropdown is the only top-level nav item containing a
   space, and it never got white-space:nowrap — the caret wraps to a second line
   on every page. Reclaiming 2px of padding stops nav.links shrinking at all. */
.nav-drop-t{white-space:nowrap !important}
nav.links a{padding:9px 10px}

/* (pre-existing) A quest-guide rule `.steps{display:grid;repeat(4,1fr)}` later in
   the file hijacks the downloads page's numbered install list. Scope it back. */
.install-card .steps{display:block !important}
.install-card .steps li{padding:0 0 18px 44px}

/* (reskin) .hero-fade was lengthened to 220px and swallowed the platform strip. */
.hero-fade{height:150px !important}
.hero-content{position:relative;z-index:5}
.platforms span{position:relative;z-index:6}

/* (reskin) .social-band kept its hard 3px gold band — same seam removed elsewhere */
.social-band,.soc-band{border-top-width:0 !important;border-bottom-width:0 !important}
/* (pre-existing) the social handles are long unbroken strings that overrun the
   240px card. Break the STRING — do NOT put min-width:0 on .soc-card itself, it
   carries min-width:210px and collapses to the 42px icon without it. */
.soc-card{overflow:hidden}
.soc-card .st{min-width:0;flex:1 1 auto}
.soc-card .st .a,.soc-card .st .b{display:block;overflow-wrap:anywhere;word-break:break-word}

/* (pre-existing) cold-blue accents the warm shift deliberately spared because they
   sit above the darkness threshold — they now read as the only cold notes left */
.dl-card .dc-pill.beta{
  background:linear-gradient(180deg,#3A2E24,#241C15) !important;
  border-color:var(--gold) !important;color:var(--gold-bright) !important;
}
.status-seal.beta{
  background:radial-gradient(circle at 38% 32%,#6E5423,#3A2E24 62%,#241C15) !important;
}
.status-seal.beta span{color:var(--gold-bright) !important}
.intro-badge{
  border-color:rgba(201,162,75,.34) !important;
  box-shadow:0 0 18px rgba(201,162,75,.14),inset 0 0 12px rgba(201,162,75,.07) !important;
}
.ev-meta .pill i{background:var(--arcane) !important;box-shadow:0 0 8px var(--arcane) !important}
.jm-pill.prog{
  border-color:rgba(111,192,164,.45) !important;
  background:rgba(111,192,164,.09) !important;color:var(--arcane) !important;
}
.fb-chain .s{color:var(--gold-bright) !important}
.login-lore{color:var(--parch-3) !important}

/* (reskin) maroon used as a HEADING on the new dark panels — 2.6-2.9:1 */
.feat-note b,.feat-parch .feat-head h2,.lg-marginalia h3,.jm-note b{
  color:var(--parch) !important;
}


/* ==========================================================================
   COMPOSITION LAYER — the parts of the Torana mock that need structure, not
   just colour. All of it is driven by assets/torana.js, which upgrades the
   EXISTING front-page.php markup. No PHP was edited; without JS the page falls
   back to its current form.
   ========================================================================== */

/* ---- the arch: a fixed-height crown, not a stretched dome --------------
   A single mask scaled to 100% 100% turns the ogee into a huge dome on wide,
   short media (the 1124x482 featured view lost its whole top edge). Instead the
   arch is pinned to a fixed pixel height at the top and a plain fill carries the
   rest, so the motif reads identically at 64px and at 1124px. */
.tor-arch,
.tor-atlas .tor-view > img,
.plaque .pl-img,.plaque .pl-shade,.plaque .pl-frame{
  -webkit-mask-image:var(--arch),linear-gradient(#000,#000);
          mask-image:var(--arch),linear-gradient(#000,#000);
  -webkit-mask-size:100% var(--crown,64px),100% calc(100% - var(--crown,64px) + 2px);
          mask-size:100% var(--crown,64px),100% calc(100% - var(--crown,64px) + 2px);
  -webkit-mask-position:top center,bottom center;
          mask-position:top center,bottom center;
  -webkit-mask-repeat:no-repeat,no-repeat;
          mask-repeat:no-repeat,no-repeat;
}
.tor-atlas .tor-view > img{--crown:96px}
.plaque .pl-img,.plaque .pl-shade,.plaque .pl-frame{--crown:34px}
.tor-th > img{--crown:14px}
.tor-th > img{
  -webkit-mask-image:var(--arch),linear-gradient(#000,#000);
          mask-image:var(--arch),linear-gradient(#000,#000);
  -webkit-mask-size:100% var(--crown),100% calc(100% - var(--crown) + 2px);
          mask-size:100% var(--crown),100% calc(100% - var(--crown) + 2px);
  -webkit-mask-position:top center,bottom center;
          mask-position:top center,bottom center;
  -webkit-mask-repeat:no-repeat,no-repeat;
          mask-repeat:no-repeat,no-repeat;
}

/* ---- scroll reveal ----------------------------------------------------- */
.tor-rv{opacity:0;transform:translateY(14px);
  transition:opacity .8s var(--ease),transform .8s var(--ease)}
.tor-rv.tor-in{opacity:1;transform:none}

/* ---- nav over the hero ------------------------------------------------- */
.tor-nav{background:transparent !important;border-bottom-color:transparent !important;
  transition:background .5s var(--ease),border-color .5s var(--ease),
             -webkit-backdrop-filter .5s var(--ease),backdrop-filter .5s var(--ease)}
.tor-nav.tor-solid{background:rgba(10,8,7,.82) !important;
  border-bottom-color:var(--line-soft) !important}

/* ---- the Illuminated Atlas: featured viewer + rail ---------------------- */
.atlas-board.tor-replaced{display:none}
.tor-atlas{
  display:grid;grid-template-columns:minmax(0,1fr) 310px;
  border:1px solid var(--line-soft);border-radius:3px;overflow:hidden;
  background:linear-gradient(180deg,rgba(42,33,27,.5),rgba(16,12,11,.8));
  box-shadow:0 30px 80px -40px #000;
}
.tor-view{position:relative;min-height:480px;overflow:hidden}
.tor-view > img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .7s var(--ease),transform 9s linear;
}
.tor-view > img.on{opacity:1;transform:scale(1.05)}
.tor-view::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 34%,rgba(10,8,7,.55) 62%,rgba(10,8,7,.96) 100%)}
.tor-cap{position:absolute;left:38px;right:38px;bottom:30px;z-index:2}
.tor-cap .tor-k{font-family:'Marcellus SC',Georgia,serif;font-size:12px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold);display:block;margin-bottom:8px}
.tor-cap h3{font-family:'Marcellus',Georgia,serif;font-size:clamp(26px,3vw,38px);
  color:var(--parch);margin:0 0 8px;line-height:1.1}
.tor-cap p{font-size:15px;color:var(--parch-2);max-width:540px;margin:0;line-height:1.6}

.tor-rail{padding:18px;overflow-y:auto;max-height:480px;
  border-left:1px solid var(--line-soft);
  -webkit-mask-image:linear-gradient(180deg,#000 92%,transparent);
  mask-image:linear-gradient(180deg,#000 92%,transparent)}
.tor-rail::-webkit-scrollbar{width:4px}
.tor-rail::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}
.tor-item{display:flex;align-items:center;gap:13px;width:100%;padding:8px;
  border:0;border-radius:3px;background:transparent;cursor:pointer;text-align:left;
  font:inherit;color:inherit;transition:background .3s var(--ease)}
.tor-item:hover,.tor-item.on{background:rgba(201,162,75,.09)}
.tor-item:focus-visible{outline:2px solid var(--saffron);outline-offset:-2px}
.tor-th{width:64px;height:48px;flex:none;overflow:hidden;display:block}
.tor-th > img{width:100%;height:100%;object-fit:cover;
  filter:saturate(.7) brightness(.7);transition:filter .4s var(--ease)}
.tor-item:hover .tor-th > img,.tor-item.on .tor-th > img{filter:none}
.tor-nm{font-family:'Marcellus',Georgia,serif;font-size:15px;color:var(--parch-2);line-height:1.2}
.tor-item.on .tor-nm{color:var(--gold-bright)}
.tor-sb{display:block;margin-top:2px;font-family:'Inter',system-ui,sans-serif;
  font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}

/* ---- Tribes: real race portraits instead of the maroon letter square ---- */
.tor-cap-hidden{display:none !important}
.tor-ava{display:inline-flex;flex:none;align-items:center}
.tor-ava img{width:54px;height:54px;border-radius:50%;object-fit:cover;
  border:1px solid var(--line);background:var(--surface-2);
  box-shadow:0 4px 14px rgba(0,0,0,.55)}
.tor-ava img + img{margin-left:-18px}
/* if a portrait 404s, put the original letter cap back rather than showing a gap */
.tor-ava.tor-ava-failed{display:none}
.tor-ava.tor-ava-failed ~ .tor-cap-hidden{display:grid !important}

@media(max-width:1040px){
  .tor-atlas{grid-template-columns:1fr}
  .tor-view{min-height:340px}
  .tor-rail{max-height:none;border-left:0;border-top:1px solid var(--line-soft);
    display:grid;grid-template-columns:repeat(2,1fr);gap:4px;
    -webkit-mask-image:none;mask-image:none}
}
@media(max-width:640px){
  .tor-rail{grid-template-columns:1fr}
  .tor-cap{left:22px;right:22px;bottom:22px}
  .tor-ava img{width:46px;height:46px}
}
@media (prefers-reduced-motion:reduce){
  .tor-rv{opacity:1;transform:none;transition:none}
  .tor-view > img.on{transform:none}
}


/* (pre-existing) at phone width the Permington wordmark is 276px inside a ~319px
   column and the "A PERMINGTON WORLD" line is pushed out and clipped */
@media(max-width:640px){
  .foot-studio{flex-wrap:wrap;justify-content:center;gap:8px;text-align:center}
  .foot-studio img{max-width:min(220px,68vw);height:auto}
  .foot-studio .st-txt{flex:1 1 100%;text-align:center}
}

/* ------------------------------------------------------------ motion off -- */
@media (prefers-reduced-motion:reduce){
  .hero-bg{animation:none !important}
  *{animation-duration:.001ms !important;transition-duration:.001ms !important}
}
