/* THE STUDIO'S ONE TOKENS FILE (launch, 13 Oct 2026; the main agent: "ONE tokens file both link; the copy goes"; Sumit, 10 Oct 2026: "Home's violet everywhere").
   Every colour the studio uses is written HERE and nowhere else: the home's violet on cream, the state colours (a state's green, amber and red), the white, black and scrim,
   and the dashboard's older names as aliases of the tokens. The public home links this file, and so does the app page (the Dashboard and the sign-in gate), at /home/tokens.css,
   which is served whatever the home's switch says. A rule in any other stylesheet reads a colour by its token name and writes none. Sizes, radii, motion and fonts are not colours and stay in
   the stylesheet that draws with them. tests/test_one_tokens_file_holds_every_colour.py holds it. */
:root{
  --cream:#F4EEE5; --cream-2:#EFE6DA; --cool:#F2F4F9; --panel:#FFFFFF; --ink:#16171D; --muted:#5E6070; --rule:#E3E6EE; --soft:#ECEFF6;
  --brand:#230078; --brand-2:#7680F6; --brand-3:#C59AF9; --brand-soft:#ECEBFF; --on-brand:#FFFFFF;
  --pill:#16171D; --on-pill:#FFFFFF; --chip:linear-gradient(135deg,#7680F6,#C59AF9);
  --shadow:0 1px 2px #1617200d, 0 14px 40px #16172014;
  --done:#1D7549; --done-soft:#DDF0E5; --wait:#8A5A00; --wait-soft:#F7EAD0; --on-wait:#FFFFFF; --stop:#B3261E; --stop-soft:#F8DEDB;
  --white:#FFFFFF; --black:#000000; --scrim:#000000;
  /* what the home draws with that is the same in every theme: the chip's ink, its shadows, the hero's glows, the play button, each plan's strip, the WhatsApp button */
  --on-chip:#0B0C11; --shadow-hover:0 10px 30px #16172026; --shadow-hero:0 30px 80px #16172033; --shadow-plan:0 1px 2px #16172008; --shadow-wa:0 10px 30px #16172040;
  --glow-1:#C59AF955; --glow-2:#7680F644; --glow-3:#FFFFFF66; --play:#16171dcc;
  --strip-free:#E9E6DF; --strip-1:#E4E8F2; --strip-2:#CFD4FB; --strip-3:#E4D2FB; --whatsapp:#25D366; --on-whatsapp:#06210f;
  /* the dashboard's own names, as aliases of the tokens above (no colour in them: they follow whichever theme the tokens are in) */
  --ground:var(--cool); --surface:var(--panel); --sunk:var(--soft); --hair:var(--rule); --ink-2:color-mix(in srgb, var(--ink) 72%, var(--panel));
  --side:var(--panel); --side-ink:var(--ink-2); --live:var(--brand); --live-soft:var(--brand-soft);
  --held:var(--muted); --held-soft:var(--soft);
  /* THE PROJECTS PAGE FOLLOWS THE DASHBOARD (Puja, 23 Oct 2026: "change the color theme as per dashboard"): every --pj-* name is the dashboard's own token, so the page has the
     dashboard's ground, panels, rules and lavender in light and dark alike, with no colour of its own. The four metrics' marks are the dashboard's: lavender, its second lavender, amber
     (--wait) and green (--done). A selected or primary control is the dashboard's flat --brand, never a gradient or a glow. */
  --pj-ground:var(--cool); --pj-panel:var(--panel); --pj-panel-2:var(--soft); --pj-rule:var(--rule);
  --pj-violet:var(--brand); --pj-blue:var(--brand-2); --pj-teal:var(--done); --pj-lav-2:var(--brand); --pj-glow:0%;
  --pj-cta:var(--brand); --pj-cta-hero:var(--brand); --pj-on-cta:var(--on-brand); --pj-cta-shadow:none;
  --pj-soft-sel:var(--brand-soft); --pj-sel-border:var(--brand-2); --pj-ring:var(--brand-soft); --pj-strong-sel:var(--brand-soft); --pj-strong-sel-ink:var(--brand);
  /* THE AUDIO EDITOR'S COLOURS (studio/app/public/audio.js): a lane keeps its own hue in every theme (voice, music, effects, captions), and the picture, the playhead and the scrim are the same everywhere;
     app.css reads them by name and writes no colour of its own (the one tokens file rule). */
  --ed-black:#000; --ed-cap:#6b7486; --ed-cap-bg:rgba(0, 0, 0, .62); --ed-done:#1f9d6a; --ed-glass:rgba(255, 255, 255, .25); --ed-held:#c98a2b; --ed-music:#12917f; --ed-playhead:#e5484d; --ed-red:#d1383d; --ed-scrim:rgba(15, 12, 40, .38); --ed-sfx:#3a7bd5; --ed-shade-25:rgba(0, 0, 0, .25); --ed-shade-3:rgba(0, 0, 0, .3); --ed-voice:#d0527a; --ed-wait:#9a96b4; --ed-white:#fff; --ed-shadow:rgba(20, 16, 60, .16);
  /* THE OWNER'S TERMINAL'S OWN PALETTE (GitHub #2328, terminal.js): the terminal is dark in every theme, so none of these switch with the theme;
     app.css reads them by name and writes no colour of its own (the one tokens file rule). */
  --tm-deep:#0f1218; --tm-top:#151a23; --tm-line:#232a38; --tm-edge:#2c3342; --tm-raised:#252d3d; --tm-seam:#1b212c;
  --tm-ink:#d6dae3; --tm-strong:#e8ecf4; --tm-dim:#9aa3b5; --tm-faint:#6f7889; --tm-ghost:#4a5263; --tm-fab-ink:#c9cfdb;
  --tm-accent:#8fb4ff; --tm-arc:#6fa0ff; --tm-ok:#4cc38a; --tm-ok-ink:#6fd18b; --tm-bad:#ff7b7b; --tm-bad-ink:#ff8a8a; --tm-wait:#f0b84a; --tm-wait-dot:#e8a24a;
  --tm-run-bg:#14301f; --tm-fail-bg:#3a1519; --tm-hold-bg:#33290f; --tm-err-bg:#2d1518; --tm-warn-bg:#2a2412; --tm-badge:#e5484d; --tm-badge-ink:#ffffff;
  --tm-fab-shadow:0 2px 8px rgba(0,0,0,.3); --tm-shadow:0 8px 28px rgba(0,0,0,.45);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --cream:#12131B; --cream-2:#171826; --cool:#0E0F16; --panel:#171925; --ink:#ECECF5; --muted:#A0A2B6; --rule:#262938; --soft:#1D2030;
    --brand:#9AA2FA; --brand-soft:#7680F61f; --on-brand:#0B0C11; --pill:#ECECF5; --on-pill:#0B0C11;
    --shadow:0 1px 2px #00000050, 0 14px 40px #00000040;
    --done:#5FBE98; --done-soft:#13301F; --wait:#D9A23C; --wait-soft:#33270F; --on-wait:#0B0C11; --stop:#E0776C; --stop-soft:#361A17;
  }
}
:root[data-theme="dark"]{
  --cream:#12131B; --cream-2:#171826; --cool:#0E0F16; --panel:#171925; --ink:#ECECF5; --muted:#A0A2B6; --rule:#262938; --soft:#1D2030;
  --brand:#9AA2FA; --brand-soft:#7680F61f; --on-brand:#0B0C11; --pill:#ECECF5; --on-pill:#0B0C11;
  --shadow:0 1px 2px #00000050, 0 14px 40px #00000040;
  --done:#5FBE98; --done-soft:#13301F; --wait:#D9A23C; --wait-soft:#33270F; --on-wait:#0B0C11; --stop:#E0776C; --stop-soft:#361A17;
}