/* ISPilot redesign, Nov 2026: network tokens, trial CTA, mobile menu, sticky trial bar,
   "Works with" row, feature tabs and the product scenes. Loaded after motion.css on
   index, hospitality and bonding. Scenes are driven by redesign.js. */
:root{
  --path:rgba(139,124,255,.22);
  --path-live:#8B7CFF;
  --glow-violet:0 0 0 1px rgba(139,124,255,.35),0 8px 32px -12px rgba(139,124,255,.55);
  --glow-amber:0 10px 28px -8px rgba(255,176,32,.45),0 0 0 4px rgba(255,176,32,.14);
  --grid-line:rgba(244,242,250,.035);
  --mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
  --dur-micro:160ms;
  --dur-ui:280ms;
  --ease-out:cubic-bezier(.2,.8,.2,1);
  --ease-io:cubic-bezier(.4,0,.2,1);
}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- Start free trial button ---------- */
.btn-trial{position:relative;overflow:hidden;isolation:isolate;
  background:var(--amber);color:#211200;border-color:transparent;box-shadow:0 8px 24px -10px rgba(255,176,32,.55);
  transition:transform var(--dur-micro) var(--ease-out),box-shadow .25s ease;}
.btn-trial::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateX(-120%);
  background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);}
.btn-trial .arrow{transition:transform .2s var(--ease-out);flex:none;}
.btn-trial:is(:hover,:focus-visible){transform:translateY(-2px);box-shadow:var(--glow-amber);}
.btn-trial:is(:hover,:focus-visible)::before{transform:translateX(120%);transition:transform .7s var(--ease-io);}
.btn-trial:is(:hover,:focus-visible) .arrow{transform:translateX(4px);}
.btn-trial:active{transform:translateY(0) scale(.98);transition-duration:80ms;}
.btn-trial.is-loading{pointer-events:none;}
.btn:focus-visible,.watch-chip:focus-visible,.tab:focus-visible,.navmenu-toggle:focus-visible,
.b-ctl:focus-visible,.seg button:focus-visible,.motion-toggle:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}

/* ---------- Header: mobile menu ---------- */
.mnav-only{display:none;}
.navmenu-toggle{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;
  background:rgba(244,242,250,.06);border:1px solid var(--border-strong);color:var(--text);cursor:pointer;}
.navmenu-toggle svg{display:block;}
.navmenu-toggle .x{display:none;}
.site-nav.open .navmenu-toggle .x{display:block;}
.site-nav.open .navmenu-toggle .bars{display:none;}
@media (max-width:1180px){ .nav-cta .hide-lg{display:none;} }
@media (max-width:980px){
  .site-nav .navmenu-toggle{display:inline-flex;}
  .site-nav .nav-cta{gap:8px;}
  .site-nav .nav-cta .btn-ghost{display:none;}
  .site-nav.open .nav-links{display:flex;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:2px;
    padding:12px 16px 20px;background:rgba(11,14,20,.98);border-bottom:1px solid var(--border);
    box-shadow:0 24px 48px -24px rgba(0,0,0,.8);}
  .site-nav.open .nav-links > a,.site-nav.open .nav-links > button{display:block;width:100%;text-align:left;padding:12px 8px;
    font:600 16px var(--body,inherit);color:var(--text);background:none;border:0;border-bottom:1px solid var(--border);cursor:pointer;}
  .site-nav.open .nav-links .mnav-only{display:block;}
}

@media (max-width:560px){
  .site-nav .nav-cta .btn-trial{padding:9px 12px;font-size:13px;}
  .site-nav .nav-cta .btn-trial .arrow{display:none;}
  .site-nav .nav-inner{padding-left:16px;padding-right:16px;gap:10px;}
  .site-nav .brand{min-width:0;}
  .site-nav .brand-sub{white-space:normal!important;font-size:11px!important;line-height:1.15;max-width:72px;}
}
/* ---------- Sticky trial bar on phones ---------- */
.mbar{display:none;}
@media (max-width:760px){
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;gap:10px;align-items:center;justify-content:space-between;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(11,14,20,.96);border-top:1px solid var(--border-strong);
    transform:translateY(110%);transition:transform var(--dur-ui) var(--ease-out);}
  .mbar.show{transform:none;}
  body:has(.mbar){padding-bottom:calc(72px + env(safe-area-inset-bottom,0px));}
  .mbar .btn{flex:1;min-width:0;white-space:normal;}
  .mbar .mbar-alt{white-space:nowrap;}
  .mbar .mbar-alt{flex:none;font-size:13.5px;font-weight:700;color:var(--muted);background:none;border:0;padding:8px 4px;cursor:pointer;}
}

/* ---------- Status dots, tickers, example tag ---------- */
.sdot{position:relative;display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--muted-2);flex:none;vertical-align:middle;}
.sdot.ok{background:var(--good);} .sdot.warn{background:var(--amber);} .sdot.bad{background:var(--bad);} .sdot.vi{background:var(--violet-light);}
.sdot.ping::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;color:inherit;opacity:0;animation:rd-ping 1.6s var(--ease-out) 1;}
.sdot.ok.ping::after{color:var(--good);} .sdot.bad.ping::after{color:var(--bad);} .sdot.warn.ping::after{color:var(--amber);}
@keyframes rd-ping{0%{opacity:.9;transform:scale(.6);}100%{opacity:0;transform:scale(2.4);}}
.example-tag{display:inline-flex;align-items:center;gap:6px;font:500 10.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--muted-2);border:1px solid var(--border);border-radius:99px;padding:2px 8px;}

/* ---------- Hero: network canvas + pause ---------- */
.hero-net{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:.55;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 35%,#000 70%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 35%,#000 70%);}
.motion-toggle{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font:600 12.5px inherit;color:var(--muted-2);
  background:none;border:1px solid var(--border);border-radius:99px;padding:5px 12px;cursor:pointer;}
.motion-toggle:hover{color:var(--text);border-color:var(--border-strong);}
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation-play-state:paused!important;}

/* ---------- Works with ---------- */
.works{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin-top:22px;padding:16px 18px;
  border:1px solid var(--border);border-radius:14px;background:rgba(21,25,38,.6);}
.works-label{font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);margin-right:4px;}
.works a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--text);text-decoration:none;
  padding:6px 12px;border-radius:99px;border:1px solid var(--border-strong);background:rgba(244,242,250,.03);transition:border-color .2s,background .2s;}
.works a:hover{border-color:rgba(139,124,255,.6);background:rgba(139,124,255,.08);}
.works .watch-chip{margin-left:auto;}

/* ---------- Watch chips on cards ---------- */
.watch-chip{display:inline-flex;align-items:center;gap:7px;margin-top:14px;font:600 12.5px inherit;color:var(--violet-light);
  background:rgba(109,94,245,.1);border:1px solid rgba(109,94,245,.35);border-radius:99px;padding:5px 12px;cursor:pointer;
  transition:background .2s,border-color .2s;}
.watch-chip:hover{background:rgba(109,94,245,.2);border-color:rgba(139,124,255,.7);}
.watch-chip .t{font-family:var(--mono);color:var(--muted);font-weight:500;}
.feature-card:hover{box-shadow:var(--glow-violet);}

/* ---------- Tabs ---------- */
.tabs{display:inline-flex;position:relative;gap:4px;padding:4px;border-radius:12px;background:var(--surface);border:1px solid var(--border);margin:0 auto 28px;}
.tabs-wrap{display:flex;justify-content:center;}
.tab{position:relative;z-index:1;font:700 14px inherit;color:var(--muted);background:none;border:0;border-radius:9px;padding:10px 18px;cursor:pointer;transition:color var(--dur-ui);}
.tab[aria-selected="true"]{color:var(--text);}
.tabs .tab-ind{position:absolute;z-index:0;top:4px;bottom:4px;left:0;border-radius:9px;background:var(--surface-2);border:1px solid var(--border-strong);
  transition:transform var(--dur-ui) var(--ease-out),width var(--dur-ui) var(--ease-out);}
.tabs-on [role="tabpanel"][hidden]{display:none;}
[role="tabpanel"]{animation:rd-fade var(--dur-ui) var(--ease-out);}
@keyframes rd-fade{from{opacity:.4;}to{opacity:1;}}

/* ---------- Scenes: shared ---------- */
.scene{position:relative;}
.scene-pin{position:relative;padding:88px 0;}
html[data-motion="full"] .scene.is-scroll{height:var(--len,260vh);}
html[data-motion="full"] .scene.is-scroll .scene-pin{position:sticky;top:0;min-height:100vh;display:flex;align-items:center;padding:72px 0 40px;}
.scene-pin > .wrap{width:100%;}
.scene-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:48px;align-items:center;}
.scene-copy h2{font-size:clamp(26px,3.2vw,38px);line-height:1.12;margin:16px 0 14px;}
.scene-copy > p{color:var(--muted);font-size:16px;max-width:46ch;}
.scene-steps{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:4px;counter-reset:st;}
.scene-steps li{counter-increment:st;display:grid;grid-template-columns:28px 1fr;gap:10px;padding:10px 12px;border-radius:10px;
  color:var(--muted-2);font-size:14.5px;transition:color var(--dur-ui),background var(--dur-ui);}
.scene-steps li::before{content:counter(st,decimal-leading-zero);font:500 12px var(--mono);padding-top:2px;color:inherit;}
.scene-steps li b{display:block;color:inherit;font-size:15px;}
.scene-steps li.on{color:var(--muted);}
.scene-steps li.on b{color:var(--text);}
.scene-steps li.on::before{color:var(--amber);}
.scene-steps li.now{background:rgba(244,242,250,.04);}
.stage{position:relative;padding:22px;border-radius:20px;border:1px solid var(--border);
  background:linear-gradient(var(--grid-line) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,var(--grid-line) 1px,transparent 1px) 0 0/48px 48px,var(--obsidian-2);
  contain:layout paint;}
.stage-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;}
.wires{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:2;}
.wires path{fill:none;stroke:var(--path);stroke-width:1.5;}
.wires path.live{stroke:var(--path-live);stroke-width:2;}
.wires path.flow{stroke:rgba(139,124,255,.75);stroke-dasharray:2 10;stroke-linecap:round;animation:rd-flow 1.1s linear infinite;}
.wires path.flow.amber{stroke:rgba(255,176,32,.8);}
.wires path.down{stroke:rgba(251,113,133,.6);stroke-dasharray:4 6;animation:none;}
@keyframes rd-flow{to{stroke-dashoffset:-24;}}
.token{position:absolute;left:0;top:0;z-index:3;pointer-events:none;font:500 12px var(--mono);color:#160f3a;background:var(--violet-light);
  border-radius:7px;padding:4px 8px;white-space:nowrap;box-shadow:0 0 0 4px rgba(139,124,255,.18),0 0 24px rgba(139,124,255,.7);opacity:0;will-change:transform;}
.token.amber{background:var(--amber);color:#211200;box-shadow:0 0 0 4px rgba(255,176,32,.16),0 0 24px rgba(255,176,32,.6);}
.card-x{position:relative;z-index:1;background:var(--surface);border:1px solid var(--border-strong);border-radius:14px;padding:16px;}
.card-x h5{margin:0;font:700 13px inherit;display:flex;align-items:center;gap:8px;}
.card-x .sub{font-size:12px;color:var(--muted-2);}
.kv{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--muted);}
.kv b{color:var(--text);font-family:var(--mono);font-weight:500;}
.rows{display:grid;gap:6px;margin-top:12px;}
.rowx{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;font-size:12.5px;padding:8px 10px;border-radius:9px;
  background:rgba(244,242,250,.03);border:1px solid var(--border);}
.rowx .m{font-family:var(--mono);font-size:12px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.rowx .r{font-size:12px;color:var(--muted);white-space:nowrap;}
.rowx.new{border-color:rgba(139,124,255,.5);background:rgba(139,124,255,.08);}
.rowx.okay .r{color:var(--good);}

/* ---------- S1 voucher to router ---------- */
.vr{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px;align-items:center;}
.v-card{background:linear-gradient(160deg,#1d1a3a,#151926);}
.v-plan{font-size:13px;color:var(--muted);margin-top:10px;}
.v-code{margin:12px 0;font:500 20px var(--mono);letter-spacing:.06em;color:var(--text);padding:12px;border:1px dashed rgba(139,124,255,.5);border-radius:10px;text-align:center;min-height:52px;}
.v-code .caret{display:inline-block;width:2px;height:18px;background:var(--amber);vertical-align:-3px;margin-left:2px;animation:rd-blink 1s steps(1) infinite;}
@keyframes rd-blink{50%{opacity:0;}}
.v-price{font:800 26px 'Bricolage Grotesque',sans-serif;color:var(--amber);}
.r-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--border);font-size:12.5px;color:var(--muted);}
.r-foot b{font:500 15px var(--mono);color:var(--amber);}

/* ---------- Lanes (billing, win-back) ---------- */
.lanes{display:grid;gap:18px;}
.lane{position:relative;padding:16px;border-radius:14px;background:var(--surface);border:1px solid var(--border);}
.lane-title{display:flex;align-items:center;gap:8px;font:700 13px inherit;margin-bottom:16px;}
.lane-body{position:relative;}
.lane-track{position:absolute;left:15px;right:calc((100% - (var(--n,4) - 1) * 10px) / var(--n,4) - 15px);top:9px;height:2px;background:var(--path);border-radius:2px;}
.lane-fill{position:absolute;inset:0;background:linear-gradient(90deg,var(--violet-light),var(--amber));transform-origin:left;transform:scaleX(var(--lp,0));border-radius:2px;}
.lane-nodes{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:10px;}
.lane-nodes li{display:grid;gap:4px;font-size:12.5px;color:var(--muted-2);transition:color var(--dur-ui);}
.lane-nodes li .sdot{width:14px;height:14px;border:3px solid var(--obsidian-2);box-sizing:content-box;margin-left:5px;}
.lane-nodes li b{font-size:13px;color:inherit;margin-top:6px;}
.lane-nodes li small{font-family:var(--mono);font-size:11.5px;}
.lane-nodes li.on{color:var(--muted);}
.lane-nodes li.on b{color:var(--text);}
.lane-nodes li:not(.on) .sdot{background:var(--surface-2);}

/* ---------- Wallet ---------- */
.wal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center;}
.wal-bal{font:500 30px var(--mono);color:var(--amber);margin:10px 0 2px;}
.phones{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.phone-chip{position:relative;z-index:1;display:grid;gap:4px;padding:12px;border-radius:12px;background:var(--surface);border:1px solid var(--border);font-size:12px;color:var(--muted-2);transition:border-color var(--dur-ui),color var(--dur-ui);}
.phone-chip b{font-size:13px;color:var(--muted);}
.phone-chip.got{border-color:rgba(52,211,153,.5);color:var(--muted);}
.phone-chip.got b{color:var(--text);}

/* ---------- Scale canvas ---------- */
.scale-stage{aspect-ratio:16/10;padding:0;overflow:hidden;}
.scale-stage canvas{position:absolute;inset:0;width:100%;height:100%;}
.scale-hud{position:absolute;left:16px;right:16px;bottom:14px;z-index:2;display:flex;flex-wrap:wrap;gap:10px;}
.hud{padding:10px 14px;border-radius:12px;background:rgba(11,14,20,.82);border:1px solid var(--border-strong);font-size:12px;color:var(--muted);}
.hud b{display:block;font:500 20px var(--mono);color:var(--text);}
.hud b.amber{color:var(--amber);}
.scale-stage .example-tag{position:absolute;top:14px;right:14px;z-index:2;background:rgba(11,14,20,.8);}

/* ---------- Builder ---------- */
.builder{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:center;}
.b-panel{display:grid;gap:18px;}
.b-group h6{margin:0 0 8px;font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted-2);}
.b-row{display:flex;flex-wrap:wrap;gap:8px;}
.b-sw{width:34px;height:34px;border-radius:50%;border:2px solid transparent;cursor:pointer;background:var(--c);box-shadow:inset 0 0 0 3px var(--obsidian-2);transition:transform var(--dur-micro) var(--ease-out);}
.b-sw:hover{transform:scale(1.08);}
.b-sw[aria-checked="true"]{border-color:var(--text);}
.b-sw:focus-visible{outline:2px solid var(--amber);outline-offset:3px;}
.b-ctl{font:600 13px inherit;color:var(--muted);background:rgba(244,242,250,.04);border:1px solid var(--border-strong);border-radius:99px;padding:7px 14px;cursor:pointer;transition:all var(--dur-micro);}
.b-ctl[aria-pressed="true"]{color:var(--text);background:rgba(109,94,245,.18);border-color:rgba(139,124,255,.7);}
.b-pub{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.b-pub .btn{min-width:150px;}
.b-pub .spin{width:14px;height:14px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:rd-spin .7s linear infinite;}
@keyframes rd-spin{to{transform:rotate(360deg);}}
.b-status{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px;}
.b-after{display:none;}
.builder.published .b-after{display:inline-flex;}
.phone{--brand:#6D5EF5;position:relative;width:100%;max-width:300px;margin:0 auto;aspect-ratio:9/17;border-radius:34px;padding:12px;
  background:#05060a;border:1px solid var(--border-strong);box-shadow:0 30px 60px -30px rgba(0,0,0,.9);}
.phone-in{position:relative;height:100%;border-radius:24px;overflow:hidden;background:#f6f5fb;color:#151926;display:flex;flex-direction:column;}
.p-head{position:relative;padding:22px 16px 18px;background:var(--brand);color:#fff;transition:background-color var(--dur-ui);}
.p-wipe{position:absolute;inset:0;background:var(--wipe,#000);clip-path:circle(0% at var(--wx,90%) 0%);pointer-events:none;}
.p-wipe.go{clip-path:circle(150% at var(--wx,90%) 0%);transition:clip-path .38s var(--ease-out);}
.p-logo{display:flex;align-items:center;gap:8px;font:800 14px 'Bricolage Grotesque',sans-serif;position:relative;transition:opacity var(--dur-ui),transform var(--dur-ui) var(--ease-out);min-height:24px;}
.p-logo i{width:22px;height:22px;border-radius:7px;background:rgba(255,255,255,.9);}
.p-title{position:relative;margin-top:10px;font:800 17px 'Bricolage Grotesque',sans-serif;}
.p-sub{position:relative;font-size:11.5px;opacity:.85;}
.p-body{flex:1;padding:14px;display:flex;flex-direction:column;gap:8px;overflow:hidden;}
.p-item{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:11px;background:#fff;border:1px solid #e6e4ef;font-size:12px;
  transition:opacity var(--dur-ui),transform var(--dur-ui) var(--ease-out),max-height var(--dur-ui);max-height:60px;}
.p-item b{font-size:12.5px;} .p-item span{font-family:var(--mono);font-size:11.5px;color:var(--brand);font-weight:500;}
.p-tabs{display:flex;gap:4px;padding:3px;border-radius:9px;background:#ebe9f3;font-size:11px;font-weight:700;}
.p-tabs span{flex:1;text-align:center;padding:6px;border-radius:7px;transition:opacity var(--dur-ui);}
.p-tabs span:first-child{background:#fff;}
.p-tabs span.off{display:none;}
.p-lang{font-size:10.5px;color:#6b6880;text-align:center;transition:opacity var(--dur-ui);}
.p-field b{color:#151926;margin-left:4px;}
.p-field{padding:9px 11px;border-radius:9px;border:1px solid #dcd9e8;background:#fff;font-size:11.5px;color:#6b6880;}
.p-btn{margin-top:auto;padding:11px;border-radius:11px;text-align:center;font-weight:800;font-size:12.5px;color:#fff;background:var(--brand);transition:background-color var(--dur-ui),opacity var(--dur-ui),transform var(--dur-ui) var(--ease-out);}
.p-btn.momo{background:#FFCC00;color:#1a1400;}
.phone .off{opacity:0;transform:scale(.92);max-height:0;padding-top:0;padding-bottom:0;border-width:0;margin:0;pointer-events:none;}
.p-btn.off{transform:translateY(16px);}
.p-live{position:absolute;right:12px;top:12px;display:flex;justify-content:flex-end;}
.p-live span{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:#0d6b4a;background:#dff7ec;border-radius:99px;padding:5px 10px;opacity:0;transform:translateY(8px);transition:all var(--dur-ui) var(--ease-out);}
.builder.published .p-live span{opacity:1;transform:none;}

/* ---------- Guest scene (hospitality) ---------- */
.gs{display:grid;grid-template-columns:240px minmax(0,1fr);gap:56px;align-items:center;}
.gs .phone{max-width:240px;}
.gs-view{position:absolute;inset:0;display:flex;flex-direction:column;transition:opacity var(--dur-ui);}
.gs-boards{display:grid;gap:14px;}

/* ---------- Bond scenes ---------- */
.bf{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:44px;align-items:center;}
.bf-links{display:grid;gap:14px;}
.bf-link{position:relative;z-index:1;display:grid;gap:2px;padding:10px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--border-strong);font-size:12px;color:var(--muted);transition:border-color var(--dur-ui),opacity var(--dur-ui);}
.bf-link b{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--text);}
.bf-link .loss{font-family:var(--mono);}
.bf-link.out{border-color:rgba(251,113,133,.6);opacity:.75;}
.bf-node{position:relative;z-index:1;display:grid;justify-items:center;gap:4px;padding:14px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--border-strong);font-size:12px;color:var(--muted);text-align:center;}
.bf-node b{font-size:13.5px;color:var(--text);}
.bf-node .mono{color:var(--amber);font-size:12px;}
.bf-note{margin-top:16px;display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);min-height:22px;}
.seg{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:var(--surface);border:1px solid var(--border);}
.seg button{font:700 13.5px inherit;color:var(--muted);background:none;border:0;border-radius:9px;padding:9px 16px;cursor:pointer;}
.seg button[aria-checked="true"]{color:var(--text);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border-strong);}
.modes-demo{margin-top:36px;padding:24px;border-radius:20px;border:1px solid var(--border);background:var(--obsidian-2);}
.md-top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:20px;}
.md-lanes{display:grid;gap:10px;}
.md-lane{display:grid;grid-template-columns:120px minmax(0,1fr) 110px;gap:14px;align-items:center;font-size:13px;}
.md-lane > b{display:flex;align-items:center;gap:8px;}
.md-pipe{position:relative;height:30px;border-radius:99px;background:rgba(244,242,250,.04);border:1px solid var(--border);overflow:hidden;}
.md-pipe i{position:absolute;top:50%;left:0;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--c,var(--violet-light));
  box-shadow:0 0 10px var(--c,var(--violet-light));animation:rd-run var(--sp,1.6s) linear infinite;animation-delay:var(--d,0s);}
@keyframes rd-run{from{transform:translateX(-12px);}to{transform:translateX(calc(var(--w,600px) + 12px));}}
.md-lane .st{font-size:12px;color:var(--muted-2);text-align:right;}
.md-lane.down .md-pipe{border-color:rgba(251,113,133,.5);background:rgba(251,113,133,.06);}
.md-lane.down .st{color:var(--bad);}
.md-key{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:12px;color:var(--muted-2);}
.md-key i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle;}
.toast-x .sdot{background:var(--bad);}
.toast-x.good .sdot{background:var(--good);}
.md-cap{margin-top:16px;font-size:14px;color:var(--muted);min-height:44px;max-width:70ch;}
.hb{display:grid;gap:10px;}
.hb-row{display:grid;grid-template-columns:110px minmax(0,1fr) 90px;gap:14px;align-items:center;padding:12px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--border);font-size:13px;transition:border-color var(--dur-ui);}
.hb-row.bad{border-color:rgba(251,113,133,.55);}
.hb-row svg{width:100%;height:36px;display:block;}
.hb-row polyline{fill:none;stroke:var(--violet-light);stroke-width:1.6;}
.hb-row.bad polyline{stroke:var(--bad);}
.hb-row .v{font-family:var(--mono);font-size:12.5px;text-align:right;color:var(--muted);}
.toast-x{display:flex;align-items:center;gap:10px;margin-top:12px;padding:10px 14px;border-radius:12px;font-size:13px;background:rgba(251,113,133,.08);border:1px solid rgba(251,113,133,.4);
  opacity:0;transform:translateY(8px);transition:all var(--dur-ui) var(--ease-out);}
.toast-x.show{opacity:1;transform:none;}
.toast-x.good{background:rgba(52,211,153,.08);border-color:rgba(52,211,153,.4);}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .scene-grid,.builder{grid-template-columns:1fr;gap:28px;}
  .scene-pin{padding:64px 0;}
}
@media (max-width:760px){
  .vr,.wal,.gs{grid-template-columns:1fr;gap:40px;}
  .gs .phone{max-width:220px;}
  .bf{grid-template-columns:1fr;gap:28px;justify-items:stretch;}
  .bf-node{justify-self:center;min-width:180px;}
  .lane-track{left:11px;right:auto;top:8px;bottom:8px;width:2px;height:auto;}
  .lane-fill{transform-origin:top;transform:scaleY(var(--lp,0));background:linear-gradient(180deg,var(--violet-light),var(--amber));}
  .lane-nodes{grid-template-columns:1fr;gap:14px;}
  .lane-nodes li{grid-template-columns:30px 1fr;}
  .lane-nodes li .sdot{grid-row:span 3;margin:0;}
  .lane-nodes li b{margin-top:0;}
  .md-lane{grid-template-columns:72px minmax(0,1fr);}
  .md-lane .st{grid-column:2;text-align:left;margin-top:-6px;}
  .hb-row{grid-template-columns:80px minmax(0,1fr) 70px;}
  .works .watch-chip{margin-left:0;}
  .scale-stage{aspect-ratio:4/5;}
}
@media (prefers-reduced-motion:reduce){
  .btn-trial,.btn-trial::before,.btn-trial .arrow{transition:none!important;}
  .btn-trial:is(:hover,:focus-visible){transform:none;}
  .btn-trial:is(:hover,:focus-visible)::before{transform:translateX(-120%);}
  .btn-trial:is(:hover,:focus-visible) .arrow{transform:none;}
  .wires path.flow,.md-pipe i,.sdot.ping::after,.v-code .caret,.b-pub .spin{animation:none!important;}
  .md-pipe i{transform:translateX(calc(var(--w,600px) * var(--pos,.5)));}
  .p-wipe.go,[role="tabpanel"]{transition:none;animation:none;}
}

/* ---------- Polish pass (Nov 2026) ---------- */
/* Browser surfaces in the brand palette. */
::selection{background:rgba(139,124,255,.38);color:var(--text);}
html{scrollbar-color:rgba(244,242,250,.22) var(--obsidian);accent-color:var(--violet-light);caret-color:var(--amber);}
/* One heading rhythm: the older sections inherited the body's 1.55 line height. */
h2{line-height:1.12;}
h3{line-height:1.25;}
.nw{white-space:nowrap;}
.eyebrow{text-wrap:balance;}
/* Small labels lifted to a readable floor. */
.nav-new{font-size:11px;}
.theater-item .thumb em{font-size:11.5px;}
.live-feed .feed-label{font-size:11px;align-self:start;justify-self:start;padding:4px 10px 4px 8px;border-radius:99px;background:rgba(11,14,20,.72);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.stage-head{flex-wrap:wrap;}
.stage-head .sub{font:500 11.5px var(--mono);color:var(--muted-2);white-space:nowrap;}
.p-item{gap:10px;}
.p-item span{white-space:nowrap;}
@media (max-width:760px){
  .gs .phone{max-width:260px;}
  .builder .phone{aspect-ratio:9/15;}
}
@media (max-width:560px){
  .hero-ctas > *{flex:1 1 100%;justify-content:center;}
  .hero-paths a{width:100%;}
  .hero-paths a .k{min-width:96px;}
  .float-card.portal{position:relative;right:auto;bottom:auto;margin:14px 0 0;min-width:0;}
  .mbar .btn{white-space:nowrap;}
}
/* Touch screens: every control at least 44px tall. */
@media (pointer:coarse){
  .watch-chip,.motion-toggle,.b-ctl,.tab,.seg button,.chapters button,.works a,.b-sw{min-height:44px;}
  .watch-chip,.motion-toggle{padding-top:0;padding-bottom:0;}
  .b-sw{min-width:44px;}
}
/* FAQ: the whole row is the tap target, not just the question text. */
.faq-item{padding:0;}
.faq-item summary{padding:22px 24px;}
.faq-item p{margin-top:0;padding:0 24px 22px;}
@media (pointer:coarse){
  .site-nav .brand{min-height:44px;}
  .site-nav .btn-sm{min-height:40px;}
}
/* Contrast: mock-up subtitles and the early-access band met 3.8–4.2:1; lift them past 4.5:1. */
.p-sub{opacity:1;}
.early-band .eyebrow,.early-band a:not(.btn){color:#B4AAFF;}
@media (max-width:560px){
  .hero-play.bond-play{position:relative;left:auto;bottom:auto;margin-top:14px;}
}
