/* ============================================================
   base.css — reset, jetons de thème, typographie
   Identité « atelier / grand livre » : bleu nuit + ambre,
   chiffres en police monospace. Thème clair/sombre.
   ============================================================ */

:root {
    /* Couleurs — thème clair (défaut) */
    --bg: #f3f4f6;
    --surface: #ffffff;
    --surface-2: #f8fafc;
    --surface-3: #eef1f5;
    --border: #e0e4ea;
    --border-strong: #cdd3dd;
    --text: #1b2431;
    --text-muted: #64748b;
    --text-faint: #94a3b8;

    --accent: #cc8500;
    --accent-hover: #b37400;
    --accent-soft: #fbecd0;
    --on-accent: #ffffff;

    --pos: #15803d;
    --pos-soft: #dcfce7;
    --neg: #dc2626;
    --neg-soft: #fee2e2;
    --warn: #d97706;
    --warn-soft: #fef3c7;

    --perso: #0e7490;
    --perso-soft: #cff2f7;
    --pro: #7c3aed;
    --pro-soft: #ede0ff;

    --shadow-sm: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .05);
    --shadow-md: 0 4px 12px rgba(16, 24, 40, .08), 0 2px 4px rgba(16, 24, 40, .05);
    --shadow-lg: 0 12px 32px rgba(16, 24, 40, .14);

    --radius: 12px;
    --radius-sm: 8px;
    --radius-lg: 18px;

    --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", "Cascadia Code", "Roboto Mono", Menlo, Consolas, monospace;

    --sidebar-w: 234px;
    --topbar-h: 62px;
}

:root[data-theme="dark"] {
    --bg: #0e131b;
    --surface: #161d28;
    --surface-2: #1b2430;
    --surface-3: #212c3a;
    --border: #2a3543;
    --border-strong: #3a4757;
    --text: #e8edf4;
    --text-muted: #94a3b6;
    --text-faint: #6b7c90;

    --accent: #f5a623;
    --accent-hover: #ffb742;
    --accent-soft: #3a2e18;
    --on-accent: #1a1204;

    --pos: #34d399;
    --pos-soft: #10321f;
    --neg: #f87171;
    --neg-soft: #3a1a1a;
    --warn: #fbbf24;
    --warn-soft: #382a12;

    --perso: #22d3ee;
    --perso-soft: #113038;
    --pro: #a78bfa;
    --pro-soft: #2a2140;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
    --shadow-md: 0 6px 18px rgba(0, 0, 0, .38);
    --shadow-lg: 0 16px 40px rgba(0, 0, 0, .5);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --bg: #0e131b;
        --surface: #161d28;
        --surface-2: #1b2430;
        --surface-3: #212c3a;
        --border: #2a3543;
        --border-strong: #3a4757;
        --text: #e8edf4;
        --text-muted: #94a3b6;
        --text-faint: #6b7c90;
        --accent: #f5a623;
        --accent-hover: #ffb742;
        --accent-soft: #3a2e18;
        --on-accent: #1a1204;
        --pos: #34d399;
        --pos-soft: #10321f;
        --neg: #f87171;
        --neg-soft: #3a1a1a;
        --warn: #fbbf24;
        --warn-soft: #382a12;
        --perso: #22d3ee;
        --perso-soft: #113038;
        --pro: #a78bfa;
        --pro-soft: #2a2140;
        --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
        --shadow-md: 0 6px 18px rgba(0, 0, 0, .38);
        --shadow-lg: 0 16px 40px rgba(0, 0, 0, .5);
    }
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
    font-family: var(--font);
    font-size: 14px;
    line-height: 1.5;
    color: var(--text);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 { font-weight: 650; line-height: 1.25; letter-spacing: -.01em; }
h1 { font-size: 1.5rem; }
h2 { font-size: 1.15rem; }
h3 { font-size: 1rem; }

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; }
ul { list-style: none; }
svg { display: block; }

/* Nombres monétaires : chasse fixe, alignement des colonnes */
.num, .mono {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
    letter-spacing: -.02em;
}
.pos { color: var(--pos); }
.neg { color: var(--neg); }

::selection { background: var(--accent-soft); }

:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Barre de défilement discrète */
* {
    scrollbar-width: thin;
    scrollbar-color: var(--border-strong) transparent;
}
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb {
    background: var(--border-strong);
    border-radius: 8px;
    border: 3px solid var(--bg);
}

/* Écran de démarrage */
.app-loading { display: grid; place-items: center; min-height: 100vh; }
.boot { text-align: center; color: var(--text-muted); }
.boot-mark {
    font-size: 2.5rem; color: var(--accent);
    animation: pulse 1.4s ease-in-out infinite;
}
@keyframes pulse { 0%, 100% { opacity: .35; } 50% { opacity: 1; } }

.hidden { display: none !important; }
.sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}