/* os-tokens.css — Manymoats OS design tokens (six families + tactile signatures)
 * Engine: engines/os-tokens:0.1.0 — code wins over DESIGN.md prose
 * Shares tokens via deploy/_shared — consumed never re-encoded (one-engine law)
 * Tactile gates: G-CARET-01 .. G-COMBO-06 — no token without gate
 * Free-first: qwen3.6:35b-a3b + DashScope text-embedding-v3 free → qwen3.8-max only for frontier deltas
 */

:root {
  /* ── ground / family ladder (GOLD 1.4) ── */
  --os-ground: #F3F2F8;
  --os-ground-void: #191923;
  --os-ground-absorptive: #07080a;
  --os-ink: #0a0a0f;
  --os-muted: #6b7280;
  --os-rule: #e8e8ed;
  --os-gold: #c9a86a; /* reserved for 5D material — never a flat font color (A2) */
  --os-indigo: #5B4FCF;
  --os-blue: #2665fd;           /* syntax-blue — caret active presence */
  --os-blue-pressed: #0248fa;
  --os-green: #0d7a3e;
  --os-cyan: #0891b2;
  --os-rose: #e11d48;
  --os-coral: #ff6b35;

  /* ── typography ── */
  --os-font-display: "Inter", system-ui, -apple-system, sans-serif;
  --os-font-body: "Inter", system-ui, -apple-system, sans-serif;
  --os-font-mono: "JetBrains Mono", ui-monospace, monospace;
  --os-font-feature-chrome: "ss03" 1;               /* door chrome Inter ss03 — many-htmx-rcs-type packet */

  /* ── spacing / radius ── */
  --os-space-unit: 4px;
  --os-radius-sm: 8px;
  --os-radius-md: 12px;
  --os-radius-lg: 16px;
  --os-radius-pill: 999px;

  /* ══════════════════════════════════════════════════
   * TACTILE SIGNATURE TOKENS — gated
   * G-CARET-01 .. G-COMBO-06
   * consume via var(--os-*) only — no raw hex/duration outside
   * ══════════════════════════════════════════════════ */

  /* G-CARET-01 · syntax-blue caret — global authoring presence */
  --os-caret-color: var(--os-blue);                 /* #2665fd syntax-blue */
  --os-caret-width: 2px;                            /* fixed language — no per-input improvisation */
  --os-caret-height: 1.15em;                        /* tied to line-height, not jittered */
  --os-caret-blink-duration: 530ms;                 /* 530ms on / 530ms off = 1060ms cycle — calm, precise */
  --os-caret-blink-easing: steps(1, end);
  --os-caret-blink-off-opacity: 0;
  --os-caret-width-thin: 1.5px;                     /* 320 compact */
  --os-caret-width-thick: 2.5px;                   /* high-dpi emphasis — only via token, not per-input */

  /* G-SELECT-02 · selection family — must feel related to caret */
  --os-selection-bg: rgba(38, 101, 253, 0.16);      /* 16% syntax-blue wash */
  --os-selection-bg-strong: rgba(38, 101, 253, 0.24); /* focused/expanded */
  --os-selection-fg: var(--os-ink);                 /* preserve ink legibility — not forced white */
  --os-selection-object-bg: rgba(91, 79, 207, 0.14); /* object selection — indigo cousin, distinct from text */
  --os-selection-object-ring: rgba(91, 79, 207, 0.40);

  /* G-FOCUS-03 · one focus geometry + motion — never removed for aesthetics */
  --os-focus-ring-color: var(--os-blue);
  --os-focus-ring-width: 2px;
  --os-focus-ring-offset: 2px;
  --os-focus-ring-radius: var(--os-radius-sm);
  --os-focus-motion-duration: 180ms;                /* snap seed 140-220 bound */
  --os-focus-motion-easing: cubic-bezier(0.2, 0, 0, 1);
  --os-focus-inner-shadow: 0 0 0 4px rgba(38, 101, 253, 0.12);

  /* G-PRESS-04 · press physics — same timing constants everywhere */
  --os-press-duration-in: 90ms;
  --os-press-duration-out: 210ms;
  --os-press-easing-in: cubic-bezier(0.3, 0, 0.8, 0.15);
  --os-press-easing-out: cubic-bezier(0.2, 0, 0, 1);
  --os-press-scale: 0.985;                          /* machined control — not marketing chip */
  --os-press-y: 1px;                                /* 1-2px mass language */
  --os-press-shadow-in: inset 0 1px 2px rgba(0,0,0,0.12);
  --os-press-shadow-out: 0 1px 3px rgba(0,0,0,0.08);
  /* destructive variant */
  --os-press-destructive-bg: var(--os-status-danger);
  --os-press-destructive-fg: #fffaf9;
  --os-press-disabled-opacity: 0.44;
  --os-press-disabled-cursor: not-allowed;

  /* G-RESOLVE-05 · completion settle — shared resolve language */
  --os-resolve-duration: 560ms;                     /* silk 520-680 bound */
  --os-resolve-easing: cubic-bezier(0.16, 1, 0.3, 1); /* silk — calm confidence, not bounce */
  --os-resolve-spring-stiffness: 280;               /* spring 280-420 bound */
  --os-resolve-spring-damping: 24;
  --os-resolve-opacity-duration: 220ms;
  --os-resolve-translate: 4px;                      /* settle distance — must change understanding */

  /* G-COMBO-06 · combo — tactile sentence (caret+selection+focus+press+resolve) */
  --os-combo-gap: 8px;
  --os-combo-receipt-accent: var(--os-blue);
}

/* dark / void */
@media (prefers-color-scheme: dark) {
  :root {
    --os-selection-bg: rgba(38, 101, 253, 0.28);
    --os-selection-bg-strong: rgba(38, 101, 253, 0.38);
    --os-selection-fg: #F3F2F8;
    --os-focus-inner-shadow: 0 0 0 4px rgba(38, 101, 253, 0.22);
  }
}

/* ── caret application — single source ── */
::selection {
  background: var(--os-selection-bg);
  color: var(--os-selection-fg);
}
::-moz-selection {
  background: var(--os-selection-bg);
  color: var(--os-selection-fg);
}
:focus-visible {
  outline: var(--os-focus-ring-width) solid var(--os-focus-ring-color);
  outline-offset: var(--os-focus-ring-offset);
  border-radius: var(--os-focus-ring-radius);
  transition: outline-offset var(--os-focus-motion-duration) var(--os-focus-motion-easing),
              box-shadow var(--os-focus-motion-duration) var(--os-focus-motion-easing);
  box-shadow: var(--os-focus-inner-shadow);
}
:focus:not(:focus-visible) { outline: none; }

/* caret in authoring surfaces — caret-color is the brand-active presence */
input, textarea, [contenteditable="true"], [data-caret="syntax"] {
  caret-color: var(--os-caret-color);
}

/* width is not directly settable via CSS beyond caret-color — document as gate token;
   custom editor surfaces (monaco/codemirror) must read --os-caret-width via JS and apply */

/* ── press — machined control ── */
[data-press] {
  transition: transform var(--os-press-duration-out) var(--os-press-easing-out),
              box-shadow var(--os-press-duration-out) var(--os-press-easing-out),
              opacity var(--os-press-duration-out) var(--os-press-easing-out);
}
[data-press]:active {
  transform: scale(var(--os-press-scale)) translateY(var(--os-press-y));
  transition-duration: var(--os-press-duration-in);
  transition-timing-function: var(--os-press-easing-in);
  box-shadow: var(--os-press-shadow-in);
}
[data-press][data-variant="destructive"]:active {
  background: var(--os-press-destructive-bg);
  color: var(--os-press-destructive-fg);
}
[data-press][aria-disabled="true"],
[data-press]:disabled {
  opacity: var(--os-press-disabled-opacity);
  cursor: var(--os-press-disabled-cursor);
  pointer-events: none; /* disabled terminal — ledger must explain, not silently trap */
  transform: none;
  box-shadow: none;
}

/* ── resolve — settle not evaporate ── */
[data-resolve] {
  transition: transform var(--os-resolve-duration) var(--os-resolve-easing),
              opacity var(--os-resolve-opacity-duration) var(--os-resolve-easing);
}
[data-resolve][data-state="settled"] {
  transform: translateY(0);
  opacity: 1;
}
[data-resolve][data-state="resolving"] {
  transform: translateY(var(--os-resolve-translate));
  opacity: 0.96;
}

/* reduced-motion — preserve meaning, not different aesthetic */
@media (prefers-reduced-motion: reduce) {
  :root {
    --os-caret-blink-duration: 0ms; /* caret solid — settled projection */
    --os-focus-motion-duration: 0ms;
    --os-press-duration-in: 0ms;
    --os-press-duration-out: 0ms;
    --os-resolve-duration: 0ms;
  }
  [data-resolve][data-state="resolving"] { transform: none; }
}

/* >>> GEN-COLOR WRITE-BACK (auto) — edit gen-color.mjs, never this block <<< */
/* status — ratified by founder write-back word 2026-08-18; hue seeds danger 22 / warning 88 / success 145 / info 240 */
:root {
  --os-status-danger: #d03641;
  --os-status-danger-night: #ffaba7;
  --os-status-warning: #8e6f0d;
  --os-status-warning-night: #debc69;
  --os-status-success: #35823c;
  --os-status-success-night: #84d286;
  --os-status-info: #0079b2;
  --os-status-info-night: #76c8ff;
}
@media (prefers-color-scheme: dark) {
  :root {
    --os-status-danger: var(--os-status-danger-night);
    --os-status-warning: var(--os-status-warning-night);
    --os-status-success: var(--os-status-success-night);
    --os-status-info: var(--os-status-info-night);
  }
}
[data-family="indigo"] {
  --os-indigo-0: #f4f4fc;
  --os-indigo-1: #d7d9f4;
  --os-indigo-2: #bbbeec;
  --os-indigo-3: #a0a3e4;
  --os-indigo-4: #8688dd;
  --os-indigo-5: #6e6bd6;
  --os-indigo-6: #594bce;
  --os-indigo-7: #4638aa;
  --os-indigo-8: #332981;
  --os-indigo-9: #221a5b;
  --os-indigo-10: #120d38;
  --os-indigo-11: #040317;
  --os-fam-ground: #F3F2F8; --os-fam-surface: #f3f4ff; --os-fam-border: #86868e; --os-fam-text: #12131d; --os-fam-muted: #5b5d69; --os-fam-accent: #5B4FCF; --os-fam-mark: #5B4FCF;
  --os-night-fam-ground: #191923; --os-night-fam-surface: #26272d; --os-night-fam-border: #696a72; --os-night-fam-text: #e6e7f0; --os-night-fam-muted: #cccdd5; --os-night-fam-accent: #8c8aff; --os-night-fam-mark: #5B4FCF;
}
[data-family="blue"] {
  --os-blue-0: #f0f5ff;
  --os-blue-1: #cadcfe;
  --os-blue-2: #a4c3fe;
  --os-blue-3: #7ea8fe;
  --os-blue-4: #588dfd;
  --os-blue-5: #306dfd;
  --os-blue-6: #0248fa;
  --os-blue-7: #0138c8;
  --os-blue-8: #012899;
  --os-blue-9: #001a6d;
  --os-blue-10: #000c43;
  --os-blue-11: #00031e;
  --os-fam-ground: #F3F2F8; --os-fam-surface: #f0f5ff; --os-fam-border: #83878e; --os-fam-text: #0f141d; --os-fam-muted: #575e69; --os-fam-accent: #2665fd; --os-fam-mark: #2665fd;
  --os-night-fam-ground: #191923; --os-night-fam-surface: #24282e; --os-night-fam-border: #676b72; --os-night-fam-text: #e4e8f0; --os-night-fam-muted: #c9ced6; --os-night-fam-accent: #6194ff; --os-night-fam-mark: #2665fd;
}
[data-family="green"] {
  --os-green-0: #dfffe6;
  --os-green-1: #68fe9c;
  --os-green-2: #23e77b;
  --os-green-3: #1dca6b;
  --os-green-4: #17ae5b;
  --os-green-5: #12934c;
  --os-green-6: #0d793d;
  --os-green-7: #08602f;
  --os-green-8: #044822;
  --os-green-9: #023115;
  --os-green-10: #011c09;
  --os-green-11: #000802;
  --os-fam-ground: #F3F2F8; --os-fam-surface: #ecf9ef; --os-fam-border: #818883; --os-fam-text: #0d160f; --os-fam-muted: #556058; --os-fam-accent: #0d7a3e; --os-fam-mark: #0d7a3e;
  --os-night-fam-ground: #191923; --os-night-fam-surface: #232925; --os-night-fam-border: #666d68; --os-night-fam-text: #e2eae4; --os-night-fam-muted: #c8cfc9; --os-night-fam-accent: #4ba969; --os-night-fam-mark: #0d7a3e;
}
[data-family="cyan"] {
  --os-cyan-0: #e7f9ff;
  --os-cyan-1: #a5e7ff;
  --os-cyan-2: #49d5fe;
  --os-cyan-3: #0ebce6;
  --os-cyan-4: #0aa2c7;
  --os-cyan-5: #0789a8;
  --os-cyan-6: #05708a;
  --os-cyan-7: #03596e;
  --os-cyan-8: #024253;
  --os-cyan-9: #012d39;
  --os-cyan-10: #001921;
  --os-cyan-11: #00070b;
  --os-fam-ground: #F3F2F8; --os-fam-surface: #e7f9ff; --os-fam-border: #7f888c; --os-fam-text: #09161a; --os-fam-muted: #516066; --os-fam-accent: #0891b2; --os-fam-mark: #0891b2;
  --os-night-fam-ground: #191923; --os-night-fam-surface: #21292c; --os-night-fam-border: #636c6f; --os-night-fam-text: #e0eaee; --os-night-fam-muted: #c5cfd2; --os-night-fam-accent: #2da3c4; --os-night-fam-mark: #0891b2;
}
[data-family="rose"] {
  --os-rose-0: #fef2f2;
  --os-rose-1: #fdcecf;
  --os-rose-2: #fca9ab;
  --os-rose-3: #fb7e86;
  --os-rose-4: #fa455f;
  --os-rose-5: #e01d48;
  --os-rose-6: #b9163a;
  --os-rose-7: #940f2c;
  --os-rose-8: #70091f;
  --os-rose-9: #4f0413;
  --os-rose-10: #2f0208;
  --os-rose-11: #130002;
  --os-fam-ground: #F3F2F8; --os-fam-surface: #fff1f1; --os-fam-border: #8e8584; --os-fam-text: #1c1010; --os-fam-muted: #695a5a; --os-fam-accent: #e11d48; --os-fam-mark: #e11d48;
  --os-night-fam-ground: #191923; --os-night-fam-surface: #2d2525; --os-night-fam-border: #726969; --os-night-fam-text: #f0e5e5; --os-night-fam-muted: #d5cbca; --os-night-fam-accent: #ff5d6f; --os-night-fam-mark: #e11d48;
}
[data-family="coral"] {
  --os-coral-0: #fff2ee;
  --os-coral-1: #ffcfbf;
  --os-coral-2: #ffaa8e;
  --os-coral-3: #ff8155;
  --os-coral-4: #f75400;
  --os-coral-5: #d14600;
  --os-coral-6: #ad3800;
  --os-coral-7: #8a2b00;
  --os-coral-8: #691e00;
  --os-coral-9: #491300;
  --os-coral-10: #2c0800;
  --os-coral-11: #110200;
  --os-fam-ground: #F3F2F8; --os-fam-surface: #fff2ee; --os-fam-border: #8e8581; --os-fam-text: #1c110d; --os-fam-muted: #695a56; --os-fam-accent: #ef5d24; --os-fam-mark: #ff6b35;
  --os-night-fam-ground: #191923; --os-night-fam-surface: #2d2623; --os-night-fam-border: #726966; --os-night-fam-text: #efe5e2; --os-night-fam-muted: #d5ccc8; --os-night-fam-accent: #ff6b35; --os-night-fam-mark: #ff6b35;
}
@media (prefers-color-scheme: dark) {
  [data-family] {
    --os-fam-ground: var(--os-night-fam-ground); --os-fam-surface: var(--os-night-fam-surface); --os-fam-border: var(--os-night-fam-border); --os-fam-text: var(--os-night-fam-text); --os-fam-muted: var(--os-night-fam-muted); --os-fam-accent: var(--os-night-fam-accent); --os-fam-mark: var(--os-night-fam-mark);
  }
}
/* >>> END GEN-COLOR WRITE-BACK <<< */

/* >>> GEN-TYPE WRITE-BACK (auto) — edit gen-type.mjs, never this block <<< */
:root {
  --os-type-caption-size: 9.259px;
  --os-type-caption-leading: 1.5;
  --os-type-caption-tracking: 0.08em;
  --os-type-caption-measure: 48ch;
  --os-type-label-size: 11.111px;
  --os-type-label-leading: 1.475;
  --os-type-label-tracking: 0.08em;
  --os-type-label-measure: 40ch;
  --os-type-meta-size: 13.333px;
  --os-type-meta-leading: 1.445;
  --os-type-meta-tracking: 0.04em;
  --os-type-meta-measure: 56ch;
  --os-type-body-size: 16px;
  --os-type-body-leading: 1.5;
  --os-type-body-tracking: 0em;
  --os-type-body-measure: 72ch;
  --os-type-lede-size: 20px;
  --os-type-lede-leading: 1.356;
  --os-type-lede-tracking: -0.01em;
  --os-type-lede-measure: 60ch;
  --os-type-title-size: 25px;
  --os-type-title-leading: 1.289;
  --os-type-title-tracking: -0.02em;
  --os-type-title-measure: 48ch;
  --os-type-headline-size: 31.25px;
  --os-type-headline-leading: 1.205;
  --os-type-headline-tracking: -0.03em;
  --os-type-headline-measure: 36ch;
  --os-type-display-size: 39.063px;
  --os-type-display-leading: 1.1;
  --os-type-display-tracking: -0.04em;
  --os-type-display-measure: 24ch;
  --os-type-mono-size: 14px;
}
/* >>> END GEN-TYPE WRITE-BACK <<< */