:root{
  --navy:#0f1f3d;--blue:#1a6fd4;--orange:#e8622c;--orange-hi:#f07a48;
  --ink:#0f1f3d;--mut:#55627a;--paper:#f2f5f9;--panel:#fff;--line:#d5dce7;
  --hero:#0f1f3d;--hero-ink:#eef3fb;--hero-mut:#9fb4d6;--hero-line:rgba(159,180,214,.22);
  --frame:#081228;
  --display:'Big Shoulders Display','Arial Narrow','Helvetica Neue',sans-serif;
  --sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){color-scheme:dark;--ink:#e6edf8;--mut:#9aa9c2;--paper:#0a1427;--panel:#101d37;--line:#22324f;--hero:#0f1f3d;--frame:#050c1c}}
:root[data-theme="dark"]{color-scheme:dark;--ink:#e6edf8;--mut:#9aa9c2;--paper:#0a1427;--panel:#101d37;--line:#22324f;--hero:#0f1f3d;--frame:#050c1c}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.wrap{max-width:1160px;margin-inline:auto;padding-inline:clamp(16px,5vw,48px)}
.mono{font-family:var(--mono);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase}

.hero{position:relative;overflow:hidden;background:var(--hero);color:var(--hero-ink);padding-bottom:clamp(120px,16vw,190px)}
.dial{position:absolute;width:min(820px,110vw);aspect-ratio:1;right:max(-300px,-26vw);top:50%;transform:translateY(-54%);pointer-events:none}
.top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:26px;flex-wrap:wrap}
.top img{height:34px;width:auto;display:block}
.top nav{display:flex;gap:28px}
.top nav a{text-decoration:none;color:var(--hero-mut);transition:color .15s}
.top nav a:hover{color:var(--hero-ink)}
.lede{position:relative;padding-top:clamp(56px,9vw,112px);max-width:760px}
.status{display:flex;align-items:baseline;gap:14px;color:var(--hero-mut);margin-bottom:26px}
.status b{color:var(--orange);font-weight:500}
h1{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(64px,11vw,152px);line-height:.86;letter-spacing:-.005em;text-wrap:balance}
h1 em{font-style:normal;color:var(--orange);display:block}
.lede p{margin-top:30px;max-width:34em;font-size:clamp(17px,1.6vw,19px);color:var(--hero-mut);line-height:1.65}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:15px 22px;border-radius:3px;font-family:var(--mono);font-size:13px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:0;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.btn-go{background:var(--orange);color:#fff}
.btn-go:hover{background:var(--orange-hi)}
.btn-line{background:transparent;color:var(--hero-ink);box-shadow:inset 0 0 0 1.5px var(--hero-line)}
.btn-line:hover{box-shadow:inset 0 0 0 1.5px var(--hero-mut)}
.btn .tri{width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent currentColor}

.watch{margin-top:clamp(-150px,-12vw,-90px);position:relative}
.player{position:relative;aspect-ratio:16/9;max-width:100%;background:radial-gradient(120% 90% at 30% 20%,#17305c 0%,var(--frame) 70%);border-radius:4px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(5,12,28,.6)}
.player img.poster,.player iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
.player img.poster{filter:saturate(.9) brightness(.8)}
.vf{position:absolute;inset:clamp(12px,2.4vw,26px);pointer-events:none;color:#dbe6f7}
.vf i{position:absolute;width:clamp(18px,3vw,34px);height:clamp(18px,3vw,34px);border:2px solid rgba(219,230,247,.75)}
.vf i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0}
.vf i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0}
.vf i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0}
.vf i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0}
.vf .mono{position:absolute;font-size:clamp(10px,1.2vw,12.5px)}
.vf .tl{top:clamp(8px,1.4vw,14px);left:clamp(28px,4.2vw,50px);display:flex;align-items:center;gap:8px}
.vf .tl::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--orange)}
.vf .tr{top:clamp(8px,1.4vw,14px);right:clamp(28px,4.2vw,50px);font-variant-numeric:tabular-nums}
.vf .bl{bottom:clamp(8px,1.4vw,14px);left:clamp(28px,4.2vw,50px)}
.vf .br{bottom:clamp(8px,1.4vw,14px);right:clamp(28px,4.2vw,50px)}
.vf .cross{position:absolute;left:50%;top:50%;width:22px;height:22px;transform:translate(-50%,-50%);opacity:.35}
.vf .cross::before,.vf .cross::after{content:'';position:absolute;background:#dbe6f7}
.vf .cross::before{left:50%;top:0;bottom:0;width:1px}
.vf .cross::after{top:50%;left:0;right:0;height:1px}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:clamp(64px,9vw,92px);aspect-ratio:1;border-radius:50%;background:var(--orange);border:0;cursor:pointer;display:grid;place-items:center;transition:transform .2s,background .2s}
.play::after{content:'';border-style:solid;border-width:13px 0 13px 21px;border-color:transparent transparent transparent #fff;margin-left:5px}
.play:hover{background:var(--orange-hi);transform:translate(-50%,-50%) scale(1.05)}
.soon{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:10px;color:#eef3fb;padding:40px}
.soon strong{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(30px,5.2vw,64px);line-height:.95;letter-spacing:.005em}
.soon span{color:#9fb4d6}
.meta{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;padding-block:22px 0}
.meta h2{font-family:var(--display);font-weight:700;font-size:28px;line-height:1.1;text-transform:uppercase;letter-spacing:.01em}
.meta p{color:var(--mut);margin-top:4px}
.meta a{color:var(--blue);text-decoration:none;font-weight:500}
.meta a:hover{text-decoration:underline}

.series{padding-block:clamp(80px,11vw,140px) clamp(64px,9vw,110px)}
.series-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:24px 64px;align-items:end}
.series-head .mono{color:var(--orange);margin-bottom:14px;display:block}
.series h2{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(44px,6vw,80px);line-height:.9;text-wrap:balance}
.series-head p{color:var(--mut);font-size:18px;max-width:34em}
.angles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 40px;margin-top:clamp(48px,7vw,80px)}
.angle{border-top:2px solid var(--ink);padding-top:22px;display:grid;grid-template-rows:auto auto 1fr;gap:14px}
.angle header{display:flex;justify-content:space-between;align-items:center}
.angle .deg{font-family:var(--mono);font-size:14px;color:var(--orange);font-variant-numeric:tabular-nums}
.angle svg{width:40px;height:40px}
.angle h3{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:34px;line-height:1}
.angle p{color:var(--mut)}

.close{border-top:1px solid var(--line);padding-block:clamp(64px,9vw,110px)}
.close blockquote{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(34px,5vw,64px);line-height:.98;max-width:15em;text-wrap:balance}
.close blockquote b{color:var(--blue);font-weight:inherit}
.social{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px;margin-top:clamp(36px,5vw,56px);max-width:760px}
.social a{display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:16px;padding:18px 20px;background:var(--panel);border:1.5px solid var(--line);border-radius:4px;text-decoration:none;transition:border-color .15s,transform .15s}
.social a:hover{border-color:var(--blue);transform:translateY(-2px)}
.social .ico{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:var(--navy);color:#fff;font-size:20px}
.social li:first-child .ico{background:var(--orange)}
.social li:last-child .ico{background:var(--blue)}
.social b{display:block;font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:24px;line-height:1.05;letter-spacing:.01em}
.social small{display:block;font-family:var(--mono);font-size:13px;color:var(--mut)}
.social .go{font-size:20px;color:var(--mut);transition:color .15s}
.social a:hover .go{color:var(--blue)}
.btn .ico{font-size:15px;line-height:1;display:inline-flex}

footer{background:var(--hero);color:var(--hero-mut)}
footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:18px 40px;flex-wrap:wrap;padding-block:36px}
footer img{height:24px;width:auto;display:block}
footer .fine{display:flex;gap:10px 28px;flex-wrap:wrap}
.foot-social{display:flex;gap:10px 24px;flex-wrap:wrap;margin-inline-end:auto}
.foot-social a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--hero-mut);transition:color .15s}
.foot-social a:hover{color:#fff}
.foot-social .ico{font-size:15px;line-height:1;display:inline-flex}

@media (max-width:860px){
  .series-head{grid-template-columns:1fr}
  .angles{grid-template-columns:1fr;gap:40px}
}
@media (max-width:640px){
  .top nav{display:none}
  .top img{height:28px}
  .dial{width:150vw;right:-78vw;top:0;transform:translateY(-22%);opacity:.7}
  .vf .br{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.hero.lost{min-height:100vh;padding-bottom:clamp(64px,10vw,120px)}
.top nav a[aria-current="page"]{color:var(--hero-ink);box-shadow:inset 0 -2px 0 var(--orange)}
.hero-doc{padding-bottom:clamp(48px,7vw,84px)}
.doc-head{position:relative;padding-top:clamp(40px,6vw,80px)}
.doc-head h1{font-size:clamp(52px,8vw,108px);line-height:.9}
.doc{display:grid;grid-template-columns:220px minmax(0,68ch);gap:40px clamp(40px,6vw,88px);padding-block:clamp(48px,7vw,88px)}
.doc-toc{align-self:start;position:sticky;top:calc(env(safe-area-inset-top,0px) + 24px);display:grid;gap:14px}
.doc-toc>.mono{color:var(--orange)}
.doc-toc ol{list-style:none;display:grid;gap:2px;border-left:1.5px solid var(--line)}
.doc-toc ol a{display:block;padding:5px 0 5px 14px;margin-left:-1.5px;border-left:1.5px solid transparent;color:var(--mut);text-decoration:none;font-size:14.5px;line-height:1.35;transition:color .15s,border-color .15s}
.doc-toc ol a:hover{color:var(--ink);border-left-color:var(--blue)}
.doc-other{color:var(--blue);text-decoration:none;margin-top:10px}
.doc-other:hover{text-decoration:underline}
.doc-body{display:grid;gap:clamp(32px,4vw,44px);font-size:17px;line-height:1.72}
.doc-intro{font-size:clamp(18px,1.8vw,20px);line-height:1.6;color:var(--ink)}
.doc-body section{display:grid;gap:12px;scroll-margin-top:24px}
.doc-body h2{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(26px,3vw,32px);line-height:1.05;letter-spacing:.01em}
.doc-body p{color:var(--mut)}
.doc-body a{color:var(--blue);font-weight:500;text-underline-offset:3px}
footer .fine a{color:var(--hero-mut);text-decoration:none;transition:color .15s}
footer .fine a:hover{color:#fff}
@media (max-width:860px){
  .doc{grid-template-columns:minmax(0,1fr)}
  .doc-toc{position:static;padding-bottom:28px;border-bottom:1px solid var(--line)}
}
@media (max-width:640px){
  .hero-doc .top nav{display:flex;gap:18px}
}