@layer reset, tokens, base, layout, components, responsive;

/* Figtree, police de la marque, servie par l'atelier lui-même (aucun hôte externe). */
@font-face { font-family: 'Figtree'; src: url('/fonts/Figtree-Regular.ttf') format('truetype'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/Figtree-Medium.ttf') format('truetype'); font-weight: 500; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/Figtree-SemiBold.ttf') format('truetype'); font-weight: 600; font-display: swap; }
@font-face { font-family: 'Figtree'; src: url('/fonts/Figtree-Bold.ttf') format('truetype'); font-weight: 700; font-display: swap; }

@layer tokens {
  :root {
    color-scheme: light;
    /* Surfaces chaudes superposées : fond crème, panneaux plus clairs, barre latérale plus dense. */
    --bg: #f7f4eb; --bg-sunken: #efebe0; --surface: #fffdf8; --surface-raised: #ffffff; --surface-hover: #f3efe5;
    --line: #e5e0d4; --line-strong: #cfc8b8;
    --ink: #0d0d0d; --ink-2: #3a3832; --muted: #696459;
    /* Orange de marque : fond d'action avec texte noir (contraste AA), version foncée pour le texte. */
    --accent: #f03c00; --accent-hover: #d93600; --accent-ink: #0d0d0d; --accent-text: #b32f00; --accent-soft: #fbe3d6;
    --success: #3d6a2e; --success-soft: #e4edda; --warning: #85570a; --warning-soft: #f6ead0; --danger: #b42318; --danger-soft: #fbe4df;
    --inverse: #1b1916; --inverse-ink: #f7f4eb; --inverse-muted: #bdb6a8;
    --shadow-sm: 0 1px 2px rgb(52 38 18 / .06), 0 1px 1px rgb(52 38 18 / .04);
    --shadow-md: 0 8px 20px -10px rgb(52 38 18 / .18), 0 2px 5px rgb(52 38 18 / .05);
    --shadow-lg: 0 28px 56px -20px rgb(52 38 18 / .28), 0 6px 14px rgb(52 38 18 / .07);
    --backdrop: rgb(27 25 22 / .36);
    --selection: #f9c3ab;
    /* Anciens noms conservés pour les modules existants. */
    --paper: var(--bg); --orange: var(--accent); --soft-orange: var(--accent-soft); --sage: var(--success-soft); --dark: var(--inverse);

    --font: 'Figtree', 'Segoe UI', system-ui, sans-serif;
    --text-xs: .75rem; --text-sm: .8125rem; --text-base: .875rem; --text-md: 1rem; --text-lg: 1.1875rem; --text-xl: 1.4375rem; --text-2xl: 1.75rem; --text-3xl: 2.125rem;
    --radius-sm: 8px; --radius: 12px; --radius-lg: 18px; --radius-xl: 24px; --radius-pill: 999px;
    --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px;
    --ease-out: cubic-bezier(.22, 1, .36, 1); --dur-fast: 140ms; --dur: 200ms;
    --sidebar-width: 248px;
  }
  /* Thème sombre : appliqué si choisi, ou si le système le demande sans choix explicite. */
  :root[data-theme='dark'] {
    color-scheme: dark;
    --bg: #12110f; --bg-sunken: #0c0b0a; --surface: #1a1816; --surface-raised: #221f1c; --surface-hover: #27231f;
    --line: #2e2a25; --line-strong: #423c35;
    --ink: #f4efe6; --ink-2: #d4cdc0; --muted: #a39c8f;
    --accent: #ff5a1f; --accent-hover: #ff7340; --accent-ink: #0d0d0d; --accent-text: #ff8a5c; --accent-soft: #3a1d12;
    --success: #9ccb86; --success-soft: #1d2a18; --warning: #e7bb63; --warning-soft: #2f2512; --danger: #ff8f80; --danger-soft: #3b1915;
    --inverse: #26221e; --inverse-ink: #f4efe6; --inverse-muted: #b3ab9d;
    --shadow-sm: 0 1px 2px rgb(0 0 0 / .4);
    --shadow-md: 0 10px 24px -12px rgb(0 0 0 / .7), 0 2px 6px rgb(0 0 0 / .35);
    --shadow-lg: 0 30px 60px -20px rgb(0 0 0 / .8), 0 6px 16px rgb(0 0 0 / .4);
    --backdrop: rgb(0 0 0 / .62);
    --selection: #7a2c10;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme='light']):not([data-theme='dark']) {
      color-scheme: dark;
      --bg: #12110f; --bg-sunken: #0c0b0a; --surface: #1a1816; --surface-raised: #221f1c; --surface-hover: #27231f;
      --line: #2e2a25; --line-strong: #423c35;
      --ink: #f4efe6; --ink-2: #d4cdc0; --muted: #a39c8f;
      --accent: #ff5a1f; --accent-hover: #ff7340; --accent-ink: #0d0d0d; --accent-text: #ff8a5c; --accent-soft: #3a1d12;
      --success: #9ccb86; --success-soft: #1d2a18; --warning: #e7bb63; --warning-soft: #2f2512; --danger: #ff8f80; --danger-soft: #3b1915;
      --inverse: #26221e; --inverse-ink: #f4efe6; --inverse-muted: #b3ab9d;
      --shadow-sm: 0 1px 2px rgb(0 0 0 / .4);
      --shadow-md: 0 10px 24px -12px rgb(0 0 0 / .7), 0 2px 6px rgb(0 0 0 / .35);
      --shadow-lg: 0 30px 60px -20px rgb(0 0 0 / .8), 0 6px 16px rgb(0 0 0 / .4);
      --backdrop: rgb(0 0 0 / .62);
      --selection: #7a2c10;
    }
  }
}