:root{
  --bg:#0B0C0A;
  --surface:#14160F;
  --surface-2:#1B1D15;
  --surface-3:#20221A;
  --border:#282A20;
  --text:#F2F0E8;
  --text-dim:#94978A;
  --text-faint:#5C5E52;
  --accent:#C9A227;
  --accent-dim:#8C7420;
  --pos:#7FA487;
  --neg:#B4574A;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{
  background:var(--bg); color:var(--text);
  font-family:'IBM Plex Sans', sans-serif; line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
.serif{ font-family:'Fraunces', serif; font-optical-sizing:auto; }
.mono{ font-family:'IBM Plex Mono', monospace; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
input, textarea, select{ font-family:inherit; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }

/* ---- Header ---- */
header{
  border-bottom:1px solid var(--border);
  position:sticky; top:0; z-index:20;
  background:rgba(11,12,10,0.92);
  backdrop-filter:blur(8px);
}
.header-row{ display:flex; align-items:center; justify-content:space-between; height:64px; }
.logo{ font-family:'Fraunces', serif; font-size:20px; font-weight:600; letter-spacing:-0.02em; display:flex; align-items:center; gap:8px;}
.logo .mark{ width:9px; height:22px; background:var(--accent); display:inline-block; transform:skewX(-12deg); }
nav{ display:flex; gap:28px; font-size:14px; color:var(--text-dim); flex-wrap:wrap; }
nav a.active{ color:var(--text); }
nav a:hover{ color:var(--text); }
.cta-small{ font-size:13px; padding:9px 16px; border:1px solid var(--border); border-radius:3px; color:var(--text); white-space:nowrap; }
.cta-small:hover{ border-color:var(--accent); }
.menu-toggle{ display:none; background:transparent; border:1px solid var(--border); color:var(--text); border-radius:3px; padding:7px 11px; font-size:16px; line-height:1; }
.menu-toggle:hover{ border-color:var(--accent); }

/* Le nav compte 6 entrées depuis l'ajout des registres "Levées de
   fonds" et "Événements" — à 760px il n'y a plus assez de place et
   "Registres" se détachait seul sur une deuxième ligne, mal aligné,
   sans déclencher le menu mobile (ni vraiment bureau, ni vraiment
   mobile). Le seuil est monté à 1100px pour couvrir cette zone morte. */
@media (max-width:1100px){
  .menu-toggle{ display:inline-block; order:1; margin-left:auto; }
  .header-actions{ order:2; }
  nav{
    display:none; order:3; width:100%; flex-direction:column; gap:0;
    border-top:1px solid var(--border); margin-top:14px;
  }
  nav.open{ display:flex; }
  nav a{ padding:13px 4px; border-bottom:1px solid var(--surface-2); }
  .header-row{ flex-wrap:wrap; height:auto; padding:14px 0; }
}
.header-actions{ display:flex; gap:10px; align-items:center; }

/* ---- Page head ---- */
.page-head{ padding:40px 0 28px; }
.page-head h1{ font-family:'Fraunces', serif; font-weight:500; font-size:32px; letter-spacing:-0.01em; }
.page-head p{ color:var(--text-dim); font-size:14.5px; margin-top:8px; max-width:600px; }

/* ---- Hero ---- */
.hero{ padding:64px 0 72px; display:grid; grid-template-columns:1.05fr 0.95fr; gap:64px; align-items:center; }
.hero h1{ font-family:'Fraunces', serif; font-weight:500; font-size:46px; line-height:1.1; letter-spacing:-0.015em; max-width:560px; }
.hero h1 .accent-word{ color:var(--accent); font-style:italic; }
.hero p{ margin-top:18px; font-size:16px; color:var(--text-dim); max-width:460px; line-height:1.6; }
.hero-ctas{ margin-top:26px; display:flex; gap:14px; align-items:center; }
.btn-primary{ background:var(--accent); color:#0B0C0A; font-weight:600; padding:12px 20px; border-radius:3px; font-size:14px; border:none; display:inline-block; }
.btn-primary:hover{ background:#DDB537; }
.btn-ghost{ font-size:14px; color:var(--text-dim); padding:12px 6px; }
.btn-ghost:hover{ color:var(--text); }

/* ---- Widget / card ---- */
.widget{ background:var(--surface); border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.widget-head{ display:flex; justify-content:space-between; align-items:center; padding:14px 18px; border-bottom:1px solid var(--border); font-size:12.5px; color:var(--text-faint); }
.widget-head .dot{ width:6px; height:6px; border-radius:50%; background:var(--pos); display:inline-block; margin-right:6px; }
.widget-foot{ padding:10px 18px; font-size:11px; color:var(--text-faint); border-top:1px solid var(--border); }

/* ---- Fraîcheur des données : pastille + badge de statut ---- */
.dot.attention{ background:var(--accent); }
.dot.perime{ background:var(--neg); }
.fraicheur-badge{ display:inline-flex; align-items:center; gap:6px; font-size:12px; padding:5px 10px; border-radius:20px; border:1px solid var(--border); }
.fraicheur-badge .dot{ margin-right:0; }
.fraicheur-badge.ok{ color:var(--pos); border-color:var(--pos); }
.fraicheur-badge.attention{ color:var(--accent); border-color:var(--accent); }
.fraicheur-badge.perime{ color:var(--neg); border-color:var(--neg); }
.fraicheur-badge.inconnu{ color:var(--text-faint); }
.widget table thead th{ background:transparent; }
.fund-name{ font-weight:500; }
.fund-cat{ color:var(--text-faint); font-size:11px; }

.card{ background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:22px; margin-bottom:16px; }

/* ---- Chiffres clés ---- */
.strip{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:6px; overflow:hidden; margin:24px 0; }
.strip div{ background:var(--surface); padding:20px 22px; }
.strip .n{ font-family:'Fraunces', serif; font-size:26px; color:var(--accent); }
.strip .l{ font-size:12px; color:var(--text-dim); margin-top:4px; }

/* ---- Feature grid (irregular, from prototype) ---- */
.feature-grid{ display:grid; grid-template-columns:1.3fr 1fr; grid-template-rows:auto auto; gap:1px; background:var(--border); border:1px solid var(--border); border-radius:6px; overflow:hidden; }
.feature{ background:var(--surface); padding:26px; }
.feature.tall{ grid-row:span 2; }
.feature h3{ font-size:15.5px; font-weight:600; margin-bottom:8px; }
.feature p{ font-size:13.5px; color:var(--text-dim); line-height:1.6; margin-bottom:18px; }
.mini-table{ font-size:12px; }
.mini-table th{ padding:7px 0; font-size:10.5px; text-align:left; color:var(--text-faint); font-weight:500; }
.mini-table td{ padding:8px 0; border-bottom:1px solid var(--surface-2); }
.tri-badge{ display:inline-flex; align-items:baseline; gap:6px; background:var(--surface-2); border:1px solid var(--border); padding:10px 14px; border-radius:4px; margin-top:4px; }
.tri-badge .n{ font-family:'IBM Plex Mono', monospace; font-size:22px; color:var(--pos); }
.tri-badge .l{ font-size:11.5px; color:var(--text-faint); }
.simul-out{ display:flex; gap:20px; margin-top:6px; }
.simul-out .label{ font-size:11px; color:var(--text-faint); margin-bottom:4px; }
.simul-out .value{ font-family:'IBM Plex Mono', monospace; font-size:20px; color:var(--accent); }

@media (max-width:860px){
  .feature-grid{ grid-template-columns:1fr; }
  .feature.tall{ grid-row:auto; }
}

/* ---- Section ---- */
.section{ padding:48px 0; border-top:1px solid var(--border); }
.section-intro{ max-width:520px; margin-bottom:32px; }
.section-intro h2{ font-family:'Fraunces', serif; font-weight:500; font-size:26px; letter-spacing:-0.01em; margin-bottom:10px; }
.section-intro p{ color:var(--text-dim); font-size:14.5px; line-height:1.6; }

/* ---- Controls (filtres) ---- */
.controls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding-bottom:20px; margin-bottom:4px; }
.search{ flex:1; min-width:220px; max-width:340px; background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:9px 12px; font-size:13.5px; color:var(--text); }
.search::placeholder{ color:var(--text-faint); }
.search:focus{ outline:none; border-color:var(--accent); }
.chip-group{ display:flex; gap:6px; flex-wrap:wrap; }
.chip{ background:transparent; border:1px solid var(--border); color:var(--text-dim); padding:8px 13px; border-radius:20px; font-size:12.5px; }
.chip:hover{ border-color:var(--text-faint); color:var(--text); }
.chip.on{ background:var(--surface-3); border-color:var(--accent); color:var(--text); }
.spacer{ flex:1; }
.result-count{ font-size:12.5px; color:var(--text-faint); }

/* ---- Table ---- */
.table-shell{ border:1px solid var(--border); border-radius:6px; overflow:hidden; margin-bottom:40px; }
table{ width:100%; border-collapse:collapse; font-size:13px; }
thead th{ text-align:left; font-weight:500; color:var(--text-faint); padding:11px 16px; font-size:11px; background:var(--surface-2); border-bottom:1px solid var(--border); white-space:nowrap; }
thead th.num, tbody td.num{ text-align:right; }
thead th.sortable{ cursor:pointer; }
thead th.sortable:hover{ color:var(--text); }
thead th .arrow{ margin-left:4px; opacity:0.4; font-size:9px; }
thead th.active-sort{ color:var(--accent); }
thead th.active-sort .arrow{ opacity:1; }
tbody{ background:var(--surface); }
tbody tr{ border-bottom:1px solid var(--surface-2); cursor:pointer; }
tbody tr:last-child{ border-bottom:none; }
tbody tr:hover{ background:var(--surface-2); }
td{ padding:11px 16px; }
.row-name{ font-weight:500; }
.row-meta{ color:var(--text-faint); font-size:11px; margin-top:2px; }
.badge-unl{ font-size:9.5px; padding:1px 6px; border-radius:3px; border:1px solid var(--border); color:var(--text-faint); margin-left:6px; }
.chg-pos{ color:var(--pos); }
.chg-neg{ color:var(--neg); }
.dim{ color:var(--text-faint); }
.no-results{ padding:48px; text-align:center; color:var(--text-faint); font-size:13.5px; }

/* ---- Indicateurs (tuiles type terminal financier) ---- */
.quote-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:1px; background:var(--border); border:1px solid var(--border); border-radius:6px; overflow:hidden; margin-bottom:32px; }
.quote-tile{ background:var(--surface); padding:16px 18px; }
.quote-tile .lbl{ font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); }
.quote-tile .val{ font-family:'IBM Plex Mono', monospace; font-size:24px; margin-top:8px; }
.quote-tile .chg{ font-family:'IBM Plex Mono', monospace; font-size:12px; margin-top:4px; display:flex; align-items:center; gap:4px; }
.quote-tile .meta{ font-size:10.5px; color:var(--text-faint); margin-top:10px; font-family:'IBM Plex Mono', monospace; }
.quote-tile .meta span{ display:block; }

.hist-toggle{ display:flex; justify-content:space-between; align-items:center; padding:12px 16px; cursor:pointer; font-size:12.5px; color:var(--text-dim); background:var(--surface-2); }
.hist-toggle:hover{ color:var(--text); }
.hist-toggle .car{ font-family:'IBM Plex Mono', monospace; color:var(--text-faint); font-size:11px; }
details[open] .hist-toggle .car{ transform:rotate(90deg); display:inline-block; }
details summary{ list-style:none; }
details summary::-webkit-details-marker{ display:none; }
.hist-table td, .hist-table th{ font-family:'IBM Plex Mono', monospace; }

/* ---- Forms ---- */
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:14px; }
.field label{ font-size:12px; color:var(--text-faint); }
.field input, .field select, .field textarea{ background:var(--surface); border:1px solid var(--border); border-radius:4px; padding:10px 12px; font-size:13.5px; color:var(--text); width:100%; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--accent); }
.submit-btn, .btn{ background:var(--accent); color:#0B0C0A; font-weight:600; padding:12px 20px; border-radius:3px; font-size:14px; border:none; display:inline-block; }
.submit-btn:hover, .btn:hover{ background:#DDB537; }
.btn-secondary{ background:transparent; border:1px solid var(--border); color:var(--text); }
.btn-secondary:hover{ border-color:var(--accent); background:transparent; }

.disclaimer{ display:flex; gap:12px; align-items:flex-start; background:var(--surface); border:1px solid var(--border); border-radius:6px; padding:16px 18px; margin:20px 0 32px; font-size:12.5px; color:var(--text-dim); line-height:1.6; }
.disclaimer .ic{ color:var(--accent); font-family:'Fraunces', serif; font-style:italic; font-size:16px; flex-shrink:0; }

/* ---- Flash messages ---- */
.flash{ padding:12px 16px; border-radius:6px; margin-bottom:16px; font-size:13.5px; border:1px solid var(--border); }
.flash-success{ border-color:var(--pos); color:var(--pos); }
.flash-danger{ border-color:var(--neg); color:var(--neg); }
.flash-info{ border-color:var(--accent); color:var(--accent); }

/* ---- Detail list ---- */
.dl-row{ display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--surface-2); font-size:13px; }
.dl-row:last-child{ border-bottom:none; }
.dl-row .k{ color:var(--text-faint); }
.dl-row .v{ font-family:'IBM Plex Mono', monospace; }

footer{ border-top:1px solid var(--border); padding:32px 0; margin-top:24px; }
.footer-row{ display:flex; justify-content:space-between; align-items:center; font-size:12.5px; color:var(--text-faint); flex-wrap:wrap; gap:8px; }
.footer-links{ display:flex; gap:22px; }

@media (max-width:860px){
  .hero{ grid-template-columns:1fr; padding:48px 0; }
  .hero h1{ font-size:34px; }
  .strip{ grid-template-columns:1fr 1fr; }
  .table-shell{ overflow-x:auto; }
  table{ min-width:760px; }
}