*{box-sizing:border-box}:root{font-family:Segoe UI,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color:#fff;background-color:#1a1a2e;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh}#root{min-height:100vh}button,input,textarea{font-family:inherit}input:focus,textarea:focus,button:focus{outline:none}.home{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff}.title{font-size:4rem;font-weight:700;margin-bottom:3rem;text-transform:uppercase;letter-spacing:.2em;text-shadow:0 0 20px rgba(255,215,0,.5);color:gold}.sections{display:flex;gap:3rem;align-items:stretch;max-width:900px;width:100%}.section{flex:1;background:#ffffff1a;border-radius:1rem;padding:2rem;display:flex;flex-direction:column;gap:1rem}.section h2{font-size:1.5rem;margin:0;color:gold}.description{color:#ffffffb3;font-size:.9rem;margin:0}.divider{display:flex;align-items:center;font-size:1.2rem;color:#ffffff80}.category-count{display:inline-block;margin-top:.5rem;padding:.25rem .75rem;background:#ffd70033;border-radius:1rem;font-size:.85rem;color:gold}.code-input{width:100%;padding:1rem;font-size:2rem;text-align:center;letter-spacing:.5em;text-transform:uppercase;border:2px solid rgba(255,255,255,.2);border-radius:.5rem;background:#0000004d;color:#fff}.code-input::placeholder{letter-spacing:normal;font-size:1rem;color:#fff6}.button{padding:1rem 2rem;font-size:1.1rem;font-weight:700;border:none;border-radius:.5rem;cursor:pointer;transition:all .2s;text-transform:uppercase}.button:disabled{opacity:.5;cursor:not-allowed}.button.primary{background:gold;color:#1a1a2e}.button.primary:hover:not(:disabled){background:#ffed4a;transform:translateY(-2px)}.button.secondary{background:#4a69bd;color:#fff}.button.secondary:hover:not(:disabled){background:#6a89cc;transform:translateY(-2px)}.error{margin-top:1rem;padding:1rem;background:#f003;border:1px solid rgba(255,0,0,.5);border-radius:.5rem;color:#ff6b6b}@media(max-width:768px){.title{font-size:2.5rem}.sections{flex-direction:column}.divider{padding:1rem 0}}.answer-board{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;width:100%;max-width:800px}.answer-card{position:relative;height:60px;perspective:1000px}.answer-front,.answer-back{position:absolute;inset:0;display:flex;align-items:center;border-radius:.5rem;backface-visibility:hidden;transition:transform .6s ease;font-weight:700}.answer-front{background:linear-gradient(135deg,#2c3e50,#1a252f);border:3px solid #ffd700;justify-content:center}.answer-rank{font-size:2rem;color:gold}.answer-back{background:linear-gradient(135deg,#1e5799,#2989d8,#1e5799);border:3px solid #ffd700;transform:rotateX(180deg);justify-content:space-between;padding:0 1.5rem}.answer-text{font-size:1.3rem;color:#fff;text-transform:uppercase}.answer-points{font-size:1.5rem;color:gold;min-width:50px;text-align:right}.answer-card.revealed .answer-front,.answer-card.revealing .answer-front{transform:rotateX(180deg)}.answer-card.revealed .answer-back,.answer-card.revealing .answer-back{transform:rotateX(0)}.answer-card.revealing .answer-back{animation:flash .3s ease-in-out 3}@keyframes flash{0%,to{background:linear-gradient(135deg,#1e5799,#2989d8,#1e5799)}50%{background:linear-gradient(135deg,gold,#ffed4a,gold)}}.score-display{display:flex;justify-content:space-between;width:100%;max-width:800px;gap:2rem}.team-score{flex:1;background:linear-gradient(135deg,#2c3e50,#1a252f);border:3px solid #4a69bd;border-radius:1rem;padding:1.5rem;text-align:center;transition:all .3s ease}.team-score.active{border-color:gold;box-shadow:0 0 30px #ffd70066;transform:scale(1.02)}.team-score.disconnected{opacity:.5}.team-name{font-size:1.5rem;font-weight:700;color:#fff;text-transform:uppercase;margin-bottom:.5rem}.team-points{font-size:3rem;font-weight:700;color:gold}.connection-status{font-size:.9rem;color:#ff6b6b;margin-top:.5rem}.strike-counter{display:flex;gap:1rem;justify-content:center}.strike{width:60px;height:60px;border:3px solid #4a4a4a;border-radius:.5rem;display:flex;align-items:center;justify-content:center;background:#0000004d;transition:all .3s ease}.strike.active{border-color:red;background:#f003}.x-mark{font-size:2.5rem;color:transparent;transition:all .3s ease}.strike.active .x-mark{color:red}.strike.new{animation:strikeAppear .5s ease}.strike-counter.animating .strike.new .x-mark{animation:xGrow .5s ease}@keyframes strikeAppear{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.3)}to{transform:scale(1);opacity:1}}@keyframes xGrow{0%{transform:scale(0);opacity:0}50%{transform:scale(1.5)}to{transform:scale(1);opacity:1}}.strike-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:100;animation:overlayFade 1.5s ease forwards}.strike-overlay .big-x{font-size:20rem;color:red;animation:bigXAppear .5s ease}.game-board{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:2rem;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;gap:2rem}.game-board.loading,.game-board.error-state{justify-content:center}.loading-text,.error-message{font-size:2rem;color:gold}.error-message{color:#ff6b6b}.game-board.waiting .title{font-size:4rem;color:gold;text-shadow:0 0 20px rgba(255,215,0,.5);margin:0}.room-info{display:flex;flex-direction:column;align-items:center;gap:1rem;background:#ffffff1a;padding:2rem;border-radius:1rem}.room-code{display:flex;flex-direction:column;align-items:center}.room-code .label{font-size:1rem;color:#ffffffb3;text-transform:uppercase}.room-code .code{font-size:4rem;font-weight:700;letter-spacing:.3em;color:gold}.qr-code{padding:1rem;background:#0000004d;border-radius:.5rem}.join-instruction{color:#ffffffb3;margin:0}.start-button{padding:1.5rem 4rem;font-size:1.5rem;font-weight:700;background:gold;color:#1a1a2e;border:none;border-radius:.5rem;cursor:pointer;text-transform:uppercase;transition:all .2s}.start-button:hover{background:#ffed4a;transform:translateY(-3px);box-shadow:0 10px 30px #ffd7004d}.game-board.playing{justify-content:space-between;padding:1.5rem}.game-header{text-align:center}.category-info{display:flex;flex-direction:column;gap:.5rem}.category-number{font-size:1rem;color:#fff9;text-transform:uppercase}.category-prompt{font-size:2rem;color:gold;margin:0;text-transform:uppercase}.turn-indicator{display:flex;flex-direction:column;align-items:center;gap:.25rem}.turn-label{font-size:1.5rem;color:gold;font-weight:700;text-transform:uppercase}.streak{font-size:1rem;color:#ffffffb3}.strike-overlay{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:100;animation:overlayFade 1.5s ease forwards}.strike-overlay .big-x{font-size:15rem;color:red;animation:bigXAppear .5s ease;text-shadow:0 0 50px rgba(255,0,0,.8)}@keyframes overlayFade{0%,70%{opacity:1}to{opacity:0;pointer-events:none}}@keyframes bigXAppear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.game-board.finished .title{font-size:4rem;color:gold;margin:0}.winner{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:2rem;background:#ffd7001a;border:3px solid #ffd700;border-radius:1rem}.winner-label{font-size:1.5rem;color:#fffc;text-transform:uppercase}.winner-name{font-size:3rem;font-weight:700;color:gold}.winner-score{font-size:2rem;color:#fff}.restart-button{padding:1rem 3rem;font-size:1.2rem;font-weight:700;background:#4a69bd;color:#fff;border:none;border-radius:.5rem;cursor:pointer;text-transform:uppercase;transition:all .2s}.restart-button:hover{background:#6a89cc;transform:translateY(-2px)}.game-board.category-summary{justify-content:space-between;padding:1.5rem 2rem;gap:1rem;height:100vh;overflow:hidden}.summary-header{text-align:center}.summary-title{font-size:2rem;color:gold;margin:0;text-transform:uppercase}.summary-prompt{font-size:1.25rem;color:#fff;margin:.5rem 0 0}.summary-main{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;width:100%}.summary-answers-grid{display:flex;gap:2rem;width:100%;max-width:900px;justify-content:center}.summary-column{display:flex;flex-direction:column;gap:.5rem;flex:1;max-width:400px}.summary-answer{display:flex;align-items:center;padding:.6rem 1rem;background:#0000004d;border-radius:.5rem;border:2px solid transparent}.summary-answer.revealed{border-color:#4cd137;background:#4cd1371a}.summary-answer.missed{border-color:#ff6b6b;background:#ff6b6b1a;opacity:.7}.summary-rank{font-size:1rem;font-weight:700;color:gold;width:40px}.summary-text{flex:1;font-size:1rem;color:#fff;text-transform:uppercase}.summary-answer.missed .summary-text{color:#ffffff80}.summary-points{font-size:.9rem;font-weight:700;color:#fffc;min-width:40px;text-align:right}.summary-source{display:flex;flex-direction:row;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff0d;border-radius:.5rem;width:100%;max-width:900px;min-width:0}.source-label{font-size:.8rem;color:#fff9;text-transform:uppercase;flex-shrink:0}.source-link{font-size:.85rem;color:#4a9eff;text-decoration:underline;min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}.source-link:hover{color:#6ab0ff}.summary-footer{display:flex;justify-content:center;align-items:center;gap:3rem;width:100%}.ready-status-board{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:#0000004d;border-radius:.75rem}.ready-instruction{font-size:.9rem;color:#fffc;animation:pulse-board 1.5s ease-in-out infinite}@keyframes pulse-board{0%,to{opacity:.7}50%{opacity:1}}.ready-teams{display:flex;gap:1.5rem}.ready-team{display:flex;flex-direction:row;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ffffff1a;border-radius:.5rem;transition:all .3s}.ready-team.ready{background:#4cd13733;border:2px solid #4cd137}.ready-icon{font-size:1.25rem;color:#ffffff80}.ready-team.ready .ready-icon{color:#4cd137}.ready-name{font-size:.9rem;font-weight:700;color:#fff}.team-controller{min-height:100vh;display:flex;flex-direction:column;background:linear-gradient(135deg,#1a1a2e,#16213e);color:#fff;padding:1rem}.team-controller.loading,.team-controller.error-state{justify-content:center;align-items:center;gap:1rem}.loading-spinner{width:50px;height:50px;border:4px solid rgba(255,215,0,.3);border-top-color:gold;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{font-size:1.2rem;color:gold}.error-icon{width:60px;height:60px;background:#ff6b6b;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700}.error-message{font-size:1.2rem;color:#ff6b6b;text-align:center}.retry-button{padding:.75rem 2rem;background:#4a69bd;color:#fff;border:none;border-radius:.5rem;font-size:1rem;cursor:pointer}.team-controller.team-select{justify-content:center;align-items:center;gap:1.5rem}.team-select h1{font-size:2rem;color:gold;margin:0}.room-code{font-size:1rem;color:#ffffffb3;margin:0}.team-buttons{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:300px}.team-button{padding:1.5rem;border:3px solid #4a69bd;border-radius:1rem;background:#4a69bd33;color:#fff;font-size:1.2rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.25rem;transition:all .2s}.team-button:not(.taken):hover{border-color:gold;background:#ffd7001a;transform:scale(1.02)}.team-button.taken{opacity:.5;cursor:not-allowed}.team-button .status{font-size:.85rem;color:#4cd137}.team-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:#0000004d;border-radius:.75rem;margin-bottom:1rem}.team-header h1{font-size:1.5rem;color:gold;margin:0}.score{font-size:1.5rem;font-weight:700;color:#fff}.team-controller.waiting{gap:1.5rem}.name-section{display:flex;gap:.5rem}.name-input{flex:1;padding:.75rem 1rem;font-size:1rem;border:2px solid rgba(255,255,255,.2);border-radius:.5rem;background:#0000004d;color:#fff}.name-button{padding:.75rem 1.5rem;background:#4a69bd;color:#fff;border:none;border-radius:.5rem;font-size:1rem;cursor:pointer}.waiting-message{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;text-align:center}.waiting-icon{font-size:3rem}.waiting-message p{margin:0;color:#fffc}.hint{font-size:.9rem;color:#ffffff80}.team-controller.playing{gap:1rem}.game-info{background:#0000004d;border-radius:.75rem;padding:1rem;text-align:center}.category{font-size:1.1rem;color:gold;margin-bottom:.75rem;text-transform:uppercase}.strikes{display:flex;justify-content:center;gap:.5rem}.strike-dot{font-size:1.2rem;color:#fff3}.strike-dot.active{color:red}.answer-form{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;width:100%;padding:1rem 0}.answer-input{width:100%;max-width:320px;padding:1rem;font-size:1.2rem;border:3px solid #ffd700;border-radius:.75rem;background:#00000080;color:#fff;text-align:center}.answer-input::placeholder{color:#fff6}.submit-button{width:100%;max-width:320px;padding:1rem 1.5rem;font-size:1.2rem;font-weight:700;background:gold;color:#1a1a2e;border:none;border-radius:.75rem;cursor:pointer;transition:all .2s}.submit-button:disabled{opacity:.5;cursor:not-allowed}.submit-button:not(:disabled):hover{background:#ffed4a}.waiting-turn{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5rem}.other-team{font-size:1.5rem;color:#fffc}.category-ended{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem}.category-ended-text{font-size:1.5rem;color:gold;font-weight:700}.next-category-button{padding:1.25rem 2.5rem;font-size:1.3rem;font-weight:700;background:linear-gradient(135deg,gold,#e6b800);color:#1a1a2e;border:none;border-radius:1rem;cursor:pointer;transition:all .2s;box-shadow:0 4px 15px #ffd7004d}.next-category-button:hover{background:linear-gradient(135deg,#ffed4a,gold);transform:scale(1.05);box-shadow:0 6px 20px #ffd70066}.next-category-button:active{transform:scale(.98)}.waiting-for-other{display:flex;flex-direction:column;align-items:center;gap:.5rem}.ready-check{font-size:1.3rem;color:#4cd137;font-weight:700}.waiting-text{font-size:1rem;color:#ffffffb3;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.7}50%{opacity:1}}.ready-status{display:flex;gap:1.5rem;font-size:.9rem;color:#ffffff80;margin-top:.5rem}.ready-status span{transition:color .2s}.ready-status span.ready{color:#4cd137}.result-feedback{position:fixed;bottom:80px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.75rem;padding:1rem 1.5rem;border-radius:.75rem;font-size:1.1rem;font-weight:700;animation:feedbackSlide 2s ease forwards}.result-feedback.correct{background:#4cd137;color:#fff}.result-feedback.wrong{background:#ff6b6b;color:#fff}.feedback-icon{font-size:1.5rem}.points{color:#ffffffe6}@keyframes feedbackSlide{0%{opacity:0;transform:translate(-50%) translateY(20px)}15%,85%{opacity:1;transform:translate(-50%) translateY(0)}to{opacity:0;transform:translate(-50%) translateY(-20px)}}.team-controller.finished{gap:2rem}.result-banner{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem}.result-icon{font-size:5rem}.result-banner h2{font-size:2.5rem;color:gold;margin:0}.rejoin-section{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:1.5rem;background:#ffd7001a;border:2px solid #ffd700;border-radius:1rem;width:100%;max-width:300px}.rejoin-section p{margin:0;font-size:1.1rem;color:#fff}.rejoin-button{padding:1rem 2rem;background:gold;color:#1a1a2e;border:none;border-radius:.5rem;font-size:1.1rem;font-weight:700;cursor:pointer;width:100%}.rejoin-button:hover{background:#ffed4a}.new-team-button{padding:.75rem 1.5rem;background:transparent;color:#ffffffb3;border:1px solid rgba(255,255,255,.3);border-radius:.5rem;font-size:.9rem;cursor:pointer}.new-team-button:hover{border-color:#ffffff80;color:#fff}.name-input-section{width:100%;max-width:300px}.join-name-input{width:100%;padding:1rem;font-size:1.1rem;border:2px solid #ffd700;border-radius:.5rem;background:#0000004d;color:#fff;text-align:center}.join-name-input::placeholder{color:#ffffff80}.team-label{font-weight:700;font-size:1.3rem}.team-select .hint{margin-top:.5rem}