:root{
    --ground:#0A0D12;
    --panel:#12161D;
    --panel-2:#171C25;
    --panel-3:#1C222D;
    --line:#262C38;
    --line-soft:#1B212B;
    --ink:#E8EBF1;
    --ink-muted:#8B93A6;
    --ink-faint:#565E70;
    --accent:#E0A438;
    --accent-soft:rgba(224,164,56,0.13);
    --err:#E2574C;
    --err-soft:rgba(226,87,76,0.10);
    --err-line:rgba(226,87,76,0.35);
    --sol:#4FAE7C;
    --sol-soft:rgba(79,174,124,0.10);
    --sol-line:rgba(79,174,124,0.35);
    --dat:#4FA3D6;
    --dat-soft:rgba(79,163,214,0.10);
    --dat-line:rgba(79,163,214,0.35);
    --font-display:'Big Shoulders Display', sans-serif;
    --font-body:'IBM Plex Sans', sans-serif;
    --font-mono:'IBM Plex Mono', monospace;
    --radius:3px;
  }
  *{ box-sizing:border-box; }
  html,body{ margin:0; padding:0; }
  body{ background:var(--ground); color:var(--ink); font-family:var(--font-body); font-size:14px; line-height:1.55; -webkit-font-smoothing:antialiased; }
  ::selection{ background:var(--accent-soft); color:var(--accent); }
  a{ color:inherit; }
  button{ font-family:inherit; }
  ol,ul{ margin:0; padding:0; list-style:none; }
  h1,h2,h3,p{ margin:0; }
  :focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
  .icon{ width:1em; height:1em; stroke:currentColor; fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

  .shell{ max-width:1320px; margin:0 auto; padding:0 20px 64px; }

  .topbar{ display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; padding:28px 0 20px; border-bottom:1px solid var(--line); margin-bottom:22px; }
  .brand-mark{ font-family:var(--font-mono); font-size:11px; letter-spacing:0.14em; color:var(--ground); background:var(--accent); padding:3px 7px; border-radius:2px; font-weight:600; }
  .brand h1{ font-family:var(--font-display); font-weight:800; letter-spacing:0.01em; font-size:34px; line-height:1; text-transform:uppercase; text-wrap:balance; display:inline; }
  .brand-sub{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-muted); letter-spacing:0.03em; margin-top:6px; }
  .coverage-badge{ font-family:var(--font-mono); font-size:11px; color:var(--dat); border:1px solid var(--dat-line); background:var(--dat-soft); padding:6px 12px; border-radius:20px; white-space:nowrap; }

  .feedback-banner{ display:flex; align-items:center; gap:10px; background:var(--accent-soft); border:1px solid var(--accent); border-radius:9px; padding:10px 14px; margin:0 0 16px; font-size:12.5px; line-height:1.5; color:var(--ink); }
  .feedback-banner .icon{ width:18px; height:18px; color:var(--accent); flex-shrink:0; }
  .feedback-banner-text{ flex:1; }
  .feedback-banner-text a{ color:var(--accent); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
  .feedback-banner-close{ background:none; border:none; color:var(--ink-muted); cursor:pointer; font-size:13px; padding:4px 6px; flex-shrink:0; border-radius:6px; }
  .feedback-banner-close:hover{ color:var(--ink); background:rgba(255,255,255,0.06); }
  .feedback-banner[hidden]{ display:none !important; }
  @media (max-width:480px){ .feedback-banner{ font-size:12px; padding:9px 11px; } }

  .picker{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:22px; }
  @media (max-width:800px){ .picker{ grid-template-columns:1fr; } }
  .picker-col{ border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); overflow:hidden; }
  .picker-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; border-bottom:1px solid var(--line); background:var(--panel-2); }
  .picker-head h2{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-muted); }
  .picker-clear{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink-faint); background:none; border:0; cursor:pointer; }
  .picker-clear:hover{ color:var(--ink); }
  .picker-list{ display:flex; flex-wrap:wrap; align-content:flex-start; gap:7px; padding:12px; }
  .opt{ display:inline-flex; align-items:center; gap:7px; width:auto; text-align:left; background:var(--panel-2); border:1px solid var(--line); color:var(--ink-muted); padding:7px 12px; border-radius:20px; cursor:pointer; font-size:12.5px; white-space:nowrap; line-height:1.2; }
  .opt .icon{ width:15px; height:15px; color:var(--ink-faint); flex-shrink:0; }
  .opt:hover{ background:var(--panel-3); color:var(--ink); border-color:var(--ink-faint); }
  .opt.is-selected{ background:var(--accent-soft); border-color:var(--accent); color:var(--ink); }
  .opt.is-selected .icon{ color:var(--accent); }
  .opt.is-unavailable{ opacity:0.35; }
  .opt.is-unavailable:hover{ background:var(--panel-2); color:var(--ink-muted); border-color:var(--line); }
  .opt-count{ margin-left:2px; font-family:var(--font-mono); font-size:10px; color:var(--ink-faint); }

  .picker-head-actions{ display:flex; align-items:center; gap:8px; }
  .mic-btn{ display:flex; align-items:center; justify-content:center; width:24px; height:24px; padding:0; border-radius:50%; border:1px solid var(--line); background:var(--panel); color:var(--ink-muted); cursor:pointer; flex-shrink:0; }
  .mic-btn .icon{ width:13px; height:13px; }
  .mic-btn:hover{ border-color:var(--accent); color:var(--accent); }
  .mic-btn.is-listening{ background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
  .mic-btn.is-listening .icon{ animation:pulse-speak 1s ease-in-out infinite; }
  .mic-btn.is-unsupported{ opacity:0.3; cursor:not-allowed; }
  .voice-note{ font-size:11.5px; line-height:1.4; padding:0 12px 10px; color:var(--ink-muted); display:none; }
  .voice-note.is-visible{ display:block; }
  .voice-note.is-error{ color:var(--err); }
  .voice-note.is-success{ color:var(--sol); }

  main{ min-width:0; }

  .empty-state{ border:1px dashed var(--line); border-radius:var(--radius); padding:32px 24px; text-align:center; color:var(--ink-muted); }
  .empty-state .icon{ width:28px; height:28px; color:var(--ink-faint); margin-bottom:10px; }
  .empty-state h3{ font-family:var(--font-display); font-weight:700; font-size:20px; text-transform:uppercase; color:var(--ink); margin-bottom:6px; }
  .suggest-row{ display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:16px; }
  .suggest-chip{ display:flex; align-items:center; gap:7px; background:var(--panel-2); border:1px solid var(--line); border-radius:20px; padding:6px 12px; font-size:12px; color:var(--ink-muted); cursor:pointer; }
  .suggest-chip:hover{ border-color:var(--accent); color:var(--ink); }
  .suggest-chip .icon{ width:14px; height:14px; color:var(--accent); }

  .ctx-header{ display:flex; align-items:center; gap:16px; padding-bottom:18px; margin-bottom:20px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
  .pair-icons{ display:flex; align-items:center; gap:8px; }
  .pair-icon-box{ width:52px; height:52px; border:1px solid var(--line); background:var(--panel); border-radius:var(--radius); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .pair-icon-box .icon{ width:26px; height:26px; color:var(--accent); }
  .pair-x{ color:var(--ink-faint); font-family:var(--font-mono); font-size:14px; }
  .ctx-title{ font-family:var(--font-display); font-weight:800; font-size:26px; text-transform:uppercase; line-height:1.05; text-wrap:balance; }
  .ctx-sub{ font-family:var(--font-mono); font-size:11px; color:var(--ink-faint); text-transform:uppercase; letter-spacing:0.06em; margin-bottom:3px; }

  .hero-action{ display:flex; align-items:center; gap:18px; padding:16px 20px; margin-bottom:20px; border:1px solid var(--accent); border-radius:var(--radius); background:var(--accent-soft); }
  .hero-picto{ width:80px; height:80px; border-radius:50%; background:var(--panel); border:2px solid var(--accent); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .hero-picto svg{ width:46px; height:46px; stroke:var(--accent); fill:none; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }
  .hero-eyebrow{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); margin-bottom:5px; }
  .hero-caption{ font-family:var(--font-display); font-weight:800; font-size:20px; text-transform:uppercase; line-height:1.2; color:var(--ink); margin-bottom:7px; text-wrap:balance; }
  .hero-detail{ font-size:13.5px; color:var(--ink-muted); line-height:1.55; }

  .contact-reminder{ display:flex; align-items:center; gap:13px; padding:13px 16px; margin-bottom:18px; border:1px solid var(--dat-line); border-radius:var(--radius); background:var(--dat-soft); font-size:13.5px; color:var(--ink); line-height:1.5; }
  .contact-reminder .icon{ width:20px; height:20px; color:var(--dat); flex-shrink:0; }
  .contact-reminder strong{ color:var(--dat); }
  .crowd-reminder{ display:flex; align-items:center; gap:13px; padding:13px 16px; margin-bottom:18px; border:1px solid var(--accent-soft); border-radius:var(--radius); background:rgba(224,164,56,0.08); font-size:13.5px; color:var(--ink); line-height:1.5; }
  .crowd-reminder .icon{ width:20px; height:20px; color:var(--accent); flex-shrink:0; }
  .crowd-reminder strong{ color:var(--accent); }

  .speak-bar{ display:flex; margin-bottom:14px; }
  .speak-btn{ display:flex; align-items:center; justify-content:center; gap:11px; width:100%; background:var(--accent); border:1px solid var(--accent); color:var(--ground); padding:14px 17px; border-radius:12px; cursor:pointer; font-size:15px; font-weight:700; font-family:inherit; letter-spacing:0.01em; box-shadow:0 2px 10px rgba(224,164,56,0.25); }
  .speak-btn:hover{ background:#eeb654; border-color:#eeb654; }
  .speak-btn .icon{ width:19px; height:19px; color:var(--ground); flex-shrink:0; }
  .speak-btn.is-speaking{ background:var(--panel-2); border-color:var(--accent); color:var(--accent); box-shadow:none; }
  .speak-btn.is-speaking .icon{ color:var(--accent); animation:pulse-speak 1s ease-in-out infinite; }
  @keyframes pulse-speak{ 0%,100%{ opacity:1; } 50%{ opacity:0.35; } }
  .speak-note{ font-size:12.5px; color:var(--err); line-height:1.5; margin:-6px 0 14px; display:none; }
  .speak-note.is-visible{ display:block; }
  .sound-test-row{ display:flex; justify-content:center; margin:-6px 0 14px; }
  .sound-test-btn{ background:none; border:none; padding:4px 6px; font-size:12px; color:var(--ink-muted); text-decoration:underline; cursor:pointer; font-family:inherit; }
  .sound-test-btn:active{ opacity:0.6; }

  .section-tabs{ display:flex; gap:8px; margin-bottom:16px; flex-wrap:wrap; }
  .section-tab{ display:flex; align-items:center; gap:8px; background:var(--panel); border:1.5px solid var(--line); color:var(--ink-muted); padding:11px 16px; border-radius:11px; cursor:pointer; font-size:13.5px; font-family:inherit; font-weight:600; flex:1 1 auto; justify-content:center; }
  .section-tab .icon{ width:16px; height:16px; flex-shrink:0; }
  .section-tab .count{ font-family:var(--font-mono); font-size:11px; opacity:0.75; }
  .section-tab.tab-err.active{ background:var(--err-soft); border-color:var(--err); color:var(--err); }
  .section-tab.tab-sol.active{ background:var(--sol-soft); border-color:var(--sol); color:var(--sol); }
  .section-tab.tab-dat.active{ background:var(--dat-soft); border-color:var(--dat); color:var(--dat); }
  .section-tab:not(.active):hover{ border-color:var(--ink-faint); color:var(--ink); }

  .panels{ display:flex; flex-direction:column; gap:16px; }
  .panel{ border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); overflow:hidden; }
  .panel-head{ display:flex; align-items:center; gap:9px; padding:12px 16px; border-bottom:1px solid var(--line); }
  .panel-head .icon{ width:15px; height:15px; }
  .panel-head h2{ font-family:var(--font-mono); font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; }
  .panel-head .count{ margin-left:auto; font-family:var(--font-mono); font-size:11px; color:var(--ink-faint); }
  .panel.err .panel-head{ background:var(--err-soft); border-bottom-color:var(--err-line); }
  .panel.err .panel-head .icon,.panel.err .panel-head h2{ color:var(--err); }
  .panel.sol .panel-head{ background:var(--sol-soft); border-bottom-color:var(--sol-line); }
  .panel.sol .panel-head .icon,.panel.sol .panel-head h2{ color:var(--sol); }
  .panel.dat .panel-head{ background:var(--dat-soft); border-bottom-color:var(--dat-line); }
  .panel.dat .panel-head .icon,.panel.dat .panel-head h2{ color:var(--dat); }
  .panel-body{ padding:6px 6px; }
  .row{ display:flex; gap:13px; padding:13px 11px; border-radius:var(--radius); }
  .row + .row{ border-top:1px solid var(--line-soft); }
  .row-num{ font-family:var(--font-mono); font-size:13px; width:20px; flex-shrink:0; padding-top:2px; }
  .panel.err .row-num{ color:var(--err); }
  .panel.sol .row-num{ color:var(--sol); }
  .row-text{ font-size:15px; line-height:1.5; color:var(--ink); }
  .dat-row .row-text{ display:flex; flex-wrap:wrap; column-gap:14px; row-gap:3px; align-items:baseline; }
  .dat-label{ color:var(--ink-muted); }
  .dat-value{ font-family:var(--font-mono); font-weight:600; color:var(--dat); font-variant-numeric:tabular-nums; white-space:nowrap; }
  .edc-tag{ font-family:var(--font-mono); font-size:10px; font-weight:600; color:var(--accent); border:1px solid var(--accent); border-radius:2px; padding:0 4px; margin:0 1px; letter-spacing:0.02em; }
  .disclaimer{ margin-top:22px; padding:12px 14px; border:1px dashed var(--line); border-radius:var(--radius); font-size:11.5px; color:var(--ink-faint); font-family:var(--font-mono); line-height:1.6; }
  footer.page-footer{ margin-top:40px; padding-top:16px; border-top:1px solid var(--line); font-family:var(--font-mono); font-size:10.5px; color:var(--ink-faint); }

  .intro-note{ font-size:13.5px; color:var(--ink-muted); max-width:70ch; margin-bottom:0; }

  /* =================== ACCESS GATE KAPÏ =================== */
  .access-gate{ position:fixed; inset:0; z-index:9999; background:var(--ground); display:flex; align-items:center; justify-content:center; padding:24px; }
  .access-gate.is-unlocked{ display:none; }
  .access-card{ width:100%; max-width:420px; background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:34px 28px; text-align:center; }
  .access-lock-icon{ width:42px; height:42px; margin:0 auto 16px; color:var(--accent); }
  .access-card .brand-mark{ margin-bottom:14px; }
  .access-card h2{ font-family:var(--font-display); font-weight:800; text-transform:uppercase; font-size:22px; margin:0 0 10px; letter-spacing:0.01em; }
  .access-card p{ color:var(--ink-muted); font-size:13px; line-height:1.6; margin:0 0 22px; }
  .access-input{ width:100%; box-sizing:border-box; background:var(--panel-2); border:1px solid var(--line); color:var(--ink); font-family:var(--font-mono); font-size:15px; letter-spacing:0.05em; text-align:center; text-transform:uppercase; padding:13px 14px; border-radius:var(--radius); margin-bottom:14px; }
  .access-input:focus{ border-color:var(--accent); outline:none; }
  .access-submit{ width:100%; background:var(--accent); border:1px solid var(--accent); color:var(--ground); font-weight:700; font-size:14.5px; padding:13px; border-radius:var(--radius); cursor:pointer; font-family:inherit; }
  .access-submit:disabled{ opacity:0.5; cursor:not-allowed; }
  .access-error{ color:var(--err); font-size:12.5px; margin-top:12px; min-height:16px; }
  .access-hint{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink-faint); margin-top:20px; line-height:1.5; }

/* --- Assistant IA (Cloudflare Worker) --- */
.ai-fab{ position:fixed; right:20px; bottom:20px; z-index:60; width:52px; height:52px; border-radius:50%; background:var(--accent); color:#0A0D12; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 6px 18px rgba(0,0,0,0.35); }
.ai-fab .icon{ width:22px; height:22px; }
.ai-fab-dot{ position:absolute; top:4px; right:4px; width:10px; height:10px; border-radius:50%; border:2px solid var(--ground); background:var(--ink-faint); }
.ai-fab-dot.is-online{ background:var(--sol); }
.ai-fab-dot.is-offline{ background:var(--err); }

.ai-panel{ position:fixed; right:20px; bottom:84px; z-index:60; width:min(360px, calc(100vw - 40px)); max-height:min(520px, calc(100vh - 140px)); background:var(--panel); border:1px solid var(--line); border-radius:12px; display:flex; flex-direction:column; box-shadow:0 12px 32px rgba(0,0,0,0.5); overflow:hidden; }
.ai-panel-head{ display:flex; align-items:center; gap:8px; padding:12px 14px; border-bottom:1px solid var(--line); }
.ai-panel-head h3{ font-family:var(--font-display); font-weight:800; font-size:16px; text-transform:uppercase; letter-spacing:0.02em; flex:1; }
.ai-panel-status{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink-faint); }
.ai-panel-close{ background:none; border:none; color:var(--ink-muted); cursor:pointer; font-size:14px; padding:4px 6px; }
.ai-panel-body{ display:flex; flex-direction:column; flex:1; min-height:0; padding:12px 14px; gap:10px; }
.ai-offline-note{ font-family:var(--font-mono); font-size:11px; color:var(--err); background:var(--err-soft); border:1px solid var(--err-line); border-radius:8px; padding:8px 10px; }
.ai-thread{ flex:1; min-height:60px; max-height:280px; overflow-y:auto; display:flex; flex-direction:column; gap:8px; }
.ai-msg{ font-size:13px; line-height:1.5; padding:8px 10px; border-radius:9px; max-width:92%; white-space:pre-wrap; }
.ai-msg-user{ align-self:flex-end; background:var(--accent-soft); color:var(--ink); border:1px solid var(--line); }
.ai-msg-assistant{ align-self:flex-start; background:var(--panel-2); color:var(--ink); border:1px solid var(--line); }
.ai-msg-pending{ color:var(--ink-faint); }
.ai-form{ display:flex; gap:8px; align-items:flex-end; }
.ai-input{ flex:1; resize:none; background:var(--panel-2); border:1px solid var(--line); color:var(--ink); border-radius:8px; padding:8px 10px; font-family:inherit; font-size:13px; }
.ai-input:disabled{ opacity:0.5; }
.ai-send{ background:var(--accent); color:#0A0D12; border:none; border-radius:8px; padding:9px 14px; font-weight:600; font-size:12.5px; cursor:pointer; }
.ai-send:disabled{ opacity:0.4; cursor:not-allowed; }
@media (max-width:480px){
  .ai-panel{ right:10px; left:10px; width:auto; bottom:78px; }
  .ai-fab{ right:14px; bottom:14px; }
}
