/* Ta radio, ta voix · styles communs (site public et espace équipe) */
:root{
  --bg:#EEF6F6; --surface:#FFFFFF; --surface-2:#E3F1F2; --ink:#10212B; --ink-2:#44585F; --ink-3:#62767E; --line:#CFE0E3;
  --lagon:#0E9AA7; --lagon-ink:#0A7580; --lagon-soft:#CCEEF0; --lagon-deep:#0B5F68; --cyan:#7FE1EA;
  --corail:#E8613C; --corail-ink:#B03E1B; --corail-soft:#FFE3D8; --corail-2:#FF9A7A;
  --nuit:#0F2233; --nuit-2:#163447; --nuit-3:#06121A; --sable:#F5EFE3;
  --ok:#1E8A55; --ok-soft:#DDF3E6; --warn:#A86500; --warn-soft:#FFF0D6;
  --series-1:#0E9AA7; --series-2:#E8613C; --track:#DDEBEE;
  --radius:18px; --radius-s:12px; --shadow:0 14px 34px rgba(16,33,43,.10); --shadow-s:0 4px 14px rgba(16,33,43,.08);
  --font-display:"Bricolage Grotesque","Avenir Next Condensed","Arial Narrow",system-ui,sans-serif;
  --font-body:"Figtree","Avenir Next","Segoe UI",Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B1A23; --surface:#122633; --surface-2:#17303F; --ink:#EAF3F5; --ink-2:#B3C5CC; --ink-3:#8FA3AB; --line:#254251;
    --lagon:#2CB8C5; --lagon-ink:#5FD2DD; --lagon-soft:#123D46; --lagon-deep:#8FE3EA;
    --corail:#F5734F; --corail-ink:#FF9375; --corail-soft:#4A2418;
    --ok:#4CC98A; --ok-soft:#133A28; --warn:#F2B35A; --warn-soft:#3D2C10;
    --series-1:#22AEBB; --series-2:#F0704B; --track:#1B3341;
    --shadow:0 14px 34px rgba(0,0,0,.35); --shadow-s:0 4px 14px rgba(0,0,0,.3);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0B1A23; --surface:#122633; --surface-2:#17303F; --ink:#EAF3F5; --ink-2:#B3C5CC; --ink-3:#8FA3AB; --line:#254251;
  --lagon:#2CB8C5; --lagon-ink:#5FD2DD; --lagon-soft:#123D46; --lagon-deep:#8FE3EA;
  --corail:#F5734F; --corail-ink:#FF9375; --corail-soft:#4A2418;
  --ok:#4CC98A; --ok-soft:#133A28; --warn:#F2B35A; --warn-soft:#3D2C10;
  --series-1:#22AEBB; --series-2:#F0704B; --track:#1B3341;
  --shadow:0 14px 34px rgba(0,0,0,.35); --shadow-s:0 4px 14px rgba(0,0,0,.3);
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{min-height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.06;letter-spacing:-.015em;margin:0;text-wrap:balance}
h1{font-size:clamp(2.4rem,7.5vw,4.4rem);font-weight:800}
h2{font-size:clamp(1.5rem,4vw,2.2rem);font-weight:800}
h3{font-size:1.15rem;font-weight:700}
h1:focus,h2:focus{outline:none}
p{margin:0}
a{color:var(--lagon-ink);text-underline-offset:.18em}
img,svg,canvas{max-width:100%}
button{font:inherit;cursor:pointer;color:inherit}
input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--corail);outline-offset:2px}
.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}
.eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--lagon-ink)}
.muted{color:var(--ink-2)}
.tiny{font-size:.82rem;color:var(--ink-3)}
.num{font-variant-numeric:tabular-nums}
.ty{font-family:var(--font-display);font-weight:600;font-style:italic;color:var(--lagon-ink)}
.stack{display:grid;gap:14px}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.spacer{flex:1}
[hidden]{display:none!important}

/* ---------- boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:14px 24px;font-weight:700;font-size:1rem;line-height:1.2;text-decoration:none;transition:transform .16s var(--ease),box-shadow .16s var(--ease),background-color .16s;-webkit-tap-highlight-color:transparent;touch-action:manipulation;white-space:nowrap}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--corail);color:#fff;box-shadow:0 8px 22px rgba(232,97,60,.32)}
.btn-primary:hover{box-shadow:0 10px 26px rgba(232,97,60,.42)}
.btn-dark{background:var(--nuit);color:#fff}
.btn-lagon{background:var(--lagon);color:#fff}
.btn-secondary{background:var(--surface);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn-secondary:hover{box-shadow:inset 0 0 0 1.5px var(--lagon)}
.btn-ghost{background:transparent;color:var(--lagon-ink);padding-inline:10px}
.btn-danger{background:transparent;color:var(--corail-ink);box-shadow:inset 0 0 0 1.5px var(--corail-soft)}
.btn-sm{padding:9px 16px;font-size:.9rem}
.btn-xs{padding:6px 12px;font-size:.8rem}
.btn-xl{font-size:1.3rem;padding:20px 44px}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.btn .spin{width:16px;height:16px;border-radius:50%;border:2.5px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;font-size:.8rem;font-weight:700;background:var(--surface-2);color:var(--ink-2)}
.chip.lagon{background:var(--lagon-soft);color:var(--lagon-ink)}
.chip.corail{background:var(--corail-soft);color:var(--corail-ink)}
.chip.ok{background:var(--ok-soft);color:var(--ok)}
.chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.dark{background:var(--nuit);color:#fff}

/* ---------- formulaires ---------- */
.field{display:grid;gap:6px}
.field>label,.label{font-size:.85rem;font-weight:700;color:var(--ink-2)}
.input,textarea.input,select.input,.field input:not([type=checkbox]):not([type=radio]),.field textarea,.field select{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--surface);color:var(--ink);font-size:1rem;transition:border-color .15s,box-shadow .15s}
.field input:focus,.field textarea:focus,.field select:focus,.input:focus{outline:none;border-color:var(--lagon);box-shadow:0 0 0 4px var(--lagon-soft)}
textarea{min-height:120px;resize:vertical}
.check{display:flex;gap:10px;align-items:flex-start;font-size:.92rem;color:var(--ink-2);cursor:pointer}
.check input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--lagon)}
.err{color:var(--corail-ink);font-size:.9rem;font-weight:600;min-height:1.2em}
.hint{font-size:.82rem;color:var(--ink-3)}

/* ---------- barres de résultats ---------- */
.bars{display:grid;gap:10px}
.brow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 10px;align-items:center;position:relative}
.brow .lbl{font-size:.9rem;color:var(--ink-2);grid-column:1/-1;line-height:1.25;display:flex;justify-content:space-between;gap:8px}
.brow .trk{height:10px;border-radius:5px;background:var(--track);overflow:hidden}
.brow .fill{height:100%;border-radius:5px;background:var(--series-1);width:0;transition:width .7s var(--ease)}
.brow.hot .fill,.brow.alt .fill,.brow.low .fill,.brow.me .fill{background:var(--series-2)}
.brow.me .lbl{color:var(--ink);font-weight:700}
.brow .val{font-size:.88rem;font-weight:700;color:var(--ink);min-width:3.4em;text-align:right}
.brow .raw{font-size:.75rem;color:var(--ink-3);font-weight:600;margin-left:4px}
.brow.na .val{color:var(--ink-3);font-weight:600}
.flag{font-size:.72rem;font-weight:700;color:var(--corail-ink);white-space:nowrap}

/* ---------- tableaux ---------- */
table.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
table.tbl th,table.tbl td{padding:8px 10px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
table.tbl th{font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3)}
table.tbl td.num,table.tbl th.num{text-align:right}

/* ---------- divers ---------- */
.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow)}
.panel{background:var(--surface);border-radius:var(--radius);box-shadow:inset 0 0 0 1px var(--line);padding:18px}
.notice{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;background:var(--surface-2);color:var(--ink-2);font-size:.9rem;line-height:1.45}
.notice.warn{background:var(--warn-soft);color:var(--ink)}
.notice.corail{background:var(--corail-soft);color:var(--ink)}
.notice.ok{background:var(--ok-soft);color:var(--ink)}
.empty{padding:28px;text-align:center;color:var(--ink-3);border:1.5px dashed var(--line);border-radius:var(--radius)}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%) translateY(20px);background:var(--nuit);color:#fff;padding:11px 18px;border-radius:999px;font-size:.92rem;font-weight:600;opacity:0;transition:opacity .25s,transform .25s var(--ease);pointer-events:none;z-index:100;max-width:calc(100vw - 32px);text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.toast.show{opacity:1;transform:translateX(-50%)}
.mark{width:38px;height:38px;border-radius:50%;background:var(--lagon);color:#fff;display:grid;place-items:center;font-size:.74rem;font-weight:800;letter-spacing:-.02em;font-family:var(--font-display);box-shadow:0 0 0 4px var(--lagon-soft);flex:none;overflow:hidden}
.mark img{width:100%;height:100%;object-fit:cover}
.dot{width:10px;height:10px;border-radius:50%;background:var(--corail);flex:none;animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(232,97,60,.55)}100%{box-shadow:0 0 0 12px rgba(232,97,60,0)}}

/* Égaliseur animé : transformations seulement (fluide, sans recalcul de mise en page). */
.wave{display:flex;align-items:flex-end;gap:5px;height:64px}
.wave i{display:block;width:8px;height:100%;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,var(--lagon),var(--lagon-deep));transform-origin:bottom;transform:scaleY(var(--h,.5));animation:eq 1.4s ease-in-out infinite;will-change:transform}
.wave i:nth-child(2n){animation-duration:1.1s;background:linear-gradient(180deg,var(--corail),var(--corail-ink))}
.wave i:nth-child(3n){animation-duration:1.7s}
@keyframes eq{0%,100%{transform:scaleY(.2)}50%{transform:scaleY(var(--h,.9))}}

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