:root{--blue:#161d33;--blue-dark:#0d1428;--orange:#f39b18;--orange-deep:#c97d10;--bg:#f3ecdb;--text:#161d33;--muted:#161d338c;--green:#2ea36b;--green-bg:#2ea36b24;--red:#d64545;--red-bg:#d645451f;--accent:#3e5cc4}.progress-segments{gap:4px;padding:0 18px 10px;display:flex}.progress-segments .seg{background:#ffffff2e;border-radius:99px;flex:1;height:6px;overflow:hidden}.progress-segments .seg>i{background:var(--orange);border-radius:99px;width:0;height:100%;transition:width .45s cubic-bezier(.2,.7,.2,1);display:block}.progress-segments .seg.done>i{width:100%}.progress-segments .seg.current>i{background:#ffffff73;width:35%}@media (prefers-reduced-motion:reduce){.progress-segments .seg>i{transition:none}}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:linear-gradient(165deg, var(--blue) 0%, var(--blue-dark) 100%);color:var(--text);justify-content:center;align-items:stretch;min-height:100dvh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex}#app{flex-direction:column;width:100%;max-width:480px;display:flex}.card{background:var(--bg);padding:24px 20px calc(24px + env(safe-area-inset-bottom));border-radius:24px;flex-direction:column;gap:14px;margin:16px;display:flex;box-shadow:0 18px 50px #0000004d}@media (width<=480px){.card{min-height:100dvh;padding-top:calc(16px + env(safe-area-inset-top));border-radius:0;flex:none;margin:0}}.row-between{justify-content:space-between;align-items:center;display:flex}.logo{color:var(--blue);letter-spacing:.5px;font-size:26px;font-weight:900}h1{color:var(--blue);font-family:ui-serif,Georgia,Times New Roman,serif;font-size:30px;font-style:italic;font-weight:600;line-height:1.12}@media (width>=600px){h1{font-size:36px}}h3{color:var(--blue);opacity:.75;text-transform:uppercase;letter-spacing:.4px;font-size:13px;font-weight:800}.sub{color:var(--muted);font-size:14px}.me-chip{color:var(--blue);background:#ffffff29;border-radius:12px;align-items:center;gap:6px;margin:4px 0 6px;padding:9px 14px;font-size:14px;font-weight:600;display:inline-flex}.me-chip strong{font-weight:900}.hint{color:var(--muted);font-size:13px}.hint a{color:var(--accent);font-weight:700}.error{color:var(--red);font-size:13px;font-weight:600}.hidden{display:none}label{color:var(--muted);margin-bottom:-8px;font-size:12px;font-weight:700}input{background:#fff;border:2px solid #161d331f;border-radius:16px;outline:none;width:100%;min-height:52px;padding:14px 16px;font-size:16px}input:focus{border-color:var(--accent)}#code{text-transform:uppercase;letter-spacing:4px;font-weight:800}.btn{text-align:center;cursor:pointer;border:none;border-radius:16px;min-height:52px;padding:15px 16px;font-size:16px;font-weight:800;text-decoration:none;transition:transform 80ms,box-shadow 80ms;display:block}.btn:active:not(:disabled){transform:translateY(3px)}.btn.primary{background:var(--orange);color:var(--blue);box-shadow:0 5px 0 var(--orange-deep)}.btn.primary:active:not(:disabled){box-shadow:0 2px 0 var(--orange-deep)}.btn.primary:disabled{opacity:.45;box-shadow:none}.btn.ghost{color:var(--blue);background:#fff;border:2px solid #161d331f;box-shadow:0 5px #161d331a}.btn.ghost:active:not(:disabled){box-shadow:0 2px #161d331a}@media (prefers-reduced-motion:reduce){.btn{transition:none}.btn:active:not(:disabled){transform:none}}.quit{width:36px;height:36px;color:var(--blue);cursor:pointer;background:#fff;border:none;border-radius:50%;flex:none;font-size:16px;font-weight:800;box-shadow:0 3px 10px #0000001f}.quit.light{background:#ffffffeb}.avatar{background:hsl(var(--hue,210), 62%, 46%);color:#fff;border-radius:50%;flex:none;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;font-weight:900;display:inline-flex}.avatar.small{width:24px;height:24px;font-size:12px}.counter{color:var(--orange);font-size:14px;font-weight:800}.players{flex-wrap:wrap;gap:8px;display:flex}.chip{background:#fff;border-radius:999px;align-items:center;gap:7px;padding:6px 13px 6px 6px;font-size:13px;font-weight:700;display:inline-flex;box-shadow:0 3px 8px #0000000f}.chip.me{background:#f59b0b26;border:1px solid #f59b0b80}.chip.ready{background:var(--green-bg);border:1px solid var(--green);color:#1f6b2d}.readybadge{text-align:center;color:var(--green);background:#38a84a1f;border:1.5px solid #38a84a73;border-radius:16px;padding:13px;font-size:15px;font-weight:800}.pulse{background:var(--orange);border-radius:50%;align-self:center;width:14px;height:14px;margin-top:6px;animation:1.4s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(1.6)}}.game-shell{flex-direction:column;min-height:100dvh;display:flex;position:relative}.game-top{padding:calc(14px + env(safe-area-inset-top)) 16px 42px;color:#fff;align-items:center;gap:12px;display:flex}.game-title{white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:16px;font-weight:800;overflow:hidden}.game-meta{align-items:center;gap:10px;font-size:14px;font-weight:800;display:flex}.game-score{color:var(--orange)}.timer-wrap{z-index:2;justify-content:center;margin-bottom:-26px;display:flex}.timer-badge{background:var(--blue-dark);border:4px solid var(--orange);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;font-size:19px;font-weight:900;transition:border-color .3s;display:flex;box-shadow:0 6px 16px #0000004d}.timer-badge.danger{border-color:var(--red);animation:1s ease-in-out infinite tick}@keyframes tick{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.sheet{background:var(--bg);padding:40px 20px calc(150px + env(safe-area-inset-bottom));border-radius:28px 28px 0 0;flex-direction:column;flex:1;gap:16px;display:flex}.diffchip{letter-spacing:.5px;border-radius:999px;align-self:flex-start;padding:6px 12px;font-size:11px;font-weight:900}.diffchip.easy{background:var(--green-bg);color:#1f6b2d}.diffchip.med{color:#9a6206;background:#f59b0b2e}.diffchip.hard{background:var(--red-bg);color:#a32222}.diffchip.decouverte{color:#2b4499;background:#3e5cc424}.diffchip.expert{color:#6b3d7a;background:#7b4b8a29}h2.prompt{color:var(--text);font-size:21px;font-weight:800;line-height:1.35}.answers{flex-direction:column;gap:12px;display:flex}.answer{text-align:left;cursor:pointer;min-height:52px;color:var(--text);background:#fff;border:2px solid #161d331f;border-radius:18px;align-items:center;gap:12px;padding:14px 16px;font-size:15px;font-weight:700;transition:transform 80ms,background .2s,border-color .2s;display:flex}.answer:active{transform:scale(.985)}.answer:disabled{cursor:default}.letter{width:34px;height:34px;color:var(--blue);background:#14337f14;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:14px;font-weight:900;display:inline-flex}.answer-text{flex:1}.answer-mark{flex:none;font-size:16px;font-weight:900}.answer.selected{border-color:var(--orange);background:#f59b0b1a}.answer.selected .letter{color:#9a6206;background:#f59b0b40}.answer.correct{background:var(--green-bg);border-color:var(--green)}.answer.correct .letter{background:var(--green);color:#fff}.answer.correct .answer-mark{color:var(--green)}.answer.wrong{background:var(--red-bg);border-color:var(--red)}.answer.wrong .letter{background:var(--red);color:#fff}.answer.wrong .answer-mark{color:var(--red)}.side-avatars{z-index:5;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f193773;border-radius:999px;flex-direction:column;align-items:center;gap:10px;padding:10px 6px;display:flex;position:fixed;top:40%;right:8px}.side-avatars:empty{display:none}.side-avatar{border:3px solid #0000;border-radius:50%;display:inline-flex;position:relative}.side-avatar.ok{border-color:var(--green)}.side-avatar.ko{border-color:var(--red)}.mini-badge{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:11px;font-weight:900;display:flex;position:absolute;top:-6px;right:-6px}.mini-badge.ok{background:var(--green)}.mini-badge.ko{background:var(--red)}.side-extra{color:#fff;font-size:12px;font-weight:800}.reveal-banner{max-width:480px;padding:16px 20px calc(18px + env(safe-area-inset-bottom));z-index:10;border-radius:22px 22px 0 0;margin:0 auto;animation:.25s ease-out slideup;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -8px 30px #0000002e}.reveal-banner.good{background:#e5f6e8}.reveal-banner.bad{background:#fdeaea}@keyframes slideup{0%{transform:translateY(100%)}to{transform:translateY(0)}}.reveal-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.reveal-title{font-size:18px;font-weight:900}.reveal-banner.good .reveal-title{color:var(--green)}.reveal-banner.bad .reveal-title{color:var(--red)}.reveal-next{color:var(--muted);white-space:nowrap;font-size:13px;font-weight:700}.reveal-expl{color:var(--text);margin-top:8px;font-size:14px;line-height:1.45}.board{counter-reset:rank;flex-direction:column;gap:8px;list-style:none;display:flex}.board li{counter-increment:rank;background:#fff;border-radius:14px;justify-content:space-between;align-items:center;padding:9px 14px;font-size:14px;font-weight:700;display:flex}.board li:before{content:counter(rank);color:var(--muted);margin-right:10px;font-weight:900}.board li.me{background:#f59b0b1f;border:1px solid #f59b0b80}.board li strong{color:var(--blue)}.board-name{flex:1;align-items:center;gap:8px;display:inline-flex}audio[data-livekit]{display:none}.qr-box{background:#fff;border-radius:20px;flex-direction:column;align-items:center;gap:10px;padding:18px;display:flex;box-shadow:0 6px 18px #00000014}.qr-img{border-radius:10px;width:min(240px,60vw);height:auto}.bigcode{letter-spacing:10px;color:var(--blue);padding-left:10px;font-size:34px;font-weight:900}.mode-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.mode-card{cursor:pointer;text-align:left;background:#fff;border:2px solid #0000;border-radius:14px;flex-direction:column;align-items:flex-start;gap:3px;padding:12px;transition:transform .1s,border-color .15s;display:flex;box-shadow:0 3px 10px #0000000f}.mode-card:active{transform:scale(.97)}.mode-card.selected{border-color:var(--orange);background:#f59b0b14}.mode-emoji{font-size:22px}.mode-label{color:var(--text);font-size:14px;font-weight:800}.mode-desc{color:var(--muted);font-size:11px}.mode-grid.compact .mode-card{flex-direction:row;align-items:center;gap:8px;padding:9px 12px}.mode-grid.compact .mode-emoji{font-size:17px}@keyframes fadeup{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}.anim-in{animation:.35s ease-out both fadeup}@keyframes popin{0%{opacity:0;transform:scale(.6)}70%{transform:scale(1.08)}to{opacity:1;transform:scale(1)}}.anim-pop{animation:.3s ease-out both popin}@keyframes goodpulse{0%,to{transform:scale(1)}40%{transform:scale(1.03)}}.answer.correct{animation:.45s ease-out goodpulse}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.answer.wrong{animation:.3s ease-out shake}.answers.tf{flex-direction:row;align-items:stretch;gap:12px}.answers.tf .answer{text-align:center;border-width:2.5px;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;gap:10px;min-height:150px;padding:20px 10px;font-size:21px;font-weight:900}.answers.tf .answer-text{flex:none}.answers.tf .answer .letter{border-radius:50%;width:44px;height:44px;font-size:19px}.answers.tf .answer:first-child{color:#1f6b2d;background:#eef9f0;border-color:#38a84a80}.answers.tf .answer:first-child .letter{background:var(--green);color:#fff}.answers.tf .answer:last-child{color:#a32222;background:#fdf0f0;border-color:#e0434380}.answers.tf .answer:last-child .letter{background:var(--red);color:#fff}.answers.tf .answer.selected{border-color:var(--orange);background:#f59b0b1f}.answers.tf .answer.correct{background:var(--green-bg);border-color:var(--green);color:#1f6b2d}.answers.tf .answer.wrong{background:var(--red-bg);border-color:var(--red);color:#a32222}.answers.tf .answer:disabled:not(.correct):not(.wrong):not(.selected){opacity:.55}.toast{top:calc(14px + env(safe-area-inset-top));color:#fff;z-index:50;white-space:nowrap;text-overflow:ellipsis;background:#0f1937eb;border-radius:999px;max-width:90vw;padding:11px 18px;font-size:14px;font-weight:700;animation:.25s ease-out both fadeup;position:fixed;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 8px 24px #0000004d}.toast.gone{opacity:0;transition:opacity .4s}.sound-fab{bottom:calc(18px + env(safe-area-inset-bottom));background:var(--orange);color:#fff;cursor:pointer;z-index:60;border:none;border-radius:999px;padding:13px 22px;font-size:15px;font-weight:800;animation:.3s ease-out both popin;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #f59b0b80}.codechip{color:var(--blue);background:#14337f14;border-radius:999px;align-items:center;gap:6px;margin:2px auto 12px;padding:6px 14px;font-size:.9rem;font-weight:700;display:inline-flex}.codechip strong{letter-spacing:.18em;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:1rem}.mic-fab{bottom:calc(96px + env(safe-area-inset-bottom));background:var(--orange);color:#fff;cursor:pointer;z-index:60;border:none;border-radius:50%;width:52px;height:52px;font-size:22px;animation:.3s ease-out both popin;position:fixed;right:14px;box-shadow:0 8px 24px #f59b0b80}.mic-fab.muted{background:#4b5563;box-shadow:0 8px 24px #00000059}@media (prefers-reduced-motion:reduce){.anim-in,.anim-pop,.answer.correct,.answer.wrong,.pulse,.timer-badge.danger{animation:none!important}}.trending{text-align:left;margin:4px 0 8px}.trend-label{text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin:14px 0 8px;font-size:12px;font-weight:800}.pack-row{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:10px;padding-bottom:4px;display:flex;overflow-x:auto}.pack-card{scroll-snap-align:start;cursor:pointer;text-align:left;background:#fff;border:1.5px solid #14337f1a;border-radius:16px;flex-direction:column;flex:none;gap:6px;width:116px;padding:8px;transition:transform .1s,border-color .2s;display:flex}.pack-card:active{transform:scale(.97)}.pack-card:hover{border-color:var(--orange)}.pack-img{aspect-ratio:3/4;object-fit:cover;background:var(--bg);border-radius:10px;place-items:center;width:100%;font-size:30px;display:grid}.pack-img.placeholder{color:var(--blue)}.pack-title{color:var(--text);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:12px;font-weight:700;line-height:1.25;display:-webkit-box;overflow:hidden}.badge-row{flex-wrap:wrap;gap:8px;display:flex}.quiz-badge{cursor:pointer;max-width:100%;color:var(--blue);background:#14337f0f;border:1.5px solid #14337f1f;border-radius:999px;align-items:center;gap:6px;padding:7px 12px;font-size:13px;font-weight:700;transition:transform .1s,background .2s,border-color .2s;display:inline-flex}.quiz-badge:active{transform:scale(.96)}.quiz-badge:hover{border-color:var(--orange);background:#f59b0b24}.badge-text{text-overflow:ellipsis;white-space:nowrap;max-width:200px;overflow:hidden}.badge-count{color:#fff;background:var(--orange);border-radius:999px;flex:none;padding:1px 7px;font-size:11px;font-weight:900}.solo-score{color:var(--blue);text-align:center;margin:8px 0 2px;font-size:52px;font-weight:900;line-height:1}.solo-score span{color:var(--muted);font-size:24px;font-weight:800}.save-block{background:var(--bg);text-align:left;border-radius:16px;margin-top:14px;padding:16px}.save-block .hint{margin-bottom:10px}.countdown{color:#fff;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;min-height:60vh;display:flex}.countdown-num{color:var(--orange);text-shadow:0 6px #00000040;font-size:86px;font-weight:900;line-height:1}.countdown-sub{opacity:.8;font-size:16px;font-weight:700}.reactions{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.reaction-btn{cursor:pointer;background:#fff;border:2px solid #161d331a;border-radius:50%;width:46px;height:46px;font-size:22px;line-height:1;transition:transform 80ms,box-shadow 80ms;box-shadow:0 3px #161d331a}.reaction-btn:active{transform:translateY(2px);box-shadow:0 1px #161d331a}.reaction-float{pointer-events:none;z-index:60;font-size:40px;animation:2.6s ease-out forwards floatUp;position:fixed;bottom:12%}@keyframes floatUp{0%{opacity:0;transform:translateY(0)scale(.6)}15%{opacity:1;transform:translateY(-10px)scale(1.15)}to{opacity:0;transform:translateY(-190px)scale(.9)}}.lobbyfact{margin-top:4px}.lobbyfact-inner{text-align:left;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:18px;padding:14px 16px}.lobbyfact-tag{letter-spacing:.09em;text-transform:uppercase;color:var(--orange);font-size:10.5px;font-weight:800;display:inline-block}.lobbyfact-text{color:#fff;margin:6px 0 0;font-size:14.5px;line-height:1.55}.lobbyfact-src{color:#ffffff80;margin:8px 0 0;font-size:11px;line-height:1.45}.reveal-next-btn{margin-top:10px}@media (prefers-reduced-motion:reduce){.reaction-float{animation-duration:10ms}.reaction-btn{transition:none}}.soundtoggle{color:#fff;cursor:pointer;background:#ffffff24;border:none;border-radius:50%;flex:none;width:36px;height:36px;font-size:15px}.soundtoggle:active{transform:scale(.94)}.invite-url{text-align:center;color:var(--muted);word-break:break-all;margin:-2px 0 12px;font-size:14px;font-weight:700}.invite-url strong{color:var(--orange-deep);letter-spacing:1px}.board.podium li{align-items:center;gap:10px}.board.podium .rank{text-align:center;min-width:30px;color:var(--muted);font-size:20px;font-weight:900}.board.podium .board-name{align-items:center;gap:8px}.board.podium .who{flex-direction:column;line-height:1.2;display:flex}.board.podium .cumul{color:var(--muted);font-size:12px;font-style:normal;font-weight:700}.board.podium li.me{outline:2px solid var(--orange);outline-offset:-2px}.board.podium li:first-child strong{color:var(--orange-deep);font-size:19px}.repere{text-align:left;background:#0000000d;border-radius:14px;margin:12px 0 4px;padding:10px 14px}.repere-ligne{justify-content:space-between;gap:12px;font-size:13.5px;font-weight:700;display:flex}.repere-ref{opacity:.55;white-space:nowrap;font-size:12px}.repere-barre{background:#0000001a;border-radius:999px;height:8px;margin-top:8px;position:relative;overflow:hidden}.repere-toi{background:var(--orange);border-radius:999px;position:absolute;inset:0 auto 0 0}.repere-marque{background:#00000080;width:2px;position:absolute;top:0;bottom:0}.mascottes{text-align:left;color:inherit;background:#f39b181f;border:2px solid #f39b1873;border-radius:14px;margin:12px 0 4px;padding:10px 14px;text-decoration:none;display:block}.mascottes-titre{letter-spacing:.12em;text-transform:uppercase;color:var(--orange-deep);font-size:11px;font-weight:800;display:block}.mascottes-noms{margin-top:2px;font-size:15px;font-weight:900;display:block}.mascottes-lien{opacity:.6;font-size:12.5px;font-weight:600;display:block}
