/*
 * JYB Design System — Tokens (Phase 1 step 0)
 *
 * Inert by design. This file is loaded BEFORE the operational-polish layers,
 * so any token name that the polish layers redeclare (e.g. --jyb-gold in
 * mobile-operational-polish.css, --jyb-pc-gold in desktop-operational-polish.css)
 * resolves to the polish-layer value at runtime. That preserves current visual
 * behavior. Tokens defined here that the polish layers do not redeclare become
 * available for future Phase 1+ migrations to consume incrementally.
 *
 * No selectors other than :root. No class rules. No element rules. No imports.
 */

:root {
  /* ---------- Color: Brand gold (canonical — aligned to welcome family) ---------- */
  --jyb-gold:               #c9a25e;
  --jyb-gold-soft:          #f7ecd3;
  --jyb-gold-strong:        #b08a47;
  --jyb-gold-ink:           #7a5a28;

  /* ---------- Color: Neutrals ---------- */
  --jyb-bg:                 #ffffff;
  --jyb-bg-muted:           #f6f7f9;
  --jyb-bg-subtle:          #eef0f4;
  --jyb-surface:            #ffffff;
  --jyb-surface-raised:     #ffffff;
  --jyb-text:               #1e293b;
  --jyb-text-muted:         #64748b;
  --jyb-text-subtle:        #94a3b8;
  --jyb-text-inverse:       #ffffff;
  --jyb-border:             #e5e7eb;
  --jyb-border-strong:      #cbd5e1;
  --jyb-divider:            #eef0f4;

  /* ---------- Color: Semantic ---------- */
  --jyb-success:            #16a34a;
  --jyb-success-bg:         #dcfce7;
  --jyb-warning:            #d97706;
  --jyb-warning-bg:         #fef3c7;
  --jyb-danger:             #dc2626;
  --jyb-danger-bg:          #fee2e2;
  --jyb-info:               #2563eb;
  --jyb-info-bg:            #dbeafe;

  /* ---------- Typography ---------- */
  --jyb-font-sans:          'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --jyb-font-serif:         'Noto Serif SC', Georgia, 'Times New Roman', serif;
  --jyb-font-mono:          ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --jyb-font-size-xs:       12px;
  --jyb-font-size-sm:       13px;
  --jyb-font-size-base:     14px;
  --jyb-font-size-md:       16px;
  --jyb-font-size-lg:       20px;
  --jyb-font-size-xl:       24px;
  --jyb-font-size-2xl:      32px;
  --jyb-line-height-tight:  1.25;
  --jyb-line-height-base:   1.5;
  --jyb-line-height-loose:  1.75;
  --jyb-font-weight-regular:  400;
  --jyb-font-weight-medium:   500;
  --jyb-font-weight-semibold: 600;
  --jyb-font-weight-bold:     700;

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

  /* ---------- Radius ---------- */
  --jyb-radius-sm:          4px;
  --jyb-radius-md:          6px;
  --jyb-radius-lg:          10px;
  --jyb-radius-xl:          16px;
  --jyb-radius-pill:        9999px;

  /* ---------- Shadow ---------- */
  --jyb-shadow-sm:          0 1px 2px rgba(15, 23, 42, 0.05);
  --jyb-shadow-md:          0 4px 12px rgba(15, 23, 42, 0.08);
  --jyb-shadow-lg:          0 10px 24px rgba(15, 23, 42, 0.10);
  --jyb-shadow-xl:          0 20px 40px rgba(15, 23, 42, 0.14);

  /* ---------- Focus ring ---------- */
  --jyb-focus-color:        #c9a25e;
  --jyb-focus-ring:         0 0 0 2px rgba(201, 162, 94, 0.35);
  --jyb-focus-ring-strong:  0 0 0 3px rgba(201, 162, 94, 0.55);

  /* ---------- Z-index scale ---------- */
  --jyb-z-base:             1;
  --jyb-z-sticky:           10;
  --jyb-z-overlay:          50;
  --jyb-z-detail:           100;
  --jyb-z-drawer:           500;
  --jyb-z-modal:            1000;
  --jyb-z-toast:            1500;
  --jyb-z-tooltip:          2000;

  /* ---------- Motion ---------- */
  --jyb-motion-fast:        120ms;
  --jyb-motion-base:        180ms;
  --jyb-motion-slow:        260ms;
  --jyb-ease-standard:      cubic-bezier(0.2, 0, 0, 1);
  --jyb-ease-emphasized:    cubic-bezier(0.2, 0, 0, 1.2);

  /* ---------- Layout ---------- */
  --jyb-container-max:      1240px;
  --jyb-gutter:             24px;
  --jyb-gutter-mobile:      12px;
}