:root{color-scheme:light;font-family:Hiragino Kaku Gothic ProN,Yu Gothic,Meiryo,system-ui,sans-serif;background:#017a95;color:#10232b;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;min-height:100dvh;margin:0;overflow:hidden;touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none}button,input{font:inherit}.shell{position:relative;width:100%;height:100dvh;min-height:100dvh;overflow:hidden;background:#017a95}#game{position:absolute;inset:0}#game canvas{display:block;width:100%!important;height:100%!important}.hud{position:absolute;inset:calc(var(--safe-top) + 10px) 10px auto 10px;z-index:4;display:grid;gap:7px;pointer-events:none;opacity:0;transition:opacity .22s ease}body.is-playing .hud{opacity:1}.hud__top{display:grid;grid-template-columns:1fr auto;align-items:start;gap:8px}.hud__right{display:grid;justify-items:end;gap:6px}.hud__buttons{display:flex;gap:6px;pointer-events:auto}.icon-button{display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid rgba(255,255,255,.75);border-radius:10px;background:#f6fffcdb;font-size:17px;line-height:1;cursor:pointer;box-shadow:0 4px 14px #00314033}.icon-button[hidden]{display:none}.stats{display:flex;gap:8px;min-width:0}.stat{min-width:70px;padding:7px 9px;border:1px solid rgba(255,255,255,.7);border-radius:10px;background:#f6fffcd9;box-shadow:0 6px 18px #0031402e;color:#12333d;transition:background .2s ease,color .2s ease}.stat strong{display:block;font-size:12px;line-height:1;color:#216273}.stat span{display:block;margin-top:3px;font-size:20px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}.stat--time.is-urgent{background:#ffe2e2f0;animation:urgent-pulse 1s ease-in-out infinite}.stat--time.is-urgent span{color:#c02742}@keyframes urgent-pulse{50%{box-shadow:0 0 0 4px #ff788c59}}.current{padding:6px 9px;border:1px solid rgba(255,255,255,.7);border-radius:10px;background:#fff9cfdb;font-size:12px;font-weight:800;color:#4c3a11;box-shadow:0 6px 18px #0031402e}.combo{justify-self:start;min-width:148px;padding:6px 9px 7px;border-radius:10px;background:#175868d1;color:#f2ffff;box-shadow:0 6px 18px #00314038;transition:opacity .18s ease,transform .18s ease}.combo.is-idle{opacity:0;transform:translateY(-6px)}.combo__label{font-size:12px;font-weight:800;letter-spacing:.02em}.combo__label b{color:#ffe07a}.combo__bar{height:5px;margin-top:4px;overflow:hidden;border-radius:999px;background:#ffffff40}.combo__fill{width:100%;height:100%;background:linear-gradient(90deg,#ffe07a,#7ef0ff);transform-origin:left}.oxygen{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px}.oxygen__label,.oxygen__depth{padding:3px 7px;border-radius:999px;background:#175868c7;color:#eafcff;font-size:11px;font-weight:800;white-space:nowrap}.meter{height:14px;overflow:hidden;border:2px solid rgba(255,255,255,.9);border-radius:8px;background:#05303e66;box-shadow:0 2px 10px #00375033}.meter__fill{width:100%;height:100%;background:linear-gradient(90deg,#fff9b0,#62d6ff);transform-origin:left;transition:transform .12s linear}.meter__fill.is-low{background:linear-gradient(90deg,#ffd0d0,#ff6b81);animation:low-blink .62s ease-in-out infinite}@keyframes low-blink{50%{opacity:.55}}body.is-counting .hud{opacity:.35}.overlay{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:calc(var(--safe-top) + 14px) 14px calc(var(--safe-bottom) + 14px);background:linear-gradient(180deg,#017a95bd,#024d70db);color:#12333d}.panel{width:min(440px,100%);max-height:calc(100dvh - var(--safe-top) - var(--safe-bottom) - 28px);overflow:auto;padding:18px;border:1px solid rgba(255,255,255,.8);border-radius:14px;background:#f8fffbf2;box-shadow:0 18px 44px #002d3f42;-webkit-overflow-scrolling:touch}.panel--slim{width:min(320px,100%);text-align:center}.panel h1,.panel h2{margin:0 0 8px;font-size:27px;line-height:1.14}.panel .panel-subtitle{margin-top:14px;font-size:17px}.panel p{margin:0 0 12px;line-height:1.6}.lead{font-size:14px;color:#235d69}.howto{display:grid;gap:6px;margin:0;padding:12px 12px 12px 28px;border-radius:10px;background:#d5f7f299;font-size:13px;line-height:1.5}.howto b{color:#0e6a7d}.result-head{display:flex;align-items:center;gap:12px;margin-bottom:10px}.result-head h2{margin:0}.rank{display:grid;place-items:center;width:62px;height:62px;flex:0 0 auto;border-radius:50%;background:linear-gradient(140deg,#8fd8e6,#3f9fb5);color:#fff;font-size:32px;font-weight:900;box-shadow:inset 0 -3px #0000001f}.rank[data-rank=S]{background:linear-gradient(140deg,#ffe37a,#f2a52c)}.rank[data-rank=A]{background:linear-gradient(140deg,#ffd0e5,#e5749f)}.rank[data-rank=B]{background:linear-gradient(140deg,#bfe9a8,#55ab6c)}.rank-title{margin:0!important;font-size:14px;font-weight:700;color:#2f6972}.result-score{margin:0 0 8px!important;font-size:16px}.result-score strong{font-size:40px;line-height:1;color:#0d6a7c;font-variant-numeric:tabular-nums}.record{margin:0 0 10px!important;padding:7px 10px;border-radius:8px;background:#fff2c2;font-weight:800;color:#7a5410}.breakdown,.harvest,.leaderboard{display:grid;gap:6px;margin:10px 0 0;padding:0;list-style:none;font-size:14px}.breakdown li,.harvest li,.leaderboard li{display:flex;justify-content:space-between;gap:10px;padding:7px 10px;border-radius:8px;background:#d5f7f2d1}.breakdown li{background:#fff5d6cc}.harvest li.is-empty{opacity:.45}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.actions--primary{margin-top:4px}.button{flex:1 1 auto;min-height:46px;padding:10px 14px;border:0;border-radius:10px;background:#ffcf4d;color:#172b32;font-weight:800;cursor:pointer;box-shadow:0 4px #d99b1d}.button:active{transform:translateY(2px);box-shadow:0 2px #d99b1d}.button--ghost{background:#d9fbff;box-shadow:0 4px #74bdc8}.button--ghost:active{box-shadow:0 2px #74bdc8}.nickname{display:grid;gap:8px;margin-top:12px}.nickname label{font-size:13px;font-weight:700;color:#2f6972}.nickname input{width:100%;min-height:46px;padding:9px 11px;border:2px solid #78cbd0;border-radius:10px;background:#fff}.message{min-height:20px;margin-top:8px!important;font-size:13px;color:#2f6972}.hidden{display:none}@media(max-width:370px){.stat{min-width:62px;padding-inline:7px}.stat span{font-size:18px}.panel h1,.panel h2{font-size:23px}}@media(prefers-reduced-motion:reduce){.stat--time.is-urgent,.meter__fill.is-low{animation:none}}