*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-dark:#0a0e1a;--bg-mid:#141828;--cyan:#00f5ff;--pink:#ff3e8a;--yellow:#ffe156;--green:#56ff82;--purple:#b44dff;--orange:#ff8c42;--text:#e8e8e8;--text-dim:#8892a4;--grid-line:#ffffff14;--font-main:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", monospace}html,body{background:linear-gradient(180deg, var(--bg-dark) 0%, var(--bg-mid) 100%);width:100%;height:100%;color:var(--text);font-family:var(--font-main);-webkit-tap-highlight-color:transparent;touch-action:none;overflow:hidden}#app{width:100%;height:100%;position:relative}canvas{touch-action:none;display:block}.page{opacity:0;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:absolute;inset:0}.page.active{opacity:1;pointer-events:all}.btn{border:2px solid var(--cyan);color:var(--cyan);font-family:var(--font-main);letter-spacing:1px;cursor:pointer;text-transform:uppercase;-webkit-user-select:none;user-select:none;background:#00f5ff14;border-radius:12px;justify-content:center;align-items:center;padding:14px 36px;font-size:16px;font-weight:700;transition:all .15s;display:inline-flex}.btn:hover,.btn:active{background:#00f5ff26;transform:scale(1.05);box-shadow:0 0 20px #00f5ff4d}.btn-secondary{border-color:var(--text-dim);color:var(--text-dim);background:#ffffff08}.btn-secondary:hover,.btn-secondary:active{border-color:var(--text);color:var(--text);box-shadow:none;background:#ffffff14}.title{letter-spacing:4px;text-transform:uppercase;color:var(--cyan);text-shadow:0 0 30px #00f5ff80,0 0 60px #00f5ff33;font-size:48px;font-weight:900}.subtitle{color:var(--text-dim);letter-spacing:1px;margin-top:12px;font-size:16px}.game-hud{z-index:10;pointer-events:none;justify-content:space-between;align-items:center;padding:16px 20px;display:flex;position:absolute;top:0;left:0;right:0}.game-hud>*{pointer-events:all}.hud-left,.hud-right{align-items:center;gap:12px;display:flex}.hud-level{color:var(--text);font-size:18px;font-weight:700}.hud-lines{color:var(--text-dim);font-size:14px;font-family:var(--font-mono)}.hud-timer{font-size:20px;font-weight:700;font-family:var(--font-mono);color:var(--cyan);text-shadow:0 0 10px #00f5ff66}.hud-btn{border:1.5px solid var(--text-dim);width:36px;height:36px;color:var(--text-dim);cursor:pointer;background:#ffffff0d;border-radius:8px;justify-content:center;align-items:center;font-size:16px;transition:all .15s;display:flex}.hud-btn:hover{border-color:var(--text);color:var(--text)}.zoom-indicator{color:var(--text-dim);font-family:var(--font-mono);cursor:pointer;z-index:10;-webkit-user-select:none;user-select:none;background:#00000080;border-radius:8px;padding:6px 12px;font-size:12px;transition:all .15s;position:absolute;bottom:20px;right:20px}.zoom-indicator:hover{color:var(--text);background:#000000b3}.game-hint{color:var(--text-dim);z-index:10;pointer-events:none;opacity:.7;font-size:13px;position:absolute;bottom:20px;left:50%;transform:translate(-50%)}@media (width<=480px){.title{letter-spacing:3px;font-size:36px}.subtitle{font-size:14px}.btn{padding:12px 28px;font-size:14px}.hud-timer{font-size:18px}}