:root{color:#1d2430;font-family:Trebuchet MS,Apple SD Gothic Neo,Malgun Gothic,sans-serif;--ink: #1d2430;--paper: #fff8ec;--sun: #ffe56a;--mint: #7dce7a}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;position:fixed;top:0;right:0;bottom:0;left:0;background:#8fd4ff;touch-action:none;word-break:keep-all;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}canvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}button{font:800 16px/1.2 Trebuchet MS,Apple SD Gothic Neo,Malgun Gothic,sans-serif;color:var(--ink);background:var(--sun);border:3px solid var(--ink);border-radius:999px;padding:12px 18px;min-height:48px;box-shadow:0 4px 0 var(--ink);cursor:pointer;touch-action:manipulation}button:active{transform:translateY(2px);box-shadow:0 2px 0 var(--ink)}button:disabled{background:#d7d3cb;color:#6d675f;box-shadow:none;cursor:default}button.ghost{background:transparent;box-shadow:none}.screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:8;display:none;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:#1d243047}.screen.on{display:flex}.card{width:min(560px,100%);background:var(--paper);border:4px solid var(--ink);border-radius:28px;box-shadow:0 10px 0 var(--ink);padding:22px 22px 16px}.card.wide{width:min(960px,100%);max-height:100%;display:flex;flex-direction:column}h1,h2,h3,p{margin:0}h1{font-size:clamp(32px,6vw,64px);line-height:.95;letter-spacing:-.04em;color:#fff;-webkit-text-stroke:6px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink)}h2{font-size:28px}h3{margin:12px 0 8px;font-size:16px}.eyebrow{font-weight:800;letter-spacing:.08em;color:#d85a48}.lead,.hint,#clear-stats{margin-top:10px;font-weight:700}.hint{color:#5c6573;font-size:14px}.row,.col{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.col{flex-direction:column}.row.spread{align-items:center;justify-content:space-between;margin-top:0}.row>button,.col>button{flex:1}#level-list{overflow:auto;max-height:calc(100vh - 150px);touch-action:pan-y;padding-right:4px;margin-top:8px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}.grid button{border-radius:16px;text-align:left;background:#fff}.grid button.cleared{background:#e5f8df}.grid button.current{outline:3px solid #ff7a59}#hud{display:none;position:fixed;z-index:6;top:0;left:0;right:0;padding:max(8px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 0 max(12px,env(safe-area-inset-left));align-items:flex-start;justify-content:space-between;gap:8px;pointer-events:none}#hud.on{display:flex}#hud-text{background:#fff8eceb;border:3px solid var(--ink);border-radius:16px;padding:8px 12px;font-weight:800}#hud-actions{display:flex;gap:8px;pointer-events:auto}#hud-actions button{min-height:40px;padding:8px 12px;background:#fff}#tutorial{display:none;position:fixed;z-index:6;left:50%;top:72px;transform:translate(-50%);width:min(560px,calc(100% - 24px));background:#fff;border:3px solid var(--ink);border-radius:18px;padding:10px 12px;align-items:center;gap:10px;pointer-events:auto}#tutorial.on{display:flex}#tutorial p{font-weight:800;flex:1}#touch{display:none}#leftzone,#jumpzone{position:fixed;z-index:4;bottom:0;height:68%}#leftzone{left:0;width:46%}#jumpzone{right:0;width:46%}#stick{position:fixed;z-index:5;width:128px;height:128px;margin:-64px 0 0 -64px;border-radius:50%;border:3px solid var(--ink);background:#ffffff59;display:none;pointer-events:none}#stick.on{display:block}#nub{position:absolute;left:40px;top:40px;width:48px;height:48px;border-radius:50%;background:var(--sun);border:3px solid var(--ink)}#jump{position:fixed;z-index:5;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));width:104px;height:104px;border-radius:50%;font-size:22px;background:#ff7a59;color:#fff;-webkit-text-stroke:0}@media(pointer:coarse),(hover:none){#touch.play{display:block}}#rotate{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#8fd4ff;align-items:center;justify-content:center;text-align:center;padding:24px}#rotate strong{display:block;font-size:28px;margin-bottom:8px}@media(orientation:portrait){#rotate{display:flex}}