:root{--bg: var(--tg-theme-bg-color, #0f171d);--bg2: var(--tg-theme-secondary-bg-color, #15212a);--card: var(--tg-theme-section-bg-color, #16232c);--text: var(--tg-theme-text-color, #e8eef2);--hint: var(--tg-theme-hint-color, #8aa0ab);--accent: #4fb3d6;--accent-soft: rgba(79, 179, 214, .16);--accent-line: rgba(79, 179, 214, .45);--danger: #e07a6b;--ok: #63c98f;--line: rgba(138, 160, 171, .22);--radius: 14px;--shadow: 0 8px 28px rgba(0, 0, 0, .35);--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.45;overscroll-behavior:none}#app{min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;cursor:pointer}button:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:10px}.screen{flex:1;display:flex;flex-direction:column;padding:max(10px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom));max-width:560px;width:100%;margin:0 auto}.topzone{min-height:15dvh;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding-bottom:12px}.brandrow{display:flex;align-items:center;gap:10px;color:var(--hint);font-size:14px}.brandrow .ring{flex:none}.brand-name{letter-spacing:.06em;text-transform:uppercase;font-size:12.5px;font-weight:600}.spacer{flex:1}.meta{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--hint);font-variant-numeric:tabular-nums}.badge{padding:3px 10px;border:1px solid var(--line);border-radius:999px;white-space:nowrap}.badge.time.low{color:var(--danger);border-color:var(--danger)}.prompt{font-size:19px;font-weight:650;letter-spacing:-.01em;margin:0}.tapmode{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;min-height:36px;border:1px solid var(--line);border-radius:999px;color:var(--hint);font-size:13.5px}.tapmode[aria-pressed=true]{color:var(--accent);border-color:var(--accent-line);background:var(--accent-soft)}.tapmode .dot{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.85}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;display:flex;flex-direction:column;gap:12px}.card.shake{animation:shake .45s ease}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-9px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(3px)}}.play{touch-action:none;user-select:none;-webkit-user-select:none;position:relative}.hintline{color:var(--hint);font-size:13.5px;margin:0}.field{position:relative;height:200px;margin-bottom:10px;border:1px dashed var(--line);border-radius:12px;background:radial-gradient(circle at 50% 40%,rgba(79,179,214,.05),transparent 60%),var(--bg2);overflow:hidden}.tile{min-width:56px;min-height:56px;width:60px;height:60px;display:inline-flex;align-items:center;justify-content:center;font-size:32px;background:var(--card);border:1.5px solid var(--line);border-radius:14px;box-shadow:0 3px 10px #0000004d;touch-action:none}.play>.tile{position:absolute;transform:translate(-50%,-50%);margin:0}.tile.dragging{z-index:5;border-color:var(--accent);box-shadow:0 10px 22px #00000073}.tile.selected{border-color:var(--accent);background:var(--accent-soft)}.zones{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.zone{min-height:76px;border:1.5px dashed var(--line);border-radius:12px;background:var(--bg2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:8px;color:var(--hint);font-size:14.5px;font-weight:600;transition:border-color .15s ease,background .15s ease}.zone.hot{border-color:var(--accent);background:var(--accent-soft);color:var(--text)}.zone .drops{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;min-height:30px}.zone .drop{font-size:24px;min-width:34px;min-height:34px;line-height:1;display:inline-flex;align-items:center;justify-content:center;background:var(--card);border:1px solid var(--accent-line);border-radius:9px}.rotate-wrap{display:flex;flex-direction:column;align-items:center;gap:12px}.rotate-canvas{border-radius:50%;background:#101b22;border:1px solid var(--line);touch-action:none;max-width:100%}.rotate-controls{display:flex;gap:14px;align-items:center}.stepbtn{min-width:64px;min-height:56px;font-size:26px;border:1.5px solid var(--line);border-radius:14px;background:var(--card)}.stepbtn:active{border-color:var(--accent);background:var(--accent-soft)}.angle-readout{min-width:64px;text-align:center;color:var(--hint);font-variant-numeric:tabular-nums;font-size:15px}.order-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding:8px 0}.order-row .tile{position:relative;transition:transform .15s ease}.order-row .tile.dragging{transition:none}.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:12px}.choice{min-height:84px;font-size:40px;background:var(--bg2);border:1.5px solid var(--line);border-radius:16px}.choice[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}.powrow{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--hint)}.powbar{flex:1;height:4px;border-radius:2px;background:var(--line);overflow:hidden}.powbar>div{height:100%;width:0%;background:var(--accent);border-radius:2px;transition:width .25s ease}.powrow.done{color:var(--ok)}.powrow.done .powbar>div{background:var(--ok)}.submit{margin-top:4px;min-height:56px;border-radius:var(--radius);background:var(--accent);color:#06222e;font-size:17px;font-weight:700;letter-spacing:.01em;transition:opacity .2s ease,transform .1s ease}.submit:disabled{opacity:.35;cursor:default}.submit:not(:disabled):active{transform:scale(.985)}.center{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;padding:24px}.center h1{font-size:23px;margin:0;letter-spacing:-.01em}.center p{color:var(--hint);margin:0;max-width:34ch}.ring{display:block}.ring .track{stroke:var(--line)}.ring .arc{stroke:var(--accent);transition:stroke-dashoffset .3s ease}.ring.ok .arc{stroke:var(--ok)}.ring-mark{color:var(--ok);stroke:currentColor}.pulse{animation:pulse 1.6s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translate(-50%);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:10px 18px;font-size:15px;box-shadow:var(--shadow);z-index:40;animation:toast-in .25s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.demoform{width:100%;max-width:320px;display:flex;flex-direction:column;gap:10px;text-align:left;margin-top:6px}.demolabel{color:var(--hint);font-size:13.5px;letter-spacing:.02em}.demoinput{width:100%;min-height:52px;padding:0 14px;font-family:inherit;font-size:17px;font-variant-numeric:tabular-nums;color:var(--text);background:var(--bg2);border:1.5px solid var(--line);border-radius:12px}.demoinput:focus-visible{outline:3px solid var(--accent);outline-offset:1px}.demochk{display:flex;align-items:center;gap:10px;min-height:44px;color:var(--text);font-size:15.5px;cursor:pointer}.demochk input{width:20px;height:20px;accent-color:var(--accent)}.demoerr{color:var(--danger);font-size:14px;margin:0}.apifoot{color:var(--hint);font-size:12.5px;opacity:.7;margin:4px 0 0;font-variant-numeric:tabular-nums}.devbadge{position:fixed;top:max(6px,env(safe-area-inset-top));right:8px;z-index:50;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--danger);border:1px solid var(--danger);border-radius:6px;padding:2px 7px;opacity:.85;background:var(--bg)}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.retry-note{color:var(--accent);font-size:14.5px;font-weight:600}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}