:root{--bg-primary: #080910;--bg-card: rgba(20, 22, 35, .95);--bg-input: rgba(30, 33, 50, .8);--text-primary: #e0e0e0;--text-secondary: #888;--accent: #7c5bf5;--accent-hover: #9175f7;--border: rgba(255, 255, 255, .08);--radius: 12px;--error: #ef4444}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;background:var(--bg-primary);color:var(--text-primary);font-family:Inter,Segoe UI,-apple-system,sans-serif}.login-screen{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:radial-gradient(ellipse at 50% 30%,rgba(124,91,245,.08) 0%,transparent 60%)}.login-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:40px;width:380px;max-width:90vw;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.login-header{text-align:center;margin-bottom:32px}.login-header h1{font-size:28px;font-weight:700;letter-spacing:-.5px}.login-subtitle{color:var(--text-secondary);font-size:14px;margin-top:4px}.login-form{display:flex;flex-direction:column;gap:20px}.input-group{display:flex;flex-direction:column;gap:6px}.input-group label{font-size:13px;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.input-group input{background:var(--bg-input);border:1px solid var(--border);border-radius:8px;padding:12px 14px;font-size:16px;color:var(--text-primary);outline:none;transition:border-color .2s;font-family:inherit}.input-group input:focus{border-color:var(--accent)}.input-group input::placeholder{color:#fff3}.join-button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:14px;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s,transform .1s;font-family:inherit}.join-button:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px)}.join-button:disabled{opacity:.4;cursor:not-allowed}.game-screen{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center}.status-overlay{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.status-overlay p{font-size:18px;font-weight:500}.status-subtitle{color:var(--text-secondary)!important;font-size:14px!important;font-weight:400!important}.error-text{color:var(--error)!important}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.stage-container{width:100%;height:100%;position:relative;overflow:hidden;background:var(--bg-primary)}.stage-container canvas{display:block}.hud-overlay{position:absolute;top:8px;right:8px;display:flex;gap:8px;z-index:10}.hud-badge{background:#080910bf;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:6px;padding:6px 12px;font-size:12px;color:var(--text-secondary)}