[hidden]{display:none!important}
/* DonnieTheDev — site.css */
@font-face{font-family:"Geist";src:url(../fonts/geist-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(../fonts/geist-mono-latin-wght-normal.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(../fonts/instrument-serif-latin-400-normal.woff2) format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(../fonts/instrument-serif-latin-400-italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap}

:root{
  --ink:#04050a; --ink-2:#090b13; --ink-3:#10131e;
  --tx:#eceef6; --dim:#8c94aa; --dim-2:#5c647a;
  --line:rgba(255,255,255,.1); --line-2:rgba(255,255,255,.2);
  --violet:#b07cff; --violet-2:#d6bcff; --cyan:#69f0ee; --gold:#f2c46d;
  --paper:#f1eee8; --paper-2:#e7e3da; --paper-ink:#0b0c10; --paper-dim:#5b5f6b; --paper-line:rgba(11,12,16,.14);
  --pad:clamp(20px,4.4vw,72px);
  --ease:cubic-bezier(.2,.8,.2,1);
  --sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --serif:"Instrument Serif",ui-serif,Georgia,serif;
  --face:0;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--ink);color:var(--tx);font-family:var(--sans);font-size:clamp(15px,1.05vw,17px);line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.is-loading{overflow:hidden;height:100vh}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{display:block;max-width:100%}
::selection{background:var(--violet);color:#08060f}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--violet);outline-offset:3px;border-radius:4px}
em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.01em}

/* ---------- typography ---------- */
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);display:flex;gap:14px;align-items:center}
.eyebrow span{color:var(--violet-2);padding-right:14px;border-right:1px solid var(--line-2)}
.light .eyebrow{color:var(--paper-dim)} .light .eyebrow span{color:var(--paper-ink);border-color:var(--paper-line)}
.h-xl{font-weight:600;font-size:clamp(46px,8.4vw,150px);line-height:.92;letter-spacing:-.055em}
.h-lg{font-weight:600;font-size:clamp(36px,5.6vw,92px);line-height:.96;letter-spacing:-.045em}
.h-xl em,.h-lg em{font-size:1.06em;letter-spacing:-.03em;color:var(--violet-2)}
.light .h-lg em{color:#6d36d6}
.lede{font-size:clamp(16px,1.35vw,21px);line-height:1.5;color:#c0c6d8;max-width:46ch}
.light .lede{color:#2c2f38}
.wrap{width:min(1440px,100%);margin:0 auto;padding:0 var(--pad)}

/* ---------- grain / cursor ---------- */
#grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:grain 1.2s steps(6) infinite;mix-blend-mode:overlay}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
#cursor{position:fixed;z-index:95;left:0;top:0;width:34px;height:34px;margin:-17px 0 0 -17px;border:1px solid rgba(214,188,255,.7);border-radius:50%;pointer-events:none;opacity:0;transition:width .25s var(--ease),height .25s var(--ease),margin .25s var(--ease),background .25s,opacity .3s;mix-blend-mode:difference}
#cursor.on{opacity:1} #cursor.big{width:72px;height:72px;margin:-36px 0 0 -36px;background:rgba(214,188,255,.18)}
@media (hover:none),(pointer:coarse){#cursor{display:none}}

/* ---------- loader ---------- */
#loader{position:fixed;inset:0;z-index:100;background:var(--ink);display:grid;grid-template-rows:auto 1fr auto;padding:var(--pad);transition:opacity .9s var(--ease),visibility .9s}
#loader.done{opacity:0;visibility:hidden;pointer-events:none}
.ld-grid{position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:25% 33.33%;opacity:.45;mask-image:radial-gradient(ellipse at 50% 50%,#000 20%,transparent 75%)}
.ld-top,.ld-bottom{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.ld-top{align-items:flex-start;color:var(--tx)}
.ld-mid{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(18px,3vw,36px)}
.ld-pct{font-weight:600;font-size:clamp(90px,19vw,300px);line-height:.8;letter-spacing:-.07em;display:flex;align-items:flex-start;font-variant-numeric:tabular-nums}
.ld-pct i{font-style:normal;font-size:.32em;margin-top:.12em;color:var(--violet-2);letter-spacing:0}
.ld-enter{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 34px;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.04);backdrop-filter:blur(10px);transition:background .3s,border-color .3s,transform .3s var(--ease);min-width:260px}
.ld-enter-main{font-weight:600;font-size:clamp(15px,1.4vw,20px);letter-spacing:.02em}
.ld-enter-sub{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.ld-enter:not(:disabled){border-color:var(--violet);background:rgba(176,124,255,.12);animation:pulse 2.2s ease-in-out infinite}
.ld-enter:not(:disabled):hover{background:rgba(176,124,255,.26);transform:scale(1.04)}
@keyframes pulse{50%{box-shadow:0 0 0 12px rgba(176,124,255,.0),0 0 36px rgba(176,124,255,.35)}0%,100%{box-shadow:0 0 0 0 rgba(176,124,255,.4)}}
.ld-tier,.ld-sound{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.ld-tier span,.ld-sound span{margin-right:8px}
.ld-tier button,.ld-sound button{padding:7px 12px;border:1px solid var(--line-2);border-radius:999px;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);transition:all .25s}
.ld-tier button:hover,.ld-sound button:hover{color:var(--tx);border-color:var(--tx)}
.ld-tier button.on,.ld-sound button.on{background:var(--tx);color:var(--ink);border-color:var(--tx)}
.ld-bar{position:absolute;left:0;right:0;bottom:calc(var(--pad) - 14px);height:2px;background:var(--line)}
.ld-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--violet));box-shadow:0 0 12px var(--violet)}
@media (max-width:720px){.ld-bottom{flex-direction:column;align-items:flex-start;gap:14px}}

/* ---------- fixed HUD ---------- */
.hud{position:fixed;z-index:60;left:0;right:0;top:0;display:flex;align-items:center;gap:clamp(12px,3vw,40px);padding:18px var(--pad);pointer-events:none;mix-blend-mode:normal;transition:opacity .5s,transform .5s var(--ease)}
.hud>*{pointer-events:auto}
.mark{display:flex;flex-direction:column;line-height:1;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;gap:4px;padding-right:18px;border-right:1px solid var(--line-2);color:var(--tx);transition:color .4s}
.mark b{font-weight:600}.mark span{color:var(--dim)}
.ticker{flex:1;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);border:1px solid var(--line);border-radius:999px;background:rgba(8,10,18,.5);backdrop-filter:blur(10px);height:34px;display:flex;align-items:center;transition:border-color .4s,background .4s}
.ticker-track{display:flex;gap:44px;white-space:nowrap;padding-left:44px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--dim);animation:tick 48s linear infinite;will-change:transform}
.ticker-track em{font-family:var(--mono);font-style:normal;color:var(--tx)}
.ticker-track span:first-child em,.ticker-track span:nth-child(5) em{color:var(--cyan)}
@keyframes tick{to{transform:translateX(-50%)}}
.hud-sound{display:flex;align-items:center;gap:3px;height:34px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:rgba(8,10,18,.5);backdrop-filter:blur(10px);font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);transition:all .3s}
.hud-sound i{width:2px;height:6px;background:var(--dim);border-radius:2px;transition:height .2s}
.hud-sound span{margin-left:8px}
.hud-sound[aria-pressed="true"]{color:var(--tx);border-color:var(--violet)}
.hud-sound[aria-pressed="true"] i{background:var(--violet-2);animation:eq .9s ease-in-out infinite alternate}
.hud-sound i:nth-child(2){animation-delay:-.3s!important}.hud-sound i:nth-child(3){animation-delay:-.6s!important}.hud-sound i:nth-child(4){animation-delay:-.15s!important}
@keyframes eq{to{height:14px}}
.hud.lt .mark{color:var(--paper-ink);border-color:var(--paper-line)} .hud.lt .mark span{color:var(--paper-dim)}
.hud.lt .ticker,.hud.lt .hud-sound{background:rgba(241,238,232,.65);border-color:var(--paper-line);color:var(--paper-dim)}
.hud.lt .ticker-track,.hud.lt .ticker-track em{color:var(--paper-dim)}
.hud.lt .ticker-track em{color:var(--paper-ink)}
.hud.lt .hud-sound i{background:var(--paper-dim)}
.hud.lt .hud-sound[aria-pressed="true"]{color:var(--paper-ink)}
@media (max-width:720px){.ticker{display:none}.hud{justify-content:space-between}.mark{border:0;padding:0}}

/* ---------- rail ---------- */
.rail{position:fixed;z-index:55;right:calc(var(--pad) - 6px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.rail a{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:transparent;transition:color .3s}
.rail a::after{content:"";width:14px;height:1px;background:var(--dim-2);transition:all .35s var(--ease)}
.rail a.on::after{width:34px;background:var(--violet-2)}
.rail a:hover{color:var(--tx)} .rail a.on{color:var(--dim)}
.rail.lt a::after{background:rgba(11,12,16,.35)} .rail.lt a.on::after{background:var(--paper-ink)} .rail.lt a:hover,.rail.lt a.on{color:var(--paper-ink)}
@media (max-width:900px){.rail{display:none}}

/* ---------- stage ---------- */
#stage{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden;transition:opacity .8s var(--ease)}
.stage-inner{position:absolute;inset:0;transform-origin:50% 55%;will-change:transform,opacity;transform:translate3d(var(--sx,0),var(--sy,0),0) scale(var(--ss,1));opacity:var(--so,1)}
.avatar-layer,.const-layer{position:absolute;inset:0}
.avatar-layer canvas{display:block;width:100%;height:100%;filter:drop-shadow(0 0 14px rgba(176,124,255,.5)) drop-shadow(0 0 40px rgba(60,120,255,.28))}
.stage-fallback{position:absolute;left:50%;top:50%;width:min(420px,60vw);transform:translate(-50%,-55%);filter:drop-shadow(0 0 30px rgba(105,240,238,.4))}
/* real MAXXXED constellation styles (accent colours as on Donnie's PC) */
.voice-constellation{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);overflow:visible;width:560px;height:auto}
.voice-constellation-node[role="button"]{cursor:pointer;pointer-events:none;outline:none}
.voice-constellation-orbit,.voice-constellation-brain{transition:opacity .4s ease}
.voice-constellation-trace{fill:none;stroke:rgba(105,240,238,.16);stroke-width:1.1;stroke-linejoin:round;stroke-linecap:round;transition:stroke .5s ease}
.voice-constellation-trace[data-level="ready"]{stroke:rgba(105,240,238,.38)}
.voice-constellation-trace[data-level="active"]{stroke:rgba(176,124,255,.55)}
.voice-constellation-via{fill:#0b1e33;stroke:rgba(105,240,238,.35);stroke-width:1;transition:fill .5s,stroke .5s}
.voice-constellation-via[data-level="ready"]{fill:#1f6f7d;stroke:#7fe9f4}
.voice-constellation-via[data-level="active"]{fill:#6d2ccb;stroke:#c4a0ff}
.voice-constellation-trace-flow{fill:none;stroke-width:1.6;stroke-linecap:round;stroke-dasharray:3 19;opacity:0;transition:opacity .5s}
.voice-constellation-trace-flow[data-level="ready"]{opacity:1;stroke:rgba(160,246,255,.7);animation:vc-flow 2.2s linear infinite}
.voice-constellation-trace-flow[data-level="active"]{opacity:1;stroke:#c4a0ff;filter:drop-shadow(0 0 3px rgba(176,124,255,.9));animation:vc-flow 1.1s linear infinite}
@keyframes vc-flow{to{stroke-dashoffset:-22}}
.voice-constellation-guide{fill:none;stroke:rgba(105,240,238,.08);stroke-dasharray:2 7}
.voice-constellation-tickring{fill:none;stroke:rgba(105,240,238,.1);stroke-dasharray:1 5}
.voice-constellation-courier{fill:#8af8ff;filter:drop-shadow(0 0 6px #29cfff)}
.voice-constellation-ring{fill:none;stroke:rgba(154,84,255,.42);stroke-width:1.2}
.voice-constellation-ring-tick{fill:none;stroke:#c4a0ff;stroke-width:2;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(176,124,255,.8));transform-origin:0 0;animation:vc-spin 18s linear infinite}
.voice-constellation-core-glow{fill:rgba(105,240,238,.55);opacity:.55;transition:opacity .2s}
.voice-constellation-core{filter:drop-shadow(0 0 14px rgba(105,240,238,.75))}
.voice-constellation-core-ring{fill:none;stroke:rgba(186,255,255,.55);stroke-width:1}
.voice-constellation-node-halo{fill:rgba(105,240,238,0);transition:fill .5s}
.voice-constellation-node-dot{fill:#234a63;stroke:rgba(105,240,238,.45);stroke-width:1;transition:fill .5s,stroke .5s}
.voice-constellation-label{fill:#8aa0bd;font-family:var(--mono);font-size:calc(11px / var(--voice-constellation-unit,1));font-weight:600;letter-spacing:.18em;transition:fill .5s}
.voice-constellation-detail{fill:#566d8a;font-family:var(--mono);font-size:calc(9px / var(--voice-constellation-unit,1));letter-spacing:.04em}
.voice-constellation-state{fill:transparent;font-size:1px}
.voice-constellation-gauge-track,.voice-constellation-gauge{fill:none;stroke-width:0}
.voice-constellation-node[data-level="ready"] .voice-constellation-node-dot{fill:#35d6e6;stroke:#a9fbff}
.voice-constellation-node[data-level="ready"] .voice-constellation-node-halo{fill:rgba(105,240,238,.35)}
.voice-constellation-node[data-level="ready"] .voice-constellation-label{fill:#bfe9f5}
.voice-constellation-node[data-level="ready"] .voice-constellation-detail{fill:#7fb0c7}
.voice-constellation-node[data-level="active"] .voice-constellation-node-dot{fill:#c4a0ff;stroke:#e5d0ff}
.voice-constellation-node[data-level="active"] .voice-constellation-node-halo{fill:rgba(176,124,255,.55);animation:vc-pulse 2.4s ease-in-out infinite}
.voice-constellation-node[data-level="active"] .voice-constellation-label{fill:#efe4ff}
.voice-constellation-node[data-level="active"] .voice-constellation-detail{fill:#b48ae8}
@keyframes vc-spin{to{transform:rotate(360deg)}}
@keyframes vc-pulse{50%{opacity:.45}}
.voice-constellation-legend{display:none}
@media (prefers-reduced-motion:reduce){.voice-constellation-ring-tick,.voice-constellation-node-halo,.voice-constellation-trace-flow,.voice-constellation-courier{animation:none}}

/* ---------- chapters ---------- */
main{position:relative;z-index:2}
.chap{position:relative;padding:clamp(90px,14vh,170px) 0}
.chap.dark{background:transparent;color:var(--tx)}
.chap.light{background:var(--paper);color:var(--paper-ink)}
.chap.light.alt{background:var(--paper-2)}
.chap.light::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:var(--paper)}

/* reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0s)}
.reveal.in{opacity:1;transform:none}
.line{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.line>span{display:block;transform:translateY(110%);transition:transform 1.2s var(--ease);transition-delay:calc(var(--i,0)*.09s + .15s)}
body.ready .line>span{transform:none}
@media (prefers-reduced-motion:reduce){.reveal,.line>span{opacity:1;transform:none;transition:none}}

/* hero */
#hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--pad) clamp(104px,15vh,140px);gap:clamp(18px,3vh,40px)}
.hero-copy{max-width:min(64vw,1000px);position:relative;z-index:3}
.hero-copy .eyebrow{margin-bottom:clamp(16px,3vh,32px)}
#hero .h-xl{font-size:clamp(42px,5.1vw,92px);text-shadow:0 2px 40px rgba(4,5,10,.7)}
.hero-side{position:absolute;right:var(--pad);bottom:clamp(104px,15vh,140px);width:min(360px,27vw);display:flex;flex-direction:column;gap:22px;z-index:3}
.hero-lede{font-size:14px;line-height:1.55;color:#bcc3d6}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line)}
.hero-stats div{padding:14px 0 0}
.hero-stats dt{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.hero-stats dd{font-size:22px;font-weight:600;letter-spacing:-.03em;margin-top:2px}
.hero-stats small{display:block;font-family:var(--mono);font-size:10px;font-weight:400;letter-spacing:.06em;color:var(--dim);margin-top:2px}
.scroll-cue{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);opacity:.8}
.scroll-cue i{width:1px;height:34px;background:linear-gradient(var(--tx),transparent);animation:cue 2s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.noscript{padding:20px;border:1px solid var(--line-2);border-radius:12px;max-width:520px}
@media (max-width:900px){
  #hero{justify-content:flex-end}
  .hero-copy{max-width:100%}
  .hero-side{position:static;width:100%;margin-top:6px}
  .hero-stats{display:none}
  .scroll-cue{display:none}
}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:12px;padding:13px 22px;border-radius:999px;font-weight:600;font-size:14px;letter-spacing:-.01em;border:1px solid var(--line-2);transition:all .35s var(--ease);position:relative;overflow:hidden}
.btn i{font-style:normal;transition:transform .35s var(--ease)}
.btn:hover i{transform:translateX(4px)}
.btn.solid{background:var(--tx);color:var(--ink);border-color:var(--tx)}
.btn.solid:hover{background:var(--violet-2);border-color:var(--violet-2)}
.btn.ghost{background:rgba(255,255,255,.03);backdrop-filter:blur(8px)}
.btn.ghost:hover{background:rgba(255,255,255,.1);border-color:var(--tx)}
.light .btn.ghost{border-color:var(--paper-line);color:var(--paper-ink)}

/* talk */
#talk{min-height:100svh;display:flex;align-items:center;padding:clamp(84px,11vh,130px) 0 clamp(120px,16vh,150px)}
.talk-grid{width:min(1440px,100%);margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:1.45fr 1fr;gap:clamp(24px,3vw,56px);align-items:center}
.talk-copy{display:flex;flex-direction:column;gap:18px;grid-column:2}
.talk-panel{grid-column:2;grid-row:2}
.talk-copy{grid-row:1}
.talk-copy .h-lg{font-size:clamp(34px,3.9vw,66px)}
.talk-copy .lede{font-size:clamp(14px,1.05vw,17px)}
.talk-panel{border:1px solid var(--line-2);border-radius:20px;background:rgba(6,8,14,.62);backdrop-filter:blur(18px);overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.tp-head{display:flex;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--dim)}
#tp-state{color:var(--cyan)} #tp-state.live{color:var(--violet-2)}
.tp-log{min-height:150px;max-height:260px;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;scrollbar-width:thin}
.tp-line{display:grid;grid-template-columns:62px 1fr;gap:10px;font-size:15px;line-height:1.5}
.tp-line b{font-family:var(--mono);font-size:10px;letter-spacing:.16em;padding-top:5px;color:var(--violet-2);font-weight:500}
.tp-line.you b{color:var(--dim)} .tp-line.you span{color:#9aa3ba}
.tp-line.atlas span::after{content:"";}
.tp-line.typing span::after{content:"▍";color:var(--violet-2);animation:blink 0.8s steps(2) infinite;margin-left:2px}
@keyframes blink{50%{opacity:0}}
.tp-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 18px 16px}
.tp-chips button{padding:9px 14px;border:1px solid var(--line-2);border-radius:999px;font-size:13px;color:#cdd3e4;transition:all .3s var(--ease)}
.tp-chips button:hover{background:var(--tx);color:var(--ink);border-color:var(--tx)}
.tp-form{display:flex;border-top:1px solid var(--line)}
.tp-form input{flex:1;background:transparent;border:0;padding:16px 18px;color:var(--tx);font:inherit;font-size:14px;outline:none;min-width:0}
.tp-form input::placeholder{color:var(--dim-2)}
.tp-form button{padding:0 22px;font-size:18px;color:var(--violet-2);border-left:1px solid var(--line)}
.tp-form button:hover{background:var(--violet);color:#08060f}
@media (max-width:900px){
  #talk{align-items:flex-start;padding-top:calc(52svh)}
  .talk-grid{grid-template-columns:1fr}
  .talk-copy,.talk-panel{grid-column:1}.talk-panel{grid-row:auto}
  .talk-copy .lede{display:none}
}

/* lab */
.sec-head{display:flex;flex-direction:column;gap:clamp(18px,3vh,30px);margin-bottom:clamp(48px,9vh,110px)}
.lab-card{display:grid;grid-template-columns:minmax(260px,.8fr) 1.4fr;gap:clamp(24px,4vw,72px);align-items:center;padding:clamp(22px,3vw,44px) 0;border-top:1px solid var(--line);margin-bottom:clamp(30px,6vh,70px)}
.lab-card.cam{grid-template-columns:1.4fr minmax(260px,.8fr)}
.lab-card.cam .lab-meta{order:2}
.lab-meta{display:flex;flex-direction:column;gap:18px}
.lab-meta h3{font-size:clamp(28px,3.6vw,56px);line-height:1;letter-spacing:-.045em;font-weight:600}
.lab-meta h3 em{color:var(--violet-2)}
.lab-meta p{color:#b9c0d3;max-width:46ch}
.lab-meta p b{color:var(--tx);font-weight:600}
.lab-tag{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--violet-2)!important}
.lab-points{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:6px;font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:#a4acc0}
.lab-points li::before{content:"+ ";color:var(--cyan)}
.lab-view{position:relative;aspect-ratio:16/10;border:1px solid var(--line-2);border-radius:18px;overflow:hidden;background:#03050a;box-shadow:0 40px 100px rgba(0,0,0,.5)}
@media (max-width:900px){.lab-card,.lab-card.cam{grid-template-columns:1fr}.lab-card.cam .lab-meta{order:0}}

/* sky */
#sky-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.sky-hud{position:absolute;inset:0;pointer-events:none;font-family:var(--mono);color:#7fe9f4;font-size:10px;letter-spacing:.14em;text-shadow:0 0 8px rgba(105,240,238,.5)}
.sky-hud .b{position:absolute;width:22px;height:22px;border:1px solid rgba(105,240,238,.7)}
.sky-hud .tl{left:14px;top:14px;border-right:0;border-bottom:0}.sky-hud .tr{right:14px;top:14px;border-left:0;border-bottom:0}
.sky-hud .bl{left:14px;bottom:14px;border-right:0;border-top:0}.sky-hud .br{right:14px;bottom:14px;border-left:0;border-top:0}
.sky-title{position:absolute;left:46px;top:18px;color:#d9fbff}.sky-title em{font-family:var(--mono);font-style:normal;color:#5a7a90}
.sky-tele{position:absolute;right:46px;top:18px;display:flex;gap:14px}.sky-tele b{color:#fff;font-weight:500}
.sky-reticle{position:absolute;left:50%;top:50%;width:54px;height:54px;margin:-27px;border:1px solid rgba(105,240,238,.5);border-radius:50%}
.sky-reticle::before,.sky-reticle::after{content:"";position:absolute;background:rgba(105,240,238,.6)}
.sky-reticle::before{left:50%;top:-10px;bottom:-10px;width:1px}.sky-reticle::after{top:50%;left:-10px;right:-10px;height:1px}
.sky-lock{position:absolute;left:calc(50% + 40px);top:calc(50% - 38px);padding:4px 8px;border:1px solid rgba(176,124,255,.7);background:rgba(20,10,40,.6);color:#e8d9ff;opacity:0;transition:opacity .4s;font-size:10px;white-space:nowrap}
.sky-lock.on{opacity:1}
.sky-sub{position:absolute;left:50%;bottom:62px;transform:translateX(-50%);max-width:80%;text-align:center;font-family:var(--sans);font-size:14px;letter-spacing:0;color:#fff;text-shadow:0 2px 18px #000;opacity:0;transition:opacity .5s}
.sky-sub.on{opacity:1}
.sky-ctrl{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;gap:6px;flex-wrap:wrap;justify-content:center;z-index:2}
.sky-ctrl button{padding:7px 12px;border:1px solid rgba(105,240,238,.35);border-radius:999px;background:rgba(3,10,18,.7);backdrop-filter:blur(8px);font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#bfeff5;transition:all .25s}
.sky-ctrl button:hover,.sky-ctrl button.on{background:rgba(105,240,238,.2);border-color:#69f0ee}
@media (max-width:600px){.sky-tele span:nth-child(n+3){display:none}.sky-title em{display:none}}

/* camera lab (site overrides) */
.cam-view{aspect-ratio:auto;padding:12px;display:grid;gap:10px;background:#050810}
.cam-view .camera-lab-stage{border-radius:12px;aspect-ratio:16/10}
.cam-view .camera-lab-btn{color:var(--tx);font-family:var(--sans)}
.cam-view .camera-lab-btn.primary{background:var(--tx);color:var(--ink);border-color:var(--tx);font-weight:600}
.cam-view .camera-lab-input{color:var(--tx)}
.cam-view .camera-lab-empty{color:var(--tx)}

/* voice */
.voice-view{aspect-ratio:auto;min-height:320px;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;gap:16px;background:radial-gradient(120% 90% at 50% 0%,#0f1428,#04060c 70%)}
.vv-wave{display:flex;align-items:center;gap:3px;height:56px;justify-content:center}
.vv-wave i{width:3px;border-radius:3px;background:linear-gradient(var(--cyan),var(--violet));height:6px;transition:height .12s}
.vv-log{list-style:none;display:flex;flex-direction:column;gap:10px;font-family:var(--mono);font-size:13px;min-height:170px}
.vv-log li{display:grid;grid-template-columns:70px 1fr;gap:10px;opacity:0;transform:translateY(8px);transition:all .5s var(--ease)}
.vv-log li.in{opacity:1;transform:none}
.vv-log b{font-weight:500;letter-spacing:.14em;font-size:10px;padding-top:3px;color:var(--dim)}
.vv-log li.you span{color:var(--tx)}
.vv-log li.atlas b{color:var(--violet-2)}.vv-log li.atlas span{color:#c8b6ee}
.vv-log li.act b{color:var(--cyan)}.vv-log li.act span{color:#8cecea}

/* services (light) */
.svc{list-style:none;border-top:1px solid var(--paper-line)}
.svc-row{border-bottom:1px solid var(--paper-line);position:relative}
.svc-row::before{content:"";position:absolute;inset:0;background:var(--paper-ink);transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--ease);z-index:0}
.svc-row:hover::before,.svc-row.open::before{transform:scaleY(1)}
.svc-btn{position:relative;z-index:1;width:100%;display:grid;grid-template-columns:70px minmax(0,1.1fr) minmax(0,1fr) 40px;gap:20px;align-items:center;text-align:left;padding:clamp(22px,3.6vw,46px) 0;transition:color .5s,padding .5s var(--ease)}
.svc-row:hover .svc-btn,.svc-row.open .svc-btn{color:var(--paper);padding-left:clamp(10px,1.4vw,24px);padding-right:clamp(10px,1.4vw,24px)}
.svc-n{font-family:var(--mono);font-size:12px;letter-spacing:.14em;opacity:.6}
.svc-t{font-weight:600;font-size:clamp(28px,4.8vw,78px);letter-spacing:-.05em;line-height:1}
.svc-d{font-size:clamp(14px,1.1vw,17px);color:var(--paper-dim);max-width:34ch;transition:color .5s}
.svc-row:hover .svc-d,.svc-row.open .svc-d{color:#b6bbca}
.svc-x{width:22px;height:22px;position:relative;justify-self:end}
.svc-x::before,.svc-x::after{content:"";position:absolute;left:0;top:50%;width:100%;height:1.5px;background:currentColor;transition:transform .4s var(--ease)}
.svc-x::after{transform:rotate(90deg)}
.svc-row.open .svc-x::after{transform:rotate(0)}
.svc-more{position:relative;z-index:1;display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease);color:var(--paper)}
.svc-row.open .svc-more{grid-template-rows:1fr}
.svc-more>div{overflow:hidden;display:grid;grid-template-columns:70px 1.1fr 1fr 40px;gap:20px;padding:0 clamp(10px,1.4vw,24px)}
.svc-more p{grid-column:2;color:#cfd3df;max-width:52ch;padding-bottom:30px}
.svc-more ul{grid-column:3;list-style:none;display:grid;gap:8px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;padding-bottom:30px;color:#e5e8f0}
.svc-more li::before{content:"→ ";color:var(--violet)}
.svc-more .link{grid-column:2;grid-row:2;color:var(--violet-2);font-weight:600;padding-bottom:34px;width:max-content}
.svc-more .link:hover{color:#fff}
@media (max-width:820px){
  .svc-btn{grid-template-columns:34px 1fr 28px;gap:12px}.svc-d{display:none}
  .svc-more>div{grid-template-columns:34px 1fr}.svc-more p,.svc-more ul,.svc-more .link{grid-column:2;grid-row:auto}
}

/* process */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--paper-line);margin-bottom:clamp(60px,10vh,120px)}
.steps li{padding:30px 24px 10px 0;border-right:1px solid var(--paper-line);margin-right:24px;display:flex;flex-direction:column;gap:12px}
.steps li:last-child{border:0;margin:0}
.sn{font-family:var(--mono);font-size:12px;letter-spacing:.14em;color:#6d36d6}
.steps h3{font-size:clamp(22px,2.2vw,34px);letter-spacing:-.04em;font-weight:600;line-height:1}
.steps p{color:var(--paper-dim);font-size:15px;max-width:30ch}
.receipts{display:flex;flex-direction:column;gap:30px}
.rc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--paper-line)}
.rc{padding:26px 20px 8px 0;display:flex;flex-direction:column;gap:10px;border-right:1px solid var(--paper-line);margin-right:20px}
.rc:last-child{border:0}
.rc b{font-size:clamp(54px,8vw,132px);line-height:.9;letter-spacing:-.07em;font-weight:600;font-variant-numeric:tabular-nums}
.rc span{font-size:14px;color:var(--paper-dim);max-width:24ch}
@media (max-width:900px){.steps,.rc-grid{grid-template-columns:1fr 1fr}.steps li,.rc{margin-bottom:24px;border-right:0}}
@media (max-width:520px){.steps,.rc-grid{grid-template-columns:1fr}}

/* about */
.about-grid{display:grid;grid-template-columns:minmax(260px,.85fr) 1.3fr;gap:clamp(30px,6vw,110px);align-items:center}
.portrait{position:relative;justify-self:center;width:min(100%,520px);aspect-ratio:768/1000}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;z-index:2;filter:drop-shadow(0 30px 40px rgba(11,12,16,.25));clip-path:inset(0 0 0 0)}
.portrait-ring{position:absolute;left:50%;top:40%;width:92%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,#1a1030 0,#0b0c10 62%);z-index:1;box-shadow:0 0 0 1px rgba(11,12,16,.9),0 0 0 14px var(--paper),0 0 0 15px var(--paper-line),0 0 0 44px var(--paper),0 0 0 45px var(--paper-line)}
.portrait figcaption{position:absolute;left:0;bottom:-28px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-dim);z-index:3}
.about-copy{display:flex;flex-direction:column;gap:22px;max-width:62ch}
.about-copy p:not(.eyebrow):not(.lede){color:#34373f}
.facts{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--paper-line);margin-top:10px}
.facts li{padding:16px 16px 16px 0;border-bottom:1px solid var(--paper-line);display:flex;flex-direction:column;gap:2px}
.facts b{font-weight:600;letter-spacing:-.02em}.facts span{font-size:13px;color:var(--paper-dim)}
@media (max-width:900px){.about-grid{grid-template-columns:1fr}.portrait{width:min(78%,380px)}}

/* contact / finale */
.finale{padding-bottom:0;min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(180deg,rgba(4,5,10,.0),rgba(4,5,10,.0))}
.finale .wrap{display:flex;flex-direction:column;gap:clamp(26px,5vh,56px);padding-top:clamp(20px,6vh,80px)}
.finale .h-xl{font-size:clamp(46px,8vw,138px)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,90px);align-items:start}
.contact-links{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.cl{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:16px;padding:20px 0;border-bottom:1px solid var(--line);transition:padding .4s var(--ease),background .4s,color .4s}
.cl small{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);grid-column:1}
.cl span{font-size:clamp(20px,2.4vw,36px);font-weight:600;letter-spacing:-.04em;grid-column:1;word-break:break-word}
.cl i{grid-column:2;grid-row:1/3;align-self:center;font-style:normal;font-size:24px;color:var(--violet-2);transition:transform .4s var(--ease)}
.cl:hover{padding-left:14px;background:rgba(176,124,255,.08)}.cl:hover i{transform:translate(4px,-4px)}
.resp{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--dim);padding-top:16px}
.form{display:flex;flex-direction:column;gap:14px}
.form label{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.form input,.form select,.form textarea{background:rgba(255,255,255,.04);border:1px solid var(--line-2);border-radius:12px;padding:14px 16px;color:var(--tx);font:inherit;font-size:15px;text-transform:none;letter-spacing:0;outline:none;transition:border-color .3s,background .3s;width:100%}
.form select option{background:#0b0d16}
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--violet);background:rgba(176,124,255,.06)}
.form .btn{align-self:flex-start;margin-top:4px}
.note{font-size:13px;color:var(--violet-2);min-height:1.2em}
.footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px var(--pad);border-top:1px solid var(--line);margin-top:clamp(50px,9vh,110px);font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}

/* dock + menu */
.dock{position:fixed;z-index:70;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:8px 8px 8px 20px;min-width:min(86vw,380px);border:1px solid var(--line-2);border-radius:18px;background:rgba(10,12,20,.62);backdrop-filter:blur(22px) saturate(1.4);box-shadow:0 20px 60px rgba(0,0,0,.5);transition:background .4s,border-color .4s,color .4s}
.dock .wave{display:flex;align-items:center;gap:2px;height:20px}
.dock .wave i{width:2px;border-radius:2px;background:var(--violet-2);height:6px;animation:eq2 1.1s ease-in-out infinite alternate}
.dock .wave i:nth-child(2){animation-delay:-.4s}.dock .wave i:nth-child(3){animation-delay:-.8s}.dock .wave i:nth-child(4){animation-delay:-.2s}.dock .wave i:nth-child(5){animation-delay:-.6s}
@keyframes eq2{to{height:18px}}
.dock-now{flex:1;display:flex;align-items:center;gap:14px;text-align:left;padding:8px 6px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;font-size:14px}
.dock-now em{font-family:var(--mono);font-style:normal;font-weight:400;font-size:11px;color:var(--dim);letter-spacing:.1em}
.dock-btn{width:44px;height:44px;border-radius:12px;background:var(--tx);display:grid;place-content:center;gap:6px;transition:background .3s,transform .3s var(--ease)}
.dock-btn i{display:block;width:16px;height:2px;background:var(--ink);border-radius:2px;transition:transform .4s var(--ease)}
.dock-btn:hover{background:var(--violet-2)}
.dock.open .dock-btn i:first-child{transform:translateY(4px) rotate(45deg)}.dock.open .dock-btn i:last-child{transform:translateY(-4px) rotate(-45deg)}
.dock.lt{background:rgba(241,238,232,.72);border-color:var(--paper-line);color:var(--paper-ink)}
.dock.lt .dock-btn{background:var(--paper-ink)}.dock.lt .dock-btn i{background:var(--paper)}
.dock.lt .dock-now em{color:var(--paper-dim)}.dock.lt .wave i{background:var(--paper-ink)}
.menu{position:fixed;z-index:65;inset:0;background:rgba(4,5,10,.88);backdrop-filter:blur(26px);display:flex;flex-direction:column;justify-content:center;padding:var(--pad);opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}
.menu[hidden]{display:flex}
.menu.open{opacity:1;visibility:visible}
.menu-list{list-style:none;display:flex;flex-direction:column}
.menu-list li{border-top:1px solid var(--line);overflow:hidden}
.menu-list li:last-child{border-bottom:1px solid var(--line)}
.menu-list a{display:flex;align-items:baseline;gap:22px;padding:clamp(8px,1.8vh,18px) 0;font-weight:600;font-size:clamp(30px,6.4vh,76px);letter-spacing:-.05em;line-height:1;transform:translateY(100%);transition:transform .8s var(--ease),color .3s,padding .4s var(--ease);transition-delay:calc(var(--i)*.05s)}
.menu.open .menu-list a{transform:none}
.menu-list a small{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.12em;color:var(--dim)}
.menu-list a:hover{color:var(--violet-2);padding-left:18px}
.menu-foot{margin-top:28px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--dim)}

/* subtitle */
#sub{position:fixed;z-index:58;left:50%;bottom:calc(100px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(10px);max-width:min(440px,30vw);text-align:center;font-size:clamp(15px,1.25vw,19px);line-height:1.4;font-weight:500;letter-spacing:-.01em;color:#fff;text-shadow:0 2px 24px #000,0 0 2px #000;padding:10px 18px;border-radius:14px;background:rgba(4,5,10,.38);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .5s,transform .5s var(--ease)}
#sub.on{opacity:1;transform:translateX(-50%)}
body[data-chap="talk"] #sub,body[data-chap="lab"] #sub,.chap-light #sub{opacity:0!important}
body[data-chap="services"] #sub,body[data-chap="process"] #sub,body[data-chap="about"] #sub{opacity:0!important}

@media (max-width:900px){#sub{max-width:90vw;bottom:calc(98px + env(safe-area-inset-bottom))}}

@media(max-width:900px){#sub{display:none!important}}

.tp-line.note{opacity:.75}.tp-line.note b{color:var(--violet,#b9a2ff)}.tp-line.note span{font-family:var(--mono,ui-monospace,monospace);font-size:12px;letter-spacing:.02em}

.hud-loc{font-style:normal}

/* boot sequence */
.ld-mid{overflow:hidden}
.ld-rings{position:absolute;left:50%;top:50%;width:min(70vmin,600px);aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;opacity:.6}
.ld-rings i{position:absolute;inset:0;border-radius:50%;border:1px solid var(--line-2);border-top-color:var(--violet);border-right-color:transparent;animation:ldspin 9s linear infinite}
.ld-rings i:nth-child(2){inset:9%;border-top-color:var(--cyan);animation-duration:14s;animation-direction:reverse}
.ld-rings i:nth-child(3){inset:19%;border-style:dashed;border-top-color:var(--violet-2);animation-duration:22s}
@keyframes ldspin{to{transform:rotate(360deg)}}
.ld-pct,.ld-log,.ld-note,.ld-enter,.ld-mute{position:relative}
.ld-log{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);max-width:640px}
.ld-log li::before{content:"\25CB  ";color:var(--dim)}
.ld-log li.ok{color:var(--tx)}
.ld-log li.ok::before{content:"\25CF  ";color:var(--cyan)}
.ld-note{margin:0;font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx);text-align:center}
.ld-mute{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);text-decoration:underline;text-underline-offset:4px;padding:6px 10px}
.ld-mute:hover{color:var(--tx)}
@media(prefers-reduced-motion:reduce){.ld-rings i{animation:none}}
