*{box-sizing:border-box;margin:0;padding:0}:root{--bg-top: #ffe27a;--bg-bottom: #ff9e5e;--ink: #4a2c14;--accent: #ff4f7b;--lane: #fff4d6}html,body,#root{height:100%}body{font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,sans-serif;color:var(--ink);background:linear-gradient(180deg,var(--bg-top),var(--bg-bottom));-webkit-user-select:none;user-select:none;overflow:hidden}.screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px;text-align:center;color:var(--ink);background:linear-gradient(180deg,var(--bg-top),var(--bg-bottom))}.title-logo{font-size:clamp(40px,8vw,80px);font-weight:800;letter-spacing:.05em;text-shadow:4px 4px 0 #fff;animation:logo-bounce 1s ease-in-out infinite}.title-logo-accent{color:var(--accent)}@keyframes logo-bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.title-subtitle{font-size:18px;font-weight:500}.title-screen{justify-content:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y}.stage-list{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));justify-content:center;width:min(100%,1180px)}.stage-card{font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:6px;width:220px;min-height:214px;padding:20px 16px;border:4px solid transparent;border-radius:20px;background:#ffffffd9;color:var(--ink);cursor:pointer;touch-action:manipulation;transition:transform .1s,border-color .1s}.stage-card:hover{transform:translateY(-4px)}.stage-card-selected{border-color:var(--accent);transform:translateY(-4px)}.stage-card-locked{opacity:.6;cursor:not-allowed}.stage-card-character{font-size:48px;line-height:1}.stage-card-medals{font-size:18px;min-height:1.2em;letter-spacing:4px}.stage-card-title{font-size:20px;font-weight:800}.stage-card-subtitle{font-size:12px;opacity:.75;min-height:2.4em}.stage-card-meta{font-size:13px;font-weight:800;color:var(--accent)}.stage-card-record{font-size:12px;opacity:.8;min-height:1.2em}.title-howto{background:#ffffffbf;border-radius:16px;padding:12px 28px;font-size:15px;line-height:1.9;color:#4a2c14}kbd{background:#4a2c14;color:#fff;border-radius:6px;padding:2px 10px;font-family:inherit;font-size:.9em}.start-button,.sub-button{font-family:inherit;font-size:24px;font-weight:800;padding:14px 48px;border:none;border-radius:999px;cursor:pointer;color:#fff;background:var(--accent);box-shadow:0 6px color-mix(in srgb,var(--accent) 60%,black);transition:transform .08s,box-shadow .08s}.start-button:active,.sub-button:active{transform:translateY(4px);box-shadow:0 2px color-mix(in srgb,var(--accent) 60%,black)}.start-button:disabled,.sub-button:disabled{cursor:not-allowed;opacity:.55;transform:none;box-shadow:0 6px #0000003d}.sub-button{font-size:18px;background:#7a86ff;box-shadow:0 6px #4a55c2}.sub-button:active{box-shadow:0 2px #4a55c2}.title-hint{font-size:14px;opacity:.7}@media (max-width: 760px){.screen{gap:14px;padding:18px 14px max(24px,env(safe-area-inset-bottom))}.title-logo{font-size:40px;text-shadow:3px 3px 0 #fff}.title-subtitle{font-size:15px}.stage-list{grid-template-columns:1fr;gap:10px;width:100%}.stage-card{width:100%;min-height:0;display:grid;grid-template-columns:54px 1fr auto;grid-template-areas:"character title medals" "character subtitle meta" "character record record";align-items:center;justify-items:start;gap:4px 10px;padding:12px;border-width:3px;border-radius:14px;text-align:left}.stage-card:hover,.stage-card-selected{transform:none}.stage-card-character{grid-area:character;font-size:38px}.stage-card-medals{grid-area:medals;min-height:0;font-size:16px;letter-spacing:2px}.stage-card-title{grid-area:title;font-size:17px}.stage-card-subtitle{grid-area:subtitle;min-height:0;font-size:12px}.stage-card-meta{grid-area:meta;font-size:12px;justify-self:end}.stage-card-record{grid-area:record;min-height:0;font-size:11px}.start-button{width:100%;max-width:420px;font-size:18px;padding:12px 20px}.title-howto{padding:10px 14px;font-size:13px;line-height:1.7}}.game-screen{justify-content:space-between;cursor:pointer;touch-action:manipulation}.hud{width:100%;display:flex;justify-content:space-between;align-items:baseline;font-size:24px;font-weight:800}.hud-stage{font-size:16px;opacity:.8}.hud-combo{min-width:160px;text-align:right;color:var(--accent);text-shadow:2px 2px 0 rgba(255,255,255,.6)}.hud-sub{width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px}.groove-gauge{display:flex;align-items:center;gap:8px;flex:1;max-width:280px}.groove-label{font-size:13px;font-weight:800;opacity:.8}.groove-track{flex:1;height:10px;border-radius:999px;background:#00000026;overflow:hidden}.groove-fill{height:100%;border-radius:999px;transition:width .2s ease-out}.groove-fill[data-level=high]{background:linear-gradient(90deg,#ffd76a,#ffb400)}.groove-fill[data-level=ok]{background:linear-gradient(90deg,#8fe08f,#3aa14f)}.groove-fill[data-level=retry]{background:#9a9a9a}.lives{font-size:20px;letter-spacing:2px}.count-in{position:absolute;top:20%;left:50%;transform:translate(-50%);font-size:64px;font-weight:800;color:#fff;text-shadow:4px 4px 0 var(--accent);animation:count-pop .4s ease-out}@keyframes count-pop{0%{transform:translate(-50%) scale(1.6);opacity:0}to{transform:translate(-50%) scale(1);opacity:1}}.stage{position:relative;width:100%;max-width:900px;height:220px}.lane{position:absolute;top:50%;width:100%;height:12px;transform:translateY(-50%);background:var(--lane);border-radius:999px;box-shadow:inset 0 3px #00000014}.hit-zone{position:absolute;top:50%;width:72px;height:72px;border:6px dashed var(--accent);border-radius:50%;background:#fff6}.character{position:absolute;top:50%;transform:translate(-50%,-130%);font-size:56px;line-height:1}.character[data-judgment=perfect],.character[data-judgment=good]{animation:chara-hop .3s ease-out}.character[data-judgment=miss]{animation:chara-shake .3s ease-in-out}@keyframes chara-hop{0%{transform:translate(-50%,-130%)}40%{transform:translate(-50%,-170%) rotate(-8deg)}to{transform:translate(-50%,-130%)}}@keyframes chara-shake{0%,to{transform:translate(-50%,-130%)}25%{transform:translate(-46%,-130%)}75%{transform:translate(-54%,-130%)}}.note{position:absolute;top:50%;transform:translate(-50%,-50%);font-size:40px;line-height:1;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.15))}.note-star{font-size:48px;animation:star-spin .8s ease-in-out infinite;filter:drop-shadow(0 0 8px rgba(255,220,80,.9))}@keyframes star-spin{0%,to{transform:translate(-50%,-50%) rotate(-12deg) scale(1)}50%{transform:translate(-50%,-50%) rotate(12deg) scale(1.15)}}.note-bomb{font-size:42px;animation:bomb-wobble .5s ease-in-out infinite;filter:drop-shadow(0 0 6px rgba(255,60,60,.8))}@keyframes bomb-wobble{0%,to{transform:translate(-50%,-50%) rotate(-10deg)}50%{transform:translate(-50%,-50%) rotate(10deg) scale(1.08)}}.note-missed{opacity:.35;filter:grayscale(1)}.judgment-label{position:absolute;top:8%;transform:translate(-50%);font-size:28px;font-weight:800;white-space:nowrap;animation:judgment-pop .5s ease-out forwards}.judgment-hint{display:block;font-size:14px;opacity:.85}.judgment-perfect{color:#ffb400;text-shadow:2px 2px 0 #fff}.judgment-good{color:#3aa14f;text-shadow:2px 2px 0 #fff}.judgment-miss{color:#7a7a7a;text-shadow:2px 2px 0 #fff}.judgment-bomb{color:#ff3c3c;text-shadow:2px 2px 0 #fff;font-size:34px}@keyframes judgment-pop{0%{transform:translate(-50%) translateY(10px) scale(.6);opacity:0}25%{transform:translate(-50%) translateY(0) scale(1.15);opacity:1}80%{opacity:1}to{transform:translate(-50%) translateY(-8px) scale(1);opacity:0}}.game-footer{font-size:16px;opacity:.7;padding-bottom:8px}.fever-banner{position:absolute;top:12%;left:50%;transform:translate(-50%);font-size:32px;font-weight:800;color:#fff;text-shadow:2px 2px 0 #ff5722,-2px -2px 0 #ff9800;animation:fever-pulse .4s ease-in-out infinite alternate;pointer-events:none}@keyframes fever-pulse{0%{transform:translate(-50%) scale(1)}to{transform:translate(-50%) scale(1.12)}}.fever .lane{box-shadow:0 0 16px 4px color-mix(in srgb,var(--accent) 70%,transparent),inset 0 3px #00000014}.fever .hit-zone{border-style:solid;box-shadow:0 0 24px 6px color-mix(in srgb,var(--accent) 60%,transparent)}.fever .hud-combo{animation:fever-pulse-inline .4s ease-in-out infinite alternate}@keyframes fever-pulse-inline{0%{transform:scale(1)}to{transform:scale(1.1)}}.speed-up{position:absolute;top:30%;left:50%;font-size:40px;font-weight:800;color:#fff;text-shadow:3px 3px 0 var(--accent);white-space:nowrap;pointer-events:none;animation:speed-up-pop 2s ease-out forwards}@keyframes speed-up-pop{0%{transform:translate(-50%) scale(.5);opacity:0}15%{transform:translate(-50%) scale(1.2);opacity:1}70%{transform:translate(-50%) scale(1);opacity:1}to{transform:translate(-50%) scale(1);opacity:0}}.stage-card-endless{background:linear-gradient(160deg,#fff3c4,#ffd9ec)}.result-endless-best{font-size:15px;opacity:.85}.echo-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;height:auto;min-height:320px}.echo-teacher{font-size:72px;line-height:1}.echo-teacher[data-calling=true]{animation:echo-hop .3s ease-out}.echo-notes{display:flex;gap:18px;min-height:44px;align-items:center}.echo-note{font-size:38px;line-height:1;opacity:0;transform:scale(.4)}.echo-note-on{opacity:1;transform:scale(1);animation:echo-note-pop .25s ease-out}.echo-note-ghost{opacity:.35;transform:scale(.9)}@keyframes echo-note-pop{0%{transform:scale(1.6)}to{transform:scale(1)}}.echo-phase{font-size:26px;font-weight:800;min-height:1.3em;text-shadow:2px 2px 0 rgba(255,255,255,.5)}.beat-dots{display:flex;gap:14px}.dot{width:14px;height:14px;border-radius:50%;background:#0000002e;transition:transform .05s}.dot-on{background:var(--accent);transform:scale(1.35)}.echo-player{font-size:52px;line-height:1}.echo-player[data-judgment=perfect],.echo-player[data-judgment=good]{animation:echo-hop .3s ease-out}.echo-player[data-judgment=miss]{animation:echo-shake .3s ease-in-out}@keyframes echo-hop{0%,to{transform:translateY(0)}40%{transform:translateY(-16px) rotate(-8deg)}}@keyframes echo-shake{0%,to{transform:translate(0)}25%{transform:translate(6px)}75%{transform:translate(-6px)}}.echo-stage .judgment-label{top:55%;left:66%}.audience{display:flex;gap:20px;min-height:40px;align-items:flex-end}.audience-member{font-size:30px;line-height:1;animation-name:audience-bounce;animation-iteration-count:infinite;animation-timing-function:ease-in-out}@keyframes audience-bounce{0%,to{transform:translateY(0)}30%{transform:translateY(-10px)}}.audience-fever .audience-member{animation-name:audience-jump}@keyframes audience-jump{0%,to{transform:translateY(0) scale(1)}30%{transform:translateY(-22px) scale(1.15) rotate(-8deg)}}.result-heading{font-size:28px;font-weight:800}.result-rank{font-size:clamp(40px,8vw,72px);font-weight:800;padding:8px 40px;border-radius:20px;background:#fff;animation:rank-stamp .5s cubic-bezier(.2,2,.4,1)}.result-rank-high{color:#ffb400}.result-rank-ok{color:#3aa14f}.result-rank-retry{color:#7a7a7a}@keyframes rank-stamp{0%{transform:scale(2.2) rotate(-8deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.result-score{font-size:28px;font-weight:800;display:flex;align-items:center;gap:12px}.result-badge{font-size:16px;font-weight:800;padding:4px 16px;border-radius:999px;animation:rank-stamp .5s cubic-bezier(.2,2,.4,1)}.result-badge-perfect{font-size:22px;background:linear-gradient(90deg,#ffd76a,#ff9e5e);color:#7a4400}.result-badge-record{background:var(--accent);color:#fff}.result-unlock{font-size:18px;font-weight:800;background:#ffffffd9;color:#4a2c14;padding:8px 24px;border-radius:999px;animation:rank-stamp .5s cubic-bezier(.2,2,.4,1)}.result-counts{display:flex;gap:28px;background:#ffffffd9;color:#4a2c14;border-radius:16px;padding:16px 28px}.result-counts dt{font-size:14px;opacity:.75}.result-counts dd{font-size:26px;font-weight:800}.result-buttons{display:flex;gap:16px;align-items:center}