@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&family=VT323&display=swap');

/* All Waypoint color lives here. html.light inverts the set. */
:root{
  color-scheme:dark;
  --void:#000000;
  --panel:#050B05;
  --panel-fill:rgba(2,10,2,0.82);
  --panel-fill-soft:rgba(2,10,2,0.75);
  --panel-fill-mid:rgba(2,10,2,0.7);
  --panel-fill-deep:rgba(2,10,2,0.6);
  --panel-menu:rgba(2,10,2,0.96);
  --panel-input:rgba(2,10,2,0.85);
  --panel-deep:#12220f;
  --stop-fill:rgba(0,0,0,0.4);
  --drop-fill:rgba(0,0,0,0.35);
  --vote-fill:rgba(0,0,0,0.3);
  --line:#0F3D1B;
  --green-dim:#2FA83E;
  --green:#3FF35A;
  --green-bright:#B6FFC0;
  --amber:#3FF35A;
  --ink:#000000;
  --red-fail:#FF4D4D;
  --red:var(--red-fail);
  --cyan:#00FFF7;
  --pink:#FF2D6B;
  --enchant:#ffffff;
  --chip-ink:#ffffff;
  --text-body:#cfe9d2;
  --text-me:#8be0ff;
  --tag-ack:#8fb98f;
  --away:#5a6a5a;
  --vote-mute:#6a6a6a;
  --vote-mute-text:#9a9a9a;
  --vote-mute-fill:rgba(140,140,140,0.16);
  --rain-fade:rgba(0,0,0,0.08);
  --rain-glyph:#3FF35A;
  --rain-named:#B6FFC0;
  --rain-spark:#ffffff;
  --scan:rgba(0,255,70,0.025);
  --glow:rgba(63,243,90,0.55);
  --glow-soft:rgba(63,243,90,0.35);
  --glow-faint:rgba(63,243,90,0.14);
  --tint-08:color-mix(in srgb, var(--green) 8%, transparent);
  --tint-12:color-mix(in srgb, var(--green) 12%, transparent);
  --tint-15:color-mix(in srgb, var(--green) 15%, transparent);
  --overlay:rgba(0,0,0,0.35);
  --alias-pulse-dim:rgba(47,168,62,0.22);
  --alias-pulse-bright:rgba(182,255,192,0.95);
  --bg:var(--void);
  --bg-tabbar:var(--panel);
  --bg-tab-in:#081208;
  --bg-tab-act:var(--void);
  --border:var(--line);
  --border-soft:#0a2a13;
  --gutter:#1c6b28;
  --text:var(--green-dim);
  --text-dim:#1c6b28;
  --text-faint:#124a1c;
  --accent:var(--green);
  --string:var(--green-bright);
  --comment:var(--green-dim);
  --keyword:var(--green-bright);
  --func:var(--green-bright);
  --done:var(--green);
  --danger:var(--red-fail);
  --font:'Share Tech Mono', ui-monospace, monospace;
  --font-display:'VT323', monospace;
  --type-weight:500;
  --type-stroke:0px;
  --hover-faint:color-mix(in srgb, var(--green) 3.5%, transparent);
  --hover-soft:color-mix(in srgb, var(--green) 6%, transparent);
  --hover-mid:color-mix(in srgb, var(--green) 7%, transparent);
  --hover-focus:color-mix(in srgb, var(--green) 8%, transparent);
  --armed-fill:color-mix(in srgb, var(--red-fail) 12%, transparent);
}

html.light{
  color-scheme:light;
  --void:#ffffff;
  --panel:#f2f2f2;
  --panel-fill:rgba(255,255,255,0.94);
  --panel-fill-soft:rgba(255,255,255,0.96);
  --panel-fill-mid:rgba(255,255,255,0.92);
  --panel-fill-deep:rgba(255,255,255,0.88);
  --panel-menu:rgba(255,255,255,0.98);
  --panel-input:rgba(255,255,255,0.96);
  --panel-deep:#e8e8e8;
  --stop-fill:rgba(0,0,0,0.04);
  --drop-fill:rgba(0,0,0,0.04);
  --vote-fill:rgba(0,0,0,0.06);
  --line:#1a1a1a;
  --green-dim:#111111;
  --green:#000000;
  --green-bright:#000000;
  --amber:#000000;
  --ink:#ffffff;
  --cyan:#111111;
  --pink:#111111;
  --enchant:#3FF35A;
  --chip-ink:#ffffff;
  --text-body:#111111;
  --text-me:#000000;
  --tag-ack:#333333;
  --away:#777777;
  --vote-mute:#555555;
  --vote-mute-text:#333333;
  --vote-mute-fill:rgba(0,0,0,0.08);
  --rain-fade:rgba(255,255,255,0.14);
  --rain-glyph:#111111;
  --rain-named:#3FF35A;
  --rain-spark:#3FF35A;
  --scan:rgba(0,0,0,0.05);
  --glow:transparent;
  --glow-soft:transparent;
  --glow-faint:transparent;
  --overlay:rgba(0,0,0,0.28);
  --alias-pulse-dim:rgba(0,0,0,0.2);
  --alias-pulse-bright:rgba(0,0,0,0.9);
  --bg-tab-in:#ececec;
  --border-soft:#cccccc;
  --gutter:#555555;
  --text-dim:#222222;
  --text-faint:#444444;
  --type-weight:700;
  --type-stroke:0.45px;
}