/* Line 17282 (google-path-coverage-gpc-02-pricing-and-the-landing-layout-doors-pub-r1, ai.features.google_path_coverage_02):
   GPC-02 of docs/research/google-path-coverage-20260929/ORDERS.md, the pricing and landing-layout doors, finished on the
   Google path in light and dark (App\Support\Marketing\GooglePathCoverage02). Linked only while the key is on:
   - /aisolutions (layouts.app) through config/google_path_layouts.d/google-path-coverage-02.php: <body data-ns-gpc-02>;
   - /plans, /meet/{mrs,mr}-netshow, /voice-demo, /p/learning-center/teachers and the three /wechat fragments through
     GooglePathCoverage02::head() in the view: <html data-ns-gpc-02> (the fragments also get a viewport and the tokens).
   Section T declares the canonical light and dark token set once on that root (SOURCE: the .ns-gp set of
   public/css/ns-tokens.css, same names and values as css/gp/public-3.css), so the /wechat fragments, which have no
   layout, read the same surfaces; inside a frame, prefers-color-scheme is the scheme of the page that frames it, so each
   fragment follows its parent. Every rule below reads --ns-* tokens only. The live host (stage, overlay, caption,
   hamburger) keeps its own look; only its type moves off Nunito with the page. */

/* ---------- T. The token set (light; dark under prefers-color-scheme) ---------- */
[data-ns-gpc-02] {
    --ns-bg: #ffffff;
    --ns-bg-deep: #f8f9fa;
    --ns-surface: #f1f3f4;
    --ns-elevated: #e8eaed;
    --ns-card: #ffffff;
    --ns-text: #202124;
    --ns-text-2: #5f6368;
    --ns-gold: #f9ab00;
    --ns-gold-light: #b06000;
    --ns-gold-deep: #e37400;
    --ns-border: rgba(60, 64, 67, .14);
    --ns-border-strong: rgba(60, 64, 67, .26);
    --ns-on-accent: #202124;
    --ns-focus: #1a73e8;
    --ns-font: Roboto, 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
    --ns-font-sans: var(--ns-font);
    --ns-radius: 12px;
    color-scheme: light;
}
@media (prefers-color-scheme: dark) {
    [data-ns-gpc-02] {
        --ns-bg: #202124;
        --ns-bg-deep: #1b1c1f;
        --ns-surface: #292a2d;
        --ns-elevated: #35363a;
        --ns-card: #2d2e31;
        --ns-text: #e8eaed;
        --ns-text-2: #9aa0a6;
        --ns-gold: #f5a623;
        --ns-gold-light: #fdd663;
        --ns-gold-deep: #c7851a;
        --ns-border: rgba(232, 234, 237, .12);
        --ns-border-strong: rgba(232, 234, 237, .2);
        --ns-on-accent: #202124;
        --ns-focus: #8ab4f8;
        color-scheme: dark;
    }
}

/* ---------- F. One face: Roboto, titles at 500 ---------- */

/* F1. The page, its top menu and its footer read Roboto. css/pages/netshow-stage.css draws .ns-tm and .ns-foot in
   Nunito and, on layouts.app, redeclares --ns-font as Nunito on them; css/design-system.css sets --ns-font-sans to Nunito.
   Inside the scope both read the Roboto stack again. */
[data-ns-gpc-02] :is(.ns-tm, .ns-foot) {
    --ns-font: Roboto, 'Segoe UI', system-ui, -apple-system, Arial, sans-serif;
    --ns-font-sans: var(--ns-font);
}
html[data-ns-gpc-02] body,
body[data-ns-gpc-02],
[data-ns-gpc-02] :is(.ns-tm, .ns-foot, .ns-one-footer, .ns-footer-index) {
    font-family: var(--ns-font);
}

/* F2. /aisolutions: css/pages/aisolutions.css sets `body * { font-family: 'Nunito' }`. One type selector more wins over
   it and still loses to any class (icon fonts, the host's monospace faces keep theirs); code keeps a monospace face. */
html body:where([data-ns-gpc-02]) * { font-family: var(--ns-font); }
html body:where([data-ns-gpc-02]) :is(pre, code, kbd, samp) { font-family: ui-monospace, 'Roboto Mono', Menlo, Consolas, monospace; }

/* F3. Page titles at 500 (the teachers title drew at 400, /aisolutions' at 700 !important). */
[data-ns-gpc-02] :is(main, #main-content, .lc-teachers) h1 { font-weight: 500 !important; letter-spacing: 0; }
[data-ns-gpc-02] :is(main, #main-content, .lc-teachers) h2 { font-weight: 500; }

/* ---------- P. /plans ---------- */

/* P1. The channels row: css/channels-google-path.css follows html[data-bs-theme], and layouts.landing pins
   data-bs-theme="dark", so a guest on a light device saw a dark block under the plans. It reads the device-following
   tokens instead (signed in, layouts.app's theme switch drives the same tokens). */
:root[data-ns-gpc-02] [data-channels-gp] {
    --ch-bg: var(--ns-card);
    --ch-surface: var(--ns-surface);
    --ch-text: var(--ns-text);
    --ch-text-2: var(--ns-text-2);
    --ch-line: var(--ns-border-strong);
    --ch-accent: var(--ns-gold);
    --ch-on-accent: var(--ns-on-accent);
    --ch-link: var(--ns-focus);
    --ch-font: var(--ns-font);
    --ch-shadow: none;
}

/* ---------- W. The three /wechat fragments (no layout of their own) ---------- */

/* W1. The body takes the ink and the face; its background stays the page's own (transparent on the two widgets, so the
   site that frames them shows through; the voice lab keeps its token plane from agents-17-google-path.css). */
html[data-ns-gpc-02] body { color: var(--ns-text); }
html[data-ns-gpc-02] :is(.iframe-container, #iframeContainer) { font-family: var(--ns-font); }

/* W2. The conversation frame inside the widget follows the widget's scheme (color-scheme is inherited; said once). */
html[data-ns-gpc-02] #iframeContainer iframe { color-scheme: inherit; }

/* W3. A phone never rescales the fragment's text (the viewport above keeps it at 375 px). */
html[data-ns-gpc-02] { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
