:root{color:#073949;font-family:Hiragino Sans,Yu Gothic UI,Yu Gothic,Noto Sans JP,sans-serif;background:#0b8797;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{overflow-x:hidden;overscroll-behavior-y:contain}button,input{font:inherit}button{border:0;border-radius:8px;min-height:44px;padding:0 14px;color:#053041;background:#fff;font-weight:800;box-shadow:0 3px #05304133;cursor:pointer;transition:transform .08s ease}button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px #05304133}button:disabled{cursor:default;opacity:.65}.primary{color:#fff;background:#e63b2e}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.app-shell{min-height:100svh;display:grid;place-items:center;padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:radial-gradient(circle at 10% 0%,rgba(255,226,102,.75),transparent 24rem),linear-gradient(145deg,#0b8797,#51c6c0 46%,#ffe487)}.game-card{--avail: calc(100svh - 330px) ;width:min(100%,430px);display:grid;gap:8px;align-content:start}.game-card.playing{--avail: calc(100svh - 158px) }.game-card.playing .ranking{display:none}.hud{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hud>div{min-width:0;border:2px solid rgba(255,255,255,.65);border-radius:8px;padding:6px 8px 7px;color:#fff;background:#0530419e;box-shadow:0 8px 20px #05304124;transition:background .2s ease,border-color .2s ease}.hud>div.urgent{border-color:#ffb4ad;background:#961a12c7;animation:pulse .9s ease-in-out infinite}@keyframes pulse{50%{background:#d62c21d9}}.hud span,.result-grid span,.name-field span{display:block;font-size:11px;font-weight:700;line-height:1.2;opacity:.82}.hud strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(20px,7.6vw,30px);line-height:1;letter-spacing:0;font-variant-numeric:tabular-nums}.hud .sub{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:3px;font-size:10px;font-style:normal;font-weight:700;opacity:.8}.hud .bar{display:block;height:5px;margin-top:5px;border-radius:999px;background:#ffffff47;overflow:hidden}.hud .bar b{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ffe487,#59e0b4);transition:width .25s linear}.checklist{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.checklist span{min-height:34px;display:grid;place-items:center;border-radius:8px;color:#073949;background:#ffffffb8;border:2px solid rgba(255,255,255,.9);font-size:12px;font-weight:800;text-align:center;line-height:1.1;transition:background .18s ease,color .18s ease,transform .18s ease}.checklist .checked{color:#fff;background:#168f5c;border-color:#bdf6c9;transform:translateY(-2px)}.canvas-wrap{position:relative;overflow:hidden;aspect-ratio:390 / 844;height:min(var(--avail),calc(min(100vw - 20px,430px)*2.1641));width:auto;max-width:100%;min-height:300px;margin-inline:auto;border-radius:8px;background:#90e6ff;box-shadow:0 18px 46px #0530413d;touch-action:none}.game-canvas{display:block;width:100%;height:100%;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.canvas-controls{position:absolute;top:8px;right:8px;display:flex;gap:6px}.canvas-controls .icon{min-height:36px;min-width:36px;padding:0;display:grid;place-items:center;border-radius:999px;font-size:16px;background:#ffffffdb;box-shadow:0 2px #0530413d}.overlay{position:absolute;inset:0;display:grid;place-items:center;padding:14px;background:#041f2c47}.countdown-overlay{background:none;pointer-events:none}.panel{width:min(100%,340px);max-height:100%;overflow-y:auto;border-radius:10px;padding:16px;background:#fffffff2;box-shadow:0 14px 40px #0530413d}.panel.compact{text-align:center}.eyebrow{margin:0 0 5px;color:#d23328;font-size:12px;font-weight:900}h1,h2{margin:0;letter-spacing:0;line-height:1.05}h1{font-size:clamp(30px,9vw,44px)}h2{font-size:clamp(30px,9vw,42px)}.panel p{line-height:1.5}.lead{margin:10px 0;font-size:14px;font-weight:700}.rules{display:grid;gap:5px;margin:0 0 12px;padding:10px;border-radius:8px;background:#0b87971a;list-style:none;text-align:left;font-size:12.5px;line-height:1.35}.rules b{color:#0b6d7c}.best,.record{margin:0 0 10px;font-size:13px;font-weight:900}.best{color:#0b6d7c}.record{color:#d23328}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.result-grid>div{border-radius:8px;padding:7px 10px;background:#0b87971f}.result-grid span{opacity:.7}.result-grid strong{display:block;font-size:20px;line-height:1.2}.actions button{padding:0 8px;font-size:14px;white-space:nowrap}.name-field{display:grid;gap:5px}.name-field input{width:100%;min-height:44px;border:2px solid #b7dbe2;border-radius:8px;padding:0 10px;color:#073949;background:#fff;font-weight:800}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.save-note{min-height:20px;margin:8px 0 0;font-size:12px;font-weight:700}.save-note.saved{color:#168f5c}.save-note.error{color:#c2410c}.ranking{border-radius:8px;padding:10px;background:#ffffffd9;box-shadow:0 8px 20px #05304124}.ranking-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.ranking-title button{min-height:34px;padding:0 10px;background:#f5d15b}.ranking ol{display:grid;gap:5px;max-height:160px;overflow-y:auto;margin:8px 0 0;padding:0;list-style:none}.ranking li{min-height:30px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:8px;border-radius:7px;padding:5px 8px;background:#ffffffbf;font-size:13px;font-weight:800}.ranking li.top{background:#ffe48799}.ranking li span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ranking li em{font-style:normal;font-size:10.5px;font-weight:700;opacity:.66;white-space:nowrap}.ranking .empty{display:flex;justify-content:center;color:#073949b8}@media(min-width:780px)and (orientation:landscape){.game-card,.game-card.playing{--avail: calc(100svh - 150px) ;width:min(100%,900px);grid-template-columns:minmax(300px,1fr) 300px;align-items:start}.hud,.checklist,.canvas-wrap{grid-column:1}.game-card.playing .ranking{display:block}.ranking{grid-column:2;grid-row:1 / span 3}.ranking ol{max-height:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}