*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}:root{--bg: #0f172a;--surface: #1e293b;--accent: #f97316;--accent-hover: #fb923c;--text: #f8fafc;--text-muted: #94a3b8;--gold: #fbbf24;--green: #22c55e}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;width:100vw;height:100vh;height:100dvh;touch-action:manipulation}#app{width:100%;height:100%;position:relative}canvas{display:block;width:100%;height:100%;position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;z-index:10;background:#0f172ad9;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:20px}.screen h1{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,var(--accent),var(--gold));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.screen h2{font-size:1.8rem;font-weight:700}.subtitle{color:var(--text-muted);font-size:1rem;text-align:center}.hint{color:var(--gold);font-size:.85rem}.celebration{font-size:3rem;animation:bounce .6s ease infinite alternate}@keyframes bounce{0%{transform:translateY(0)}to{transform:translateY(-10px)}}button{padding:14px 48px;border:none;border-radius:16px;font-size:1.1rem;font-weight:600;cursor:pointer;background:var(--accent);color:#fff;transition:transform .1s,background .2s;min-height:48px;touch-action:manipulation}button:active{transform:scale(.95)}button.secondary{background:var(--surface);color:var(--text-muted);font-size:.9rem;padding:10px 32px}button.back-btn{background:transparent;color:var(--text-muted);font-size:.85rem;padding:8px 24px;border:1px solid rgba(148,163,184,.3);margin-top:8px}.btn-row{display:flex;gap:10px}.level-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;width:100%;max-width:400px;max-height:50vh;overflow-y:auto;padding:4px}.level-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:16px 8px;border-radius:16px;border:1px solid rgba(255,255,255,.1);cursor:pointer;transition:transform .15s,box-shadow .2s;min-height:48px}.level-card:active{transform:scale(.95)}.level-card.locked{opacity:.4;cursor:default}.level-card.locked:active{transform:none}.level-emoji{font-size:1.8rem}.level-name{font-size:.85rem;font-weight:600;color:var(--text)}.level-best{font-size:.7rem;color:var(--gold)}.level-info{font-size:.65rem;color:var(--text-muted)}.score-card{background:var(--surface);border-radius:16px;padding:16px 28px;display:flex;flex-direction:column;gap:6px;min-width:180px}.score-row{display:flex;justify-content:space-between;font-size:1.1rem}.score-row span:first-child{color:var(--text-muted)}.score-row span:last-child{font-weight:700}#hud{position:absolute;top:40px;left:0;right:0;text-align:center;z-index:5;pointer-events:none}#score-display{font-size:3rem;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.5)}#progress-bar{position:absolute;top:100px;left:50%;transform:translate(-50%);width:min(200px,60vw);height:6px;background:#ffffff1a;border-radius:3px;z-index:5;pointer-events:none;overflow:hidden}#progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--accent),var(--green));border-radius:3px;transition:width .3s ease}.hidden{display:none!important}