@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--bg-dark: #0a0a0a;--bg-card: #1a1a1a;--bg-card-hover: #252525;--accent: #ff6b00;--accent-light: #ff8533;--accent-glow: rgba(255, 107, 0, .3);--text-primary: #ffffff;--text-secondary: #a0a0a0;--text-muted: #666666;--success: #22c55e;--danger: #ef4444;--warning: #f59e0b;--border: #333333}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-dark)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.app{max-width:430px;margin:0 auto;min-height:100vh;background:var(--bg-dark);position:relative;padding-bottom:calc(80px + env(safe-area-inset-bottom,0))}.header{padding:16px 20px;padding-top:max(52px,calc(20px + env(safe-area-inset-top,44px)));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg-dark);z-index:100;min-height:70px}.header h1{font-size:24px;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--accent-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.card{background:var(--bg-card);border-radius:12px;padding:14px;margin:8px 16px;border:1px solid var(--border);transition:all .2s ease}.card:hover{background:var(--bg-card-hover);border-color:var(--accent);box-shadow:0 0 20px var(--accent-glow)}.game-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:0}.game-card{background:var(--bg-card);border-radius:16px;padding:16px 12px;text-align:center;border:1px solid var(--border);cursor:pointer;transition:all .2s ease}.game-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 8px 30px var(--accent-glow)}.game-card .icon{font-size:36px;margin-bottom:8px}.game-card h3{font-size:14px;font-weight:700;margin-bottom:2px}.game-card p{font-size:11px;color:var(--text-secondary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-light));color:#fff}.btn-primary:hover{transform:scale(1.02);box-shadow:0 4px 20px var(--accent-glow)}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border)}.btn-danger{background:var(--danger);color:#fff}.btn-full{width:100%}.timer-circle{width:200px;height:200px;border-radius:50%;border:8px solid var(--border);display:flex;align-items:center;justify-content:center;margin:30px auto;position:relative}.timer-circle.warning{border-color:var(--warning);animation:pulse .5s infinite}.timer-circle.danger{border-color:var(--danger);animation:pulse .3s infinite}.timer-circle .time{font-size:64px;font-weight:800}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}.question-display{background:linear-gradient(135deg,var(--bg-card),#222);border-radius:20px;padding:24px 16px;margin:12px 16px;text-align:center;border:2px solid var(--accent);box-shadow:0 0 40px var(--accent-glow)}.question-display .label{font-size:14px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:2px;margin-bottom:16px}.question-display .question{font-size:24px;font-weight:700;line-height:1.4}.category-pills{display:flex;gap:8px;padding:16px;overflow-x:auto;-webkit-overflow-scrolling:touch}.category-pill{padding:10px 20px;border-radius:20px;font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer;background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);transition:all .2s ease}.category-pill.active{background:var(--accent);border-color:var(--accent);color:#fff}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:430px;background:var(--bg-card);border-top:1px solid var(--border);display:flex;justify-content:space-around;padding:12px 0;padding-bottom:calc(12px + env(safe-area-inset-bottom,0));z-index:100}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-muted);text-decoration:none;font-size:11px;font-weight:500;transition:color .2s ease}.nav-item.active{color:var(--accent)}.nav-item svg{width:24px;height:24px}.player-list{padding:16px}.player-item{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-card);border-radius:12px;margin-bottom:8px;border:1px solid var(--border)}.player-avatar{width:40px;height:40px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700}.player-name{flex:1;font-weight:600}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal{background:var(--bg-card);border-radius:20px;padding:24px;width:100%;max-width:380px;border:1px solid var(--border)}.modal h2{font-size:20px;font-weight:700;margin-bottom:16px}.input{width:100%;padding:14px 16px;background:var(--bg-dark);border:1px solid var(--border);border-radius:12px;color:var(--text-primary);font-size:16px;margin-bottom:12px}.input:focus{outline:none;border-color:var(--accent)}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.animate-in{animation:slideUp .3s ease}@media (max-width: 374px){.header h1{font-size:20px}.game-card{padding:16px 12px}.game-card .icon{font-size:36px;margin-bottom:8px}.game-card h3{font-size:14px}.game-card p{font-size:11px}.btn{padding:12px 20px;font-size:14px}.question-display{padding:28px 16px;margin:16px 12px}.question-display .question{font-size:20px}.timer-circle{width:160px;height:160px}.timer-circle .time{font-size:48px}.card{padding:16px;margin:10px 12px}}@media (min-width: 375px) and (max-width: 413px){.game-card .icon{font-size:38px}.timer-circle{width:160px;height:160px}.timer-circle .time{font-size:48px}}@media (min-width: 414px){.app{max-width:430px}.game-card{padding:18px 14px}.game-card .icon{font-size:40px}.question-display{padding:28px 20px}.question-display .question{font-size:22px}.timer-circle{width:180px;height:180px}.timer-circle .time{font-size:56px}}@media (min-width: 768px){.app{max-width:500px}.game-grid{gap:16px}.header h1{font-size:28px}}@supports (padding-top: env(safe-area-inset-top)){.app{padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0)}.header{padding-top:max(20px,calc(12px + env(safe-area-inset-top,20px)));padding-left:calc(20px + env(safe-area-inset-left,0));padding-right:calc(20px + env(safe-area-inset-right,0))}.modal-overlay{padding-top:max(20px,env(safe-area-inset-top,20px));padding-bottom:max(20px,env(safe-area-inset-bottom,20px))}}@media (prefers-color-scheme: dark){.input::placeholder{color:var(--text-muted)}}@media (hover: none){.game-card:active,.btn:active{transform:scale(.98)}.category-pill:active{transform:scale(.95)}}