*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:#f5f3ff;-webkit-font-smoothing:antialiased;background:#07040f;font-family:Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,sans-serif;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;border:0}.room{--c1:#7c3aed;--c2:#2563eb;--c3:#06b6d4;isolation:isolate;flex-direction:column;height:100%;display:flex;position:relative;overflow:hidden}.club{z-index:-1;background:#07040f;position:absolute;inset:0;overflow:hidden}.room[data-stage="4"] .club,.room[data-stage="5"] .club{animation:6s linear infinite hue}.room[data-stage="5"] .club{animation-duration:2.5s}@keyframes hue{to{filter:hue-rotate(360deg)}}.club__glow{background:radial-gradient(40% 35% at 20% 15%, color-mix(in srgb, var(--c1) 55%, transparent), transparent), radial-gradient(40% 35% at 80% 20%, color-mix(in srgb, var(--c2) 50%, transparent), transparent), radial-gradient(60% 40% at 50% 100%, color-mix(in srgb, var(--c3) 45%, transparent), transparent);opacity:calc(.45 + var(--energy) * .55);transition:opacity .3s;animation:9s ease-in-out infinite alternate drift;position:absolute;inset:-20%}@keyframes drift{to{transform:translate(4%,-3%)scale(1.1)}}.club__floor{background:repeating-linear-gradient(90deg, color-mix(in srgb, var(--c1) 80%, transparent) 0 2px, transparent 2px 80px), repeating-linear-gradient(0deg, color-mix(in srgb, var(--c3) 80%, transparent) 0 2px, transparent 2px 80px);transform-origin:bottom;opacity:.55;height:55vh;animation:2s linear infinite floor;position:absolute;bottom:-12vh;left:-50%;right:-50%;transform:perspective(500px)rotateX(62deg);-webkit-mask-image:linear-gradient(#0000 10%,#000 90%);mask-image:linear-gradient(#0000 10%,#000 90%)}@keyframes floor{to{background-position:0 0,0 80px}}.club__beam{transform-origin:top;background:linear-gradient(to bottom, color-mix(in srgb, var(--beam) 85%, transparent), transparent 85%);clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);mix-blend-mode:screen;filter:blur(5px);width:26vmin;height:135vh;opacity:calc(.25 + var(--energy) * .45);margin-left:-13vmin;animation:3s ease-in-out infinite alternate swing;position:absolute;top:-8vh}@keyframes swing{0%{transform:rotate(-38deg)}to{transform:rotate(38deg)}}.club__ball{background:radial-gradient(circle at 32% 28%, #fff 0 6%, transparent 30%), repeating-conic-gradient(from 0deg, #cbd5e1 0 6deg, #64748b 6deg 12deg);width:11vmin;height:11vmin;box-shadow:0 0 6vmin color-mix(in srgb, var(--c2) 80%, transparent), inset -1vmin -1vmin 3vmin #0008;opacity:.85;border-radius:50%;margin-left:-5.5vmin;animation:8s linear infinite spin;position:absolute;top:3vh;left:50%}.club__ball:before{content:"";background:#94a3b8;width:2px;height:4vh;position:absolute;bottom:100%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}.club__eq{height:calc(5vh + var(--energy) * 24vh);opacity:.6;align-items:flex-end;gap:.5vw;padding:0 1vw;transition:height .25s ease-out;display:flex;position:absolute;bottom:0;left:0;right:0}.club__eq span{background:linear-gradient(to top, var(--c1), var(--c3));transform-origin:bottom;border-radius:4px 4px 0 0;flex:1;height:100%;animation:.5s ease-in-out infinite alternate eq}@keyframes eq{0%{transform:scaleY(.15)}to{transform:scaleY(1)}}.club__rain{font-size:1.8rem;animation:4s linear infinite rain;position:absolute;top:-8vh}@keyframes rain{to{transform:translateY(120vh)rotate(540deg)}}.club__strobe{opacity:0;pointer-events:none;background:#fff;position:absolute;inset:0}.club[data-fever=true] .club__strobe{animation:.45s step-end infinite strobe}@keyframes strobe{0%{opacity:.14}30%{opacity:0}}.gate{text-align:center;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);width:min(92vw,420px);box-shadow:0 0 60px color-mix(in srgb, var(--c1) 50%, transparent);background:#0d0820cc;border:1px solid #fff2;border-radius:24px;flex-direction:column;gap:16px;margin:auto;padding:36px 28px;display:flex}.gate__title{letter-spacing:.04em;background:linear-gradient(90deg, var(--c3), #fff, var(--c1));color:#0000;filter:drop-shadow(0 0 18px var(--c1));-webkit-background-clip:text;background-clip:text;margin:0;font-family:Black Han Sans,sans-serif;font-size:3.4rem;font-weight:400}.gate__sub{color:#c4b5fd;text-wrap:balance;margin:0;line-height:1.5}.gate__input{color:#fff;font:inherit;text-align:center;background:#ffffff10;border:1px solid #fff3;border-radius:14px;outline:none;padding:14px 16px;font-size:1.1rem}.gate__input:focus{border-color:var(--c3);box-shadow:0 0 0 3px color-mix(in srgb, var(--c3) 35%, transparent)}.gate__button{background:linear-gradient(90deg, var(--c1), var(--c2));border-radius:14px;padding:14px;font-size:1.1rem;font-weight:800;transition:transform .1s,opacity .2s}.gate__button:disabled{opacity:.4;cursor:not-allowed}.gate__button:not(:disabled):active{transform:scale(.97)}.top{justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.top__stage{align-items:baseline;gap:12px;display:flex}.top__label{letter-spacing:.15em;color:#fffa;font-variant-numeric:tabular-nums;font-size:.85rem}.top__name{text-shadow:0 0 16px var(--c1), 0 0 40px var(--c2);font-family:Black Han Sans,sans-serif;font-size:clamp(1.6rem,4vw,2.6rem);font-weight:400}.top__leave{background:#ffffff18;border:1px solid #ffffff2a;border-radius:999px;padding:8px 14px;font-size:.9rem}.top__leave:hover{background:#ffffff2a}.layout{flex:1;grid-template-columns:minmax(0,1.25fr) minmax(280px,.9fr);align-items:center;gap:24px;width:100%;max-width:1200px;min-height:0;margin:0 auto;padding:0 24px 24px;display:grid}.stage{flex-direction:column;align-items:center;gap:16px;min-width:0;display:flex}.room[data-stage="5"] .stage{animation:.35s linear infinite shake}@keyframes shake{25%{transform:translate(2px,-2px)rotate(.4deg)}50%{transform:translate(-2px,1px)rotate(-.4deg)}75%{transform:translate(1px,2px)}}.gif{aspect-ratio:1;width:min(100%,48vh,500px);transition:width .7s cubic-bezier(.3,1.3,.5,1);position:relative}.gif[data-stage="2"]{width:min(100%,51vh,540px)}.gif[data-stage="3"]{width:min(100%,54vh,600px)}.gif[data-stage="4"]{width:min(100%,57vh,640px)}.gif[data-stage="5"]{width:min(100%,60vh,700px);animation:.28s ease-in-out infinite alternate thump}@keyframes thump{to{scale:1.035}}.gif__main{z-index:20;width:80%;transition:left .6s cubic-bezier(.3,1.3,.5,1),width .6s cubic-bezier(.3,1.3,.5,1),bottom .6s cubic-bezier(.3,1.3,.5,1);position:absolute;bottom:10%;left:10%}.gif[data-stage="2"] .gif__main{width:58%;bottom:2%;left:21%}.gif[data-stage="3"] .gif__main{width:63%;bottom:2%;left:18.5%}.gif[data-stage="4"] .gif__main{width:68%;bottom:2%;left:16%}.gif[data-stage="5"] .gif__main{width:75%;bottom:1%;left:12.5%}.gif__frame{aspect-ratio:1;border:3px solid color-mix(in srgb, var(--c3) 70%, #fff);box-shadow:0 0 24px var(--c1), 0 0 70px color-mix(in srgb, var(--c2) 70%, transparent);background:#0c0818;border-radius:28px;animation:.6s cubic-bezier(.2,1.5,.4,1) gif-in,1.2s ease-in-out infinite alternate glow;overflow:hidden}.gif__frame canvas{width:100%;height:100%;display:block}.gif__loading{color:#fff8;place-items:center;height:100%;display:grid}@keyframes gif-in{0%{opacity:0;transform:scale(.3)rotate(-25deg)}}@keyframes glow{to{box-shadow:0 0 40px var(--c3), 0 0 110px var(--c1)}}.room[data-stage="4"] .gif__frame,.room[data-stage="5"] .gif__frame{animation-duration:.6s,.35s}.gif__hearts{pointer-events:none;z-index:30;position:absolute;inset:0}.gif__hearts span{animation:1.1s ease-out forwards heart;position:absolute;bottom:10%}@keyframes heart{0%{opacity:1;transform:translate(0)scale(.4)}to{transform:translate(var(--drift), -42vh) scale(1.3) rotate(25deg);opacity:0}}.gauge{width:min(100%,460px)}.gauge__track{background:#ffffff1a;border:1px solid #ffffff2a;border-radius:999px;height:18px;overflow:hidden}.gauge__fill{background:linear-gradient(90deg, var(--c1), var(--c2), var(--c3));height:100%;box-shadow:0 0 16px var(--c3);border-radius:999px;transition:width .18s ease-out}.gauge[data-max=true] .gauge__fill{background-size:200% 100%;animation:.8s linear infinite slide}@keyframes slide{to{background-position:-200% 0}}.gauge__text{color:#fffc;font-variant-numeric:tabular-nums;justify-content:space-between;gap:12px;margin-top:8px;font-size:.92rem;display:flex}.gauge__text b{color:#fff;font-size:1.15rem}.like{-webkit-user-select:none;user-select:none;touch-action:manipulation;background:linear-gradient(90deg, var(--c1), var(--c2));box-shadow:0 8px 0 #0008, 0 0 36px color-mix(in srgb, var(--c1) 80%, transparent);border-radius:999px;padding:18px 56px;font-size:1.5rem;font-weight:900;transition:transform 60ms,box-shadow 60ms}.like:active{box-shadow:0 2px 0 #0008, 0 0 60px var(--c3);transform:translateY(6px)scale(.97)}.like__icon{animation:.6s ease-in-out infinite alternate beat;display:inline-block}@keyframes beat{to{transform:scale(1.3)}}.hint{color:#fff9;font-variant-numeric:tabular-nums;margin:0;font-size:.85rem}.board{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 0 40px color-mix(in srgb, var(--c2) 35%, transparent);background:#0d0820b3;border:1px solid #fff2;border-radius:24px;padding:20px}.board__title{letter-spacing:.02em;margin:0 0 14px;font-size:1.05rem}.board__list{margin:0;padding:0;list-style:none;transition:height .3s;position:relative}.board__row{align-items:center;gap:10px;height:38px;transition:transform .35s cubic-bezier(.3,1.3,.5,1);display:flex;position:absolute;top:0;left:0;right:0}.board__rank{text-align:center;color:#fffa;font-variant-numeric:tabular-nums;width:24px;font-weight:800}.board__track{background:#ffffff12;border-radius:10px;flex:1;justify-content:space-between;align-items:center;height:100%;padding:0 12px;display:flex;position:relative;overflow:hidden}.board__bar{background:linear-gradient(90deg, color-mix(in srgb, var(--c2) 75%, transparent), color-mix(in srgb, var(--c1) 75%, transparent));border-radius:10px;transition:width .25s ease-out;position:absolute;inset:0 auto 0 0}.board__row[data-top=true] .board__bar{background:linear-gradient(90deg, var(--c1), var(--c3));box-shadow:0 0 18px var(--c3)}.board__row[data-me=true] .board__track{outline-offset:-2px;outline:2px solid #fff}.board__name,.board__count{text-shadow:0 1px 3px #000a;white-space:nowrap;font-weight:700;position:relative}.board__name{text-overflow:ellipsis;overflow:hidden}.board__name em{opacity:.8;font-style:normal;font-weight:500}.board__count{font-variant-numeric:tabular-nums;padding-left:8px}.fever{z-index:10;pointer-events:none;place-items:center;animation:.5s ease-in 3s forwards fever-out;display:grid;position:fixed;inset:0;overflow:hidden}@keyframes fever-out{to{opacity:0}}.fever__rays{background:repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--c1) 55%, transparent) 0 8deg, transparent 8deg 16deg, color-mix(in srgb, var(--c3) 45%, transparent) 16deg 24deg, transparent 24deg 32deg);width:220vmax;height:220vmax;animation:spin calc(7s / var(--stage)) linear infinite, rays-in .5s ease-out;position:absolute;-webkit-mask-image:radial-gradient(circle,#0000 8%,#000 30%,#0000 65%);mask-image:radial-gradient(circle,#0000 8%,#000 30%,#0000 65%)}@keyframes rays-in{0%{opacity:0;scale:.2}}.fever__bit{animation:1.8s cubic-bezier(.1,.7,.3,1) both bit;position:absolute;top:50%;left:50%}@keyframes bit{0%{opacity:1;transform:translate(-50%,-50%)scale(.2)}70%{opacity:1}to{transform:translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(1.2) rotate(360deg);opacity:0}}.fever__text{text-align:center;font-family:Black Han Sans,sans-serif;animation:.55s cubic-bezier(.2,1.8,.4,1) both slam,.4s ease-in-out .55s infinite alternate pulse;position:relative}.fever__text strong{white-space:nowrap;font-weight:400;line-height:1;font-size:min(15vw, calc(2.6rem + var(--stage) * 1.5rem));color:#fff;-webkit-text-stroke:2px var(--c1);text-shadow:0 0 20px var(--c1), 0 0 60px var(--c2), 0 0 120px var(--c3), 6px 6px 0 var(--c2);display:block}.fever__text span{letter-spacing:.12em;text-shadow:0 0 14px var(--c3);margin-top:14px;font-size:clamp(1.2rem,3.5vw,2.2rem);display:block}@keyframes slam{0%{transform:scale(calc(3 + var(--stage))) rotate(-12deg);opacity:0}}@keyframes pulse{to{transform:scale(1.08)rotate(1.5deg)}}@media (width<=800px){body{overflow:auto}.room{height:auto;min-height:100%}.layout{grid-template-columns:1fr;padding:0 16px 24px}.top{padding:12px 16px}.gif{width:min(100%,300px)}}@media (prefers-reduced-motion:reduce){.club__strobe,.room .stage,.room .club{animation:none!important}.club__beam,.club__rain,.fever__rays{animation-duration:20s!important}}.gauge__track{position:relative}.gauge__keep{background:#fff;border-radius:2px;width:3px;margin-left:-1px;position:absolute;top:-3px;bottom:-3px;box-shadow:0 0 8px #fff}.warn{color:#fecaca;text-shadow:0 0 12px #ef4444;opacity:0;text-align:center;min-height:1.4em;margin:-4px 0;font-size:.95rem;font-weight:800;transition:opacity .2s}.warn[data-show=true]{opacity:1}.room[data-danger=true] .warn{animation:.5s ease-in-out infinite alternate warn}.room[data-danger=true] .gauge__fill{background:linear-gradient(90deg,#ef4444,#f97316);box-shadow:0 0 16px #ef4444}.room[data-danger=true]:after{content:"";pointer-events:none;animation:.5s ease-in-out infinite alternate warn;position:absolute;inset:0;box-shadow:inset 0 0 120px #ef4444aa}@keyframes warn{0%{opacity:.45}to{opacity:1}}.show__floor,.show__riser{z-index:1;background:radial-gradient(ellipse at center, color-mix(in srgb, var(--c1) 75%, transparent), color-mix(in srgb, var(--c2) 40%, transparent) 55%, transparent 74%);border:2px solid color-mix(in srgb, var(--c3) 85%, transparent);box-shadow:0 0 30px var(--c1), inset 0 0 40px color-mix(in srgb, var(--c3) 70%, transparent);border-radius:50%;animation:.7s cubic-bezier(.2,1.4,.4,1) backwards stage-in,.9s ease-in-out infinite alternate floor-pulse;position:absolute}.show__floor{height:26%;bottom:-7%;left:-8%;right:-8%}.show__riser{z-index:0;opacity:.7;height:34%;bottom:24%;left:3%;right:3%}@keyframes stage-in{0%{opacity:0;scale:.3 1}}@keyframes floor-pulse{to{box-shadow:0 0 60px var(--c3), inset 0 0 60px var(--c1)}}.show__screen{z-index:0;background:repeating-linear-gradient(90deg, color-mix(in srgb, var(--c1) 90%, transparent) 0 5%, transparent 5% 10%), repeating-linear-gradient(0deg, transparent 0 8px, #0006 8px 10px), linear-gradient(var(--c2), var(--c3));border:2px solid color-mix(in srgb, var(--c3) 70%, transparent);opacity:.4;background-size:200% 100%,auto,auto;border-radius:18px;animation:.7s ease-out backwards stage-in,1.6s steps(10,end) infinite screen;position:absolute;inset:-2% 0 34%;-webkit-mask-image:linear-gradient(#000 55%,#0000);mask-image:linear-gradient(#000 55%,#0000)}@keyframes screen{to{background-position:-100% 0,0 0,0 0}}.gif[data-stage="4"] .show__screen{opacity:.55;animation-duration:.7s,1s}.gif[data-stage="5"] .show__screen{opacity:.7;animation-duration:.7s,.5s}.show__truss{z-index:2;background:repeating-linear-gradient(45deg,#94a3b8 0 3px,#0000 3px 10px),repeating-linear-gradient(-45deg,#94a3b8 0 3px,#0000 3px 10px);border-block:3px solid #cbd5e1;border-radius:4px;height:5%;animation:.6s ease-out backwards stage-in;position:absolute;top:-7%;left:-4%;right:-4%}.show__truss span{transform-origin:top;background:linear-gradient(to bottom, #fff, color-mix(in srgb, var(--c3) 70%, transparent) 15%, transparent 85%);clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);mix-blend-mode:screen;opacity:.55;width:12%;height:900%;margin-left:-6%;animation:1.4s ease-in-out infinite alternate lamp;position:absolute;top:100%}.gif[data-stage="5"] .show__truss span{opacity:.8;animation-duration:.6s}@keyframes lamp{0%{transform:rotate(-22deg)}to{transform:rotate(22deg)}}.show__pyro{z-index:15;filter:blur(3px);transform-origin:bottom;mix-blend-mode:screen;background:linear-gradient(#0000,#f97316 45%,#fde047 75%,#fff);border-radius:50% 50% 20% 20%;width:7%;height:62%;animation:.32s ease-in-out infinite alternate jet;position:absolute;bottom:2%}.show__pyro[data-side="-1"]{left:-5%}.show__pyro[data-side="1"]{animation-delay:-.15s;right:-5%}@keyframes jet{0%{transform:scaleY(.35)scaleX(.8)}to{transform:scaleY(1)scaleX(1.1)}}.show__dancer{aspect-ratio:1;translate:-50%;scale:var(--flip) 1;filter:drop-shadow(0 0 10px var(--c3));border-radius:16%;animation:.55s cubic-bezier(.2,1.6,.4,1) backwards dancer-in,.42s ease-in-out infinite alternate bob;position:absolute}@keyframes dancer-in{0%{opacity:0;translate:-50% 60%;scale:0}}@keyframes bob{to{translate:-50% -7%}}.gif[data-stage="4"] .show__dancer{animation-duration:.55s,.32s}.gif[data-stage="5"] .show__dancer{animation-duration:.55s,.22s}@media (prefers-reduced-motion:reduce){.show__dancer,.show__pyro,.show__truss span,.show__screen{animation-duration:.55s,3s!important}}.show__lasers{z-index:3;position:absolute;top:-6%;left:50%}.show__lasers span{transform-origin:top;background:linear-gradient(#fff, var(--c3) 12%, transparent 92%);width:4px;height:760px;box-shadow:0 0 10px var(--c3);mix-blend-mode:screen;animation:.7s ease-in-out infinite alternate laser;position:absolute;top:0;left:-2px}.show__lasers span:nth-child(3n){background:linear-gradient(#fff, var(--c2) 12%, transparent 92%);box-shadow:0 0 10px var(--c2)}.show__lasers span:nth-child(3n+1){background:linear-gradient(#fff, var(--c1) 12%, transparent 92%);box-shadow:0 0 10px var(--c1)}@keyframes laser{0%{transform:rotate(var(--from))}to{transform:rotate(var(--to))}}@property --ring{syntax:"<angle>";inherits:false;initial-value:0deg}.gif[data-stage="5"] .gif__main:before{content:"";z-index:-1;filter:blur(7px);background:conic-gradient(from var(--ring), #ff2bd6, #ffd400, #af0, #22e8ff, #9d5cff, #ff2bd6);border-radius:36px;animation:.9s linear infinite ring;position:absolute;inset:-10px}@keyframes ring{to{--ring:360deg}}@media (prefers-reduced-motion:reduce){.gif[data-stage="5"],.show__lasers span,.gif[data-stage="5"] .gif__main:before{animation:none!important}}
