:root{--bg: #09090b;--bg-card: #16161a;--bg-card-hover: #1c1c22;--text: #fafafa;--text-muted: #a1a1aa;--text-dim: #71717a;--border: #27272a;--accent: #d97706;--accent-light: #f59e0b;--green: #22c55e;--red: #ef4444;--cyan: #06b6d4;--purple: #7c3aed;--gold: #eab308;--radius: 10px;--radius-sm: 6px;--font: "Inter", system-ui, -apple-system, sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%;background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow:hidden}#app{height:100%;width:100%;display:flex;flex-direction:column}.screen{height:100%;width:100%;display:flex;flex-direction:column;overflow-y:auto}.lobby-screen{max-width:480px;margin:0 auto;padding:20px 16px;gap:16px}.lobby-header{text-align:center;padding:24px 0 8px}.lobby-logo{font-size:2.2rem;font-weight:900;letter-spacing:-.02em;background:linear-gradient(135deg,var(--accent),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.lobby-subtitle{color:var(--text-muted);font-size:.85rem;margin-top:4px}.panel{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:10px}.panel h3{font-size:1rem;font-weight:700;color:var(--text)}.label{font-size:.8rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em}.muted{color:var(--text-dim);font-size:.8rem}.input{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 12px;color:var(--text);font-size:.95rem;font-family:var(--font);outline:none;transition:border-color .2s}.input:focus{border-color:var(--accent)}.code-input{font-family:Courier New,monospace;font-size:1.4rem;font-weight:800;letter-spacing:.3em;text-align:center;text-transform:uppercase}.primary-btn,.secondary-btn,.back-btn,.mute-btn{border:none;border-radius:var(--radius-sm);padding:10px 18px;font-family:var(--font);font-weight:700;font-size:.95rem;cursor:pointer;transition:all .15s}.primary-btn{background:linear-gradient(135deg,var(--accent),#b45309);color:#fff}.primary-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}.primary-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.secondary-btn{background:var(--bg);border:1px solid var(--border);color:var(--text)}.secondary-btn:hover{border-color:var(--accent)}.back-btn{background:transparent;color:var(--text-muted);padding:6px 12px;font-size:.85rem}.back-btn:hover{color:var(--text)}.mute-btn{background:transparent;font-size:1.2rem;padding:6px;cursor:pointer}.room-item{display:flex;justify-content:space-between;align-items:center;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;cursor:pointer;font-family:var(--font);color:var(--text);transition:border-color .15s;width:100%}.room-item:hover{border-color:var(--accent)}.room-code{font-family:Courier New,monospace;font-weight:800;font-size:1.1rem}.error-box{background:#7f1d1d33;border:1px solid var(--red);border-radius:var(--radius-sm);padding:10px 14px;color:var(--red);font-size:.85rem}.room-screen{display:grid;grid-template-columns:1fr 280px;grid-template-rows:auto auto auto 1fr auto;gap:0;overflow:hidden;max-height:100vh}.room-header{grid-column:1 / -1;display:flex;align-items:center;gap:12px;padding:8px 16px;background:var(--bg-card);border-bottom:1px solid var(--border)}.room-info{display:flex;gap:8px;align-items:center}.room-code-badge{background:var(--accent);color:#fff;font-family:Courier New,monospace;font-weight:800;font-size:.85rem;padding:3px 8px;border-radius:4px}.race-number{color:var(--text-muted);font-size:.85rem}.balance-display{margin-left:auto;display:flex;align-items:center;gap:6px;background:var(--bg);padding:4px 12px;border-radius:20px;font-weight:700}.coin-icon{font-size:1.1rem}.balance-amount{color:var(--gold);font-size:1.05rem}.streak-badge{font-size:.8rem;background:linear-gradient(135deg,#ef4444,#f59e0b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800}.phase-banner{grid-column:1;padding:8px 16px;font-weight:700;font-size:.95rem;text-align:center;transition:background .3s}.phase-waiting{background:#1c1c22;color:var(--accent-light);animation:waitPulse 2s ease-in-out infinite}@keyframes waitPulse{0%,to{background:#1c1c22}50%{background:#422006}}.phase-betting{background:#422006;color:var(--accent-light)}.phase-locked{background:#7f1d1d55;color:var(--red)}.phase-racing{background:#14532d55;color:var(--green)}.phase-results{background:#422006;color:var(--gold)}.track-container{grid-column:1;position:relative;background:#0a0a0a;border-bottom:1px solid var(--border);overflow:hidden;border-radius:var(--radius)}.race-canvas{display:block;width:100%}.minimap{position:absolute;top:0;left:0;right:0;height:20px;background:#0009;display:flex;align-items:center;overflow:hidden}.minimap-horse{position:absolute;width:14px;height:14px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:8px;font-weight:900;color:#fff;transition:left .2s ease-out;top:3px}.betting-panel{grid-column:1;padding:12px 16px;background:var(--bg-card);border-top:1px solid var(--border);overflow-y:auto;max-height:360px}.betting-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.betting-header h3{font-size:.95rem}.pool-display{color:var(--accent-light);font-weight:600;font-size:.85rem}.horse-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}.horse-card{background:var(--bg);border:2px solid var(--border);border-radius:var(--radius-sm);padding:8px;cursor:pointer;font-family:var(--font);color:var(--text);transition:all .15s;text-align:left}.horse-card:hover{border-color:var(--accent)}.horse-card.selected{border-color:var(--accent);background:#422006;box-shadow:0 0 12px #d977064d}.horse-card:disabled{opacity:.6;cursor:not-allowed}.horse-card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.horse-number{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;color:#fff;font-size:.75rem;font-weight:900}.horse-odds{font-size:.8rem;font-weight:700;color:var(--gold)}.horse-name{font-size:.75rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bet-controls{display:flex;flex-direction:column;gap:8px;padding-top:8px;border-top:1px solid var(--border)}.bet-type-row,.bet-amount-row{display:flex;gap:6px;flex-wrap:wrap}.bet-type-btn,.bet-amount-btn{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 12px;color:var(--text);font-family:var(--font);font-size:.8rem;font-weight:600;cursor:pointer;transition:all .15s}.bet-type-btn:hover,.bet-amount-btn:hover{border-color:var(--accent)}.bet-type-btn.selected,.bet-amount-btn.selected{background:var(--accent);color:#fff;border-color:var(--accent)}.place-bet-btn{background:linear-gradient(135deg,var(--green),#15803d);color:#fff;border:none;border-radius:var(--radius-sm);padding:10px;font-family:var(--font);font-weight:700;font-size:.9rem;cursor:pointer;transition:filter .15s}.place-bet-btn:hover{filter:brightness(1.1)}.place-bet-btn:disabled{opacity:.5;cursor:not-allowed}.my-bets{margin-top:8px}.my-bets h4{font-size:.8rem;color:var(--text-muted);margin-bottom:6px}.bet-item{display:flex;justify-content:space-between;font-size:.8rem;padding:4px 0;color:var(--text-muted)}.results-panel{grid-column:1;padding:16px;background:var(--bg-card);border-top:1px solid var(--border)}.results-panel h3{margin-bottom:8px}.photo-finish-badge{background:linear-gradient(135deg,#ef4444,#f59e0b);color:#fff;font-weight:800;text-align:center;padding:6px;border-radius:var(--radius-sm);margin-bottom:10px;animation:pulse .6s ease-in-out infinite alternate}@keyframes pulse{0%{opacity:.8}to{opacity:1}}.finish-list{display:flex;flex-direction:column;gap:4px}.finish-item{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:var(--radius-sm);font-size:.9rem}.finish-item.winner{background:#422006;border:1px solid var(--accent)}.finish-place{font-size:1.1rem;min-width:28px}.finish-horse-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.finish-name{font-weight:600;flex:1}.finish-odds{color:var(--text-dim);font-size:.8rem}.payout-display{text-align:center;padding:12px;border-radius:var(--radius-sm);font-weight:700;font-size:1rem;margin-top:10px}.payout-display.win{background:linear-gradient(135deg,#14532d,#166534);color:var(--green)}.payout-display.lose{background:#1c1c22;color:var(--text-dim)}.fairness-proof{margin-top:10px;font-size:.8rem;color:var(--text-dim)}.fairness-proof summary{cursor:pointer;color:var(--cyan)}.proof-details{margin-top:6px;padding:8px;background:var(--bg);border-radius:var(--radius-sm);font-family:Courier New,monospace;font-size:.7rem;word-break:break-all}.sidebar{grid-column:2;grid-row:2 / -1;background:var(--bg-card);border-left:1px solid var(--border);display:flex;flex-direction:column;overflow-y:auto}.sidebar-section{padding:12px;border-bottom:1px solid var(--border);flex-shrink:0}.sidebar-section:last-child{flex:1;display:flex;flex-direction:column}.sidebar-section h4{font-size:.8rem;color:var(--text-muted);margin-bottom:8px}.player-list{display:flex;flex-direction:column;gap:4px}.player-item{display:flex;justify-content:space-between;font-size:.8rem;padding:3px 0}.player-item.disconnected{opacity:.4}.player-name{font-weight:600}.player-balance{color:var(--gold)}.commentary-feed,.chat-feed{display:flex;flex-direction:column;gap:3px;font-size:.75rem;max-height:160px;overflow-y:auto}.commentary-item{color:var(--text-muted);line-height:1.3}.chat-msg{color:var(--text);line-height:1.3}.chat-msg strong{color:var(--accent-light)}.chat-input-row{display:flex;gap:6px;margin-top:auto;padding-top:8px}.chat-input{flex:1;font-size:.8rem;padding:6px 8px}.chat-send-btn{background:var(--accent);color:#fff;border:none;border-radius:var(--radius-sm);padding:6px 10px;font-weight:700;cursor:pointer}@media(max-width:768px){.room-screen{grid-template-columns:1fr;grid-template-rows:auto auto auto auto auto;max-height:none;overflow-y:auto}.sidebar{grid-column:1;grid-row:auto;border-left:none;border-top:1px solid var(--border);max-height:200px}.horse-grid{grid-template-columns:repeat(2,1fr)}}.install-banner{position:fixed;bottom:16px;left:50%;transform:translate(-50%);background:var(--bg-card);border:1px solid var(--accent);border-radius:var(--radius);padding:12px 16px;display:flex;align-items:center;gap:12px;z-index:1000;box-shadow:0 4px 20px #00000080}.install-banner button{background:var(--accent);color:#fff;border:none;border-radius:var(--radius-sm);padding:6px 14px;font-weight:700;cursor:pointer}.install-banner .dismiss{background:transparent;color:var(--text-muted);padding:6px}