/* Spectra Creators : page /creators et espace CM /creator.
   Direction : sobre et premium. Une seule couleur d'accent, surfaces pleines, filets fins, typographie serrée. */
.scr{
  --bg:#0b0a10; --surface:#121119; --surface-2:#17161f; --field:#0e0d14;
  --line:rgba(255,255,255,.07); --line-2:rgba(255,255,255,.12); --line-3:rgba(255,255,255,.2);
  --text:#f4f3f7; --text-2:#a3a1b0; --text-3:#8a889a;
  --accent:#7c3aed; --accent-hover:#6d28d9; --accent-soft:rgba(124,58,237,.14); --accent-text:#b9a2ff;
  --live:#f43f5e; --ok:#34d399; --warn:#fbbf24; --danger:#fb7185;
  --r:14px; --r-sm:10px;
  --ease:cubic-bezier(.2,.7,.2,1);
  position:relative; color:var(--text); background:var(--bg);
  font-family:var(--sx-font,"Poppins"),system-ui,sans-serif; font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.scr *{ box-sizing:border-box; }
/* La page a ses propres séparateurs (filets) : on neutralise ceux de la boutique */
main.storefront-main.scr > section::after{ content:none; display:none; }
.scr-wrap{ position:relative; width:100%; max-width:1120px; margin:0 auto; padding:0 20px; }
@media (min-width:768px){ .scr-wrap{ padding:0 32px; } }
.scr-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.scr-ic{ flex:none; }
.scr :focus-visible{ outline:2px solid var(--accent-text); outline-offset:2px; }
.scr b{ font-weight:600; color:var(--text); }

/* Apparition discrète au défilement */
.scr-js [data-reveal]{ opacity:0; transform:translateY(12px); transition:opacity .45s var(--ease), transform .45s var(--ease); transition-delay:var(--d,0ms); }
.scr-js [data-reveal].is-in{ opacity:1; transform:none; }

/* Typo */
.scr-eyebrow{ display:inline-flex; align-items:center; gap:10px; margin:0 0 18px; color:var(--text-2); font-size:13px; font-weight:500; letter-spacing:.01em; }
.scr-title{ margin:0; font-size:clamp(2.4rem,5vw,3.6rem); font-weight:600; line-height:1.04; letter-spacing:-.035em; color:var(--text); }
.scr-title span{ display:block; color:var(--text-3); }
.scr-lead{ max-width:520px; margin:24px 0 0; color:var(--text-2); font-size:17px; line-height:1.65; }
.scr-h2{ margin:0; font-size:clamp(1.75rem,3.2vw,2.25rem); font-weight:600; line-height:1.15; letter-spacing:-.03em; }
.scr-h3{ margin:0 0 28px; font-size:13px; font-weight:500; color:var(--text-2); letter-spacing:.01em; }
.scr-rec{ display:inline-block; width:7px; height:7px; flex:none; border-radius:50%; background:var(--live); box-shadow:0 0 0 3px rgba(244,63,94,.16); animation:scr-pulse 2s ease-in-out infinite; }
@keyframes scr-pulse{ 50%{ box-shadow:0 0 0 6px rgba(244,63,94,0); } }

/* Boutons */
.scr-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 18px; border-radius:var(--r-sm); border:1px solid transparent; font:inherit; font-size:14.5px; font-weight:500; line-height:1; text-decoration:none; cursor:pointer; white-space:nowrap; transition:background-color .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease), transform .18s var(--ease); }
.scr-btn:active{ transform:translateY(1px); }
.scr-btn--primary{ background:var(--accent); color:#fff; box-shadow:inset 0 1px 0 rgba(255,255,255,.14); }
.scr-btn--primary:hover{ background:var(--accent-hover); color:#fff; }
.scr-btn--ghost{ background:transparent; color:var(--text); border-color:var(--line-2); }
.scr-btn--ghost:hover{ border-color:var(--line-3); background:rgba(255,255,255,.03); color:var(--text); }
.scr-btn[disabled]{ opacity:.55; cursor:not-allowed; transform:none; }
.scr-btn .scr-ic{ transition:transform .18s var(--ease); }
.scr-btn:hover .scr-ic{ transform:translateX(2px); }
.scr-link{ display:inline-flex; align-items:center; gap:6px; color:var(--text-2); font-size:14.5px; font-weight:500; text-decoration:none; transition:color .18s var(--ease); }
.scr-link:hover{ color:var(--text); }
.scr-link .scr-ic{ transition:transform .18s var(--ease); }
.scr-link:hover .scr-ic{ transform:translateX(2px); }
.scr-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; margin-top:32px; }

/* ─── Hero ─────────────────────────────────────────────────────────────────── */
.scr-hero{ position:relative; padding:72px 0 88px; border-bottom:1px solid var(--line); overflow:hidden; }
.scr-hero::before{ content:""; position:absolute; inset:-30% -10% auto 30%; height:520px; background:radial-gradient(closest-side,rgba(124,58,237,.13),transparent); pointer-events:none; }
@media (min-width:1024px){ .scr-hero{ padding:112px 0 120px; } }
.scr-hero-grid{ display:grid; gap:56px; align-items:center; }
@media (min-width:960px){ .scr-hero-grid{ grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:64px; } }

/* Fiche « Mesuré automatiquement » */
.scr-spec{ position:relative; border:1px solid var(--line-2); border-radius:var(--r); background:var(--surface); box-shadow:0 24px 60px -32px rgba(0,0,0,.7); }
.scr-spec-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid var(--line); }
.scr-spec-head p{ margin:0; font-size:13.5px; font-weight:600; }
.scr-spec-live{ display:inline-flex; align-items:center; gap:8px; color:var(--text-2); font-size:12.5px; font-weight:500; }
.scr-spec-list{ margin:0; padding:4px 20px; }
.scr-spec-list > div{ padding:16px 0; border-top:1px solid var(--line); }
.scr-spec-list > div:first-child{ border-top:0; }
.scr-spec-list dt{ display:flex; align-items:center; gap:10px; font-size:14.5px; font-weight:600; }
.scr-spec-list dt .scr-ic{ color:var(--accent-text); }
.scr-spec-list dd{ margin:4px 0 0 26px; color:var(--text-2); font-size:13.5px; line-height:1.55; }
.scr-spec-foot{ margin:0; padding:14px 20px; border-top:1px solid var(--line); color:var(--text-3); font-size:12.5px; }

/* ─── Comment ça marche ────────────────────────────────────────────────────── */
.scr-how{ padding:72px 0; border-bottom:1px solid var(--line); }
.scr-how-grid{ list-style:none; margin:0; padding:0; display:grid; gap:32px; }
@media (min-width:768px){ .scr-how-grid{ grid-template-columns:repeat(3,1fr); gap:40px; } }
.scr-how-grid li{ padding-top:20px; border-top:1px solid var(--line-2); }
.scr-how-n{ display:block; margin-bottom:14px; color:var(--accent-text); font-size:13px; font-weight:600; font-variant-numeric:tabular-nums; }
.scr-how-grid h3{ margin:0 0 6px; font-size:17px; font-weight:600; letter-spacing:-.01em; }
.scr-how-grid p{ margin:0; color:var(--text-2); font-size:14.5px; line-height:1.6; }

/* ─── Candidature ──────────────────────────────────────────────────────────── */
.scr-apply{ padding:80px 0 112px; scroll-margin-top:72px; }
.scr-section-head{ max-width:620px; margin-bottom:40px; }
.scr-section-head .scr-eyebrow{ margin-bottom:12px; }
.scr-section-d{ margin:12px 0 0; color:var(--text-2); font-size:15.5px; }
.scr-apply-grid{ display:grid; gap:32px; align-items:start; }
@media (min-width:1000px){ .scr-apply-grid{ grid-template-columns:minmax(0,1fr) 300px; gap:48px; } }
.scr-apply-main{ min-width:0; }

.scr-panel{ position:relative; border:1px solid var(--line-2); border-radius:var(--r); background:var(--surface); padding:24px; }
@media (min-width:640px){ .scr-panel{ padding:32px; } }
.scr-panel-t{ margin:16px 0 8px; font-size:20px; font-weight:600; letter-spacing:-.02em; }
.scr-panel-d{ max-width:520px; margin:0; color:var(--text-2); }
.scr-state .scr-actions{ margin-top:24px; }

.scr-tag{ display:inline-flex; align-items:center; gap:8px; height:26px; padding:0 10px; border-radius:999px; border:1px solid var(--line-2); color:var(--text-2); font-size:12.5px; font-weight:500; }
.scr-tag-dot{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.scr-tag--ok{ color:var(--ok); border-color:rgba(52,211,153,.3); }
.scr-tag--wait{ color:var(--warn); border-color:rgba(251,191,36,.3); }
.scr-tag--no{ color:var(--danger); border-color:rgba(251,113,133,.3); }

/* Notes latérales */
.scr-notes{ padding-top:4px; }
@media (min-width:1000px){ .scr-notes{ position:sticky; top:96px; } }
.scr-notes h3{ margin:0 0 4px; font-size:13px; font-weight:500; color:var(--text-2); }
.scr-notes ul{ list-style:none; margin:0; padding:0; }
.scr-notes li{ display:flex; gap:12px; padding:16px 0; border-bottom:1px solid var(--line); }
.scr-notes li .scr-ic{ margin-top:3px; color:var(--accent-text); }
.scr-notes li b{ display:block; font-size:14.5px; }
.scr-notes li span{ display:block; margin-top:2px; color:var(--text-2); font-size:13.5px; line-height:1.55; }
.scr-notes-foot{ margin:16px 0 0; color:var(--text-3); font-size:13px; }

/* Étapes */
.scr-steps{ list-style:none; margin:0 0 32px; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.scr-steps li{ min-width:0; }
.scr-steps-bar{ display:block; height:3px; border-radius:3px; background:var(--line-2); overflow:hidden; position:relative; }
.scr-steps-bar::after{ content:""; position:absolute; inset:0; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .45s var(--ease); }
.scr-steps li.is-active .scr-steps-bar::after, .scr-steps li.is-done .scr-steps-bar::after{ transform:scaleX(1); }
.scr-steps li.is-done .scr-steps-bar::after{ background:var(--accent-hover); }
.scr-steps-l{ display:flex; gap:8px; margin-top:10px; color:var(--text-3); font-size:13px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:color .2s var(--ease); }
.scr-steps-l b{ color:inherit; font-weight:600; font-variant-numeric:tabular-nums; }
.scr-steps li.is-active .scr-steps-l, .scr-steps li.is-done .scr-steps-l{ color:var(--text); }

.scr-step{ margin:0; padding:0; border:0; min-width:0; }
.scr-step.is-entering{ animation:scr-step-in .35s var(--ease) both; }
@keyframes scr-step-in{ from{ opacity:0; transform:translateY(6px); } }
.scr-legend{ float:left; width:100%; padding:0; margin:0; font-size:18px; font-weight:600; letter-spacing:-.02em; }
.scr-legend + .scr-legend-d{ clear:both; }
.scr-legend-d{ margin:4px 0 24px; color:var(--text-2); font-size:14px; }

.scr-grid2{ display:grid; gap:0 16px; }
@media (min-width:640px){ .scr-grid2{ grid-template-columns:1fr 1fr; } }
.scr-field{ margin-bottom:20px; min-width:0; }
.scr-label{ display:block; margin-bottom:8px; font-size:13.5px; font-weight:500; color:var(--text); }
.scr .scr-input{ display:block; width:100%; min-height:46px; padding:11px 14px; border-radius:var(--r-sm); background:var(--field); border:1px solid var(--line-2); color:var(--text); font:inherit; font-size:15px; line-height:1.4; box-shadow:none; transition:border-color .15s var(--ease), box-shadow .15s var(--ease), background-color .15s var(--ease); }
.scr .scr-input::placeholder{ color:#5f5d6e; }
.scr .scr-input:hover{ border-color:var(--line-3); }
.scr .scr-input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); background:var(--field); }
.scr .scr-input[readonly]{ color:var(--text-2); background:transparent; cursor:default; }
.scr .scr-input[readonly]:hover{ border-color:var(--line-2); }
.scr .scr-input[aria-invalid="true"]{ border-color:var(--danger); box-shadow:0 0 0 3px rgba(251,113,133,.12); }
.scr select.scr-input{ appearance:none; -webkit-appearance:none; padding-right:40px; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23a3a1b0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; }
.scr select.scr-input option{ background:#17161f; color:var(--text); }
.scr .scr-area{ min-height:120px; resize:vertical; line-height:1.6; }
.scr input[type=number]::-webkit-inner-spin-button, .scr input[type=number]::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; }
.scr input[type=number]{ -moz-appearance:textfield; }
.scr-at{ position:relative; }
.scr-at > span{ position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--text-3); pointer-events:none; }
.scr .scr-at .scr-input{ padding-left:30px; }
.scr-help{ margin:8px 0 0; color:var(--text-3); font-size:12.5px; font-variant-numeric:tabular-nums; }
.scr-help .is-ok{ color:var(--ok); }
.scr-err{ margin:8px 0 0; color:var(--danger); font-size:13px; }

/* Dépôt de capture */
.scr-drop{ position:relative; display:block; border-radius:var(--r-sm); border:1px dashed var(--line-3); background:var(--field); cursor:pointer; overflow:hidden; transition:border-color .15s var(--ease), background-color .15s var(--ease); }
.scr-drop:hover, .scr-drop.is-over{ border-color:var(--accent); background:rgba(124,58,237,.05); }
.scr-drop:focus-within{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.scr-drop.is-invalid{ border-color:var(--danger); }
.scr-drop-empty, .scr-drop-full{ display:flex; align-items:center; gap:14px; padding:14px; }
.scr-drop-empty[hidden], .scr-drop-full[hidden], .scr-drop-bar[hidden]{ display:none; }
.scr-drop-ic{ display:grid; place-items:center; width:40px; height:40px; flex:none; border-radius:var(--r-sm); border:1px solid var(--line-2); color:var(--text-2); }
.scr-drop-txt{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.scr-drop-txt b{ font-size:14px; font-weight:500; }
.scr-drop-txt > span{ color:var(--text-3); font-size:12.5px; }
.scr-drop-cta{ flex:none; padding:7px 12px; border-radius:8px; border:1px solid var(--line-2); color:var(--text); font-size:13px; font-weight:500; }
.scr-drop:hover .scr-drop-cta{ border-color:var(--line-3); }
@media (max-width:480px){ .scr-drop-cta{ display:none; } }
.scr-drop-full img{ width:40px; height:56px; flex:none; object-fit:cover; border-radius:6px; border:1px solid var(--line-2); }
.scr-drop-ok{ display:inline-flex; align-items:center; gap:6px; color:var(--ok) !important; }
.scr-drop.is-busy .scr-drop-ok{ color:var(--text-2) !important; }
.scr-drop-bar{ position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--line); }
.scr-drop-bar span{ display:block; height:100%; width:0; background:var(--accent); transition:width .2s linear; }

.scr-alert{ margin:0 0 16px; padding:12px 14px; border-radius:var(--r-sm); border:1px solid rgba(251,113,133,.3); background:rgba(251,113,133,.06); color:#fecdd3; font-size:14px; }
.scr-form-foot{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:12px; padding-top:20px; border-top:1px solid var(--line); }
.scr-form-foot [hidden]{ display:none; }
.scr-nav-note{ flex:1; min-width:120px; color:var(--text-3); font-size:12.5px; transition:color .2s var(--ease); }
.scr-nav-note.is-saved{ color:var(--text-2); }
.scr-form-foot [data-next], .scr-form-foot [data-submit]{ margin-left:auto; }

.scr-success:focus{ outline:none; }
.scr-success-ring{ display:block; width:48px; height:48px; }
.scr-success-ring circle{ fill:none; stroke:rgba(52,211,153,.35); stroke-width:2; }
.scr-success-ring path{ fill:none; stroke:var(--ok); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:32; stroke-dashoffset:32; animation:scr-draw .5s var(--ease) .15s forwards; }
@keyframes scr-draw{ to{ stroke-dashoffset:0; } }

/* ─── Espace CM ────────────────────────────────────────────────────────────── */
.scr-cm{ padding:40px 0 96px; }
.scr-cm-grid{ display:grid; gap:24px; align-items:start; }
@media (min-width:960px){ .scr-cm-grid{ grid-template-columns:220px minmax(0,1fr); gap:48px; } }
.scr-side{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; padding:4px; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--surface); }
@media (min-width:960px){ .scr-side{ display:flex; flex-direction:column; gap:2px; padding:0; border:0; background:none; position:sticky; top:96px; } }
.scr-side-me{ display:none; }
@media (min-width:960px){ .scr-side-me{ display:flex; align-items:center; gap:12px; padding:0 0 20px; margin-bottom:12px; border-bottom:1px solid var(--line); } }
.scr-side-me p{ margin:0; font-weight:600; font-size:14.5px; }
.scr-side-me span{ color:var(--text-3); font-size:12.5px; }
.scr-avatar{ display:inline-grid; place-items:center; width:40px; height:40px; flex:none; border-radius:10px; background:var(--surface-2); border:1px solid var(--line-2); color:var(--text); font-weight:600; font-size:15px; }
.scr-side a{ display:flex; align-items:center; gap:10px; min-height:40px; padding:0 12px; border-radius:8px; color:var(--text-2); text-decoration:none; font-weight:500; font-size:14px; white-space:nowrap; transition:background-color .15s var(--ease), color .15s var(--ease); }
.scr-side a:hover{ background:rgba(255,255,255,.04); color:var(--text); }
.scr-side a[aria-current="page"]{ background:var(--surface-2); color:var(--text); box-shadow:inset 0 0 0 1px var(--line-2); }
@media (max-width:959px){ .scr-side a{ justify-content:center; gap:6px; padding:0 6px; font-size:13px; } .scr-side a span{ overflow:hidden; text-overflow:ellipsis; } }
@media (max-width:380px){ .scr-side a .scr-ic{ display:none; } }
.scr-cm-main{ min-width:0; display:flex; flex-direction:column; gap:20px; }
.scr-cm-head{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:4px; }
.scr-cm-head .scr-eyebrow{ margin-bottom:8px; }
.scr-cm-title{ margin:0; font-size:clamp(1.75rem,3.6vw,2.25rem); font-weight:600; line-height:1.15; letter-spacing:-.03em; }
.scr-cm-sub{ margin:6px 0 0; color:var(--text-2); font-size:14px; }
.scr-livebox{ display:inline-flex; align-items:center; gap:10px; min-height:38px; padding:0 14px; border-radius:999px; border:1px solid var(--line-2); color:var(--text-2); font-size:13.5px; font-weight:500; transition:border-color .3s var(--ease), color .3s var(--ease); }
.scr-livebox-dot{ width:7px; height:7px; border-radius:50%; background:var(--text-3); }
.scr-livebox.is-live{ border-color:rgba(244,63,94,.4); color:var(--text); }
.scr-livebox.is-live .scr-livebox-dot{ background:var(--live); box-shadow:0 0 0 3px rgba(244,63,94,.16); animation:scr-pulse 2s ease-in-out infinite; }
.scr-livebox.is-live [data-live-label]{ font-weight:600; letter-spacing:.04em; }
.scr-livebox-v{ display:inline-flex; align-items:center; gap:5px; color:var(--text-2); font-variant-numeric:tabular-nums; }
.scr-livebox-v[hidden]{ display:none; }

.scr-tabs{ position:relative; display:inline-flex; align-self:flex-start; max-width:100%; padding:3px; border-radius:var(--r-sm); border:1px solid var(--line-2); background:var(--surface); overflow-x:auto; scrollbar-width:none; }
.scr-tabs::-webkit-scrollbar{ display:none; }
.scr-tabs button{ position:relative; z-index:1; min-height:36px; padding:0 14px; border:0; border-radius:7px; background:none; color:var(--text-2); font:inherit; font-size:13.5px; font-weight:500; white-space:nowrap; cursor:pointer; transition:color .2s var(--ease); }
.scr-tabs button:hover{ color:var(--text); }
.scr-tabs button[aria-pressed="true"]{ color:var(--text); }
.scr-tabs-ink{ position:absolute; z-index:0; top:3px; bottom:3px; left:0; width:0; border-radius:7px; background:var(--surface-2); box-shadow:inset 0 0 0 1px var(--line-2); transition:transform .35s var(--ease), width .35s var(--ease); }

.scr-kpis{ display:grid; border:1px solid var(--line-2); border-radius:var(--r); background:var(--surface); }
@media (min-width:640px){ .scr-kpis{ grid-template-columns:repeat(3,1fr); } }
.scr-kpi{ padding:20px 24px; border-top:1px solid var(--line); }
.scr-kpi:first-child{ border-top:0; }
@media (min-width:640px){ .scr-kpi{ border-top:0; border-left:1px solid var(--line); } .scr-kpi:first-child{ border-left:0; } }
.scr-kpi-ic{ display:none; }
.scr-kpi-t{ display:flex; align-items:center; gap:8px; margin:0 0 10px; color:var(--text-2); font-size:13.5px; font-weight:500; }
.scr-kpi-v{ margin:0; font-size:32px; font-weight:600; line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.scr-kpi-v small{ margin-left:4px; font-size:15px; font-weight:500; color:var(--text-3); letter-spacing:0; }
.scr-card, .scr-board, .scr-livenow{ position:relative; padding:20px 24px; border:1px solid var(--line-2); border-radius:var(--r); background:var(--surface); min-width:0; }
.scr-card-head h2, .scr-board h2{ display:flex; align-items:center; gap:8px; margin:0 0 16px; font-size:14.5px; font-weight:600; }
.scr-board h2 .scr-ic{ color:var(--text-3); }
.scr-spark{ display:block; width:100%; height:90px; }
.scr-spark path:first-of-type{ opacity:.6; }
.scr-js .scr-spark{ animation:scr-wipe 1s var(--ease) .15s both; }
@keyframes scr-wipe{ from{ clip-path:inset(0 100% 0 0); } to{ clip-path:inset(0 0 0 0); } }
.scr-sessions{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.scr-sessions li{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; padding:12px 0; border-top:1px solid var(--line); color:var(--text-2); font-size:13.5px; font-variant-numeric:tabular-nums; }
.scr-sessions li:first-child{ border-top:0; padding-top:0; }
.scr-sessions li > span{ display:inline-flex; align-items:center; gap:6px; }
.scr-sessions .scr-ic{ color:var(--text-3); }
.scr-ses-date{ min-width:64px; color:var(--text); font-weight:500; }
.scr-empty{ margin:0; color:var(--text-2); font-size:14px; line-height:1.6; }
.scr-dl{ margin:0; }
.scr-dl > div{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px 16px; padding:14px 0; border-top:1px solid var(--line); }
.scr-dl > div:first-child{ border-top:0; padding-top:0; }
.scr-dl dt{ color:var(--text-2); font-size:14px; }
.scr-dl dd{ margin:0; font-weight:500; font-size:14px; display:inline-flex; gap:12px; align-items:center; }
.scr-card .scr-help{ margin-top:16px; }

/* Leaderboard */
.scr-livenow[hidden]{ display:none; }
.scr-livenow-t{ display:flex; align-items:center; gap:10px; margin:0 0 14px; font-size:14.5px; font-weight:600; }
.scr-livenow-list{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; }
.scr-livenow-list::-webkit-scrollbar{ display:none; }
.scr-livechip{ display:inline-flex; align-items:center; gap:10px; flex:none; min-height:44px; padding:6px 14px 6px 6px; border-radius:var(--r-sm); border:1px solid var(--line-2); color:var(--text); text-decoration:none; font-size:13.5px; transition:border-color .15s var(--ease); }
.scr-livechip:hover{ border-color:rgba(244,63,94,.5); }
.scr-livechip .scr-avatar{ width:32px; height:32px; border-radius:8px; font-size:13px; }
.scr-livechip b{ display:inline-flex; align-items:center; gap:4px; color:var(--text-2); font-weight:500; font-variant-numeric:tabular-nums; }
.scr-boards{ display:grid; gap:16px; }
@media (min-width:1180px){ .scr-boards{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.scr-podium{ display:grid; grid-template-columns:1fr 1fr 1fr; align-items:end; gap:8px; margin:0 0 16px; padding-bottom:16px; border-bottom:1px solid var(--line); }
.scr-pod{ display:flex; flex-direction:column; align-items:center; gap:6px; min-width:0; text-align:center; }
.scr-pod.is-void{ opacity:.35; }
.scr-pod .scr-avatar{ width:40px; height:40px; }
.scr-pod-1 .scr-avatar{ width:48px; height:48px; border-color:rgba(251,191,36,.55); }
.scr-pod-2 .scr-avatar{ border-color:rgba(203,213,225,.45); }
.scr-pod-3 .scr-avatar{ border-color:rgba(217,119,6,.5); }
.scr-pod-name{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12.5px; font-weight:500; }
.scr-pod-val{ font-size:13px; color:var(--text-2); font-variant-numeric:tabular-nums; }
.scr-pod-bar{ width:100%; border-radius:6px 6px 0 0; display:grid; place-items:start center; padding-top:6px; background:var(--surface-2); border:1px solid var(--line); border-bottom:0; color:var(--text-3); font-size:12px; font-weight:600; transform-origin:bottom; animation:scr-rise .6s var(--ease) both; }
.scr-pod-1 .scr-pod-bar{ height:56px; color:#fbbf24; animation-delay:.2s; }
.scr-pod-2 .scr-pod-bar{ height:40px; animation-delay:.1s; }
.scr-pod-3 .scr-pod-bar{ height:28px; animation-delay:.3s; }
@keyframes scr-rise{ from{ transform:scaleY(0); } }
.scr-pod.is-me .scr-pod-name{ color:var(--accent-text); }
.scr-rank{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.scr-rank li{ display:grid; grid-template-columns:24px 32px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:48px; padding:6px 8px; border-radius:8px; font-size:13.5px; font-variant-numeric:tabular-nums; }
.scr-rank li .scr-avatar{ width:32px; height:32px; border-radius:8px; font-size:13px; }
.scr-rank-pos{ color:var(--text-3); font-size:13px; text-align:center; }
.scr-rank-name{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:500; }
.scr-rank-name span{ display:block; overflow:hidden; text-overflow:ellipsis; color:var(--text-3); font-size:12px; font-weight:400; }
.scr-rank-val{ font-weight:600; }
.scr-rank li.is-me{ background:var(--accent-soft); box-shadow:inset 0 0 0 1px rgba(124,58,237,.35); }
.scr-rank li.is-gap{ display:flex; justify-content:center; min-height:16px; padding:0; color:var(--text-3); }
.scr-rank-empty{ padding:12px 4px; color:var(--text-3); font-size:13px; }
.scr-board-foot{ display:flex; align-items:center; gap:8px; margin:0; color:var(--text-3); font-size:12.5px; }

@media (prefers-reduced-motion:reduce){
  .scr *, .scr *::before, .scr *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .scr-js [data-reveal]{ opacity:1; transform:none; }
}

/* ─── Liste déroulante sur mesure (pays avec drapeaux, cheats) ─────────────── */
.scr-pick{ position:relative; }
.scr .scr-pick-btn{ display:flex; align-items:center; gap:10px; text-align:left; cursor:pointer; }
.scr-pick-btn > .scr-ic{ margin-left:auto; color:var(--text-3); transition:transform .2s var(--ease); }
.scr-pick.is-open .scr-pick-btn > .scr-ic{ transform:rotate(180deg); }
.scr-pick.is-open .scr .scr-pick-btn, .scr-pick.is-open .scr-pick-btn{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.scr-pick-val{ display:flex; align-items:center; gap:10px; min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.scr-pick-val.is-ph{ color:#5f5d6e; }
.scr-pick-val > .scr-pick-o, .scr-pick-val > span:last-child{ overflow:hidden; text-overflow:ellipsis; }
.scr-pick-list{ position:absolute; z-index:30; left:0; right:0; top:calc(100% + 6px); max-height:296px; overflow-y:auto; margin:0; padding:6px; list-style:none; border:1px solid var(--line-2); border-radius:var(--r-sm); background:#16151e; box-shadow:0 24px 48px -16px rgba(0,0,0,.75), 0 0 0 1px rgba(0,0,0,.4); outline:none; transform-origin:top center; animation:scr-pop .16s var(--ease); scrollbar-width:thin; scrollbar-color:var(--line-2) transparent; }
@keyframes scr-pop{ from{ opacity:0; transform:translateY(-4px) scale(.98); } }
.scr-pick-list li{ display:flex; align-items:center; gap:10px; min-height:40px; padding:0 10px; border-radius:7px; color:var(--text-2); font-size:14.5px; cursor:pointer; user-select:none; }
.scr-pick-list li.is-active{ background:rgba(255,255,255,.05); color:var(--text); }
.scr-pick-list li[aria-selected="true"]{ color:var(--text); }
.scr-pick-list li > .scr-ic{ margin-left:auto; color:var(--accent-text); opacity:0; transform:scale(.6); transition:opacity .15s, transform .15s var(--ease); }
.scr-pick-list li[aria-selected="true"] > .scr-ic{ opacity:1; transform:none; }
.scr-pick-o{ display:flex; align-items:center; gap:10px; min-width:0; }
.scr-pick-o > span:last-child{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.scr-flag{ display:inline-flex; flex:none; width:22px; height:15px; border-radius:3px; overflow:hidden; box-shadow:0 0 0 1px rgba(255,255,255,.14); }
.scr-flag svg{ display:block; width:100%; height:100%; }
.scr-flag--globe{ align-items:center; justify-content:center; box-shadow:none; color:var(--text-3); }
.scr-pick-thumb{ display:inline-grid; place-items:center; flex:none; width:22px; height:22px; border-radius:6px; overflow:hidden; background:var(--surface-2); box-shadow:0 0 0 1px var(--line-2); color:var(--text-3); }
.scr-pick-thumb img{ width:100%; height:100%; object-fit:cover; }

/* ─── Captures multiples ───────────────────────────────────────────────────── */
.scr-label-count{ margin-left:6px; color:var(--text-3); font-weight:400; font-variant-numeric:tabular-nums; }
.scr-shots{ border-radius:var(--r-sm); transition:box-shadow .2s var(--ease); }
.scr-shots.is-over .scr-drop{ border-color:var(--accent); background:rgba(124,58,237,.06); }
.scr-shots.is-invalid .scr-drop{ border-color:var(--danger); }
.scr-shots-list{ list-style:none; margin:0; padding:0; display:none; }
.scr-shots.has-shots{ display:flex; flex-wrap:wrap; gap:10px; }
.scr-shots.has-shots .scr-shots-list{ display:contents; }
.scr-drop[hidden]{ display:none; }
.scr-drop-add{ display:none; }
.scr-shots.has-shots .scr-drop{ width:88px; height:124px; flex:none; }
.scr-shots.has-shots .scr-drop-empty{ display:none; }
.scr-shots.has-shots .scr-drop-add{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; height:100%; color:var(--text-2); font-size:12.5px; font-weight:500; animation:scr-shot-in .35s var(--ease) both; }
.scr-shots.has-shots .scr-drop:hover .scr-drop-add{ color:var(--text); }

.scr-shot{ position:relative; width:88px; height:124px; flex:none; border-radius:var(--r-sm); overflow:hidden; background:var(--field); box-shadow:0 0 0 1px var(--line-2); animation:scr-shot-in .45s cubic-bezier(.2,1.3,.4,1) both; }
@keyframes scr-shot-in{ from{ opacity:0; transform:translateY(8px) scale(.86); filter:blur(4px); } }
.scr-shot img{ display:block; width:100%; height:100%; object-fit:cover; transition:filter .4s var(--ease), transform .6s var(--ease); }
.scr-shot.is-uploading img{ filter:brightness(.45) saturate(.6); transform:scale(1.04); }
.scr-shot-ring{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; transition:opacity .3s var(--ease), transform .3s var(--ease); }
.scr-shot-ring svg{ width:34px; height:34px; transform:rotate(-90deg); }
.scr-shot-ring circle{ fill:none; stroke:rgba(255,255,255,.18); stroke-width:3; }
.scr-shot-ring .scr-shot-fg{ stroke:#fff; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:100; transition:stroke-dashoffset .25s linear; }
.scr-shot:not(.is-uploading) .scr-shot-ring{ opacity:0; transform:scale(1.25); }
.scr-shot-ok{ position:absolute; left:6px; bottom:6px; display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--ok); color:#06281c; opacity:0; transform:scale(0); }
.scr-shot.is-done .scr-shot-ok{ animation:scr-ok-pop .45s cubic-bezier(.2,1.6,.4,1) .1s forwards; }
@keyframes scr-ok-pop{ to{ opacity:1; transform:scale(1); } }
.scr-shot.is-done::after{ content:""; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%); transform:translateX(-120%); animation:scr-shine .8s var(--ease) .05s; pointer-events:none; }
@keyframes scr-shine{ to{ transform:translateX(120%); } }
.scr-shot-x{ position:absolute; top:6px; right:6px; display:grid; place-items:center; width:24px; height:24px; padding:0; border:0; border-radius:50%; background:rgba(10,9,14,.72); color:#fff; cursor:pointer; opacity:0; transition:opacity .15s var(--ease), background-color .15s; backdrop-filter:blur(6px); }
.scr-shot:hover .scr-shot-x, .scr-shot-x:focus-visible{ opacity:1; }
@media (hover:none){ .scr-shot-x{ opacity:1; } }
.scr-shot-x:hover{ background:rgba(244,63,94,.85); }
.scr-shot.is-error{ box-shadow:0 0 0 1px var(--danger); animation:scr-shake .4s ease; }
@keyframes scr-shake{ 20%,60%{ transform:translateX(-4px); } 40%,80%{ transform:translateX(4px); } }
.scr-shot.is-leaving{ animation:scr-shot-out .22s var(--ease) forwards; }
@keyframes scr-shot-out{ to{ opacity:0; transform:scale(.86); } }
@media (prefers-reduced-motion:reduce){ .scr-shot.is-done::after{ display:none; } }

/* ─── Pass de combat ───────────────────────────────────────────────────────── */
.scr-side{ grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:480px){ .scr-side a .scr-ic{ display:none; } .scr-side a{ font-size:12.5px; padding:0 4px; } }
.scr-pass-score{ display:inline-flex; align-items:baseline; gap:6px; padding:8px 14px; border:1px solid var(--line-2); border-radius:999px; color:var(--text-2); font-size:13.5px; font-variant-numeric:tabular-nums; }
.scr-pass-score b{ font-size:16px; color:var(--text); }
.scr-card-sub{ margin:-6px 0 16px; color:var(--text-2); font-size:13.5px; }
.scr-btn--sm{ min-height:36px; padding:0 14px; font-size:13.5px; }
.scr-spinner{ width:16px; height:16px; border-radius:50%; border:2px solid rgba(255,255,255,.3); border-top-color:#fff; animation:scr-spin .7s linear infinite; }
@keyframes scr-spin{ to{ transform:rotate(1turn); } }

.scr-track-head{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px 16px; margin-bottom:18px; }
.scr-track-head h2{ display:flex; align-items:center; gap:8px; margin:0; font-size:14.5px; font-weight:600; }
.scr-track-head h2 .scr-ic{ color:var(--text-3); }
.scr-track-head p{ margin:0; color:var(--text-2); font-size:13.5px; }
.scr-track-head p b{ font-size:16px; font-variant-numeric:tabular-nums; }
.scr-track-bar{ position:relative; height:6px; margin:0 7px; border-radius:6px; background:var(--line-2); }
.scr-track-fill{ position:absolute; left:0; top:0; bottom:0; width:var(--p); border-radius:6px; background:var(--accent); animation:scr-fill 1s var(--ease) .15s both; }
@keyframes scr-fill{ from{ width:0; } }
.scr-track-node{ position:absolute; top:50%; left:var(--x); width:14px; height:14px; border-radius:50%; background:var(--surface); border:2px solid var(--line-3); transform:translate(-50%,-50%); }
.scr-track-node.is-reached{ background:var(--accent); border-color:#a78bfa; box-shadow:0 0 0 4px var(--accent-soft); }
.scr-tiers{ list-style:none; margin:22px 0 0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:10px; }
.scr-tier{ position:relative; display:flex; flex-direction:column; padding:14px; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--field); transition:border-color .3s var(--ease), background-color .3s var(--ease); }
.scr-tier p{ margin:0; }
.scr-tier-goal{ color:var(--text-3); font-size:12.5px; font-weight:500; font-variant-numeric:tabular-nums; }
.scr-tier .scr-tier-reward{ margin-top:6px; font-size:22px; font-weight:600; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.scr-tier .scr-tier-title{ margin-top:2px; font-size:13.5px; font-weight:500; }
.scr-tier .scr-tier-meta{ margin-top:2px; color:var(--text-3); font-size:12px; line-height:1.45; }
.scr-tier-act{ margin-top:auto; padding-top:14px; }
.scr-tier-act .scr-btn{ width:100%; }
.scr-tier .scr-tier-left{ display:flex; align-items:center; gap:6px; margin-top:auto; padding-top:12px; border-top:1px solid var(--line); color:var(--text-3); font-size:12.5px; }
.scr-tier .scr-tier-meta + .scr-tier-left{ margin-top:14px; }
.scr-tier.is-locked .scr-tier-reward, .scr-tier.is-locked .scr-tier-title{ color:var(--text-2); }
.scr-tier.is-ready{ border-color:rgba(124,58,237,.6); background:linear-gradient(180deg,rgba(124,58,237,.10),var(--field)); }
.scr-tier.is-ready .scr-tier-goal{ color:var(--accent-text); }
.scr-tier.is-claimed{ border-color:rgba(52,211,153,.35); }
.scr-tier.is-claimed .scr-tier-goal{ color:var(--ok); }
.scr-tier.is-just-claimed{ animation:scr-claimed .9s var(--ease); }
@keyframes scr-claimed{ 0%{ box-shadow:0 0 0 0 rgba(52,211,153,.45); } 100%{ box-shadow:0 0 0 14px rgba(52,211,153,0); } }

.scr-code{ display:inline-flex; align-items:center; gap:4px; max-width:100%; padding:4px 4px 4px 12px; border:1px dashed rgba(52,211,153,.45); border-radius:8px; background:rgba(52,211,153,.06); }
.scr-tier-act .scr-code{ width:100%; justify-content:space-between; }
.scr-code code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13.5px; font-weight:600; letter-spacing:.04em; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.scr-code.is-new{ animation:scr-code-in .45s cubic-bezier(.2,1.3,.4,1) both; }
@keyframes scr-code-in{ from{ opacity:0; transform:scale(.9); filter:blur(3px); } }
.scr-code-copy{ position:relative; display:grid; place-items:center; flex:none; width:32px; height:32px; padding:0; border:0; border-radius:6px; background:none; color:var(--text-2); cursor:pointer; transition:background-color .15s, color .15s; }
.scr-code-copy:hover{ background:rgba(255,255,255,.06); color:var(--text); }
.scr-code-copy.is-copied{ color:var(--ok); }
.scr-code-copy.is-copied::after{ content:"Copié"; position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%); padding:3px 8px; border-radius:6px; background:#f4f3f7; color:#0b0a10; font-size:11.5px; font-weight:600; white-space:nowrap; animation:scr-pop .16s var(--ease); }
.scr-claim-err{ margin:8px 0 0; color:var(--danger); font-size:12.5px; }

.scr-pending{ border-color:rgba(124,58,237,.45); }
.scr-pending-list, .scr-tops, .scr-codes{ list-style:none; margin:0; padding:0; }
.scr-pending-list li{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px 16px; padding:12px 0; border-top:1px solid var(--line); }
.scr-pending-list li:first-child{ border-top:0; padding-top:0; }
.scr-pending-list li > div:first-child{ display:flex; flex-direction:column; }
.scr-pending-list span{ color:var(--text-2); font-size:13px; }
.scr-pending-list .scr-tier-act{ padding:0; min-width:180px; }

.scr-top{ display:grid; grid-template-columns:40px minmax(0,1fr) auto; align-items:center; gap:4px 14px; padding:12px 0; border-top:1px solid var(--line); }
.scr-top:first-child{ border-top:0; padding-top:0; }
@media (min-width:640px){ .scr-top{ grid-template-columns:40px minmax(0,1fr) auto auto; } }
.scr-top-rank{ display:grid; place-items:center; width:40px; height:40px; border-radius:10px; border:1px solid var(--line-2); background:var(--surface-2); font-size:13px; font-weight:600; }
.scr-top-rank--1{ color:#fbbf24; border-color:rgba(251,191,36,.45); }
.scr-top-rank--2{ color:#cbd5e1; border-color:rgba(203,213,225,.4); }
.scr-top-rank--3{ color:#f59e0b; border-color:rgba(217,119,6,.45); }
.scr-top-main{ display:flex; flex-direction:column; min-width:0; }
.scr-top-main span{ color:var(--text-3); font-size:12.5px; }
.scr-top-reward{ font-size:17px; font-weight:600; font-variant-numeric:tabular-nums; }
.scr-top .scr-pill{ grid-column:2 / -1; justify-self:start; }
@media (min-width:640px){ .scr-top .scr-pill{ grid-column:auto; justify-self:end; } }
.scr-pill{ display:inline-flex; align-items:center; height:26px; padding:0 10px; border-radius:999px; border:1px solid var(--line-2); color:var(--text-2); font-size:12.5px; font-weight:500; white-space:nowrap; }
.scr-pill--ok{ color:var(--ok); border-color:rgba(52,211,153,.3); }
.scr-pill--used{ color:var(--text-3); }
.scr-pill--off{ color:var(--danger); border-color:rgba(251,113,133,.3); }
.scr-codes li{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding:12px 0; border-top:1px solid var(--line); }
.scr-codes li:first-child{ border-top:0; padding-top:0; }
.scr-codes-main{ display:flex; flex-direction:column; flex:1; min-width:160px; }
.scr-codes-main span{ color:var(--text-3); font-size:12.5px; }