:root{--ink:#10243a;--paper:#fffaf0;--leaf:#2f8f6b;--oil:#f4b942;--milk:#f7f3e8;--bad:#8b5fbf;--blue:#3578a8}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(150deg,#e8f2ef,#c5d8df);color:var(--ink);font-family:Inter,"Noto Sans JP",sans-serif}.site-head{width:min(760px,calc(100% - 16px));height:54px;margin:8px auto;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#fff;border:2px solid var(--ink);border-radius:14px;box-shadow:0 4px 0 #10243a22}.site-head a{color:var(--ink);font-weight:900;text-decoration:none}.track{padding:5px 8px;background:#28527a;color:#fff;border-radius:4px;font-size:11px;font-weight:900}.card{width:min(760px,calc(100% - 16px));margin:0 auto 28px;background:var(--paper);border:3px solid var(--ink);border-radius:24px;overflow:hidden;box-shadow:0 8px 0 #10243a22}.hero{height:230px;display:grid;place-items:center;background:#dff1e7;border-bottom:2px solid #9ab3ad}.hero img{width:100%;height:100%;object-fit:cover}.copy{padding:20px}.eyebrow{margin:0;color:#28527a;font-size:12px;font-weight:950;letter-spacing:.1em}h1{margin:6px 0 5px;font-size:clamp(36px,8vw,62px);line-height:1.02;letter-spacing:-.04em}.dek{margin:0 0 14px;color:#476073;font-weight:800}.info{margin:10px 0;padding:12px 14px;background:#fff;border:1px solid #a9b8c5;border-left:5px solid #f36f45;border-radius:9px;line-height:1.6}.info b{display:block;font-size:13px}.info p{margin:3px 0 0}.rule{border-left-color:#28527a;background:#f7fbff}.start{width:100%;min-height:56px;margin-top:8px;border:3px solid var(--ink);border-radius:11px;background:#f8c35a;box-shadow:0 5px 0 var(--ink);font:inherit;font-weight:950;font-size:18px;cursor:pointer}.start:active,.ctrl:active,.result button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}#game{display:none;padding:12px}.hud{display:flex;justify-content:space-between;gap:8px;margin-bottom:8px;font-weight:950}.meter{height:12px;flex:1;max-width:260px;background:#d8e3e7;border-radius:9px;overflow:hidden}.meter i{display:block;height:100%;width:100%;background:#f4b942;transform-origin:left}.arena{position:relative;height:min(58vh,510px);min-height:390px;overflow:hidden;border:2px solid #4c7c68;border-radius:18px;background:radial-gradient(circle at 18% 20%,#edf9f2 0 8%,transparent 9%),linear-gradient(#c9eddc,#8fcab2);touch-action:none}.vacuole{position:absolute;left:35%;top:28%;width:30%;height:44%;border:4px solid #6f4a91;border-radius:50%;background:#a986c455;display:grid;place-items:center;color:#513267;font-weight:950;text-align:center}.oil{position:absolute;width:64px;height:64px;border:3px solid #805a18;border-radius:50%;background:radial-gradient(circle at 35% 32%,#ffe39a 0 18%,#f4b942 19% 100%);box-shadow:inset -6px -8px 0 #d88c22;transform:translate(-50%,-50%)}.protein{position:absolute;width:36px;height:36px;border:3px solid #50758b;border-radius:50% 50% 45% 55%;background:#fffdf5;box-shadow:inset -5px -5px 0 #d8eef1;transform:translate(-50%,-50%);z-index:4}.cluster{position:absolute;left:12px;bottom:12px;display:flex;gap:3px;align-items:flex-end;min-height:52px}.cluster i{width:18px;height:18px;border:2px solid #50758b;border-radius:50%;background:#fffdf5;animation:pop .2s}.flash{position:absolute;left:50%;top:14%;transform:translate(-50%,-50%);padding:7px 12px;border-radius:20px;background:#10243ae8;color:#fff;font-weight:950;opacity:0;pointer-events:none;z-index:8;white-space:nowrap}.flash.show{animation:flash .55s}.controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.ctrl{min-height:58px;border:3px solid var(--ink);border-radius:12px;background:#fff;box-shadow:0 4px 0 var(--ink);font:inherit;font-weight:950;font-size:22px;touch-action:none}.result{display:none;padding:28px 20px;text-align:center}.result h2{font-size:34px;margin:0}.result .score{font-size:58px;font-weight:950;color:#28527a}.result small{font-size:18px}.result p{max-width:520px;margin:8px auto 18px}.result button{min-height:50px;margin:6px;padding:10px 16px;border:3px solid var(--ink);border-radius:11px;background:#fff;box-shadow:0 4px 0 var(--ink);font:inherit;font-weight:900}.result #replay{background:#f8c35a}@keyframes flash{0%{opacity:0;transform:translate(-50%,-20%)}25%,75%{opacity:1;transform:translate(-50%,-50%)}100%{opacity:0}}@keyframes pop{from{transform:scale(.3)}to{transform:scale(1)}}@media(max-width:520px){.copy{padding:16px}.hero{height:185px}h1{font-size:42px}.arena{height:54svh;min-height:370px}.vacuole{left:34%;width:32%}.ctrl{min-height:62px}.site-head{font-size:13px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important}}

/* A tap gives an immediate steering impulse; holding keeps applying thrust. */
.ctrl{user-select:none;-webkit-user-select:none}
.ctrl[aria-pressed="true"]{background:#dff1ff;transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}
.protein.steer-left,.protein.steer-right{filter:drop-shadow(0 0 7px #2a86c9);border-color:#28527a}
.protein.steer-left::after,.protein.steer-right::after{position:absolute;top:50%;color:#28527a;font-size:22px;font-weight:950;line-height:1;transform:translateY(-50%);text-shadow:0 1px #fff}
.protein.steer-left::after{content:"←";right:calc(100% + 6px)}
.protein.steer-right::after{content:"→";left:calc(100% + 6px)}