/* Line 15804 (upskill-doors-5-r1, ai.features.doors_google_path): the Google path for the doors pages that are not in the
   split shell. Every value is a --ns-* token from css/ns-tokens.css (.ns-gp: light by default, dark with the device);
   nothing here draws a colour of its own. Loaded only while the key is on.
   - .ns-doors-gp  the /get-started selector and the five segment pages (Bootstrap dark cards re-dressed);
   - .ns-doors-pp  the ended and kept prospect preview pages;
   - .ns-doors-proof  the "shipped by our AI agent team" line, wherever a page carries it. */

.ns-doors-gp {
    font-family: var(--ns-font);
    color: var(--ns-text);
}

body:has(.ns-doors-gp) { background: var(--ns-bg) !important; color: var(--ns-text); }

.ns-doors-gp h1, .ns-doors-gp h2, .ns-doors-gp h3, .ns-doors-gp h4,
.ns-doors-gp .h2, .ns-doors-gp .h4, .ns-doors-gp .h5, .ns-doors-gp .h6 {
    color: var(--ns-text);
    letter-spacing: 0;
}

.ns-doors-gp .text-muted { color: var(--ns-text-2) !important; }

.ns-doors-gp .card,
.ns-doors-gp .card.bg-dark {
    background: var(--ns-card) !important;
    color: var(--ns-text);
    border: 1px solid var(--ns-border) !important;
    border-radius: var(--ns-radius);
    box-shadow: 0 1px 2px rgba(60, 64, 67, .12), 0 1px 3px 1px rgba(60, 64, 67, .08);
}

.ns-doors-gp .card:hover,
.ns-doors-gp .card:focus-within { border-color: var(--ns-border-strong) !important; }

.ns-doors-gp .card-footer { background: transparent; border-top: 1px solid var(--ns-border) !important; }

.ns-doors-gp .badge.bg-dark {
    background: var(--ns-surface) !important;
    color: var(--ns-text-2);
    border-color: var(--ns-border) !important;
}

.ns-doors-gp .btn-outline-secondary {
    color: var(--ns-text);
    border-color: var(--ns-border-strong);
    border-radius: 999px;
}

.ns-doors-gp .btn { border-radius: 999px; min-height: 40px; }

.ns-doors-gp .btn-success,
.ns-doors-gp .badge.bg-success {
    background: var(--ns-gold) !important;
    border-color: var(--ns-gold) !important;
    color: var(--ns-on-accent) !important;
}

.ns-doors-gp a:not(.btn) { color: var(--ns-gold-light); }

.ns-doors-gp .rounded-3[style*="rgba(255,255,255,0.03)"] { background: var(--ns-surface) !important; }

@media (max-width: 575.98px) {
    .ns-doors-gp.container { padding-left: 16px; padding-right: 16px; }
    .ns-doors-gp .display-5 { font-size: 2rem; }
}

/* The ended and kept prospect preview: NetShow's own page, so the tokens replace the draft's palette. */
body.ns-doors-pp {
    --pp-bg: var(--ns-bg);
    --pp-fg: var(--ns-text);
    --pp-accent: var(--ns-gold-light);
    font-family: var(--ns-font);
}

body.ns-doors-pp .pp-stale { color: var(--ns-text-2); opacity: 1; }

body.ns-doors-pp .pp-keep {
    background: var(--ns-gold);
    color: var(--ns-on-accent);
}

/* The shipped proof line. */
.ns-doors-proof {
    font-family: var(--ns-font, inherit);
    color: var(--ns-text-2, inherit);
}

.ns-doors-proof a { color: var(--ns-gold-light, inherit); }

/* Doors slice 8: the shared ns-tokens.css palette; no independent theme. */
.ns-gp.ns-content-page,
.ns-gp .ns-content-hero,
.ns-gp .ns-content-body,
.ns-gp .ns-content-cta,
.ns-gp .ns-docs-shell {
    background: var(--ns-bg);
    color: var(--ns-text);
    font-family: var(--ns-font);
}
.ns-gp :is(.ns-content-card, .ns-help-find, .ns-help-more, .ns-docs-card) {
    background: var(--ns-card);
    color: var(--ns-text);
    border-color: var(--ns-border);
    border-radius: var(--ns-radius);
}
.ns-gp :is(.ns-content-hero, .ns-content-body, .ns-content-cta) :is(h1,h2,h3,h4,strong) { color: var(--ns-text); }
.ns-gp :is(.ns-content-hero, .ns-content-body, .ns-content-cta) p { color: var(--ns-text-2); }
.ns-gp :is(.ns-help-find__input, .ns-docs-search input) {
    background: var(--ns-surface); color: var(--ns-text); border-color: var(--ns-border-strong); font-size: 1rem;
}
.ns-gp :is(.ns-content-btn-primary, .ns-aie-btn-primary) { background: var(--ns-gold); color: var(--ns-on-accent); }
.ns-gp :is(.ns-content-btn-secondary, .ns-aie-btn-secondary) { background: var(--ns-surface); color: var(--ns-text); border-color: var(--ns-border-strong); }
.ns-gp .ns-aie-ctas .ns-content-btn-ghost { background: var(--ns-surface); color: var(--ns-text); border-color: var(--ns-border-strong); }
.ns-gp .landing-header { background: var(--ns-bg); border-color: var(--ns-border); }
.ns-gp .landing-header a { color: var(--ns-text); }
.ns-docs-shell.ns-gp {
    --ns-text-primary: var(--ns-text); --ns-text-secondary: var(--ns-text-2);
    --ns-bg-secondary: var(--ns-card); --ns-bg-surface: var(--ns-surface);
    background: var(--ns-bg); color: var(--ns-text); font-family: var(--ns-font);
}
.ns-docs-shell.ns-gp :is(.ns-docs-home-hero, .ns-docs-home-card, .ns-docs-home-link, .ns-docs-search, .ns-ai-intro) {
    background: var(--ns-card); color: var(--ns-text); border-color: var(--ns-border); box-shadow: none;
}
.ns-docs-shell.ns-gp :is(h1,h2,h3) { color: var(--ns-text) !important; }
.ns-docs-shell.ns-gp :is(p, .text-muted) { color: var(--ns-text-2) !important; }
/* The live door already hosts this page; the old static guide card is a duplicate host. */
.ns-docs-shell.ns-gp .ns-guide-presence--compact { display: none; }
.ns-gp :is(.ns-aie-hero, .ns-aie, .ns-aie-final) {
    --aie-ink: var(--ns-text); --aie-text: var(--ns-text); --aie-muted: var(--ns-text-2);
    --aie-accent: var(--ns-gold-light); --aie-card: var(--ns-card); --aie-line: var(--ns-border);
}
.ns-gp .ns-aie-face { border: 0; border-radius: 0; object-fit: contain; }
[data-door-live-hello="1"] .ns-door-voice-talk { display: none !important; }
[data-door-live-hello="1"] .ns-door-voice-menu { font-family: var(--ns-font, system-ui); }
.ns-gp :is(.ns-phone-card, .ns-avatar-menu-panel) {
    background: var(--ns-card); color: var(--ns-text); border-color: var(--ns-border); border-radius: var(--ns-radius);
}
.ns-gp :focus-visible { outline: 2px solid var(--ns-gold-light); outline-offset: 3px; }
@media (max-width: 480px) {
    .ns-gp .ns-content-container { padding-inline: 16px; }
    .ns-gp :is(.ns-help-find__input, .ns-docs-search input) { max-width: 100%; }
}

/* The existing host and its existing menu stay the only stage surface. With no ground of its own the dock
   takes the page's ink, so its name, "Open" and greeting read on light pages outside the token scope (line 16208;
   line 16220: 1.04:1 on the signed-out light pages); the parts that still paint the dark ground keep the light ink
   in css/alive-dock.css. */
.alive-dock[data-door-live-hello="1"] {
    background: transparent !important; border: 0 !important; box-shadow: none !important; border-radius: 0 !important;
    color: inherit !important;
}
[data-door-live-hello="1"] .ns-door-voice-menu > summary { font-size: 0; }
[data-door-live-hello="1"] .ns-door-voice-menu > summary span { font-size: 18px; }
@media (hover: hover) {
    [data-door-live-hello="1"] .ns-door-voice-menu:not([open]) { opacity: 0; }
    [data-door-live-hello="1"]:is(:hover, :focus-within) .ns-door-voice-menu { opacity: 1; }
}

/* Line 15808 (doors_stack_2026): the upskill-doors-9 doors read the same tokens. Each root carries
   .ns-gp .ns-doors26 only while its key is lit (App\Support\Door\DoorsStack2026::rootClass()); light by default,
   dark under prefers-color-scheme: dark. The page roots paint a full-bleed ground (border-image outset, never a
   sideways scroll), the same way the looks pages do. */
.ns-doors26 { font-family: var(--ns-font); }
.ns-doors26 :is(a, button, select, summary):focus-visible { outline: 2px solid var(--ns-focus); outline-offset: 2px; }
:is(.meet, .ns-es-tw).ns-doors26 {
    color: var(--ns-text);
    background: var(--ns-bg);
    border-image: conic-gradient(var(--ns-bg) 0 0) fill 0 / / 0 100vmax;
}

/* /meet and /meet/{anchor} (meet.partials.tokens) */
.meet.ns-doors26 {
    --meet-surface: var(--ns-card); --meet-surface-alt: var(--ns-surface);
    --meet-border: var(--ns-border); --meet-border-strong: var(--ns-border-strong);
    --meet-text: var(--ns-text); --meet-text-dim: var(--ns-text-2); --meet-text-mute: var(--ns-text-2);
    --meet-accent: var(--ns-gold-light); --meet-accent-glow: var(--ns-gold-glow);
}
.meet.ns-doors26 .meet__card:is(:hover, :focus-visible) {
    box-shadow: 0 1px 2px rgba(60, 64, 67, .3), 0 2px 6px 2px rgba(60, 64, 67, .15);
}

/* /es/sitios-web-que-hablan */
.ns-es-tw.ns-doors26 {
    --tw-ink: var(--ns-text); --tw-mute: var(--ns-text-2); --tw-gold: var(--ns-gold-light);
    --tw-line: var(--ns-border); --tw-card: var(--ns-card);
}
.ns-es-tw.ns-doors26 .ns-es-tw-btn--primary { background: var(--ns-gold); border-color: var(--ns-gold); color: var(--ns-on-accent); }
.ns-es-tw.ns-doors26 .ns-es-tw-frame { background: var(--ns-surface); }
.ns-es-tw.ns-doors26 .ns-es-tw-site i { background: var(--ns-border-strong); }
.ns-es-tw.ns-doors26 .ns-es-tw-mini-host span { background: var(--ns-card); }

/* The guide popout (components.netshow.guide-popout) reads the design-system names; point them at the tokens. */
#ns-guide-popout.ns-doors26 {
    --ns-bg-elevated: var(--ns-card); --ns-bg-surface: var(--ns-card);
    --ns-text-primary: var(--ns-text); --ns-text-muted: var(--ns-text-2);
    --ns-accent: var(--ns-gold); --ns-accent-subtle: var(--ns-gold-glow); --ns-accent-text: var(--ns-gold-light);
}
#ns-guide-popout.ns-doors26 :is(.ns-guide-pill, .ns-guide-panel) { box-shadow: 0 1px 3px rgba(60, 64, 67, .3), 0 4px 8px 3px rgba(60, 64, 67, .15); }
#ns-guide-popout.ns-doors26 :is(.ns-guide-send, .ns-guide-ptt.is-holding) { color: var(--ns-on-accent); }

/* The home talk door on /agent/{slug}: one calm accent button over any hero; its status line and language
   switch keep the hero's own colours so they stay readable on it. */
.agent-talk-door.ns-doors26 .agent-talk-door__btn {
    background: var(--ns-gold); color: var(--ns-on-accent); box-shadow: none; font-family: var(--ns-font);
}
.agent-talk-door.ns-doors26 .agent-talk-door__btn:hover { background: var(--ns-gold-deep); }
.agent-talk-door.ns-doors26 .ns-greet-lang__select { background: var(--ns-surface); color: var(--ns-text); border-color: var(--ns-border-strong); }

/* Line 15815 (upskill-doors-16, ai.features.upskill_doors_16): the doors a stranger walks through first (/stage-demo,
   /meet, /meet/{slug}, /talking-websites and its trade pages, /voice-demo, /p/live-shows). The page root carries
   class="ns-gp ns-doors" (App\Support\Marketing\DoorsUpskill16::rootClass), so the .ns-gp set of ns-tokens.css (light,
   dark by the device) is in scope; here each page's own palette names point at those tokens. No new colour. */
.ns-doors {
    /* design-system.css names: the stage demo, the voice demo, the meet tokens, the product shell */
    --ns-bg-primary: var(--ns-bg);
    --ns-bg-secondary: var(--ns-bg-deep);
    --ns-bg-tertiary: var(--ns-surface);
    --ns-bg-surface: var(--ns-surface);
    --ns-bg-card: var(--ns-card);
    --ns-bg-elevated: var(--ns-elevated);
    --ns-text-primary: var(--ns-text);
    --ns-text-secondary: var(--ns-text-2);
    --ns-text-muted: var(--ns-text-2);
    --ns-accent: var(--ns-gold-light);
    --ns-accent-hover: var(--ns-gold-deep);
    --ns-accent-subtle: var(--ns-gold-glow);
    --ns-accent-glow: var(--ns-gold-glow);
    --ns-accent-text: var(--ns-bg);
    --ns-border-subtle: var(--ns-border);
    --ns-font-body: var(--ns-font);
    /* the trade pages' own names */
    --ink: var(--ns-text);
    --muted: var(--ns-text-2);
    --blue: var(--ns-gold-light);
    --pale: var(--ns-surface);
    background-color: var(--ns-bg);
    color: var(--ns-text);
    font-family: var(--ns-font);
}
.ns-doors :is(h1, h2, h3) { font-family: var(--ns-font); }
.ns-doors :focus-visible { outline: 2px solid var(--ns-gold-light); outline-offset: 3px; }

/* /meet and /meet/{slug}: the buttons' dark ink reads on the dark accent only; the token pair reads in both schemes. */
.meet.ns-doors { background-color: var(--ns-bg); }
.meet.ns-doors :is(.meet__btn, .meet__btn:hover, .meet__btn:focus-visible) { color: var(--ns-accent-text); }
.meet.ns-doors .meet__card { background: var(--ns-card); border-color: var(--ns-border); }
.meet.ns-doors .meet-face-cap { color: var(--ns-text-2); }

/* /talking-websites: the page already reads the --ns-* names; it gains the ground. The drawn 'Your Business' page keeps
   its own paper colours: it is a picture of a customer's site. */
.tw.ns-doors { background-color: var(--ns-bg); }

/* /talking-websites/{trade}: the literal blues and whites of trade-pages.css. */
.ns-trade.ns-doors { background: var(--ns-bg); font-family: var(--ns-font); }
.ns-trade.ns-doors a:not(.ns-trade-button),
.ns-trade.ns-doors .ns-trade-link,
.ns-trade.ns-doors .ns-trade-price { color: var(--ns-gold-light); }
.ns-trade.ns-doors .ns-trade-button { background: var(--ns-gold); color: var(--ns-on-accent) !important; }
.ns-trade.ns-doors .ns-trade-button:hover { background: var(--ns-gold-deep); }
.ns-trade.ns-doors :is(.ns-trade-section, .ns-trade-moments li, .ns-trade-faq-item) { border-color: var(--ns-border); }
.ns-trade.ns-doors .ns-trade-site { background: var(--ns-card); border-color: var(--ns-border-strong); box-shadow: none; }
.ns-trade.ns-doors .ns-trade-site-bar { background: var(--ns-surface); border-color: var(--ns-border); }
.ns-trade.ns-doors :is(.ns-trade-site-intro, .ns-trade-spoken, .ns-trade-checks li, .ns-trade-question-list li, .ns-trade-desk) { background: var(--ns-surface); color: var(--ns-text); }
.ns-trade.ns-doors .ns-trade-package { background: var(--ns-surface); border-color: var(--ns-gold-border); }
.ns-trade.ns-doors .ns-trade-includes li { background: var(--ns-card); }
.ns-trade.ns-doors :is(.ns-trade-site-icon, .ns-trade-tag) { background: var(--ns-elevated); color: var(--ns-text); }
.ns-trade.ns-doors :is(.ns-trade-moments span, .ns-trade-site-dots) { color: var(--ns-text-2); }
.ns-trade.ns-doors .ns-trade-checks li::before { color: var(--ns-gold-light); }
.ns-trade.ns-doors .ns-trade-final { background: var(--ns-elevated); color: var(--ns-text); }
.ns-trade.ns-doors .ns-trade-final .ns-trade-link { color: var(--ns-gold-light); }

/* /voice-demo: its cards and transcript were drawn for a dark page only. */
.ns-doors--vd .vd-section-alt { background: var(--ns-bg-deep); }
.ns-doors--vd .vd-card { background: var(--ns-card); border-color: var(--ns-border); }
.ns-doors--vd .vd-card:hover { border-color: var(--ns-gold-border); }
.ns-doors--vd .vd-transcript { background: var(--ns-surface); border-color: var(--ns-border); color: var(--ns-text); }
.ns-doors--vd :is(.vd-phone-cta, .vd-phone-cta:hover, .vd-step-num) { color: var(--ns-accent-text); }
/* Line 16256 live check: "Hear her", "Type to her now", the host caption and "See Owner Operator" kept the dark page's white ink (the link's is inline, so its rule outweighs it). */
.ns-doors--vd .vd-talk-cta { color: var(--ns-text); }
.ns-doors--vd .vd-agent-face figcaption { color: var(--ns-text-2); }
.ns-doors--vd .vd-section a[href$="/owner-operator"] { color: var(--ns-text) !important; border-color: var(--ns-border-strong) !important; }

/* /p/live-shows: the product shell's hero and cards. */
.ns-doors--ls { padding-bottom: 24px; }
.ns-doors--ls :is(.ns-plp-btn-primary, .ns-plp-steps__num) { color: var(--ns-accent-text); }

/* H-0071: gold fills are not text ink; the same token pair follows either scheme. */
.tw.ns-doors :is(.tw-kicker, .tw-step-n) { color: var(--ns-gold-light) !important; }
.tw.ns-doors .tw-tag-build { color: var(--ns-text); background: var(--ns-surface); }
.tw.ns-doors .tw-step[data-tw-ticked] .tw-step-n { color: var(--ns-on-accent) !important; }
