:root { --bg:#0f1115; --fg:#eaeef4; --muted:#98a2b3; --card:#161a22; --accent:#7c3aed; }
*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--fg)}
.wrap{padding:24px;max-width:1100px;margin:0 auto}
h1,h2,h3{margin:0 0 12px 0}
.card{background:var(--card);border:1px solid #22262f;border-radius:16px;padding:16px}
.btn{background:var(--accent);border:none;color:#fff;padding:12px 16px;border-radius:10px;cursor:pointer;font-weight:600}
.input,select{width:100%;padding:10px;border-radius:10px;border:1px solid #2a3140;background:#0e121a;color:#eaeef4}
.row{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.col{flex:1;min-width:280px}
.list{list-style:none;padding:0;margin:0}
.list li{padding:8px 0;border-bottom:1px solid #22262f;display:flex;justify-content:space-between}
.timer{font-size:42px;font-weight:800;margin:6px 0 12px}
.prompt{font-size:28px;margin:6px 0 16px}
.notice{color:var(--muted);font-size:13px}
button.choice{width:100%;padding:14px;margin:8px 0;font-size:18px;border-radius:10px;border:1px solid #2a3140;background:#121722;color:#eaeef4}
img.qr{width:220px;border-radius:12px;border:1px solid #22262f}
/* === Podium === */
.podium { display:flex; gap:16px; align-items:flex-end; justify-content:center; margin-top:10px; }
.podium .step { width: 160px; background: var(--card); border:1px solid #22262f; border-radius:12px 12px 0 0; padding:10px; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; }
.podium .step .medal { font-size:28px; margin-bottom:6px; }
.podium .step .name { font-weight:700; text-align:center; }
.podium .step .score { color: var(--muted); font-size:12px; margin-top:4px; }
.podium .r1 { height: 200px; outline: 2px solid var(--accent); }
.podium .r2 { height: 160px; }
.podium .r3 { height: 140px; }
/* Média plein écran */
#mediaBox video, #mediaBox audio, #mediaBox img { width:100%; border-radius:12px; }