/* Kuta Shipyard: design tokens (BRAND.md, identity v0.2). Dark is the brand's ground; the light
   set is for documents and the app's light theme later. Satoshi from Fontshare, IBM Plex Mono
   from Google Fonts (the pages load them). */
:root {
  /* colour: 85–90 % neutral, green for action, agent activity, success and progress only */
  --ky-green: #00D9A0;
  --ky-green-hover: #00E6AA;
  --ky-deep-teal: #082A24;
  --ky-charcoal: #080B0F;
  --ky-surface-1: #10161D;
  --ky-surface-2: #161F28;
  --ky-border: #29343F;
  --ky-slate: #718096;
  --ky-muted: #A6B0BA;
  --ky-mist: #E5E7EB;
  --ky-white: #FFFFFF;
  --ky-on-green: #04140F;

  --ky-success: #00D9A0;
  --ky-warning: #F4B860;
  --ky-error: #F16B73;
  --ky-info: #65A9D8;
  --ky-neutral: #718096;

  /* roles */
  --ky-bg: var(--ky-charcoal);
  --ky-panel: var(--ky-surface-1);
  --ky-raised: var(--ky-surface-2);
  --ky-line: var(--ky-border);
  --ky-text: var(--ky-mist);
  --ky-text-2: var(--ky-muted);
  --ky-text-3: var(--ky-slate);
  --ky-accent: var(--ky-green);

  /* type */
  --ky-font: Satoshi, "General Sans", "Helvetica Neue", Arial, sans-serif;
  --ky-mono: "IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --ky-display: 64px;  /* 700 */
  --ky-h1: 48px;       /* 700 */
  --ky-h2: 32px;       /* 600 */
  --ky-h3: 24px;       /* 600 */
  --ky-h4: 18px;       /* 600 */
  --ky-body: 15px;     /* 400 */
  --ky-small: 13px;    /* 400 */
  --ky-tech: 12px;     /* 400 mono */

  /* space: an 8 px grid */
  --ky-1: 4px;
  --ky-2: 8px;
  --ky-3: 16px;
  --ky-4: 24px;
  --ky-5: 32px;
  --ky-6: 48px;
  --ky-7: 64px;
  --ky-8: 96px;

  /* shape */
  --ky-r-card: 12px;
  --ky-r-button: 8px;
  --ky-r-input: 7px;
  --ky-shadow: 0 1px 2px #00000066, 0 12px 32px #00000059;
  color-scheme: dark;
}

/* the light set: the same roles on paper */
:root[data-theme="light"] {
  --ky-bg: #F6F8FA;
  --ky-panel: #FFFFFF;
  --ky-raised: #EEF2F5;
  --ky-line: #D5DCE3;
  --ky-text: #0B1015;
  --ky-text-2: #46525E;
  --ky-text-3: #6B7785;
  --ky-accent: #00A57A;   /* the green dark enough for text and lines on white */
  --ky-on-green: #04140F;
  color-scheme: light;
}