/* The app's palette, and nothing else.
 *
 * Every style sheet in styles/ loads this first and then does whatever it
 * likes with type, rules, spacing and decoration. Keeping the colours in one
 * file is what makes six genuinely different-looking designs still read as the
 * same product - and it means a palette change is one edit rather than seven.
 *
 * Light is the app's Classic Sky theme. Dark is its Midnight theme. Same
 * values, taken from src/constants/theme.ts.
 */

:root {
  color-scheme: light;

  --ground:#F7FBFF;
  --surface:#FFFFFF;
  --surface-2:#EFF6FA;

  --rule:#C9DBE8;
  --rule-soft:#DEEAF2;

  --ink:#0F172A;
  --ink-2:#48596A;
  --ink-3:#7C8D9B;

  --primary:#0788FF;
  --primary-deep:#0060BC;
  --primary-soft:#EAF6FF;

  --lime:#B7F34A;
  --lime-ink:#294D12;
  --lime-soft:#F2FCD9;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;

    --ground:#0B1219;
    --surface:#131C26;
    --surface-2:#1B2733;

    --rule:#2A3745;
    --rule-soft:#22303B;

    --ink:#E8EEF4;
    --ink-2:#9DB0C2;
    --ink-3:#6B8299;

    --primary:#4C9DFF;
    --primary-deep:#8CC6FF;
    --primary-soft:#152B41;

    --lime:#A8E063;
    --lime-ink:#16260C;
    --lime-soft:#1E2A17;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;

  --ground:#0B1219;
  --surface:#131C26;
  --surface-2:#1B2733;

  --rule:#2A3745;
  --rule-soft:#22303B;

  --ink:#E8EEF4;
  --ink-2:#9DB0C2;
  --ink-3:#6B8299;

  --primary:#4C9DFF;
  --primary-deep:#8CC6FF;
  --primary-soft:#152B41;

  --lime:#A8E063;
  --lime-ink:#16260C;
  --lime-soft:#1E2A17;
}

/* Shared reset. Deliberately minimal - anything opinionated belongs to a
   style, not here. */
*{box-sizing:border-box}
body{margin:0}
img{max-width:100%}
@media (prefers-reduced-motion: reduce){*{animation:none!important; transition:none!important}}