/*
 * Iron & Tonic design-system tokens
 * Ported verbatim from _ds/iron-amp-tonic-design-system-*/tokens/*.css
 *
 * MD Nichrome is used under a trial licence.
 * The licence covers evaluation and internal use; confirm with Mass-Driver
 * before any public commercial deployment.
 */

/* ── fonts ───────────────────────────────────────────────────────────────── */

/* Material Icons (filled + outlined) loaded from Google Fonts CDN */
@import url("https://fonts.googleapis.com/icon?family=Material+Icons|Material+Icons+Outlined");

/* MD Nichrome Trial — trial licence; see note above */
@font-face {
  font-family: 'MD Nichrome';
  src: url('../assets/fonts/MDNichromeTrial-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'MD Nichrome';
  src: url('../assets/fonts/MDNichromeTrial-Black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* DM Sans variable */
@font-face {
  font-family: 'DM Sans';
  src: url('../assets/fonts/DMSans-VariableFont_opsz_wght.ttf') format('truetype');
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;
}

/* ── colors ──────────────────────────────────────────────────────────────── */

:root {
  /* base palette — Numan Core EXP */
  --accent: #5252E6;
  --accent-hover: #8A38F5;
  --accent-light: #DCDCFF;
  --accent-subtle: #EFEFFF;
  --accent-track: #E4E4F5;
  --accent-pale: #B4B4F5;
  --accent-bright: #9E9EFF;
  --ink: #362252;
  --bg-0: #FFFFFF;
  --bg-100: #F7F7FF;
  --bg-200: #F3F3F5;
  --bg-contrast: #151225;
  --fg-subtle: #6B6B8A;
  --fg-disabled: #BBBBD6;
  --border: #D2D2E8;
  --border-strong: #C4C4EE;
  --border-header: #E4E4F5;
  --divider: #F0F0F8;
  --positive: #33CC33;
  --positive-bg: #ECFCF4;
  --positive-border: #CFF3DF;
  --attention: #AD6408;
  --attention-bg: #FFE8CB;
  --attention-border: #E9B25E;
  --negative: #F72A61;

  /* semantic aliases */
  --text-primary: var(--ink);
  --text-secondary: var(--fg-subtle);
  --text-placeholder: var(--fg-disabled);
  --text-on-dark: #FFFFFF;
  --text-on-dark-muted: rgba(255, 255, 255, .7);
  --text-overline-dark: var(--accent-light);
  --text-link: var(--accent);
  --surface-app: var(--bg-100);
  --surface-card: var(--bg-0);
  --surface-card-dark: var(--bg-contrast);
  --surface-tint: var(--accent-subtle);
  --surface-neutral: var(--bg-200);
  --surface-nav-active: var(--accent-light);
  --border-card: var(--border);
  --border-row: var(--divider);
  --action-primary: var(--accent);
  --action-primary-text: #FFFFFF;
  --action-dark: var(--ink);
  --action-destructive: var(--negative);
  --macro-protein: var(--accent);
  --macro-carbs: var(--accent-hover);
  --macro-fat-over: var(--attention);
  --record: var(--attention);
  --record-bg: var(--attention-bg);
  --record-border: var(--attention-border);
  --mode-iron: var(--ink);
  --mode-tonic: var(--ink);
  --gradient-coach: linear-gradient(135deg, #362252 0%, #5252E6 100%);
  --overlay-on-dark: rgba(255, 255, 255, .07);
  --border-on-dark: rgba(220, 220, 255, .2);
  --border-on-dark-soft: rgba(255, 255, 255, .25);
  --tile-on-dark: rgba(220, 220, 255, .16);

  /* ── typography ─────────────────────────────────────────────────────────── */

  --font-display: 'MD Nichrome', system-ui, sans-serif;
  --font-body: 'DM Sans', system-ui, sans-serif;
  --font-icons: 'Material Icons';
  --font-icons-outlined: 'Material Icons Outlined';

  /* weights */
  --fw-regular: 400;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 900;

  /* display scale (uppercase, tight) */
  --display-hero: 62px;
  --display-plan: 46px;
  --display-title: 34px;
  --display-screen: 26px;
  --display-stat-lg: 30px;
  --display-stat: 20px;
  --display-line: 1;
  --display-line-loose: 1.05;

  /* body scale */
  --text-18: 18px;
  --text-17: 17px;
  --text-15: 15px;
  --text-14: 14px;
  --text-13: 13px;
  --text-12: 12px;
  --text-11: 11px;
  --text-10: 10px;
  --body-line: 1.4;
  --overline-size: 11px;
  --overline-tracking: .14em;
  --overline-tracking-tight: .04em;
  --eyebrow-tracking: .16em;
  --grid-head-tracking: .1em;

  /* role aliases */
  --type-screen-title: var(--fw-black) var(--display-screen)/var(--display-line) var(--font-display);
  --type-card-title: var(--fw-bold) var(--text-15)/1.3 var(--font-body);
  --type-body: var(--fw-regular) var(--text-14)/var(--body-line) var(--font-body);
  --type-meta: var(--fw-regular) var(--text-12)/var(--body-line) var(--font-body);
  --type-label: var(--fw-bold) var(--text-13)/1.2 var(--font-body);
  --type-overline: var(--fw-bold) var(--overline-size)/1.2 var(--font-body);

  /* ── spacing ─────────────────────────────────────────────────────────────── */

  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-16: 16px;
  --space-20: 20px;
  --space-26: 26px;
  --space-28: 28px;
  --space-32: 32px;
  --gutter-mobile: 16px;
  --gutter-header: 20px;
  --gutter-desktop: 28px;
  --gutter-desktop-lg: 32px;
  --stack-card: 14px;
  --sidebar-width: 252px;
  --rail-width: 320px;
  --hit-target-min: 44px;

  /* ── radius ──────────────────────────────────────────────────────────────── */

  --radius-8: 8px;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-14: 14px;
  --radius-16: 16px;
  --radius-18: 18px;
  --radius-sheet: 28px;
  --radius-pill: 999px;
  --radius-tile: var(--radius-8);
  --radius-inner: var(--radius-12);
  --radius-card: var(--radius-14);
  --radius-card-lg: var(--radius-16);
  --radius-hero: var(--radius-18);

  /* ── elevation ───────────────────────────────────────────────────────────── */

  /* Cards are border-defined, never elevated. Only FABs and device frames carry shadow. */
  --elevation-card: none;
  --shadow-fab: 0 10px 24px rgba(82, 82, 230, .4);
  --shadow-phone: 0 18px 50px rgba(42, 12, 68, .28);
  --border-hairline: 1px solid var(--border);
  --border-focus: 1.5px solid var(--accent);

  /* ── motion ──────────────────────────────────────────────────────────────── */

  --ease-standard: cubic-bezier(.4, 0, .2, 1);
  --duration-knob: 280ms;
  --duration-label: 200ms;
  --duration-fast: 150ms;
  --transition-mode-knob: transform var(--duration-knob) var(--ease-standard);
  --transition-color: color var(--duration-label) var(--ease-standard);
}

/* ── base (icon helper classes + link defaults) ───────────────────────────── */

.mi, .mio {
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  font-feature-settings: 'liga';
}
.mi  { font-family: var(--font-icons); }
.mio { font-family: var(--font-icons-outlined); }