:root{color-scheme:dark;font-family:system-ui,-apple-system,"Noto Sans JP",sans-serif;color:#f6f8f5;background:#13252c;font-size:16px}*{box-sizing:border-box}body{margin:0}button,summary{font:inherit;cursor:pointer}button{border:1px solid #ffffff55;border-radius:6px;background:#14282bbd;color:#fff;padding:12px 18px;min-height:46px;backdrop-filter:blur(15px)}button:hover:not(:disabled){background:#32515b}button:focus-visible,summary:focus-visible{outline:3px solid #f8dea4;outline-offset:4px}button:disabled{opacity:.48;cursor:default}[hidden]{display:none!important}#window{position:relative;min-height:600px;height:100svh;isolation:isolate;overflow:hidden}.scenery{position:absolute;width:100%;height:100%;object-fit:cover;filter:blur(5px) brightness(.68) saturate(.65);transform:scale(1.035);z-index:-3}.shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(#08191c9c,transparent 30%,transparent 57%,#07171ceb 100%);box-shadow:inset 0 0 100px #051217a8}canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}header{padding:28px 36px;display:flex;align-items:center;justify-content:space-between}h1{font-family:serif;font-weight:500;font-size:clamp(20px,2.2vw,28px);letter-spacing:.1em;margin:0}.quiet{background:transparent;font-size:14px}.intro{position:absolute;top:94px;left:0;right:0;text-align:center;pointer-events:none;text-shadow:0 2px 18px #000}.intro .mainline{font-family:serif;font-size:clamp(20px,2.5vw,30px);letter-spacing:.07em;margin:0 16px 6px}.intro p+p{margin:0;font-size:14px;color:#dde6e7}#choices{position:absolute;inset:0;pointer-events:none}.drop-choice{position:absolute;transform:translate(-50%,-50%);padding:0;background:transparent;border:1px solid #ffffff70;border-radius:50%;height:48px;width:48px;min-height:0;pointer-events:auto;backdrop-filter:none;font-family:serif;font-size:22px;text-shadow:0 2px 4px #000;transition:border-color .2s,box-shadow .2s}.drop-choice:hover:not(:disabled){background:#ffffff22}.drop-choice[aria-pressed=true]{border:2px solid #ffdfa1;box-shadow:0 0 0 5px #ffdf9c22;color:#ffdfa1}.drop-choice:disabled{opacity:1;cursor:default}.finishline{position:absolute;left:5.5%;right:5.5%;top:71.02%;height:0;border-top:1px solid #eef5ef66;text-align:right;pointer-events:none}.finishline span{position:absolute;right:0;bottom:8px;display:inline-block;font-size:12px;letter-spacing:.15em;margin-bottom:10px;color:#d4dcdb}footer{position:absolute;bottom:18px;left:36px;right:36px;max-width:900px;margin:0 auto}.statusrow{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;min-height:40px}.statusrow p{margin:8px 0}#timer{font-variant-numeric:tabular-nums;color:#d6dedb}.controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.primary{background:#f0eadb;color:#1a3034;border-color:#f0eadb;font-weight:600;min-width:240px}.primary:hover:not(:disabled){background:#fff8e9}.footnote{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#b9c8ca;margin-top:12px}.footnote details{text-align:right}.footnote details p{max-width:560px;text-align:left;line-height:1.7;padding:0 12px}.footnote details[open]{position:absolute;bottom:0;right:0;background:#10282cf5;border:1px solid #6a7d7d;border-radius:8px;padding:15px;width:min(100%,560px);z-index:5}.footnote summary{font-size:12px}a{color:#e8ddb6}.result{position:absolute;left:50%;top:34%;transform:translateX(-50%);width:min(90%,540px);text-align:center;background:#10252be8;backdrop-filter:blur(14px);border-top:1px solid #ffffff55;border-bottom:1px solid #ffffff33;padding:22px 20px;border-radius:3px}.result p{font-size:14px;line-height:1.7;color:#d3dfdf;margin:6px}.result h2{text-wrap:balance;font-family:serif;font-weight:500;font-size:clamp(25px,4vw,38px);margin:12px 0;color:#f6e7c5}#toast{position:absolute;left:50%;top:12%;transform:translateX(-50%);font-size:14px;color:#e6eceb;pointer-events:none;white-space:nowrap}@media(max-width:600px){#window{min-height:600px}header{padding:22px 20px}h1{font-size:19px;letter-spacing:.04em}header button{padding:9px 12px}footer{left:20px;right:20px;bottom:14px}.controls{gap:8px}.primary{min-width:0;flex:1}.controls button{font-size:14px;padding:11px 13px}#replay{flex:1}#reset{padding:10px 8px}.intro{top:94px}.intro .mainline{font-size:20px}.drop-choice{width:44px;height:44px}.statusrow{font-size:13px}.result{top:32%}}@media(prefers-reduced-motion:reduce){button{transition:none}}

@media(max-height:600px){header{padding:16px 20px}.intro{top:80px}.intro .mainline{font-size:18px}.intro p+p{display:none}footer{bottom:10px}.result{top:28%;padding:14px}.result h2{font-size:24px}}
footer{padding-bottom:env(safe-area-inset-bottom,0px)}

.drop-choice[aria-pressed=true]::after{content:"▼";position:absolute;top:calc(100% + 2px);left:50%;transform:translateX(-50%);font:10px/1 system-ui;color:inherit;text-shadow:0 1px 3px #000;pointer-events:none}
.footnote details[open]{max-height:calc(100svh - 110px);overflow:auto}