:root{
  --midnight:#05060b;
  --midnight2:#0b0d17;
  --ivory:#f7f3ec;
  --ivory2:#efe9de;
  --ink:#191416;
  --inkdim:#5c5450;
  --line-dark:rgba(150,170,220,.20);
  --line-light:rgba(30,20,15,.14);
  --type:#eef0f4;
  --dim:#a9b2c4;
  --dimmer:#7a8396;
  --desire1:#ff9d6c;
  --desire2:#ffc98a;
  --uva:#a684ff;
  --uvb:#4ad9ff;
  --action:#ff5a44;
  --false:#ff6a6a;
  --display:"Newsreader",ui-serif,Georgia,serif;
  --sans:"IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--midnight);color:var(--type);font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
:where(a,button,input,summary,[tabindex]):focus-visible{outline:2px solid var(--uva);outline-offset:3px;border-radius:3px}
.skip{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.skip:focus{width:auto;height:auto;overflow:visible;clip:auto;clip-path:none;inset-inline-start:26px;top:14px;z-index:999;background:var(--midnight);border:1px solid var(--uva);padding:10px 16px;border-radius:3px;color:var(--type)}
.wrap{max-width:76rem;margin:0 auto;padding:0 26px}
.col{max-width:38rem}
h1,h2,h3{font-family:var(--display);font-weight:200;margin:0;text-wrap:balance;letter-spacing:-.015em}
h1{font-size:clamp(2.6rem,7.6vw,5.6rem);line-height:1.02}
h2{font-size:clamp(2rem,5vw,3.6rem);line-height:1.08}
h3{font-size:1.25rem;font-weight:300;line-height:1.35}
p{margin:0}
.label{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--dimmer)}
.label.on-ivory{color:#9c8f83}
.lede{font-size:clamp(1.05rem,1.8vw,1.28rem);line-height:1.62;color:#cdd3de;max-width:60ch}
.lede.on-ivory{color:#4a423e}
.note{font-size:.92rem;line-height:1.65;color:var(--dim);max-width:66ch}
.note.on-ivory{color:#5c5450}
.stack{display:flex;flex-direction:column}
.g10{gap:10px}.g16{gap:16px}.g24{gap:24px}.g36{gap:36px}.g54{gap:54px}
section{position:relative}
.pad{padding:clamp(90px,13vh,150px) 0}
.padtight{padding:clamp(56px,8vh,90px) 0}

.rise{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.rise.in{opacity:1;transform:none}

/* ---------- fixed chrome ---------- */
#prog{position:fixed;left:0;top:0;height:2px;width:0;z-index:80;background:linear-gradient(90deg,var(--uvb),var(--uva) 55%,var(--action));box-shadow:0 0 12px rgba(166,132,255,.7)}
#bgcanvas{position:fixed;inset:0;z-index:-1;display:block;transition:opacity 1s ease}

/* ---------- top nav ---------- */
.topnav{position:sticky;top:0;z-index:70;display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:14px 26px;background:rgba(5,6,11,.86);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-dark);font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}
.topnav-brand{font-family:var(--display);font-size:.95rem;letter-spacing:0;text-transform:none;color:#fff;margin-right:8px}
.topnav a{color:var(--dim);text-decoration:none;border-bottom:1px solid transparent}
.topnav a:hover,.topnav a:focus-visible{color:#fff;border-bottom-color:var(--uva)}
.langsel{display:inline-flex;align-items:center;position:relative;margin-left:auto}
.langsel select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:transparent;border:1px solid var(--line-dark,var(--line));color:var(--dim);font:inherit;padding:6px 24px 6px 12px;border-radius:999px;cursor:pointer}
.langsel select:hover,.langsel select:focus-visible{color:var(--type,var(--ink));border-color:var(--uva,var(--accent));outline:none}
.langsel:after{content:"\25BE";position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:.62rem;color:var(--dim);pointer-events:none}
#google_translate_element{position:absolute!important;left:-9999px!important;top:-9999px!important;height:1px;width:1px;overflow:hidden}
.goog-te-banner-frame{display:none!important}
.goog-text-highlight{background:none!important;box-shadow:none!important}
body{top:0!important}

/* ---------- hero ---------- */
.hero{padding:clamp(60px,10vh,110px) 0 clamp(50px,7vh,80px)}
.teen-banner{font-size:.9rem;color:#ffd9c8;background:rgba(255,90,68,.1);border:1px solid rgba(255,90,68,.4);border-radius:8px;padding:12px 18px;max-width:52rem;margin-bottom:30px}
.teen-banner a{color:#fff;text-decoration:underline}
.hero-h1{font-family:var(--display);font-weight:200;font-size:clamp(2.4rem,6.8vw,4.6rem);line-height:1.05;color:#fff;max-width:22ch}
.hero-h1 em{font-style:italic;color:var(--desire1)}
.hero-sub{margin-top:20px;font-size:clamp(1rem,2vw,1.2rem);color:#e3d9d0;max-width:52ch}
.hero-cta{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:#fff;border:1px solid rgba(255,255,255,.4);padding:13px 22px;border-radius:999px;background:rgba(255,255,255,.06);text-decoration:none}
.hero-cta:hover{background:rgba(255,255,255,.14)}

/* ---------- myth: tap-story cards ---------- */
.mythwrap{display:flex;flex-direction:column;gap:2px;max-width:44rem}
.myth{border-top:1px solid var(--line-dark);padding:26px 0}
.myth:last-child{border-bottom:1px solid var(--line-dark)}
.mythbtn{width:100%;background:none;border:0;color:inherit;text-align:left;cursor:pointer;font-family:var(--sans);display:flex;flex-direction:column;gap:10px;padding:0}
.myth-q{font-family:var(--display);font-size:clamp(1.3rem,3vw,1.7rem);font-weight:300;color:#f5f6f9}
.myth-hint{font-family:var(--mono);font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--uva)}
.myth-a{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(.2,.8,.2,1)}
.myth.open .myth-a{max-height:20rem}
.myth-a-in{padding-top:16px;display:flex;flex-direction:column;gap:12px}
.myth-stamp{font-family:var(--mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--false);border:1px solid rgba(255,106,106,.5);border-radius:999px;padding:4px 10px;width:fit-content}
.myth-a p{font-size:.98rem;line-height:1.6;color:#ccd2de;max-width:60ch}
.evbtn{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;background:none;border:0;color:var(--uvb);cursor:pointer;padding:0;width:fit-content;border-bottom:1px solid rgba(74,217,255,.4)}
.evbtn:hover{color:#fff;border-bottom-color:#fff}
.myth-cite{font-family:var(--mono);font-size:.76rem;line-height:1.6;color:var(--dimmer);max-width:60ch;display:none;padding-top:4px}
.myth-cite.show{display:block}
.myth-cite a{color:var(--uvb);text-decoration:none;border-bottom:1px solid rgba(74,217,255,.4)}

/* ---------- commerce: word dissolve ---------- */
.wordcloud{display:flex;flex-wrap:wrap;gap:14px 28px;max-width:52rem}
.word{position:relative;display:inline-grid;font-family:var(--display);font-size:clamp(1.5rem,4vw,2.6rem);font-weight:200;line-height:1}
.word b{grid-area:1/1;display:block;white-space:nowrap;transition:opacity .9s ease,transform .9s ease;font-weight:200}
.w-before{color:var(--desire1)}
.w-after{opacity:0;color:var(--dimmer);transform:translateY(6px)}
.wordcloud.flip .w-before{opacity:0;transform:translateY(-6px)}
.wordcloud.flip .w-after{opacity:1;transform:none}
.bigger-claim{font-family:var(--display);font-size:clamp(1.9rem,4.6vw,3rem);font-weight:200;line-height:1.14;max-width:24ch}
.term{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;color:var(--dimmer);max-width:56ch}

/* ---------- rules / policy map ---------- */
.obs-banner{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:#ffab90;border:1px solid rgba(255,138,104,.45);background:rgba(255,138,104,.08);padding:8px 14px;border-radius:999px}
.mapstage{position:relative;max-width:38rem;aspect-ratio:11/7}
.mapstage canvas{width:100%;height:100%;display:block;border-radius:10px}
.usmap{display:grid;grid-template-columns:repeat(11,1fr);grid-auto-rows:1fr;gap:4px;max-width:38rem;aspect-ratio:11/7;position:absolute;inset:0;margin:0}
.usmap .st{position:relative;border-radius:3px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .15s ease,filter .15s ease;border:1px solid transparent}
.usmap .st:hover,.usmap .st:focus-visible{transform:scale(1.1);filter:brightness(1.25);z-index:2}
.usmap .st span{font-family:var(--mono);font-size:.56rem;pointer-events:none}
.usmap .st-restrict{background:rgba(74,217,255,.30);border-color:rgba(74,217,255,.6)}
.usmap .st-restrict span{color:#eafbff;font-weight:600}
.usmap .st-gap{background:rgba(150,170,220,.10);border-color:rgba(150,170,220,.22)}
.usmap .st-gap span{color:#aab3c6}
.maptip{margin-top:16px;font-family:var(--mono);font-size:.78rem;color:var(--dim);min-height:1.4em}
.uvdiagram{width:100%;max-width:44rem;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:rgba(150,170,220,.06);border:1px solid var(--line-dark);margin-bottom:6px}
.uvdiagram canvas{width:100%;height:100%;display:block}
.tl{display:grid;grid-template-columns:6rem minmax(0,58ch);gap:22px;padding:16px 0;border-top:1px solid var(--line-dark);align-items:baseline}
.tl:last-of-type{border-bottom:1px solid var(--line-dark)}
@media(max-width:640px){.tl{grid-template-columns:4.4rem 1fr;gap:14px}}
.tl time{font-family:var(--mono);font-size:.9rem;color:var(--dim)}
.tl p{font-size:.96rem;line-height:1.6}
.tl.out time,.tl.out p{color:#ff9b7c}
.quote{font-family:var(--display);font-size:clamp(1.6rem,4vw,2.5rem);line-height:1.16;font-weight:200}
.quote em{font-style:italic;color:#ff9b7c}
.carve{padding:24px 0;border-top:1px solid var(--line-dark);max-width:48rem}

/* ---------- phototherapy panel ---------- */
.phtab{position:fixed;right:0;top:50%;transform:translateY(-50%);z-index:75;background:rgba(74,217,255,.14);border:1px solid rgba(74,217,255,.5);border-right:0;border-radius:8px 0 0 8px;color:#fff;font-family:var(--mono);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;padding:14px 8px;writing-mode:vertical-rl;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .5s ease}
.phtab.show{opacity:1;pointer-events:auto}
.panel{position:fixed;inset:0 0 0 auto;width:min(92vw,26rem);background:var(--midnight2);border-left:1px solid var(--line-dark);z-index:90;transform:translateX(100%);transition:transform .4s cubic-bezier(.2,.8,.2,1);overflow-y:auto;padding:34px 28px}
.panel.open{transform:none}
.panel h3{font-size:1.5rem;margin-bottom:6px}
.panelclose{background:none;border:1px solid var(--line-dark);color:var(--dim);font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:8px 14px;border-radius:999px;cursor:pointer;margin-bottom:26px}
.compare{display:flex;flex-direction:column;gap:22px;margin-top:20px}
.compare .side{border-top:1px solid var(--line-dark);padding-top:14px}
.compare .side b{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:8px}
.compare .side.cos b{color:var(--desire1)}
.compare .side.med b{color:var(--uvb)}
.compare ul{margin:0;padding-left:1.1em;font-size:.9rem;line-height:1.7;color:#ccd2de}
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:85;opacity:0;pointer-events:none;transition:opacity .4s ease}
.overlay.show{opacity:1;pointer-events:auto}

/* ---------- mood shift ivory ---------- */
.ivory{background:var(--ivory);color:var(--ink)}
.ivory .label{color:#9c8f83}
.ivory h2,.ivory h3{color:var(--ink)}

/* ---------- four-part framework ---------- */
.frame{display:flex;flex-direction:column}
.fitem{display:grid;grid-template-columns:6.5rem minmax(0,1fr);gap:clamp(16px,4vw,40px);padding:34px 0;border-top:1px solid var(--line-light);align-items:start}
.fitem:last-child{border-bottom:1px solid var(--line-light)}
@media(max-width:680px){.fitem{grid-template-columns:1fr;gap:8px}}
.fnum{font-family:var(--display);font-size:clamp(2.4rem,6vw,3.6rem);font-weight:200;color:rgba(30,20,16,.22);line-height:1}
.fbody h3{font-size:1.3rem;margin-bottom:8px}
.fbody p{font-size:.98rem;line-height:1.6;color:#4a423e;max-width:58ch}
.flink{display:inline-block;margin-top:12px;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#8a5a3c;text-decoration:none;border-bottom:1px solid rgba(138,90,60,.4)}

/* ---------- evidence drawer ---------- */
.evdrawer{position:fixed;inset:0 0 0 auto;width:min(92vw,26rem);background:#fffdf9;color:var(--ink);border-left:1px solid var(--line-light);z-index:95;transform:translateX(100%);transition:transform .4s cubic-bezier(.2,.8,.2,1);overflow-y:auto;padding:34px 28px}
.evdrawer.open{transform:none}
.evdrawer h3{font-size:1.25rem;margin-bottom:14px;color:var(--ink)}
.evdrawer .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:#8a5a3c;margin-top:16px}
.evdrawer p{font-size:.92rem;line-height:1.6;color:#4a423e;margin-top:4px}
.evdrawer a{color:#8a5a3c}

/* ---------- team ---------- */
.people{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 32px;max-width:76rem}
@media(max-width:1100px){.people{grid-template-columns:repeat(3,minmax(0,1fr));max-width:62rem}}
@media(max-width:640px){.people{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.people{grid-template-columns:1fr;max-width:22rem}}
.pn{display:flex;align-items:center;gap:18px}
.plate{width:5rem;height:5rem;border-radius:50%;overflow:hidden;position:relative;flex:none;background:linear-gradient(180deg,#171b2e 0%,#080a12 100%);display:flex;align-items:center;justify-content:center}
.plate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.3) contrast(1.06) brightness(.85)}
.plate .mono{font-family:var(--display);font-size:1.35rem;color:rgba(226,216,255,.72)}
.pn .who b{font-family:var(--display);font-weight:300;font-size:1.18rem;display:block;line-height:1.2}
.pn .who .cr{font-family:var(--mono);font-size:.68rem;margin-top:3px;color:var(--dimmer);display:block}
.pn .who .inst{font-size:.86rem;color:var(--dim);display:block;margin-top:3px;line-height:1.35}

/* ---------- final action ---------- */
.paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;background:var(--line-dark);margin-top:40px}
@media(max-width:680px){.paths{grid-template-columns:1fr}}
.path{background:var(--midnight);padding:38px 30px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;transition:background .25s ease}
.path:hover{background:#0d1020}
.path .pn2{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;color:var(--uva)}
.path .pt{font-family:var(--display);font-size:clamp(1.3rem,3vw,1.8rem);font-weight:300}
.path .pd{font-size:.86rem;color:var(--dim)}

.cta{display:inline-block;font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;background:linear-gradient(92deg,rgba(255,90,68,.25),rgba(166,132,255,.16));border:1px solid var(--action);color:#fff;padding:14px 24px;border-radius:999px;cursor:pointer;transition:transform .2s ease,box-shadow .25s ease}
.cta:hover{transform:translateY(-2px);box-shadow:0 14px 34px -16px rgba(255,90,68,.7)}

.foot{border-top:1px solid var(--line-dark);padding:44px 0 76px}
.foot a{color:var(--dim)}
.refs{display:flex;flex-direction:column;gap:8px}
.refs p{font-family:var(--mono);font-size:.72rem;line-height:1.65;color:var(--dimmer);max-width:86ch}
.navlinks{display:flex;flex-wrap:wrap;gap:16px;font-family:var(--mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase}
.navlinks a{text-decoration:none;border-bottom:1px solid var(--line-dark);padding-bottom:2px}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .rise{opacity:1;transform:none}
  .sig-cta{animation:none}
}

/* annotated UV cross-section */
.uvstage{position:relative;width:100%;max-width:44rem}
.uvlabels{position:absolute;inset:0;pointer-events:none}
.uvlab{position:absolute;left:2%;font-family:var(--mono);font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;display:flex;align-items:center;gap:8px}
.uvlab:before{content:"";width:26px;height:1px;background:currentColor;opacity:.6}
.uvlab.l1{top:20%;color:#cfd6e4}
.uvlab.l2{top:45%;color:#4ad9ff}
.uvlab.l3{top:74%;color:#a684ff}
.uvlab em{font-style:normal;opacity:.62;margin-left:6px}
.uvkey{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:10px;font-family:var(--mono);font-size:.68rem;color:var(--dimmer)}
.uvkey b{font-weight:500}
.uvkey .uvb{color:#4ad9ff}
.uvkey .uva{color:#a684ff}
@media(max-width:620px){.uvlab{font-size:.54rem}.uvlab:before{width:14px}}
.ledger{display:flex;flex-direction:column;max-width:56rem;border-top:1px solid var(--line-dark)}
.ledger-head{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(14px,3vw,36px);padding:12px 0;font-family:var(--mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dimmer);border-bottom:1px solid var(--line-dark)}
.ledger-row{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(14px,3vw,36px);padding:22px 0;border-bottom:1px solid var(--line-dark);align-items:baseline}
.ledger-row .lgl{font-family:var(--display);font-size:clamp(1.15rem,2.4vw,1.6rem);font-weight:200;color:var(--desire1);line-height:1.25}
.ledger-row .lgr{font-size:.98rem;line-height:1.6;color:#ccd2de}
@media(max-width:640px){.ledger-head{display:none}.ledger-row{grid-template-columns:1fr;gap:8px;padding:18px 0}}
html.rtl body{direction:rtl}
html.rtl .topnav,html.rtl .nav{flex-direction:row-reverse}
html.rtl .langsel{margin-left:0;margin-right:auto}
html.rtl .uvlab{left:auto;right:3%;flex-direction:row-reverse}
html.rtl .tl,html.rtl .fitem,html.rtl .ledger-row,html.rtl .ledger-head{direction:rtl}

.fig{max-width:46rem;margin:0}
.figlabel{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dimmer);margin-bottom:14px}
.figlabel.light{color:#9c8f83}
.figsvg{width:100%;height:auto;display:block;overflow:visible}
.figsrc{font-family:var(--mono);font-size:.72rem;line-height:1.65;color:var(--dimmer);margin-top:12px;max-width:64ch}
.figsrc.light{color:#8a7f83}

.pquote{margin:0;max-width:44rem;border-left:2px solid var(--uva);padding:4px 0 4px 26px}
.pquote blockquote{margin:0;font-family:var(--display);font-weight:200;font-size:clamp(1.5rem,3.6vw,2.2rem);line-height:1.2;color:#f2f4f8}
.pquote figcaption{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dimmer);margin-top:14px}
.calc{max-width:46rem;border:1px solid var(--line-dark);border-radius:12px;padding:26px 24px;background:rgba(150,170,220,.05)}
.calcform{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:22px}
@media(max-width:640px){.calcform{grid-template-columns:1fr;gap:18px}}
.calcform fieldset{border:0;padding:0;margin:0;display:flex;flex-direction:column;gap:9px}
.calcform legend{font-size:.95rem;color:#e3e7ef;margin-bottom:10px;padding:0}
.calcform label{display:flex;align-items:center;gap:9px;font-size:.92rem;color:#ccd2de;cursor:pointer}
.calcform input{accent-color:var(--uvb);width:16px;height:16px}
.calcout{border-top:1px solid var(--line-dark);padding-top:20px}
.riskbig{font-family:var(--display);font-size:clamp(1.7rem,4.4vw,2.6rem);font-weight:200;color:#fff;line-height:1.1}
.riskci{font-family:var(--mono);font-size:.78rem;color:var(--uvb);margin-top:6px}
.risktext{font-size:.98rem;line-height:1.6;color:#ccd2de;margin-top:12px;max-width:58ch}
.risksrc{font-family:var(--mono);font-size:.72rem;color:var(--dimmer);margin-top:10px}
.risknote{font-size:.86rem;line-height:1.6;color:var(--dim);margin-top:14px;max-width:60ch;border-left:2px solid rgba(255,138,104,.5);padding-left:12px}

/* global experience */
.world{display:flex;flex-direction:column;max-width:62rem;border-top:1px solid var(--line-dark)}
.wrow{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,1fr);gap:clamp(14px,3vw,36px);padding:26px 0;border-bottom:1px solid var(--line-dark);align-items:start}
.wrow .wname{font-family:var(--display);font-size:clamp(1.2rem,2.6vw,1.7rem);font-weight:200;color:#f2f4f8;line-height:1.2}
.wrow .wyear{font-family:var(--mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--uvb);display:block;margin-top:8px}
.wrow .wbody{font-size:.98rem;line-height:1.62;color:#ccd2de}
.wrow .wsrc{font-family:var(--mono);font-size:.72rem;line-height:1.6;color:var(--dimmer);margin-top:10px}
.wrow.caution .wyear{color:#ff9d6c}
@media(max-width:640px){.wrow{grid-template-columns:1fr;gap:8px;padding:20px 0}}

/* numbered explainer steps */
.steps{display:flex;flex-direction:column;max-width:58rem}
.step{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:18px;padding:22px 0;border-top:1px solid var(--line-dark);align-items:start}
.step:last-child{border-bottom:1px solid var(--line-dark)}
.step .sn{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--uva);padding-top:5px}
.step.no .sn{color:#ff9d6c}
.step b{display:block;font-family:var(--display);font-weight:300;font-size:1.16rem;color:#f2f4f8;margin-bottom:6px;line-height:1.3}
.step p{font-size:.96rem;line-height:1.62;color:#ccd2de;max-width:64ch}
@media(max-width:560px){.step{grid-template-columns:1fr;gap:6px}}

/* ---------- per-language typography ---------- */
html[lang="fa"],html[lang="ar"]{
  --display:"Vazirmatn",ui-sans-serif,system-ui,sans-serif;
  --sans:"Vazirmatn",ui-sans-serif,system-ui,sans-serif;
  --mono:"Vazirmatn",ui-monospace,Menlo,monospace;
}
html[lang="hi"]{
  --display:"IBM Plex Sans Devanagari","IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --sans:"IBM Plex Sans Devanagari","IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;
  --mono:"IBM Plex Sans Devanagari","IBM Plex Mono",ui-monospace,Menlo,monospace;
}
html[lang="zh"]{
  --display:"Noto Serif SC",ui-serif,Georgia,serif;
  --sans:"Noto Sans SC",ui-sans-serif,system-ui,sans-serif;
  --mono:"Noto Sans SC",ui-monospace,Menlo,monospace;
}
/* letter-spacing breaks Arabic/Persian joining and Devanagari conjuncts; these scripts also need more leading */
html[lang="fa"] *,html[lang="ar"] *,html[lang="hi"] *,html[lang="zh"] *{letter-spacing:normal!important}
html[lang="fa"] body,html[lang="ar"] body,html[lang="hi"] body{line-height:1.85}
html[lang="zh"] body{line-height:1.9}
html[lang="fa"] .lede,html[lang="ar"] .lede,html[lang="hi"] .lede,html[lang="zh"] .lede,
html[lang="fa"] .note,html[lang="ar"] .note,html[lang="hi"] .note,html[lang="zh"] .note,
html[lang="fa"] .step p,html[lang="ar"] .step p,html[lang="hi"] .step p,html[lang="zh"] .step p,
html[lang="fa"] .wrow .wbody,html[lang="ar"] .wrow .wbody,html[lang="hi"] .wrow .wbody,html[lang="zh"] .wrow .wbody,
html[lang="fa"] .myth-a p,html[lang="ar"] .myth-a p,html[lang="hi"] .myth-a p,html[lang="zh"] .myth-a p,
html[lang="fa"] .fbody p,html[lang="ar"] .fbody p,html[lang="hi"] .fbody p,html[lang="zh"] .fbody p{line-height:1.9}
html[lang="fa"] h1,html[lang="ar"] h1,html[lang="hi"] h1,html[lang="zh"] h1,
html[lang="fa"] h2,html[lang="ar"] h2,html[lang="hi"] h2,html[lang="zh"] h2,
html[lang="fa"] .hero-h1,html[lang="ar"] .hero-h1,html[lang="hi"] .hero-h1,html[lang="zh"] .hero-h1,
html[lang="fa"] .quote,html[lang="ar"] .quote,html[lang="hi"] .quote,html[lang="zh"] .quote{line-height:1.35;font-weight:300}
html[lang="zh"] h1,html[lang="zh"] h2,html[lang="zh"] .hero-h1,html[lang="zh"] .quote{font-weight:400}
html[lang="fa"] .myth-q,html[lang="ar"] .myth-q,html[lang="hi"] .myth-q,html[lang="zh"] .myth-q,
html[lang="fa"] .ledger-row .lgl,html[lang="ar"] .ledger-row .lgl,html[lang="hi"] .ledger-row .lgl,html[lang="zh"] .ledger-row .lgl,
html[lang="fa"] .wrow .wname,html[lang="ar"] .wrow .wname,html[lang="hi"] .wrow .wname,html[lang="zh"] .wrow .wname{line-height:1.5;font-weight:400}
html[lang="fa"] .figsvg text,html[lang="ar"] .figsvg text,html[lang="hi"] .figsvg text,html[lang="zh"] .figsvg text{font-family:var(--sans)}
.myth-q .mq:before{content:"\201C"}
.myth-q .mq:after{content:"\201D"}
html.rtl .myth-q .mq:before{content:"\00AB"}
html.rtl .myth-q .mq:after{content:"\00BB"}
html[lang="zh"] .myth-q .mq:before{content:"\201C"}
html[lang="zh"] .myth-q .mq:after{content:"\201D"}

/* Bidirectional text. SVG figure geometry stays LTR so text-anchor and x
   coordinates mean the same thing in every language; each label resolves its
   own reading direction from its first strong character. English-only blocks
   (citations, sources) do the same so trailing punctuation does not jump. */
.figsvg{direction:ltr}
.figsvg text{unicode-bidi:plaintext}
.figsrc,.wsrc{unicode-bidi:plaintext}

/* The top bar is sticky, so a section reached by anchor or by one of the
   readable chapter paths must start below it rather than under it. */
section[id],main[id]{scroll-margin-top:76px}

/* Each member's name links to their full entry on the profiles page. It should
   read as a name first and a link second, so the underline only appears on
   hover or keyboard focus. */
.pnlink{color:inherit;text-decoration:none;border-bottom:1px solid transparent}
.pnlink:hover,.pnlink:focus-visible{border-bottom-color:currentColor}

/* Subscription. Logical properties throughout so the form reads correctly in
   Arabic and Persian without a separate RTL block. */
.sub{max-width:38rem;margin:56px auto 0;padding:32px;border:1px solid var(--line-dark);background:rgba(255,255,255,.03)}
.sub h3{margin:6px 0 10px;font-family:var(--display);font-weight:300;font-size:1.5rem;line-height:1.2}
.sub .note{margin:0 0 18px}
#subForm{display:flex;flex-direction:column;gap:14px}
.subrow{display:flex;gap:14px;flex-wrap:wrap}
.subrow .subfield{flex:1 1 12rem}
.subfield{display:flex;flex-direction:column;gap:6px}
.subfield span{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.subfield input{width:100%;padding:11px 13px;background:rgba(0,0,0,.35);border:1px solid var(--line-dark);color:#fff;font-family:var(--sans);font-size:.95rem;border-radius:2px}
.subfield input:focus-visible{outline:2px solid var(--uva);outline-offset:1px;border-color:transparent}
.subcheck{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;color:var(--dim);line-height:1.5}
.subcheck input{margin-top:3px;flex:0 0 auto;width:16px;height:16px;accent-color:var(--uva)}
#subBtn{align-self:flex-start;padding:12px 26px;background:var(--uva);color:#05060b;border:0;border-radius:2px;font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
#subBtn:hover:not(:disabled){filter:brightness(1.12)}
#subBtn:disabled{opacity:.55;cursor:default}
.subout{margin:0;font-size:.88rem;line-height:1.5;min-height:1.2em}
.subout.err{color:#ff9d6c}
.subout.good{color:var(--uva)}
.subnote{margin:18px 0 0;font-size:.78rem;opacity:.75}
@media (max-width:560px){.sub{padding:24px 20px}.subrow{flex-direction:column}}
