/* KCR 2.5D — design tokens
   Palette drawn from KCR livery: signal yellow on deep navy, cream paper. */

:root {
  /* ink & panels */
  --ink:        #0B1220;
  --ink-2:      #0E1626;
  --panel:      #16223A;
  --panel-2:    #1C2B47;
  --panel-3:    #24365A;
  --line:       rgba(244, 235, 217, 0.13);
  --line-soft:  rgba(244, 235, 217, 0.07);

  /* paper */
  --cream:      #F4EBD9;
  --cream-2:    #E7DAC0;
  --cream-dim:  rgba(244, 235, 217, 0.64);
  --cream-faint:rgba(244, 235, 217, 0.34);

  /* KCR signal colours */
  --yellow:      #F2B714;
  --yellow-hot:  #FFD24A;
  --yellow-deep: #C08A00;
  --red:         #E03B2F;
  --red-deep:    #9E2019;
  --green:       #2FA36B;
  --green-hot:   #55D493;
  --teal:        #2C6E6A;
  --blue:        #6E88A8;

  /* semantic */
  --ok: var(--green);
  --warn: var(--yellow);
  --bad: var(--red);

  /* type */
  --f-sans: "Helvetica Neue", "Segoe UI", system-ui, -apple-system,
            "Noto Sans HK", "PingFang HK", "Microsoft JhengHei", sans-serif;
  --f-mono: ui-monospace, "SF Mono", "Cascadia Mono", "Roboto Mono", Consolas, monospace;
  --f-cond: "Arial Narrow", "Roboto Condensed", var(--f-sans);

  --fs-11: 0.6875rem;
  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-22: 1.375rem;
  --fs-28: 1.75rem;
  --fs-40: 2.5rem;
  --fs-64: 4rem;

  /* space */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;
  --s-8: 64px;

  /* shape */
  --r-1: 3px;
  --r-2: 6px;
  --r-3: 10px;
  --r-4: 16px;
  --r-pill: 999px;

  /* depth */
  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.35);
  --sh-2: 0 6px 18px rgba(0, 0, 0, 0.35);
  --sh-3: 0 18px 50px rgba(0, 0, 0, 0.5);
  --glow-yellow: 0 0 22px rgba(242, 183, 20, 0.35);

  /* motion */
  --ease: cubic-bezier(0.22, 0.8, 0.24, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 140ms;
  --t-med: 260ms;
  --t-slow: 520ms;
}