*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#f5eddf;color:#34332f;font:15px system-ui,sans-serif}body{max-width:1100px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}small{font-size:10px;letter-spacing:.2em;color:#77756b}h1{font-family:Georgia,serif;font-weight:500;font-size:36px;letter-spacing:-1.2px;margin:5px 0}button{border:1px solid #d1c6b6;border-radius:20px;background:#fffcf5;color:inherit;padding:10px 17px;cursor:pointer;font:inherit;touch-action:none}button:hover{background:#e9dcc5}button:focus-visible{outline:3px solid #5796a2}#stage{position:relative;aspect-ratio:4/3;max-height:70vh;margin:auto;border-radius:20px;overflow:hidden;box-shadow:0 15px 55px #3f342518;background:#ccdad1}canvas{display:block;width:100%;height:100%;object-fit:contain}#enhanced{position:absolute;inset:0}#enhanced[hidden]{display:none}#mode,#progress{position:absolute;top:15px;border-radius:16px;background:#fffdf0d9;padding:7px 12px;font-size:12px;pointer-events:none}#mode{left:15px}#progress{right:15px}footer{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;color:#706b60}footer b{color:#444}footer p{line-height:1.8}.actions{display:flex;align-items:center;gap:8px}.actions button{font-size:12px}.actions span{max-width:230px}#touch{display:flex;justify-content:space-between;align-items:center;margin-top:8px}.dpad{display:grid;grid-template-columns:repeat(3,48px);gap:4px}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-column:1}.jump{width:92px;height:70px;background:#e9b596;font-weight:700}@media(pointer:fine){#touch{display:none}}@media(max-width:650px){body{padding:12px}header{margin-bottom:10px}h1{font-size:30px}footer{display:block}.actions{flex-wrap:wrap}#mode,#progress{font-size:10px;top:8px;padding:5px 8px}#progress{right:8px}#mode{left:8px}}

/* Hold controls never select text or open a mobile callout. */
button,#touch,#stage{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button,#touch{-webkit-tap-highlight-color:transparent}#touch{padding:6px 16px 16px;touch-action:none;gap:32px}.stick-wrap{display:grid;justify-items:center;gap:8px}#stick{width:126px;height:126px;position:relative;border-radius:50%;border:1px solid #c8c0ad;background:radial-gradient(circle,#e0d5bf 0 2px,transparent 3px),#eee4d1;box-shadow:inset 0 2px 10px #67563718;touch-action:none}.knob{position:absolute;left:39px;top:39px;width:48px;height:48px;border-radius:50%;background:#fdf9ed;border:1px solid #b7b3a1;box-shadow:0 4px 10px #59472b26;pointer-events:none}#stick.held .knob{background:#a9cbb9;border-color:#729a84}.jump{width:104px;height:104px;border-radius:50%;background:#eac09e;box-shadow:0 5px 0 #c79f80;font-weight:600;display:grid;place-content:center;gap:2px}.jump span{font-size:26px;pointer-events:none}.jump.held{transform:translateY(4px);box-shadow:0 1px 0 #c79f80;background:#dba982}@media(max-width:650px){#touch{display:flex}#stage{max-height:none}footer p{margin:10px 0}header small{letter-spacing:.12em}}