/* TOONTAP_V06_STAGE1_DESIGN_20260703: tokens. Additive CSS only. */
:root,
html[data-theme="light"]{
  color-scheme:light;
  --tap-bg:#F7F7F8;
  --tap-bg-2:#F1F1F5;
  --tap-surface:#FFFFFF;
  --tap-surface-2:#FBFBFC;
  --tap-surface-3:#F3F3F8;
  --tap-border:#E5E5EC;
  --tap-border-strong:#CBCBD8;
  --tap-ink:#1D1D26;
  --tap-text-2:#5E5E6C;
  --tap-text-3:#9B9BA8;
  --tap-accent:#5B5BD6;
  --tap-accent-hover:#4A4AC6;
  --tap-accent-soft:#EDEDFB;
  --tap-on-accent:#FFFFFF;
  --tap-exclude:#B54548;
  --tap-exclude-soft:#FBEFEF;
  --tap-success:#218358;
  --tap-success-soft:#EAF7F1;
  --tap-focus-ring:rgba(91,91,214,.35);
  --tap-shadow-sm:0 1px 2px rgba(29,29,38,.05);
  --tap-shadow-md:0 14px 42px rgba(29,29,38,.09);
  --tap-radius-panel:12px;
  --tap-radius-chip:8px;
  --tap-radius-button:8px;

  --tt-bg:var(--tap-bg);
  --tt-bg2:var(--tap-bg-2);
  --tt-paper:var(--tap-surface);
  --tt-paper2:var(--tap-surface-2);
  --tt-paper3:var(--tap-surface-3);
  --tt-text:var(--tap-ink);
  --tt-muted:var(--tap-text-2);
  --tt-subtle:var(--tap-text-3);
  --tt-line:var(--tap-border);
  --tt-accent:var(--tap-accent);
  --tt-accent-ink:var(--tap-on-accent);
  --tt-violet:var(--tap-accent);
  --tt-violet-soft:var(--tap-accent-soft);
  --tt-danger:var(--tap-exclude);
  --tt-danger-bg:var(--tap-exclude-soft);
  --tt-shadow:var(--tap-shadow-sm);
  --tt-radius:var(--tap-radius-panel);
  --tt-width:1240px;
  --tt-rail:300px;
  --tt-gap:24px;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --tap-bg:#121216;
  --tap-bg-2:#15151B;
  --tap-surface:#1A1A20;
  --tap-surface-2:#1F1F27;
  --tap-surface-3:#262631;
  --tap-border:#2D2D38;
  --tap-border-strong:#3C3C4A;
  --tap-ink:#EDEDF3;
  --tap-text-2:#A6A6B4;
  --tap-text-3:#71717F;
  --tap-accent:#8688F2;
  --tap-accent-hover:#9B9DF5;
  --tap-accent-soft:#26264A;
  --tap-on-accent:#101018;
  --tap-exclude:#E5717A;
  --tap-exclude-soft:#3A2226;
  --tap-success:#46B98C;
  --tap-success-soft:#17382D;
  --tap-focus-ring:rgba(134,136,242,.40);
  --tap-shadow-sm:0 1px 2px rgba(0,0,0,.20);
  --tap-shadow-md:0 18px 52px rgba(0,0,0,.32);

  --tt-bg:var(--tap-bg);
  --tt-bg2:var(--tap-bg-2);
  --tt-paper:var(--tap-surface);
  --tt-paper2:var(--tap-surface-2);
  --tt-paper3:var(--tap-surface-3);
  --tt-text:var(--tap-ink);
  --tt-muted:var(--tap-text-2);
  --tt-subtle:var(--tap-text-3);
  --tt-line:var(--tap-border);
  --tt-accent:var(--tap-accent);
  --tt-accent-ink:var(--tap-on-accent);
  --tt-violet:var(--tap-accent);
  --tt-violet-soft:var(--tap-accent-soft);
  --tt-danger:var(--tap-exclude);
  --tt-danger-bg:var(--tap-exclude-soft);
  --tt-shadow:var(--tap-shadow-sm);
}