*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}:root{--bg-1: #2a1740;--bg-2: #4b2a6b;--bg-3: #6b3a86;--glass: rgba(255, 255, 255, .1);--glass-2: rgba(255, 255, 255, .16);--glass-line: rgba(255, 182, 206, .45);--text: #fff2f8;--muted: #cdb7dd;--pink: #ff8fb1;--pink-deep: #ff5c8a;--pink-ink: #b8336a;--peach: #ffc6a8;--gold: #ffe08a;--gold-ink: #b98a2a;--lilac: #d9c6ff;--mint: #8fe3d1;--sky: #8fd3ff;--shadow: 0 10px 30px rgba(20, 5, 40, .45);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--font-head: "Jua", "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;--font-body: "Gowun Dodum", "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif}html,body{height:100%;overflow:hidden;background:radial-gradient(120% 80% at 50% 0%,var(--bg-3) 0%,var(--bg-2) 45%,var(--bg-1) 100%);color:var(--text);font-family:var(--font-body);user-select:none;-webkit-user-select:none;touch-action:manipulation;-webkit-touch-callout:none;overscroll-behavior:none}button{font-family:inherit;color:inherit;border:0;background:none;cursor:pointer;touch-action:manipulation}canvas{display:block;touch-action:none}.hidden{display:none!important}.muted{color:var(--muted);font-size:14px}.petals{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}.screen{position:fixed;inset:0;margin:0 auto;max-width:560px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;padding-top:calc(16px + var(--safe-top));padding-bottom:calc(16px + var(--safe-bottom));z-index:1;animation:screen-in .35s ease-out both}@keyframes screen-fade{0%{opacity:0}}@keyframes screen-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.btn{font-family:var(--font-head);font-size:18px;letter-spacing:.02em;padding:12px 26px;border-radius:999px;color:#fff;background:linear-gradient(180deg,var(--pink) 0%,var(--pink-deep) 100%);box-shadow:0 5px 0 var(--pink-ink),0 10px 20px #ff5c8a59,inset 0 2px #ffffff73;transition:transform .08s ease,box-shadow .08s ease,filter .15s}.btn:active{transform:translateY(4px);box-shadow:0 1px 0 var(--pink-ink),0 4px 10px #ff5c8a4d,inset 0 2px #ffffff73}.btn:disabled{filter:grayscale(.6) brightness(.8);pointer-events:none}.btn-lg{font-size:24px;padding:16px 44px}.btn-ghost{background:var(--glass-2);box-shadow:0 5px #5a3278cc,inset 0 2px #ffffff40;border:1px solid var(--glass-line)}.btn-ghost:active{box-shadow:0 1px #5a3278cc,inset 0 2px #ffffff40}.btn-gold{color:#5a3a00;background:linear-gradient(180deg,#fff1b8 0%,var(--gold) 100%);box-shadow:0 5px 0 var(--gold-ink),0 10px 20px #ffe08a59,inset 0 2px #ffffffb3}.btn-gold:active{box-shadow:0 1px 0 var(--gold-ink),inset 0 2px #ffffffb3}.btn-icon{width:42px;height:42px;padding:0;font-size:22px;line-height:42px;text-align:center;background:var(--glass-2);border:1px solid var(--glass-line);box-shadow:0 3px #5a3278cc}.btn-icon:active{transform:translateY(2px);box-shadow:0 1px #5a3278cc}.card{background:var(--glass);border:1px solid var(--glass-line);border-radius:24px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow)}.ribbon{display:inline-block;font-family:var(--font-head);font-size:13px;letter-spacing:.25em;text-transform:uppercase;color:#5a2a4a;background:linear-gradient(180deg,#ffd6e7,#ffb3cc);padding:6px 18px;border-radius:6px;position:relative;box-shadow:0 3px #b8336a80}.ribbon:before,.ribbon:after{content:"";position:absolute;top:4px;width:14px;height:100%;background:#ff8fb1;z-index:-1}.ribbon:before{left:-10px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,40% 50%)}.ribbon:after{right:-10px;clip-path:polygon(0 0,100% 0,60% 50%,100% 100%,0 100%)}.title-wrap{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}.logo{font-family:var(--font-head);font-size:64px;line-height:.95;display:flex;flex-direction:column;align-items:center;background:linear-gradient(180deg,#fff 10%,#ffd6e7,#ff8fb1);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 0 rgba(184,51,106,.55)) drop-shadow(0 12px 24px rgba(255,92,138,.35));animation:logo-bob 3s ease-in-out infinite}.logo-sub{font-size:84px;letter-spacing:.08em}@keyframes logo-bob{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-6px) rotate(1deg)}}.tagline{color:var(--lilac);font-size:16px;line-height:1.6;margin-bottom:10px}.lobby-bottom{position:absolute;left:50%;bottom:calc(14px + var(--safe-bottom));transform:translate(-50%);width:calc(100% - 40px);max-width:440px}.app-banner{width:100%;max-width:440px;flex:none;padding-top:8px;padding-bottom:2px}.banner-track{position:relative;width:100%;aspect-ratio:1024 / 163;overflow:hidden;border-radius:14px;background:var(--glass);border:1px solid var(--glass-line);box-shadow:0 6px 18px #14052859}.banner-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transform:translateY(100%);transition:transform .3s ease-out;pointer-events:none}.banner-slide.current{transform:translateY(0)}.banner-slide.leaving{transform:translateY(-100%)}.copyright{-webkit-text-size-adjust:100%;text-size-adjust:100%;margin-top:10px;text-align:center;font-size:11px;line-height:1.35;color:#d9c6ff73;letter-spacing:.04em}#screen-title{padding-bottom:calc(120px + var(--safe-bottom))}.topbar{width:100%;display:flex;align-items:center;gap:12px;margin-bottom:14px}.topbar h2{flex:none;font-family:var(--font-head);font-size:26px;font-weight:400}.user-chip{display:flex;align-items:center;gap:6px;min-width:0;padding:4px 4px 4px 12px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-line)}.user-nick{min-width:0;max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-head);font-size:14px;color:var(--pink)}.signoff-link{flex:none;padding:4px 10px;font-size:11px;letter-spacing:.04em;color:var(--muted);border:1px solid rgba(255,255,255,.25);border-radius:999px}.signoff-link:active{color:var(--text);border-color:var(--glass-line)}.signoff-box{text-align:center}.signoff-title{font-family:var(--font-head);font-size:22px}.signoff-msg{white-space:pre-line;font-size:14px;line-height:1.6;color:var(--lilac)}.signoff-msg b{color:var(--pink);font-family:var(--font-head);font-weight:400}.signoff-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}.stars-total{margin-left:auto;font-family:var(--font-head);color:var(--gold);font-size:18px}#screen-stages{justify-content:flex-start}.stage-list{width:100%;flex:1;min-height:0;overflow-y:auto;display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:max-content;align-content:start;gap:10px;padding-bottom:8px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;cursor:grab}.stage-card{position:relative;display:block;width:100%;padding:0;overflow:hidden;border-radius:16px;border:2px solid rgba(255,182,206,.45);background:#1d0f2d;box-shadow:var(--shadow);cursor:pointer;transition:transform .1s}.stage-card:before{content:"";display:block;padding-top:177.7778%}.stage-card:active{transform:scale(.97)}.stage-card.cleared{border-color:#ffe08ab3}.stage-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.stage-card.locked .stage-thumb{filter:grayscale(1) brightness(.45)}.stage-num{position:absolute;top:5px;left:5px;font-family:var(--font-head);font-size:12px;line-height:1;background:linear-gradient(180deg,var(--pink),var(--pink-deep));color:#fff;padding:4px 8px;border-radius:999px;box-shadow:0 2px 0 var(--pink-ink)}.stage-pct{position:absolute;top:5px;right:5px;font-family:var(--font-head);font-size:11px;line-height:1;color:#fff;background:#1e0a32a6;border:1px solid rgba(255,255,255,.25);padding:4px 7px;border-radius:999px;font-variant-numeric:tabular-nums}.stage-info{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 7px;text-align:left;background:linear-gradient(180deg,transparent,rgba(30,10,50,.85));pointer-events:none}.stage-stars{font-size:12px;line-height:1;letter-spacing:1px}.stage-stars .on{color:var(--gold);text-shadow:0 1px 0 var(--gold-ink)}.stage-stars .off{color:#ffffff4d}.stage-row{display:flex;align-items:baseline;gap:4px;margin-top:3px}.stage-time{flex:none;margin-left:auto;font-family:var(--font-head);font-size:10px;color:var(--gold);text-shadow:0 1px 2px rgba(0,0,0,.7);font-variant-numeric:tabular-nums;white-space:nowrap}.stage-title{flex:1;min-width:0;font-family:var(--font-head);font-size:13px;line-height:1.15;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stage-lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:28px;color:#fffc;text-shadow:0 2px 8px rgba(0,0,0,.6)}.ad-overlay{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:radial-gradient(120% 80% at 50% 0%,#3b2358,#22123a);z-index:60;animation:screen-in .25s ease-out both}.ad-top{position:absolute;top:calc(16px + var(--safe-top));left:50%;transform:translate(-50%);width:100%;max-width:560px;padding:0 16px;height:42px;display:flex;align-items:center;gap:12px}.ad-count{font-family:var(--font-head);font-size:14px;letter-spacing:.08em;color:var(--lilac)}.ad-text{font-family:var(--font-head);font-size:44px;letter-spacing:.4em;color:#ffffff59}.ad-note{font-size:13px}#screen-config{justify-content:flex-start}.btn-gear{font-size:20px}.config-card{width:100%;padding:8px 18px;border-radius:22px;background:var(--glass);border:1px solid var(--glass-line);box-shadow:var(--shadow)}.config-row{display:flex;align-items:center;gap:14px;padding:16px 0}.config-row+.config-row{border-top:1px dashed rgba(255,255,255,.18)}.config-label{flex:none;width:76px;font-family:var(--font-head);font-size:17px}.vol-wrap{flex:1;display:flex;align-items:center;gap:12px}.vol-val{flex:none;width:44px;text-align:right;font-family:var(--font-head);font-size:15px;color:var(--gold);font-variant-numeric:tabular-nums}.vol-val.off{color:var(--muted)}.vol{--vol: 100%;flex:1;-webkit-appearance:none;appearance:none;height:10px;border-radius:999px;background:linear-gradient(90deg,var(--pink),var(--pink-deep)) 0 / var(--vol) 100% no-repeat,#0000004d;outline:none;touch-action:none;cursor:pointer}.vol::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ffd6e7 60%,#ff8fb1);border:2px solid #fff;box-shadow:0 2px 6px #b8336a99}.vol::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#ffd6e7 60%,#ff8fb1);border:2px solid #fff;box-shadow:0 2px 6px #b8336a99}#screen-config .app-banner{margin-top:auto}.nick-popup{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;padding-top:calc(20px + var(--safe-top));padding-bottom:calc(20px + var(--safe-bottom));background:#14052899;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:screen-fade .2s ease-out both}.nick-popup .nick-box{position:relative;max-width:360px;background:linear-gradient(180deg,#5a3278f5,#321950fa);animation:nick-pop .25s cubic-bezier(.2,1.2,.4,1) both}@keyframes nick-pop{0%{transform:scale(.9);opacity:0}}.nick-close{position:absolute;top:10px;right:10px;width:34px;height:34px;line-height:34px;font-size:16px}.nick-box{width:100%;display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:22px 20px 24px}.nick-box label{font-family:var(--font-head);font-size:16px;letter-spacing:.04em;color:var(--lilac);text-align:center}.nick-field{position:relative;width:100%}.nick-box input,.nick-ghost{width:100%;padding:13px 16px;font-family:var(--font-head);font-size:20px;letter-spacing:.04em;text-align:center;color:var(--text);background:#1e0a3273;border:1.5px solid var(--glass-line);border-radius:16px}.nick-box input{outline:none;user-select:text;-webkit-user-select:text;transition:border-color .15s,box-shadow .15s}.nick-box input::placeholder{color:#d9c6ff66;opacity:1}.nick-box input:focus{border-color:var(--pink);box-shadow:0 0 0 4px #ff8fb140}.nick-ghost{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-color:var(--pink);cursor:text}.nick-ghost .suffix{color:#cdb7dd8c}.nick-hint{min-height:1.2em;margin-top:-4px;font-size:13px;text-align:center;color:var(--peach)}.nick-box .btn{margin-top:4px}.title-nick{margin-top:-6px;font-family:var(--font-head);font-size:16px;letter-spacing:.03em;color:var(--pink);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-toast{position:fixed;left:50%;top:calc(18px + var(--safe-top));z-index:200;max-width:calc(100% - 32px);transform:translate(-50%,-12px);font-family:var(--font-head);font-size:16px;line-height:1.35;text-align:center;color:#fff;background:#b8336aeb;border:1px solid rgba(255,214,231,.55);padding:9px 20px;border-radius:999px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}.app-toast.show{opacity:1;transform:translate(-50%)}.cfg-btn{margin-left:auto;font-size:15px;padding:8px 18px}#screen-game{touch-action:none;justify-content:flex-start;padding:0;padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);gap:0}.hud{width:100%;display:flex;align-items:center;gap:10px;padding:10px 14px 6px}.hud-left{flex:1;display:flex;align-items:baseline;gap:8px}.hud-stage{font-family:var(--font-head);font-size:20px;color:var(--gold)}.hud-boss{font-size:13px;color:var(--lilac);background:#ffffff1f;padding:2px 9px;border-radius:999px}.hud-lives{display:flex;gap:3px;font-size:20px;color:var(--pink-deep);filter:drop-shadow(0 1px 0 rgba(0,0,0,.3))}.hud-lives .off{color:#ffffff38}.hud-lives .pop{animation:heart-pop .4s ease-out}@keyframes heart-pop{0%{transform:scale(1)}40%{transform:scale(1.6)}to{transform:scale(1)}}.hud-bars{width:100%;display:flex;gap:10px;padding:10px 14px 8px}.bar{position:relative;flex:1;height:22px;border-radius:999px;background:#0000004d;border:1px solid rgba(255,255,255,.2);overflow:hidden}.bar-fill{position:absolute;inset:0;width:100%;transform-origin:left center;transform:scaleX(1);transition:transform .15s linear;border-radius:999px}.bar-time .bar-fill{background:linear-gradient(180deg,#fff1b8,var(--gold))}.bar-time.low .bar-fill{background:linear-gradient(180deg,#ffb3cc,var(--pink-deep));animation:bar-blink .5s steps(2) infinite}@keyframes bar-blink{to{opacity:.55}}.bar-progress .bar-fill{background:linear-gradient(180deg,#ffd6e7,var(--pink-deep));transition:transform .4s ease-out}.bar-time-wrap{position:relative;flex:1;display:flex}.bar-star{position:absolute;top:-1px;bottom:-1px;width:2px;margin-left:-1px;background:#ffffffd9;box-shadow:0 0 4px #ffe08ae6;pointer-events:none;z-index:1;transition:opacity .3s}.bar-star i{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:1px;font-style:normal;font-size:9px;line-height:1;letter-spacing:-1px;white-space:nowrap;color:var(--gold);text-shadow:0 1px 0 var(--gold-ink),0 0 4px rgba(0,0,0,.5)}.bar-star.passed{opacity:0}.bar-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-size:13px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6)}.field{position:relative;flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;padding:0 8px}#game-canvas{border-radius:14px;box-shadow:0 0 0 3px #ffb6ce80,0 12px 32px #0a001e99}.intro{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#1e0a328c;border-radius:14px;pointer-events:none;animation:screen-in .3s ease-out both}.intro-stage{font-family:var(--font-head);font-size:22px;color:var(--gold);letter-spacing:.2em}.intro-title{font-family:var(--font-head);font-size:40px;color:#fff;text-align:center;padding:0 20px;text-shadow:0 4px 0 var(--pink-ink);animation:logo-bob 1.2s ease-in-out infinite}.toast{position:absolute;left:50%;top:18px;transform:translate(-50%);font-family:var(--font-head);font-size:18px;color:#fff;background:#b8336ad9;padding:8px 18px;border-radius:999px;white-space:nowrap;pointer-events:none;animation:toast-in .25s ease-out both}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-8px)}to{opacity:1;transform:translate(-50%)}}.status{position:absolute;top:10px;left:16px;display:flex;gap:6px;pointer-events:none;z-index:2}.status span{font-size:12px;font-family:var(--font-head);padding:3px 10px;border-radius:999px;background:#1e0a32b3;border:1px solid var(--glass-line)}.status .shoes{color:#d9a8ff}.status .shield{color:var(--sky)}.status .web{color:#fff}.game-banner{width:100%;max-width:440px;flex:none;padding:10px 14px 12px}.popup{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#1405288c;padding:20px;z-index:5;animation:screen-in .25s ease-out both}.popup-card{width:min(100%,340px);padding:26px 22px 22px;border-radius:26px;background:linear-gradient(180deg,#5a3278f2,#321950f7);border:1px solid var(--glass-line);box-shadow:var(--shadow);text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.popup-title{font-family:var(--font-head);font-size:32px;color:#fff;text-shadow:0 3px 0 var(--pink-ink)}.popup-title.gold{color:var(--gold);text-shadow:0 3px 0 var(--gold-ink)}.popup-stars{display:flex;gap:6px;font-size:40px;line-height:1;margin-top:-4px}.star-slot{position:relative;display:inline-block;width:1em;height:1em}.star-slot>span{position:absolute;inset:0;text-align:center}.star-slot .off{color:#ffffff2e}.star-slot .star{color:var(--gold);filter:drop-shadow(0 2px 0 var(--gold-ink)) drop-shadow(0 0 10px rgba(255,224,138,.7));opacity:0;transform:scale(1.3)}.star-slot .star.stamped{animation:star-stamp .18s cubic-bezier(.3,0,.7,.2) forwards,star-flash .2s ease-out .18s}@keyframes star-stamp{0%{opacity:0;transform:scale(1.3)}10%{opacity:1}to{opacity:1;transform:scale(1)}}@keyframes star-flash{0%{color:#fff;filter:drop-shadow(0 2px 0 var(--gold-ink)) drop-shadow(0 0 18px #fff) brightness(2)}to{color:var(--gold);filter:drop-shadow(0 2px 0 var(--gold-ink)) drop-shadow(0 0 10px rgba(255,224,138,.7))}}.popup-card.shake{animation:card-shake .3s ease-out}@keyframes card-shake{0%{transform:translate(0)}20%{transform:translate(-3px,2px) rotate(-.3deg)}40%{transform:translate(3px,-2px) rotate(.3deg)}60%{transform:translate(-2px,1px)}80%{transform:translate(1px,-1px)}to{transform:translate(0)}}.popup-percent{font-family:var(--font-head);font-size:54px;line-height:1;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff,#ffd6e7 60%,#ff8fb1);-webkit-background-clip:text;background-clip:text;color:transparent}.popup-sub{color:var(--lilac);font-size:14px;line-height:1.6;white-space:pre-line}.popup-rows{width:100%;display:grid;grid-template-columns:1fr auto;gap:4px 0;font-size:14px;color:var(--muted);padding:10px 14px;background:#0003;border-radius:14px}.popup-rows span{text-align:left}.popup-rows b{color:#fff;font-weight:400;font-family:var(--font-head);text-align:right;font-variant-numeric:tabular-nums;padding-left:12px}.popup-rows b.counting{color:var(--gold)}.popup-rows .total{margin-top:4px;padding-top:6px;border-top:1px dashed rgba(255,255,255,.25)}.popup-rows b.total{font-size:18px}.popup-actions{display:flex;flex-direction:column;gap:10px;width:100%;margin-top:6px}.popup-actions .btn{width:100%}.popup-note{font-size:12px;color:var(--muted)}.popup-time{margin-top:-4px;font-family:var(--font-head);font-size:15px;color:var(--lilac);font-variant-numeric:tabular-nums}.tutorial{position:absolute;left:50%;top:10px;transform:translate(-50%);width:calc(100% - 28px);max-width:380px;padding:12px 16px 14px;border-radius:18px;background:linear-gradient(180deg,#5a3278f0,#321950f5);border:1px solid var(--glass-line);box-shadow:var(--shadow);text-align:center;z-index:4}.tutorial-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.tutorial-step{font-family:var(--font-head);font-size:12px;letter-spacing:.15em;color:var(--gold)}.tutorial-skip{font-size:12px;color:var(--muted);padding:2px 4px}.tutorial-text{white-space:pre-line;font-size:15px;line-height:1.6;color:var(--text)}.tutorial-next{margin-top:10px;min-width:130px;font-size:16px;padding:9px 22px}.tut-dim{position:absolute;z-index:3;border-radius:50%;pointer-events:none;box-shadow:0 0 0 3px #ffd6e7bf,0 0 18px 6px #ff8fb173,0 0 0 300vmax #0e041cbd;animation:screen-fade .25s ease-out both}.tut-finger{position:absolute;z-index:4;pointer-events:none;-webkit-user-select:none;user-select:none;filter:drop-shadow(0 4px 6px rgba(10,0,30,.55))}