:root{--bg-dark: #050a14;--bg-card: #0c1424;--bg-card-hover: #132038;--neon-green: #b8ff01;--neon-cyan: #00e5ff;--neon-amber: #ffbe0b;--neon-pink: #ff2a5f;--text-main: #f8fafc;--text-muted: #94a3b8;--font-display: "Orbitron", sans-serif;--font-mono: "JetBrains Mono", monospace;--sidebar-width: 280px}*{box-sizing:border-box;margin:0;padding:0;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;background:var(--bg-dark);color:var(--text-main);font-family:var(--font-mono);overflow:hidden}#app{height:100dvh;display:flex;flex-direction:column;overflow:hidden}.topbar{height:52px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#070c18f5;border-bottom:1px solid rgba(184,255,1,.22);z-index:40;flex-shrink:0}.topbar-left{display:flex;align-items:center;gap:10px}.btn-sidebar-toggle{display:inline-flex;align-items:center;gap:6px;background:#b8ff0124;border:1px solid var(--neon-green);color:var(--neon-green);font-family:var(--font-display);font-size:.74rem;font-weight:800;padding:6px 10px;border-radius:6px;cursor:pointer;transition:all .15s ease}.btn-sidebar-toggle:active{transform:scale(.96)}.brand-logo{display:flex;align-items:center;gap:8px;font-family:var(--font-display);font-weight:900;font-size:.95rem;letter-spacing:1px;color:var(--text-main);cursor:pointer}.brand-logo img{width:26px;height:26px;border-radius:6px;border:1px solid rgba(184,255,1,.45)}.topbar-actions{display:flex;align-items:center;gap:8px}.btn-ghost{background:#ffffff0d;border:1px solid rgba(148,163,184,.3);color:var(--text-main);font-family:var(--font-mono);font-size:.75rem;font-weight:700;padding:6px 10px;border-radius:6px;cursor:pointer;transition:all .15s ease}.btn-ghost:hover{border-color:var(--neon-green);color:var(--neon-green)}.workspace-layout{flex:1;display:flex;position:relative;overflow:hidden}.sidebar-backdrop{display:none;position:absolute;top:0;right:0;bottom:0;left:0;background:#02050ba6;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:29}.sidebar-drawer{width:var(--sidebar-width);background:#080f1d;border-right:1px solid rgba(184,255,1,.2);display:flex;flex-direction:column;z-index:30;transition:margin-left .22s cubic-bezier(.4,0,.2,1),transform .22s cubic-bezier(.4,0,.2,1);flex-shrink:0}.sidebar-drawer.collapsed{margin-left:calc(var(--sidebar-width) * -1)}@media (max-width: 768px){.sidebar-drawer{position:absolute;top:0;bottom:0;left:0;margin-left:0!important;transform:translate(0);box-shadow:14px 0 36px #000c}.sidebar-drawer.collapsed{transform:translate(-105%)}.sidebar-backdrop.visible{display:block}}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(148,163,184,.14);font-size:.75rem;color:var(--text-muted);font-weight:800}.sidebar-scroll{flex:1;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:6px}.sidebar-group-title{font-size:.68rem;font-weight:800;color:#64748b;letter-spacing:.8px;padding:8px 6px 4px;text-transform:uppercase}.sidebar-item{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border-radius:8px;background:#ffffff05;border:1px solid rgba(148,163,184,.12);cursor:pointer;transition:all .14s ease}.sidebar-item:hover{background:#ffffff0f;border-color:#b8ff0166}.sidebar-item.active{background:#b8ff011f;border-color:var(--neon-green);box-shadow:inset 3px 0 0 var(--neon-green)}.sidebar-item.locked{opacity:.52;cursor:default}.sidebar-item-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-display);font-size:.8rem;font-weight:800}.sidebar-item-meta{display:flex;justify-content:space-between;font-size:.7rem;color:var(--text-muted)}.main-viewport{flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden;background:var(--bg-dark)}.hud-bar{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;background:#0a101ee0;border-bottom:1px solid rgba(148,163,184,.14);font-size:.78rem;flex-shrink:0}.round-pills{display:flex;gap:6px}.round-pill{padding:3px 9px;border-radius:4px;background:#ffffff0f;font-weight:700;font-size:.72rem}.round-pill.active{background:#b8ff0133;color:var(--neon-green);border:1px solid var(--neon-green)}.round-pill.done{background:#00e5ff26;color:var(--neon-cyan)}.canvas-wrapper{flex:1;position:relative;width:100%;height:100%;touch-action:manipulation}.canvas-wrapper canvas{width:100%;height:100%;display:block}.lobby-container{flex:1;overflow-y:auto;max-width:820px;width:100%;margin:0 auto;padding:16px}.games-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}.game-card{background:var(--bg-card);border:1px solid rgba(148,163,184,.2);border-radius:10px;padding:14px;display:flex;flex-direction:column;justify-content:space-between;gap:10px;cursor:pointer}.game-card.locked{opacity:.6;cursor:default}.pillar-badge{font-size:.68rem;font-weight:800;text-transform:uppercase}.game-card-title{font-family:var(--font-display);font-size:.98rem;font-weight:800;margin-top:3px}.game-card-sub{font-size:.76rem;color:var(--text-muted)}.game-card-footer{display:flex;justify-content:space-between;padding-top:8px;border-top:1px solid rgba(148,163,184,.12);font-size:.72rem}.ad-slot-banner{height:46px;background:#060a13;border-top:1px solid rgba(148,163,184,.16);display:flex;align-items:center;justify-content:center;font-size:.68rem;color:#64748b;letter-spacing:.5px;flex-shrink:0}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--neon-green);color:#03070e;font-family:var(--font-display);font-weight:900;font-size:.86rem;padding:11px 16px;border:none;border-radius:8px;cursor:pointer;width:100%}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#03060ce0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:14px;z-index:60}.result-modal{background:#0b1324;border:1px solid rgba(184,255,1,.45);border-radius:16px;max-width:430px;width:100%;padding:18px;max-height:92dvh;overflow-y:auto}.tier-badge-large{text-align:center;font-family:var(--font-display);font-weight:900;font-size:1.12rem}.final-score-big{text-align:center;font-size:2.3rem;font-weight:800;margin:4px 0 12px}.rounds-breakdown{background:#040810a6;border-radius:10px;padding:10px 12px;margin-bottom:12px;display:flex;flex-direction:column;gap:5px;font-size:.78rem}.round-row{display:flex;justify-content:space-between}.modal-actions{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.btn-secondary{background:#00e5ff24;border:1px solid var(--neon-cyan);color:var(--neon-cyan);font-family:var(--font-display);font-weight:800;font-size:.8rem;padding:10px;border-radius:8px;cursor:pointer}.btn-rewarded-ad{background:#ffbe0b24;border:1px dashed var(--neon-amber);color:var(--neon-amber);font-family:var(--font-mono);font-weight:700;font-size:.75rem;padding:9px;border-radius:8px;cursor:pointer}.leaderboard-box{border-top:1px solid rgba(148,163,184,.18);padding-top:10px}.leaderboard-box input{width:100%;background:#050912;border:1px solid rgba(148,163,184,.3);color:var(--text-main);font-family:var(--font-mono);padding:7px 10px;border-radius:6px;font-size:.78rem;margin-bottom:6px}.streak-pill{display:inline-flex;align-items:center;gap:4px;background:#ffbe0b24;border:1px solid rgba(255,190,11,.5);color:var(--neon-amber);font-family:var(--font-display);font-size:.7rem;font-weight:800;padding:5px 8px;border-radius:6px}.btn-leaderboard-top{display:inline-flex;align-items:center;gap:5px;background:#00e5ff24;border:1px solid var(--neon-cyan);color:var(--neon-cyan);font-family:var(--font-display);font-size:.72rem;font-weight:800;padding:6px 10px;border-radius:6px;cursor:pointer;transition:all .15s ease}.btn-leaderboard-top:hover{background:#00e5ff40;transform:translateY(-1px)}.lb-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px;margin-bottom:10px;border-bottom:1px solid rgba(148,163,184,.16)}.lb-tab{background:#ffffff0a;border:1px solid rgba(148,163,184,.22);color:var(--text-muted);font-family:var(--font-display);font-size:.68rem;font-weight:800;padding:6px 10px;border-radius:6px;cursor:pointer;white-space:nowrap}.lb-tab.active{background:#b8ff0129;border-color:var(--neon-green);color:var(--neon-green)}.lb-table{display:flex;flex-direction:column;gap:4px;margin:8px 0 12px;max-height:240px;overflow-y:auto}.lb-row{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:8px;padding:7px 10px;border-radius:7px;background:#040810a6;border:1px solid rgba(148,163,184,.1);font-size:.76rem}.lb-row.current-user{background:#b8ff0129;border-color:var(--neon-green);box-shadow:inset 3px 0 0 var(--neon-green)}.lb-rank{font-family:var(--font-display);font-weight:900;font-size:.75rem}.lb-player{display:flex;flex-direction:column;overflow:hidden}.lb-callsign{font-weight:800;color:var(--text-main);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lb-tier-sub{font-size:.64rem;color:var(--text-muted)}.lb-score{font-family:var(--font-mono);font-weight:800;color:var(--neon-cyan)}