.card{max-height:90dvh;overflow:auto}.rank-tools{display:flex;justify-content:flex-end;margin:8px 0}.rank-tools button{border:1px solid #bccbbd;border-radius:20px;background:#fff9;color:#245d4c;padding:8px 14px;font:inherit;font-weight:700}.rank-table{width:100%;border-collapse:collapse;font-size:14px}.rank-table td,.rank-table th{padding:10px 5px;border-bottom:1px solid #dce4dc;text-align:left}.rank-table td:last-child{text-align:right;font-variant-numeric:tabular-nums}.rank-date{display:block;margin-top:3px;font-size:11px;font-weight:400;color:#63746d;font-variant-numeric:tabular-nums}.rank-table .mine{background:#e6efdf}.rank-table td:nth-child(2){max-width:180px;overflow-wrap:anywhere}.rank-form{margin:16px 0;padding:14px;background:#e6efdf;border-radius:12px}.rank-form input{box-sizing:border-box;width:100%;padding:10px;margin:6px 0 10px;border:1px solid #bccbbd;border-radius:8px;font-size:16px}.rank-note{font-size:12px;color:#63746d;white-space:pre-wrap}.rank-form button:disabled{opacity:.6}.rank-close{float:right;border:1px solid #ccc;background:white;padding:8px 12px;border-radius:8px;font:inherit}#ranking{z-index:20;align-items:flex-start;padding-top:max(env(safe-area-inset-top),clamp(24px,6dvh,56px));padding-bottom:max(18px,env(safe-area-inset-bottom));height:100dvh}#ranking .card{max-height:100%;overscroll-behavior:contain}
.overlay{position:fixed;inset:0;background:#233c36b3;display:flex;align-items:center;justify-content:center;padding:18px;z-index:10}
.overlay[hidden],#resultBtn[hidden]{display:none}
#result .card{position:relative}#result .eyebrow{padding-right:42px}#resultClose{position:absolute;right:12px;top:12px;width:44px;height:44px;border:0;border-radius:50%;background:#e6efdf;color:#245d4c;font-size:28px;line-height:1;cursor:pointer}
.card{background:var(--paper);border-radius:20px;padding:22px 20px;max-width:400px;width:100%;box-shadow:0 10px 30px #0003}
.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:750;color:var(--green);margin:0 0 4px}
.result-score{text-align:center;margin:4px 0 10px}
.result-score b{display:block;font-size:52px;color:var(--green);line-height:1.1}
.result-score small{font-size:13px;color:var(--muted)}
.stats{display:grid;grid-template-columns:1fr auto;gap:5px 10px;font-size:14px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0}
.stats dd{margin:0;font-weight:800;text-align:right}
.msg{font-size:14px;margin:12px 0;text-align:center;font-weight:650}
.link-btn[hidden]{display:none}
.link-btn{display:block;margin:10px auto 0;background:none;border:0;color:var(--muted);font-size:13px;text-decoration:underline;cursor:pointer}

#resultBtn[hidden],#quitBtn[hidden],.link-btn[hidden],#bestCelebration[hidden]{display:none}
#quitBtn{display:block;margin:12px auto}#rankVersion{font:inherit;font-size:16px;padding:8px;width:100%;background:#fff;border:1px solid #bccbbd;border-radius:8px;color:#233c36;margin:6px 0 12px}
#bestCelebration{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:20px}#bestCelebration i{position:absolute;left:var(--x);top:0;width:7px;height:13px;background:#d8ac45;animation:best-confetti 1.5s var(--delay) ease-out both}#bestCelebration i:nth-child(3n){background:#72a389}#bestCelebration i:nth-child(2n){border-radius:50%;background:#dd8757}.new-best .result-score b{animation:best-pop .65s ease-out}.new-best #rBest{display:inline-block;color:#835c1c;background:#fff0c5;border:1px solid #e5c36b;padding:4px 14px;border-radius:20px;font-weight:800}.new-best .card{box-shadow:0 0 0 2px #d8ac45,0 10px 30px #0003}
@keyframes best-pop{0%{transform:scale(.8)}55%{transform:scale(1.13)}100%{transform:scale(1)}}@keyframes best-confetti{0%{transform:translateY(-20px) rotate(0);opacity:0}15%{opacity:1}100%{transform:translateY(280px) rotate(var(--turn));opacity:0}}
@media(prefers-reduced-motion:reduce){#bestCelebration{display:none}.new-best .result-score b{animation:none}}
#result .go{display:block;width:100%;border:0;background:#245d4c;color:#fff;font-weight:800;font-size:17px;border-radius:12px;padding:12px;cursor:pointer;animation:none}#result .go:active{background:#184737}#result .go:disabled{cursor:default;background:#a3b0a8;color:#fff;opacity:1}

/* 共通のプレイ中ヘッダー：スコアと残り時間を横並びにする。 */
#app .head{grid-template-columns:36px minmax(0,1fr) minmax(0,1fr) 36px;gap:4px;min-height:78px}
#app .head>a,#app .head>.icon-btn{width:36px}
#app .head .scorebox{min-width:0}
#app .head #score{font-size:clamp(28px,8.5vw,40px)}
.game-timer{text-align:center;border-left:1px solid #63746d40;color:var(--fg,var(--ink));font-variant-numeric:tabular-nums;white-space:nowrap}
.game-timer small{display:block;font-size:12px;font-weight:800;color:var(--fg2,var(--muted));letter-spacing:.08em}
.game-timer b{display:block;font-size:clamp(28px,8.5vw,40px);font-weight:900;line-height:1.05;letter-spacing:-.02em}
.game-timer.ending b{color:#ad402b}body.dark .game-timer.ending b{color:#ffb99e}
#app .head #gain{top:40px;font-size:15px}

.rank-tools{gap:6px;flex-wrap:wrap;align-items:center}
#retryBtn{background:#245d4c;color:#fff;border:1px solid #245d4c;border-radius:12px;padding:8px 14px;font:inherit;font-weight:800;cursor:pointer;min-height:36px;white-space:nowrap}
#retryBtn:hover{background:#184737}#retryBtn:focus-visible{outline:3px solid #d9aa48;outline-offset:2px}#retryBtn[hidden]{display:none}
.info .rank-tools{flex-wrap:nowrap}.info #retryBtn{font-size:12px;padding:6px 10px;min-height:34px}

.demobar small[hidden]{display:none}

.game-rules{position:relative;margin:3px 0 5px;border:1px solid #bccbbd;border-radius:10px;background:#fffffff0;color:#233c36}
.game-rules summary{padding:7px 12px;font-size:13px;font-weight:800;cursor:pointer;min-height:34px;box-sizing:border-box}
.game-rules summary:focus-visible{outline:3px solid #cf9b40;outline-offset:2px;border-radius:10px}
.game-rules .legend{margin:0;border-radius:0 0 10px 10px;max-height:45dvh;overflow:auto;overscroll-behavior:contain;background:transparent}
.game-rules[open] summary{border-bottom:1px solid #dce4dc}

.game-rules:not([open]) .legend{display:none}

.rank-ctl{display:inline-block;margin-left:6px;padding:0 8px;border-radius:10px;background:#e6efdf;border:1px solid #a9c2b5;color:#245d4c;font-size:11px;font-weight:700;vertical-align:1px}