/* SIDEQUEST design tokens */
:root {
  --sky-top: #7fd3f5;
  --sky-mid: #a9e4fa;
  --sky-low: #d8f5ff;
  --aqua: #4cc9df;

  --cream: #fff8e6;
  --cream-2: #ffefc4;
  --cream-3: #ffe39a;
  --gold: #f1b33a;
  --gold-deep: #d38b16;
  --gold-line: #f7cf6a;

  --green: #63c94a;
  --green-hi: #95e870;
  --green-deep: #3a9a2a;
  --green-ink: #276b1c;

  --orange: #ffad33;
  --orange-deep: #e07d12;
  --red: #f26a5a;
  --red-deep: #c9443a;
  --purple: #9b5de5;
  --blue: #4a90e2;

  --ink: #3a2550;
  --ink-soft: #6b5683;
  --ink-faint: #9a88ad;
  --white: #ffffff;

  /* one set of corners: controls 12, cards/buttons 16, panels 24, pills 999 */
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 30px;
  --r-pill: 999px;
  /* one card look and one press feel */
  --card-bg: linear-gradient(180deg, #fffdf6, #fff3d4);
  --card-ring: 0 0 0 2px rgba(241, 179, 58, .5);
  --card-shadow: 0 0 0 2px rgba(241, 179, 58, .5), 0 4px 0 1px rgba(211, 139, 22, .3);
  --press: translateY(3px) scale(.97, .95);

  --shadow-pop: 0 4px 0 rgba(58, 37, 80, 0.18), 0 10px 24px rgba(30, 90, 140, 0.18);
  --shadow-soft: 0 2px 0 rgba(58, 37, 80, 0.12), 0 6px 14px rgba(30, 90, 140, 0.12);

  --font-display: 'Fredoka', 'Baloo 2', ui-rounded, 'Nunito', system-ui, sans-serif;
  --font-body: 'Nunito', ui-rounded, system-ui, -apple-system, 'Segoe UI', sans-serif;

  --hud-h: 72px;
  --panel-w: 380px;
  --ease-pop: cubic-bezier(0.34, 1.56, 0.64, 1);
}