/* Eisenfall site: visual language re-drawn from the Eisenfall app redesign atlas (v10.74):
   near-black + radial glow, brass double-line frames with corner brackets, Cinzel ivory titles,
   EB Garamond italic sublines, parchment cards, crimson pennant banners, brass icon tiles.
   CSS + Unicode glyphs only. Self-hosted fonts, no external requests. */
@font-face{font-family:"Cinzel";src:url(fonts/cinzel-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Cinzel";src:url(fonts/cinzel-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Cinzel";src:url(fonts/cinzel-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"EF Garamond";src:url(fonts/eb-garamond-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"EF Garamond";src:url(fonts/eb-garamond-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"EF Garamond";src:url(fonts/eb-garamond-latin-600-normal.woff2) format("woff2");font-weight:600 700;font-style:normal;font-display:swap}
:root{
  --bg:#09080a;--bg-warm:#17120e;--panel:#100e0f;--panel2:#16130f;--screen:#0d0c0e;
  --brass:#a8834f;--brass-hi:#d9b97e;--brass-dim:#5a4630;--brass-line:rgba(168,131,79,.55);--brass-faint:rgba(168,131,79,.22);
  --ivory:#f0e5cc;--text:#d4c9b2;--muted:#a69a83;
  --crimson:#7c1e26;--crimson-hi:#b5333c;--crimson-deep:#4a1117;--ember:#c7652a;
  --parch1:#efe4c6;--parch2:#d8c49b;--parch-ink:#2b2016;--parch-mute:#4a3b2a;--parch-rule:rgba(74,52,30,.45);
  --f-head:"Cinzel","Trajan Pro","Times New Roman",serif;
  --f-body:"EF Garamond","EB Garamond",Garamond,"Iowan Old Style",Georgia,serif;
  --f-glyph:"Segoe UI Symbol","Noto Sans Symbols 2","Noto Sans Symbols","DejaVu Sans","Apple Symbols",sans-serif;
  --max:72rem}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
body{margin:0;color:var(--text);font:400 1.15rem/1.65 var(--f-body);min-height:100vh;display:flex;flex-direction:column;
  background:
    radial-gradient(ellipse 70% 45% at 50% 0%,rgba(168,131,79,.13),transparent 70%),
    radial-gradient(ellipse 60% 40% at 85% 55%,rgba(124,30,38,.10),transparent 70%),
    radial-gradient(ellipse 60% 40% at 10% 85%,rgba(168,131,79,.06),transparent 70%),
    linear-gradient(180deg,#0c0a0b,var(--bg) 40%,#070607)}
a{color:var(--brass-hi);text-decoration-color:var(--brass);text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{color:var(--ivory)}
:focus-visible{outline:2px solid var(--brass-hi);outline-offset:3px;border-radius:2px}
.parchment :focus-visible{outline-color:#2b2016}
img{max-width:100%;height:auto;display:block}
code{font:.82em ui-monospace,Menlo,Consolas,monospace;background:rgba(43,32,22,.1);border:1px solid var(--parch-rule);border-radius:3px;padding:0 .3em;color:var(--parch-ink)}
.gl,.tg,.rg,.glyph-row,.banner-glyph,.pawn,.medal span,.medals span,.tabbar span,.rings b{font-family:var(--f-glyph);font-weight:400;font-style:normal}
.skip{position:absolute;left:-999px;top:0;background:var(--crimson);color:var(--ivory);padding:.5rem 1rem;z-index:9}
.skip:focus{left:1rem}
.wrap{width:min(100% - 2rem,var(--max));margin-inline:auto}
.center{text-align:center}.mt{margin-top:1.6rem}.pt0{padding-top:0!important}.muted{color:var(--text)}
section{padding:2.6rem 0;position:relative}
@media(min-width:48rem){section{padding:3.6rem 0}}

/* ---------- frame: brass double line + corner brackets ---------- */
.frame{position:relative;border:1px solid var(--brass-line);background:linear-gradient(180deg,rgba(23,19,15,.85),rgba(12,11,12,.92));
  box-shadow:0 20px 60px rgba(0,0,0,.55),inset 0 0 0 5px rgba(9,8,10,.9),inset 0 0 0 6px var(--brass-faint)}
.frame::before{content:"";position:absolute;inset:2px;z-index:1;pointer-events:none;
  background:
   linear-gradient(var(--brass-hi),var(--brass-hi)) top left/18px 2px no-repeat,linear-gradient(var(--brass-hi),var(--brass-hi)) top left/2px 18px no-repeat,
   linear-gradient(var(--brass-hi),var(--brass-hi)) top right/18px 2px no-repeat,linear-gradient(var(--brass-hi),var(--brass-hi)) top right/2px 18px no-repeat,
   linear-gradient(var(--brass-hi),var(--brass-hi)) bottom left/18px 2px no-repeat,linear-gradient(var(--brass-hi),var(--brass-hi)) bottom left/2px 18px no-repeat,
   linear-gradient(var(--brass-hi),var(--brass-hi)) bottom right/18px 2px no-repeat,linear-gradient(var(--brass-hi),var(--brass-hi)) bottom right/2px 18px no-repeat}

/* ---------- header ---------- */
.site-head{background:linear-gradient(180deg,rgba(14,12,12,.97),rgba(10,9,10,.92));border-bottom:1px solid var(--brass-dim);box-shadow:0 1px 0 rgba(0,0,0,.6),0 2px 0 var(--brass-faint);position:sticky;top:0;z-index:5;backdrop-filter:blur(6px)}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;gap:.55rem 1rem;padding-block:.6rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ivory);font:600 1.15rem/1 var(--f-head);letter-spacing:.2em;text-transform:uppercase}
.brand img{width:34px;height:34px}
.brand-text span{font-weight:700;letter-spacing:.28em;padding:.2rem 0;border-block:1px solid var(--brass-dim)}
.nav{display:flex;flex-wrap:wrap;gap:.35rem}
.nav a{font:600 .72rem/1 var(--f-head);letter-spacing:.14em;text-transform:uppercase;color:var(--text);text-decoration:none;padding:.55rem .75rem;border:1px solid var(--brass-dim);background:rgba(20,17,14,.8)}
.nav a:hover,.nav a:focus-visible{border-color:var(--brass);color:var(--ivory)}
.nav a[aria-current=page]{background:linear-gradient(180deg,var(--crimson),var(--crimson-deep));border-color:var(--crimson-hi);color:var(--ivory)}

/* ---------- type ---------- */
.kicker{display:flex;align-items:center;justify-content:center;gap:.7rem;font:600 .72rem/1.2 var(--f-head);letter-spacing:.42em;text-transform:uppercase;color:var(--brass-hi);margin:0 0 .9rem}
.kicker .kt{padding-left:.42em}
.kicker .gl{font-size:.9rem;letter-spacing:0;color:var(--brass)}
.kicker-ivory{color:var(--ivory)}
.title{font:600 clamp(3rem,13vw,7.2rem)/1 var(--f-head);letter-spacing:.08em;text-transform:uppercase;margin:0;color:var(--ivory);
  text-shadow:0 0 40px rgba(217,185,126,.25),0 2px 0 rgba(0,0,0,.6)}
.page-title{font:600 clamp(2rem,7.5vw,3.4rem)/1.1 var(--f-head);letter-spacing:.1em;text-transform:uppercase;margin:0;color:var(--ivory);text-shadow:0 0 30px rgba(217,185,126,.18)}
.sub{font:italic 400 clamp(1.05rem,3.2vw,1.3rem)/1.4 var(--f-body);color:var(--muted);margin:.55rem 0 0;letter-spacing:.02em}
.rule{display:flex;align-items:center;justify-content:center;gap:.7rem;margin:1.2rem auto;color:var(--brass);max-width:20rem}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--brass))}
.rule::after{background:linear-gradient(90deg,var(--brass),transparent)}
.rule span{font-size:.6rem;line-height:1}
.lede{font:italic 400 clamp(1.15rem,3.6vw,1.45rem)/1.5 var(--f-body);max-width:36rem;margin:0 auto;color:var(--ivory)}
h2,h3{font-family:var(--f-head);font-weight:600;line-height:1.2;color:var(--ivory);letter-spacing:.06em}
h2{font-size:clamp(1.5rem,5vw,2.3rem);margin:0;text-transform:uppercase}
h3{font-size:1rem;margin:0 0 .45rem;text-transform:uppercase;letter-spacing:.14em}
.app-cards h2{font-size:1rem;margin:0 0 .45rem;text-transform:uppercase;letter-spacing:.14em}
.numeral{position:absolute;top:.4rem;right:1rem;font:italic 400 clamp(3.2rem,11vw,6rem)/1 var(--f-body);color:rgba(217,185,126,.13);pointer-events:none;user-select:none}
.atlas-line{font:600 .7rem/1.3 var(--f-head);letter-spacing:.36em;text-transform:uppercase;color:var(--brass);margin:0 0 .7rem}
.atlas-label{font:600 .74rem/1 var(--f-head);letter-spacing:.24em;text-transform:uppercase;color:var(--brass-hi);text-align:center;margin:0 0 .9rem}

/* ---------- page head (app-screen top bar) ---------- */
.phead{padding:2.2rem 0 2rem}
.phead-in{text-align:center;padding:2.4rem 1.2rem 2rem;overflow:hidden;
  background:radial-gradient(ellipse 70% 90% at 50% 0%,rgba(168,131,79,.16),transparent 70%),linear-gradient(180deg,rgba(23,19,15,.9),rgba(12,11,12,.95))}
.phead .lede{margin-top:.2rem}
.tag{display:inline-block;font:600 .66rem/1 var(--f-head);letter-spacing:.3em;text-transform:uppercase;color:var(--ivory);background:linear-gradient(180deg,var(--crimson),var(--crimson-deep));border:1px solid var(--crimson-hi);padding:.5rem .8rem .5rem 1.1rem;margin-bottom:1.1rem}

/* ---------- home hero ---------- */
.hero{padding:2rem 0 1rem}
.hero-frame{text-align:center;overflow:hidden;padding:0}
.hero-top{padding:2.4rem 1rem 1.8rem;border-bottom:1px solid var(--brass-dim);
  background:radial-gradient(ellipse 60% 100% at 50% 0%,rgba(168,131,79,.14),transparent 70%)}
.ember{position:relative;padding:2.2rem 1.2rem 2.6rem;
  background:
   radial-gradient(ellipse 55% 45% at 50% 18%,rgba(199,101,42,.30),transparent 70%),
   radial-gradient(ellipse 80% 60% at 50% 100%,rgba(124,30,38,.35),transparent 70%),
   linear-gradient(180deg,#1d150e,#110d0c 55%,#0d0b0c)}
.ember::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,transparent,var(--brass) 20%,var(--brass-hi) 50%,var(--brass) 80%,transparent);opacity:.7}
.glyph-row{list-style:none;margin:0 auto;padding:0;display:flex;justify-content:center;gap:clamp(1rem,6vw,3.2rem);font-size:clamp(1.7rem,7vw,2.8rem);color:var(--ivory);text-shadow:0 0 18px rgba(199,101,42,.55)}
.launch{display:inline-flex;flex-direction:column;align-items:center;gap:.3rem;margin-top:1.8rem;padding:.95rem 2.6rem;border:1px solid var(--brass);position:relative;
  background:linear-gradient(180deg,rgba(29,22,15,.95),rgba(14,12,12,.95));box-shadow:inset 0 0 0 4px rgba(9,8,10,.9),inset 0 0 0 5px var(--brass-faint),0 10px 30px rgba(0,0,0,.5)}
.launch small{font:600 .66rem/1 var(--f-head);letter-spacing:.36em;text-transform:uppercase;color:var(--muted)}
.launch strong{font:600 1.9rem/1.1 var(--f-head);letter-spacing:.24em;color:var(--brass-hi);padding-left:.24em}
.hero-cta{display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;margin:1.8rem 0 0}

/* ---------- buttons ---------- */
.btn{display:inline-block;padding:.85rem 1.4rem;border:1px solid var(--brass-dim);background:rgba(22,19,15,.9);color:var(--ivory);text-decoration:none;font:600 .78rem/1 var(--f-head);letter-spacing:.18em;text-transform:uppercase;transition:border-color .15s,box-shadow .15s,transform .12s;box-shadow:inset 0 0 0 3px rgba(9,8,10,.85),inset 0 0 0 4px var(--brass-faint)}
.btn:hover,.btn:focus-visible{border-color:var(--brass-hi);color:#fff}
.btn:active{transform:scale(.98)}
.btn-primary{background:linear-gradient(180deg,#8a222b,var(--crimson-deep));border-color:var(--crimson-hi);box-shadow:inset 0 0 0 3px rgba(40,8,12,.55),inset 0 0 0 4px rgba(240,229,204,.18)}
.btn-primary:hover,.btn-primary:focus-visible{border-color:var(--brass-hi);box-shadow:0 0 0 1px rgba(217,185,126,.35),0 0 24px rgba(181,51,60,.35)}

/* ---------- atlas strip ---------- */
.atlas-head{position:relative;text-align:center;padding:1.2rem 0 1.4rem;margin-bottom:1.8rem;border-bottom:1px solid var(--brass-dim)}
.atlas-head .numeral{top:-.6rem;right:0}
.atlas-grid{display:grid;gap:2.4rem 1.6rem;grid-template-columns:1fr}
@media(min-width:48rem){.atlas-grid{grid-template-columns:repeat(3,1fr)}}
.pillar{text-align:center}
.pillar h3{margin-top:1.2rem}
.pillar p:not(.atlas-label){margin:0 auto;max-width:22rem;color:var(--text)}
/* device: bronze-bezel phone/panel */
.device{position:relative;border:2px solid transparent;border-radius:30px;padding:9px;max-width:20rem;margin:0 auto;
  background:linear-gradient(#141112,#0b0a0b) padding-box,linear-gradient(155deg,#e0c08a,#6b4e2e 30%,#a8834f 55%,#3d2b1b 80%,#c9a46a) border-box;
  box-shadow:0 24px 50px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.8)}
.device::before{content:"";position:absolute;top:9px;left:50%;transform:translateX(-50%);width:34%;height:14px;background:#050405;border-radius:0 0 10px 10px;z-index:2}
.device-wide{max-width:22rem;border-radius:22px}
.device-wide::before{display:none}
.screen{position:relative;border-radius:22px;overflow:hidden;border:1px solid var(--brass-dim);min-height:15rem;display:flex;flex-direction:column;
  background:radial-gradient(ellipse 80% 50% at 50% 35%,rgba(168,131,79,.14),transparent 70%),linear-gradient(180deg,#151213,#0c0b0c)}
.device-wide .screen{border-radius:15px;height:15rem}
.device-wide .tile{aspect-ratio:auto;min-height:4.4rem}
.device-wide .rings{flex:1;align-items:center}
.scr-head{text-align:center;padding:1.6rem .8rem .8rem;border-bottom:1px solid var(--brass-dim)}
.device-wide .scr-head{padding:.9rem .6rem .7rem}
.scr-kick{font:600 .56rem/1 var(--f-head);letter-spacing:.32em;color:var(--brass);margin:0;text-transform:uppercase}
.scr-kick .gl{font-size:.6rem;letter-spacing:0;margin-inline:.35rem;color:var(--brass-hi)}
.scr-title{font:600 1.5rem/1.1 var(--f-head);letter-spacing:.1em;text-transform:uppercase;color:var(--ivory);margin:.55rem 0 .2rem}
.scr-sub{font:italic 400 .9rem/1.2 var(--f-body);color:var(--muted);margin:0}
/* icon tiles */
.tiles{list-style:none;margin:0;padding:1rem;display:grid;gap:.6rem;grid-template-columns:repeat(2,1fr)}
.tiles.t3{grid-template-columns:repeat(3,1fr)}
.tiles.t6{grid-template-columns:repeat(2,1fr);gap:.8rem;padding:0}
@media(min-width:34rem){.tiles.t6{grid-template-columns:repeat(3,1fr)}}
@media(min-width:62rem){.tiles.t6{grid-template-columns:repeat(6,1fr)}}
.tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.45rem;aspect-ratio:1/1;border:1px solid var(--brass);padding:.5rem;text-align:center;
  background:radial-gradient(circle at 50% 35%,rgba(168,131,79,.16),transparent 70%),linear-gradient(180deg,#1b1611,#100d0d);box-shadow:inset 0 0 0 3px rgba(9,8,10,.8),inset 0 0 0 4px var(--brass-faint)}
.tile .tg{font-size:1.65rem;line-height:1;color:var(--ivory);text-shadow:0 0 12px rgba(217,185,126,.3)}
.tile span:last-child{font:400 .82rem/1.15 var(--f-body);color:var(--text)}
.tiles.t6 .tile .tg{font-size:2.1rem}
.tiles.t6 .tile span:last-child{font:600 .68rem/1.2 var(--f-head);letter-spacing:.16em;text-transform:uppercase}
/* stat rings */
.rings{list-style:none;display:flex;justify-content:space-around;margin:0;padding:1.4rem .6rem 1rem}
.rings li{display:flex;flex-direction:column;align-items:center;gap:.5rem}
.rings b{display:grid;place-items:center;width:4.2rem;height:4.2rem;border-radius:50%;font:600 1.25rem/1 var(--f-head);color:var(--ivory);
  border:2px solid var(--brass);box-shadow:inset 0 0 0 4px #120f0f,inset 0 0 0 5px var(--brass-dim),0 0 20px rgba(199,101,42,.18);background:radial-gradient(circle,#2a1d14,#120f0f 70%)}
.rings b .rg{font-size:1.6rem;line-height:1}
.rings span{font:600 .6rem/1 var(--f-head);letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
/* paper doll */
.paper-doll{display:flex;flex-direction:column;align-items:center}
.pawn{font-size:4.2rem;line-height:1;color:#c6ab80;margin-top:.8rem;text-shadow:0 0 30px rgba(217,185,126,.35)}
.paper-doll .tiles{width:100%;padding-top:.6rem}

/* ---------- parchment ---------- */
.parchment{position:relative;color:var(--parch-ink);padding:1.7rem 1.4rem 1.5rem;border:1px solid #8a6a41;
  background:radial-gradient(ellipse at 30% 20%,rgba(255,250,235,.55),transparent 60%),radial-gradient(ellipse at 80% 90%,rgba(140,105,60,.22),transparent 60%),linear-gradient(180deg,var(--parch1),var(--parch2));
  box-shadow:inset 0 0 0 4px rgba(239,228,198,.6),inset 0 0 0 5px rgba(120,90,55,.45),inset 0 0 40px rgba(110,80,40,.25),0 18px 40px rgba(0,0,0,.55)}
@media(min-width:42rem){.parchment{padding:2.2rem 2.4rem 2rem}}
.parchment h2,.parchment h3{color:var(--parch-ink)}
.parchment h2{font-size:clamp(1.2rem,3.6vw,1.55rem);margin:0 0 .7rem}
.parchment p{margin:0 0 1rem;color:var(--parch-ink)}
.parchment a{color:#7a1b22;text-decoration-color:#7a1b22}
.parchment a:hover{color:#4a0f14}
.parchment strong{color:#1e160e}
.parch-kick{font:600 .7rem/1.2 var(--f-head)!important;letter-spacing:.34em;text-transform:uppercase;color:var(--parch-mute)!important;text-align:center;padding-bottom:.7rem;border-bottom:1px solid var(--parch-rule);margin:0 0 1.1rem!important}
.parch-kick .gl{font-size:.6rem;color:#7a1b22;letter-spacing:0;margin-inline:.4rem}
.pips{display:flex;justify-content:center;gap:1.4rem;color:#8c2a2a;font-size:.75rem;margin:1rem 0 .3rem}
.pips .o{color:#8c2a2a;opacity:.7}
.quote-card{max-width:44rem;margin:0 auto;text-align:center}
.quote{margin:0;font:italic 400 clamp(1.2rem,3.6vw,1.55rem)/1.55 var(--f-body);color:var(--parch-ink)}
.quote-card figcaption{font:600 .68rem/1 var(--f-head);letter-spacing:.34em;text-transform:uppercase;color:var(--parch-mute);margin-top:.6rem}
.lead-card{max-width:48rem;margin:0 auto;text-align:center}
.lead-card p:not(.parch-kick){font:italic 400 clamp(1.15rem,3.2vw,1.35rem)/1.6 var(--f-body)}
.cards2{display:grid;gap:1.4rem;grid-template-columns:1fr}
@media(min-width:48rem){.cards2{grid-template-columns:1fr 1fr}}
.narrow{max-width:44rem;margin-inline:auto}
.contact-card{text-align:center}
.contact-card .btn{text-transform:none;letter-spacing:.06em;font-size:.9rem;word-break:break-all}
/* long documents: parchment for readability */
.doc{max-width:46rem;margin:0 auto;font-size:1.12rem}
.doc h2{font-size:1.05rem;letter-spacing:.14em;margin:2rem 0 .7rem;padding-bottom:.45rem;border-bottom:1px solid var(--parch-rule)}
.doc h2:first-child{margin-top:0}
.doc h2 .pip{color:#7a1b22;font-size:.6rem;vertical-align:.2em;margin-right:.3rem}

/* ---------- crimson pennant banner ---------- */
.banner-frame{padding:0;overflow:visible;text-align:center}
.banner{position:relative;padding:2.2rem 1.2rem 3.6rem;color:var(--ivory);
  background:radial-gradient(ellipse 60% 70% at 50% 20%,rgba(255,180,160,.14),transparent 70%),linear-gradient(180deg,#7d2a31,#5a1a20 60%,#43131a);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 2.2rem),50% 100%,0 calc(100% - 2.2rem))}
.banner h2{color:var(--ivory);font-size:clamp(1.9rem,6vw,2.8rem);letter-spacing:.16em}
.banner-glyph{display:block;font-size:2.8rem;line-height:1;margin-bottom:.8rem;color:#f2e6cf;text-shadow:0 0 20px rgba(0,0,0,.4)}
.banner .kicker{margin-bottom:.5rem}
.banner-solo .kicker{font-size:clamp(.9rem,2.6vw,1.1rem);letter-spacing:.34em;font-weight:700}
.banner-sub{font:italic 400 1.1rem/1.3 var(--f-body);color:#e9d7c8;margin:0}
.banner-body{padding:1.6rem 1.2rem 2.2rem}
.banner-body p{max-width:36rem;margin:0 auto 1.4rem;font-size:1.2rem;color:var(--text)}
.banner-solo{margin:0 auto 2.6rem;max-width:40rem;background:none;box-shadow:none;border:none}
.banner-solo::before{display:none}
.banner-solo .banner{padding-bottom:3.2rem}

/* ---------- app teaser + medallions ---------- */
.app-teaser{position:relative;padding:2.6rem 1.2rem 2.2rem;overflow:hidden}
.app-teaser .prose{max-width:36rem;margin:0 auto}
.medals{list-style:none;display:flex;justify-content:center;gap:1rem;margin:1.4rem 0 1.6rem;padding:0}
.medals li,.medal{display:grid;place-items:center;width:4.6rem;height:5.8rem;border-radius:50%;border:2px solid var(--brass);font-size:2.4rem;color:var(--ivory);
  box-shadow:inset 0 0 0 4px #0e0c0c,inset 0 0 0 5px var(--brass-dim),0 8px 20px rgba(0,0,0,.5)}
.m-rose{background:radial-gradient(circle at 50% 45%,#7c1e26,#2a1014 70%)}
.m-ivory{background:radial-gradient(circle at 50% 45%,#8a8270,#2a2620 70%)}
.m-teal{background:radial-gradient(circle at 50% 45%,#a8834f,#2a1d14 70%)}

/* ---------- vault (tile grid) ---------- */
.vault{padding:1.8rem 1.2rem}
@media(min-width:42rem){.vault{padding:2.2rem 2rem}}
.vault-title{text-align:center;font:600 .74rem/1 var(--f-head);letter-spacing:.36em;text-transform:uppercase;color:var(--brass-hi);margin:0 0 1.4rem;padding-bottom:1rem;border-bottom:1px solid var(--brass-dim)}
.vault-title .gl{letter-spacing:0;margin-inline:.5rem;color:var(--brass)}

/* ---------- fieldwork: corkboard / stringboard ---------- */
.field{position:relative;display:grid;gap:1.6rem;padding:1.8rem 1.2rem;grid-template-columns:1fr;overflow:hidden}
@media(min-width:48rem){.field{grid-template-columns:1fr 1.1fr;align-items:center;padding:2.4rem 2.2rem}}
.field-text p:not(.atlas-line){margin:.9rem 0 0;font-size:1.2rem}
.cork{position:relative;min-height:19rem;border:1px solid var(--brass);box-shadow:inset 0 0 0 4px #1a120b,inset 0 0 0 5px var(--brass-dim),inset 0 0 50px rgba(0,0,0,.6);
  background:radial-gradient(circle at 30% 30%,rgba(255,220,170,.10),transparent 60%),
   radial-gradient(rgba(0,0,0,.22) 1px,transparent 1.5px) 0 0/7px 7px,
   linear-gradient(160deg,#6b4a2c,#4b321e 60%,#3a2716)}
.strings{position:absolute;inset:0;width:100%;height:100%}
.strings path{fill:none;stroke:#b4323a;stroke-width:.5;vector-effect:non-scaling-stroke;stroke-width:1.5;opacity:.85}
.note-pin{position:absolute;width:42%;max-width:11rem;margin:0;padding:1rem .7rem .7rem;text-align:center;color:var(--parch-ink);
  background:linear-gradient(180deg,#f1e6c9,#dccaa2);box-shadow:0 8px 16px rgba(0,0,0,.45)}
.note-pin::before{content:"";position:absolute;top:.35rem;left:50%;width:.6rem;height:.6rem;margin-left:-.3rem;border-radius:50%;background:radial-gradient(circle at 35% 35%,#e66,#8a1a20);box-shadow:0 1px 2px rgba(0,0,0,.5)}
.note-pin b{display:block;font:600 .7rem/1.2 var(--f-head);letter-spacing:.12em;text-transform:uppercase}
.note-pin i{display:block;font:italic 400 .9rem/1.2 var(--f-body);color:var(--parch-mute);margin-top:.25rem}
.n1{left:6%;top:7%;transform:rotate(-4deg)}
.n2{right:6%;top:12%;transform:rotate(3deg)}
.n3{left:7%;bottom:8%;transform:rotate(2deg)}
.n4{right:5%;bottom:6%;transform:rotate(-3deg)}

/* ---------- app page phones ---------- */
.phones{margin-bottom:2.4rem}
.phones .device{max-width:17rem}
.phones .screen{min-height:27rem}
.scr-hero{display:grid;place-items:center;padding:1.6rem 0 .6rem}
.ember-sm{background:radial-gradient(ellipse 60% 70% at 50% 60%,rgba(199,101,42,.22),transparent 70%)}
.scr-tiles{padding:1rem 1.1rem}
.tabbar{margin-top:auto;display:flex;justify-content:space-around;padding:.7rem .3rem .8rem;border-top:1px solid var(--brass-dim);background:#100e0e;color:var(--muted);font-size:1.05rem}
.tabbar span{display:flex;flex-direction:column;align-items:center;gap:.25rem}
.tabbar small{font:600 .5rem/1 var(--f-head);letter-spacing:.14em;text-transform:uppercase}
.tabbar .on{color:var(--brass-hi)}
.atlas-item{margin:0}
.phone-cap{text-align:center;font:italic 400 1rem/1.4 var(--f-body);color:var(--muted);margin:.9rem 0 0}
.grid{display:grid;gap:1rem;grid-template-columns:1fr}
@media(min-width:48rem){.grid.three{grid-template-columns:repeat(3,1fr)}}
.card{border:1px solid var(--brass-dim);background:linear-gradient(180deg,rgba(26,21,16,.9),rgba(14,12,12,.9));padding:1.3rem 1.3rem 1.2rem;text-align:center;box-shadow:inset 0 0 0 4px rgba(9,8,10,.85),inset 0 0 0 5px var(--brass-faint)}
.card p{margin:0;color:var(--text)}
.note{font-size:1rem;color:var(--muted);margin:.4rem 0 0;font-style:italic}
.sec-head{text-align:center;margin-bottom:.4rem}
.prose{max-width:46rem;margin:0 auto}

/* ---------- footer ---------- */
.site-foot{margin-top:auto;border-top:1px solid var(--brass-dim);background:linear-gradient(180deg,#0e0c0c,#080708);padding:0 0 1.8rem;font-size:.98rem;color:var(--muted)}
.foot-orn{display:flex;justify-content:center;margin-top:-.75rem;margin-bottom:1.2rem}
.foot-orn span{font-family:var(--f-glyph);background:var(--bg);color:var(--brass);padding:0 .8rem;font-size:1.1rem;line-height:1.4}
.foot-row{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
.site-foot .mark{display:flex;align-items:center;gap:.7rem;max-width:42rem}
.site-foot img{width:26px;height:26px;flex:none;opacity:.9}
.site-foot nav{display:flex;gap:1.3rem;flex-wrap:wrap;font:600 .72rem/1 var(--f-head);letter-spacing:.16em;text-transform:uppercase}
.site-foot a{color:var(--text);text-decoration:none;padding:.3rem 0}
.site-foot a:hover,.site-foot a:focus-visible{color:var(--brass-hi)}

/* ---------- motion ---------- */
@keyframes ember{0%,100%{opacity:1}50%{opacity:.82}}
.glyph-row{animation:ember 5s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:30rem){
 .site-head .wrap{justify-content:center}.nav{justify-content:center;gap:.3rem}.nav a{padding:.5rem .5rem;font-size:.62rem;letter-spacing:.08em}
 .kicker{letter-spacing:.28em;gap:.5rem;font-size:.64rem}
 .numeral{right:.5rem}
 .atlas-head .numeral{top:-2.4rem}
 .medals li{width:4rem;height:5rem;font-size:2rem}
 .note-pin{width:44%}
}
/* QA fixes, Oct 26 2:45 PM: larger invisible tap areas (no visual change); app phones can't push the grid wider than the screen */
.nav a,.site-foot nav a,.brand{position:relative}
.nav a::after,.site-foot nav a::after,.brand::after{content:"";position:absolute;inset:-8px -2px}
.site-foot nav a::after{inset:-12px -6px}
.atlas-grid>*{min-width:0}
@media(min-width:48rem) and (max-width:61.99rem){.atlas-grid.phones{grid-template-columns:repeat(2,1fr)}.atlas-grid.phones>:last-child{grid-column:1/-1}}
/* Willow & Wisp art (Oct 26, 3:15 PM): one picture per layout. Phones: inside the hero, above the buttons. Wider screens: framed banner under the hero. */
.pair{margin:0}
.pair img{display:block;width:100%;height:auto;image-rendering:pixelated}
.pair figcaption{font:600 .68rem/1 var(--f-head);letter-spacing:.24em;text-transform:uppercase;color:var(--brass);text-align:center;margin-top:.7rem}
.pair-mob{max-width:22rem;margin:1.4rem auto .4rem;border:1px solid var(--brass-line);padding:5px;background:#09080a}
.pair-mob figcaption{margin:.6rem 0 .3rem}
.pair-desk{display:none;padding-top:0}
.pair-desk .pair{padding:10px}
@media(min-width:48rem){.pair-mob{display:none}.pair-desk{display:block}}