*{box-sizing:border-box;margin:0;padding:0}:root{--bg: #1a1033;--card: #2a1d4d;--text: #f5f2ff;--muted: #b3a8d4;--accent: #7c5cff;--red: #e21b3c;--blue: #1368ce;--yellow: #d89e00;--green: #26890c}html,body,#root{height:100%}body{font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent}h1{font-size:1.6rem;margin-bottom:.5rem}h2{font-size:1.1rem;margin:1.2rem 0 .6rem}.muted{color:var(--muted)}.error{color:#ff7a8a;margin:.5rem 0}.label{margin:1rem 0 .4rem;color:var(--muted)}.big{font-size:1.3rem}.page{max-width:640px;margin:0 auto;padding:1.5rem 1rem 3rem}.centered{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1rem;gap:.6rem}.bg-correct{background:var(--green)}.bg-wrong{background:var(--red)}.join-page{text-align:center;padding-top:3rem}.join-form{display:flex;flex-direction:column;gap:.8rem;margin-top:1.5rem}input,textarea{padding:.9rem 1rem;border-radius:12px;border:2px solid transparent;background:var(--card);color:var(--text);font-size:1rem;width:100%}input:focus,textarea:focus{outline:none;border-color:var(--accent)}button{border:none;border-radius:12px;cursor:pointer;font-size:1rem;font-weight:600;color:var(--text)}.primary{background:var(--accent);padding:.9rem 1.4rem}.primary:disabled{opacity:.4;cursor:default}.secondary{background:var(--card);padding:.9rem 1.4rem}.small{padding:.4rem .8rem;font-size:.85rem}.block{display:block;width:100%;margin:.5rem 0}.button-link{display:inline-block;padding:.9rem 1.4rem;border-radius:12px;background:var(--accent);color:var(--text);text-decoration:none;font-weight:600}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem}.avatar-btn{font-size:2rem;padding:.6rem;background:var(--card);border:3px solid transparent;border-radius:14px}.avatar-btn.selected{border-color:var(--accent);background:#3b2a6b}.avatar{vertical-align:middle}.avatar svg{width:100%;height:100%;display:block;border-radius:50%}.avatar-builder{display:flex;flex-direction:column;gap:1rem}.avatar-preview{display:flex;flex-direction:column;align-items:center;gap:.6rem}.dice-btn{background:var(--card);border:2px solid var(--accent);border-radius:12px;padding:.45rem .9rem;color:#fff;font-size:.95rem}.avatar-controls{display:flex;flex-direction:column;gap:.5rem}.trait-row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;background:var(--card);border-radius:12px;padding:.5rem .8rem}.trait-label{color:var(--muted);font-size:.92rem}.cycler{display:flex;align-items:center;gap:.5rem}.cycler button{width:36px;height:36px;border-radius:50%;border:none;background:#3b2a6b;color:#fff;font-size:1.3rem;line-height:1}.cycler-pos{min-width:3ch;text-align:center;color:var(--muted);font-size:.8rem}.swatches{display:flex;flex-wrap:wrap;gap:.35rem;justify-content:flex-end;max-width:60%}.swatch{width:26px;height:26px;border-radius:50%;border:3px solid transparent;padding:0;cursor:pointer}.swatch.selected{border-color:#fff;box-shadow:0 0 0 2px var(--accent)}.participant-name{display:flex;align-items:center;gap:.4rem}.mini-entry{display:inline-flex;align-items:center;gap:.3rem}.overall-list li{display:flex;align-items:center;gap:.4rem}.play-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;color:var(--muted)}.timer{font-weight:700;color:var(--text);font-size:1.2rem}.hint{text-align:center;margin-top:1rem}.answers-grid{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}.answer-btn{position:relative;overflow:hidden;min-height:110px;border-radius:14px;font-size:2.2rem;display:flex;align-items:center;justify-content:center;gap:.5rem;color:#fff}.answer-red{background:var(--red)}.answer-blue{background:var(--blue)}.answer-yellow{background:var(--yellow)}.answer-green{background:var(--green)}.screen{max-width:1100px}.screen-title{font-size:2.4rem;text-align:center;margin:1.5rem 0 .5rem}.screen .muted.big{text-align:center}.participant-count{text-align:center;font-size:1.4rem;margin:1rem 0;font-weight:700}.screen-header{display:flex;justify-content:space-between;align-items:center;font-size:1.1rem;color:var(--muted);margin-bottom:1rem}.big-timer{font-size:2.2rem}.question-text{font-size:2rem;text-align:center;margin:1.5rem 0}.screen-answers .answer-btn{font-size:1.4rem;justify-content:flex-start;padding:0 1.4rem;min-height:90px}.screen-answers .symbol{font-size:1.8rem;margin-right:.8rem}.answer-btn.dimmed{opacity:.35}.answer-btn.correct{outline:4px solid white}.count-bar{position:absolute;left:0;bottom:0;height:6px;background:#ffffffd9}.count{position:absolute;right:1rem;font-weight:800}.lobby-grid{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center;margin-top:1.5rem}.lobby-card{background:var(--card);border-radius:14px;padding:.8rem 1.2rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;font-weight:600}.lobby-avatar{font-size:2.4rem}.pop-in{animation:pop .35s ease-out}@keyframes pop{0%{transform:scale(.4);opacity:0}to{transform:scale(1);opacity:1}}.mini-leaderboard{display:flex;gap:1.4rem;justify-content:center;flex-wrap:wrap;margin-top:1.4rem;color:var(--muted)}.rank-title{text-align:center;font-size:1.8rem;margin:5rem 0 .5rem}.rank-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;margin-top:1.5rem}.rank-card{display:flex;align-items:center;gap:.7rem;background:var(--card);border-radius:12px;padding:1rem 1.1rem}.rank-num{font-weight:800;font-size:1.2rem;min-width:1.8rem;text-align:center}.rank-name{font-weight:600;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rank-pts{color:var(--accent);font-size:.95rem;white-space:nowrap}.rank-top{outline:2px solid var(--accent)}.rank-1{background:#3a2d0a;outline-color:var(--yellow)}.rank-2{background:#2c2c33}.rank-3{background:#33241a}.podium{display:flex;gap:1rem;justify-content:center;align-items:flex-end;margin:2rem 0}.podium-spot{background:var(--card);border-radius:16px;padding:1.2rem 1.6rem;display:flex;flex-direction:column;align-items:center;gap:.4rem;font-size:1.1rem}.spot-1{order:2;padding-bottom:3rem;background:#3b2a6b}.spot-2{order:1;padding-bottom:2rem}.spot-3{order:3}.medal{font-size:2.5rem}.overall-list{margin:0 auto;max-width:420px;line-height:2;font-size:1.1rem}.screen h2{text-align:center;margin-top:2rem}.host-page section{margin-top:1.5rem}.participant-row{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--card)}.participant-row>span{flex:1}.note-form{width:100%;display:flex;gap:.5rem;margin-top:.4rem}.note-form textarea{flex:1;min-height:60px}.passport-page{padding-top:2.5rem}.passport-header{text-align:center;margin-bottom:1.5rem}.passport-avatar{font-size:4rem;display:block;margin-bottom:.5rem}.passport-card{background:var(--card);border-radius:16px;padding:1.2rem;margin-bottom:1rem}.passport-card h2{margin-top:0}.quiz-result{display:flex;justify-content:space-between;padding:.5rem 0;border-bottom:1px solid rgba(255,255,255,.08)}.total{margin-top:.8rem}.livrable{padding:.5rem 0}.note{background:#ffffff0f;border-radius:10px;padding:.7rem .9rem;margin:.4rem 0;font-style:italic}