/* M6D ONE FOUNDATION V1.1 — sole source of palette values for web and PWA. */
:root {
  --palette-orange: #ee4d2d;
  --palette-burnt: #d95a32;
  --palette-action-orange: #d63a1f;
  --palette-action-orange-hover: #cf381e;
  --palette-espresso: #3a241c;
  --palette-cocoa: #67483b;
  --palette-cream: #f7f2ec;
  --palette-sand: #eee4da;
  --palette-white: #ffffff;
  --palette-ink: #211816;
  --palette-muted: #78665e;
  --palette-border: #e7ddd5;
  /* Phase 1 measured surfaces: reference 03, sampled from the source PNG. */
  --surface-canvas: #fdfbf9;
  --surface-panel: #fefcfd;
  --surface-border: #f1ddd6;
  --surface-highlight: #fff4ef;
  --accent-vivid: #ff6524;
  /* Phase 1 references: warm neutrals, cocoa and Shopee orange only. */
  --emotional-bg: var(--palette-cream);
  --emotional-accent: var(--palette-sand);
  --emotional-ink: var(--palette-espresso);
  --surface-soft: var(--palette-cream);
  /* Sparse emphasis: the soft off-white / peach family approved in Community. */
  --surface-warm-start: var(--panel);
  --surface-warm-end: color-mix(in srgb, var(--action-bg) 14%, var(--palette-cream));
  --surface-warm-gradient: linear-gradient(110deg, var(--surface-warm-start), var(--surface-warm-end));
  --surface-warm-border: var(--border);
  --on-warm: var(--brand-structure);
  --on-warm-muted: var(--brand-detail);
  --radius-card: 16px;
  --radius-emotional: 24px;
  --radius-control: 12px;
  --shadow-soft: 0 4px 16px color-mix(in srgb, var(--palette-espresso) 5%, transparent);
  --shadow-raised: 0 12px 32px color-mix(in srgb, var(--palette-espresso) 8%, transparent);
  --font-editorial: 'Inter Variable', Inter, system-ui, sans-serif;
  --motion-fast: 120ms;
  --motion-normal: 200ms;
  --motion-emotional: 600ms;
  --motion-spring: cubic-bezier(0.34, 1.4, 0.64, 1);
  --brand-structure: var(--palette-espresso);
  --brand-detail: var(--palette-cocoa);
  --brand-accent: var(--palette-orange);
  --action-bg: var(--palette-action-orange);
  --action-hover: var(--palette-action-orange-hover);
  --action-pressed: var(--palette-espresso);
  --on-action: var(--palette-white);
  --on-pressed: var(--palette-white);
  --selected-bg: var(--palette-sand);
  --selected-text: var(--palette-espresso);
  --selected-border: var(--accent-vivid);
  --chart-series: var(--palette-orange);
  --focus: var(--palette-cocoa);
  --canvas: var(--surface-canvas);
  --panel: var(--surface-panel);
  --ink: var(--palette-ink);
  --muted: var(--palette-muted);
  --border: var(--surface-border);
  --control: var(--palette-muted);
  --success: #23664d;
  --warning: #805a18;
  --error: #a12c3f;
}
