:root{--green-100: #9ec8e8;--green-200: #3a322b;--green-300: #3a322b;--green-400: #6fa8d6;--green-500: #1d1916;--green-600: #d4a857;--warm-fruit: #d4a857;--warm-apricot: #e0c179;--warm-cream: #e8e0d4;--warm-clay: #a99c8a;--mist: #7f93a3;--petal: #c9a8c9;--ink: #e8e0d4;--paper: #1d1916;--prop-brass: #d4a857;--safe-top: 0px;--safe-bottom: 0px;--font: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", system-ui, -apple-system, sans-serif;--radius: 18px}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;overscroll-behavior:none}body{background:var(--green-500);color:var(--ink);font-family:var(--font);overflow:hidden;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button{font-family:inherit;cursor:pointer}.app{position:relative;width:100%;height:100dvh;max-width:560px;margin:0 auto;overflow:hidden;background:linear-gradient(180deg,var(--green-200) 0%,var(--green-400) 62%,var(--green-500) 100%)}.app.booting{display:flex;align-items:center;justify-content:center}.kicker{font-size:.76rem;font-weight:700;letter-spacing:2px;color:var(--green-600);text-align:center}.title{font-size:clamp(1.6rem,7.2vw,2.1rem);font-weight:800;color:var(--ink);text-align:center;letter-spacing:-.5px}.subtitle{font-size:.82rem;color:var(--green-600);text-align:center;margin-top:6px}.story-text{font-size:.8rem;line-height:1.6;color:var(--ink);text-align:center;margin-top:8px;white-space:pre-line}.hint{font-size:.74rem;line-height:1.6;color:var(--warm-clay);text-align:center}.panel{width:100%;max-width:400px;padding:13px 15px 15px;border-radius:var(--radius);background:var(--paper);border:2px solid var(--green-300);color:var(--ink)}.panel-title{font-size:.82rem;font-weight:800;color:var(--green-600);text-align:center;margin-bottom:10px}.primary-btn,.secondary-btn{flex:0 0 auto;width:100%;max-width:400px;padding:15px 18px;font-size:1.02rem;font-weight:800;border-radius:var(--radius);border:2px solid var(--green-600);transition:transform .08s}.primary-btn{background:var(--warm-fruit);color:var(--ink)}.primary-btn:active{transform:translateY(2px)}.primary-btn:disabled{opacity:.55}.secondary-btn{background:var(--paper);color:var(--ink);border-color:var(--green-400)}.secondary-btn:active{transform:translateY(2px)}.ghost-btn{padding:8px 15px;font-size:.78rem;font-weight:700;color:var(--ink);background:var(--green-200);border:1.5px solid var(--green-400);border-radius:999px}.ghost-btn.wide{display:block;width:100%;margin-top:10px}.button-row{display:flex;gap:10px;width:100%;max-width:400px}.button-row .primary-btn,.button-row .secondary-btn{flex:1 1 0;width:auto}.screen{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;gap:12px;padding:calc(var(--safe-top) + 18px) 16px calc(var(--safe-bottom) + 18px);overflow-y:auto;-webkit-overflow-scrolling:touch}.start-screen{justify-content:center;background:linear-gradient(180deg,#3a322b59,#6fa8d6e0 46%)}.start-preview{position:absolute;inset:0;z-index:-1}.start-preview .stage-scene{width:100%;height:56%}.start-preview-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(158,200,232,.05) 0%,rgba(111,168,214,.62) 42%,var(--green-400) 72%)}.start-foot{display:flex;flex-direction:column;align-items:center;gap:8px}.start-foot .hint{color:var(--ink)}.start-foot .hint b{color:var(--warm-apricot)}.song-list{display:flex;flex-direction:column;gap:7px}.song-btn{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:14px;border:2px solid transparent;background:#3a322b29;color:var(--ink);text-align:left}.song-btn:active{border-color:var(--green-400);background:#3a322b6b}.song-btn.locked{opacity:.45}.song-btn.locked .song-name{letter-spacing:3px}.song-diffs{flex-shrink:0;display:flex;gap:3px}.song-diff-dot{width:6px;height:6px;border-radius:50%;background:var(--green-400)}.song-diff-dot.diff-hard{background:var(--warm-apricot)}.song-diff-dot.diff-insane{background:var(--green-600)}.song-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:26px;height:26px}.song-icon svg{width:100%;height:100%;fill:currentColor}.song-icon svg>circle:first-of-type{fill:#14110f73}.song-icon.locked-icon{font-weight:800;color:var(--warm-clay)}.song-clear{margin-left:6px;padding:1px 6px;font-size:.56rem;font-weight:800;vertical-align:middle;color:var(--paper);background:var(--green-100);border-radius:999px}.song-btn:disabled{opacity:.6}.daily-btn{width:100%;border-color:var(--warm-fruit)}.song-meta{flex:1;min-width:0}.song-name{display:block;font-size:.97rem;font-weight:800}.song-sub{display:block;font-size:.68rem;color:var(--warm-clay);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.song-bpm{flex-shrink:0;font-size:.72rem;font-weight:800;color:var(--green-600)}.song-bpm:after{content:" BPM";font-size:.56rem;opacity:.7}.difficulty-list{display:flex;gap:7px}.diff-btn{flex:1;display:flex;flex-direction:column;gap:2px;padding:9px 4px;border-radius:14px;border:2px solid rgba(85,112,60,.3);background:#3a322b24;color:var(--ink)}.diff-btn:active{border-color:var(--green-400);background:#3a322b6b}.diff-label{font-size:.9rem;font-weight:800}.diff-hint{font-size:.62rem;color:var(--warm-clay)}.diff-best{margin-top:2px;font-size:.6rem;font-weight:700;color:var(--green-600)}.back-btn{align-self:flex-start}.game-view{position:absolute;inset:0;display:flex;flex-direction:column;padding-top:var(--safe-top);padding-bottom:var(--safe-bottom)}.stage{position:relative;flex:0 0 38%;min-height:150px;overflow:hidden}.stage-scene{position:absolute;inset:0;width:100%;height:100%}.stage-light{position:absolute;inset:0;background:linear-gradient(180deg,var(--stage-glow, rgba(158, 200, 232, .3)) 0%,transparent 56%);pointer-events:none}.hero-line{position:absolute;left:16%;bottom:12%;z-index:3;pointer-events:none}.hero{display:block;width:92px;height:auto;overflow:visible}.hero [data-leg],.hero [data-hero]{transition:transform .11s ease-out;transform-box:fill-box;transform-origin:center}.stage.surge .hero{filter:drop-shadow(0 0 7px var(--green-400))}.stage.stagger .hero [data-hero=body]{animation:heroStagger .9s ease-out}@keyframes heroStagger{0%{transform:translate(0) rotate(0)}25%{transform:translate(-7px) rotate(-9deg)}60%{transform:translate(2px) rotate(3deg)}to{transform:translate(0) rotate(0)}}.enemy-line{position:absolute;left:0;right:0;bottom:13%;height:34px;overflow:hidden;pointer-events:none}.enemy{position:absolute;left:var(--enemy-x, 80%);bottom:0;width:22px;height:30px;border-radius:40% 40% 60% 60%;background:var(--ink-900, #14110f);opacity:.92;animation:enemyApproach 2.4s linear forwards}@keyframes enemyApproach{0%{transform:translate(0)}to{transform:translate(-190px)}}.enemy.defeated{animation:enemyDefeated .32s ease-in forwards!important}@keyframes enemyDefeated{0%{transform:scale(1);opacity:.92}to{transform:scale(.35) translateY(8px);opacity:0}}.hit-sparks{position:absolute;inset:0;pointer-events:none;overflow:hidden}.hit-spark{position:absolute;bottom:20%;width:8px;height:8px;border-radius:2px;background:var(--green-400);animation:sparkPop .4s ease-out forwards}@keyframes sparkPop{0%{opacity:1;transform:translate(-50%) scale(.6) rotate(0)}to{opacity:0;transform:translate(-50%,-22px) scale(1.3) rotate(45deg)}}.path-meter{position:absolute;left:14px;right:14px;bottom:5px;height:6px;border-radius:999px;background:#14110f47;overflow:hidden}.path-meter-fill{height:100%;width:0;border-radius:999px;background:var(--green-100);transition:width .25s ease-out}.walk-call{position:absolute;left:50%;top:10px;transform:translate(-50%);font-size:.95rem;font-weight:800;color:var(--paper);background:var(--warm-apricot);border-radius:999px;padding:3px 14px;opacity:0;pointer-events:none;white-space:nowrap;z-index:5}.walk-call.show{animation:callPop 1s ease-out}@keyframes callPop{0%{opacity:0;transform:translate(-50%) scale(.75)}18%{opacity:1;transform:translate(-50%) scale(1.1)}70%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:0;transform:translate(-50%) scale(1)}}.board{position:relative;flex:1 1 auto;min-height:0;background:linear-gradient(180deg,var(--green-500) 0%,#14110f 100%);border-top:2px solid var(--green-600)}.lanes{display:flex;gap:5px;width:100%;height:100%;padding:0 7px}.lane{position:relative;flex:1;height:100%;overflow:hidden;border-radius:0 0 var(--radius) var(--radius);background:linear-gradient(180deg,#14110f38,#14110f75);border:1px solid rgba(20,17,15,.4);border-top:none}.lane-beam{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,var(--lane-color) 200%);opacity:0;transition:opacity .25s;pointer-events:none}.lane.pressed .lane-beam{opacity:.3;transition:opacity .02s}.judge-line{position:absolute;left:0;right:0;bottom:86px;height:2px;background:#e8e0d466;pointer-events:none;z-index:3}.lane-target{position:absolute;bottom:60px;left:50%;transform:translate(-50%);width:54px;height:54px;border:2px dashed rgba(232,224,212,.5);border-radius:50%;transition:transform .06s,border-color .06s,background .06s;pointer-events:none}.lane.pressed .lane-target{border-style:solid;border-color:var(--lane-color);background:#e8e0d429;transform:translate(-50%) scale(1.1)}.lane-key{position:absolute;bottom:16px;left:50%;transform:translate(-50%);text-align:center;pointer-events:none}.lane-num{display:block;font-size:1.05rem;font-weight:800;color:#e8e0d4b8;line-height:1}.lane-alpha{display:block;font-size:.55rem;font-weight:700;color:#e8e0d459;margin-top:2px}.note{position:absolute;left:50%;top:0;width:46px;height:46px;margin-left:-23px;margin-top:-23px;display:flex;align-items:center;justify-content:center;will-change:transform;z-index:2;pointer-events:none;color:var(--note-color)}.note-shape{position:absolute;inset:0;display:block}.note-shape svg{width:100%;height:100%;display:block}.note-shape svg>path:first-of-type,.note-shape svg>circle:first-of-type{fill:currentColor;stroke:var(--ink);stroke-width:1.4}.note-label{position:relative;font-size:1rem;font-weight:800;color:var(--ink)}.note.trap:before{content:"";position:absolute;inset:-5px;border:2px solid var(--prop-brass);border-radius:50%}.note.trap:after{content:"";position:absolute;inset:-5px;border:2px dashed var(--green-600);border-radius:50%;opacity:.6;animation:forkRing 3s linear infinite}@keyframes forkRing{to{transform:rotate(360deg)}}.note.trap .note-label{font-size:1.12rem;animation:forkBlink .55s ease-in-out infinite alternate}@keyframes forkBlink{0%{transform:scale(1)}to{transform:scale(1.14)}}.note.dying{transition:transform .18s ease-out,opacity .18s ease-out;opacity:0}.hit-feedback{position:absolute;left:50%;font-size:.84rem;font-weight:800;pointer-events:none;animation:floatUp .7s ease-out forwards;z-index:10;white-space:nowrap;padding:2px 9px;border-radius:999px;background:var(--paper);color:var(--ink)}@keyframes floatUp{0%{opacity:1;transform:translate(-50%) translateY(0) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-54px) scale(1.2)}}.hit-perfect{background:var(--green-100);color:var(--paper)}.hit-great{background:var(--green-200)}.hit-good{background:var(--green-300)}.hit-miss{background:var(--warm-cream);color:var(--paper)}.hit-trap{background:var(--warm-apricot);color:var(--paper)}.hud{position:absolute;top:var(--safe-top);left:0;right:0;display:flex;justify-content:space-between;align-items:flex-start;padding:9px 13px;z-index:20;pointer-events:none}.hud-left,.hud-right{display:flex;flex-direction:column;gap:2px}.hud-right{align-items:flex-end}.hud-steps{font-size:1.6rem;font-weight:800;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}.hud-unit{font-size:.66rem;font-weight:700;margin-left:3px;opacity:.75}.hud-steps .hud-unit{display:block;margin-left:0;margin-bottom:1px}.hud-together{font-size:.88rem;font-weight:800;color:var(--green-600);opacity:0;transition:opacity .2s}.hud-together.show{opacity:1}.hud-sub{font-size:.7rem;font-weight:600;color:var(--green-600)}.hud-time{font-size:1.1rem;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}.hud-time.soon{color:var(--warm-clay)}.hud-buttons{display:flex;gap:6px;margin-bottom:3px}.icon-btn{pointer-events:auto;padding:5px 11px;font-size:.7rem;font-weight:700;border:1.5px solid var(--green-600);border-radius:999px;background:var(--paper);color:var(--ink)}.countdown{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:40;background:#14110f52;font-size:3.6rem;font-weight:800;color:var(--ink);pointer-events:none}.countdown span{animation:countPop .6s ease-out}@keyframes countPop{0%{opacity:0;transform:scale(1.9)}40%{opacity:1;transform:scale(1)}to{opacity:.25;transform:scale(.88)}}.modal-veil{position:absolute;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:24px;background:#14110fb8}.modal{width:100%;max-width:340px;padding:22px 20px 18px;border-radius:22px;background:var(--paper);border:2px solid var(--green-300);color:var(--ink);text-align:center}.modal-title{font-size:1.15rem;font-weight:800;margin-bottom:6px}.modal-desc{font-size:.8rem;color:var(--warm-clay);line-height:1.6;margin-bottom:16px}.result-screen{justify-content:flex-start;background:linear-gradient(180deg,var(--green-300) 0%,var(--green-400) 45%,var(--green-500) 100%)}.result-title{font-size:1.3rem;font-weight:800;color:var(--ink);text-align:center}.rest-scene{width:100%;max-width:400px;height:auto;display:block}.farthest-line{font-size:.9rem;font-weight:800;color:var(--paper);background:var(--warm-apricot);border-radius:999px;padding:4px 16px}.gather-row{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}.gather-item{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:56px}.gather-shape{width:34px;height:34px}.gather-shape svg{width:100%;height:100%;display:block}.gather-shape svg>path:first-of-type,.gather-shape svg>circle:first-of-type{fill:currentColor;stroke:var(--ink);stroke-width:1.4}.gather-name{font-size:.66rem;color:var(--warm-clay)}.gather-count{font-size:.95rem;font-weight:800;color:var(--ink)}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;width:100%;max-width:400px}.stat-box{display:flex;flex-direction:column;gap:2px;padding:9px 4px;border-radius:14px;background:var(--paper);border:1.5px solid var(--green-300);text-align:center}.stat-label{font-size:.62rem;color:var(--warm-clay)}.stat-value{font-size:1rem;font-weight:800;color:var(--ink)}.nickname-form{display:flex;gap:7px;margin-bottom:9px}.nickname-form input{flex:1;min-width:0;padding:10px;border-radius:12px;border:1.5px solid var(--green-300);background:#3a322b1f;color:var(--ink);font-size:.85rem;font-family:inherit}.nickname-form button{padding:10px 15px;border-radius:12px;border:2px solid var(--green-600);background:var(--green-200);color:var(--ink);font-weight:800;font-size:.82rem}.walker-list{list-style:none}.walker-list li{display:flex;align-items:center;gap:9px;padding:7px 0;font-size:.86rem;border-bottom:1.5px dotted rgba(58,50,43,.55)}.walker-list li:last-child{border-bottom:none}.walker-mark{width:10px;height:13px;flex-shrink:0;border-radius:60% 60% 45% 45%;background:var(--green-400)}.walker-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font-weight:600}.walker-steps{font-weight:800;color:var(--green-600)}.tutorial{position:absolute;left:50%;top:10px;transform:translate(-50%);width:92%;text-align:center;font-size:.74rem;line-height:1.6;color:var(--ink);pointer-events:none;z-index:8;animation:tutorialPulse 2s ease-in-out infinite}.tutorial b{color:var(--warm-apricot)}@keyframes tutorialPulse{0%,to{opacity:.5}50%{opacity:1}}@media(max-height:660px){.stage{flex-basis:32%;min-height:128px}.judge-line{bottom:74px}.lane-target{bottom:50px;width:46px;height:46px}.lane-key{bottom:11px}.note{width:40px;height:40px;margin-left:-20px;margin-top:-20px}}@media(min-width:620px)and (min-height:760px){.note{width:54px;height:54px;margin-left:-27px;margin-top:-27px}.lane-target{width:62px;height:62px}}@media(prefers-reduced-motion:reduce){.hero [data-leg],.hero [data-hero]{transition:none}.enemy,.enemy.defeated,.hit-spark,.stage.stagger .hero [data-hero=body],.note.trap:after,.note.trap .note-label,.tutorial{animation:none}}.pc-only{display:none}@media(hover:hover)and (pointer:fine){.pc-only{display:inline}.lane-alpha.pc-only{display:block}}.title-head{display:flex;flex-direction:column;align-items:center;gap:6px}.game-title{font-size:clamp(2rem,10vw,2.7rem);color:var(--warm-apricot);text-shadow:0 2px 0 rgba(20,17,15,.6)}.title-hero .hero{width:168px}.title-start{max-width:280px}.title-menu{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:400px}.song-select{justify-content:flex-start}.start-rule b{color:var(--warm-apricot)}.info-screen{justify-content:flex-start;background:linear-gradient(180deg,var(--green-300) 0%,var(--green-500) 100%)}.info-list{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}.info-row{display:flex;justify-content:space-between;gap:12px;font-size:.76rem}.info-row dt{flex-shrink:0;font-weight:800}.info-row dd{color:var(--warm-clay);text-align:right}.info-row a{color:var(--green-100)}.result-title.failed{color:var(--warm-clay)}.hint.warn{color:var(--warm-apricot)}.ending-text{max-width:360px;font-size:.9rem}