@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;700&display=swap";
:root{--background:#f8fafc;--foreground:#0f172a;--accent:#d97706;--success:#059669;--error:#dc2626;--muted:#64748b;--border:#0f172a14;--card-bg:white;--overlay-bg:#f8fafc66;--subtle-bg:#0f172a05;--subtle-bg-hover:#0f172a0d;--placeholder:#0f172a1a;--primary:#0d47a1;--secondary:#ff6f00}[data-theme=dark]{--background:#0f172a;--foreground:#e2e8f0;--accent:#f59e0b;--success:#34d399;--error:#f87171;--muted:#94a3b8;--border:#e2e8f01a;--card-bg:#1e293b;--overlay-bg:#0f172a99;--subtle-bg:#e2e8f00d;--subtle-bg-hover:#e2e8f01a;--placeholder:#e2e8f026;--primary:#1565c0;--secondary:#ff8f00}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--background);color:var(--foreground);font-family:Outfit,sans-serif}body.no-scroll{height:100vh;overflow:hidden}main{flex-direction:column;align-items:center;width:100%;max-width:800px;min-height:850px;margin:0 auto;padding:2rem 1rem;display:flex;position:relative}main.no-scroll{height:100dvh;overflow:hidden}.minimal-game{flex-direction:column;flex:1;align-items:center;width:100%;display:flex}header{text-align:center;margin-bottom:1.25rem}h1{color:var(--muted);text-transform:uppercase;letter-spacing:.15em;margin-bottom:.75rem;font-size:.85rem;font-weight:500}.player-details-clues{flex-wrap:wrap;justify-content:center;gap:.35rem;display:flex}.player-details-clues span{color:var(--accent);text-transform:uppercase;letter-spacing:.05em;border:1px solid color-mix(in srgb, var(--accent) 20%, transparent);background:color-mix(in srgb, var(--accent) 5%, transparent);border-radius:4px;padding:.15rem .4rem;font-size:.6rem}.teams-wrapper{flex-direction:column;gap:.75rem;width:100%;min-height:250px;margin-bottom:1.5rem;display:flex}.team-row{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding-bottom:.5rem;transition:all .3s;display:flex}.team-row:hover{border-bottom-color:var(--accent)}.team-info-main{flex:1;align-items:center;gap:.6rem;min-width:0;display:flex}.team-logo{object-fit:contain;flex-shrink:0;width:26px;height:26px}.team-name{color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;font-weight:400;line-height:1.3;overflow:hidden}.team-years{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0;margin-left:.5rem;font-size:.7rem}.mode-toggle{z-index:100;position:absolute;top:1.5rem;right:1.5rem}.mode-toggle button{border:1px solid var(--border);color:var(--muted);cursor:pointer;letter-spacing:.1em;background:0 0;border-radius:20px;padding:.4rem .8rem;font-size:.65rem;transition:all .3s}.mode-toggle button.active{background:var(--accent);color:#fff;border-color:var(--accent)}.options-grid{grid-template-columns:1fr 1fr;gap:.6rem;width:100%;max-width:500px;display:grid}.options-grid button{background:var(--card-bg);border:1px solid var(--border);color:var(--foreground);cursor:pointer;word-break:break-word;border-radius:8px;padding:.75rem .5rem;font-family:inherit;font-size:.8rem;line-height:1.3;transition:all .2s}.options-grid button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:color-mix(in srgb, var(--accent) 5%, transparent)}.options-grid button:disabled{opacity:.5;cursor:default}form{width:100%;max-width:500px;position:relative}input{width:100%;color:var(--foreground);text-align:center;background:0 0;border:none;outline:none;padding:.6rem 0;font-family:inherit;font-size:1.25rem;transition:border-color .4s}input::placeholder{color:var(--placeholder)}.result{letter-spacing:.05em;text-align:center;margin-top:1rem;font-size:.8rem;font-weight:500}.result.success{color:var(--success)}.result.error{color:var(--error)}.stats-footer{width:100%;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;justify-content:center;gap:2rem;margin-top:auto;padding:1rem;font-size:.65rem;display:flex}.stats-footer span{color:var(--muted);opacity:.6;margin-right:.4rem}.reveal-link{color:var(--muted);cursor:pointer;opacity:.6;text-underline-offset:4px;margin-top:1.25rem;font-size:.7rem;text-decoration:underline;transition:opacity .2s}.reveal-link:hover{opacity:1}.loading-container{flex-direction:column;justify-content:center;align-items:center;gap:1rem;display:flex}.game-content{flex-direction:column;width:100%;height:100%;display:flex}.game-content.blurred{filter:blur(8px);pointer-events:none}.startup-overlay{z-index:1000;background:var(--overlay-bg);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.startup-modal{background:var(--card-bg);text-align:center;border-radius:20px;width:92%;max-width:400px;padding:1.75rem;box-shadow:0 20px 40px #00000026}.startup-modal h1{color:var(--foreground);text-transform:none;letter-spacing:normal;margin-bottom:1.5rem;font-size:1.25rem}.startup-options{flex-direction:column;gap:.75rem;display:flex}.startup-modal button{border:1px solid var(--border);background:var(--card-bg);cursor:pointer;border-radius:12px;flex-direction:column;align-items:center;gap:.25rem;width:100%;padding:1rem;font-family:inherit;font-size:.9rem;font-weight:600;transition:none;display:flex}.startup-modal button:hover{background:var(--subtle-bg)}.startup-modal button.easy-btn{border-color:var(--accent);color:var(--accent)}.startup-modal button.hard-btn{color:#ef4444;border-color:#ef4444}.startup-options button small{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-size:.7rem;font-weight:400}.startup-options button:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 8px 16px #00000014}.startup-options button.battle-btn{border-color:#3b82f6}.startup-options button.battle-btn small{color:#3b82f6}.join-box{width:100%;margin-top:.5rem}.join-input{border:1px solid var(--border);background:var(--card-bg);width:100%;color:var(--foreground);text-align:center;letter-spacing:.1em;border-radius:12px;padding:.85rem;font-family:inherit;font-size:.95rem}.players-list{flex-direction:column;gap:.75rem;margin-bottom:2rem;display:flex}.player-entry{background:var(--subtle-bg);border-radius:12px;padding:1rem;font-weight:500}.waiting-text{color:var(--muted);margin-top:1rem;font-size:.8rem;font-style:italic}.results-list{flex-direction:column;gap:1rem;margin-bottom:2rem;display:flex}.result-entry{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;padding:1.25rem;display:flex}.result-entry strong{color:var(--accent);font-size:1.5rem}.battle-header{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;gap:.5rem;width:100%;margin-bottom:1rem;padding:.6rem .75rem;display:flex}.timer{color:var(--accent);flex-shrink:0;font-size:1.2rem;font-weight:700}.battle-scores{flex-wrap:wrap;justify-content:flex-end;gap:.4rem;display:flex}.score-badge{background:var(--subtle-bg-hover);white-space:nowrap;border-radius:20px;padding:.3rem .6rem;font-size:.7rem;font-weight:600;position:relative}.point-animation{pointer-events:none;z-index:100;text-shadow:0 2px 4px #0000001a;font-size:1.2rem;font-weight:800;animation:.8s ease-out forwards float-up;position:absolute;top:-20px;left:50%;transform:translate(-50%)}@keyframes float-up{0%{opacity:0;transform:translate(-50%,10px)}20%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-30px)}}.player-info-row{justify-content:space-between;align-items:center;display:flex}.ready-tag{background:var(--subtle-bg-hover);color:var(--muted);letter-spacing:.05em;border-radius:100px;padding:.25rem .6rem;font-size:.65rem;font-weight:700}.ready-tag.is-ready{color:#166534;background:#dcfce7}.countdown-display{flex-direction:column;align-items:center;gap:.5rem;padding:2rem;display:flex}.countdown-number{color:var(--accent);font-size:4rem;font-weight:900;line-height:1}.countdown-display small{color:var(--muted);letter-spacing:.2em;font-weight:600}.ready-active{background:#166534!important;border-color:#166534!important}.waiting-box{color:var(--muted);padding:1rem;font-size:.9rem}.teammate-clues-wrapper{flex-direction:column;gap:.6rem;width:100%;margin-bottom:1.5rem;display:flex}.teammate-clue-card{background:var(--card-bg);border:1px solid var(--border);color:var(--foreground);text-align:center;border-radius:10px;padding:.85rem;font-size:.9rem;line-height:1.5;box-shadow:0 4px 12px #0000000d}.teammate-ask{color:var(--muted);text-align:center;text-transform:uppercase;letter-spacing:.1em;margin-top:.5rem;font-size:.75rem}.startup-options button.hard-btn:hover{background:var(--subtle-bg)}.startup-options button.easy-btn{background:var(--accent);color:#fff;border-color:var(--accent)}.startup-options button.easy-btn small{color:#fffc}.theme-toggle{z-index:1100;background:var(--card-bg);border:1px solid var(--border);color:var(--muted);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;padding:0;transition:border-color .2s,color .2s;display:flex;position:fixed;top:.75rem;right:.75rem}.theme-toggle svg{display:block}.theme-toggle:hover{border-color:var(--accent);color:var(--accent)}.penalty-bar-track{background:var(--border);border-radius:4px;width:100%;max-width:500px;height:4px;margin-top:1rem;overflow:hidden}.penalty-bar-fill{background:var(--error);border-radius:4px;width:100%;height:100%;animation:2s linear forwards penalty-drain}@keyframes penalty-drain{0%{width:100%}to{width:0%}}.copy-code-btn{cursor:pointer;letter-spacing:.05em;text-transform:uppercase;margin-bottom:1.25rem;transition:all .2s;background:var(--subtle-bg)!important;border:1px solid var(--border)!important;color:var(--muted)!important;border-radius:20px!important;width:auto!important;padding:.4rem 1rem!important;font-size:.7rem!important;font-weight:500!important;display:inline-flex!important}.copy-code-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important}[data-theme=dark] .startup-modal button{color:var(--foreground)}[data-theme=dark] .startup-modal button.hard-btn{color:#fca5a5;border-color:#fca5a5}[data-theme=dark] .startup-modal button.easy-btn{color:#fff}[data-theme=dark] .startup-modal button.battle-btn{color:#93c5fd;border-color:#93c5fd}[data-theme=dark] .startup-modal button.battle-btn small{color:#93c5fd}[data-theme=dark] .startup-options button small{color:#cbd5e1}[data-theme=dark] .ready-tag.is-ready{color:#86efac;background:#166534}.empty-state{text-align:center;padding:2rem}.empty-state p{color:var(--muted);margin-top:.5rem;font-size:.85rem;line-height:1.6}.empty-state code{background:var(--subtle-bg-hover);border-radius:4px;padding:.15rem .4rem;font-size:.8rem}@media (min-width:768px){main{padding:3rem 2rem}h1{margin-bottom:1.25rem;font-size:1.1rem}header{margin-bottom:2rem}.team-name{font-size:1.25rem}.team-logo{width:32px;height:32px}.team-info-main{gap:1rem}.team-years{font-size:.85rem}.teams-wrapper{gap:1rem}input{padding:.85rem 0;font-size:1.75rem}.stats-footer{background:0 0;margin-top:2rem}.player-details-clues span{padding:.2rem .6rem;font-size:.7rem}.player-details-clues{gap:.5rem}.options-grid{gap:1rem}.options-grid button{padding:1rem;font-size:.9rem}.startup-modal{border-radius:24px;max-width:450px;padding:2.5rem}.startup-modal h1{margin-bottom:2rem;font-size:1.5rem}.startup-options{gap:1rem}.startup-modal button{padding:1.25rem;font-size:1rem}.battle-header{border-radius:16px;margin-bottom:2rem;padding:1rem}.timer{font-size:1.5rem}.score-badge{padding:.5rem 1rem;font-size:.8rem}.battle-scores{gap:.75rem}.teammate-clue-card{padding:1.25rem;font-size:1.05rem}.teammate-clues-wrapper{gap:1rem;margin-bottom:2rem}.theme-toggle{width:38px;height:38px;top:1rem;right:1rem}main.tictactoe-active{min-height:calc(100vh - 4rem);padding-top:1rem}.tic-controls button{padding:.6rem;font-size:.9rem}.turn-indicator{font-size:1.25rem}}.tictactoe-container{flex-direction:column;gap:1rem;width:100%;max-width:550px;margin:0 auto;display:flex}.tic-cell span{-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:2.4em;font-size:.65rem;line-height:1.2;display:-webkit-box;overflow:hidden}.tictactoe-header{background:var(--card-bg);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:.75rem;padding:1rem;display:flex}.turn-indicator{text-align:center;text-transform:uppercase;letter-spacing:1px;font-size:1.5rem;font-weight:800}.x-turn{color:var(--error);text-shadow:0 0 8px #dc262633}.o-turn{color:var(--success);text-shadow:0 0 8px #05966933}.tic-timer-bar-track{background:var(--border);border-radius:4px;height:8px;overflow:hidden}.tic-timer-bar-fill{background:var(--accent);height:100%;transition:width 1s linear}.tic-timer-text{text-align:right;color:var(--muted);font-weight:700}.tic-controls{gap:1rem;display:flex}.tic-controls button{border:1px solid var(--border);background:var(--card-bg);color:var(--foreground);cursor:pointer;border-radius:8px;flex:1;padding:.8rem;font-weight:700;transition:all .2s}.tic-controls button:hover:not(:disabled){background:var(--subtle-bg-hover)}.tic-grid{background:var(--border);border-radius:12px;gap:8px;padding:8px;display:grid}.tic-cell{background:var(--card-bg);aspect-ratio:1;text-align:center;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;padding:.5rem;display:flex;overflow:hidden}.tic-cell.corner{background:var(--background);color:var(--accent)}.tic-cell.corner svg{width:40px;height:40px}.header-cell{color:#fff;background:#0d47a1;padding:.25rem;font-size:.75rem;font-weight:700}[data-theme=dark] .header-cell{color:#fff;background:#1565c0}.header-cell img{object-fit:contain;width:40px;height:40px;margin-bottom:.5rem}.game-cell{cursor:pointer;background:var(--card-bg);border:1px solid #0000;transition:all .3s cubic-bezier(.34,1.56,.64,1)}.game-cell:hover:not(.filled){background:var(--subtle-bg-hover);border-color:var(--accent);transform:scale(1.02)}.game-cell.filled{cursor:default;background:var(--subtle-bg);animation:.3s cubic-bezier(.34,1.56,.64,1) forwards cell-pop}@keyframes cell-pop{0%{opacity:.5;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.game-cell.filled.X{background:var(--error);border-color:var(--error)}.game-cell.filled.O{background:var(--success);border-color:var(--success)}.mark-symbol{font-size:2.5rem;font-weight:900;line-height:1}.X .mark-symbol{color:var(--error);text-shadow:0 0 12px #dc26264d}.O .mark-symbol{color:var(--success);text-shadow:0 0 12px #0596694d}.filled.X .mark-symbol,.filled.O .mark-symbol{color:#fff;text-shadow:none}.filled.X .player-name-small,.filled.O .player-name-small{color:#ffffffe6}.player-name-small{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;width:100%;margin-top:.5rem;font-size:.7rem;font-weight:700;overflow:hidden}.choose-btn{color:var(--accent);flex-direction:column;align-items:center;gap:.5rem;display:flex}.choose-btn span{font-size:.6rem;font-weight:700}.plus{background:var(--accent);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1.5rem;display:flex}.tic-footer{gap:1rem;display:flex}.new-game-btn,.leave-btn{text-transform:uppercase;cursor:pointer;border:none;border-radius:8px;flex:1;padding:1rem;font-weight:800}.new-game-btn{background:var(--primary);color:#fff}.leave-btn{background:var(--muted);color:#fff}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#000c;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.search-modal{background:var(--card-bg);border:1px solid var(--border);border-radius:16px;flex-direction:column;gap:1rem;width:100%;max-width:500px;padding:1.5rem;display:flex;box-shadow:0 20px 25px -5px #00000080}.modal-header h2{color:var(--foreground);margin:0;font-size:1.5rem}.modal-header p{color:var(--muted);margin:.5rem 0 0;font-size:.9rem}.search-modal input{border:1px solid var(--border);background:var(--subtle-bg);width:100%;color:var(--foreground);text-align:left;border-radius:8px;padding:1rem;font-family:inherit;font-size:1.1rem}.search-results{flex-direction:column;gap:.5rem;max-height:300px;display:flex;overflow-y:auto}.search-result-item{background:var(--subtle-bg);border:1px solid var(--border);cursor:pointer;text-align:left;border-radius:8px;flex-direction:column;align-items:flex-start;width:100%;padding:1rem;transition:all .2s;display:flex}.search-result-item:hover{border-color:var(--accent);background:var(--subtle-bg-hover)}.search-result-item .player-name{color:var(--foreground);font-size:1.1rem;font-weight:700}.search-result-item .player-meta{color:var(--muted);font-size:.8rem}.searching-text{text-align:center;color:var(--muted);padding:1rem;font-style:italic}.close-modal{background:var(--border);color:var(--foreground);cursor:pointer;border:none;border-radius:8px;padding:.8rem;font-weight:700}.tictactoe-btn{color:#9c27b0!important;border-color:#9c27b0!important}[data-theme=dark] .tictactoe-btn{color:#d8b4fe!important;border-color:#d8b4fe!important}.error-overlay{z-index:1100;background:#000000d9}.error-modal{background:var(--card-bg);text-align:center;border:1px solid #ef4444;border-radius:20px;flex-direction:column;align-items:center;gap:1.25rem;width:90%;max-width:400px;padding:2.5rem;animation:.3s cubic-bezier(.34,1.56,.64,1) modal-pop;display:flex}@keyframes modal-pop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.error-icon{color:#ef4444;background:#ef44441a;border-radius:50%;justify-content:center;align-items:center;width:60px;height:60px;margin-bottom:.5rem;display:flex}.error-icon svg{width:32px;height:32px}.error-modal h3{color:var(--foreground);margin:0;font-size:1.5rem;font-weight:800}.error-modal p{color:var(--muted);margin:0;font-size:1rem;line-height:1.5}.error-modal button{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:12px;width:100%;margin-top:.5rem;padding:1rem;font-weight:800;transition:transform .2s}.error-modal button:hover{background:#dc2626;transform:translateY(-2px)}@media (max-width:600px){.tictactoe-container{padding:1rem}.tic-grid{grid-template-columns:80px repeat(3,1fr)}.tic-cell{font-size:.6rem}.header-cell img{width:24px;height:24px}.mark-symbol{font-size:1.5rem}.tic-controls{flex-wrap:wrap;gap:.5rem}.tic-controls button{flex:calc(50% - .5rem);padding:.6rem;font-size:.75rem}.tic-controls button:last-child{flex:100%}}.tic-grid[style*=repeat\(5] .mark-symbol,.tic-grid[style*=repeat\(6] .mark-symbol{font-size:1.25rem}.tic-grid[style*=repeat\(5] .player-name-small,.tic-grid[style*=repeat\(6] .player-name-small{font-size:.55rem}.tic-grid[style*=repeat\(5] .header-cell img,.tic-grid[style*=repeat\(6] .header-cell img{width:24px;height:24px}