/* Tokens lifted from the live conexeu.com Webflow stylesheet. Dark is the
   brand's own ground (--dark-teal-green); light is its --pearl surface. */
:root{
  --ground:#042A23; --panel:#0B463B; --sunk:#062F28; --raise:#0E4E42;
  --line:#2A695D; --hair:#1B5548;
  --ink:#F8F7F3; --ink2:#C9DFD7; --ink3:#8FB3A7;
  --gold:#D4A041; --gold-lift:#E5B45C; --yellow:#FBE67B;
  --coral:#FF8C73; --rose:#FF8BA4; --violet:#A894FF; --azure:#6AB6FF;
  --sea:#0D9279; --leaf:#54DEA5;
  --shade:0 18px 44px -22px rgba(0,0,0,.62), 0 2px 6px -3px rgba(0,0,0,.5);
  --shade-lo:0 8px 20px -14px rgba(0,0,0,.55);
  --r-s:15px; --r-m:20px; --r-l:30px;
  --display:"ivypresto-display","Bodoni Moda",Georgia,"Times New Roman",serif;
  --text:"Pp NeueMontreal","Inter","Helvetica Neue",Arial,sans-serif;
  --pad:clamp(20px,4vw,54px);
}
:root[data-theme="light"]{
  --ground:#F8F7F3; --panel:#FFFFFF; --sunk:#EFEEE7; --raise:#FFFFFF;
  --line:#D6DDD5; --hair:#E4E7E0;
  --ink:#042A23; --ink2:#2F4A42; --ink3:#5E7A70;
  --gold:#9A6B1A; --gold-lift:#7E5612; --yellow:#8A7212;
  --coral:#C2472C; --rose:#B34162; --violet:#5A44C8; --azure:#0B62B8;
  --sea:#0A6B58; --leaf:#0A6B4C;
  --shade:0 20px 46px -26px rgba(4,42,35,.24), 0 2px 6px -3px rgba(4,42,35,.14);
  --shade-lo:0 10px 22px -16px rgba(4,42,35,.22);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background:var(--ground);color:var(--ink);font-family:var(--text);
  font-size:17px;line-height:1.62;font-weight:350;
  font-feature-settings:"cv05" 1,"ss03" 1;
  -webkit-font-smoothing:antialiased;
}
/* Browser surfaces theming */
::selection{background:var(--gold);color:#08211C}
:root[data-theme="light"] ::selection{background:#F2D8A2;color:#042A23}
:focus-visible{outline:2px solid var(--gold-lift);outline-offset:3px;border-radius:4px}
*{scrollbar-color:var(--line) transparent;scrollbar-width:thin}
*::-webkit-scrollbar{height:10px;width:10px}
*::-webkit-scrollbar-thumb{background:var(--line);border-radius:20px;border:3px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:var(--sea);border:3px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}
html{caret-color:var(--gold)}
a{color:inherit}
img,svg{max-width:100%}
.ico{width:18px;height:18px;flex:0 0 auto}
.ico.xs{width:14px;height:14px}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#08211C;padding:10px 16px;border-radius:0 0 var(--r-s) 0;z-index:99;font-weight:500}
.skip:focus{left:0}

/* ─────────────────────────────────────────────── topbar */
.topbar{
  position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:18px;
  padding:14px var(--pad);background:color-mix(in oklab,var(--ground) 88%,transparent);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--hair);
}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:0 0 auto}
.brand img{display:block;height:20px;width:auto}
:root[data-theme="light"] .brand img{filter:invert(1) hue-rotate(150deg) saturate(1.6) brightness(.42)}
.bsub{
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);
  padding-left:12px;border-left:1px solid var(--line);white-space:nowrap
}
.nv{display:flex;gap:2px;margin-left:auto;min-width:0;overflow-x:auto;
  scrollbar-width:none;-webkit-overflow-scrolling:touch}
.nv::-webkit-scrollbar{display:none}
.nv a{
  display:flex;flex-direction:column;gap:1px;text-decoration:none;padding:7px 10px;flex:0 0 auto;
  border-radius:10px;white-space:nowrap;transition:background .18s cubic-bezier(.2,.8,.2,1),color .18s
}
.nvn{font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink3);
  font-variant-numeric:tabular-nums}
.nvt{font-size:13.5px;color:var(--ink2)}
.nv a:hover{background:var(--sunk)}
.nv a:hover .nvt{color:var(--ink)}
.nv a[aria-current]{background:var(--panel)}
.nv a[aria-current] .nvt{color:var(--ink);font-weight:500}
.nv a[aria-current] .nvn{color:var(--gold)}
.tog{
  display:flex;align-items:center;gap:7px;flex:0 0 auto;background:transparent;
  border:1px solid var(--line);color:var(--ink2);border-radius:99px;
  padding:7px 13px 7px 10px;font:inherit;font-size:12.5px;cursor:pointer;
  transition:border-color .18s,color .18s
}
.tog:hover{border-color:var(--gold);color:var(--ink)}

/* ─────────────────────────────────────────────── shell */
.wrap{display:grid;grid-template-columns:minmax(0,1fr);max-width:1600px;margin:0 auto}
@media (min-width:1120px){
  .wrap{grid-template-columns:246px minmax(0,1fr);gap:0}
}
main{
  min-width:0;padding:clamp(40px,6vw,90px) var(--pad) 0;
  max-width:1180px
}

/* ─────────────────────────────────────────────── rail */
.rail{display:none}
@media (min-width:1120px){
  .rail{
    display:block;position:sticky;top:66px;align-self:start;
    height:calc(100vh - 66px);padding:clamp(40px,6vw,90px) 0 40px 34px;
    overflow-y:auto
  }
  .rail .thread{position:absolute;left:34px;top:clamp(40px,6vw,90px);width:6px;height:calc(100% - 130px)}
  .thread path{fill:none;stroke-width:1.1;vector-effect:non-scaling-stroke}
  .thread .tbase{stroke:var(--hair)}
  .thread .tfill{stroke:var(--gold);
    clip-path:inset(0 0 var(--unread,100%) 0);
    transition:clip-path .14s linear}
  .rail a{
    display:flex;gap:14px;align-items:flex-start;text-decoration:none;
    padding:8px 12px 8px 0;position:relative;color:var(--ink3);font-size:13px;line-height:1.4
  }
  .rdot{
    width:7px;height:7px;border-radius:99px;background:var(--hair);margin:6px 0 0 -3.5px;
    flex:0 0 auto;position:relative;z-index:2;transition:background .2s,box-shadow .2s
  }
  .rail a:hover{color:var(--ink2)}
  .rail a.on{color:var(--ink)}
  .rail a.on .rdot{background:var(--gold);box-shadow:0 0 0 4px color-mix(in oklab,var(--gold) 22%,transparent)}
}

/* ─────────────────────────────────────────────── type */
h1,h2,h3,h4,h5{font-family:var(--display);font-weight:400;letter-spacing:-.012em}
h1{
  font-size:clamp(2.6rem,6.2vw,4.7rem);line-height:1.03;margin:.1em 0 .34em;
  text-wrap:balance;letter-spacing:-.026em
}
h2{
  font-size:clamp(1.9rem,3.4vw,2.62rem);line-height:1.12;margin:0 0 .5em;
  text-wrap:balance;letter-spacing:-.018em
}
h3{font-size:clamp(1.3rem,2vw,1.62rem);line-height:1.22;margin:2.6em 0 .5em;text-wrap:balance}
h4{font-size:1.24rem;line-height:1.3;margin:2.2em 0 .45em;font-weight:500}
h5{font-size:1.06rem;line-height:1.3;margin:0 0 .4em;font-weight:500}
p{margin:0 0 1.05em;max-width:70ch}
.eyebrow{
  font-family:var(--text);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin:0 0 1.1em;font-weight:500
}
.lede{font-size:1.2rem;line-height:1.52;color:var(--ink2);max-width:64ch}
.note{font-size:14px;color:var(--ink3);max-width:76ch;border-top:1px solid var(--hair);padding-top:.9em}
code{
  font-family:"Pp NeueMontreal","Inter",Arial,sans-serif;font-size:.92em;
  letter-spacing:.005em;color:var(--gold);background:var(--sunk);
  border:1px solid var(--hair);border-radius:6px;padding:.08em .38em;
  word-break:break-word
}
:root[data-theme="light"] code{background:var(--sunk);border-color:var(--line)}
.flabel{
  font-family:var(--text);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink3);margin:0 0 .7em;font-weight:500
}

/* ─────────────────────────────────────────────── hero */
.hero{padding-bottom:clamp(30px,4vw,52px);border-bottom:1px solid var(--hair);margin-bottom:clamp(46px,6vw,84px)}
.hkick{
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);
  margin:0;font-variant-numeric:tabular-nums
}
.hero .stand{font-size:clamp(1.06rem,1.6vw,1.3rem);line-height:1.5;color:var(--ink2);max-width:62ch;margin:0}
.hmeta{
  display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:1.8em 0 0
}
.hmeta li{
  font-size:12.5px;color:var(--ink2);border:1px solid var(--line);
  border-radius:99px;padding:5px 13px;font-variant-numeric:tabular-nums
}
.heroidx h1{font-size:clamp(3rem,8.4vw,6rem)}

/* ─────────────────────────────────────────────── groups */
.grp{scroll-margin-top:84px;padding-bottom:clamp(48px,6vw,86px)}
.grp+.grp{border-top:1px solid var(--hair);padding-top:clamp(48px,6vw,80px)}
main>.grp:last-of-type{padding-bottom:clamp(18px,2vw,26px)}

/* ─────────────────────────────────────────────── lists */
.rules,.seq,.do,.dont{padding:0;margin:1.5em 0 1.7em;max-width:74ch}
.rules{list-style:none}
.rules li{position:relative;padding:0 0 .95em 26px;border-bottom:1px solid var(--hair);margin-bottom:.95em}
.rules li:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.rules li::before{
  content:"";position:absolute;left:2px;top:.62em;width:9px;height:1.5px;background:var(--gold)
}
.seq{list-style:none;counter-reset:s}
.seq li{position:relative;padding:0 0 1em 40px;counter-increment:s}
.seq li::before{
  content:counter(s,decimal-leading-zero);position:absolute;left:0;top:.06em;
  font-family:var(--text);font-size:11.5px;letter-spacing:.06em;color:var(--gold);
  font-variant-numeric:tabular-nums;font-weight:500;
  border:1px solid var(--line);border-radius:8px;width:28px;height:24px;
  display:grid;place-items:center
}
.do,.dont{list-style:none}
.do li,.dont li{display:flex;gap:11px;align-items:flex-start;padding:.5em 0;line-height:1.5}
.do .ico{color:var(--leaf);margin-top:.28em}
.dont .ico{color:var(--coral);margin-top:.28em}

/* ─────────────────────────────────────────────── verdict / callout */
.verdict{
  background:var(--panel);border-radius:var(--r-m);padding:clamp(22px,3vw,34px);
  margin:1.9em 0 2.1em;box-shadow:var(--shade-lo);border:1px solid var(--hair)
}
.verdict .big{
  font-family:var(--display);font-size:clamp(1.4rem,2.5vw,1.94rem);line-height:1.18;
  letter-spacing:-.018em;color:var(--ink);margin:0 0 .7em;max-width:38ch;text-wrap:balance
}
.verdict p:last-child{margin-bottom:0}
.verdict p{color:var(--ink2)}
.callout{
  border:1px solid var(--line);border-radius:var(--r-s);padding:20px 22px;margin:1.8em 0;
  background:var(--sunk)
}
.callout .ctitle{
  display:flex;gap:9px;align-items:center;font-size:12px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--gold);margin:0 0 .7em;font-weight:500
}
.callout p:last-child{margin-bottom:0}
.callout.risk{border-color:color-mix(in oklab,var(--coral) 44%,var(--line))}
.callout.risk .ctitle{color:var(--coral)}
.callout.win{border-color:color-mix(in oklab,var(--leaf) 40%,var(--line))}
.callout.win .ctitle{color:var(--leaf)}

/* ─────────────────────────────────────────────── cards / stats / spec */
.cards{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(228px,1fr));margin:1.7em 0 2em}
.card{background:var(--panel);border:1px solid var(--hair);border-radius:var(--r-s);padding:19px 20px}
.card h5{color:var(--ink)}
.card p{margin:0;font-size:15px;color:var(--ink2)}
.statrow{display:grid;gap:1px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  margin:2em 0;background:var(--hair);border:1px solid var(--hair);border-radius:var(--r-s);overflow:hidden}
.stat{background:var(--ground);padding:22px 20px}
.statn{font-family:var(--display);font-size:clamp(2rem,3.5vw,2.9rem);line-height:1;margin:0 0 .28em;
  color:var(--gold);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.statl{margin:0 0 .3em;font-size:14.5px;font-weight:500;color:var(--ink)}
.stats{margin:0;font-size:13px;color:var(--ink3);line-height:1.45}
.spec{display:grid;gap:1px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  margin:1.9em 0;background:var(--hair);border:1px solid var(--hair);border-radius:var(--r-s);overflow:hidden}
.spec>div{background:var(--panel);padding:18px 19px}
.spec dt{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:.6em}
.spec dd{margin:0}
.spec dd b{display:block;font-family:var(--display);font-size:1.5rem;line-height:1.1;color:var(--ink);
  font-weight:400;font-variant-numeric:tabular-nums;margin-bottom:.32em;letter-spacing:-.02em}
.spec dd small{display:block;font-size:13px;color:var(--ink2);line-height:1.45}

/* ─────────────────────────────────────────────── tables */
.tablewrap{
  overflow-x:auto;margin:1.9em 0 .8em;border:1px solid var(--hair);border-radius:var(--r-s);
  background:var(--panel)
}
table{border-collapse:collapse;width:100%;font-size:14.5px;min-width:640px}
th,td{text-align:left;padding:12px 15px;border-bottom:1px solid var(--hair);vertical-align:top}
thead th{
  font-family:var(--text);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ink3);font-weight:500;background:var(--sunk);position:sticky;top:0;z-index:2;
  white-space:nowrap
}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--sunk)}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tcap{font-size:12.5px;color:var(--ink3);margin:0 0 2em;max-width:80ch;line-height:1.5}
tr.hi{background:color-mix(in oklab,var(--gold) 8%,transparent)}
tr.lo td{color:var(--ink3)}

/* ─────────────────────────────────────────────── evidence table */
.ev{margin:2em 0 1em}
.evbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{
  display:inline-flex;gap:6px;align-items:center;background:transparent;border:1px solid var(--line);
  color:var(--ink3);border-radius:99px;padding:5px 12px;font:inherit;font-size:12.5px;cursor:pointer;
  transition:border-color .16s,color .16s,background .16s
}
.chip:hover{color:var(--ink2);border-color:var(--ink3)}
.chip.on{background:var(--gold);border-color:var(--gold);color:#08211C;font-weight:500}
.chip.on .ico{color:#08211C}
.evcount{margin:0 0 0 auto;font-size:12.5px;color:var(--ink3);font-variant-numeric:tabular-nums}
.evtable table{min-width:820px}
.evtable th,.evtable td{padding:12px 12px}
.evtable thead th.n{white-space:normal;max-width:92px}
.evtable .c-what{min-width:210px}
.evtable thead th[data-sort]{cursor:pointer;user-select:none}
.evtable thead th[data-sort]:hover{color:var(--ink)}
.evtable thead th[data-sort]::after{
  content:"";display:inline-block;width:0;height:0;margin-left:6px;vertical-align:middle;
  border:4px solid transparent;border-top-color:currentColor;opacity:.28
}
.evtable thead th.sasc::after{border-top-color:transparent;border-bottom-color:var(--gold);opacity:1;
  transform:translateY(-2px)}
.evtable thead th.sdesc::after{border-top-color:var(--gold);opacity:1}
.c-who{white-space:nowrap}
.c-who .pill{
  display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;
  background:var(--sunk);border:1px solid var(--hair);color:var(--ink2);margin-right:10px;
  vertical-align:top
}
.whowrap{display:inline-flex;flex-direction:column;vertical-align:top}
.whowrap b{font-weight:500}
.whowrap a{text-decoration:none;border-bottom:1px solid color-mix(in oklab,var(--gold) 46%,transparent);
  text-underline-offset:3px}
.whowrap a:hover{border-bottom-color:var(--gold)}
.whowrap small{color:var(--ink3);font-size:12px}
.c-what{min-width:250px;color:var(--ink2)}
.tag{
  display:inline-block;font-size:11px;letter-spacing:.05em;padding:3px 9px;border-radius:99px;
  border:1px solid var(--line);color:var(--ink2);white-space:nowrap
}
tr[data-hero] .c-eng{color:var(--gold);font-weight:500}
tr[data-hero]{background:color-mix(in oklab,var(--gold) 7%,transparent)}
tr.gone{display:none}

/* ─────────────────────────────────────────────── format accordion */
.fmts{margin:2em 0 1.4em;border:1px solid var(--hair);border-radius:var(--r-m);overflow:hidden;
  background:var(--panel)}
.fmt+.fmt{border-top:1px solid var(--hair)}
.fhead{
  display:grid;grid-template-columns:44px minmax(0,1fr) auto auto 22px;gap:16px;align-items:center;
  width:100%;background:transparent;border:0;color:inherit;font:inherit;text-align:left;
  padding:19px 20px;cursor:pointer;transition:background .18s
}
.fhead:hover{background:var(--sunk)}
.frank{
  font-family:var(--display);font-size:1.5rem;color:var(--gold);font-variant-numeric:tabular-nums;
  letter-spacing:-.03em
}
.fttl{display:flex;flex-direction:column;min-width:0}
.fttl b{font-family:var(--display);font-size:1.24rem;font-weight:400;line-height:1.2;letter-spacing:-.014em}
.fttl small{font-size:13px;color:var(--ink3);line-height:1.4}
.fplats{display:flex;gap:5px}
.pchip{
  display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--sunk);
  border:1px solid var(--hair);color:var(--ink2)
}
.fverdict{
  font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);white-space:nowrap;
  font-weight:500
}
.fchev{color:var(--ink3);transform:rotate(90deg);transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.fmt.open .fchev{transform:rotate(-90deg);color:var(--gold)}
.fbody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .42s cubic-bezier(.16,1,.3,1)}
.fmt.open .fbody{grid-template-rows:1fr}
.fbodyin{overflow:hidden;min-height:0}
.fmt.open .fbodyin{padding:0 20px 24px}
.fmain{display:grid;gap:clamp(18px,3vw,34px);grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
@media (max-width:820px){.fmain{grid-template-columns:minmax(0,1fr)}}
.fwhy p{font-size:15.5px;color:var(--ink2);max-width:58ch}
.fwhy p:last-child{margin-bottom:0}
.fship ol{margin:0;padding-left:1.2em;font-size:14.5px;color:var(--ink2)}
.fship li{margin-bottom:.55em}
.fship li::marker{color:var(--gold)}
.frisk{grid-column:1/-1;border-top:1px solid var(--hair);padding-top:16px;margin-top:4px}
.frisk ul{margin:0;padding-left:1.2em;font-size:14px;color:var(--ink3)}
.frisk li{margin-bottom:.4em}
.frisk li::marker{color:var(--coral)}
.fspec{display:grid;gap:1px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:22px 0 0;
  background:var(--hair);border:1px solid var(--hair);border-radius:var(--r-s);overflow:hidden}
.frow{background:var(--sunk);padding:14px 15px}
.frow dt{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);margin-bottom:.45em}
.frow dd{margin:0;font-size:14px;color:var(--ink);font-variant-numeric:tabular-nums}

/* ─────────────────────────────────────────────── asset strip */
.strip{margin:2.1em 0 1.2em}
.strip>p.flabel{text-transform:none;letter-spacing:0;font-size:14.5px;color:var(--ink2);
  margin-bottom:1em;font-weight:400}
.frames{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.frame{margin:0;border:1px solid var(--hair);border-radius:var(--r-s);overflow:hidden;
  background:var(--panel);display:flex;flex-direction:column}
.frame img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;
  filter:saturate(.88) contrast(1.04)}
.frame figcaption{padding:12px 14px;font-size:12.5px;color:var(--ink3);line-height:1.45}
.frame figcaption b{display:block;color:var(--ink2);font-weight:500;font-size:13px;
  margin-bottom:.25em}
.frame.flagged{border-color:color-mix(in oklab,var(--coral) 46%,var(--line))}
.frame.flagged figcaption b{color:var(--coral)}

/* ─────────────────────────────────────────────── storyboard */
.sb{margin:2.2em 0 1.4em;border:1px solid var(--hair);border-radius:var(--r-m);background:var(--panel);
  overflow:hidden}
.sbtop{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:16px 20px;
  border-bottom:1px solid var(--hair);background:var(--sunk)}
.sbttl{margin:0;font-size:13.5px;color:var(--ink2)}
.sbdots{display:flex;gap:5px;margin-left:auto}
.sbdot{
  width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:transparent;
  color:var(--ink3);font:inherit;font-size:12.5px;cursor:pointer;font-variant-numeric:tabular-nums;
  transition:border-color .16s,color .16s,background .16s
}
.sbdot:hover{color:var(--ink2);border-color:var(--ink3)}
.sbdot.on{background:var(--gold);border-color:var(--gold);color:#08211C;font-weight:500}
.sbstage{display:grid;padding:clamp(20px,3vw,30px);gap:0}
.sbslide{display:none;margin:0;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:clamp(20px,3vw,34px);
  align-items:start}
.sbslide.on{display:grid;animation:fadein .34s cubic-bezier(.16,1,.3,1)}
@media (max-width:760px){.sbslide.on{grid-template-columns:minmax(0,1fr)}}
@keyframes fadein{from{opacity:0;filter:blur(6px)}to{opacity:1;filter:blur(0)}}
@media (prefers-reduced-motion:reduce){.sbslide.on{animation:none}}
.sbframe{
  aspect-ratio:4/5;background:var(--ground);border:1px solid var(--line);border-radius:var(--r-s);
  padding:22px;display:flex;flex-direction:column;box-shadow:var(--shade)
}
.sbrole{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin:0 0 auto}
.sbhead{font-family:var(--display);font-size:1.42rem;line-height:1.14;letter-spacing:-.02em;margin:0 0 .5em;
  text-wrap:balance}
.sbcopy p{font-size:13px;line-height:1.5;color:var(--ink2);margin:0 0 .5em;max-width:none}
.sbfoot{margin:auto 0 0;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.sbslide figcaption{font-size:14.5px;color:var(--ink2);line-height:1.55}
.sbslide figcaption b{color:var(--ink);font-weight:500;display:block;margin-bottom:.3em;
  font-family:var(--display);font-size:1.02rem}

/* ─────────────────────────────────────────────── gap bars */
.gap{margin:2em 0 1em;border:1px solid var(--hair);border-radius:var(--r-m);padding:clamp(20px,3vw,28px);
  background:var(--panel)}
.gapttl{margin:0 0 1.4em;font-size:13.5px;color:var(--ink2)}
.gaprow{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr) 78px;gap:14px;
  align-items:center;padding:9px 0;border-bottom:1px solid var(--hair)}
.gaprow:last-of-type{border-bottom:0}
.gapl{margin:0;font-size:14px;color:var(--ink);font-weight:450}
.gapv{margin:0;text-align:right;font-size:14px;color:var(--ink2);font-variant-numeric:tabular-nums}
.gapn{margin:.2em 0 0;grid-column:2/-1;font-size:12.5px;color:var(--ink3)}
.gapbar{height:9px;border-radius:99px;background:var(--sunk);overflow:hidden}
.gapbar span{display:block;height:100%;width:var(--w);border-radius:99px;background:var(--line);
  transform-origin:left;transform:scaleX(0);transition:transform .9s cubic-bezier(.16,1,.3,1)}
.gap.seen .gapbar span{transform:scaleX(1)}
.gaprow.us .gapbar span{background:var(--gold)}
.gaprow.us .gapl{color:var(--gold);font-weight:500}
.gaprow.near .gapbar span{background:var(--sea)}
.gaprow.far .gapbar span{background:var(--line)}
@media (max-width:640px){.gaprow{grid-template-columns:minmax(0,1fr) 70px}
  .gapbar{grid-column:1/-1;order:3}.gapn{grid-column:1/-1;order:4}}

/* ─────────────────────────────────────────────── tabs */
.tabs{margin:2em 0 1em}
.tbar{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));margin-bottom:24px}
.tbtn{
  display:flex;gap:11px;align-items:center;text-align:left;background:var(--panel);
  border:1px solid var(--hair);border-radius:var(--r-s);padding:14px 16px;color:var(--ink2);
  font:inherit;cursor:pointer;transition:border-color .18s,background .18s,color .18s
}
.tbtn span{display:flex;flex-direction:column;min-width:0}
.tbtn b{font-size:15px;font-weight:500;color:var(--ink)}
.tbtn small{font-size:12px;color:var(--ink3);line-height:1.35}
.tbtn:hover{border-color:var(--ink3)}
.tbtn.on{border-color:var(--gold);background:color-mix(in oklab,var(--gold) 10%,var(--panel))}
.tbtn.on .ico{color:var(--gold)}
.tpane{display:none}
.tpane.on{display:block;animation:fadein .3s cubic-bezier(.16,1,.3,1)}
@media (prefers-reduced-motion:reduce){.tpane.on{animation:none}}
.tpane h3:first-child{margin-top:0}

/* ─────────────────────────────────────────────── plan */
.plan{margin:2em 0 1em;display:grid;gap:14px}
.phase{border:1px solid var(--hair);border-radius:var(--r-m);background:var(--panel);
  padding:clamp(20px,3vw,28px)}
.phase header{border-bottom:1px solid var(--hair);padding-bottom:16px;margin-bottom:6px}
.phwhen{margin:0 0 .3em;font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--gold);
  font-variant-numeric:tabular-nums;font-weight:500}
.phase h4{margin:0 0 .3em}
.phgoal{margin:0;font-size:14.5px;color:var(--ink3);max-width:66ch}
.pitems{list-style:none;margin:0;padding:0}
.pitems li{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;
  padding:14px 0;border-bottom:1px solid var(--hair);flex-wrap:wrap}
.pitems li:last-child{border-bottom:0;padding-bottom:0}
.pitem{display:flex;flex-direction:column;min-width:min(100%,320px);flex:1 1 320px}
.pitem b{font-weight:500;font-size:15px}
.pitem small{font-size:13.5px;color:var(--ink3);line-height:1.5}
.pmeta{display:flex;gap:8px;align-items:center;flex:0 0 auto}
.powner{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);
  border:1px solid var(--line);border-radius:99px;padding:4px 10px;white-space:nowrap}

/* ─────────────────────────────────────────────── post specimens */
.posts{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));margin:2em 0 1em}
.post{
  border:1px solid var(--hair);border-radius:var(--r-m);background:var(--panel);padding:22px;
  display:flex;flex-direction:column;box-shadow:var(--shade-lo)
}
.post.top{border-color:color-mix(in oklab,var(--gold) 48%,var(--line));
  background:linear-gradient(180deg,color-mix(in oklab,var(--gold) 8%,var(--panel)),var(--panel) 40%)}
.post header{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-bottom:14px}
.ppill{display:inline-flex;gap:6px;align-items:center;font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--ink3);border:1px solid var(--line);border-radius:99px;
  padding:3px 10px}
.pwho{margin:0;font-size:15px;font-weight:500;color:var(--ink)}
.pfmt{margin:0;font-size:12.5px;color:var(--ink3)}
.post blockquote{
  margin:0 0 16px;padding:0;font-family:var(--display);font-size:1.18rem;line-height:1.32;
  color:var(--ink);letter-spacing:-.012em;position:relative;padding-left:30px
}
.pq{position:absolute;left:0;top:.18em;width:20px;height:20px;color:var(--gold);opacity:.7}
.post blockquote p{margin:0;max-width:none}
.pmetrics{display:flex;gap:1px;margin:0 0 16px;background:var(--hair);border:1px solid var(--hair);
  border-radius:var(--r-s);overflow:hidden;flex-wrap:wrap}
.pmetrics>div{background:var(--sunk);padding:11px 14px;flex:1 1 84px}
.pmetrics dt{font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);
  margin-bottom:.35em}
.pmetrics dd{margin:0;font-family:var(--display);font-size:1.2rem;color:var(--ink);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.pread p,.ptake p{font-size:14.5px;color:var(--ink2);margin:0 0 .6em;max-width:none}
.pread p:last-child{margin-bottom:0}
.ptake{border-top:1px solid var(--hair);margin-top:14px;padding-top:14px}
.ptake p{color:var(--ink)}
.plink{
  display:inline-flex;gap:7px;align-items:center;margin-top:16px;font-size:13px;color:var(--gold);
  text-decoration:none;border-bottom:1px solid transparent;align-self:flex-start;
  transition:border-color .16s
}
.plink:hover{border-bottom-color:var(--gold)}

/* ─────────────────────────────────────────────── steal plays */
.steals{display:grid;gap:14px;margin:2em 0 1em}
.steal{border:1px solid var(--hair);border-radius:var(--r-m);background:var(--panel);
  padding:clamp(20px,3vw,30px)}
.stealn{margin:0 0 .6em;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);
  font-variant-numeric:tabular-nums;font-weight:500}
.steal h4{margin:0 0 .4em;font-size:clamp(1.24rem,2vw,1.6rem);letter-spacing:-.016em}
.steallede{color:var(--ink2);max-width:70ch;font-size:15.5px}
.stealcols{display:grid;gap:clamp(18px,3vw,32px);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  border-top:1px solid var(--hair);padding-top:20px;margin-top:6px}
.stealcols ul,.stealcols ol{margin:0;padding-left:1.15em;font-size:14.5px;color:var(--ink2)}
.stealcols li{margin-bottom:.55em}
.stealcols ul li::marker{color:var(--ink3)}
.stealcols ol li::marker{color:var(--gold)}
.stealmeasure{margin:20px 0 0;padding-top:16px;border-top:1px solid var(--hair);font-size:14px;
  color:var(--ink2);max-width:none}
.stealmeasure b{color:var(--gold);font-weight:500;letter-spacing:.04em;font-size:11px;
  text-transform:uppercase;margin-right:8px}

/* ─────────────────────────────────────────────── next / foot */
.next{
  display:flex;gap:16px;align-items:center;text-decoration:none;border:1px solid var(--hair);
  border-radius:var(--r-m);padding:22px clamp(20px,3vw,28px);margin:clamp(30px,5vw,54px) 0 0;
  background:var(--panel);transition:border-color .2s,background .2s
}
.next:hover{border-color:var(--gold);background:color-mix(in oklab,var(--gold) 7%,var(--panel))}
.nextin{display:flex;flex-direction:column;min-width:0}
.nextl{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--ink3);
  margin-bottom:.35em;font-variant-numeric:tabular-nums}
.nextt{font-family:var(--display);font-size:1.32rem;line-height:1.2;letter-spacing:-.014em;
  color:var(--ink);text-wrap:balance}
.next .ico{margin-left:auto;color:var(--gold);transition:transform .26s cubic-bezier(.2,.8,.2,1)}
.next:hover .ico{transform:translateX(5px)}
.foot{border-top:1px solid var(--hair);margin-top:clamp(46px,6vw,80px);padding:30px 0 60px;
  font-size:13px;color:var(--ink3)}
.foot p{margin:0 0 .4em;max-width:78ch}
.fmark{font-family:var(--display);font-size:1.06rem;color:var(--ink2);letter-spacing:-.01em}
.fnote{margin-top:1em;line-height:1.55}

/* ─────────────────────────────────────────────── reveal */
.grp>*{opacity:1}
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transform:translateY(14px);filter:blur(3px)}
  .rv.in{opacity:1;transform:none;filter:blur(0);
    transition:opacity .6s cubic-bezier(.16,1,.3,1),transform .6s cubic-bezier(.16,1,.3,1),filter .6s}
}
@media (max-width:640px){
  body{font-size:16px}
  .topbar{gap:10px;padding:11px 16px;flex-wrap:wrap}
  .bsub{display:none}
  .nv{order:3;width:100%;margin:0}
  .heroidx h1{font-size:clamp(2.5rem,11vw,6rem)}
  /* the five-column accordion header collapses to two rows rather than
     squeezing itself 350px tall */
  .fhead{
    grid-template-columns:38px minmax(0,1fr) 20px;
    grid-template-areas:"rank ttl chev" ". verdict verdict";
    row-gap:9px;column-gap:12px;padding:16px
  }
  .frank{grid-area:rank}
  .fttl{grid-area:ttl}
  .fverdict{grid-area:verdict;justify-self:start;font-size:11px}
  .fplats{display:none}
  .fchev{grid-area:chev;align-self:start;margin-top:4px}
  .fmt.open .fbodyin{padding:0 16px 20px}
  .sbtop{padding:14px 16px}
  .sbstage{padding:16px}
  .steal,.phase,.gap,.post{padding:18px}
  .next{padding:18px}
}
@media print{
  .topbar,.rail,.next,.tog,.skip{display:none}
  body{background:#fff;color:#111}
  .fmt .fbody{grid-template-rows:1fr}
  .tpane,.sbslide{display:block!important}
}
