/* Line 16192 (google-path-public-16192-r1, ai.features.google_path_public_16192): the Google path for the public pages of
   routes /studio/test-drive .. /{teacher} that did not yet read the tokens. Every colour is a --ns-* token from
   css/ns-tokens.css (.ns-gp: light by default, dark with the device; .ns-gp-ag: the app's theme switch); this sheet draws
   none of its own. Loaded only while the key is on (App\Support\Marketing\GooglePathPublic16192::styles()).
   - .td-page.ns-gp16192        the test-drive talk page's words under the character (/studio/test-drive/{character});
   - .td-type.ns-gp16192        its type drawer inside the host plane: it reads the shell's own tokens, so it follows the
                                split shell (dark, or light and dark once shell_design_tokens is lit); the face stays dark;
   - body.ns-gp16192            the test drive's not-ready page;
   - .lc-teachers.ns-gp16192    the Learning Center teacher page: its --lc-* set reads the house tokens and follows the
                                device (the landing layout pins data-bs-theme="dark", which kept it dark in light);
   - .ns-gp-ag.ns-gp16192     swamp chat, on the app's theme switch. */

.ns-gp16192 {
    --gp16192-h1: 28px;
    --gp16192-h1-lh: 36px;
    font-family: var(--ns-font);
}

@media (max-width: 480px) {
    .ns-gp16192 {
        --gp16192-h1: 24px;
        --gp16192-h1-lh: 32px;
    }
}

/* The test-drive talk page ---------------------------------------------------------------------------------------- */
.td-page.ns-gp16192 {
    box-sizing: border-box;
    max-width: none;
    min-height: 100%;
    margin: 0;
    padding: 24px max(16px, calc((100% - 44rem) / 2)) 40px;
    background: var(--ns-bg);
    color: var(--ns-text);
    font-size: 16px;
    line-height: 24px;
}

.td-page.ns-gp16192 h1 {
    margin: 0 0 4px;
    font-size: var(--gp16192-h1);
    line-height: var(--gp16192-h1-lh);
    font-weight: 400;
    letter-spacing: 0;
    color: var(--ns-text);
}

.td-page.ns-gp16192 .td-page-look {
    margin: 0 0 24px;
    font-size: 14px;
    line-height: 20px;
    color: var(--ns-text-2);
}

.td-page.ns-gp16192 p { margin: 0 0 12px; }

.td-page.ns-gp16192 ul {
    display: grid;
    gap: 8px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
    font-size: 16px;
    line-height: 24px;
}

.td-page.ns-gp16192 li {
    padding: 10px 16px;
    border: 1px solid var(--ns-border);
    border-radius: var(--ns-radius);
    background: var(--ns-surface);
    color: var(--ns-text);
}

.td-page.ns-gp16192 a {
    min-height: 44px;
    padding: 0 20px;
    border: 1px solid var(--ns-border-strong);
    border-radius: 999px;
    color: var(--ns-text);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

.td-page.ns-gp16192 a:hover { background: var(--ns-surface); }

.td-type.ns-gp16192 input {
    border-color: var(--ns-border-strong);
    background: var(--ns-surface);
    color: var(--ns-text);
    font-family: var(--ns-font);
}

.td-type.ns-gp16192 input::placeholder { color: var(--ns-text-2); }

.td-type.ns-gp16192 button {
    border-radius: 999px;
    background: var(--ns-gold);
    color: var(--ns-on-accent);
    font-family: var(--ns-font);
    font-weight: 500;
}

/* The not-ready page (a 404 with one line and the way back) -------------------------------------------------------- */
body.ns-gp16192 {
    background: var(--ns-bg);
    color: var(--ns-text);
}

body.ns-gp16192 main a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-top: 8px;
    padding: 0 24px;
    border-radius: 999px;
    background: var(--ns-gold);
    color: var(--ns-on-accent);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
}

/* The Learning Center teacher page ------------------------------------------------------------------------------- */
.lc-teachers.ns-gp.ns-gp16192 {
    --lc-font: var(--ns-font);
    --lc-surface: var(--ns-bg);
    --lc-surface-2: var(--ns-surface);
    --lc-on-surface: var(--ns-text);
    --lc-muted: var(--ns-text-2);
    --lc-outline: var(--ns-border-strong);
    --lc-primary: var(--ns-gold);
    --lc-on-primary: var(--ns-on-accent);
    --lc-chip-on: var(--ns-elevated);
    box-sizing: border-box;
    max-width: none;
    padding: 24px max(16px, calc((100% - 928px) / 2)) 48px;
}

.lc-teachers.ns-gp16192 .lc-head h1,
.lc-teachers.ns-gp16192 .lc-teacher h1 {
    font-size: var(--gp16192-h1);
    line-height: var(--gp16192-h1-lh);
    color: var(--ns-text);
}

.lc-teachers.ns-gp16192 .lc-card-host,
.lc-teachers.ns-gp16192 .lc-back { color: var(--ns-text); }

.lc-teachers.ns-gp16192 .lc-chip { min-height: 44px; }

/* Line 16219 (live-check-google-path-16219-r1): the landing layout's pinned dark kept the <body> around the lit page at
   #1a1a1a with white ink, and the alive dock's see-through resting pill (in <body>) kept that ink on the white page: her
   name and "Open" measured 1.00:1 at 1440 in light on app.netshow.ai. In a light browser the body follows the device too
   (system colours under color-scheme: light, so this sheet still draws no colour of its own); dark is the layout's. */
@media (prefers-color-scheme: light) {
    body:has(.lc-teachers.ns-gp16192) {
        color-scheme: light;
        background-color: Canvas;
        color: CanvasText;
    }
}

/* Swamp chat (signed in, the app's theme switch) ----------------------------------------------------------------- */
.ns-gp-ag.ns-gp16192 {
    max-width: 44rem;
    padding: 24px 16px 40px;
    border-radius: var(--ns-radius);
    background: var(--ns-bg);
    color: var(--ns-text);
    font-size: 16px;
    line-height: 24px;
}

.ns-gp-ag.ns-gp16192 h1 {
    margin: 0 0 16px !important;
    font-size: var(--gp16192-h1);
    line-height: var(--gp16192-h1-lh);
    font-weight: 400;
    color: var(--ns-text);
    text-align: left !important;
}

.ns-gp-ag.ns-gp16192 #chat-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 60vh;
    margin-bottom: 16px;
    overflow-y: auto;
}

.ns-gp-ag.ns-gp16192 #chat-container .message {
    max-width: 85%;
    padding: 10px 16px;
    border: 1px solid var(--ns-border);
    border-radius: var(--ns-radius);
    background: var(--ns-surface);
    color: var(--ns-text);
    overflow-wrap: anywhere;
}

.ns-gp-ag.ns-gp16192 #chat-container .message.user {
    align-self: flex-end;
    background: var(--ns-elevated);
}

.ns-gp-ag.ns-gp16192 .input-container-centered {
    position: static;
    gap: 8px;
    align-items: center;
    padding: 0;
    background: none;
}

.ns-gp-ag.ns-gp16192 .user-input-full {
    box-sizing: border-box;
    min-height: 48px;
    padding: 0 16px;
    border: 1px solid var(--ns-border-strong);
    border-radius: 999px;
    background: var(--ns-surface);
    color: var(--ns-text);
    font: 16px/24px var(--ns-font);
}

.ns-gp-ag.ns-gp16192 .user-input-full::placeholder { color: var(--ns-text-2); }

.ns-gp-ag.ns-gp16192 .button-res-width {
    width: auto;
    background: none;
}

.ns-gp-ag.ns-gp16192 .didagaent__send__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: var(--ns-gold);
    color: var(--ns-on-accent);
}

.ns-gp-ag.ns-gp16192 .didagaent__send__button .didagent__box__blur {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background: none;
    backdrop-filter: none;
}

.ns-gp-ag.ns-gp16192 .didagaent__send__button svg { stroke: currentColor; }
