:root{--ink:#0b1a24;--navy:#0f2432;--glass:#0e2430bd;--glass2:#0a1a24db;--line:#f4eedd33;--line2:#f4eedd6b;--cream:#f6f0df;--text:#eef2ec;--label:#d9e2de;--muted:#a9bcbd;--gold:#e3b45e;--gold2:#f6dda2;--sky:#8fd0cc;--jade:#8fd0cc;--red:#e2826a;--head:"AsraSerif", "Noto Serif KR", Georgia, serif;--ui:"Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;--body:var(--ui);--r:12px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;color:var(--text);font-family:var(--ui);background:#08141c;margin:0;overflow:hidden}body{touch-action:manipulation;-webkit-user-select:none;user-select:none}html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}#stage{transform-origin:0 0;background:var(--ink);width:720px;height:1280px;position:fixed;top:0;left:0;overflow:hidden}#game{z-index:0;background:var(--ink);position:absolute;top:0;bottom:0;left:0;right:0}#game canvas{display:block}#ui{pointer-events:none;font-size:26px;position:absolute;top:0;bottom:0;left:0;right:0}#ui>*{pointer-events:auto}#ui,#ui button,#ui input,#ui select,.toast{font-family:var(--ui)}button{cursor:pointer;color:inherit;border:none}#ui b,.stat b,.chip span,.who .cp,.cell .en,.odds td:last-child{font-variant-numeric:tabular-nums}.frame{background:var(--glass);border:1px solid var(--line);border-radius:var(--r);-webkit-backdrop-filter:blur(14px)saturate(1.1);backdrop-filter:blur(14px)saturate(1.1);position:relative;box-shadow:inset 0 1px #ffffff14,0 10px 30px #040e1659}.frame:before{content:"";pointer-events:none;background:linear-gradient(90deg, transparent, var(--gold), transparent);opacity:.85;height:1px;position:absolute;top:-1px;left:18%;right:18%}.btn{font-family:var(--ui);letter-spacing:.2px;color:#1d2630;background:linear-gradient(#f5d38a,#dfa954);border:1px solid #fff0cdb3;border-radius:10px;padding:12px 22px;font-size:28px;font-weight:700;line-height:1.2;transition:transform 80ms,filter .15s;box-shadow:0 4px 14px #0a182247,inset 0 1px #ffffff8c}.btn:active{filter:brightness(.96);transform:translateY(1px)scale(.985)}.btn.jade{color:#10252c;background:linear-gradient(#bfe7e2,#86c7c2);border-color:#e6fffab3}.btn.ghost{color:var(--cream);border:1px solid var(--line2);box-shadow:none;background:#f4eedd0d}.btn.red{color:#2a1410;background:linear-gradient(#f0a088,#d06e57);border-color:#ffdccd99}.btn[disabled],.btn.off{filter:saturate(.25)brightness(.72)}.btn.sm{padding:9px 16px;font-size:26px}#hud{background:linear-gradient(#0a1c28d1,#0a1c2873 70%,#0a1c2800);align-items:center;gap:14px;width:720px;height:116px;padding:4px 16px;display:flex;position:absolute;top:0;left:0}.por{border:2px solid var(--cream);background:var(--navy) center/cover no-repeat;border-radius:50%;flex:none;width:92px;height:92px;position:relative;box-shadow:0 0 0 1px #e3b45eb3,0 0 0 5px #0e243073,0 4px 14px #0000004d}.por .lv{background:var(--glass2);color:var(--gold2);font:700 22px var(--ui);border:1px solid var(--line2);white-space:nowrap;border-radius:10px;padding:0 10px;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.who{flex:1;min-width:0}.who .nm,.who .cp{line-height:1.08}.who .nm{font:700 30px var(--ui);color:var(--cream);white-space:nowrap;text-overflow:ellipsis;text-shadow:0 1px 6px #00000073;overflow:hidden}.who .cp{font:700 30px var(--ui);color:#fff;text-shadow:0 1px 6px #00000073}.who .cp small{color:var(--gold2);margin-right:8px;font-size:26px;font-weight:500}.cur{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.chip{border:1px solid var(--line);height:34px;font:700 26px/32px var(--ui);min-width:168px;color:var(--text);background:#0a1c289e;border-radius:17px;justify-content:space-between;align-items:center;gap:6px;padding:0 14px 0 3px;display:flex}.chip img{object-fit:cover;border-radius:50%;width:28px;height:28px}.chip.pulse{animation:.25s pulse}@keyframes pulse{50%{border-color:var(--gold2);transform:scale(1.06)}}#expbar{background:#0a1c288c;width:720px;height:6px;position:absolute;top:116px;left:0}#expbar i{background:linear-gradient(90deg, var(--sky), var(--gold2));width:0;height:100%;transition:width .3s;display:block;box-shadow:0 0 8px #f6dda280}#stagebar{align-items:center;gap:10px;display:flex;position:absolute;top:132px;left:12px;right:12px}.zone{font:700 30px var(--head);color:var(--cream);text-shadow:0 1px 8px #0009,0 0 2px #00000080;flex:1}.zone small{font:500 26px var(--ui);color:var(--text);display:block}.killbar{border:1px solid var(--line);background:#0a1c2899;border-radius:3px;width:160px;height:6px;margin-top:6px;overflow:hidden}.killbar i{background:var(--gold);width:0;height:100%;transition:width .3s;display:block}.toggle{font:700 26px var(--ui);border:1px solid var(--line2);color:var(--label);background:#0a1c289e;border-radius:20px;padding:7px 16px}.toggle.on{color:#10252c;background:var(--sky);border-color:#e6fffab3}.toggle.off{color:#ffc2b0;border-color:#e2826abf}.toggle.pause{color:var(--cream);border-color:var(--line2)}#stagebar .toggle,#stagebar .btn{min-height:44px}#skillbar{gap:12px;display:flex;position:absolute;top:748px;right:14px}.sk{border:2px solid var(--cream);background:var(--navy) center/160% no-repeat;border-radius:50%;width:88px;height:88px;position:relative;overflow:hidden;box-shadow:0 0 0 1px #e3b45e99,0 4px 12px #0006}.sk .cd{border-radius:50%;position:absolute;top:0;bottom:0;left:0;right:0}.sk.locked{filter:grayscale()brightness(.45)}.sk.flash{animation:.5s skflash}@keyframes skflash{0%{box-shadow:0 0 #f6dda2e6}to{box-shadow:0 0 0 18px #f6dda200}}#townbtn{position:absolute;top:770px;left:14px}#panel{overscroll-behavior:contain;background:#0c202cd6;border-bottom:none;border-radius:18px 18px 0 0;width:720px;height:312px;padding:12px 18px 16px;position:absolute;top:856px;left:0;overflow-y:auto}#panel::-webkit-scrollbar{width:0}#nav{border-top:1px solid var(--line);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#08161ff0;width:720px;height:112px;display:flex;position:absolute;bottom:0;left:0}#nav button{color:var(--muted);font:500 26px var(--ui);background:0 0;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:4px;display:flex;position:relative}#nav button svg{stroke:currentColor;fill:none;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;opacity:.85;width:44px;height:44px}#nav button.on{color:var(--gold2);font-weight:700}#nav button.on svg{opacity:1;filter:drop-shadow(0 0 6px #f6dda273)}#nav button.on:after{content:"";background:var(--gold);border-radius:1px;height:2px;position:absolute;top:-1px;left:32%;right:32%}#nav .dot{background:var(--red);border-radius:50%;width:11px;height:11px;display:none;position:absolute;top:12px;right:30px;box-shadow:0 0 0 2px #08161fe6}#nav .dot.on{display:block}.bagpulse{animation:.3s pulse}h3{font:700 31px var(--head);color:var(--cream);letter-spacing:.3px;margin:4px 0 10px}.row{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:9px 0;display:flex}.row .grow{flex:1;min-width:0}.row .btn.sm{padding:9px 13px}.row .btn.ghost.sm{padding:9px 11px}.row .t{font:700 28px var(--ui);color:var(--cream)}.row .s{color:var(--label);font-size:26px}.stats{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:6px;display:grid}.stat{border:1px solid var(--line);background:#f4eedd0d;border-radius:10px;padding:6px 10px}.stat b{font:700 34px var(--ui);color:#fff;white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.stat span{color:var(--label);font-size:26px;font-weight:500}.ico{object-fit:cover;border:1px solid var(--line2);background:var(--navy);border-radius:12px;flex:none;width:64px;height:64px}.slots{grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:12px;display:grid}.grid{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}.cell{aspect-ratio:1;background:radial-gradient(circle at 50% 38%,#24465a,#0e2230);border:2px solid #6b7b80;border-radius:12px;position:relative;overflow:hidden}.cell img{object-fit:cover;width:100%;height:100%}.slots .cell img{object-fit:contain;box-sizing:border-box;padding:4px 4px 18px}.cell .en{font:700 22px var(--ui);color:#fff;text-shadow:0 0 3px #000,0 0 3px #000;position:absolute;top:1px;right:4px}.cell .lb{text-align:center;color:var(--label);background:#08161fb8;font-size:22px;font-weight:700;line-height:1.25;position:absolute;bottom:0;left:0;right:0}.cell.empty{opacity:.55;border-style:dashed;border-color:var(--line2)}.cell.new:before{content:"";background:var(--red);z-index:2;border-radius:50%;width:9px;height:9px;position:absolute;top:5px;left:5px}.modal-bg{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0610189e;justify-content:center;align-items:center;animation:.2s fade;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.modal{text-align:center;background:var(--glass2);width:620px;max-height:1100px;padding:30px 28px;animation:.25s cubic-bezier(.2,1.2,.4,1) pop;overflow-y:auto}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:scale(.94)}}.modal h2{font:700 38px var(--head);color:var(--cream);letter-spacing:.5px;margin:0 0 8px}.modal p{color:var(--label);margin:6px 0 14px;font-size:26px}.btns{flex-wrap:wrap;justify-content:center;gap:12px;margin-top:16px;display:flex}.reward-grid{grid-template-columns:repeat(2,1fr);gap:10px;margin:16px 0;display:grid}.reward{border:1px solid var(--line);text-align:left;background:#f4eedd0d;border-radius:12px;align-items:center;gap:10px;padding:10px;display:flex}.reward img{object-fit:cover;border-radius:8px;width:48px;height:48px}.reward b{font:700 34px var(--ui);color:#fff;display:block}.reward span{color:var(--label);font-size:26px}.chest{background:50%/cover no-repeat;border-radius:50%;width:220px;height:220px;margin:0 auto;animation:1.6s infinite alternate chestglow;position:relative;box-shadow:0 0 60px #f6dda280}@keyframes chestglow{to{transform:scale(1.03);box-shadow:0 0 100px #f6dda2cc}}.rays{background:repeating-conic-gradient(#f6dda238 0 8deg, transparent 8deg 22deg);z-index:-1;border-radius:50%;animation:12s linear infinite spin;position:absolute;top:-60px;bottom:-60px;left:-60px;right:-60px;-webkit-mask:radial-gradient(circle,#000 30%,#0000 70%);mask:radial-gradient(circle,#000 30%,#0000 70%)}@keyframes spin{to{transform:rotate(360deg)}}.toast{background:var(--glass2);border:1px solid var(--line2);color:var(--cream);font:700 28px var(--ui);z-index:60;white-space:nowrap;pointer-events:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:24px;padding:10px 24px;animation:2.2s forwards toast;position:absolute;top:200px;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #0000004d}@keyframes toast{0%{opacity:0;transform:translate(-50%,10px)}10%,80%{opacity:1;transform:translate(-50%)}to{opacity:0}}.banner{text-align:center;font:700 60px var(--head);color:var(--cream);z-index:40;pointer-events:none;letter-spacing:1px;text-shadow:0 0 1px var(--gold), 0 0 24px #f6dda2bf, 0 3px 16px #06121cb3;animation:1.8s forwards banner;position:absolute;top:380px;left:0;right:0}.banner.bad{color:#ffd0c2;text-shadow:0 0 22px #e2826ab3,0 3px 16px #06121cb3;font-size:44px}@keyframes banner{0%{opacity:0;letter-spacing:12px;transform:scale(1.25)}15%{opacity:1;letter-spacing:1px;transform:scale(1)}80%{opacity:1}to{opacity:0;transform:translateY(-24px)}}.screen{z-index:30;background:var(--ink) center/cover no-repeat;flex-direction:column;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.screen .shade{background:linear-gradient(#0c223266 0%,#0c223224 26%,#0c223200 42% 58%,#0a1a268c 80%,#08141ed9);position:absolute;top:0;bottom:0;left:0;right:0}.langs{z-index:2;gap:6px;display:flex;position:absolute;top:20px;right:20px}.langs button{border:1px solid var(--line2);color:var(--cream);font:700 24px var(--ui);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0a1c2873;border-radius:16px;padding:4px 14px}.langs button.on{background:var(--cream);color:#1d2630}.logo{text-align:center;flex-direction:column;align-items:center;margin-top:96px;animation:1.6s ease-out both logoin;display:flex;position:relative}@keyframes logoin{0%{opacity:0;filter:blur(4px);transform:translateY(10px)}}.logo .emb{filter:drop-shadow(0 0 1px #e3b45ee6)drop-shadow(0 2px 10px #08182473);width:176px;height:123px;margin-bottom:4px;overflow:visible}.logo h1{font:700 132px/1.05 "AsraBatang", var(--head);letter-spacing:14px;background:linear-gradient(#fffdf6 20%,#f6ecd2 62%,#e9d3a0);color:#0000;filter:drop-shadow(0 0 1px #c4943ef2)drop-shadow(0 0 16px #fff0cd8c)drop-shadow(0 4px 14px #08182480);-webkit-background-clip:text;background-clip:text;margin:0;padding-left:14px}.logo .rule{align-items:center;gap:12px;width:380px;margin:6px 0 8px;display:flex}.logo .rule i{background:linear-gradient(90deg,#0000,#f6dda2f2);flex:1;height:1px}.logo .rule i:last-child{background:linear-gradient(270deg,#0000,#f6dda2f2)}.logo .rule svg{filter:drop-shadow(0 0 4px #f6dda2cc);width:18px;height:18px}.logo .en{font:600 40px/1 "Cinzel", var(--head);letter-spacing:22px;color:var(--cream);text-shadow:0 0 1px #c4943ee6,0 0 12px #fff0cd80,0 2px 10px #0818248c;padding-left:22px}.logo .sub{font:500 26px var(--ui);letter-spacing:6px;color:#f6f0dfeb;text-shadow:0 1px 8px #081824b3;margin-top:16px}.login-box{flex-direction:column;gap:14px;width:540px;margin-top:auto;margin-bottom:84px;padding:26px 28px;display:flex;position:relative}.login-box input,.cdesc input{font:500 26px var(--ui);border:1px solid var(--line2);color:#fff;background:#06121a73;border-radius:10px;outline:none;padding:14px 16px}.login-box input:focus,.cdesc input:focus,.chatin input:focus,.fld:focus{border-color:var(--gold2)}.link{color:var(--gold2);font:500 26px var(--ui);text-underline-offset:4px;background:0 0;padding:6px;text-decoration:underline}.err{color:#ffc2b0;text-align:center;min-height:22px;font-size:26px}.login-box .err:empty{min-height:0;margin:-7px 0}.classes{gap:10px;width:100%;margin-top:14px;padding:0 16px;display:flex;position:relative}.ccard{border:1px solid var(--line2);background:var(--navy) center 15%/cover no-repeat;border-radius:12px;flex:1;height:150px;transition:transform .15s;position:relative;overflow:hidden}.ccard span{font:700 22px var(--ui);color:var(--cream);text-align:center;background:linear-gradient(#0000,#08141eeb);padding:18px 2px 5px;position:absolute;bottom:0;left:0;right:0}.ccard.on{border:2px solid var(--gold2);transform:translateY(-4px);box-shadow:0 0 16px #f6dda28c}.cpreview{flex:1;justify-content:center;align-items:flex-end;width:100%;min-height:0;display:flex;position:relative}.cpreview img{filter:drop-shadow(0 10px 20px #0009);transform-origin:bottom;max-width:90%;max-height:100%;animation:3s ease-in-out infinite breathe}@keyframes breathe{50%{transform:scaleY(1.012)translateY(-3px)}}.cdesc{flex-direction:column;gap:10px;width:640px;margin:10px 0 24px;padding:18px 22px;display:flex;position:relative}.cdesc .t{font:700 34px var(--head);color:var(--cream)}.cdesc div{font-size:26px}.odds{border-collapse:collapse;width:100%;margin-top:8px;font-size:26px}.odds td{border-bottom:1px solid var(--line);padding:4px 8px}.odds td:last-child{text-align:right}.loading{z-index:70;background:var(--ink) center/cover;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:150px;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.loading:after{content:"";background:linear-gradient(#0c223280,#0c22322e 26%,#0c223200 42%,#08141e8c);position:absolute;top:0;bottom:0;left:0;right:0}.loading .logo{z-index:1;position:absolute;top:0;left:0;right:0}.loading span{z-index:1;font:500 28px var(--ui);letter-spacing:4px;color:var(--cream);text-shadow:0 1px 8px #081824cc;position:relative}.loading span:after{content:"";background:linear-gradient(90deg, transparent, var(--gold2), transparent) -220px 0/220px 100% no-repeat, #f6f0df33;border-radius:1px;width:220px;height:2px;margin:14px auto 0;animation:1.4s linear infinite sweep;display:block}@keyframes sweep{to{background-position:220px 0,0 0}}.cards{grid-template-columns:repeat(5,1fr);gap:8px;margin:12px 0;display:grid}.cards .cell{animation:.5s backwards flip}@keyframes flip{0%{opacity:0;transform:rotateY(90deg)scale(.6)}}.glow4{box-shadow:0 0 16px #ffc24a}.glow5{box-shadow:0 0 22px #ff4d5e}.glow3{box-shadow:0 0 12px #c47bff}.chatlog{border:1px solid var(--line);text-align:left;background:#06121a66;border-radius:10px;height:170px;padding:6px 12px;font-size:26px;overflow-y:auto}.chatlog div{padding:2px 0}.chatlog b{color:var(--gold2);font-weight:700}.chatin{gap:8px;margin-top:8px;display:flex}.chatin input,.fld{font:500 26px var(--ui);border:1px solid var(--line2);color:#fff;background:#06121a73;border-radius:10px;outline:none;flex:1;min-width:0;padding:9px 12px}.fld.block{width:100%;margin:6px 0;padding:12px 14px;display:block}.note{color:var(--muted);margin:8px 0 0;font-size:26px}.in-town #stagebar,.in-town #skillbar{display:none}.rankchip{border:1px solid var(--line2);font:700 24px/30px var(--ui);color:var(--gold2);white-space:nowrap;text-overflow:ellipsis;background:#0a1c289e;border-radius:15px;align-items:center;gap:8px;max-width:100%;margin-top:2px;padding:0 12px;display:inline-flex;overflow:hidden}.rankchip i{font-size:22px;font-style:normal}.rankchip i.up{color:#9ee6b8}.rankchip i.down{color:#ffb4a0}#panel.tall{height:698px;top:470px}.rank,.rbody,.rlist{flex-direction:column;display:flex}#panel.tall>div{flex-direction:column;min-height:100%;display:flex}.rank,.rbody,.rlist{flex:1}.rlist .myrow{margin-top:auto}.seg{border:1px solid var(--line2);border-radius:12px;gap:0;margin:5px 0;display:flex;overflow:hidden}.seg button{font:500 26px var(--ui);color:var(--label);border-left:1px solid var(--line);white-space:nowrap;text-overflow:ellipsis;background:0 0;flex:1;padding:7px 6px;overflow:hidden}.seg button:first-child{border-left:none}.seg button.on{color:var(--gold2);box-shadow:inset 0 -2px 0 var(--gold);background:#f6dda229;font-weight:700}.seg.mini{flex:none;margin:0}.seg.mini button{flex:none;padding:6px 14px;font-size:24px}.podium{justify-content:center;align-items:flex-end;gap:10px;margin:8px 0 6px;display:flex}.pod{border:1px solid var(--line);background:#f4eedd0d;border-radius:14px;flex-direction:column;flex:1;align-items:center;gap:4px;min-width:0;padding:8px 4px 10px;display:flex}.pod .ico{border-color:#c9ced0}.pod.r1{background:linear-gradient(#f6dda229,#f4eedd08);border-color:#f6dda299}.pod.r1 .ico{border:2px solid var(--gold2);box-shadow:0 0 14px #f6dda280}.pod.r3 .ico{border-color:#d4a27a}.pod .crown{font:700 34px/1 var(--head);color:var(--gold2)}.pod .n{font:700 26px var(--ui);color:var(--cream);text-overflow:ellipsis;white-space:nowrap;max-width:100%;overflow:hidden}.pod .v{font:700 26px var(--ui);color:#fff;font-variant-numeric:tabular-nums}.pod.me,.rrow.me{outline:2px solid var(--sky);outline-offset:-2px;border-radius:10px}.rrow .rk{text-align:center;width:52px;font:700 28px var(--head);color:var(--gold2);font-variant-numeric:tabular-nums}.rrow .val{font:700 26px var(--ui);color:#fff;font-variant-numeric:tabular-nums}.rrow .t{font-size:26px}.rrow .s{font-size:24px}.myrow{font:700 26px var(--ui);color:var(--cream);background:#0e2c3af7;border-top:1px solid #8fd0cc99;align-items:center;gap:10px;margin:8px -18px -16px;padding:10px 18px 14px;display:flex;position:sticky;bottom:-16px}.myrow b{color:var(--sky);white-space:nowrap}.myrow .grow{min-width:0;color:var(--cream);flex:1}.myrow .val{color:#fff}.sel{font:500 26px var(--ui);color:var(--cream);border:1px solid var(--line2);background:#06121a80;border-radius:10px;max-width:300px;padding:8px 10px}h3,.zone,.modal h2,.banner,.rrow .rk,.pod .crown,.cdesc .t{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}