:root{--bg: #10131a;--panel: #1a1f2b;--panel-2: #222838;--line: #2e3650;--text: #e8ecf4;--dim: #8a93a8;--accent: #ffb648;--green: #4cff82;--red: #ff5252;--blue: #569cff;--radius: 14px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;background:var(--bg);color:var(--text);font-family:Avenir Next,Segoe UI,system-ui,-apple-system,sans-serif;overscroll-behavior:none}#app{height:100%;display:flex;flex-direction:column}button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}.screen{flex:1;display:flex;flex-direction:column;align-items:center;overflow-y:auto;padding:24px 16px 48px;animation:fadeIn .25s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.title-logo{margin-top:9vh;font-size:clamp(44px,11vw,84px);font-weight:800;letter-spacing:.06em;background:linear-gradient(180deg,#fff,#9fb6dd);-webkit-background-clip:text;background-clip:text;color:transparent;text-align:center}.title-beam{width:min(420px,70vw);height:4px;margin:10px auto 6px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--red) 18%,var(--red) 82%,transparent);box-shadow:0 0 14px var(--red),0 0 40px #ff525280;animation:beamPulse 2.4s ease-in-out infinite}@keyframes beamPulse{0%,to{opacity:.85}50%{opacity:1;box-shadow:0 0 18px var(--red),0 0 60px #ff5252b3}}.title-tagline{color:var(--dim);text-align:center;margin-bottom:38px;font-size:15px}.menu{display:flex;flex-direction:column;gap:12px;width:min(340px,86vw)}.btn{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:15px 22px;font-size:17px;font-weight:600;transition:transform .08s ease,background .15s ease,border-color .15s ease;text-align:center}.btn:hover{background:var(--panel-2);border-color:#3d4a6e}.btn:active{transform:scale(.97)}.btn.primary{background:linear-gradient(180deg,#ffc167,#f59f23);color:#241803;border:none;box-shadow:0 4px 18px #ffb64840}.btn.small{padding:8px 14px;font-size:14px;border-radius:10px}.screen-header{width:min(720px,100%);display:flex;align-items:center;gap:12px;margin-bottom:14px}.screen-header h1{font-size:22px;flex:1}.world{width:min(720px,100%);margin-bottom:24px}.world h2{font-size:17px;margin-bottom:2px}.world .tagline{color:var(--dim);font-size:13px;margin-bottom:10px}.level-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:8px}.level-cell{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 4px 8px;display:flex;flex-direction:column;align-items:center;gap:3px;transition:transform .08s ease,border-color .15s ease}.level-cell:hover{border-color:var(--accent)}.level-cell:active{transform:scale(.95)}.level-cell .num{font-size:18px;font-weight:700}.level-cell .status{font-size:11px;color:var(--dim);min-height:14px}.level-cell.done{border-color:#4cff8273}.level-cell.done .num{color:var(--green)}.level-cell.starred{border-color:#ffb648b3}.level-cell.starred .status{color:var(--accent)}.game-screen{padding:0;overflow:hidden}.hud{width:100%;display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);background:#10131ae6}.hud .level-name{flex:1;font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud .moves{font-variant-numeric:tabular-nums;color:var(--dim);font-size:14px}.hud .moves b{color:var(--text);font-size:16px}.icon-btn{width:38px;height:38px;border-radius:10px;background:var(--panel);border:1px solid var(--line);font-size:17px;display:grid;place-items:center;flex:none}.icon-btn:active{transform:scale(.92)}.board-wrap{flex:1;width:100%;display:grid;place-items:center;padding:12px;min-height:0;touch-action:none}canvas.board{max-width:100%;max-height:100%;border-radius:10px;box-shadow:0 10px 50px #00000080}.quip-toast{position:fixed;left:50%;bottom:86px;transform:translate(-50%);background:var(--panel-2);border:1px solid var(--line);border-radius:999px;padding:10px 20px;font-size:14px;font-style:italic;color:var(--text);opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;max-width:86vw;text-align:center;z-index:30}.quip-toast.show{opacity:1;transform:translate(-50%) translateY(-6px)}.hint-bar{width:100%;text-align:center;padding:8px 16px 14px;color:var(--dim);font-size:13px}.modal-backdrop{position:fixed;inset:0;background:#080a0eb8;display:grid;place-items:center;z-index:50;animation:fadeIn .2s ease}.modal{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:28px 26px 22px;width:min(380px,90vw);text-align:center;box-shadow:0 24px 80px #0009}.modal h2{font-size:24px;margin-bottom:6px}.modal .quip{color:var(--dim);font-style:italic;font-size:14px;margin-bottom:16px;min-height:18px}.modal .stats{display:flex;justify-content:center;gap:26px;margin-bottom:20px}.modal .stat{display:flex;flex-direction:column}.modal .stat .v{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}.modal .stat .k{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:.08em}.modal .star{color:var(--accent);font-size:22px}.modal .actions{display:flex;gap:10px;justify-content:center}.modal .actions .btn{flex:1}input[type=text]{background:var(--panel-2);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:11px 14px;font:inherit;width:100%}input[type=text]:focus{outline:none;border-color:var(--accent)}.howto{width:min(560px,100%);line-height:1.55;font-size:15px}.howto h3{margin:18px 0 6px;color:var(--accent);font-size:15px}.howto p{color:#c6cddc;margin-bottom:6px}.howto kbd{background:var(--panel-2);border:1px solid var(--line);border-radius:5px;padding:1px 7px;font-size:12px;font-family:inherit}.lb-table{width:100%;border-collapse:collapse;font-size:14px}.lb-table td,.lb-table th{padding:8px 10px;text-align:left;border-bottom:1px solid var(--line)}.lb-table th{color:var(--dim);font-size:12px;text-transform:uppercase;letter-spacing:.07em}.lb-table tr.me td{color:var(--accent);font-weight:700}.daily-card{width:min(420px,100%);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-bottom:16px;text-align:center}.muted-note{color:var(--dim);font-size:13px;margin-top:10px}
