/* Design tokens. Light theme "studio" is the default, dark theme "night" follows the OS
   unless html[data-pq-theme] pins an explicit choice. Geometry differs between themes on
   purpose: studio is flat with a hard border, night is glassy. */

:root,
html[data-pq-theme="studio"] {
    --pq-bg: #efe9ff;
    --pq-ink: #1d1235;
    --pq-muted: #655a80;
    --pq-primary: #8a5af7;
    --pq-soft: rgba(138, 90, 247, .16);
    --pq-success: #1fa868;
    --pq-danger: #ef4343;
    --pq-gold: #f5c542;
    --pq-panel: #ffffff;
    --pq-border: 2.5px solid #1d1235;
    --pq-radius: 18px;
    --pq-shadow: 5px 5px 0 #1d1235;
    --pq-btn-shadow: 4px 4px 0 #1d1235;
    --pq-field: #ffffff;
    --pq-line: #1d1235;
    --pq-track: rgba(29, 18, 53, .1);
    --pq-dash: rgba(29, 18, 53, .45);
    --pq-gold-ink: #8a6300;
    --pq-menu: #ffffff;
    --pq-buzz-base: #a01f1f;

    --pq-fam-onboard: #8a5af7;
    --pq-fam-teams: #0f9bd7;
    --pq-fam-board: #8a5af7;
    --pq-fam-buzz: #ef4343;
    --pq-fam-answer: #8a5af7;
    --pq-fam-judge: #1fa868;
    --pq-fam-bid: #d99b00;
    --pq-fam-pick: #e0662a;
    --pq-fam-ackwait: #655a80;
    --pq-fam-results: #8a5af7;
    --pq-fam-gameover: #ef4343;

    --pq-accent: var(--pq-primary);
}

@media (prefers-color-scheme: dark) {
    html:not([data-pq-theme]) {
        --pq-bg: #140f28;
        --pq-ink: #f4f0ff;
        --pq-muted: #9c92bd;
        --pq-primary: #a97cff;
        --pq-soft: rgba(169, 124, 255, .16);
        --pq-success: #2fd08a;
        --pq-danger: #ff5765;
        --pq-gold: #f5c542;
        --pq-panel: rgba(255, 255, 255, .055);
        --pq-border: 1px solid rgba(255, 255, 255, .1);
        --pq-radius: 26px;
        --pq-shadow: 0 14px 34px rgba(5, 2, 16, .5);
        --pq-btn-shadow: 0 10px 26px rgba(169, 124, 255, .42);
        --pq-field: rgba(255, 255, 255, .07);
        --pq-line: rgba(169, 124, 255, .3);
        --pq-track: rgba(255, 255, 255, .08);
        --pq-dash: rgba(169, 124, 255, .5);
        --pq-gold-ink: #f5c542;
        --pq-menu: #241b40;
        --pq-buzz-base: #8a1f2c;

        --pq-fam-onboard: #a97cff;
        --pq-fam-teams: #3fc0f0;
        --pq-fam-board: #a97cff;
        --pq-fam-buzz: #ff5765;
        --pq-fam-answer: #a97cff;
        --pq-fam-judge: #2fd08a;
        --pq-fam-bid: #f5c542;
        --pq-fam-pick: #ff8a4c;
        --pq-fam-ackwait: #9c92bd;
        --pq-fam-results: #a97cff;
        --pq-fam-gameover: #ff5765;

        --pq-accent: var(--pq-primary);
    }
}

html[data-pq-theme="night"] {
    --pq-bg: #140f28;
    --pq-ink: #f4f0ff;
    --pq-muted: #9c92bd;
    --pq-primary: #a97cff;
    --pq-soft: rgba(169, 124, 255, .16);
    --pq-success: #2fd08a;
    --pq-danger: #ff5765;
    --pq-gold: #f5c542;
    --pq-panel: rgba(255, 255, 255, .055);
    --pq-border: 1px solid rgba(255, 255, 255, .1);
    --pq-radius: 26px;
    --pq-shadow: 0 14px 34px rgba(5, 2, 16, .5);
    --pq-btn-shadow: 0 10px 26px rgba(169, 124, 255, .42);
    --pq-field: rgba(255, 255, 255, .07);
    --pq-line: rgba(169, 124, 255, .3);
    --pq-track: rgba(255, 255, 255, .08);
    --pq-dash: rgba(169, 124, 255, .5);
    --pq-gold-ink: #f5c542;
    --pq-menu: #241b40;
    --pq-buzz-base: #8a1f2c;

    --pq-fam-onboard: #a97cff;
    --pq-fam-teams: #3fc0f0;
    --pq-fam-board: #a97cff;
    --pq-fam-buzz: #ff5765;
    --pq-fam-answer: #a97cff;
    --pq-fam-judge: #2fd08a;
    --pq-fam-bid: #f5c542;
    --pq-fam-pick: #ff8a4c;
    --pq-fam-ackwait: #9c92bd;
    --pq-fam-results: #a97cff;
    --pq-fam-gameover: #ff5765;

    --pq-accent: var(--pq-primary);
}

/* Accent per screen family. Theme-independent: the families themselves are themed above. */

body[data-pq-screen="onboard"]  { --pq-accent: var(--pq-fam-onboard); }
body[data-pq-screen="teams"]    { --pq-accent: var(--pq-fam-teams); }
body[data-pq-screen="board"]    { --pq-accent: var(--pq-fam-board); }
body[data-pq-screen="buzz"]     { --pq-accent: var(--pq-fam-buzz); }
body[data-pq-screen="answer"]   { --pq-accent: var(--pq-fam-answer); }
body[data-pq-screen="judge"]    { --pq-accent: var(--pq-fam-judge); }
body[data-pq-screen="bid"]      { --pq-accent: var(--pq-fam-bid); }
body[data-pq-screen="pick"]     { --pq-accent: var(--pq-fam-pick); }
body[data-pq-screen="ackwait"]  { --pq-accent: var(--pq-fam-ackwait); }
body[data-pq-screen="results"]  { --pq-accent: var(--pq-fam-results); }
body[data-pq-screen="gameover"] { --pq-accent: var(--pq-fam-gameover); }

/* Party Quiz Sans, self-hosted, the same faces the Unity host uses. Both weights are real
   files, so no bold is synthesised. The legacy family name "partyquiz" and the design-bundle
   name "Play" are kept as aliases so no other stylesheet has to change. Latin + Cyrillic only;
   Arabic and CJK fall through to system-ui, as they did before. */

@font-face {
    font-family: "partyquiz";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../../../assets/fonts/party-quiz-sans-400.ttf") format("truetype");
}

@font-face {
    font-family: "partyquiz";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../../../assets/fonts/party-quiz-sans-700.ttf") format("truetype");
}

@font-face {
    font-family: "Play";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../../../assets/fonts/party-quiz-sans-400.ttf") format("truetype");
}

@font-face {
    font-family: "Play";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../../../assets/fonts/party-quiz-sans-700.ttf") format("truetype");
}

html {
    color-scheme: light dark;
}

body.partyquiz {
    background-color: var(--pq-bg);
    color: var(--pq-ink);
    font-family: "partyquiz", Play, system-ui, sans-serif;
}