:root{font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",system-ui,sans-serif;color:#17334e;background:#fff7cf;touch-action:manipulation}*{box-sizing:border-box}body{margin:0;min-height:100vh;overflow-x:hidden;background:radial-gradient(circle at 10% 20%,#fff 0 4%,transparent 4.2%),linear-gradient(155deg,#8ce2ff,#e8fbff 55%,#fff1a8);user-select:none}.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 max(16px,calc((100vw - 1040px)/2));background:#fff9;border-bottom:3px solid #fff}.brand{color:#154c76;text-decoration:none;font-weight:900;letter-spacing:.07em}.brand b{color:#ff5e68}.tiny,.sub-buttons button{border:0;border-radius:999px;background:#fff;color:#28506c;padding:9px 14px;font-weight:800;box-shadow:0 3px 0 #b6d7df}main{width:min(1040px,100%);margin:auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:30px;padding:24px}.intro{align-self:center}.eyebrow{font-size:.78rem;font-weight:900;letter-spacing:.18em;color:#e84d73}.intro h1{margin:4px 0;font-size:clamp(2.4rem,5vw,4.6rem);line-height:1;color:#174b75;text-shadow:3px 3px #fff}.intro h1 span{color:#ff5c69}.lead{font-size:1.2rem;line-height:1.8}.lead b{color:#d93d65;font-size:1.35em}.steps{display:flex;gap:8px;flex-wrap:wrap}.steps span{background:#fff;border:3px solid #6bd1ec;border-radius:16px;padding:10px;font-weight:900}.record{margin-top:18px;width:190px;background:#214d70;color:white;border-radius:20px;padding:12px 18px;display:grid}.record strong{font-size:1.5rem;color:#ffeb69}.game-card{max-width:520px;width:100%;justify-self:center;background:#fff;border:5px solid #fff;border-radius:28px;box-shadow:0 18px 50px #376b7950;padding:10px}.hud{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:8px}.hud div{text-align:center;background:#e9faff;border-radius:14px;padding:5px}.hud small{display:block;font-weight:800;color:#48728a}.hud b{font-size:1.25rem}.stage{height:min(60vh,520px);min-height:390px;position:relative;overflow:hidden;border-radius:22px;background:linear-gradient(#49c7f6 0 57%,#bdf2a3 57% 100%);outline:none;cursor:pointer;touch-action:none}.sky-deco{position:absolute;opacity:.75}.sun{font-size:50px;right:18px;top:22px}.rainbow{font-size:65px;left:12px;bottom:120px}.level{position:absolute;top:10px;left:50%;transform:translateX(-50%);background:#fffbdc;padding:5px 13px;border-radius:20px;font-weight:900}.lane{position:absolute;left:5%;right:5%;top:24%;height:104px;border-radius:55px;background:#ffffff4d;border:3px dashed #fff}.target{position:absolute;right:7%;top:4px;width:96px;height:96px;border:10px solid #ffeb67;border-radius:50%;box-shadow:0 0 0 5px #ff6975,0 0 25px #fff}.target i{position:absolute;inset:34%;background:#fff;border-radius:50%}.note{position:absolute;left:-80px;top:2px;width:100px;height:100px;display:grid;place-items:center;font-size:62px;filter:drop-shadow(0 5px 2px #26789466);will-change:transform}.note.gold{filter:drop-shadow(0 0 12px #fff067)}.note.gold span:after{content:"★";font-size:25px;position:absolute;color:#ff9d00}.tanuki{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);width:154px;height:164px;text-align:center;background:#9a663e;border-radius:50% 50% 35% 35%;border:6px solid #704425;color:#fff}.ears{font-size:40px;letter-spacing:26px;margin-left:22px;margin-top:-22px;color:#704425}.face{font-size:40px;font-weight:900;background:#f6dfb8;color:#51351f;border-radius:50%;margin:0 20px;padding:7px 0}.drum{font-size:60px;margin-top:-4px;transform-origin:center}.drum.hit{animation:hit .18s}.judge{position:absolute;top:48%;left:0;right:0;text-align:center;font-weight:1000;font-size:2rem;color:#fff;text-shadow:0 3px #c63060;z-index:3;opacity:0}.judge.show{animation:judge .55s}.fever{position:absolute;top:12%;left:5%;right:5%;padding:8px;text-align:center;border-radius:20px;background:#fff26e;color:#dc3e62;font-weight:1000;z-index:4;animation:pulse .5s infinite alternate}.overlay{position:absolute;inset:0;z-index:6;display:grid;place-content:center;text-align:center;padding:24px;background:#19547ecc;color:#fff}.overlay[hidden]{display:none}.overlay h2{font-size:2rem;margin:0 0 8px}.overlay p{line-height:1.7}.overlay button{border:0;border-radius:999px;padding:15px 30px;background:#ffeb64;color:#573f12;font-size:1.2rem;font-weight:1000;box-shadow:0 5px 0 #dc9234}.tap-button{width:100%;margin-top:10px;border:0;border-radius:18px;padding:14px;background:linear-gradient(#ff7b75,#f24968);color:#fff;font-size:1.45rem;font-weight:1000;box-shadow:0 5px 0 #b92f50}.tap-button:active{transform:translateY(4px);box-shadow:0 1px 0 #b92f50}.tap-button:disabled{opacity:.55}.sub-buttons{display:flex;justify-content:center;gap:8px;margin-top:11px}.note-text{text-align:center;font-size:.75rem;margin:9px;color:#557083;font-weight:700}footer{text-align:center;padding:15px;color:#41718a;font-weight:900;letter-spacing:.18em}@keyframes hit{50%{transform:scale(1.22) rotate(-8deg)}}@keyframes judge{0%{opacity:0;transform:scale(.6)}25%{opacity:1;transform:scale(1.2)}100%{opacity:0;transform:translateY(-25px)}}@keyframes pulse{to{transform:scale(1.04)}}
@media(max-width:760px){main{display:block;padding:10px}.intro{text-align:center}.intro h1{font-size:2rem}.eyebrow,.lead,.steps{display:none}.record{position:absolute;top:66px;left:16px;z-index:8;width:auto;padding:5px 10px;font-size:.7rem}.record strong{font-size:1rem}.game-card{padding:7px}.stage{height:min(58vh,520px);min-height:380px}.topbar{height:52px}.hud b{font-size:1.05rem}footer{display:none}}@media(max-height:670px) and (max-width:760px){.intro h1{font-size:1.35rem;margin:0}.stage{height:390px;min-height:330px}.sub-buttons,.note-text{display:none}.tap-button{padding:10px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}
.note{left:0}

#lives{color:#e53c64;letter-spacing:.08em}.visitor{position:absolute;top:18%;left:0;right:0;text-align:center;font-size:.8rem;font-weight:900;color:#174b75}.visitor-parade{font-size:1.65rem;letter-spacing:.04em;margin:4px 0!important}.survival{text-align:center;font-weight:900;color:#28506c;font-size:.8rem;margin:10px 0 0}.overlay p{margin:10px 0}.note.gold span:after{content:none}.note.gold{filter:drop-shadow(0 0 12px #fff067)}
@media(max-width:760px){.record{position:static;display:flex;align-items:center;gap:8px;width:fit-content;margin:7px auto;z-index:auto}.hud small{font-size:.7rem}.sub-buttons{display:flex}}