/* SellSip: design tokens (LOCKED 2026-10-24)
   Fonts (all OFL, Google Fonts): Sofia Sans Extra Condensed, Sofia Sans, JetBrains Mono,
   Instrument Serif, IBM Plex Sans Arabic, Noto Sans Devanagari.
   Brand guard: SellSip palette only, never another brand's palette or type. */

:root {
  /* primitives */
  --ss-roast-black:  #14100E;
  --ss-crema:        #F6EBD9;
  --ss-white:        #FFFFFF;
  --ss-welcome-red:  #DB2F24;
  --ss-copy-blue:    #2438E0;
  --ss-golden-hour:  #FFB547; /* glow/confetti only: never text on light */
  --ss-evening-blue: #16203F;
  --ss-ember:        #E8892B;
  --ss-night-slip:   #2A2522;

  /* fonts */
  --ss-font-display: 'Sofia Sans Extra Condensed', 'Sofia Sans Condensed', 'Arial Narrow', sans-serif;
  --ss-font-body:    'Sofia Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ss-font-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --ss-font-cinema:  'Instrument Serif', Georgia, 'Times New Roman', serif; /* video + pull quotes only */
  --ss-font-arabic:  'IBM Plex Sans Arabic', 'Noto Sans Arabic', Tahoma, sans-serif;
  --ss-font-devanagari: 'Noto Sans Devanagari', 'Mukta', sans-serif;

  /* type scale (1.25, base 16) */
  --ss-text-xs: 12px;  --ss-text-sm: 14px;  --ss-text-base: 16px; --ss-text-md: 20px;
  --ss-text-lg: 25px;  --ss-text-xl: 31px;  --ss-text-2xl: 39px;  --ss-text-3xl: 49px;
  --ss-text-4xl: 61px; --ss-text-5xl: 76px; --ss-text-6xl: 95px;
  --ss-text-hero: clamp(56px, 8vw, 120px);
  --ss-lh-display: 0.9; --ss-lh-heading: 1.1; --ss-lh-body: 1.5; --ss-lh-article: 1.6;
  --ss-track-display: -0.01em; --ss-track-label: 0.08em;

  --ss-radius-button: 999px; --ss-radius-card: 14px;
  --ss-dur-stamp: 120ms; --ss-dur-ink: 300ms; --ss-dur-mode: 200ms;

  /* DAY theme (default) */
  --bg:            var(--ss-roast-black);
  --bg-paper:      var(--ss-crema);
  --bg-reading:    var(--ss-white);
  --text-on-dark:  var(--ss-white);
  --text-on-paper: var(--ss-roast-black);
  --accent:        var(--ss-welcome-red);
  --link:          var(--ss-copy-blue);   /* on Crema/White only */
  --link-on-dark:  var(--ss-golden-hour);
  --label:         var(--ss-golden-hour); /* on dark only */
  --glow:          var(--ss-golden-hour);
  --toggle:        var(--ss-copy-blue);
  --button-bg:     var(--ss-welcome-red);
  --button-text:   var(--ss-white);
  --stamp:         var(--ss-welcome-red);
  --receipt-bg:    var(--ss-crema);
  --receipt-text:  var(--ss-roast-black);
}

/* NIGHT theme: SellSip After Hours (19:00-05:59 viewer local time, or manual toggle). html carries data-theme + data-mode. */
[data-mode="night"], [data-theme="night"] {
  --bg:            var(--ss-evening-blue);
  --bg-paper:      var(--ss-crema);
  --bg-reading:    var(--ss-crema);
  --text-on-dark:  var(--ss-crema);
  --text-on-paper: var(--ss-roast-black);
  --accent:        var(--ss-welcome-red); /* large text only on Evening Blue */
  --link:          var(--ss-copy-blue);   /* on Crema paper */
  --link-on-dark:  var(--ss-ember);       /* 6.13:1 on Evening Blue */
  --label:         var(--ss-ember);
  --glow:          var(--ss-ember);
  --toggle:        var(--ss-copy-blue);
  --button-bg:     var(--ss-welcome-red);
  --button-text:   var(--ss-white);
  --stamp:         var(--ss-welcome-red);
  --receipt-bg:    var(--ss-night-slip);
  --receipt-text:  var(--ss-crema);
}

:lang(ar) { --ss-font-display: var(--ss-font-arabic); --ss-font-body: var(--ss-font-arabic); }
:lang(hi), :lang(mr), :lang(ne) { --ss-font-display: var(--ss-font-devanagari); --ss-font-body: var(--ss-font-devanagari); }

@media (prefers-reduced-motion: reduce) { :root { --ss-dur-mode: 0ms; --ss-dur-stamp: 0ms; --ss-dur-ink: 0ms; } }