:root{--ink:#140f1f;--night:#2b2340;--violet:#55467e;--paper:#f4f0e6;--lgray:#b9b3a6;--dgray:#6e6878;--gold:#e8b23a;--yellow:#f6e77e;--red:#d6455a;--green:#3d995b;--lgreen:#93d36c;--blue:#2f7cc4;--sky:#86cdf0}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:var(--ink);color:var(--paper);overflow:hidden;overscroll-behavior:none;font:600 15px/1.35 ui-monospace,SF Mono,Menlo,Consolas,Liberation Mono,monospace}#app{position:fixed;inset:0;display:flex;flex-direction:column}#stage{position:relative;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:var(--ink)}#game canvas{display:block;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:none}#pad{flex:1 1 auto;position:relative;display:flex;align-items:flex-end;justify-content:space-between;padding:12px 16px calc(40px + env(safe-area-inset-bottom));gap:12px;touch-action:none;user-select:none;-webkit-user-select:none}#pad[hidden]{display:none}#dpad{position:relative;width:min(46vw,220px);height:min(30vw,130px);border-radius:18px;background:#55467e59;border:2px solid var(--violet);display:flex;touch-action:none}#dpad .arr{flex:1;display:flex;align-items:center;justify-content:center;font-size:34px;color:var(--lgray);border-radius:16px}#dpad[data-l="1"] .l,#dpad[data-r="1"] .r{background:#e8b23a59;color:var(--yellow)}#btns{display:flex;gap:14px;align-items:flex-end}#btns button,#bPause{touch-action:none;font:inherit;border:2px solid var(--violet);color:var(--paper);background:#55467e59}#bJump{width:min(26vw,110px);height:min(26vw,110px);border-radius:50%;font-size:17px;background:#d6455a66;border-color:var(--red)}#bAct{width:min(18vw,76px);height:min(18vw,76px);border-radius:50%;font-size:20px;margin-bottom:26px;background:#2f7cc466;border-color:var(--blue)}#btns button.on{filter:brightness(1.6);transform:scale(.95)}#bPause{position:absolute;left:50%;top:10px;transform:translate(-50%);width:44px;height:32px;border-radius:8px;font-size:13px}body.landscape #pad{position:absolute;inset:0;pointer-events:none;padding:0 calc(18px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left));align-items:flex-end;background:none}body.landscape #dpad,body.landscape #btns,body.landscape #bPause{pointer-events:auto;opacity:.72}body.landscape #dpad{width:190px;height:104px}body.landscape #bJump{width:96px;height:96px}body.landscape #bAct{width:66px;height:66px}body.landscape #bPause{top:34%;left:calc(22px + env(safe-area-inset-left));transform:none}#ui{position:absolute;inset:0;pointer-events:none}.screen{position:absolute;inset:0;pointer-events:auto;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#140f1fc7;display:flex;justify-content:center;align-items:flex-start;padding:max(16px,env(safe-area-inset-top)) 16px calc(24px + env(safe-area-inset-bottom))}.screen[hidden]{display:none}.card{width:100%;max-width:460px;margin:auto 0;background:var(--ink);border:3px solid var(--gold);box-shadow:0 0 0 3px var(--ink),6px 6px 0 3px var(--violet);padding:18px 18px 16px;text-align:center}.card.narrow{max-width:320px}h1{margin:0;font-size:34px;letter-spacing:2px;color:var(--yellow);text-shadow:3px 3px 0 var(--red)}h3{margin:18px 0 8px;color:var(--yellow);font-size:16px}.sub{margin:2px 0 8px;color:var(--sky);letter-spacing:3px;text-transform:uppercase}.pitch{margin:0 0 12px;color:var(--lgray);font-size:14px}.chars{display:flex;gap:12px;justify-content:center;margin-bottom:12px}.char{flex:1;max-width:150px;background:var(--night);border:3px solid var(--violet);color:var(--paper);font:inherit;padding:8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px}.char img{width:48px;height:64px;image-rendering:pixelated}.char.on{border-color:var(--gold);background:var(--violet)}.namefield{display:flex;flex-direction:column;gap:4px;text-align:left;font-size:13px;color:var(--lgray)}input#name{font:inherit;font-size:20px;padding:10px 12px;border:3px solid var(--violet);background:var(--paper);color:var(--ink);border-radius:0;outline:none;width:100%}input#name:focus{border-color:var(--gold)}.hint{font-size:12px;color:var(--lgray);text-align:left;margin-top:4px}.err{min-height:18px;font-size:12px;color:var(--red);text-align:left}button{cursor:pointer}button.big{display:block;width:100%;margin:6px 0 4px;padding:14px;font:inherit;font-size:22px;letter-spacing:2px;color:var(--ink);background:var(--gold);border:3px solid var(--ink);box-shadow:0 5px 0 var(--red);text-transform:uppercase}button.big:active{transform:translateY(3px);box-shadow:0 2px 0 var(--red)}button.big:disabled{background:var(--dgray);color:var(--lgray);box-shadow:0 5px 0 var(--night);cursor:not-allowed}.row{display:flex;gap:8px;justify-content:center;margin-top:10px;flex-wrap:wrap}.row button,#quit,.tabs button{font:inherit;font-size:13px;padding:8px 10px;background:var(--night);color:var(--paper);border:2px solid var(--violet)}.daily{font-size:12px;color:var(--lgreen);margin:6px 0 10px}.board{border:2px solid var(--violet);padding:8px;margin:6px 0 10px;text-align:left}.tabs{display:flex;gap:4px;margin-bottom:6px}.tabs button{flex:1;padding:6px 4px}.tabs button.on{background:var(--gold);color:var(--ink);border-color:var(--gold)}ol#boardList{margin:0;padding:0;list-style:none;counter-reset:r;font-size:14px;min-height:40px}ol#boardList li{counter-increment:r;display:flex;justify-content:space-between;gap:8px;padding:3px 4px;border-bottom:1px dashed rgba(85,70,126,.6)}ol#boardList li:before{content:counter(r) ".";color:var(--gold);width:2.2em;flex:none}ol#boardList li .n{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ol#boardList li.me{color:var(--yellow);background:#e8b23a1f}ol#boardList li.muted:before{content:""}.keys{font-size:12px;color:var(--lgray);margin:8px 0}.toggles{display:flex;gap:18px;justify-content:center;font-size:13px;margin:8px 0}.toggles input{accent-color:var(--gold);width:18px;height:18px;vertical-align:-3px}.legal{font-size:11px;color:var(--dgray);margin-top:10px;line-height:1.4}.muted{color:var(--lgray)}.small{font-size:12px}.score{font-size:46px;color:var(--paper);margin:6px 0 2px;text-shadow:3px 3px 0 var(--violet)}.pb{color:var(--lgreen);font-size:18px;animation:blink .4s steps(2) 6}.rank{font-size:18px;color:var(--yellow);margin:6px 0 2px;min-height:24px}@keyframes blink{50%{opacity:.2}}ul#missed{list-style:none;margin:0;padding:0;text-align:left}ul#missed li{border-left:4px solid var(--red);background:var(--night);padding:8px 10px;margin-bottom:8px;font-size:13px}ul#missed li b{display:block;color:var(--paper);margin-bottom:2px}ul#missed li .r{color:var(--lgreen)}ul#missed li a{color:var(--sky)}#quit{margin-top:8px;width:100%}@media(max-height:520px){h1{font-size:26px}.pitch{display:none}.card{padding:12px}}
