:root {
  --da-ink: #0d0d0f;
  --da-ink-soft: #141416;
  --da-panel: #19191c;
  --da-panel-strong: #202024;
  --da-paper: #fffaf3;
  --da-muted: #b8b5b3;
  --da-line: rgba(255, 250, 243, .16);
  --da-red: #e91f24;
  --da-orange: #ff6332;
  --da-amber: #ffb044;
  --da-cyan: #77dff2;
  --da-blue: #428fd7;
  --da-success: #85e7ad;
  --da-shadow: 0 26px 72px rgba(0, 0, 0, .42);
  --da-art: url("./fond.png?v=20260922");
}

body.registration-page,
body.scanner-page,
body.scanner-redirect-page,
body.leaderboard-admin-page,
body.leaderboard-public-page,
body.candidate-page {
  background: var(--da-ink);
  color: var(--da-paper);
  font-family: "Figtree", Arial, sans-serif;
}

body.registration-page :focus-visible,
body.scanner-page :focus-visible,
body.scanner-redirect-page :focus-visible,
body.leaderboard-admin-page :focus-visible,
body.leaderboard-public-page :focus-visible,
body.candidate-page :focus-visible {
  outline: 3px solid var(--da-cyan);
  outline-offset: 3px;
}

/* Inscription ----------------------------------------------------------- */
.registration-page {
  --black: var(--da-ink);
  --black-soft: var(--da-ink-soft);
  --orange: var(--da-orange);
  --orange-light: var(--da-amber);
  --white: var(--da-paper);
  --muted: rgba(255, 250, 243, .68);
  --line: var(--da-line);
}

body.registration-page {
  background-color: var(--da-ink);
  background-image:
    linear-gradient(180deg, rgba(13, 13, 15, .22), rgba(13, 13, 15, .58)),
    var(--da-art);
  background-position: center, center;
  background-size: cover, cover;
  background-repeat: no-repeat, no-repeat;
  background-attachment: fixed, fixed;
}

.registration-page .app {
  background: transparent;
}

.registration-page .app::before {
  display: block;
  position: fixed;
  z-index: 0;
  inset: 0;
  opacity: 1;
  background:
    linear-gradient(180deg, rgba(13, 13, 15, .22), rgba(13, 13, 15, .58)),
    var(--da-art) center / cover no-repeat;
  animation: none;
}

.registration-page .shell {
  position: relative;
  z-index: 1;
}

.registration-page .app::after {
  width: 38vw;
  min-width: 280px;
  right: -17vw;
  top: 52%;
  border-color: rgba(119, 223, 242, .42);
  box-shadow: 0 0 0 42px rgba(119, 223, 242, .025), 0 0 0 84px rgba(255, 99, 50, .02);
}

.registration-page .topbar,
.candidate-page .topbar {
  padding: 11px 14px;
  border: 1px solid rgba(255, 250, 243, .22);
  border-radius: 999px;
  background: rgba(13, 13, 15, .62);
  box-shadow: 0 12px 38px rgba(0, 0, 0, .18);
  backdrop-filter: blur(14px);
}

.registration-page .wordmark span,
.candidate-page .wordmark span {
  color: var(--da-cyan);
}

.registration-page h1,
.candidate-page h1 {
  text-shadow: 0 10px 34px rgba(0, 0, 0, .28);
}

.registration-page h1 span,
.candidate-page h1 span {
  color: var(--da-paper);
  background: linear-gradient(90deg, var(--da-amber), var(--da-orange) 42%, var(--da-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.registration-page .eyebrow,
.registration-page .step-count,
.registration-page .success-kicker {
  color: var(--da-cyan);
}

.registration-page .form-card {
  border-color: rgba(255, 250, 243, .2);
  background: rgba(18, 18, 20, .91);
  box-shadow: var(--da-shadow);
}

.registration-page .form-card::before,
.registration-page .progress-fill {
  background: linear-gradient(90deg, var(--da-red), var(--da-orange), var(--da-amber));
}

.registration-page input:focus {
  border-color: var(--da-cyan);
  background: rgba(66, 143, 215, .09);
  box-shadow: 0 0 0 4px rgba(119, 223, 242, .12);
}

.registration-page .primary,
.registration-page .success-code {
  color: var(--da-ink);
  background: linear-gradient(100deg, var(--da-amber), var(--da-orange) 52%, var(--da-red));
  box-shadow: 0 14px 34px rgba(233, 31, 36, .2);
}

.registration-page .consent-card:has(input:checked) {
  border-color: var(--da-cyan);
  background: rgba(66, 143, 215, .1);
}

.registration-page .checkmark {
  border-color: rgba(119, 223, 242, .54);
}

.registration-page .consent-card input:checked + .checkmark {
  border-color: var(--da-cyan);
  background: var(--da-cyan);
}

.registration-page .intro {
  background:
    linear-gradient(rgba(13, 13, 15, .12), rgba(13, 13, 15, .12)),
    var(--da-art) center / cover no-repeat;
  color: var(--da-paper);
}

/* Scanner staff --------------------------------------------------------- */
body.scanner-page {
  min-height: 100vh;
  margin: 0;
  padding: clamp(18px, 4vw, 44px) 16px;
  background-color: var(--da-ink);
  background-image:
    linear-gradient(180deg, rgba(13, 13, 15, .14) 0, rgba(13, 13, 15, .46) 290px, var(--da-ink) 560px),
    var(--da-art);
  background-position: center top, center top;
  background-size: auto 560px, auto 560px;
  background-repeat: no-repeat, no-repeat;
}

.scanner-page .wrap {
  max-width: 470px;
}

.scanner-page h2 {
  margin: 0 0 8px;
  color: var(--da-paper);
  font-size: clamp(2.2rem, 10vw, 3.7rem);
  line-height: .88;
  letter-spacing: -.055em;
  text-align: left;
  text-shadow: 0 12px 38px rgba(0, 0, 0, .34);
}

.scanner-page #atelierStatus {
  min-height: 18px;
  color: var(--da-paper);
  font-weight: 750;
  text-align: left !important;
  text-shadow: 0 4px 16px rgba(0, 0, 0, .65);
}

.scanner-page .card {
  margin-top: 22px;
  padding: 18px;
  border: 1px solid rgba(255, 250, 243, .2);
  border-radius: 24px;
  background: rgba(20, 20, 22, .94);
  box-shadow: var(--da-shadow);
  backdrop-filter: blur(14px);
}

.scanner-page .small {
  color: var(--da-muted);
}

.scanner-page .input,
.scanner-page .manual-code,
.scanner-page .btnChoice {
  border-color: var(--da-line);
  background: var(--da-panel-strong);
  color: var(--da-paper);
}

.scanner-page .input:focus {
  border-color: var(--da-cyan);
  outline: 0;
  box-shadow: 0 0 0 4px rgba(119, 223, 242, .12);
}

.scanner-page .btn-primary,
.scanner-page .btnChoice.active {
  border-color: transparent;
  background: linear-gradient(100deg, var(--da-orange), var(--da-red));
  color: var(--da-paper);
}

.scanner-page .btn-ghost {
  background: var(--da-panel-strong);
  color: var(--da-paper);
}

.scanner-page .pill {
  border: 1px solid rgba(119, 223, 242, .3);
  background: rgba(66, 143, 215, .12);
  color: var(--da-cyan);
}

.scanner-page .link {
  color: var(--da-cyan);
}

.scanner-page #reader {
  border: 1px solid rgba(119, 223, 242, .34);
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .4);
}

.scanner-page .overlay {
  background: rgba(13, 13, 15, .94);
  color: var(--da-paper);
}

.scanner-redirect-page {
  min-height: 100vh;
  margin: 0;
  display: grid;
  place-items: center;
  background:
    linear-gradient(rgba(13, 13, 15, .36), rgba(13, 13, 15, .78)),
    var(--da-art) center / cover no-repeat;
}

.scanner-redirect-page p {
  margin: 20px;
  padding: 20px 24px;
  border: 1px solid var(--da-line);
  border-radius: 18px;
  background: rgba(13, 13, 15, .78);
  box-shadow: var(--da-shadow);
}

.scanner-redirect-page a {
  color: var(--da-cyan);
  font-weight: 800;
}

/* Candidat -------------------------------------------------------------- */
.candidate-page {
  --black: var(--da-ink);
  --panel: var(--da-panel);
  --orange: var(--da-orange);
  --orange-soft: rgba(255, 99, 50, .13);
  --white: var(--da-paper);
  --muted: rgba(255, 250, 243, .65);
  --line: var(--da-line);
  --success: var(--da-success);
}

.candidate-page .app {
  background: var(--da-ink);
}

.candidate-page .app::before {
  inset: 0 0 auto;
  height: min(660px, 67vh);
  opacity: 1;
  background:
    linear-gradient(180deg, rgba(13, 13, 15, .07) 0%, rgba(13, 13, 15, .22) 52%, var(--da-ink) 100%),
    var(--da-art) center top / cover no-repeat;
}

.candidate-page .eyebrow,
.candidate-page .section-kicker,
.candidate-page .guess-summary-status,
.candidate-page .reward-tier {
  color: var(--da-cyan);
}

.candidate-page .identity-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(255, 250, 243, .24);
  background:
    linear-gradient(115deg, rgba(13, 13, 15, .88), rgba(13, 13, 15, .68)),
    var(--da-art) center / cover no-repeat;
  box-shadow: var(--da-shadow);
}

.candidate-page .identity-card > * {
  position: relative;
  z-index: 1;
}

.candidate-page .identity-code {
  color: var(--da-amber);
  text-shadow: 0 6px 22px rgba(0, 0, 0, .42);
}

.candidate-page .stat-card,
.candidate-page .activity,
.candidate-page .photo-card,
.candidate-page .guess-match,
.candidate-page .guess-summary,
.candidate-page .reward-card,
.candidate-page .tier-rule {
  border-color: var(--da-line);
  background: rgba(25, 25, 28, .9);
}

.candidate-page .stat-card.primary {
  border-color: transparent;
  background: linear-gradient(120deg, var(--da-amber), var(--da-orange) 54%, var(--da-red));
  box-shadow: 0 18px 42px rgba(233, 31, 36, .2);
}

.candidate-page .activity-icon,
.candidate-page .guess-match-tag {
  background: rgba(119, 223, 242, .12);
  color: var(--da-cyan);
}

.candidate-page .activity.is-done .activity-icon,
.candidate-page .guess-step-number,
.candidate-page .guess-event-icon {
  background: var(--da-cyan);
  color: var(--da-ink);
}

.candidate-page .guess-shell {
  border-color: rgba(119, 223, 242, .34);
  background: linear-gradient(145deg, rgba(66, 143, 215, .13), rgba(20, 20, 22, .97) 46%);
  box-shadow: var(--da-shadow);
}

.candidate-page .guess-hero {
  background:
    linear-gradient(100deg, rgba(13, 13, 15, .88), rgba(13, 13, 15, .5)),
    var(--da-art) center / cover no-repeat;
}

.candidate-page .guess-hero::after {
  color: rgba(119, 223, 242, .14);
}

.candidate-page .guess-badge {
  border-color: rgba(119, 223, 242, .36);
  color: var(--da-cyan);
}

.candidate-page .guess-input:focus,
.candidate-page .guess-select:focus {
  border-color: var(--da-cyan);
  box-shadow: 0 0 0 3px rgba(119, 223, 242, .12);
}

.candidate-page .guess-action,
.candidate-page .reward-card.is-eligible .reward-button,
.candidate-page .download-photo,
.candidate-page .button-primary {
  background: linear-gradient(100deg, var(--da-orange), var(--da-red));
  color: var(--da-paper);
}

.candidate-page .reward-card.is-eligible {
  border-color: var(--da-cyan);
  background: linear-gradient(145deg, rgba(66, 143, 215, .15), rgba(13, 13, 15, .84));
}

.candidate-page .tier-rule strong {
  color: var(--da-amber);
}

/* Admin leaderboard ----------------------------------------------------- */
body.leaderboard-admin-page {
  --live2026-orange: var(--da-orange);
  --live2026-orange-soft: var(--da-amber);
  --live2026-ink: var(--da-ink);
  --live2026-panel: var(--da-panel);
  --live2026-line: #3a393d;
  --live2026-text: var(--da-paper);
  --live2026-muted: var(--da-muted);
  --live2026-green: var(--da-success);
  padding-top: 22px;
  background:
    linear-gradient(180deg, rgba(13, 13, 15, .25) 0, var(--da-ink) 470px),
    var(--da-art) center top / auto 470px no-repeat,
    var(--da-ink);
}

.leaderboard-admin-page::before {
  display: none;
}

.leaderboard-admin-page .live2026-topbar {
  min-height: 170px;
  padding: 24px 26px;
  align-items: flex-end;
  border: 1px solid rgba(255, 250, 243, .24);
  border-radius: 26px;
  background:
    linear-gradient(110deg, rgba(13, 13, 15, .76), rgba(13, 13, 15, .18)),
    var(--da-art) center / cover no-repeat;
  box-shadow: var(--da-shadow);
  overflow: hidden;
}

.leaderboard-admin-page .live2026-kicker {
  color: var(--da-cyan);
}

.leaderboard-admin-page .live2026-local-badge {
  border-color: rgba(255, 250, 243, .28);
  background: rgba(13, 13, 15, .68);
  color: var(--da-paper);
  backdrop-filter: blur(12px);
}

.leaderboard-admin-page .card {
  border-color: var(--da-line);
  border-radius: 20px;
  background: rgba(25, 25, 28, .95);
  box-shadow: 0 18px 54px rgba(0, 0, 0, .24);
}

.leaderboard-admin-page .live2026-console,
.leaderboard-admin-page .primary-score-card {
  border-color: rgba(119, 223, 242, .42);
}

.leaderboard-admin-page input,
.leaderboard-admin-page select,
.leaderboard-admin-page button {
  border-radius: 12px;
}

.leaderboard-admin-page input:focus,
.leaderboard-admin-page select:focus {
  border-color: var(--da-cyan);
  box-shadow: 0 0 0 3px rgba(119, 223, 242, .14);
}

.leaderboard-admin-page button,
.leaderboard-admin-page .live2026-mode-nav button[aria-pressed="true"] {
  background: linear-gradient(100deg, var(--da-orange), var(--da-red));
  color: var(--da-paper);
}

.leaderboard-admin-page button.live2026-secondary,
.leaderboard-admin-page #clearFormBtn,
.leaderboard-admin-page #snapshotNowBtn,
.leaderboard-admin-page #applyBackupSettingsBtn,
.leaderboard-admin-page #exportBtn,
.leaderboard-admin-page #saveWebhookBtn,
.leaderboard-admin-page #testWebhookBtn,
.leaderboard-admin-page #resyncBtn,
.leaderboard-admin-page .live2026-advanced-toggle,
.leaderboard-admin-page .live2026-mode-nav button:not([aria-pressed="true"]) {
  border-color: #444349;
  background: #29292e;
}

.leaderboard-admin-page #candidateNumber,
.leaderboard-admin-page #metricInput {
  border-color: var(--da-cyan);
  background: rgba(66, 143, 215, .08);
}

.leaderboard-admin-page th {
  background: #252529;
}

.leaderboard-admin-page .pill {
  border-color: rgba(119, 223, 242, .24);
  background: rgba(66, 143, 215, .1);
}

/* Leaderboard public ---------------------------------------------------- */
body.leaderboard-public-page {
  min-height: 100vh;
  background: var(--da-ink);
}

.leaderboard-public-page .banner-wrapper {
  position: relative;
  box-sizing: border-box;
  min-height: clamp(170px, 18vw, 250px);
  padding: clamp(22px, 3vw, 42px) 0 clamp(30px, 4vw, 52px);
  align-items: flex-end;
  background:
    linear-gradient(180deg, rgba(13, 13, 15, .05), rgba(13, 13, 15, .18) 54%, var(--da-ink)),
    var(--da-art) center / cover no-repeat;
}

.leaderboard-public-page .banner {
  position: relative;
  height: auto;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  align-items: center;
  gap: 24px;
  background: none;
  color: var(--da-paper);
  text-shadow: 0 12px 42px rgba(0, 0, 0, .38);
}

.leaderboard-public-page .banner::before {
  content: none;
}

.leaderboard-public-page .banner::after {
  content: none;
}

.leaderboard-public-page .leaderboard-title {
  margin: 0;
  font-size: clamp(2.8rem, 7vw, 7rem);
  font-weight: 900;
  line-height: .82;
  letter-spacing: -.075em;
}

.leaderboard-public-page .leaderboard-brand {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin: 0;
  padding: 10px 0 10px 16px;
  border: 0;
  background: transparent;
  color: var(--da-paper);
  cursor: pointer;
  box-shadow: none;
  justify-self: center;
}

.leaderboard-public-page .leaderboard-brand:hover {
  background: transparent;
  filter: brightness(1.12);
}

.leaderboard-public-page .leaderboard-brand svg {
  display: block;
  height: auto;
  fill: currentColor;
}

.leaderboard-public-page .leaderboard-brand-hyrox {
  display: inline-flex;
  align-items: center;
  gap: 18px;
}

.leaderboard-public-page .leaderboard-hyrox-logo { width: clamp(108px, 10vw, 158px); }
.leaderboard-public-page .leaderboard-tse-logo { width: clamp(172px, 16vw, 250px); }
.leaderboard-public-page .leaderboard-brand-cross { color: rgba(255,250,243,.68); font-size: 1.25rem; }
.leaderboard-public-page.brand-tse-only .leaderboard-brand-hyrox { display: none; }
.leaderboard-public-page.brand-tse-only .leaderboard-brand {
  padding-left: 0;
}
.leaderboard-public-page.brand-tse-only .leaderboard-tse-logo { width: clamp(220px, 22vw, 340px); }
}

.leaderboard-public-page .container {
  margin-top: -26px;
  position: relative;
  z-index: 2;
}

.leaderboard-public-page thead tr {
  background: linear-gradient(100deg, var(--da-amber), var(--da-orange) 54%, var(--da-red));
}

.leaderboard-public-page thead th {
  color: var(--da-ink);
  font-weight: 800;
}

.leaderboard-public-page tbody tr:nth-child(odd) {
  background: #161618;
}

.leaderboard-public-page tbody tr:nth-child(even) {
  background: #1d1d20;
}

.leaderboard-public-page tbody tr {
  border-bottom: 1px solid rgba(255, 250, 243, .07);
}

.leaderboard-public-page tbody tr.vip .name,
.leaderboard-public-page tbody tr.vip .score {
  color: var(--da-cyan) !important;
}

.leaderboard-public-page .separator {
  background: linear-gradient(90deg, var(--da-cyan), var(--da-orange), var(--da-red));
}

.leaderboard-public-page .scrollWrap {
  border-radius: 0 0 18px 18px;
}

.leaderboard-public-page .scrollWrap::-webkit-scrollbar-thumb {
  background: rgba(119, 223, 242, .42);
}

.leaderboard-public-page #newScoreOverlay {
  background: rgba(8, 8, 10, .78);
  backdrop-filter: blur(12px);
}

.leaderboard-public-page #newScoreCard {
  border-color: var(--da-cyan);
  background:
    linear-gradient(110deg, rgba(13, 13, 15, .92), rgba(13, 13, 15, .68)),
    var(--da-art) center / cover no-repeat;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .7);
}

.leaderboard-public-page #newScoreCard.vip {
  border-color: var(--da-amber);
  background:
    linear-gradient(110deg, rgba(13, 13, 15, .86), rgba(13, 13, 15, .54)),
    var(--da-art) center / cover no-repeat;
  color: var(--da-paper);
}

.leaderboard-public-page tr.flash {
  outline-color: var(--da-cyan);
}

.leaderboard-public-page .live2026-screen::before {
  background:
    linear-gradient(115deg, rgba(13, 13, 15, .72), rgba(13, 13, 15, .28)),
    var(--da-art) center / cover no-repeat;
}

.leaderboard-public-page .live2026-screen::after {
  opacity: .12;
  background-image: linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px);
}

.leaderboard-public-page .live2026-kicker,
.leaderboard-public-page .live2026-public-delta {
  color: var(--da-cyan);
}

.leaderboard-public-page .live2026-idle-ring {
  border-color: var(--da-orange);
  box-shadow: 0 0 70px rgba(255, 99, 50, .22), inset 0 0 60px rgba(255, 99, 50, .1);
}

.leaderboard-public-page .live2026-idle-ring:nth-child(2) {
  border-color: var(--da-cyan);
}

.leaderboard-public-page .live2026-idle-ring:nth-child(3) {
  border-color: var(--da-red);
}

.leaderboard-public-page .live2026-challenge-layout,
.leaderboard-public-page .live2026-conference-card {
  border-color: rgba(119, 223, 242, .55);
  background: rgba(13, 13, 15, .87);
  box-shadow: 0 35px 110px rgba(0, 0, 0, .62);
  backdrop-filter: blur(16px);
}

.leaderboard-public-page .live2026-live-score {
  border-color: var(--da-orange);
}

.leaderboard-public-page .live2026-conference-card {
  border-left-color: var(--da-orange);
}

@media (max-width: 720px) {
  .leaderboard-public-page .banner {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }

  .leaderboard-public-page .leaderboard-brand { padding-left: 0; }
  .leaderboard-public-page.brand-tse-only .leaderboard-brand {
    align-self: center;
  }

  .leaderboard-admin-page .live2026-topbar {
    min-height: 210px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .registration-page .intro {
    transition: none;
  }
}