/* ============================================================================
 * Kuickr design tokens — the `--kk-*` system (deck-app redesign)
 * ----------------------------------------------------------------------------
 * Design-system library member: kuickr.
 *
 * Source of truth: extracted from docs/prototypes/deck-app/"Kuickr Design
 * Tokens.html" on 2026-06-23. Contract: Kuickr numbered design-system plan
 * docs.
 *
 * This SUPERSEDES the warm-paper `--k-*` vocabulary in
 * app/assets/stylesheets/kuickr.css. During the rebuild both may coexist; new
 * UI references `var(--kk-*)`. Never hard-code hex — reference a token.
 *
 * Light values live in :root; dark overrides apply via [data-theme="dark"]
 * (explicit toggle) — match the prototype, which uses an explicit toggle, not
 * prefers-color-scheme.
 * ========================================================================== */

:root {
  /* Type families */
  --kk-font-display: "Libre Baskerville", Georgia, serif;
  --kk-font-ui:      "Space Grotesk", system-ui, sans-serif;
  --kk-font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* Surfaces (back → front) */
  --kk-bg:        #ffffff;
  --kk-wash:      #faf7f2;
  --kk-paper:     #fcfcfb;
  --kk-card:      #ffffff;
  --kk-fill:      #f1f0ec;
  --kk-fill-soft: #f3f2ef;
  --kk-line:      #ece8e0;
  --kk-border:    #e4e3de;

  /* Text */
  --kk-ink:        #15161a;
  --kk-text:       #1f1f22;
  --kk-text-soft:  #3a3633;
  --kk-muted:      #6b7280;
  --kk-muted-soft: #9ca3af;
  --kk-faint:      #b8b5ad;

  /* Brand — ink primary, brass secondary */
  --kk-primary:         #15161a;
  --kk-on-primary:      #fafaf8;
  --kk-secondary:       #b58a2f;
  --kk-secondary-hover: #9c7626;
  --kk-secondary-soft:  #f3ead4;
  --kk-on-secondary:    #ffffff;

  /* Semantic node / card types */
  --kk-decision: #4b7bd7;
  --kk-blocker:  #d74b4b;
  --kk-question: #8b5cf6;
  --kk-idea:     #e8a53b;
  --kk-outcome:  #2fb36b;
  --kk-parked:   #6b7280;

  /* Visibility */
  --kk-private: #9a958c;
  --kk-link:    #8a6a1f;
  --kk-public:  #3a5a3f;

  /* Radii */
  --kk-r-xs:   4px;
  --kk-r-sm:   7px;
  --kk-r-md:   10px;
  --kk-r-lg:   14px;
  --kk-r-xl:   20px;
  --kk-r-pill: 999px;

  /* Spacing scale */
  --kk-s-1: 4px;
  --kk-s-2: 8px;
  --kk-s-3: 12px;
  --kk-s-4: 16px;
  --kk-s-5: 24px;
  --kk-s-6: 32px;
  --kk-s-7: 48px;
  --kk-s-8: 72px;

  /* Reading measure */
  --kk-read: 720px;

  /* Elevation */
  --kk-shadow-sm: 0 1px 2px rgba(40, 34, 26, .07);
  --kk-shadow-md: 0 6px 20px rgba(40, 34, 26, .09);
  --kk-shadow-lg: 0 24px 60px rgba(40, 34, 26, .16);

  /* Motion */
  --kk-t-fast:      120ms;
  --kk-t-base:      200ms;
  --kk-t-slow:      320ms;
  --kk-ease-out:    cubic-bezier(.4, 0, .2, 1);
  --kk-ease-settle: cubic-bezier(.16, 1, .3, 1);
}

[data-theme="dark"] {
  --kk-bg:        #0f0e0c;
  --kk-wash:      #141310;
  --kk-paper:     #1b1a16;
  --kk-card:      #1f1d19;
  --kk-fill:      #26241e;
  --kk-fill-soft: #211f1a;
  --kk-line:      #262320;
  --kk-border:    #2c2a25;

  --kk-ink:        #f4f1ea;
  --kk-text:       #e7e2d7;
  --kk-text-soft:  #c3bdb1;
  --kk-muted:      #9a958c;
  --kk-muted-soft: #7e7a72;
  --kk-faint:      #5f5b53;

  --kk-primary:         #f4f1ea;
  --kk-on-primary:      #15140f;
  --kk-secondary:       #caa047;
  --kk-secondary-hover: #d8b25e;
  --kk-secondary-soft:  #2e2716;
  --kk-on-secondary:    #15140f;
}
