/* The original light palette remains untouched. Dark mode is an explicit layer. */
.nav-actions{display:flex;align-items:center;gap:8px;pointer-events:auto}
.theme-toggle{width:40px;height:40px;border:1px solid var(--line-2);border-radius:50%;display:grid;place-items:center;background:var(--card);color:var(--ink);box-shadow:var(--sh);cursor:pointer;flex:none;transition:transform .2s var(--e-out),background .2s ease,color .2s ease}
.theme-toggle:hover{transform:translateY(-2px)}
.theme-toggle:active{transform:scale(.94)}
.theme-toggle svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .theme-sun{display:none}
@media(max-width:390px){.nav{gap:5px}.brand{min-width:0}.brand-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-actions{gap:6px}}
@media(max-width:350px){.brand-t{max-width:110px}}

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0f0f0f;--card:#212121;--ink-2:#dedede;--muted:#ababab;
  --line:rgba(255,255,255,.11);--line-2:rgba(255,255,255,.25);
  --link:#90b3ff;--green:#18a96b;--mint:#83e7b7;--hl:#ffd96f;
  --tint:#1a1a1a;--sand:#1d1d1d;
  --sh:0 1px 2px rgba(0,0,0,.14),0 12px 30px -12px rgba(0,0,0,.55);
  --sh-lg:0 4px 10px rgba(0,0,0,.12),0 30px 60px -20px rgba(0,0,0,.65);
}
html[data-theme="dark"] body{color:#eef3fa}
html[data-theme="dark"] .chip:not(.chip--ink){background:#272727;color:#f2f6ff}
html[data-theme="dark"] .chip--ink{background:#424242;color:#fff;box-shadow:inset 0 0 0 1px var(--line-2)}
html[data-theme="dark"] .theme-toggle{color:#fff;background:#353535;border-color:var(--line-2)}
html[data-theme="dark"] .theme-toggle .theme-moon{display:none}
html[data-theme="dark"] .theme-toggle .theme-sun{display:block}
html[data-theme="dark"] .sb,html[data-theme="dark"] .go,html[data-theme="dark"] .fi,html[data-theme="dark"] .fav,html[data-theme="dark"] .src i,html[data-theme="dark"] .res-item--you .pfav{background:#121212;color:#f6f8ff}
/* Search story: dark canvas, search results and AI summaries */
html[data-theme="dark"] .bg{background:none}
html[data-theme="dark"] .b1,html[data-theme="dark"] .b2{opacity:.13}
html[data-theme="dark"] .hero-foot b,html[data-theme="dark"] .tabs .on,html[data-theme="dark"] .aio-h{color:#f1f5fb}
html[data-theme="dark"] .tabs .on{box-shadow:inset 0 -2px 0 var(--mint)}
html[data-theme="dark"] .suggest li:first-child{background:#333333}
html[data-theme="dark"] .skel i{background:linear-gradient(90deg,#242424,#363636,#242424) 0 0/200% 100%}
html[data-theme="dark"] .aio{background:linear-gradient(130deg,#272727,#262626);box-shadow:inset 0 0 0 1px var(--line-2)}
html[data-theme="dark"] .src,html[data-theme="dark"] .you-bg{background:#303030}
html[data-theme="dark"] .pfav{background:#373737;color:#eef3fa}
html[data-theme="dark"] .res-item h4,html[data-theme="dark"] .top-res h3{color:#a6c6ff}
html[data-theme="dark"] .rank,html[data-theme="dark"] .viz-pages .add{background:#3f3f3f;color:#fff}
html[data-theme="dark"] .sheet,html[data-theme="dark"] .band--ink,html[data-theme="dark"] .contact{background:#0c0c0c;color:#f4f7fc}
html[data-theme="dark"] .ai{background:#212121;color:#f3f7ff}
html[data-theme="dark"] .ai-body{background:linear-gradient(180deg,#212121,#1a1a1a)}
html[data-theme="dark"] .ai-q,html[data-theme="dark"] .ai-tabs li.on,html[data-theme="dark"] .aic-logo{background:#3d3d3d;color:#fff}
html[data-theme="dark"] .ai-card{background:#2f2f2f}
html[data-theme="dark"] .ai-a b,html[data-theme="dark"] .aic-top b{color:#f3f7ff}
html[data-theme="dark"] .aic-facts li{background:#173b35;color:#aaf3cf}
html[data-theme="dark"] .ai-input{background:#343434}
/* Benefits, content cards, numeric cards and testimonial */
html[data-theme="dark"] .portrait{background:radial-gradient(at 25% 15%,#3f3f3f,transparent 72%),#2f2f2f}
html[data-theme="dark"] .portrait-tag{background:rgba(26,37,55,.91)}
html[data-theme="dark"] .portrait-tag b,html[data-theme="dark"] .pb-foot b,html[data-theme="dark"] .quote figcaption b{color:#eef3fa}
html[data-theme="dark"] .card{box-shadow:0 1px 0 var(--line),var(--sh)}
html[data-theme="dark"] .viz{background:#2b2b2b}
html[data-theme="dark"] .viz-serp .vs-q,html[data-theme="dark"] .viz-serp .vs-r.on,html[data-theme="dark"] .viz-pages span:not(.add){background:#414141;color:#f0f4fa}
html[data-theme="dark"] .viz-serp .vs-r{background:#3e3e3e}
html[data-theme="dark"] .viz-ai{background:linear-gradient(135deg,#343434,#2e2e2e)}
html[data-theme="dark"] .viz-ai .vl{background:rgba(255,255,255,.14)}
html[data-theme="dark"] .viz-pages{background:#2e2e2e}
html[data-theme="dark"] .viz-phone{background:#193d32}
html[data-theme="dark"] .viz-bars{background:#2d2d2d}
html[data-theme="dark"] .viz-tech{background:#131313}
html[data-theme="dark"] .nums .mini i:not(:last-child){background:#555555}
/* Interactive playbook */
html[data-theme="dark"] .pb-tab{background:#262626;color:#dce5f2}
html[data-theme="dark"] .pb-tab:hover{background:#373737}
html[data-theme="dark"] .pb-tab[aria-selected="true"]{background:#464646;color:#fff;box-shadow:inset 0 0 0 1px rgba(131,231,183,.35)}
html[data-theme="dark"] .pb-demo{background:#1a1a1a}
html[data-theme="dark"] .pb-demo--intent .q,html[data-theme="dark"] .pb-demo--tree .leaf,html[data-theme="dark"] .pb-demo--ai .ai-a,html[data-theme="dark"] .pb-demo--log span{background:#353535;color:#f0f4fa}
html[data-theme="dark"] .pb-demo--tree .root,html[data-theme="dark"] .pb-demo--ai .ai-q{background:#121212;color:#fff}
html[data-theme="dark"] .pb-demo--intent .q--cold{opacity:.76}
html[data-theme="dark"] .pb-demo--intent .q--cold b{color:#e0e9f5;background:#525252}
html[data-theme="dark"] .pb-demo--phone .ph{background:#333333;box-shadow:0 0 0 6px #131313,var(--sh-lg)}
html[data-theme="dark"] .ph-k b{color:#f4f7fc}
html[data-theme="dark"] .pb-demo--ai .ai-a b{color:#1e1e1e}
/* Contact's search-result example follows dark mode too */
html[data-theme="dark"] .top-res{background:#292929;color:#f3f7fc}
html[data-theme="dark"] .top-res .crumb b{color:#e6edf7}
html[data-theme="dark"] .bar--end{background:#1c1c1c}
@media(prefers-reduced-motion:reduce){.theme-toggle{transition:none}}
/* White headlines need a deeper highlight underlay, rather than bright yellow. */
html[data-theme="dark"] .hl{background:linear-gradient(transparent 58%,rgba(180,132,30,.46) 58%,rgba(180,132,30,.46) 94%,transparent 94%) 0 0/100% 100% no-repeat!important}
html[data-theme="dark"] .top-res .btn--line{color:#f3f7ff}
html[data-theme="dark"] .top-res .btn--line:hover{background:rgba(255,255,255,.06)}
/* Story explainer sheet: lift it off the dark page so it reads as its own panel */
html[data-theme="dark"] .sheet{background:#242424;box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px rgba(255,255,255,.14),0 -26px 60px -12px rgba(0,0,0,.75)}
html[data-theme="dark"] .sheet .handle{background:rgba(255,255,255,.3)}

/* ---- Hero scroll cue: centred under the search bar, both themes ---- */
.hero-scroll{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px;color:var(--muted);align-self:center;width:100%}
.hs-mouse{position:relative;display:block;width:18px;height:28px;border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--line-2);flex:none}
.hs-mouse b{position:absolute;left:50%;top:6px;width:3px;height:6px;margin-left:-1.5px;border-radius:2px;background:var(--ink);animation:hsWheel 1.6s var(--e-out) infinite}
@keyframes hsWheel{0%{transform:translateY(0);opacity:1}70%{transform:translateY(9px);opacity:0}100%{transform:translateY(0);opacity:0}}
@media (max-width:899px){.hero-scroll{justify-content:flex-start;margin-top:16px}}
@media (prefers-reduced-motion:reduce){.hs-mouse b{animation:none}}
html[data-theme="dark"] .hs-mouse b{background:var(--mint)}

html[data-theme="dark"] .hero-foot{background:transparent}

/* Search results: no hard blocks. Rows share the page colour; results fade out under the search bar. */
.serp-view{-webkit-mask:linear-gradient(to bottom,transparent 0,#000 22px);mask:linear-gradient(to bottom,transparent 0,#000 22px)}
html[data-theme="dark"] .res-item:not(.res-item--you){background:var(--bg)}

/* Launch: "ready to call." underline matches the Ice aurora (cyan to violet) */
.hero-h .hl{background:linear-gradient(transparent 58%,rgba(51,190,255,.42) 58%,rgba(120,110,255,.42) 94%,transparent 94%) 0 0/100% 100% no-repeat!important}
html[data-theme="dark"] .hero-h .hl{background:linear-gradient(90deg,rgba(51,215,255,.55),rgba(110,105,255,.55) 60%,rgba(200,95,255,.5)) 0 58%/100% 36% no-repeat!important}
/* photo slot hidden until the real photo arrives */
.portrait--np{background:radial-gradient(70% 60% at 30% 20%,rgba(51,190,255,.18),transparent 70%),radial-gradient(70% 60% at 80% 90%,rgba(160,110,255,.16),transparent 70%),var(--card)}

/* Footer / contact grain (both themes): fine film noise over the dark contact block */
.contact{position:relative;isolation:isolate}
.contact::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:240px 240px}
.contact::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;
  background:radial-gradient(60% 50% at 85% 0%,rgba(51,190,255,.10),transparent 70%),radial-gradient(50% 45% at 0% 100%,rgba(140,110,255,.08),transparent 70%)}
/* Clean footer separation: no corner glow; even grain; full-width hairline on top */
.contact::after{background:linear-gradient(90deg,transparent,rgba(127,231,255,.35) 30%,rgba(150,120,255,.35) 70%,transparent) top/100% 1px no-repeat!important}
html[data-theme="dark"] .contact{background:#060606;box-shadow:0 -1px 0 rgba(255,255,255,.07)}
/* contact search bar: same width as the result card, never past the edge */
.contact .bar--end{left:auto!important;right:auto!important;width:100%!important;max-width:100%;margin-left:0!important;transform:none!important}
.contact .end-search{min-width:0}