/* Balise — styles (thème clair/sombre, échelle de texte, animations) */

:root {
  --petrol-900: #0A3742; --petrol-800: #0E4B5A; --petrol-700: #14606F;
  --petrol-600: #2C7C8C; --petrol-300: #9FC4CC; --petrol-100: #E2EEF1; --petrol-50: #F1F7F8;
  --brand-ink: #0E4B5A; --btn-bg: #0E4B5A; --btn-fg: #FFFFFF;
  --bg: #FAFBFB; --bg-card: #FFFFFF; --bg-cream: #F4F6F6;
  --ink-900: #16281D; --ink-800: #223328; --ink-700: #41504A; --ink-500: #6E7A74;
  --ink-400: #8B9699; --ink-300: #B8C1BC; --ink-200: #DDE3E0; --ink-100: #EBEFED; --ink-50: #F5F7F6;
  --green-50: #EAF2EC; --green-100: #D7E8DB;
  --warm-yellow-light: #FBF3DC; --warm-coral: #C96F4A;
  --shadow-lg: 0 10px 30px rgba(14, 75, 90, .12);
  --shadow-xl: 0 24px 60px rgba(10, 55, 66, .25);
}

[data-theme="dark"] {
  --bg: #0E1315; --bg-card: #151D20; --bg-cream: #182124;
  --ink-900: #ECF1F2; --ink-800: #DFE6E7; --ink-700: #CBD4D6; --ink-500: #A2ADB0;
  --ink-400: #8B9699; --ink-300: #5C6669; --ink-200: #313B3E; --ink-100: #262F31; --ink-50: #1D2528;
  --green-50: #16201F; --green-100: #1C2C2E;
  --warm-yellow-light: #2A2418; --warm-coral: #E8907A;
  --petrol-100: #12292F; --petrol-50: #101F23; --petrol-300: #2F5A64;
  --brand-ink: #8FD0DE; --btn-bg: #14606F; --btn-fg: #FFFFFF;
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, .45);
  --shadow-xl: 0 24px 60px rgba(0, 0, 0, .6);
}

[data-scale="m"] { font-size: 17.5px; }
[data-scale="l"] { font-size: 19.5px; }

@keyframes bh-dot { 0%, 60%, 100% { opacity: .25; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
@keyframes bh-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.bh-in { animation: bh-in 260ms ease-out; }
.bh-dot { animation: bh-dot 1.1s infinite; }
.bh-caret { animation: bh-dot .9s infinite; }

a { color: var(--brand-ink); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--ink-900); }

*:focus-visible { outline: 3px solid var(--petrol-600); outline-offset: 2px; border-radius: 6px; }

button[aria-pressed="true"].bh-toggle {
  border-color: var(--petrol-600) !important;
  background: var(--petrol-100) !important;
  color: var(--brand-ink) !important;
}

.sigle-btn { border: 0; background: transparent; padding: 0; font: inherit; color: var(--brand-ink); font-weight: 600; cursor: help; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; position: relative; }
.sigle-tip { position: absolute; z-index: 20; bottom: calc(100% + 8px); left: 0; width: 280px; background: var(--petrol-900); color: #fff; font-size: 0.82em; line-height: 1.45; font-weight: 400; padding: 10px 12px; border-radius: 14px; box-shadow: var(--shadow-xl); display: block; }

cite-n, .cite-n { font-size: 0.72em; vertical-align: super; line-height: 0; margin-left: 1px; color: var(--petrol-600); font-weight: 600; text-decoration: none; }
.cite-n:hover { color: var(--ink-900); }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: var(--ink-200); border-radius: 4px; }
::-webkit-scrollbar-track { background: transparent; }