/* Line 15813 (upskill-doors-14): the doors of part 14 on the Google-path tokens (css/ns-tokens.css, .ns-gp: light by
   default, dark under prefers-color-scheme: dark). Loaded only while ai.features.doors_upskill_14 is on
   (App\Support\Marketing\DoorsUpskill14); every rule is scoped to a root that carries .ns-gp only while lit. */

/* The owner offline bar: one calm inverse bar, Google's snackbar (dark ink on light pages, light ink on dark). */
.ns-offline-banner.ns-gp .ns-offline-banner__text {
    background: var(--ns-text);
    color: var(--ns-bg);
    font-family: var(--ns-font);
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(60, 64, 67, .3);
}
.ns-offline-banner.ns-gp[data-state="online"] .ns-offline-banner__text { background: #137333; color: #ffffff; }

/* layouts.content pages that take the scope (/be-in-two-places, /agentic-businesses). */
.ns-gp.ns-content-page { background: var(--ns-bg); color: var(--ns-text); }

/* /be-in-two-places: the hire article's own colour words re-pointed at the tokens. */
.ns-hire.ns-gp {
    --hire-bg: var(--ns-bg);
    --hire-panel: var(--ns-surface);
    --hire-line: var(--ns-border-strong);
    --hire-text: var(--ns-text);
    --hire-soft: var(--ns-text-2);
    --hire-accent: var(--ns-gold);
    --hire-accent-ink: var(--ns-on-accent);
    font-family: var(--ns-font);
}
.ns-hire.ns-gp :is(h1, h2, h3, .ns-hire__label, .ns-hire__still-state, .ns-hire__opener, .ns-hire__trade, .ns-hire__price-figure, .ns-hire__card-price) { color: var(--ns-text); }
.ns-hire.ns-gp a { color: var(--ns-gold-light); }
.ns-hire.ns-gp .ns-hire__btn { background: var(--ns-card); color: var(--ns-text); border-color: var(--ns-border-strong); border-radius: 8px; }
.ns-hire.ns-gp .ns-hire__btn--primary,
.ns-hire.ns-gp a.ns-hire__btn--primary { background: var(--ns-gold); color: var(--ns-on-accent); border-color: transparent; }
.ns-hire.ns-gp .ns-hire__guard { background: var(--ns-surface); color: var(--ns-text); }
.ns-hire.ns-gp .ns-hire__card { background: var(--ns-card); border-color: var(--ns-border-strong); }
/* The twin example wears the host's live ASCII face (js/admin-6-face-button.js), never a photo. */
.ns-twin__face {
    display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; margin: 0;
    border-radius: 16px; border: 1px solid var(--ns-border-strong); background: var(--ns-surface); color: var(--ns-text);
    font: 600 10px/1.05 ui-monospace, 'Roboto Mono', Menlo, Consolas, monospace; white-space: pre; overflow: hidden;
}

/* /agentic-businesses: the page already reads --ns-*; the white-alpha lines and gold tints follow the scheme too. */
.nsab.ns-gp { font-family: var(--ns-font); }
.nsab.ns-gp .nsab-btn--ghost { border-color: var(--ns-border-strong); }
.nsab.ns-gp :is(.nsab-steps li, .nsab-cards li) { border-color: var(--ns-border); }
.nsab.ns-gp .nsab-faq details { border-bottom-color: var(--ns-border); }
.nsab.ns-gp :is(.nsab-disclosure, .nsab-status, .nsab-book) { background: var(--ns-gold-glow); }

/* The keyed-in strip (/studio, /ai-employees). */
.keyed-in-strip.ns-gp { background: var(--ns-surface); color: var(--ns-text); border-block: 1px solid var(--ns-border); font-family: var(--ns-font); }
.keyed-in-strip.ns-gp .keyed-in-inner :is(h2, .keyed-in-item) { color: var(--ns-text); }
.keyed-in-strip.ns-gp .keyed-in-item { background: var(--ns-card); border-color: var(--ns-border-strong); }
.keyed-in-strip.ns-gp a.keyed-in-item:hover { border-color: var(--ns-gold-light); }
.keyed-in-strip.ns-gp .keyed-in-plain { color: var(--ns-text-2); }

/* The /compare shell pages (and so their phone and tablet holds: the layout rules keep working, only colour moves). */
.ns-compare.ns-gp {
    --ink: var(--ns-text);
    --muted: var(--ns-text-2);
    --blue: var(--ns-gold-light);
    background: var(--ns-bg);
    font-family: var(--ns-font);
}
.ns-compare.ns-gp .ns-compare-button { background: var(--ns-gold); color: var(--ns-on-accent) !important; border-radius: 8px; }
.ns-compare.ns-gp .ns-compare-button:hover { background: var(--ns-gold-deep); }
.ns-compare.ns-gp :is(.ns-compare-link, a:not(.ns-compare-button)) { color: var(--ns-gold-light); }
.ns-compare.ns-gp .ns-compare-section,
.ns-compare.ns-gp .ns-compare-faq-item { border-color: var(--ns-border); }
.ns-compare.ns-gp .ns-compare-table-wrap { border-color: var(--ns-border-strong); border-radius: var(--ns-radius); }
.ns-compare.ns-gp .ns-compare-table :is(th, td) { border-bottom-color: var(--ns-border); }
.ns-compare.ns-gp .ns-compare-table thead th { background: var(--ns-surface); }
.ns-compare.ns-gp .ns-compare-table thead th:nth-child(2),
.ns-compare.ns-gp .ns-compare-table tbody td:nth-child(2) { background: var(--ns-gold-glow); }
.ns-compare.ns-gp :is(.ns-compare-fair, .ns-compare-includes li) { background: var(--ns-surface); }
.ns-compare.ns-gp .ns-compare-package { background: var(--ns-card); border-color: var(--ns-border-strong); border-radius: var(--ns-radius); }
.ns-compare.ns-gp .ns-compare-price { color: var(--ns-text); }
.ns-compare.ns-gp .ns-compare-tag { background: var(--ns-gold-glow); color: var(--ns-text); }
.ns-compare.ns-gp .ns-compare-final { background: var(--ns-surface); color: var(--ns-text); border: 1px solid var(--ns-border-strong); }

/* The legacy frame /wechat/embeded_chat: the host's live ASCII face is the button; the frame sits on the tokens. */
.ns-lf-circle { position: fixed; right: 16px; bottom: 16px; z-index: 2147483000; }
.ns-lf-face-btn {
    display: grid; justify-items: center; gap: 2px; min-width: 96px; min-height: 62px; padding: 8px 10px; cursor: pointer;
    border-radius: 18px; border: 1px solid var(--ns-border-strong); background: var(--ns-card); color: var(--ns-text);
    box-shadow: 0 4px 14px rgba(60, 64, 67, .24); font-family: var(--ns-font);
}
.ns-lf-face-btn:focus-visible { outline: 3px solid var(--ns-gold-light); outline-offset: 3px; }
.ns-lf-face { display: block; margin: 0; font: 600 12px/1.05 ui-monospace, 'Roboto Mono', Menlo, Consolas, monospace; white-space: pre; pointer-events: none; }
.ns-lf-face-label { font-size: .72rem; color: var(--ns-text-2); }
.ns-lf-hidden { display: none !important; }
.iframe-container.ns-gp {
    position: fixed; right: 5px; bottom: 5px; width: min(400px, calc(100vw - 10px)); height: min(700px, calc(100vh - 10px));
    border-radius: 12px; overflow: hidden; background: var(--ns-bg); border: 1px solid var(--ns-border-strong);
    box-shadow: 0 8px 28px rgba(60, 64, 67, .3); z-index: 2147483000;
}
.iframe-container.ns-gp .iframe-header {
    display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 8px;
    background: var(--ns-surface); color: var(--ns-text); font: 500 .85rem var(--ns-font); cursor: move;
}
.iframe-container.ns-gp .iframe-controls { display: flex; gap: 4px; }
.iframe-container.ns-gp .iframe-controls > span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; cursor: pointer; }
.iframe-container.ns-gp .custom_svg { fill: currentColor; }
.iframe-container.ns-gp .custom_svg path[fill="none"] { fill: none; }
.iframe-container.ns-gp iframe { display: block; width: 100%; height: calc(100% - 44px); border: 0; background: var(--ns-bg); }
/* The frame opens small: expand shows, minimize waits until expanded (the script then sets it inline). */
.iframe-container.ns-gp #minimize { display: none; }

/* H-0064: keep disclosure ink legible over the tinted disclosure ground. */
.nsab.ns-gp .nsab-disclosure { color: var(--ns-text); }
