/* Design tokens of kiji-os: every colour, size, font, shadow, layer and timing the shell and its apps use.
   Identity: a heavy military-industrial chassis (frames, taskbar, boot, lock) carrying a thin intelligence layer
   (reticles, classification tags, telemetry) drawn in a cold steel tone. One warm accent: copper. Dark only, by
   choice: the shell is an operating environment, not a document.
   Colours with tinted variants are declared as RGB channels (--k-*-rgb) so a variant reads
   rgb(var(--k-accent-rgb) / .45). */
@layer tokens {
  :root {
    color-scheme: dark;

    /* ---------- colour channels ---------- */
    --k-accent-rgb: 217 134 80;
    --k-intel-rgb: 134 182 196;
    --k-good-rgb: 65 197 133;
    --k-warn-rgb: 232 176 46;
    --k-crit-rgb: 240 90 90;
    --k-fg-rgb: 233 231 227;
    --k-shade-rgb: 0 0 0;
    --k-light-rgb: 255 255 255;

    /* ---------- surfaces, from the deepest to the raised ---------- */
    --k-bg: #090a0c;
    --k-bg-code: #070708; /* code blocks, logs, live feeds */
    --k-chrome: #111215;
    --k-chrome-2: #16171b;
    --k-panel: #141518;
    --k-panel-2: #1b1c20;
    --k-line: #26272c;
    --k-line-2: #36373d;
    --k-line-focus: #4a4038; /* the frame of the focused window */
    --k-scrim: rgb(6 7 8 / 0.62); /* behind a dialog */
    --k-hover-wash: rgb(var(--k-light-rgb) / 0.04);
    --k-sheen: rgb(var(--k-light-rgb) / 0.22);

    /* ---------- text ---------- */
    --k-fg: rgb(var(--k-fg-rgb));
    --k-muted: #8b8a91;
    --k-dim: #5d5c63;
    --k-fg-menu: #b4b3b9; /* menu bar of the focused window */
    --k-fg-code: #d9d9de;
    --k-fg-prose: #e2e1e6; /* what an agent says, in a live feed */
    --k-fg-result: #cfcfd4; /* what a tool returned */
    --k-white: #fff;

    /* ---------- accent (copper), intelligence (steel), states ---------- */
    --k-accent: rgb(var(--k-accent-rgb));
    --k-accent-hi: #f0a26c;
    --k-accent-fg: #160c05;
    --k-accent-soft: rgb(var(--k-accent-rgb) / 0.14);
    --k-accent-wash: rgb(var(--k-accent-rgb) / 0.08);
    --k-accent-line: rgb(var(--k-accent-rgb) / 0.45);
    --k-accent-line-2: rgb(var(--k-accent-rgb) / 0.5);
    --k-intel: rgb(var(--k-intel-rgb));
    --k-intel-soft: rgb(var(--k-intel-rgb) / 0.12);
    --k-good: rgb(var(--k-good-rgb));
    --k-warn: rgb(var(--k-warn-rgb));
    --k-crit: rgb(var(--k-crit-rgb));
    --k-good-soft: rgb(var(--k-good-rgb) / 0.13);
    --k-warn-soft: rgb(var(--k-warn-rgb) / 0.14);
    --k-crit-soft: rgb(var(--k-crit-rgb) / 0.14);
    --k-warn-line: rgb(var(--k-warn-rgb) / 0.4);
    --k-crit-line: rgb(var(--k-crit-rgb) / 0.4);

    /* ---------- type ---------- */
    --k-display: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
    --k-font: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
    --k-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
    /* the dense interface sizes */
    --k-text-1: 9.5px;
    --k-text-2: 10px;
    --k-text-3: 10.5px;
    --k-text-4: 11px;
    --k-text-5: 11.5px;
    --k-text-6: 12px;
    --k-text-7: 12.5px;
    --k-text-8: 13px;
    --k-text-9: 13.5px;
    --k-text-10: 14px; /* the body */
    --k-text-11: 15px;
    --k-text-12: 15.5px;
    --k-text-13: 16px;
    /* titles and figures (Barlow Condensed) */
    --k-display-1: 17px;
    --k-display-2: 18px;
    --k-display-3: 19px;
    --k-display-4: 20px;
    --k-display-5: 22px;
    --k-display-6: 24px;
    --k-display-7: 26px;
    --k-display-8: 28px;
    --k-display-9: 30px;
    --k-display-10: 32px;
    --k-display-11: 52px;
    --k-display-12: 96px;
    --k-weight-medium: 500;
    --k-weight-semibold: 600;
    --k-weight-bold: 700;
    --k-leading-none: 1;
    --k-leading-tight: 1.2;
    --k-leading-body: 1.45;
    --k-leading-prose: 1.55;
    --k-leading-code: 1.6;
    --k-leading-log: 1.75;
    --k-leading-display: 0.85; /* the lock screen clock */
    /* letter spacing, from tight to the wide-tracked labels */
    --k-track-1: 0.02em;
    --k-track-2: 0.03em;
    --k-track-3: 0.04em;
    --k-track-4: 0.05em;
    --k-track-5: 0.06em;
    --k-track-6: 0.08em;
    --k-track-7: 0.1em;
    --k-track-8: 0.12em;
    --k-track-9: 0.14em;
    --k-track-10: 0.16em;
    --k-track-11: 0.18em;
    --k-track-12: 0.2em;
    --k-track-13: 0.3em;
    --k-track-14: 0.32em;
    --k-track-15: 0.4em;
    --k-track-16: 0.42em;
    --k-track-17: 0.6em;

    /* ---------- spacing: --k-space-N is N × 2px ---------- */
    --k-space-1: 2px;
    --k-space-2: 4px;
    --k-space-3: 6px;
    --k-space-4: 8px;
    --k-space-5: 10px;
    --k-space-6: 12px;
    --k-space-7: 14px;
    --k-space-8: 16px;
    --k-space-9: 18px;
    --k-space-10: 20px;
    --k-space-11: 22px;
    --k-space-12: 24px;
    --k-space-13: 26px;
    --k-space-14: 28px;
    --k-space-20: 40px;

    /* ---------- icon sizes ---------- */
    --k-icon-1: 11px;
    --k-icon-2: 13px;
    --k-icon-3: 14px;
    --k-icon-4: 15px;
    --k-icon-5: 16px;
    --k-icon-6: 17px; /* the default */
    --k-icon-7: 18px;
    --k-icon-8: 20px;
    --k-icon-9: 22px;
    --k-icon-10: 26px;
    --k-icon-11: 40px;

    /* ---------- chassis ---------- */
    --k-bar: 50px; /* taskbar height */
    --k-title: 36px; /* window title bar height */
    --k-radius-sm: 2px;
    --k-radius-pill: 99px;
    --k-radius-round: 50%;
    /* chamfered corners (top right cut), by size */
    --k-cut-7: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 0 100%);
    --k-cut-9: polygon(0 0, calc(100% - 9px) 0, 100% 9px, 100% 100%, 0 100%);
    --k-cut-10: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
    --k-cut-14: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
    --k-cut-icon: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%);
    --k-cut-start: polygon(0 0, 100% 0, calc(100% - 14px) 100%, 0 100%);

    /* ---------- shadows ---------- */
    --k-shadow-window: 0 18px 50px rgb(var(--k-shade-rgb) / 0.55), 0 2px 6px rgb(var(--k-shade-rgb) / 0.4);
    --k-shadow-window-focus: 0 24px 70px rgb(var(--k-shade-rgb) / 0.65), 0 0 0 1px rgb(var(--k-accent-rgb) / 0.18);
    --k-shadow-panel: 0 24px 70px rgb(var(--k-shade-rgb) / 0.7);
    --k-shadow-dialog: 0 24px 60px rgb(var(--k-shade-rgb) / 0.7);
    --k-shadow-card: 0 24px 60px rgb(var(--k-shade-rgb) / 0.6);
    --k-shadow-menu: 0 16px 40px rgb(var(--k-shade-rgb) / 0.6);
    --k-shadow-toast: 0 14px 40px rgb(var(--k-shade-rgb) / 0.6);
    --k-shadow-tip: 0 10px 30px rgb(var(--k-shade-rgb) / 0.5);
    --k-shadow-text: 0 1px 2px rgb(var(--k-shade-rgb));
    --k-ring-accent: 0 0 0 3px var(--k-accent-soft);
    --k-ring-good: 0 0 0 3px var(--k-good-soft);
    --k-mark-accent: inset 2px 0 0 var(--k-accent); /* the left mark of a current row */
    --k-mark-under: inset 0 -2px 0 var(--k-accent); /* the underline of a chosen segment */

    /* ---------- layers (z-index) ---------- */
    --k-z-raised: 1;
    --k-z-shield: 3;
    --k-z-handle: 4;
    --k-z-float: 5; /* the scan line, chart tooltips, taskbar popups */
    --k-z-menu: 20;
    --k-z-dialog: 30;
    --k-z-widget: 99000; /* desktop widgets over the windows */
    --k-z-snap: 99990;
    --k-z-taskbar: 100000;
    --k-z-panel: 100001;
    --k-z-toast: 100002;
    --k-z-screen: 200000;
    --k-z-boot: 200010;

    /* ---------- motion ---------- */
    --k-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
    --k-ease-scan: cubic-bezier(0.4, 0, 0.2, 1);
    --k-ease-draw: cubic-bezier(0.6, 0, 0.2, 1);
    --k-ease-track: cubic-bezier(0.2, 0.7, 0.2, 1);
    --k-dur-1: 0.14s;
    --k-dur-2: 0.15s;
    --k-dur-3: 0.2s;
    --k-dur-4: 0.22s;
    --k-dur-5: 0.26s;
    --k-dur-6: 0.32s;
    --k-dur-7: 0.45s;
  }
}
