/* Metrica — édition standard, charte « Atelier » : ivoire, encre, vert atelier, laiton.
   Titres en Metrica Serif, interface en Metrica Sans, chiffres en IBM Plex Mono. Polices embarquées (licence OFL : polices/LICENCE-OFL.txt). */
@font-face { font-family: 'Metrica Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(edition/polices/metrica-sans-400.woff2) format('woff2'); }
@font-face { font-family: 'Metrica Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(edition/polices/metrica-sans-500.woff2) format('woff2'); }
@font-face { font-family: 'Metrica Sans'; font-style: normal; font-weight: 600 700; font-display: swap; src: url(edition/polices/metrica-sans-600.woff2) format('woff2'); }
@font-face { font-family: 'Metrica Serif'; font-style: normal; font-weight: 400; font-display: swap; src: url(edition/polices/metrica-serif-400.woff2) format('woff2'); }
@font-face { font-family: 'Metrica Serif'; font-style: italic; font-weight: 400; font-display: swap; src: url(edition/polices/metrica-serif-400-italique.woff2) format('woff2'); }

/* ---------- couleurs ---------- */
:root[data-amb="atelier"] {
  --bg: #F4F0E8; --surface: #FBF9F4; --surface-2: #EDE7DB; --line: #DDD6C7; --line-strong: #C3BAA7;
  --ink: #1C1B18; --muted: #6F6A5F;
  --accent: #23483C; --accent-ink: #F4F0E8; --accent-soft: #DCE6DF;
  --brass: #A8854A; --art: #23483C; --art-ink: #F1ECDF; --art-brass: #C9A86A;
  --plan-paper: #FFFFFF; --plan-ink: #1C1B18; --plan-faint: #B4AB98;
  --ok: #2F6B4A; --warn: #9A6A12; --bad: #A93A2E;
  --shadow: 0 1px 2px rgba(28, 27, 24, .05), 0 12px 32px rgba(28, 27, 24, .08);
  --f-display: 'Metrica Serif', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --f-body: 'Metrica Sans', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --r: 2px;
}
@media (prefers-color-scheme: dark) {
  :root[data-amb="atelier"]:not([data-theme="light"]) {
    --bg: #131815; --surface: #19201C; --surface-2: #222B26; --line: #2F3A34; --line-strong: #45524A;
    --ink: #EDE7DA; --muted: #A29D90;
    --accent: #8FC2AB; --accent-ink: #0F1512; --accent-soft: #1D2E27;
    --brass: #C9A86A; --art: #0F1512; --art-ink: #EDE7DA; --art-brass: #C9A86A;
    --plan-paper: #101412; --plan-ink: #DAD4C7; --plan-faint: #5E665F;
    --ok: #7CC29A; --warn: #E0AC55; --bad: #E7806F;
  }
}
:root[data-amb="atelier"][data-theme="dark"] {
  --bg: #131815; --surface: #19201C; --surface-2: #222B26; --line: #2F3A34; --line-strong: #45524A;
  --ink: #EDE7DA; --muted: #A29D90;
  --accent: #8FC2AB; --accent-ink: #0F1512; --accent-soft: #1D2E27;
  --brass: #C9A86A; --art: #0F1512; --art-ink: #EDE7DA; --art-brass: #C9A86A;
  --plan-paper: #101412; --plan-ink: #DAD4C7; --plan-faint: #5E665F;
  --ok: #7CC29A; --warn: #E0AC55; --bad: #E7806F;
}

/* ---------- typographie : le sérif pour les titres, sans capitales espacées ---------- */
body { font-size: 14px; line-height: 1.5; }
h1, h2, h3 { font-weight: 400; letter-spacing: 0; }
.page-head h1 { font-size: 40px; line-height: 1.05; letter-spacing: -.01em; text-transform: none; }
.page h2 { font-weight: 400; font-size: 22px !important; letter-spacing: 0; text-transform: none; }
.page .doc-head h2, .doc-head h2 { font-size: 22px !important; font-weight: 400; letter-spacing: 0; text-transform: none; }
.eyebrow { font: 500 10.5px/1.3 var(--f-mono); letter-spacing: .14em; }
.proj-card h3 { font-size: 21px; line-height: 1.15; font-weight: 400; letter-spacing: 0; text-transform: none; }
.book-head .bnum { font: 500 11px/1 var(--f-mono); letter-spacing: .1em; color: var(--brass); }
.book-head b { font: 400 21px/1.15 var(--f-display); text-transform: none; letter-spacing: 0; }
.book-head span.sub { font: 400 13px/1.35 var(--f-body); text-transform: none; letter-spacing: 0; color: var(--muted); }
table.t th { font: 500 10px var(--f-mono); letter-spacing: .12em; }
table.t tr.lot td { font: 400 16px/1.2 var(--f-display); letter-spacing: 0; text-transform: none; color: var(--accent); }
.ai-h { font: 500 10.5px var(--f-mono); letter-spacing: .14em; }
.wiz-steps span { font: 500 10.5px var(--f-mono); letter-spacing: .12em; }
.amb b { font: 400 19px/1.1 var(--f-display) !important; letter-spacing: 0 !important; text-transform: none !important; }
.modal h2 { font-size: 24px; }
.kv b { font-weight: 500; }

/* ---------- bandeau ---------- */
.topbar { min-height: 54px; }
.app-name { display: inline-flex; align-items: center; gap: 9px; font: 400 23px/1 var(--f-display); letter-spacing: -.005em; text-transform: none; }
.signe { display: inline-block; color: var(--accent); line-height: 0; }
.signe svg { display: block; }
.app-name .signe svg { width: 21px; height: 26px; }
.nav button { height: 54px; font: 500 13px var(--f-body); letter-spacing: 0; text-transform: none; border-bottom-width: 2px; }
.nav button[aria-current="page"] { border-bottom-color: var(--brass); }
.avatar { background: var(--accent); color: var(--accent-ink); }

/* ---------- boutons, champs, cartes ---------- */
.btn { height: 34px; padding: 0 14px; }
.btn.small { height: 27px; }
.btn.primary:hover { filter: none; background: color-mix(in srgb, var(--accent) 88%, var(--ink)); }
.input, select.input, textarea.input { height: 34px; background: var(--plan-paper); }
.card { border-radius: 3px; }
.proj-card { gap: 10px; border-top: 2px solid var(--accent); }
.proj-card:hover { border-color: var(--line-strong); border-top-color: var(--brass); }
.chip { border-radius: 2px; font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .04em; }
.chip.accent { background: var(--accent-soft); color: var(--accent); }
:focus-visible { outline-color: var(--brass); }

/* ---------- page de connexion : plan dessiné ---------- */
.login-art.dessin { background: var(--art); }
.login-art.dessin > svg { position: absolute; inset: 6% 7%; width: 86%; height: 88%; }
.login-art.dessin .w { fill: none; stroke: var(--art-ink); stroke-width: 5.5; stroke-linejoin: miter; }
.login-art.dessin .t { fill: none; stroke: var(--art-ink); stroke-width: .9; }
.login-art.dessin .gap { fill: var(--art); }
.login-art.dessin .ax { fill: none; stroke: var(--art-brass); stroke-width: .7; stroke-dasharray: 9 3 1.5 3; opacity: .8; }
.login-art.dessin .axc { fill: var(--art); stroke: var(--art-brass); stroke-width: .8; }
.login-art.dessin .axt { fill: var(--art-brass); font: 500 8.5px var(--f-mono); text-anchor: middle; }
.login-art.dessin .z1 { fill: var(--art-ink); fill-opacity: .12; }
.login-art.dessin .z2 { fill: var(--art-brass); fill-opacity: .16; }
.login-art.dessin .zl { fill: var(--art-ink); font: 400 11px var(--f-display); text-anchor: middle; }
.login-art.dessin .zn { fill: var(--art-ink); font: 500 8.5px var(--f-mono); text-anchor: middle; opacity: .8; }
.login-art.dessin .dm { fill: none; stroke: var(--art-brass); stroke-width: 1; }
.login-art.dessin .dt { fill: var(--art-brass); font: 500 8.5px var(--f-mono); text-anchor: middle; }
.login-art .cap { left: 28px; bottom: 24px; padding: 0; background: none; color: var(--art-ink); opacity: .75; font: 500 10.5px var(--f-mono); letter-spacing: .14em; }
.login-form { gap: 20px; }
.login-cover { gap: 0; }
.login-cover .word { display: inline-flex; align-items: center; gap: 14px; font: 400 44px/1 var(--f-display); letter-spacing: -.015em; text-transform: none; }
.login-cover .word .signe svg { width: 34px; height: 43px; }
.login-tag h1 { font-size: 32px; line-height: 1.08; letter-spacing: -.01em; }
.login-tag p { margin: 6px 0 0; font-size: 13.5px; }
.login-form form .btn.primary { height: 40px !important; }

/* ---------- double authentification ---------- */
.mfa-codes { background: var(--surface-2); border-radius: 2px; }
.mfa-qr svg { border-radius: 2px; }
