*{box-sizing:border-box}#login-screen{position:fixed;inset:0;z-index:10000;background:radial-gradient(ellipse at 50% 60%,#1a0d2e,#05050f 70%);display:flex;align-items:center;justify-content:center;transition:opacity .5s ease}#login-screen.fade-out{opacity:0;pointer-events:none}#login-screen.hidden{display:none}.login-particles{position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1px 1px at 20% 30%,rgba(180,120,255,.5) 0%,transparent 100%),radial-gradient(1px 1px at 60% 15%,rgba(0,200,255,.4) 0%,transparent 100%),radial-gradient(1px 1px at 80% 70%,rgba(255,180,80,.4) 0%,transparent 100%),radial-gradient(1px 1px at 35% 80%,rgba(180,120,255,.3) 0%,transparent 100%)}.login-card{display:flex;flex-direction:column;align-items:center;gap:20px;padding:52px 44px 44px;background:linear-gradient(180deg,#281446e6,#0a0514f2);border:1px solid rgba(180,120,255,.25);border-radius:24px;box-shadow:0 0 60px #823cdc33,inset 0 1px #ffffff0f;width:clamp(280px,90vw,380px)}.login-logo{font:900 clamp(36px,10vw,56px) "Cinzel Decorative","Cinzel",serif;color:#00e5ff;text-shadow:0 0 30px rgba(0,229,255,.6),0 0 60px rgba(0,150,255,.3);letter-spacing:.15em}.login-tagline{font:400 clamp(11px,3vw,14px) "Quicksand",sans-serif;color:#b496dcb3;letter-spacing:.1em;margin-top:-12px}.login-google-btn{display:flex;align-items:center;gap:12px;padding:13px 28px;background:#fff;border:none;border-radius:10px;font:600 15px Quicksand,sans-serif;color:#333;cursor:pointer;width:100%;justify-content:center;transition:background .15s,transform .1s,box-shadow .15s;box-shadow:0 2px 12px #0006}.login-google-btn:hover{background:#f0f0f0;transform:translateY(-1px);box-shadow:0 4px 20px #00000080}.login-google-btn:active{transform:translateY(0)}.login-google-icon{width:20px;height:20px;flex-shrink:0}.login-guest-btn{background:none;border:1px solid rgba(180,120,255,.3);border-radius:8px;color:#b496dc99;font:400 13px Quicksand,sans-serif;cursor:pointer;padding:8px 24px;width:100%;transition:border-color .15s,color .15s}.login-guest-btn:hover{border-color:#b478ff99;color:#c8aaffe6}#user-badge{position:fixed;top:max(10px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left));width:46px;height:46px;display:flex;align-items:center;justify-content:center;background:#0000008c;border:1px solid rgba(255,255,255,.15);border-radius:50%;z-index:9980;cursor:pointer;user-select:none;transition:background .15s,transform .1s}#user-badge:hover{background:#000000bf;transform:scale(1.08)}.user-google-icon{width:22px;height:22px;flex-shrink:0;display:block}#slot-modal{position:fixed;inset:0;z-index:9990;display:flex;align-items:center;justify-content:center}.slot-modal-backdrop{position:absolute;inset:0;background:#0009;backdrop-filter:blur(4px)}.slot-modal-card{position:relative;background:linear-gradient(180deg,#190c2df7,#080412fc);border:1px solid rgba(180,120,255,.25);border-radius:20px;padding:28px 28px 20px;width:clamp(300px,92vw,420px);box-shadow:0 0 60px #6428c840}.slot-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.slot-modal-uname{font:600 13px Quicksand,sans-serif;color:#b496dcb3;display:flex;align-items:baseline;gap:7px}.slot-uname-name{color:#d2b4ffd9;font-weight:700}.slot-uname-email{font-size:11px;font-weight:400;color:#a082c88c}.slot-modal-close{background:none;border:none;color:#b496dc80;font-size:16px;cursor:pointer;padding:2px 6px;transition:color .12s}.slot-modal-close:hover{color:#fffc}.slot-modal-title{font:700 18px Cinzel,serif;color:#dcbeffe6;letter-spacing:.1em;margin-bottom:18px}.slot-list{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.slot-card{display:flex;align-items:center;gap:14px;padding:12px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:12px;cursor:pointer;transition:background .15s,border-color .15s;position:relative}.slot-card:hover{background:#b478ff1a;border-color:#b478ff4d}.slot-card.active{border-color:#78c8ff80;background:#50a0ff14}.slot-card.active:after{content:"현재";position:absolute;top:8px;right:10px;font:600 10px Quicksand,sans-serif;color:#78c8ffcc;background:#50a0ff26;border-radius:4px;padding:2px 6px}.slot-char-img{width:44px;height:44px;border-radius:10px;object-fit:cover;background:#b478ff26;flex-shrink:0}.slot-info{flex:1;min-width:0}.slot-label{font:700 13px Quicksand,sans-serif;color:#dcc8ffe6;margin-bottom:3px}.slot-stats{font:400 11px Quicksand,sans-serif;color:#a08cc899}.slot-empty .slot-label{color:#9682b480}.slot-empty .slot-char-img{opacity:.3;filter:grayscale(1)}.slot-logout-btn{display:block;width:100%;background:none;border:1px solid rgba(255,100,100,.2);border-radius:8px;color:#dc8c8cb3;font:500 13px Quicksand,sans-serif;cursor:pointer;padding:9px;transition:background .12s,color .12s,border-color .12s}.slot-logout-btn:hover{background:#ff50501f;border-color:#ff646466;color:#ffa0a0e6}@media (max-width: 720px){#user-badge{width:38px;height:38px}.user-google-icon{width:18px;height:18px}}#splash{position:fixed;inset:0;z-index:9999;background:#000;opacity:1;transition:opacity .5s ease}#splash.fade-out{opacity:0;pointer-events:none}#splash.hidden{display:none}.splash-page{position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column;opacity:0;transition:opacity .5s ease;cursor:pointer;-webkit-tap-highlight-color:transparent}.splash-page.active{display:flex;opacity:1}#splashFDG{gap:40px}.fdg-wolf-wrap{position:relative;width:clamp(80px,min(22vw,18vh),290px);flex-shrink:0}.fdg-wolf-emblem{width:100%;height:auto;opacity:0;transition:opacity 1.4s ease-out;display:block}.splash-page.active .fdg-wolf-emblem{opacity:.92}.fdg-eye-glow{position:absolute;top:56%;width:16%;height:12%;background:radial-gradient(ellipse at center,rgba(220,30,8,.8) 0%,transparent 70%);pointer-events:none;animation:fdg-eye-pulse 1.4s ease-in-out 1.8s infinite;animation-fill-mode:backwards;transform:translateY(-50%)}.fdg-eye-glow.left{left:33.5%}.fdg-eye-glow.right{left:50.5%}@keyframes fdg-eye-pulse{0%,to{opacity:.1}50%{opacity:.55}}.fdg-title{display:flex;justify-content:center;align-items:baseline;gap:.18em;font:700 clamp(16px,min(6vw,8vh),96px) "Cinzel Decorative","Cinzel",Georgia,serif;letter-spacing:0;white-space:nowrap;transition:gap .8s cubic-bezier(.22,1,.36,1),letter-spacing .8s cubic-bezier(.22,1,.36,1)}.fdg-title.expand{gap:.6em;letter-spacing:.2em}.fdg-title .w{display:inline-flex;align-items:baseline}.fdg-title .a{color:#c9a961;opacity:0;transform:translateY(13px) scale(.87);transition:opacity .5s ease-out,transform .65s cubic-bezier(.22,1,.36,1)}.fdg-title .a.on{opacity:1;transform:translateY(0) scale(1)}.fdg-title .x{display:inline-block;max-width:0;overflow:hidden;white-space:nowrap;vertical-align:bottom;color:#e8e0d0;padding:.1em 0 .4em;transition:max-width .8s cubic-bezier(.22,1,.36,1)}.fdg-title .x.on{max-width:9em}.fdg-title .x:after{content:"";display:inline-block;width:.5em}.fdg-presents{font:400 clamp(12px,1.25vw,24px) "Cinzel Decorative","Cinzel",Georgia,serif;color:#888;letter-spacing:.5em;text-align:center;opacity:0;transition:opacity .5s ease-out 2.5s}.splash-page.active .fdg-presents{opacity:1}.fdg-korean{font:400 clamp(15px,1.7vw,26px) "Noto Serif KR","Noto Serif JP","Noto Serif SC","Noto Serif TC","Noto Serif",serif;color:#c9a961;letter-spacing:.2em;text-align:center}.kr-ch{display:inline-block;opacity:0;transform:translateY(8px);filter:blur(4px);transition:opacity .4s ease-out,transform .4s ease-out,filter .4s ease-out,color .6s ease-out}.fdg-intl{opacity:0;transform:translateY(8px);filter:blur(4px);color:#c9a961;font:400 clamp(15px,1.7vw,26px) "Noto Serif",serif;letter-spacing:.2em;transition:opacity .8s ease-out 3.8s,transform .8s ease-out 3.8s,filter .8s ease-out 3.8s}.kr-sp{display:inline-block;width:.35em}.splash-page.active .kr-ch{opacity:1;transform:translateY(0);filter:blur(0)}.splash-page.active .kr-ch:nth-child(1){transition-delay:3s}.splash-page.active .kr-ch:nth-child(2){transition-delay:3.12s}.splash-page.active .kr-ch:nth-child(3){transition-delay:3.24s}.splash-page.active .kr-ch:nth-child(4){transition-delay:3.36s}.splash-page.active .kr-ch:nth-child(6){transition-delay:3.55s}.splash-page.active .kr-ch:nth-child(7){transition-delay:3.67s}.splash-page.active .kr-ch:nth-child(8){transition-delay:3.79s}.splash-page.active .kr-ch:nth-child(10){transition-delay:3.98s}.splash-page.active .kr-ch:nth-child(11){transition-delay:4.1s}.splash-page.active .kr-ch:nth-child(12){transition-delay:4.22s}.splash-page.active .kr-ch:nth-child(13){transition-delay:4.34s}.splash-page.active .kr-ch:nth-child(15){transition-delay:4.53s}.splash-page.active .kr-ch:nth-child(16){transition-delay:4.65s}.splash-page.active .kr-ch:nth-child(17){transition-delay:4.77s}.splash-page.active .kr-ch:nth-child(18){transition-delay:4.89s}.splash-page.active .fdg-intl{opacity:1;transform:translateY(0);filter:blur(0)}.splash-prompt{position:absolute;bottom:clamp(32px,5vh,64px);left:0;right:0;text-align:center;font:400 clamp(14px,1.5vw,22px) "Cinzel Decorative","Cinzel",Georgia,serif;color:#666;letter-spacing:.35em;opacity:0}.splash-page.active .splash-prompt{animation:splash-prompt-blink 1.2s ease-in-out infinite alternate;animation-delay:5.4s;animation-fill-mode:backwards}@keyframes splash-prompt-blink{0%{opacity:0}to{opacity:.55}}body.screen-splash #game,body.screen-splash #top-btns{display:none}body.screen-game #user-badge,body.screen-result #user-badge{display:none!important}:root{--page-scale: 1;--page-layout-scale: 1}html,body{margin:0;padding:0;height:100%;overflow:hidden;width:100%;max-width:100%;font-family:Jua,Noto Sans KR,system-ui,sans-serif;font-weight:400;font-style:normal;font-kerning:normal;text-rendering:geometricPrecision;letter-spacing:.02em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#05050f;color:#e0e0ff;user-select:none;-webkit-user-select:none;touch-action:manipulation;cursor:url(../assets/cursor-default-32.png) 14 2,auto}a,button,select,input,label,[role=button],.opt-select,.style-btn,.keybind-btn,.bgm-checklist label{cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}html:active{cursor:url(../assets/cursor-pointer-32.png) 14 2,auto}#game{display:flex;flex-direction:column;height:calc(100vh * var(--page-layout-scale));height:calc(100dvh * var(--page-layout-scale));width:calc(100% * var(--page-layout-scale));min-width:0;overflow:hidden;transform:scale(var(--page-scale));transform-origin:top left}body.duel-mode #hud,body.duel-mode #bottom-bar,body.duel-mode #sidebar,body.duel-mode #next-panel{display:none}body.duel-mode #duel-hud{display:flex}#duel-hud{display:none;position:absolute;inset:0;pointer-events:none;z-index:10;justify-content:space-between;padding:10px;gap:0}#duel-hud>*{pointer-events:auto}.duel-card{min-width:0;width:clamp(160px,16vw,220px);display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid rgba(255,255,255,.12);background:#0a0612bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:12px;align-self:flex-start}.duel-card.p1{border-color:#00e5ff57;align-self:flex-start}.duel-card.p2{border-color:#ff44aa57;align-self:flex-start}.duel-card.slowed{box-shadow:inset 0 0 0 1px #ffaa006b,0 0 16px #ffaa0024}.duel-name{font-size:13px;font-weight:900;letter-spacing:1px;color:#fa0}.duel-score{font-size:28px;font-weight:900;color:#00e5ff;font-variant-numeric:tabular-nums}.duel-meta{font-size:11px;color:#e0e0ffb8;line-height:1.5}.duel-next{display:flex;align-items:center;gap:6px;padding:6px 0;border-top:1px solid rgba(255,255,255,.08)}.duel-next span{font-size:9px;font-weight:900;letter-spacing:1px;color:#e0e0ff7a}.duel-chip{width:42px;height:42px;border-radius:8px;border-width:1px;padding:3px}.duel-skills{display:flex;flex-direction:column;gap:5px;padding-top:6px;border-top:1px solid rgba(255,255,255,.08)}.duel-skill{min-width:0;height:30px;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 8px;border-radius:7px;border:1px solid rgba(255,255,255,.12);background:#00000038;font-size:10px;font-weight:800}.duel-skill span{min-width:0;color:#e0e0ffbd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.duel-skill b{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 4px;margin-left:2px;border-radius:5px;background:#ffffff1a;color:#fff;font-size:9px;letter-spacing:0}.duel-skill strong{color:#fa0;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}.duel-skill strong.cooldown{color:#e0e0ff7a}.duel-effect-slow{color:#fa0;font-weight:900}.duel-keys{font-size:10px;color:#e0e0ff85;white-space:nowrap;padding-top:6px;border-top:1px solid rgba(255,255,255,.06);overflow:hidden;text-overflow:ellipsis}#hud{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px 60px 8px 12px;background:#080614f5;border-bottom:2px solid rgba(200,150,40,.7);align-items:center}.stat{display:flex;flex-direction:column;align-items:center;gap:2px}.lbl-sm{font-size:9px;letter-spacing:1.5px;opacity:1;font-weight:700;color:#c8a050;text-shadow:0 1px 4px rgba(0,0,0,.9)}.val{font-size:18px;font-weight:800;color:#ffd54f;text-shadow:0 0 10px rgba(255,200,60,.8),0 1px 3px rgba(0,0,0,1);font-variant-numeric:tabular-nums}.chip-stat{display:flex;flex-direction:column;align-items:center;gap:2px}.chip{width:46px;height:46px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;border:2px solid;transition:all .2s ease;letter-spacing:0;overflow:hidden;padding:3px}#combo-banner{position:absolute;top:50px;left:50%;transform:translate(-50%);pointer-events:none;font-size:32px;font-weight:900;letter-spacing:1px;background:linear-gradient(90deg,#f53,#fc0,#f53);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;opacity:0;transition:opacity .2s,transform .3s;text-shadow:0 0 24px rgba(255,200,80,.6);z-index:50}#combo-banner.show{opacity:1;transform:translate(-50%,-8px)}.speed-bonus-float{position:absolute;top:35%;left:50%;transform:translate(-50%);pointer-events:none;font-size:28px;font-weight:900;color:#4af;text-shadow:0 0 12px rgba(80,180,255,.8),0 2px 4px rgba(0,0,0,.5);z-index:55;animation:speedBonusFloat 1.5s ease-out forwards}@keyframes speedBonusFloat{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-60px)}}#main{flex:1;display:flex;min-height:0;min-width:0}#stage{flex:1;position:relative;min-height:0;min-width:0;overflow:hidden;touch-action:none}canvas{display:block}#diroi-mascot{position:absolute;z-index:5;pointer-events:none;filter:drop-shadow(0 2px 6px rgba(107,45,142,.6));user-select:none;image-rendering:pixelated;background-image:url(../assets/generated/characters/diroi-fly-8.png);background-repeat:no-repeat;background-position:0 0;transform-origin:center bottom;transition:left .35s linear,top .35s linear}body:not(.screen-game) #diroi-mascot{display:none}#top-btns{position:fixed;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));z-index:9999;display:flex;align-items:center;gap:8px;pointer-events:auto}#top-btns button{width:46px;height:46px;min-width:46px;min-height:46px;flex-shrink:0;border-radius:50%;border:none;color:transparent;font-size:0;padding:0;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;background-color:transparent;background-size:contain;background-repeat:no-repeat;background-position:center;touch-action:manipulation;transition:transform .15s,filter .15s;overflow:hidden;position:relative}#top-btns button:hover{transform:scale(1.1);filter:brightness(1.2) drop-shadow(0 4px 12px rgba(255,180,60,.5))}#top-btns button:active{transform:scale(.92)}#opt-btn{background:url(../assets/generated/ui/skill-frame-f.png) center / contain no-repeat!important;filter:drop-shadow(0 2px 6px rgba(180,120,40,.4));z-index:2}#codex-btn{width:56px!important;height:56px!important;min-width:56px;min-height:56px;flex-shrink:0;border-radius:50%;border:none!important;padding:0;background:url(../assets/generated/ui/btn-codex2.png) center / contain no-repeat!important;filter:drop-shadow(0 0 6px rgba(199,125,255,.4));cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;transition:transform .15s,filter .15s}#codex-btn:hover{transform:scale(1.1);filter:brightness(1.15) drop-shadow(0 0 14px rgba(199,125,255,.6))}#codex-btn:active{transform:scale(.92)}#codex-popup{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:75;width:min(96vw,500px);max-height:92vh;overflow:hidden;background:linear-gradient(180deg,#150525,#1f0a3c 60%,#150525);border-radius:4px;padding:0;box-shadow:inset 0 0 0 3px #c8922a,inset 0 0 0 6px #1a0730,inset 0 0 0 9px #e8c060,inset 0 0 0 12px #1a0730,inset 0 0 0 14px #a07020,inset 0 0 60px #3c0a6480,0 0 0 1px #5a3208,0 0 0 3px #c8922a,0 0 0 5px #5a3208,0 0 50px #6b2d8e99,0 20px 40px #000000d9}#codex-popup.show{display:block}.codex-inner{max-height:92vh;overflow-y:auto;padding:28px 26px 24px;box-sizing:border-box}.codex-popup-title{color:#f0c078;font-size:16px;font-weight:900;margin-bottom:12px;text-align:center;font-family:var(--pf-font-display, inherit)}#codex-popup .weakness-flow{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:12px}#codex-popup .weakness-note{font-size:11px;color:#f5e6c8b3;margin-bottom:12px}#codex-close{display:block;margin:0 auto;padding:6px 24px;background:#c77dff33;border:1px solid rgba(199,125,255,.4);border-radius:8px;color:#f0e0ff;font-size:13px;font-weight:700;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}#codex-close:hover{background:#c77dff59}#opt-modal{position:fixed;inset:0;background:#000000b3;display:none;align-items:center;justify-content:center;z-index:60;padding:20px}#opt-modal.show{display:flex}.opt-card{width:100%;max-width:430px;max-height:calc(100dvh - 40px);overflow-y:auto;background:linear-gradient(135deg,#1a1a3a,#0a0a1a);border:1px solid rgba(0,229,255,.3);border-radius:12px;padding:18px;box-shadow:0 0 30px #00e5ff33;display:flex;flex-direction:column;gap:14px;scrollbar-gutter:stable}.opt-head{display:flex;justify-content:space-between;align-items:center;font-size:18px;font-weight:800;color:#00e5ff;padding-bottom:8px;border-bottom:1px solid rgba(0,229,255,.2)}#opt-close{width:30px;height:30px;background:transparent;border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:50%;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;font-family:inherit;font-size:14px;padding:0}.opt-row{display:grid;grid-template-columns:80px 1fr 36px;align-items:center;gap:10px}.opt-row-toggle{grid-template-columns:80px 1fr}.opt-label{font-size:13px;color:#ccc;font-weight:600}.opt-row input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;background:#00e5ff26;border-radius:3px;outline:none}.opt-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:#00e5ff;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;box-shadow:0 0 8px #00e5ff80}.opt-row input[type=range]::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#00e5ff;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;border:none}.opt-val{font-size:12px;color:#00e5ff;text-align:right;font-variant-numeric:tabular-nums;font-weight:700}.opt-toggle{height:32px;border-radius:8px;border:1px solid rgba(255,255,255,.2);background:#ffffff0d;color:#888;font-family:inherit;font-size:12px;font-weight:800;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;letter-spacing:1px}.opt-toggle.on{background:linear-gradient(135deg,#00e5ff,#0080a0);color:#050510;border-color:#00e5ff}.opt-seg{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;background:#0000004d;border-radius:8px;padding:3px}.opt-seg button{height:28px;border:none;background:transparent;color:#888;font-family:inherit;font-size:11px;font-weight:700;border-radius:6px;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}.opt-seg button.active{background:linear-gradient(135deg,#00e5ff,#0080a0);color:#050510}.keybind-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#00000038}.keybind-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;font-weight:900;color:#fa0}#keybind-reset{height:28px;padding:0 10px;border:1px solid rgba(255,170,0,.32);border-radius:7px;background:#ffaa001a;color:#fa0;font-family:inherit;font-size:11px;font-weight:800;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}.keybind-group{display:flex;flex-direction:column;gap:6px}.keybind-title{font-size:10px;font-weight:900;letter-spacing:1px;color:#e0e0ff94}.keybind-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.keybind-btn{min-width:0;height:38px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 10px;border:1px solid rgba(0,229,255,.18);border-radius:8px;background:#ffffff0b;color:#e0e0ff;font-family:inherit;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}.keybind-btn.listening{border-color:#fa0;box-shadow:0 0 12px #ffaa002e}.keybind-action{min-width:0;font-size:12px;font-weight:700;color:#e0e0ffb8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.keybind-value{flex:0 0 auto;min-width:34px;max-width:74px;height:24px;display:inline-flex;align-items:center;justify-content:center;padding:0 7px;border-radius:6px;background:#00e5ff1f;color:#00e5ff;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.opt-action{margin-top:6px;height:42px;background:linear-gradient(135deg,#fa0,#c60);color:#1a0a00;border:none;border-radius:10px;font-family:inherit;font-size:14px;font-weight:800;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}.opt-action:active{transform:scale(.97)}.opt-group{margin-top:10px}.opt-group>label{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#ffffff80;margin-bottom:6px}.style-picker{display:flex;flex-wrap:wrap;gap:4px}.style-btn{height:28px;padding:0 10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0f;color:#ffffff8c;font-family:inherit;font-size:11px;font-weight:600;border-radius:6px;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;transition:all .15s}.style-btn:hover{background:#ffffff1f;color:#fff}.style-btn.active{background:linear-gradient(135deg,#00e5ff,#0080a0);color:#050510;border-color:transparent;box-shadow:0 2px 8px #00e5ff4d}.opt-select{flex:1;height:30px;padding:0 8px;border:1px solid rgba(255,255,255,.15);border-radius:6px;background:#00000059;color:#ffffffd9;font-family:inherit;font-size:11px;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;outline:none}.opt-select:focus{border-color:#00e5ff80}.opt-select option{background:#1a1a2e;color:#fff}.bgm-checklist{display:none;flex-wrap:wrap;gap:4px 12px;padding:2px 0 6px 82px;grid-template-columns:1fr!important}.bgm-checklist label{display:flex;align-items:center;gap:5px;font-size:11px;color:#ffffffa6;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;user-select:none}.bgm-checklist input[type=checkbox]{width:14px;height:14px;accent-color:#00e5ff;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}.keybind-details{margin-top:6px}.keybind-summary{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:#0003;border-radius:8px;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;font-size:13px;font-weight:700;color:#ffffffb3;list-style:none;user-select:none}.keybind-summary::-webkit-details-marker{display:none}.keybind-summary:before{content:"▶";font-size:9px;margin-right:8px;transition:transform .2s}.keybind-details[open]>.keybind-summary:before{transform:rotate(90deg)}.keybind-details[open]>.keybind-summary{border-radius:8px 8px 0 0;margin-bottom:0}.keybind-details>.keybind-panel{border-radius:0 0 8px 8px;margin-top:0}.keybind-summary #keybind-reset{font-size:10px;padding:2px 8px;border:1px solid rgba(255,255,255,.15);border-radius:4px;background:#ffffff14;color:#fff9;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer}.keybind-summary #keybind-reset:hover{background:#ffffff26;color:#fff}#overlay{position:absolute;inset:0;background:#05050feb;display:none;align-items:center;justify-content:center;flex-direction:column;padding:20px;z-index:30;text-align:center}#overlay.show{display:flex}#overlay h1{font-size:30px;margin:0 0 6px;background:linear-gradient(180deg,#c77dff,#6b2d8e,#3d1158);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:900;filter:drop-shadow(0 0 30px rgba(157,78,221,.8)) drop-shadow(0 0 60px rgba(107,45,142,.4))}#overlay p{font-size:13px;margin:0 0 16px;color:#ffe6f5;text-shadow:0 2px 8px rgba(60,20,80,.9),0 0 16px rgba(199,125,255,.5);font-weight:700;letter-spacing:.05em;opacity:1}#legend{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:100%;margin-bottom:14px}.lg{min-width:0;display:flex;align-items:center;gap:4px;font-size:12px;background:#ffffff0d;padding:4px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.08)}.dot{width:14px;height:14px;border-radius:50%;display:inline-block}#rules{font-size:12px;line-height:1.7;max-width:320px;margin-bottom:18px;opacity:.85;text-align:left;padding:10px 14px;background:#0000004d;border-radius:10px;border:1px solid rgba(0,229,255,.1)}#restart,#duel-start{background:linear-gradient(135deg,#00e5ff,#f4a);color:#050510;border:none;padding:12px 28px;font-size:16px;font-weight:800;border-radius:12px;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;font-family:inherit;letter-spacing:1px;box-shadow:0 0 20px #00e5ff66}#duel-start{background:linear-gradient(135deg,#fa0,#f45);box-shadow:0 0 20px #ffaa0047}.start-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}#restart:active,#duel-start:active{transform:scale(.97)}#sidebar{width:78px;display:flex;flex-direction:column;gap:6px;padding:8px 6px;background:#00000059;border-left:1px solid rgba(0,229,255,.1)}#sidebar:empty{display:none}#reserve-head{text-align:center;padding:2px 0;border-bottom:1px solid rgba(255,170,0,.2);margin-bottom:2px}.r-title{font-size:9px;letter-spacing:1px;opacity:.6;font-weight:700;color:#fa0}.r-status{font-size:13px;font-weight:800;color:#fa0;text-shadow:0 0 8px rgba(255,170,0,.4);font-variant-numeric:tabular-nums;margin-top:1px}.r-status.cooldown{color:#777;text-shadow:none}#reserve-picker{display:flex;flex-direction:row;gap:28px;align-items:center;justify-content:center;flex:1;min-width:0;min-height:0;padding-left:0}body.screen-game #reserve-picker{gap:50px}.el-btn{flex:1;min-height:0;min-width:0;width:100%;border-radius:9px;border:1px solid rgba(255,255,255,.2);font-family:inherit;font-size:12px;font-weight:800;letter-spacing:0;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.7);cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;display:flex;align-items:center;justify-content:center;transition:transform .05s ease,opacity .15s ease}.el-btn:active{transform:scale(.92)}.el-btn[data-el=fire]{background:linear-gradient(135deg,#f30,#a10)}.el-btn[data-el=water]{background:linear-gradient(135deg,#7ad0ff,#3380cc);color:#0a2030;text-shadow:none}.el-btn[data-el=steel]{background:linear-gradient(135deg,#dcdce6,#888894);color:#0a0a14;text-shadow:none}.el-btn[data-el=stone]{background:linear-gradient(135deg,#8a7a6a,#5a4a3a)}.el-btn[data-el=black]{background:linear-gradient(90deg,#f06,#f70,#fd0,#3e4,#0cf,#57f,#b4f);color:#fff}.el-btn.skill-btn,.el-btn.skill-btn[data-el]{background-color:transparent!important;background-blend-mode:normal!important;border:none!important;border-radius:12px!important;flex:0 0 auto!important;width:88px!important;height:88px!important;min-height:88px!important}:root{--skill-bg: #1A0033;--skill-border: #0A0015;--skill-frame: #6B2D8E;--skill-rune: #C77DFF}.skill-btn{position:relative;width:48px;height:48px;padding:0;border-radius:12px;background-size:100% 100%;background-repeat:no-repeat;background-position:center;overflow:visible;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background-color:transparent;border:none;transition:transform .15s,filter .15s;flex-shrink:0;box-shadow:none}.skill-icon,.skill-label{display:none}.rainbow-reserve-btn{background:url(../assets/generated/ui/skill-frame-rainbow.png) center / 100% 100% no-repeat}.timewarp-btn{background:url(../assets/generated/ui/skill-frame-timewarp.png) center / 100% 100% no-repeat}.rewind-btn{background:url(../assets/generated/ui/skill-frame-rewind.png) center / 100% 100% no-repeat}.rainbow-reserve-btn:before{content:"";position:absolute;inset:2px;border-radius:50%;background:conic-gradient(from 0deg,#ff3b30,#ffd93d,#6bcb77,#4abeff,#c879d8,#ff3b30);filter:blur(14px);opacity:.28;z-index:-1;animation:rainbow-rotate 4s linear infinite;pointer-events:none}html.is-safari .rainbow-reserve-btn:before{filter:none;opacity:.18}@keyframes rainbow-rotate{to{transform:rotate(360deg)}}.rainbow-reserve-btn:hover:before{opacity:.5}.timewarp-btn:before,.rewind-btn:before{content:"";position:absolute;inset:2px;border-radius:50%;filter:blur(14px);opacity:0;z-index:-1;transition:opacity .2s ease;pointer-events:none}.timewarp-btn:before{background:radial-gradient(circle,#7DD8FF 0%,transparent 70%)}.rewind-btn:before{background:radial-gradient(circle,#FFD380 0%,transparent 70%)}.skill-btn:hover:before{opacity:.55}.skill-key{position:absolute;left:-26px;top:50%;transform:translateY(-50%);width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;font-family:var(--pf-font-display, inherit);letter-spacing:0;color:#ffe066;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 6px rgba(255,180,0,.5);background:radial-gradient(ellipse at 40% 30%,#3d1a5c,#160828);border-radius:5px;border:1px solid rgba(0,0,0,.7);box-shadow:inset 0 2px 4px #000000a6,inset 0 -1px #ffffff12,0 1px #b478ff40,0 0 6px #783cc833;pointer-events:none;z-index:3}.skill-status{position:absolute;bottom:-2px;left:50%;transform:translate(-50%);min-width:28px;padding:1px 5px;font-size:9px;font-weight:700;background:#0a0612cc;border:1px solid rgba(199,125,255,.35);color:#ffe0a0;border-radius:999px;z-index:2;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;line-height:1;font-variant-numeric:tabular-nums}.skill-status.cooldown{color:#b4782866}.timewarp-btn .skill-key{background:radial-gradient(ellipse at 40% 30%,#0a2a40,#04121e);border-color:#285078cc;color:#ffe066;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 6px rgba(255,180,0,.5);box-shadow:inset 0 2px 4px #000000b3,0 1px #64c8ff4d,0 0 6px #3ca0ff33}.timewarp-btn .skill-status{border-color:#7dd8ff66;color:#d0ecff}.rewind-btn .skill-key{background:radial-gradient(ellipse at 40% 30%,#3a2200,#1e1000);border-color:#785014cc;color:#ffe066;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 6px rgba(255,180,0,.5);box-shadow:inset 0 2px 4px #000000b3,0 1px #ffb43c4d,0 0 6px #c88c2833}.rewind-btn .skill-status{border-color:#ffc87866;color:#ffe6c8}.skill-btn:hover{transform:translateY(-2px) scale(1.04);filter:brightness(1.15)}.skill-btn:active{transform:translateY(1px) scale(.96);filter:brightness(.92)}.skill-btn.elem-active{filter:brightness(1.3) saturate(1.4);box-shadow:0 0 10px 3px currentColor;animation:elem-pulse .9s ease-in-out infinite alternate}@keyframes elem-pulse{0%{filter:brightness(1.2) saturate(1.3)}to{filter:brightness(1.5) saturate(1.6)}}.skill-btn.cooldown{filter:grayscale(.6) brightness(.7);cursor:not-allowed}.skill-btn.cooldown:before{opacity:.1!important;animation:none}.skill-btn.cooldown:after{content:"";position:absolute;inset:6px;border-radius:50%;background:conic-gradient(transparent calc(var(--cd-progress, 0) * 360deg),#0000008c calc(var(--cd-progress, 0) * 360deg));z-index:3;pointer-events:none}.skill-btn.cooldown .skill-status{animation:cd-spin 2s linear infinite}@keyframes cd-spin{0%{transform:translate(-50%) rotate(0)}to{transform:translate(-50%) rotate(360deg)}}.skill-btn.cooldown .skill-status{animation:none;font-size:10px;font-weight:900;color:#fff;text-shadow:0 0 6px rgba(0,0,0,.8);background:#0009;border-color:#ffffff4d;z-index:4}.rewind-overlay{position:fixed;inset:0;z-index:800;pointer-events:none;opacity:0;transition:opacity .12s ease}.rewind-overlay.active{opacity:1}.rewind-overlay.active:before{content:"";position:absolute;inset:0;background:#3cffa00f;mix-blend-mode:screen}.rewind-scanlines{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,rgba(60,255,160,.07) 3px,rgba(60,255,160,.07) 4px);animation:rewind-scroll .15s linear infinite}@keyframes rewind-scroll{0%{transform:translateY(0)}to{transform:translateY(-8px)}}.rewind-label{position:absolute;top:12%;left:50%;transform:translate(-50%);font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:clamp(28px,6vw,48px);color:#3dff9a;text-shadow:0 0 20px rgba(61,255,154,.6),0 0 40px rgba(61,255,154,.3),2px 2px 0 rgba(0,0,0,.5);letter-spacing:.15em;opacity:0;animation:rewind-flash .4s ease forwards}@keyframes rewind-flash{0%{opacity:0;transform:translate(-50%) scale(1.3)}30%{opacity:1;transform:translate(-50%) scale(1)}to{opacity:.7;transform:translate(-50%) scale(1)}}.chain-popup{position:fixed;left:50%;top:42%;transform:translate(-50%) scale(.6);font-family:var(--pf-font-ui, sans-serif);font-size:clamp(2rem,6vw,4rem);font-weight:900;letter-spacing:.05em;color:#fff;text-shadow:0 0 12px #ff9900,0 0 28px #ff6600,2px 2px 0 rgba(0,0,0,.7);pointer-events:none;z-index:900;opacity:0;animation:chain-pop .55s cubic-bezier(.22,1,.36,1) forwards}@keyframes chain-pop{0%{opacity:0;transform:translate(-50%) scale(.5) translateY(10px)}25%{opacity:1;transform:translate(-50%) scale(1.2) translateY(-4px)}55%{opacity:1;transform:translate(-50%) scale(1) translateY(0)}to{opacity:0;transform:translate(-50%) scale(.9) translateY(-20px)}}#side-controls{display:grid;grid-template-columns:1fr;gap:5px;width:52px;flex:0 0 52px;min-width:0;padding-top:4px;border-top:1px solid rgba(0,229,255,.15)}.side-btn{height:48px!important;font-size:0!important;border-radius:8px!important;background:transparent!important;background-image:url(../assets/generated/ui/btn-drop-v2.png)!important;background-size:contain!important;background-repeat:no-repeat!important;background-position:center!important;color:transparent!important;border:none!important;box-shadow:none!important;filter:drop-shadow(0 3px 8px rgba(107,45,142,.5))}.side-btn:hover{filter:brightness(1.3) drop-shadow(0 5px 12px rgba(199,125,255,.5))!important;transform:translateY(-2px)}.side-btn:active{transform:translateY(2px)!important;filter:brightness(.8)!important}#bottom-bar{display:flex;flex-direction:column;gap:4px;width:100%;max-width:100%;min-width:0;flex:0 0 auto;background:transparent;border:none;padding:4px 4px calc(4px + env(safe-area-inset-bottom))}#bottom-bar .bottom-skills{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:8px;padding:0 4px}#bottom-bar .bottom-controls{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;align-items:center;padding:0 4px}#controls{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:0;background:none;width:100%;max-width:100%;min-width:0;flex:0 0 auto}.btn{min-width:0;background:none;border:none;border-radius:8px;height:54px;cursor:pointer;transition:transform .08s ease,filter .08s ease;font-family:inherit;display:flex;align-items:center;justify-content:center}.ctrl-btn{padding:0;background:transparent;background-size:contain;background-repeat:no-repeat;background-position:center;border:none;border-radius:4px;color:transparent;font-size:0;height:56px;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;position:relative;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}.ctrl-icon,.ctrl-text{display:none}.ctrl-btn:hover{transform:translateY(-2px);filter:brightness(1.25) drop-shadow(0 4px 10px rgba(180,120,40,.4))}.ctrl-btn:active{transform:scale(.92) translateY(2px);filter:brightness(.8)}#left{background-image:url(../assets/generated/ui/ctrl-left-v3.png)}#right{background-image:url(../assets/generated/ui/ctrl-right-v3.png)}#down{background-image:url(../assets/generated/ui/ctrl-down-v3.png)}#rotate{background-image:url(../assets/generated/ui/ctrl-rotate-v3.png)}.drop-btn{background-image:url(../assets/generated/ui/ctrl-drop-v3.png)!important;filter:drop-shadow(0 2px 6px rgba(107,45,142,.4))}.drop-btn:hover{filter:brightness(1.25) drop-shadow(0 4px 12px rgba(199,125,255,.5))}@media (min-width: 900px){#hud{grid-template-columns:repeat(5,minmax(70px,auto));justify-content:center;gap:26px;padding:10px 92px 10px 24px}#main{max-width:1040px;width:min(100%,1040px);margin:0 auto}.bottom-controls{display:none}#sidebar{width:92px;border-right:1px solid rgba(0,229,255,.08)}.side-btn{display:none!important}.chip{width:48px;height:48px}}@media (max-width: 720px){#hud{grid-template-columns:1fr 1fr auto auto 1fr;gap:5px;padding:7px 8px}.lbl-sm{font-size:8px;letter-spacing:1px}.val{font-size:17px;text-shadow:0 0 10px rgba(0,229,255,.8),0 1px 4px rgba(0,0,0,1)}.chip{width:42px;height:42px;border-radius:9px}#main{flex-direction:column}#stage{order:1}#sidebar{order:2;width:100%;min-height:74px;flex:0 0 74px;flex-direction:row;align-items:stretch;gap:7px;padding:7px 8px;border-left:0;border-top:1px solid rgba(0,229,255,.14)}#reserve-head{width:58px;flex:0 0 58px;margin:0;padding:6px 4px;border-bottom:0;border-right:1px solid rgba(255,170,0,.2);display:flex;flex-direction:column;justify-content:center}#reserve-picker{flex-direction:row;gap:20px;padding-left:0}.skill-btn,.el-btn.skill-btn,.el-btn.skill-btn[data-el]{width:52px!important;height:52px!important;min-height:52px!important;flex-shrink:0}#side-controls{width:52px;flex:0 0 52px;grid-template-columns:1fr;gap:6px;border-top:0;border-left:1px solid rgba(0,229,255,.15);padding:0 0 0 7px}.side-btn{width:100%;height:auto!important;font-size:20px!important}#rules{max-width:min(320px,calc(100vw - 32px));font-size:11px}#legend{max-width:calc(100vw - 24px);gap:6px}.lg{padding:4px 8px;font-size:11px}#overlay{padding:14px}#restart,#duel-start{min-width:128px;padding:12px 18px}}@media (max-width: 720px) and (min-width: 421px){#game,#hud,#main,#sidebar,#bottom-bar{width:100%;max-width:100%}}@media (max-width: 420px){#game,#hud,#main,#sidebar,#bottom-bar{width:min(100%,390px);max-width:min(100%,390px)}#game{transform-origin:top left}}@media (max-width: 680px) and (orientation: portrait){#duel-hud{flex-direction:row;gap:6px;max-height:none;overflow-y:visible;padding:4px;align-items:flex-start}.duel-card{flex:1;width:auto;min-width:0;padding:6px;gap:2px}.duel-score{font-size:16px}.duel-name{font-size:10px}.duel-meta{font-size:9px}.duel-next{padding:3px 0}.duel-next .chip{width:28px;height:28px;min-height:28px}.duel-keys{display:none}.duel-skills{gap:2px}.duel-skill{font-size:9px;padding:2px 4px}}@media (max-width: 520px){#duel-hud{gap:6px;padding-left:8px}.duel-card{padding:6px;gap:3px 6px}.duel-score{font-size:17px}.duel-meta,.duel-keys{font-size:9px}.duel-skills{grid-template-columns:1fr;gap:4px}.duel-skill{height:26px;padding:0 6px}.duel-chip{width:34px;height:34px}.keybind-grid{grid-template-columns:1fr}}:root{--pf-ink: #fff6e7;--pf-deep: #2b2035;--pf-deep-2: #3a2945;--pf-plum: #5f456c;--pf-parchment: #fff0cc;--pf-parchment-2: #f7d9a4;--pf-rose: #ff8fba;--pf-rose-deep: #c95683;--pf-gold: #ffd28a;--pf-teal: #8bdcff;--pf-mint: #9fe0bd;--pf-line: rgba(255, 226, 168, .28);--pf-soft-panel: rgba(255, 240, 204, .13);--pf-panel: rgba(55, 38, 67, .78);--pf-shadow: rgba(28, 18, 34, .42)}html,body:not(.screen-result){font-family:Jua,Noto Sans KR,Malgun Gothic,system-ui,sans-serif;background:radial-gradient(circle at 18% 12%,rgba(255,143,186,.28),transparent 24rem),radial-gradient(circle at 78% 8%,rgba(139,220,255,.22),transparent 26rem),linear-gradient(145deg,#2b2035,#21172a 48%,#35243c);color:var(--pf-ink)}#game{background:linear-gradient(90deg,#21172af0,#21172a8f,#21172a9e 68%,#21172aeb),radial-gradient(circle at 50% 24%,rgba(255,210,138,.2),transparent 30rem),var(--pf-gameplay-bg) center center / cover no-repeat,linear-gradient(180deg,#ffffff05,#00000038)}#stage{background:transparent}#stage:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle,rgba(255,242,204,.9) 0 1px,transparent 1.6px),radial-gradient(circle,rgba(139,220,255,.7) 0 1px,transparent 1.5px);background-size:74px 74px,113px 113px;background-position:12px 9px,45px 31px;opacity:.28;animation:star-drift 18s linear infinite;z-index:0}#stage:after{content:"";position:absolute;width:min(62vmin,520px);aspect-ratio:1;right:max(-160px,-14vw);bottom:max(-160px,-16vw);border-radius:50%;border:1px solid rgba(255,210,138,.2);background:repeating-conic-gradient(from 12deg,rgba(255,210,138,.18) 0 5deg,transparent 5deg 18deg);mask-image:radial-gradient(circle,transparent 0 34%,#000 35% 36%,transparent 37% 52%,#000 53% 54%,transparent 55%);pointer-events:none;opacity:.55;animation:slow-rune 42s linear infinite;z-index:0}#stage>canvas{position:relative;z-index:1}#combo-banner,#top-btns,#opt-modal,#overlay{z-index:1}#top-btns{z-index:80}#opt-modal{z-index:60}#overlay{z-index:30}@keyframes star-drift{to{background-position:86px 83px,158px 144px}}@keyframes slow-rune{to{transform:rotate(360deg)}}#hud,#sidebar{background:#080614f5;border-color:#c8962880;box-shadow:0 12px 28px var(--pf-shadow)}#duel-hud{background:none;border-color:var(--pf-line)}#hud{border-bottom:1px solid var(--pf-line)}.stat,.chip-stat{min-height:48px;justify-content:center;padding:5px 8px;border:1px solid rgba(255,226,168,.16);border-radius:8px;background:#fff0cc14}.lbl-sm{color:#fff0cca3;opacity:1;letter-spacing:1px}.val{color:var(--pf-gold);text-shadow:0 0 14px rgba(255,196,118,.34)}.chip{border-color:#ffe2a88c;border-radius:8px;box-shadow:inset 0 7px 12px #ffffff47,inset 0 -12px 18px #2b20352e,0 8px 18px #0000002e;letter-spacing:0}#combo-banner{background:linear-gradient(90deg,#ffd28a,#ff8fba,#8bdcff);-webkit-background-clip:text;background-clip:text;text-shadow:0 0 26px rgba(255,180,128,.5)}#opt-modal{background:radial-gradient(circle at 50% 18%,rgba(255,210,138,.16),transparent 32rem),#170f1dc7}.opt-card{color:#39253f;background:linear-gradient(145deg,#fff9e2fa,#f7d9a4f5);border:1px solid rgba(122,76,64,.26);border-radius:8px;box-shadow:0 28px 70px #160e1a7a}.opt-head{color:var(--pf-rose-deep);border-bottom-color:#7a4c402e}#opt-close,#keybind-reset,.keybind-btn,.opt-toggle,.opt-seg,.keybind-panel{border-color:#7a4c402e}#opt-close,.keybind-panel{background:#ffffff5c}#opt-close,.opt-label,.keybind-action{color:#604354}.opt-val,.keybind-value{color:#2f7887}.opt-row input[type=range]{background:#bf7f6433}.opt-row input[type=range]::-webkit-slider-thumb{background:var(--pf-rose);box-shadow:0 0 0 4px #ff8fba2e}.opt-row input[type=range]::-moz-range-thumb{background:var(--pf-rose);box-shadow:0 0 0 4px #ff8fba2e}.opt-toggle.on,.opt-seg button.active,.opt-action{background:linear-gradient(135deg,var(--pf-rose),var(--pf-gold));color:#39253f}.keybind-head,#keybind-reset{color:#b35b45}#keybind-reset{background:#ffd28a33}.keybind-btn{background:#ffffff47}#overlay{overflow:hidden;background:radial-gradient(circle at 50% 27%,rgba(255,240,204,.16),transparent 22rem),linear-gradient(180deg,#2b2035eb,#201628f5)}#overlay:before{content:"";position:absolute;width:min(76vmin,560px);aspect-ratio:1;top:50%;left:50%;border-radius:50%;border:1px solid rgba(255,210,138,.22);background:repeating-conic-gradient(from 20deg,rgba(255,210,138,.2) 0 4deg,transparent 4deg 16deg);mask-image:radial-gradient(circle,transparent 0 31%,#000 32% 33%,transparent 34% 48%,#000 49% 50%,transparent 51%);transform:translate(-50%,-50%);opacity:.65;animation:slow-rune 48s linear infinite}#overlay>*{position:relative;z-index:1}#overlay h1{font-size:clamp(36px,9vw,78px);margin-bottom:3px;background:linear-gradient(180deg,#c77dff,#6b2d8e,#3d1158);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 0 30px rgba(157,78,221,.8)) drop-shadow(0 0 60px rgba(107,45,142,.4))}#overlay p{color:#ffe6f5;text-shadow:0 2px 8px rgba(60,20,80,.9),0 0 16px rgba(199,125,255,.5);font-weight:700;letter-spacing:.05em;opacity:1;margin-bottom:10px}.wizard-mascot{width:min(360px,48vw);height:255px;position:relative;margin:-4px 0 8px;filter:drop-shadow(0 22px 28px rgba(20,12,26,.44));animation:mascot-float 3.6s ease-in-out infinite}@keyframes mascot-float{0%{transform:translateY(0);opacity:1}50%{transform:translateY(-28px);opacity:.82}to{transform:translateY(0);opacity:1}}.wizard-mascot-img{width:100%;height:100%;display:block;object-fit:contain;object-position:center}#legend{margin-bottom:12px}.lg{background:#fff0cc1f;border-color:#ffe2a833;color:#fff6e7e6;border-radius:999px;font-weight:800}#rules{color:#4c3442;background:linear-gradient(145deg,#fff9e2f0,#f7d9a4eb);border-color:#7a4c4033;border-radius:8px;box-shadow:0 18px 40px #140c1a42}#restart,#duel-start{min-height:46px;border-radius:999px;color:#39253f;background:radial-gradient(circle at 28% 20%,rgba(255,255,255,.62),transparent 28%),linear-gradient(135deg,#ffd28a,#ff8fba);box-shadow:0 14px 30px #ff8fba52;letter-spacing:0}#duel-start{background:radial-gradient(circle at 28% 20%,rgba(255,255,255,.55),transparent 28%),linear-gradient(135deg,#8bdcff,#ff8fba)}#sidebar{border-left-color:var(--pf-line)}#reserve-head{border-bottom-color:#ffd28a42}.r-title,.r-status{color:var(--pf-gold);text-shadow:0 0 10px rgba(255,210,138,.28)}.el-btn{border-color:#fff6e76b;border-radius:8px;text-shadow:0 1px 2px rgba(45,28,54,.55);box-shadow:inset 0 7px 12px #ffffff3d,inset 0 -12px 18px #2b203533}.el-btn[data-el=fire]{background:linear-gradient(135deg,#ffc08a,#f36b42,#b84532)}.el-btn[data-el=water]{background:linear-gradient(135deg,#d1fbff,#7fcbe4,#3d8a9d);color:#18313a;text-shadow:none}.el-btn[data-el=steel]{background:linear-gradient(135deg,#fff4dc,#c8c1c9,#817985);color:#241c25;text-shadow:none}.el-btn[data-el=stone]{background:linear-gradient(135deg,#b99973,#8c755e,#554333)}.el-btn[data-el=black]{background:linear-gradient(90deg,#ef6386,#f6bc58,#ffe08a,#94d96f,#6acfc3,#8d8ce8)}.skill-key,.reserve-key{border-color:#fff6e785;background:#2b20355c}.skill-status{background:#2b203557;color:#fff0cc}#side-controls{border-top-color:var(--pf-line)}.btn:not(.ctrl-btn){color:#39253f;border-color:#fff6e775;border-radius:8px;background:radial-gradient(circle at 30% 18%,rgba(255,255,255,.42),transparent 30%),linear-gradient(145deg,var(--pf-parchment),#ffb2cc 72%,#d777a5);box-shadow:0 10px 22px #140c1a38}.btn:not(.ctrl-btn):active{background:radial-gradient(circle at 30% 18%,rgba(255,255,255,.5),transparent 30%),linear-gradient(145deg,var(--pf-teal),var(--pf-gold));color:#2b2035}.duel-card{border-color:#ffe2a833;background:#fff0cc17;border-radius:8px}.duel-card.p1{border-color:#8bdcff6b}.duel-card.p2{border-color:#ff8fba6b}.duel-name,.duel-skill strong{color:var(--pf-gold)}.duel-score{color:var(--pf-teal);text-shadow:0 0 12px rgba(139,220,255,.3)}.duel-skill{border-color:#ffe2a82e;background:#fff0cc14;border-radius:8px}.duel-skill b{background:#fff0cc29}@media (max-width: 720px){html,body,#game{width:100%;max-width:100%;overflow:hidden}#hud{width:100%;max-width:100%;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:6px 64px 6px 6px}.stat,.chip-stat{min-width:0;min-height:44px;padding:4px 2px}.val{font-size:14px}.chip{width:34px;height:34px;border-radius:8px;font-size:10px}#top-btns button{width:38px;height:38px}.wizard-mascot{width:min(280px,70vw);height:205px;margin:-8px 0 4px}#overlay h1{font-size:clamp(32px,12vw,54px)}#rules{width:min(320px,calc(100% - 28px));max-width:calc(100% - 28px);line-height:1.58}.start-actions{width:100%;gap:8px}#restart,#duel-start{min-width:min(128px,calc((100% - 42px)/2));padding:11px 14px}#sidebar{width:100%;max-width:100%;flex-basis:68px;padding:6px;gap:6px;border-top-color:var(--pf-line)}#reserve-head{width:54px;flex-basis:54px;border-right-color:#ffd28a42}.skill-btn{width:64px;height:64px;flex-shrink:0}#side-controls{width:52px;flex-basis:52px;grid-template-columns:1fr;padding-left:6px;border-left-color:var(--pf-line)}#bottom-bar{width:100%;max-width:100%}.ctrl-btn{width:100%;height:50px}}@media (max-width: 420px) and (orientation: portrait){#game,#hud,#main,#sidebar,#bottom-bar{width:min(100%,390px);max-width:min(100%,390px)}#game{transform-origin:top left}}:root{--pf-font-display: "Jua", "Noto Sans KR", "Malgun Gothic", sans-serif;--pf-font-body: "Noto Sans KR", "Malgun Gothic", system-ui, sans-serif;--pf-font-ui: "Jua", "Noto Sans KR", "Malgun Gothic", sans-serif;--pf-font-impact: "Bangers", "Arial Black", sans-serif;--pf-font-title: "Cinzel Decorative", "Cinzel", Georgia, serif;--pf-font-serif: "Cinzel", "Cinzel Decorative", Georgia, serif;--pf-brass: #c08a45;--pf-aged-ink: #3d261d;--pf-aged-parchment: #e7c98d}body:not(.screen-result){font-family:var(--pf-font-body);min-height:100vh;min-height:100dvh;background:radial-gradient(circle at 18% 12%,rgba(192,138,69,.16),transparent 24rem),radial-gradient(circle at 82% 34%,rgba(139,220,255,.1),transparent 28rem),linear-gradient(145deg,#21172a,#17101f 52%,#281a2f)}#game{min-height:100vh;min-height:100dvh;background-color:#1b1324}#stage:before{--watercolor-sky: 1;background-image:radial-gradient(ellipse at 12% 50%,transparent 0 18%,rgba(255,220,151,.2) 18.2% 18.8%,transparent 19% 30%,rgba(255,220,151,.1) 30.2% 30.8%,transparent 31%),radial-gradient(ellipse at 88% 50%,transparent 0 18%,rgba(255,220,151,.18) 18.2% 18.8%,transparent 19% 30%,rgba(139,220,255,.08) 30.2% 30.8%,transparent 31%),linear-gradient(90deg,rgba(255,210,138,.12),transparent 15% 85%,rgba(255,210,138,.1)),radial-gradient(circle at 16% 36%,rgba(255,242,204,.88) 0 1px,transparent 1.6px),radial-gradient(circle at 84% 64%,rgba(139,220,255,.72) 0 1px,transparent 1.5px);background-size:72vmin 94vmin,72vmin 94vmin,100% 100%,74px 74px,113px 113px;background-position:left center,right center,center,12px 9px,45px 31px;opacity:.72}#stage:after{width:min(68vmin,580px);right:max(72px,13vw);bottom:max(-210px,-22vw);opacity:.42}#stage>canvas{z-index:2}.lbl-sm,.r-title,.skill-label,.skill-status,.duel-name,.duel-skill,.keybind-title{font-family:var(--pf-font-ui)}.val,#combo-banner{font-family:var(--pf-font-display)}.opt-card{position:relative;color:var(--pf-aged-ink);background:radial-gradient(circle at 12% 10%,rgba(255,255,255,.42),transparent 22%),repeating-linear-gradient(96deg,rgba(109,70,36,.05) 0 1px,transparent 1px 11px),linear-gradient(145deg,#f6e2b5fa,#c49352f5);border:1px solid rgba(91,51,28,.46);border-radius:6px;box-shadow:inset 0 0 0 1px #fff8da6b,inset 0 0 34px #5b331c29,0 30px 76px #0b07129e}.opt-card:before{content:"";position:absolute;inset:10px;pointer-events:none;border:1px solid rgba(91,51,28,.22);background:repeating-conic-gradient(from 45deg,rgba(91,51,28,.08) 0 4deg,transparent 4deg 18deg);mask-image:radial-gradient(circle at center,transparent 0 44%,#000 45% 46%,transparent 47%);opacity:.36}.opt-card>*{position:relative;z-index:1}.opt-head{font-family:var(--pf-font-display);color:#6d341f;border-bottom-color:#5b331c47;letter-spacing:.03em}#opt-close,.keybind-panel{background:#4b2a1914}#opt-close,.opt-label,.keybind-action{color:#4e2f25}.opt-label,.keybind-action{font-family:var(--pf-font-body);font-weight:800}.opt-val,.keybind-value{color:#165968}.keybind-value{font-family:var(--pf-font-ui)}.keybind-panel{background:linear-gradient(145deg,#fff6d96b,#784c241f)}.opt-row input[type=range]{height:5px;background:linear-gradient(90deg,#502e1b33,#e0aa567a,#502e1b3d);border:1px solid rgba(91,51,28,.16);box-shadow:inset 0 1px 2px #321b1147}.opt-row input[type=range]::-webkit-slider-thumb{width:18px;height:18px;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.78),transparent 26%),linear-gradient(135deg,#e0aa56,#8c552c);border:1px solid rgba(70,37,22,.58);box-shadow:0 0 0 3px #e0aa5629,0 3px 8px #361d125c}.opt-row input[type=range]::-moz-range-thumb{width:18px;height:18px;background:radial-gradient(circle at 34% 28%,rgba(255,255,255,.78),transparent 26%),linear-gradient(135deg,#e0aa56,#8c552c);border:1px solid rgba(70,37,22,.58);box-shadow:0 0 0 3px #e0aa5629,0 3px 8px #361d125c}.opt-toggle,.opt-seg{border-color:#5b331c3d;background:#4026192e}.opt-seg button{color:#462c1fb8}.opt-toggle.on,.opt-seg button.active,.opt-action{background:linear-gradient(135deg,#fff1bce0,#9a622cc7);color:#2c1a12}.opt-toggle.on,.opt-seg button.active{border:1px solid rgba(91,51,28,.28);box-shadow:inset 0 1px #ffffff47,0 4px 12px #5b331c2e}.opt-val{color:#5d3928}.keybind-head{color:#8d3528}#keybind-reset{border-color:#8d35284d;background:#8d352814;color:#8d3528}.keybind-title{color:#5f3c27b8}.keybind-btn{background:linear-gradient(180deg,#fff7e085,#975e301f);border-color:#5b331c2e;color:#3e251b;box-shadow:inset 0 1px #fff3}.keybind-value{background:linear-gradient(180deg,#d8b06a,#a26c32);border:1px solid rgba(72,39,23,.34);color:#291710;box-shadow:inset 0 1px #ffffff42}#overlay{justify-content:flex-start;gap:7px;padding:clamp(14px,3vh,24px) 18px 18px;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,rgba(255,226,168,.14),transparent 21rem),linear-gradient(180deg,#23182abd,#18101fe0)}#overlay h1{font-family:var(--pf-font-display);font-size:clamp(34px,5.2vw,62px);line-height:.94;margin-bottom:2px;background:linear-gradient(180deg,#fff3c6,#d9a45f 46%,#8a552d);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1px rgba(62,35,20,.72);filter:drop-shadow(0 6px 0 rgba(38,21,18,.26));text-shadow:0 0 28px rgba(255,211,134,.22)}#overlay p{font-family:var(--pf-font-body);color:#ffe6f5;text-shadow:0 2px 8px rgba(60,20,80,.9),0 0 16px rgba(199,125,255,.5);font-weight:700;letter-spacing:.05em;margin-bottom:0}.wizard-mascot{width:min(300px,36vw);height:min(31vh,220px);margin:-2px 0 4px}.lg{font-family:var(--pf-font-body);background:#2d1c1b6b;border-color:#d9a45f5c;color:#ffeecbf0;font-weight:900}#rules{font-family:var(--pf-font-body);max-height:165px;overflow:hidden;margin-bottom:10px;line-height:1.52;color:#3f2a20;background:radial-gradient(circle at 50% 105%,rgba(255,255,255,.22),transparent 34%),repeating-linear-gradient(95deg,rgba(91,51,28,.04) 0 1px,transparent 1px 12px),linear-gradient(145deg,#f1dcaef5,#be8b4ceb);border-color:#5b331c57;border-radius:6px;box-shadow:inset 0 0 0 1px #fff6d94d,0 18px 40px #140c1a52}#restart,#duel-start,.opt-action{font-family:var(--pf-font-ui);border-radius:8px;color:#2d1c18;background:linear-gradient(180deg,rgba(255,244,207,.7),transparent 46%),linear-gradient(135deg,#e8b86d,#9d6030);border:1px solid rgba(255,230,174,.65);box-shadow:inset 0 1px #ffffff61,0 14px 30px #5b331c57}#duel-start{background:linear-gradient(180deg,rgba(255,244,207,.62),transparent 46%),linear-gradient(135deg,#b891e0,#7d4d8a)}#rules.weakness-guide{width:min(520px,72vw);max-width:520px;max-height:none;margin:0 0 10px;padding:10px;overflow:visible;display:grid;grid-template-columns:1fr;gap:8px;color:#f6dfb1;background:radial-gradient(circle at 50% 0%,rgba(188,127,66,.16),transparent 46%),linear-gradient(145deg,#1c1116f0,#321f26e6);border:1px solid rgba(211,160,82,.52);border-radius:8px;box-shadow:inset 0 0 0 1px #ffebb324,0 18px 42px #09050c85}.weakness-title{font-family:var(--pf-font-display);font-size:15px;font-weight:900;line-height:1;color:#f0c078;text-align:center;letter-spacing:.08em;text-shadow:0 2px 8px rgba(0,0,0,.55)}.weakness-flow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.weakness-card{min-width:0;min-height:48px;display:grid;grid-template-columns:auto 30px 1fr;align-items:center;gap:7px;padding:7px;background:linear-gradient(180deg,#ffe7b014,#0000001f),#110a0fa8;border:1px solid rgba(211,160,82,.22);border-radius:7px}.weakness-card.wide{grid-column:1 / -1;grid-template-columns:auto 34px 1fr auto}.weakness-card.immunity{display:flex;align-items:center;justify-content:space-between;min-height:42px;gap:10px;padding:9px 14px;background:linear-gradient(90deg,#d3a05214,#d8dbe814),#0c090ec7}.weak-targets{min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px}.weakness-arrow{width:30px;height:14px;display:inline-block;background:linear-gradient(90deg,#ffe6a42e,#e0a951 68%,#fff0bd);clip-path:polygon(0 32%,62% 32%,62% 0,100% 50%,62% 100%,62% 68%,0 68%);filter:drop-shadow(0 0 7px rgba(224,169,81,.34))}.element-token{min-width:38px;height:24px;display:inline-flex;align-items:center;justify-content:center;padding:0 8px;border-radius:999px;border:1px solid rgba(255,255,255,.24);color:#fff7dc;font-family:var(--pf-font-ui);font-size:12px;font-weight:900;line-height:1;text-shadow:0 1px 3px rgba(0,0,0,.72);box-shadow:inset 0 1px #ffffff52,0 5px 12px #00000057}.element-token.fire{color:#f85;text-shadow:0 0 8px rgba(255,60,0,.9),0 1px 3px rgba(0,0,0,.72);background:radial-gradient(circle at 32% 24%,#fff0b7 0 9%,transparent 10%),linear-gradient(135deg,#ff2b0f,#8f1207)}.element-token.ice{color:#8df;text-shadow:0 0 8px rgba(80,180,255,.9),0 1px 3px rgba(0,0,0,.72);background:radial-gradient(circle at 32% 24%,#f5ffff 0 9%,transparent 10%),linear-gradient(135deg,#78d4ff,#1b5d95)}.element-token.steel{color:#16171c;text-shadow:0 1px 0 rgba(255,255,255,.45);background:radial-gradient(circle at 30% 20%,#ffffff 0 11%,transparent 12%),linear-gradient(135deg,#f0f0f4,#777985)}.element-token.stone{background:radial-gradient(circle at 32% 24%,#a99675 0 10%,transparent 11%),linear-gradient(135deg,#6e5a42,#2e251f)}.element-token.rainbow{background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.9) 0 8%,transparent 9%),linear-gradient(135deg,#ff005d,#ff8b00 24%,#ffe600 42%,#20d957 58%,#16b8ff 75%,#914dff)}.element-token.holy{background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.95) 0 12%,transparent 13%),linear-gradient(135deg,#fffbe6,gold 50%,#b8960c);color:#3d2e00;text-shadow:0 0 6px rgba(255,215,0,.6)}.element-token.dark{background:radial-gradient(circle at 30% 20%,rgba(200,160,255,.7) 0 10%,transparent 11%),linear-gradient(135deg,#d4a0ff,#8b2fc9 50%,#3a0060);color:#fff;text-shadow:0 0 6px rgba(139,47,201,.6)}.weakness-lock{padding:5px 8px;border-radius:999px;color:#d7d9e4;background:#ffffff14;border:1px solid rgba(216,219,232,.22);font-family:var(--pf-font-ui);font-size:11px;font-weight:900;white-space:nowrap}.weakness-none{justify-self:end;margin-left:auto;padding:5px 10px;border-radius:999px;color:#f2e6c7;background:linear-gradient(180deg,#ffffff1c,#ffffff0a);border:1px solid rgba(216,219,232,.28);font-family:var(--pf-font-ui);font-size:12px;font-weight:900;white-space:nowrap;box-shadow:inset 0 1px #ffffff29}.weakness-card.immunity .element-token.steel{box-shadow:inset 0 1px #ffffff80,0 0 16px #d8dbe838}.weakness-note{min-height:30px;display:flex;align-items:center;justify-content:center;gap:8px;padding:5px 8px;border-radius:7px;color:#ffefc6f2;background:#d3a0521a;border:1px solid rgba(211,160,82,.2);font-family:var(--pf-font-body);font-size:13px;font-weight:900;flex-direction:column;gap:5px}.weakness-note-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:center}#game{--bg-sky-dawn: #FFE0D6;--bg-sky-day: #B8DCEC;--bg-sky-sunset: #FFB088;--bg-sky-night: #4A4577;--bg-cloud: #FFF8E7;--bg-ground: #C8956A;--frame-paper: #F5E6C8;--frame-wood: #8B6F47;--frame-ink: #2C1810;--frame-accent: #D4A574;--text-main: #2C1810;--text-muted: #6B4E32;--text-light: #FFF8E7;--fire-base: #FF3B30;--fire-outline: #1A0000;--fire-light: #FFB088;--fire-shadow: #B30000;--ice-base: #4ABEFF;--ice-outline: #001F3D;--ice-light: #C8EAFF;--ice-shadow: #1E5A99;--iron-base: #D8D8D8;--iron-outline: #1A1A1A;--iron-light: #FFFFFF;--iron-shadow: #707070;--stone-base: #8B7355;--stone-outline: #1F1610;--stone-light: #C4A878;--stone-shadow: #4A3826;--combo-1to3: #4ABEFF;--combo-4to6: #FFD93D;--combo-7to9: #FF6B3D;--combo-10plus: #FF1493;color:var(--frame-ink);background:radial-gradient(circle at 18% 9%,rgba(255,248,231,.86),transparent 14rem),linear-gradient(180deg,var(--bg-sky-day) 0%,#d9eff2 42%,var(--bg-sky-dawn) 72%,var(--bg-ground) 100%)}body:not(.screen-result){font-family:var(--pf-font-body);color:var(--frame-ink);background:radial-gradient(circle at 18% 12%,rgba(255,248,231,.72),transparent 20rem),linear-gradient(180deg,#b8dcec,#f8dfcc 68%,#c8956a)}#stage:before{background:radial-gradient(ellipse at 12% 18%,rgba(255,248,231,.86) 0 9%,transparent 22%),radial-gradient(ellipse at 34% 13%,rgba(255,248,231,.72) 0 7%,transparent 19%),radial-gradient(ellipse at 78% 21%,rgba(255,248,231,.66) 0 8%,transparent 21%),linear-gradient(180deg,#b8dcece0,#ffe0d68f 58%,#ffb0883d);background-size:58vmin 31vmin,44vmin 24vmin,48vmin 26vmin,100% 100%;background-position:-7vmin 7vmin,28vmin 3vmin,right 6vmin top 11vmin,center;opacity:.82}#stage:after{width:min(72vmin,620px);right:max(46px,9vw);bottom:max(-190px,-18vw);opacity:.5;background:radial-gradient(circle at 12% 18%,rgba(255,248,231,.9) 0 1px,transparent 2px),radial-gradient(circle at 72% 32%,rgba(255,176,136,.7) 0 1.5px,transparent 2.5px),radial-gradient(circle at 44% 72%,rgba(255,211,110,.74) 0 1px,transparent 2px),repeating-conic-gradient(from 14deg,rgba(255,248,231,.16) 0 5deg,transparent 5deg 28deg);filter:blur(.1px)}#hud,#sidebar{color:var(--frame-ink);background:repeating-linear-gradient(90deg,rgba(139,111,71,.035) 0 1px,transparent 1px 7px),linear-gradient(180deg,#f5e6c8f0,#d4a574d1);border-color:#2c181047}#duel-hud{color:var(--frame-ink);background:none;border-color:#2c181047}.chip{border:2px solid var(--frame-ink);border-radius:6px;box-shadow:inset 6px 7px #ffffff3d,inset -7px -8px #1a000038,0 3px #2c18105c;text-shadow:1px 1px 0 rgba(26,0,0,.58)}#combo-banner{font-family:var(--pf-font-impact);letter-spacing:0;color:#fff;background:none;-webkit-text-fill-color:#fff;text-shadow:-3px -3px 0 #000,3px -3px 0 #000,-3px 3px 0 #000,3px 3px 0 #000,0 0 18px var(--combo-4to6)}#overlay{justify-content:flex-start;background:radial-gradient(circle at 50% 12%,rgba(255,248,231,.72),transparent 17rem),radial-gradient(ellipse at 50% 92%,rgba(200,149,106,.42),transparent 24rem),linear-gradient(180deg,#b8dcecd6,#ffe0d6c7 58%,#ffb088c2)}#overlay h1{font-family:var(--pf-font-display);color:#fff8e7;background:none;-webkit-text-fill-color:#fff8e7;-webkit-text-stroke:2px #2c1810;text-shadow:0 4px 0 #ff6b3d,0 8px 0 rgba(44,24,16,.42),0 0 20px rgba(255,217,61,.46)}#restart{background:repeating-linear-gradient(90deg,transparent 0,rgba(0,0,0,.09) 2px,transparent 4px),linear-gradient(180deg,#d4a574,#8b6f47);border:3px solid var(--frame-ink);color:var(--text-light);box-shadow:0 5px 0 var(--frame-ink),inset 0 1px #ffffff3d}#duel-start{background:repeating-linear-gradient(90deg,transparent 0,rgba(0,0,0,.09) 2px,transparent 4px),linear-gradient(180deg,#c8956a,#6b4e32);border:3px solid var(--frame-ink);color:var(--text-light);box-shadow:0 5px 0 var(--frame-ink),inset 0 1px #ffffff38}.el-btn[data-el=fire],.element-token.fire{background:linear-gradient(135deg,var(--fire-light) 0 28%,var(--fire-base) 29% 68%,var(--fire-shadow) 69%)}.element-token.fire{color:#f85;text-shadow:0 0 8px rgba(255,60,0,.9),0 1px 3px rgba(0,0,0,.72)}.el-btn[data-el=water],.element-token.ice{background:linear-gradient(135deg,var(--ice-light) 0 28%,var(--ice-base) 29% 68%,var(--ice-shadow) 69%)}.element-token.ice{color:#8df;text-shadow:0 0 8px rgba(80,180,255,.9),0 1px 3px rgba(0,0,0,.72)}.el-btn[data-el=steel],.element-token.steel{background:linear-gradient(135deg,#fff 0 28%,#d8d8d8 29% 68%,#707070 69%)}.el-btn[data-el=stone],.element-token.stone{background:linear-gradient(135deg,var(--stone-light) 0 28%,var(--stone-base) 29% 68%,var(--stone-shadow) 69%)}.el-btn[data-el=black],.element-token.rainbow{background:conic-gradient(from 0deg,#ff3b30,#ffd93d,#6bcb77,#4abeff,#c879d8,#ff3b30)}.el-btn[data-el=holy],.element-token.holy{background:linear-gradient(135deg,#fffbe6 0 28%,gold 29% 68%,#b8960c 69%);color:#3d2e00}.el-btn[data-el=dark],.element-token.dark{background:linear-gradient(135deg,#d4a0ff 0 28%,#8b2fc9 29% 68%,#3a0060 69%);color:#fff}.speed-line{position:absolute;width:3px;background:linear-gradient(180deg,transparent 0%,white 50%,transparent 100%);pointer-events:none;z-index:9;opacity:.7}.land-shockwave{position:absolute;width:60px;height:8px;border:2px solid white;border-radius:50%;pointer-events:none;z-index:8;transform:translate(-50%);animation:shockwave-spread var(--duration, .5s) ease-out forwards}@keyframes shockwave-spread{0%{width:60px;opacity:1;border-width:3px}to{width:var(--max-width, 200px);opacity:0;border-width:1px}}.land-flash{position:absolute;width:100px;height:30px;background:radial-gradient(ellipse,white 0%,transparent 70%);pointer-events:none;z-index:7;transform:translate(-50%);animation:land-flash-anim .3s ease-out forwards}@keyframes land-flash-anim{0%{opacity:1;transform:translate(-50%) scaleX(.5)}to{opacity:0;transform:translate(-50%) scaleX(2)}}.dust{position:absolute;width:8px;height:8px;background:#ffffffb3;border-radius:50%;pointer-events:none;z-index:6;filter:blur(1px)}.is-mobile .dust{filter:none}.monster-summon-vfx,.monster-death-vfx,.monster-fire-death-vfx,.monster-spawn-vfx,.monster-spawn-vfx-med{position:absolute;z-index:20;pointer-events:none;background-size:contain;background-repeat:no-repeat;background-position:center;transform:translate(-50%,-50%)}.monster-summon-vfx{width:72px;height:72px;z-index:19;animation:boom-summon .7s steps(1) forwards}@keyframes boom-summon{0%{background-image:url(../assets/vfx/summon-1.png);opacity:.7;transform:translate(-50%,-50%) scale(.4)}25%{background-image:url(../assets/vfx/summon-2.png);opacity:.9;transform:translate(-50%,-50%) scale(.8)}50%{background-image:url(../assets/vfx/summon-3.png);opacity:.9;transform:translate(-50%,-50%) scale(1.1)}75%{background-image:url(../assets/vfx/summon-4.png);opacity:.6;transform:translate(-50%,-50%) scale(1)}to{background-image:url(../assets/vfx/summon-4.png);opacity:0;transform:translate(-50%,-50%) scale(.7)}}.monster-spawn-vfx,.monster-spawn-vfx-med{width:56px;height:56px;z-index:19;animation:boom-teleport .5s steps(1) forwards}@keyframes boom-teleport{0%{background-image:url(../assets/vfx/teleport-1.png);opacity:.8;transform:translate(-50%,-50%) scale(.5)}33%{background-image:url(../assets/vfx/teleport-2.png);opacity:.9;transform:translate(-50%,-50%) scale(.85)}66%{background-image:url(../assets/vfx/teleport-3.png);opacity:.7;transform:translate(-50%,-50%) scale(1)}to{background-image:url(../assets/vfx/teleport-4.png);opacity:0;transform:translate(-50%,-50%) scale(.8)}}.monster-death-vfx{width:48px;height:48px;animation:boom-death .5s steps(1) forwards}.monster-fire-death-vfx{width:64px;height:64px;animation:boom-death .6s steps(1) forwards}@keyframes boom-death{0%{background-image:url(../assets/vfx/death-1.png);opacity:.8;transform:translate(-50%,-50%) scale(.6)}25%{background-image:url(../assets/vfx/death-2.png);opacity:.9;transform:translate(-50%,-50%) scale(1.1)}50%{background-image:url(../assets/vfx/death-3.png);opacity:.9;transform:translate(-50%,-50%) scale(1.3)}75%{background-image:url(../assets/vfx/death-4.png);opacity:.5;transform:translate(-50%,-50%) scale(1.1)}to{background-image:url(../assets/vfx/death-4.png);opacity:0;transform:translate(-50%,-50%) scale(.8)}}.monster-steal-text{position:absolute;z-index:25;pointer-events:none;font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:18px;font-weight:900;color:#f44;text-shadow:0 1px 3px rgba(0,0,0,.7),0 0 8px rgba(255,60,60,.5);transform:translate(-50%,-50%);animation:steal-float 1s ease-out forwards}@keyframes steal-float{0%{opacity:.6;transform:translate(-50%,-50%) scale(.5)}20%{opacity:.6;transform:translate(-50%,-70%) scale(1.2)}40%{opacity:.6;transform:translate(-50%,-90%) scale(1)}to{opacity:0;transform:translate(-50%,-160%) scale(.8)}}.monster-kill-text{position:absolute;z-index:25;pointer-events:none;font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:20px;font-weight:900;color:#4f4;text-shadow:0 1px 3px rgba(0,0,0,.7),0 0 8px rgba(60,255,60,.5);opacity:.6;transform:translate(-50%,-50%);animation:kill-float 1.2s ease-out forwards}@keyframes kill-float{0%{opacity:.6;transform:translate(-50%,-50%) scale(.5)}15%{opacity:.6;transform:translate(-50%,-80%) scale(1.4)}35%{opacity:.6;transform:translate(-50%,-100%) scale(1)}to{opacity:0;transform:translate(-50%,-180%) scale(.8)}}.mosquito{--mon-dir: 1;opacity:.35;transition:transform .3s cubic-bezier(.34,1.2,.64,1)}.is-mobile .mosquito{transition:none}.mosquito.buzz{animation:mon-bounce .5s ease-in-out infinite,mon-walk-3 .6s steps(1,end) infinite}.mosquito[data-frames="6"].buzz{animation:mon-bounce .5s ease-in-out infinite,mon-walk-6 .5s steps(1,end) infinite}.mosquito[data-frames="1"].buzz{animation:mon-bounce .5s ease-in-out infinite}.is-mobile .mosquito.buzz{animation:mon-walk-3 .6s steps(1,end) infinite}.is-mobile .mosquito[data-frames="6"].buzz{animation:mon-walk-6 .5s steps(1,end) infinite}.is-mobile .mosquito[data-frames="1"].buzz{animation:none}.is-mobile .mosquito.mon-jump{animation:mon-walk-3 .6s steps(1,end) infinite}.is-mobile .mosquito[data-frames="6"].mon-jump{animation:mon-walk-6 .5s steps(1,end) infinite}.is-mobile .mosquito[data-frames="1"].mon-jump{animation:none}.mosquito.mon-jump{animation:mon-jump .4s ease-out,mon-walk-3 .6s steps(1,end) infinite}.mosquito[data-frames="6"].mon-jump{animation:mon-jump .4s ease-out,mon-walk-6 .5s steps(1,end) infinite}.mosquito[data-frames="1"].mon-jump{animation:mon-jump .4s ease-out}@keyframes mon-walk-3{0%,33.32%{background-position:0% 0}33.33%,66.65%{background-position:50% 0}66.66%,to{background-position:100% 0}}@keyframes mon-walk-6{0%,16.65%{background-position:0% 0}16.66%,33.32%{background-position:20% 0}33.33%,49.99%{background-position:40% 0}50%,66.65%{background-position:60% 0}66.66%,83.32%{background-position:80% 0}83.33%,to{background-position:100% 0}}@keyframes mon-bounce{0%{transform:translateY(0) scaleX(var(--mon-dir)) scaleY(1)}20%{transform:translateY(-5px) scaleX(var(--mon-dir)) scaleY(1.06)}40%{transform:translateY(-7px) scaleX(var(--mon-dir)) scaleY(1.03) rotate(-2deg)}60%{transform:translateY(-5px) scaleX(var(--mon-dir)) scaleY(1.04) rotate(2deg)}80%{transform:translateY(-2px) scaleX(var(--mon-dir)) scaleY(.96)}to{transform:translateY(0) scaleX(var(--mon-dir)) scaleY(1)}}@keyframes mon-jump{0%{transform:scaleX(var(--mon-dir)) scaleY(.7)}30%{transform:translateY(-12px) scaleX(var(--mon-dir)) scaleY(1.12) rotate(-4deg)}60%{transform:translateY(-5px) scaleX(var(--mon-dir)) scaleY(1.04)}85%{transform:translateY(2px) scaleX(var(--mon-dir)) scaleY(.88)}to{transform:translateY(0) scaleX(var(--mon-dir)) scaleY(1)}}#levelup-modal{display:none;position:absolute;inset:0;z-index:60;background:#0a0612d1;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);align-items:center;justify-content:flex-start;padding-top:0;padding-bottom:env(safe-area-inset-bottom);box-sizing:border-box;overflow-y:auto}#levelup-modal.show{display:flex}.levelup-card{text-align:center;padding:28px 16px;max-width:420px;width:94%;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));display:flex;flex-direction:column;box-sizing:border-box}.levelup-title,.levelup-subtitle,.levelup-timer,.levelup-countdown{flex-shrink:0}.levelup-choices{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:env(safe-area-inset-bottom)}.levelup-actions{flex-shrink:0}@media (max-height: 700px){.levelup-card{padding:14px 12px}.levelup-choices{gap:8px}.levelup-btn{padding:12px 14px;gap:12px}.levelup-icon{width:44px;height:44px;font-size:28px;border-radius:10px}.levelup-title{font-size:28px;margin-bottom:4px}.levelup-subtitle{margin-bottom:4px}.levelup-countdown{margin-bottom:8px}.levelup-actions{margin-top:10px}}.levelup-title{font-family:var(--pf-font-title, "Cinzel Decorative", serif);font-size:clamp(32px,8vw,44px);font-weight:900;color:#ffd28a;text-shadow:0 2px 16px rgba(255,210,138,.7),0 0 40px rgba(255,180,60,.3);margin-bottom:6px}.levelup-subtitle{font-size:clamp(14px,3.5vw,17px);color:#fff8e7bf;margin-bottom:8px;letter-spacing:.06em}.levelup-timer{width:80%;height:6px;margin:0 auto 4px;border-radius:3px;background:#ffd28a26;overflow:hidden}.levelup-timer-bar{width:100%;height:100%;border-radius:3px;background:linear-gradient(90deg,#ffd28a,#ff8f60)}.levelup-countdown{font-size:16px;font-weight:900;color:#ffd28a;margin-bottom:12px;font-variant-numeric:tabular-nums}.levelup-choices{display:flex;flex-direction:column;gap:12px}.levelup-btn{display:flex;align-items:center;gap:16px;padding:18px 20px;border:2px solid rgba(255,210,138,.35);border-radius:14px;background:linear-gradient(135deg,rgba(255,248,231,.12) 0%,transparent 60%),#2c1810ad;color:#fff8e7;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;text-align:left;font-family:inherit;transition:border-color .15s,background .15s,transform .1s,box-shadow .15s;box-shadow:0 4px 16px #00000040}.levelup-btn:hover{border-color:#ffd28acc;background:linear-gradient(135deg,rgba(255,248,231,.22) 0%,transparent 60%),#2c1810d9;transform:scale(1.03);box-shadow:0 6px 24px #ffd28a33,0 4px 16px #0000004d}.levelup-btn:active{transform:scale(.97)}.levelup-btn.focused{border-color:#ffd28a;background:linear-gradient(135deg,rgba(255,248,231,.22) 0%,transparent 60%),#2c1810d9;transform:scale(1.03);box-shadow:0 0 24px #ffd28a59,0 6px 20px #0000004d}.levelup-key{flex:0 0 auto;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border-radius:7px;background:#ffd28a33;border:1px solid rgba(255,210,138,.4);color:#ffd28a;font-size:13px;font-weight:800;font-family:var(--pf-font-ui, "Quicksand", sans-serif)}.levelup-btn.focused .levelup-key{background:#ffd28a;color:#2a1400}.levelup-icon{font-size:clamp(32px,8vw,42px);width:clamp(52px,13vw,64px);height:clamp(52px,13vw,64px);display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:12px;background:linear-gradient(135deg,#ffd28a2e,#ffb43c14);box-shadow:inset 0 1px #ffffff26}.levelup-name{display:block;font-size:clamp(17px,4.5vw,22px);font-weight:800;color:#ffd28a;line-height:1.2;letter-spacing:.02em}.levelup-desc{display:block;font-size:clamp(13px,3.5vw,16px);color:#fff8e7c7;line-height:1.4;margin-top:3px}.levelup-text{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}.levelup-actions{display:flex;gap:10px;margin-top:14px}.levelup-reroll,.levelup-ready{flex:1;padding:11px 8px;border-radius:10px;font-size:clamp(13px,3.5vw,15px);font-family:inherit;font-weight:700;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;transition:background .15s,border-color .15s,transform .1s,opacity .2s;letter-spacing:.02em}.levelup-reroll{background:#ffffff0f;border:2px solid rgba(255,255,255,.18);color:#fff8e7cc}.levelup-reroll:hover:not(:disabled){background:#ffffff1f;border-color:#ffffff59;transform:scale(1.02)}.levelup-reroll:disabled{opacity:.45;cursor:default;border-color:#ffffff14}.levelup-reroll.used{opacity:.7;color:#a0e88a;border-color:#82dc644d}.levelup-ready{background:linear-gradient(135deg,#ffd28a38,#ff963c26);border:2px solid rgba(255,210,138,.55);color:#ffd28a}.levelup-ready:hover{background:linear-gradient(135deg,#ffd28a59,#ff963c40);border-color:#ffd28ad9;box-shadow:0 0 18px #ffd28a40;transform:scale(1.02)}.levelup-ready:active{transform:scale(.97)}.levelup-btn{position:relative;overflow:visible}@keyframes parchment-burn{0%{opacity:1;transform:scale(1) rotate(0);filter:none}18%{opacity:1;transform:scale(1.04) rotate(.5deg);filter:brightness(1.5) sepia(.5) saturate(3)}50%{opacity:.9;transform:scale(1.01) rotate(-.5deg);filter:brightness(2.2) sepia(1) saturate(5) contrast(1.3)}78%{opacity:.5;transform:scale(.93) rotate(-2deg) translateY(3px);filter:brightness(.5) sepia(1) saturate(0) contrast(2)}to{opacity:0;transform:scale(.78) rotate(-4deg) translateY(9px);filter:brightness(0) sepia(1)}}@keyframes parchment-glow{0%{box-shadow:0 4px 16px #00000040;border-color:#ffd28a59}20%{box-shadow:0 0 14px 4px #ff8200a6,0 0 40px #ff500059;border-color:#f82}50%{box-shadow:0 0 24px 10px #ff2800cc,0 0 70px #ff140080,inset 0 0 28px #ff460040;border-color:#f20}80%{box-shadow:0 0 10px 2px #50000080;border-color:#400}to{box-shadow:none;border-color:transparent}}@keyframes char-spread{0%{opacity:0;clip-path:circle(0% at 50% 50%);background:radial-gradient(circle,rgba(255,220,60,.95) 0%,rgba(255,80,0,.9) 30%,rgba(8,0,0,.96) 65%,transparent 85%)}25%{opacity:1;clip-path:circle(32% at 50% 50%)}58%{opacity:1;clip-path:circle(72% at 50% 50%);background:radial-gradient(circle,rgba(4,0,0,.98) 25%,rgba(0,0,0,.96) 55%,transparent 78%)}85%{opacity:.8;clip-path:circle(95% at 50% 50%)}to{opacity:0;clip-path:circle(100% at 50% 50%)}}@keyframes ember-rise{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,calc(-50% - 48px)) scale(.15)}}@keyframes not-picked-fade{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.94)}}.levelup-btn.burning{animation:parchment-burn .78s ease-in forwards,parchment-glow .78s ease-in forwards;pointer-events:none;z-index:2}.levelup-btn.burning:before{content:"";position:absolute;inset:0;border-radius:12px;pointer-events:none;z-index:1;animation:char-spread .78s ease-in forwards}.levelup-btn.burning:after{content:"";position:absolute;top:50%;left:50%;width:6px;height:6px;border-radius:50%;background:transparent;box-shadow:-22px -8px 3px 3px #ffa000e6,14px -20px 2px 2px #ffe63cd9,30px -5px 3px 2px #ff6400cc,-10px -26px 2px 2px #ffc850e6,20px -16px 2px 2px #ff8200bf,-30px -12px 2px 3px #ff4600cc,4px -32px 2px 2px #ffbe28d9,-4px -6px 2px 2px #ffff64b3;pointer-events:none;z-index:3;animation:ember-rise .58s ease-out .2s forwards}.levelup-btn.not-picked{animation:not-picked-fade .5s ease-out forwards;pointer-events:none}.mosquito:after{content:"";position:absolute;inset:0;border-radius:4px;background:#fff;opacity:0;pointer-events:none;mix-blend-mode:screen}.mosquito.mon-shrink:after,.mosquito.mon-knockback:after{animation:mon-hit-flash .4s ease-out forwards}@keyframes mon-hit-flash{0%{opacity:.85}to{opacity:0}}.mosquito.mon-shrink{animation:mon-shrink .4s ease-out!important}@keyframes mon-shrink{0%{transform:scaleX(var(--mon-dir)) scale(1.6)}30%{transform:scaleX(var(--mon-dir)) scale(.7)}60%{transform:scaleX(var(--mon-dir)) scale(1.15)}to{transform:scaleX(var(--mon-dir)) scale(1)}}.mosquito.mon-knockback{animation:mon-knockback .4s ease-out!important}@keyframes mon-knockback{0%{transform:scaleX(var(--mon-dir)) scaleY(.7) scaleX(calc(var(--mon-dir) * 1.3))}30%{transform:translateY(-10px) scaleX(var(--mon-dir)) rotate(calc(var(--mon-dir) * -15deg))}60%{transform:translateY(-4px) scaleX(var(--mon-dir)) rotate(calc(var(--mon-dir) * 5deg))}to{transform:translateY(0) scaleX(var(--mon-dir)) scaleY(1)}}.announcer-text{position:absolute;top:35%;left:50%;z-index:30;pointer-events:none;font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:clamp(28px,7vw,48px);font-weight:900;color:#fff;text-shadow:0 0 12px rgba(255,200,60,.9),0 0 30px rgba(255,100,0,.6),0 2px 4px rgba(0,0,0,.8);letter-spacing:.08em;white-space:nowrap;transform:translate(-50%,-50%);animation:announcer-pop 1.2s ease-out forwards}@keyframes announcer-pop{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}12%{opacity:.6;transform:translate(-50%,-50%) scale(1.4)}25%{transform:translate(-50%,-50%) scale(1)}70%{opacity:.6;transform:translate(-50%,-60%) scale(1)}to{opacity:0;transform:translate(-50%,-80%) scale(.8)}}.stage-clear-overlay{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;pointer-events:none;background:#00000073;animation:sc-overlay-anim 1.8s ease-out forwards}.sc-inner{display:flex;flex-direction:column;align-items:center;gap:10px}.sc-diroi-img{width:clamp(120px,30vw,200px);height:auto;border-radius:12px;box-shadow:0 0 24px #b464ffb3,0 4px 16px #0009;animation:sc-diroi-pop 1.8s cubic-bezier(.22,1.4,.5,1) forwards}.stage-clear-overlay.sc-wide .sc-inner{flex-direction:row;align-items:center;gap:24px}.stage-clear-overlay.sc-wide .sc-diroi-img{width:clamp(180px,28vh,320px);border-radius:16px}.stage-clear-overlay.sc-wide .sc-banner-wrap{width:clamp(220px,36vw,480px)}@keyframes sc-diroi-pop{0%{transform:scale(.5) translateY(20px);opacity:0}15%{transform:scale(1.05) translateY(-4px);opacity:1}25%{transform:scale(.98)}35%{transform:scale(1)}70%{transform:scale(1);opacity:1}to{transform:scale(.95) translateY(-10px);opacity:0}}.sc-banner-wrap{position:relative;width:clamp(280px,72vw,560px);height:clamp(96px,24vw,192px);background:linear-gradient(135deg,#f59e0b,#fcd34d 35%,#fef08a 55%,#f59e0b);background-size:contain;background-repeat:no-repeat;background-position:center;border:3px solid #fff7;border-radius:12px;box-shadow:0 0 40px #ffdc3ce6,0 0 80px #ffb40080,inset 0 0 24px #ffffff4d;display:flex;align-items:center;justify-content:center;overflow:hidden;animation:sc-banner-pop 1.8s cubic-bezier(.22,1.4,.5,1) forwards}.sc-text-block{text-align:center;position:relative;z-index:1}.sc-stage-num{font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:clamp(16px,4vw,26px);color:#7c3a00;letter-spacing:.2em;text-shadow:0 1px 2px rgba(255,255,255,.5);line-height:1}.sc-clear-txt{font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:clamp(40px,10vw,72px);font-weight:900;color:#5c1f00;letter-spacing:.12em;line-height:1;text-shadow:0 0 16px rgba(255,255,255,.8),0 2px 4px rgba(255,180,0,.6),0 4px 8px rgba(0,0,0,.2)}.sc-slot-unlock{font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:clamp(14px,3.5vw,20px);color:#a0f0a0;text-shadow:0 0 10px rgba(0,255,100,.8),0 2px 4px #000;letter-spacing:.08em}@keyframes sc-overlay-anim{0%{opacity:0}8%{opacity:1}70%{opacity:1}to{opacity:0}}@keyframes sc-banner-pop{0%{transform:scale(.3) rotate(-3deg);opacity:0}12%{transform:scale(1.08) rotate(1deg);opacity:1}20%{transform:scale(.97) rotate(0)}28%{transform:scale(1.02)}35%{transform:scale(1)}70%{transform:scale(1);opacity:1}to{transform:scale(.92) translateY(-20px);opacity:0}}body.screen-result #overlay .gameover-frame.sc-frame{background:url(../assets/generated/ui/codex-frame2.png) center / 100% 100% no-repeat;border:none;box-shadow:0 0 40px #ffb40066,0 0 100px #a050ff33;width:clamp(600px,88vw,1400px);min-width:unset;min-height:clamp(220px,28vh,480px);padding:clamp(36px,7vh,90px) clamp(90px,11vw,200px);margin-top:clamp(40px,10vh,120px)}body.screen-result #overlay .gameover-frame.sc-frame h1{color:#ffe066!important;-webkit-text-fill-color:#ffe066!important;background:none!important;-webkit-background-clip:unset!important;background-clip:unset!important;filter:none!important;text-shadow:0 0 28px rgba(255,220,0,1),0 0 56px rgba(255,160,0,.8),0 3px 6px rgba(0,0,0,.9);font-size:clamp(22px,4.2vw,72px);letter-spacing:.04em;white-space:nowrap}body.screen-result #overlay .gameover-frame.sc-frame p{color:#a0f0a0;text-shadow:0 0 10px rgba(0,255,100,.8),0 2px 4px #000;font-size:clamp(12px,1.8vw,22px);letter-spacing:.08em;min-height:1.2em;margin-top:6px}body.screen-result #overlay #restart.go-btn.sc-next-stage{width:clamp(260px,38vw,580px)}@media (orientation: portrait){body.screen-result #overlay .gameover-frame.sc-frame{width:clamp(320px,92vw,700px);padding:clamp(20px,4vh,50px) clamp(30px,6vw,80px);min-height:unset;margin-top:clamp(20px,5vh,60px)}body.screen-result #overlay .gameover-frame.sc-frame h1{font-size:clamp(18px,5vw,32px);white-space:nowrap}}body.screen-result #overlay .gameover-frame.chapter-clear{box-shadow:0 0 60px #c8a0ff99,0 0 120px #ffd70066,inset 0 0 40px #c8a0ff26}body.screen-result #overlay .gameover-frame.chapter-clear h1{font-size:clamp(24px,4.5vw,56px)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 0 40px rgba(200,160,255,1),0 0 80px rgba(255,215,0,.8),0 4px 8px rgba(0,0,0,.9);animation:chapterPulse 2s ease-in-out infinite}body.screen-result #overlay .gameover-frame.chapter-clear p{color:#e8d8ff;text-shadow:0 0 16px rgba(200,160,255,.9),0 2px 4px #000;font-size:clamp(13px,2vw,20px);line-height:1.8}@keyframes chapterPulse{0%,to{filter:brightness(1)}50%{filter:brightness(1.15) drop-shadow(0 0 20px rgba(255,215,0,.5))}}.stat-progress{min-width:56px}.stage-progress-wrap{width:52px;height:5px;background:#ffffff26;border-radius:3px;overflow:hidden;margin:1px 0}.stage-progress-bar{height:100%;width:0%;background:linear-gradient(90deg,#66e0ff,#a78bfa);border-radius:3px;transition:width .3s ease}.val-sm{font-size:9px!important;line-height:1.2}.skill-btn.slot-locked{opacity:.45;filter:grayscale(1) brightness(.55);cursor:not-allowed;position:relative}.skill-btn.slot-locked:before{content:"";position:absolute;inset:0;background:#0000008c;border-radius:inherit;pointer-events:none;z-index:1}.lobby-slot{transition:transform .18s ease,filter .18s ease;will-change:transform}.lobby-skill-icon{position:relative}.lobby-slot:not(.slot-locked):hover{transform:translateY(-5px) scale(1.08);filter:drop-shadow(0 6px 18px rgba(180,120,255,.7)) brightness(1.18)}.lobby-slot:not(.slot-locked):active{transform:translateY(1px) scale(.95);filter:brightness(.88)}.lobby-slot.slot-locked .lobby-skill-icon,.lobby-slot[data-locked] .lobby-skill-icon{filter:grayscale(1) brightness(.45);position:relative}.lobby-slot.slot-locked,.lobby-slot[data-locked]{cursor:not-allowed;opacity:.55}.lobby-slot.slot-locked .lobby-skill-icon:after,.lobby-slot[data-locked] .lobby-skill-icon:after{content:"";position:absolute;inset:0;background:#00000080 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM12 17c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E") center/40% no-repeat;border-radius:14px;pointer-events:none}.skill-btn.slot-locked:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:22px;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM12 17c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E") center / contain no-repeat;filter:drop-shadow(0 1px 3px rgba(0,0,0,.9));pointer-events:none;z-index:2}#points-report{position:absolute;bottom:20%;left:50%;transform:translate(-50%,20px);z-index:55;background:#0a0612e0;backdrop-filter:blur(8px);border:1px solid rgba(255,210,138,.4);border-radius:12px;padding:16px 24px;min-width:200px;opacity:0;transition:opacity .4s,transform .4s;pointer-events:none}#points-report.show{opacity:1;transform:translate(-50%)}.pr-title{font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:18px;color:#ffd28a;text-align:center;margin-bottom:10px;letter-spacing:.1em}.pr-rows{display:flex;flex-direction:column;gap:4px}.pr-row{display:flex;justify-content:space-between;font-size:13px;color:#fff8e7cc}.pr-row span:last-child{color:#6bcb77;font-weight:800}.pr-total{margin-top:10px;padding-top:8px;border-top:1px solid rgba(255,210,138,.3);font-family:var(--pf-font-impact, "Bangers", sans-serif);font-size:22px;color:gold;text-align:center;text-shadow:0 0 12px rgba(255,215,0,.5)}#stage.hitstop{filter:brightness(1.5) contrast(1.2);transform:scale(1.008);transition:none}.board.shake-light,#stage.shake-light{animation:shake-light .2s ease-out}.board.shake-mid,#stage.shake-mid{animation:shake-mid .3s ease-out}.board.shake-heavy,#stage.shake-heavy{animation:shake-heavy .5s ease-out}@keyframes shake-light{0%,to{transform:translate(0)}25%{transform:translate(-2px,1px)}75%{transform:translate(2px,-1px)}}@keyframes shake-mid{0%,to{transform:translate(0)}20%{transform:translate(-4px,2px)}40%{transform:translate(4px,-2px)}60%{transform:translate(-3px,1px)}80%{transform:translate(2px,-1px)}}@keyframes shake-heavy{0%,to{transform:translate(0)}10%{transform:translate(-8px,4px)}20%{transform:translate(8px,-4px)}30%{transform:translate(-6px,2px)}40%{transform:translate(6px,-2px)}50%{transform:translate(-4px,1px)}60%{transform:translate(4px,-1px)}70%{transform:translate(-2px,1px)}80%{transform:translate(2px)}}.block-piece.landed{animation:squash-stretch .25s cubic-bezier(.4,0,.6,1)}@keyframes squash-stretch{0%{transform:scaleY(1) scaleX(1)}30%{transform:scaleY(.6) scaleX(1.3)}60%{transform:scaleY(1.05) scaleX(.95)}to{transform:scaleY(1) scaleX(1)}}.impact-text{position:absolute;font-family:var(--pf-font-impact),"Bangers",cursive;font-weight:700;color:#fff;text-shadow:-2px -2px 0 #000,2px -2px 0 #000,-2px 2px 0 #000,2px 2px 0 #000;pointer-events:none;z-index:12;white-space:nowrap;transform:translate(-50%);animation:impact-text-anim .7s ease-out forwards}@keyframes impact-text-anim{0%{transform:translate(-50%) translateY(0) scale(0);opacity:0}30%{transform:translate(-50%) translateY(-5px) scale(1.3);opacity:1}to{transform:translate(-50%) translateY(-30px) scale(1);opacity:0}}.block-piece.soft-landed{animation:soft-squash .15s ease-out}@keyframes soft-squash{0%{transform:scaleY(1)}50%{transform:scaleY(.85)}to{transform:scaleY(1)}}#hud{grid-template-columns:1fr 1fr auto 1fr}#main{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,190px) 92px;grid-template-rows:minmax(0,1fr);align-items:stretch;gap:10px;flex:1;min-height:0;min-width:0;width:min(100%,1240px);margin:0 auto;padding:10px 12px}body.duel-mode{background:url(../assets/generated/pentafall-lobby-pc-wide-bg.png) center center / cover no-repeat fixed,#12091a!important}body.duel-mode #game{background:transparent!important}body.duel-mode #main{grid-template-columns:minmax(0,1fr);width:100%;max-width:100%;padding:0;position:relative}body.duel-mode #stage{width:100%;height:100%;background:transparent!important}body.duel-mode #stage:before,body.duel-mode #stage:after{display:none!important}body.duel-mode #stage canvas{position:relative;z-index:2;background:transparent!important}body.duel-mode #bottom-bar,body.duel-mode .bottom-controls,body.duel-mode #side-controls{display:none!important}#stage,#sidebar,#next-panel{min-height:0;min-width:0}#next-panel{display:grid;grid-template-rows:auto minmax(0,1fr);gap:10px;padding:12px;color:var(--frame-ink);background:radial-gradient(circle at 22% 12%,rgba(255,248,231,.5),transparent 32%),repeating-linear-gradient(90deg,rgba(139,111,71,.035) 0 1px,transparent 1px 7px),linear-gradient(180deg,#f5e6c8f2,#d4a574d6);border:2px solid rgba(44,24,16,.38);border-radius:8px;box-shadow:inset 0 1px #ffffff3d,0 12px 28px #2c181038}.next-panel-head{display:flex;align-items:end;justify-content:space-between;gap:8px;padding-bottom:8px;border-bottom:1px solid rgba(44,24,16,.24);font-family:var(--pf-font-ui)}.next-panel-head span{font-size:22px;font-weight:900;letter-spacing:0}.next-panel-head strong{font-size:11px;color:var(--text-muted);white-space:nowrap}#next-queue{display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:10px;min-height:0}.next-preview{position:relative;min-height:0;display:grid;place-items:center;padding:10px 8px;border:2px solid rgba(44,24,16,.28);border-radius:8px;background:linear-gradient(180deg,#fff8e78a,#ffe0d62e),#fff8e747;box-shadow:inset 0 1px #ffffff42}.next-rank{position:absolute;top:6px;left:7px;width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:var(--text-light);background:var(--frame-ink);font-family:var(--pf-font-ui);font-size:12px;font-weight:900;line-height:1;box-shadow:0 2px #2c181047}.next-chip{width:min(118px,100%);height:min(84px,100%);min-height:56px;padding:6px 8px 4px;background:#2c181029!important;flex-direction:column;gap:2px;overflow:visible}.chip-elem-label{display:none}@media (min-width: 721px) and (max-width: 900px) and (orientation: landscape){#main{grid-template-columns:minmax(0,1fr) minmax(140px,170px);grid-template-rows:minmax(0,1fr) auto;gap:8px;width:min(100%,900px);padding:8px}#stage{grid-column:1;grid-row:1 / -1}#next-panel{grid-column:2;grid-row:1;padding:8px;gap:6px}#next-queue{grid-template-columns:1fr;gap:6px}.next-preview{min-height:52px;padding:5px}.next-rank{width:18px;height:18px;font-size:10px}#sidebar{grid-column:2;grid-row:2;width:100%;min-height:60px;flex-direction:column;gap:6px;padding:6px}#hud{grid-template-columns:repeat(5,minmax(50px,auto));gap:12px;padding:8px 60px 8px 16px}.chip{width:42px;height:42px}.bottom-controls{display:none}}@media (max-width: 720px){#hud{grid-template-columns:repeat(4,minmax(0,1fr))}#main{width:100%;max-width:100%;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;gap:7px;padding:6px}#stage{grid-column:1;order:1}#next-panel{grid-column:1;order:2;padding:7px;gap:6px}.next-panel-head{align-items:center;padding-bottom:5px}.next-panel-head span{font-size:15px}#next-queue{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;gap:6px}.next-preview{min-height:58px;padding:6px}.next-rank{width:18px;height:18px;font-size:10px;top:4px;left:4px}.next-chip{width:100%;height:52px;min-height:52px;padding:5px}#sidebar{grid-column:1;order:3}}body.screen-main-menu #hud,body.screen-main-menu #duel-hud,body.screen-main-menu #next-panel,body.screen-main-menu #sidebar,body.screen-main-menu #bottom-bar,body.screen-result #hud,body.screen-result #duel-hud,body.screen-result #next-panel,body.screen-result #sidebar,body.screen-result #bottom-bar{display:none!important}body.screen-result #overlay{position:fixed;inset:0;z-index:9990}body.screen-result #overlay h1{position:relative;z-index:1;padding:28px 60px 8px;margin:0;font-size:32px;background:linear-gradient(180deg,#c77dff,#6b2d8e,#3d1158);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 30px rgba(157,78,221,.8))}body.screen-result #overlay p{position:relative;z-index:1;padding:0 40px 20px;margin:0;font-size:14px;color:#ffe0f0}body.screen-result #overlay .gameover-frame{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:url(../assets/generated/ui/btn-duel.png) center / 100% 100% no-repeat;padding:24px 40px;min-width:min(85vw,420px);min-height:120px;margin-bottom:16px}body.screen-main-menu #game{width:100%;max-width:100%}body.screen-main-menu #main{grid-template-columns:minmax(0,1fr);gap:0;width:100%;max-width:100%;padding:0}body.screen-main-menu #stage{min-height:100%}body.screen-main-menu #legend{display:none}body.screen-main-menu .start-actions:not(.gem-actions){width:min(100%,390px)}.mode-actions{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;padding:8px 12px 0;max-width:420px;margin:0 auto}.mode-btn{padding:8px 14px;border:1px solid rgba(255,210,138,.3);border-radius:8px;background:#2c181080;color:#fff8e7d9;font-family:var(--pf-font-ui, sans-serif);font-size:12px;font-weight:700;cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;transition:border-color .15s,background .15s,transform .1s}.mode-btn:hover{border-color:#ffd28ab3;background:#2c1810cc;transform:scale(1.04)}.mode-btn:active{transform:scale(.96)}.achievement-popup{position:fixed;top:60px;right:-320px;z-index:9990;display:flex;align-items:center;gap:10px;padding:12px 16px;min-width:260px;background:linear-gradient(135deg,#2c1810eb,#140a06f2);border:1px solid rgba(255,210,138,.5);border-radius:10px;box-shadow:0 6px 20px #00000080,0 0 20px #ffd28a33;transition:right .5s cubic-bezier(.34,1.2,.64,1)}.achievement-popup.show{right:16px}.ach-icon{font-size:28px}.ach-text{display:flex;flex-direction:column;gap:2px}.ach-text strong{color:#ffd28a;font-size:14px}.ach-text small{color:#fff8e7b3;font-size:11px}.ach-reward{color:#6bcb77;font-weight:900;font-size:14px;margin-left:auto}#rules.weakness-guide{width:min(100%,520px)}#rules.weakness-guide>summary{cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;list-style:none}#rules.weakness-guide>summary::-webkit-details-marker{display:none}#rules.weakness-guide:not([open]){max-height:44px;overflow:hidden}@media (max-width: 720px){body.screen-main-menu #overlay.show{padding:5px;gap:5px;justify-content:flex-start}body.screen-main-menu .wizard-mascot{width:min(92vw,430px);height:min(42dvh,420px);margin:0}body.screen-main-menu .start-actions:not(.gem-actions){flex-direction:column;gap:8px;padding:0 5px}body.screen-main-menu #restart,body.screen-main-menu #duel-start{width:100%;min-height:56px}body.screen-main-menu #restart{width:100%}body.screen-main-menu #duel-start{width:100%;min-height:56px}body.screen-game #main{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto;gap:5px;width:100%;max-width:100%;min-height:0;padding:5px}body.screen-game #hud{padding:5px}body.screen-game #next-panel{grid-column:1;grid-row:1;order:1;padding:5px;gap:5px}body.screen-game #stage{grid-column:1;grid-row:2;order:2;justify-self:stretch;align-self:stretch;width:100%;height:100%;max-width:100%;min-height:0;border:2px solid rgba(44,24,16,.42);border-radius:8px;background:linear-gradient(180deg,#fff8e73d,#ffe0d614),#18102229;box-shadow:0 0 0 1px #fff8e759,0 12px 24px #2c18102e,inset 0 1px #ffffff38}body.screen-game #sidebar{grid-column:1;grid-row:3;order:3;width:100%;max-width:100%;min-height:48px;flex:0 0 auto;flex-direction:row;gap:5px;padding:5px}body.screen-game #side-controls{display:grid;grid-template-columns:1fr;width:52px;flex-basis:52px;flex-shrink:0;padding-left:5px}body.screen-game #next-queue{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;gap:5px}body.screen-game .next-preview{min-height:44px;padding:5px}body.screen-game .next-chip{height:44px;min-height:44px;padding:4px}body.screen-game #bottom-bar{display:flex;width:100%;max-width:100%;min-width:0;padding:5px 5px calc(5px + env(safe-area-inset-bottom))}}body.screen-main-menu{background:#120a1b;--pf-lobby-pc-bg: url(../assets/generated/pentafall-lobby-pc-wide-bg.png);--pf-lobby-mobile-bg: url(../assets/backgrounds/lobby-mobile/lobby-m1.png);--pf-gameplay-bg: url(../assets/backgrounds/bg-sky.png)}body.screen-main-menu #game{width:100%;height:100dvh;min-height:100dvh;max-width:100%;transform:none;color:#f7edd7;background:radial-gradient(ellipse 80% 60% at 50% 100%,rgba(5,3,18,.72) 0%,transparent 75%),radial-gradient(ellipse 100% 30% at 50% 0%,rgba(5,3,18,.45) 0%,transparent 100%),var(--pf-char-bg, var(--pf-lobby-pc-bg)) center center / cover no-repeat,#120a1b;transition:background-image .5s ease}body.screen-main-menu #stage:before{background-image:radial-gradient(circle,rgba(255,235,177,.78) 0 1px,transparent 1.8px),radial-gradient(circle,rgba(126,214,255,.58) 0 1px,transparent 1.7px);background-size:86px 86px,137px 137px;opacity:.3}body.screen-main-menu #stage:after{display:none}body.screen-main-menu #stage>canvas{opacity:0}body.screen-main-menu #overlay{overflow:hidden;background:transparent}body.screen-main-menu #overlay:before{display:none}body.screen-main-menu #overlay.show{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto auto;align-items:center;justify-items:center;gap:clamp(5px,1.1dvh,10px);padding:clamp(10px,2dvh,18px) max(12px,env(safe-area-inset-left),env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom));overflow:hidden}body.screen-main-menu #overlay h1{margin:0;background:linear-gradient(180deg,#c77dff,#6b2d8e,#3d1158);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;-webkit-text-stroke:0;font-family:Cinzel Decorative,Cinzel,Georgia,"Noto Serif KR",serif;font-size:clamp(52px,14vw,82px);line-height:.92;letter-spacing:.12em;filter:drop-shadow(0 0 12px rgba(157,78,221,.6)) drop-shadow(0 0 30px rgba(157,78,221,.8)) drop-shadow(0 0 60px rgba(107,45,142,.4)) drop-shadow(0 8px 18px rgba(0,0,0,.55));text-shadow:none}body.screen-main-menu #overlay p{margin:0;color:#ffe6f5;font-family:Quicksand,Noto Sans KR,system-ui,sans-serif;font-size:clamp(11px,3.1vw,14px);font-weight:700;letter-spacing:.05em;text-shadow:0 2px 8px rgba(60,20,80,.9),0 0 16px rgba(199,125,255,.5);position:relative;z-index:5}body.screen-main-menu .wizard-mascot{align-self:center;width:min(86vw,430px);height:min(49dvh,520px);min-height:0;margin:24px 0 -2px;filter:drop-shadow(0 26px 32px rgba(0,0,0,.56));animation:mascot-float 4.4s ease-in-out infinite}body.screen-main-menu .wizard-mascot:before{content:"";position:absolute;left:50%;bottom:2%;width:min(62vw,310px);height:13%;border-radius:50%;background:radial-gradient(ellipse,rgba(0,0,0,.44),transparent 68%);transform:translate(-50%);filter:blur(4px)}body.screen-main-menu .wizard-mascot-img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center bottom}body.screen-main-menu #rules.weakness-guide{width:min(92vw,430px);max-width:430px;max-height:52px;margin:0;padding:8px 14px 14px;overflow:hidden;color:#f6e5bd;background:linear-gradient(180deg,#fff1c41a,#fff1c409),#100a18c7;border:1px solid rgba(242,195,112,.36);border-radius:8px;box-shadow:inset 0 1px #ffffff1f,0 16px 36px #0000005c;backdrop-filter:blur(16px)}body.screen-main-menu #rules.weakness-guide[open]{max-height:min(30dvh,270px);overflow-y:auto}body.screen-main-menu .weakness-title{display:grid;grid-template-columns:32px 1fr 32px;align-items:center;min-height:36px;color:#f4c776;font-family:var(--pf-font-display, "Quicksand", "Noto Sans KR", system-ui, sans-serif);font-size:14px;font-weight:900;letter-spacing:.5px;text-align:center;cursor:pointer}body.screen-main-menu .weakness-title .codex-icon{width:28px;height:28px;object-fit:contain;justify-self:center;filter:drop-shadow(0 0 4px rgba(199,125,255,.4))}body.screen-main-menu .weakness-title:after{content:"";width:26px;height:26px;justify-self:center;background-image:linear-gradient(to right,transparent 11px,#f4c776 11px,#f4c776 15px,transparent 15px),linear-gradient(to bottom,transparent 11px,#f4c776 11px,#f4c776 15px,transparent 15px),radial-gradient(circle at 50% 50%,rgba(199,125,255,.25),transparent 70%);background-size:100% 100%,100% 100%,100% 100%;background-repeat:no-repeat;background-color:#140c20b3;border:1px solid rgba(199,125,255,.4);border-radius:50%;transition:transform .2s ease,background .2s ease}body.screen-main-menu #rules.weakness-guide[open] .weakness-title:after{transform:rotate(45deg)}body.screen-main-menu .weakness-title::-webkit-details-marker{display:none}body.screen-main-menu .weakness-title::marker{display:none;content:""}body.screen-main-menu .weakness-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:8px}body.screen-main-menu .weakness-card{min-height:42px;grid-template-columns:auto 22px 1fr;gap:5px;padding:6px;background:#ffffff0e;border-color:#f2c37033}body.screen-main-menu .weakness-card.immunity{min-height:34px}body.screen-main-menu .weakness-arrow{width:22px;height:11px}body.screen-main-menu .element-token{min-width:34px;height:22px;padding:0 7px;font-size:11px}body.screen-main-menu .weakness-note{min-height:28px;margin-top:6px;padding:4px 7px;color:#f6e5bde0;background:#ffffff0e;border-color:#f2c3702e;font-family:Quicksand,Noto Sans KR,system-ui,sans-serif;font-size:11px}body.screen-main-menu .start-actions:not(.gem-actions){width:min(92vw,430px);gap:8px;margin:0;padding:0}body.screen-main-menu .menu-btn{--c1: #fff;--c2: #fff;--c3: #888;--glow: rgba(255,255,255,.2);position:relative;width:100%;min-height:68px;display:flex;align-items:center;gap:14px;padding:0 22px;border:none;border-radius:16px;font-family:Quicksand,Noto Sans KR,sans-serif;overflow:hidden;background:linear-gradient(170deg,var(--c1) 0%,var(--c2) 50%,var(--c3) 100%);transform:translateY(0);transition:transform .18s cubic-bezier(.4,0,.2,1),box-shadow .18s ease,outline-color .18s ease;cursor:pointer;outline:2.5px solid rgba(255,220,130,.55);outline-offset:0;box-shadow:inset 0 1px #ffffff80,inset 0 -3px 10px #00000026,0 5px 0 var(--c3),0 10px 30px #0000004d}body.screen-main-menu .menu-btn:before{content:"";position:absolute;top:0;left:6%;right:6%;height:50%;border-radius:0 0 50% 50%/0 0 100% 100%;background:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.08) 60%,transparent);pointer-events:none}body.screen-main-menu .menu-btn:after{content:"";position:absolute;inset:4px;border-radius:12px;border:1.5px solid rgba(255,255,255,.18);pointer-events:none}.btn-icon{position:relative;z-index:1;flex:0 0 auto;width:42px;height:42px;display:flex;align-items:center;justify-content:center;border-radius:11px;font-size:20px;background:#0003;border:1.5px solid rgba(255,255,255,.15);box-shadow:inset 0 1px 3px #ffffff1f,0 2px 5px #0003}.btn-text{position:relative;z-index:1;display:flex;flex-direction:column;text-align:left;line-height:1.3}.btn-text strong{font-size:19px;font-weight:900;letter-spacing:.08em}.btn-text small{font-size:11px;font-weight:500;opacity:.6;margin-top:1px}.btn-shine{position:absolute;z-index:2;top:-30%;left:-90%;width:35%;height:160%;background:linear-gradient(100deg,transparent 25%,rgba(255,255,255,.4) 50%,transparent 75%);transform:skew(-18deg);pointer-events:none}body.screen-main-menu .menu-btn:hover .btn-shine{left:160%;transition:left .55s cubic-bezier(.3,0,.2,1)}body.screen-main-menu .menu-btn:hover{transform:translateY(-5px);outline-color:#fff0aacc;box-shadow:inset 0 1px #fff9,inset 0 -3px 10px #0000001a,0 7px 0 var(--c3),0 18px 50px var(--glow),0 0 28px var(--glow)}body.screen-main-menu .menu-btn:active{transform:translateY(3px);outline-color:#ffdc8266;box-shadow:inset 0 4px 14px #00000059,0 1px 0 var(--c3);transition-duration:.05s}.lobby-codex{display:flex;align-items:center;justify-content:center;gap:8px;width:min(92vw,430px);margin:0 auto;padding:14px 20px;background:url(../assets/generated/ui/codex-frame2.png) center / 100% 100% no-repeat;border:none;border-radius:6px;color:#f4c776;font-size:14px;font-weight:900;font-family:var(--pf-font-display, inherit);cursor:url(../assets/cursor-pointer-32.png) 14 2,pointer;transition:transform .15s,filter .15s}.lobby-codex .codex-icon{width:32px;height:32px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(199,125,255,.5))}.lobby-codex:hover{transform:translateY(-2px);filter:brightness(1.15);border-color:#c77dff80}.lobby-codex:active{transform:scale(.96)}.gem-actions{display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;justify-content:center;align-items:center;gap:clamp(12px,3vw,30px);width:100%!important;max-width:100%!important;padding:0 10px!important}.gem-btn{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:6px;background:none!important;border:none!important;outline:none!important;box-shadow:none!important;cursor:pointer;padding:0;flex:1 1 0;min-width:0;max-width:33%;transition:transform .18s ease,filter .18s ease;filter:drop-shadow(0 4px 16px rgba(0,0,0,.6))}.gem-btn:before,.gem-btn:after{display:none!important}.gem-btn:hover{transform:translateY(-8px) scale(1.08);filter:drop-shadow(0 8px 24px rgba(0,0,0,.7)) brightness(1.25)}.gem-btn:active{transform:translateY(2px) scale(.95);filter:brightness(.8)}.gem-img{width:90%;height:clamp(60px,15vw,100px);object-fit:contain;object-position:center bottom;pointer-events:none}.gem-label{display:flex;flex-direction:column;align-items:center;font-family:Cinzel,Cinzel Decorative,Georgia,serif;font-size:clamp(12px,2.5vw,16px);font-weight:700;color:#c8b8a0;letter-spacing:.1em;line-height:1.2;text-shadow:0 2px 6px rgba(0,0,0,.9);min-height:2.4em;justify-content:flex-start}.gem-label strong{font-size:clamp(14px,3.5vw,20px);color:#e8d8c0;letter-spacing:.15em}.gem-sub{font-family:var(--pf-font-ui, "Quicksand", sans-serif);font-size:clamp(9px,2vw,12px);color:#c8b8a08c;letter-spacing:.03em}body.screen-main-menu #match-start:disabled{cursor:wait;opacity:.35;transform:none;filter:grayscale(.5)}.go-btn,#restart.go-btn,#go-lobby.go-btn{position:relative;display:inline-block;background:none!important;border:none!important;outline:none!important;box-shadow:none!important;cursor:pointer;padding:0!important;border-radius:0!important;width:clamp(180px,40vw,320px);transition:transform .18s ease,filter .18s ease;filter:drop-shadow(0 4px 16px rgba(0,0,0,.6))}.go-btn:hover{transform:translateY(-4px) scale(1.06);filter:drop-shadow(0 8px 24px rgba(0,0,0,.7)) brightness(1.2)}.go-btn:active{transform:translateY(2px) scale(.95);filter:brightness(.8)}.go-btn-bg{width:100%;height:auto;display:block;pointer-events:none}.go-btn-text{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:Cinzel,Cinzel Decorative,Georgia,serif;font-size:clamp(16px,3.5vw,26px);font-weight:900;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.9),0 0 20px rgba(0,0,0,.5);letter-spacing:.15em;pointer-events:none}.codex-icon{width:22px;height:22px;object-fit:contain;vertical-align:middle;margin-right:6px;filter:drop-shadow(0 0 4px rgba(199,125,255,.5))}@media (min-width: 721px){body.screen-main-menu .gem-actions{width:min(90vw,700px)!important;gap:30px}.gem-img{width:90%}}@media (max-width: 720px){body.screen-main-menu #game{background:radial-gradient(ellipse 100% 55% at 50% 100%,rgba(5,3,18,.78) 0%,transparent 80%),var(--pf-char-bg, var(--pf-lobby-pc-bg)) 0% 50% / cover no-repeat,#120a1b;animation:lobby-pan-mobile 180s ease-in-out infinite}body.screen-main-menu #stage:before{opacity:.08}body.screen-main-menu #stage:after{display:none}body.screen-main-menu #overlay{background:transparent}body.screen-main-menu #overlay.show{padding:clamp(8px,1.4dvh,14px) max(10px,env(safe-area-inset-left),env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom))}body.screen-main-menu .wizard-mascot{width:min(88vw,410px);height:min(47dvh,500px);margin:-5px 0 -3px}body.screen-main-menu #rules.weakness-guide{width:min(94vw,430px);max-height:40px}body.screen-main-menu #rules.weakness-guide[open]{max-height:min(28dvh,250px)}body.screen-main-menu .start-actions:not(.gem-actions){width:min(94vw,430px);flex-direction:column}body.screen-main-menu .gem-actions{flex-direction:row!important;flex-wrap:nowrap!important;width:100%!important;gap:clamp(6px,2vw,14px);padding:0 6px!important}.gem-img{width:85%}.gem-label strong{font-size:clamp(11px,2.8vw,16px);letter-spacing:.05em}.gem-sub{font-size:clamp(8px,1.8vw,11px)}body.screen-main-menu .menu-btn{width:100%;min-height:54px}body.screen-main-menu .btn-text strong{font-size:15px}body.screen-main-menu .btn-text small{font-size:9px}body.screen-main-menu #duel-start{display:none}}@media (max-width: 380px){body.screen-main-menu #overlay h1{font-size:46px}body.screen-main-menu .wizard-mascot{height:min(39dvh,390px)}body.screen-main-menu .weakness-flow{grid-template-columns:1fr}}body.screen-game:not(.duel-mode) #game{background:linear-gradient(180deg,#070a120a,#070a121f),var(--pf-gameplay-bg) center center / cover no-repeat,#120a1b}@media (min-width: 721px){body.screen-game:not(.duel-mode) #game{background:linear-gradient(180deg,#070a120a,#070a121f),var(--pf-game-wide-bg) center center / cover no-repeat,linear-gradient(180deg,#b8dcec,#d9eff2 42%,#ffe0d6 72%,#c8956a)}body.screen-game:not(.duel-mode) #stage{background:transparent!important}}body.screen-game #next-panel,body.screen-game #sidebar{background:#f5e6c829;border-color:#2c18103d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px #ffffff38,0 10px 24px #2c18101f}body.screen-game #hud{background:#080614f5!important;border-color:#c8962880!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}body.screen-game #bottom-bar{background:transparent!important;border:none!important;box-shadow:none!important;backdrop-filter:none!important}body.screen-game #stage{background:#18102214}body.screen-game #stage:before{opacity:.08}body.screen-game #stage:after{opacity:.1}body.screen-game .next-preview{background:#fff8e733;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}body.screen-game .next-chip{background:#2c181014!important}#opponent-mini{display:none;position:absolute;inset:0;width:100%;height:100%;border-radius:6px;opacity:.85;image-rendering:pixelated}body.mode-online #next-preview-2-wrap #next-preview-2{display:none}body.mode-online #opponent-mini{display:block}.stage-clear-remain{position:absolute;bottom:6px;left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:3px;padding:0 6px;pointer-events:none}.scr-label{font-family:var(--pf-font-ui, monospace);font-size:9px;font-weight:900;letter-spacing:.15em;color:#ffdc50d9;text-shadow:0 1px 3px rgba(0,0,0,.9);line-height:1}.scr-bar-wrap{width:100%;height:4px;background:#00000059;border-radius:999px;overflow:hidden}.scr-bar{height:100%;width:0%;background:linear-gradient(90deg,#ffe066,#ff9a00);border-radius:999px;transition:width .25s ease-out}.scr-count{font-family:var(--pf-font-ui, monospace);font-size:11px;font-weight:900;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.95),0 0 6px rgba(255,180,0,.5);line-height:1}body.screen-game .btn:not(.ctrl-btn){backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);background:linear-gradient(180deg,#fff8e76b,#e66ea085)}#char-select-btn{background:linear-gradient(180deg,rgba(255,255,255,.36),transparent 45%),linear-gradient(135deg,#ffc8e6,#c97dff 50%,#7a3db8);color:#fff;border:1px solid rgba(255,200,230,.5)}.char-modal{position:fixed;inset:0;z-index:900;display:none;align-items:center;justify-content:center;background:#05050fe0;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.char-modal.open{display:flex}.char-modal-inner{width:min(94vw,720px);max-height:min(90dvh,800px);overflow-y:auto;background:radial-gradient(circle at 12% 10%,rgba(255,255,255,.08),transparent 22%),linear-gradient(145deg,#2b2035f2,#1c1224fa);border:1px solid rgba(255,200,230,.2);border-radius:16px;padding:20px;box-shadow:0 30px 80px #0009}.char-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.char-modal-header h2{font-family:var(--pf-font-title, "Cinzel Decorative", serif);font-size:clamp(20px,5vw,28px);margin:0;background:linear-gradient(180deg,#fff8de,#f4c776);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}#char-modal-close{width:36px;height:36px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:#ffffff14;color:#ccc;font-size:22px;line-height:1;cursor:pointer}#char-modal-close:hover{background:#ffffff2e;color:#fff}.char-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}.char-card{position:relative;border:2px solid rgba(255,255,255,.1);border-radius:12px;overflow:hidden;background:#0000004d;cursor:pointer;padding:0;transition:transform .2s,border-color .2s,box-shadow .2s}.char-card:hover{transform:translateY(-4px);border-color:#ffc8e666;box-shadow:0 8px 24px #c864b440}.char-card.selected{border-color:#ffd28a;box-shadow:0 0 20px #ffd28a66,inset 0 0 20px #ffd28a1a}.char-card.selected:after{content:"✦";position:absolute;top:6px;right:6px;width:24px;height:24px;display:flex;align-items:center;justify-content:center;background:#ffd28a;color:#3a2418;border-radius:50%;font-size:12px;font-weight:700;box-shadow:0 2px 8px #0000004d}.char-card img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}.char-name{display:block;padding:6px 4px;text-align:center;font-family:var(--pf-font-ui, "Quicksand", sans-serif);font-size:12px;font-weight:600;color:#e8daf0;background:#0006}.char-card.locked{cursor:not-allowed;filter:brightness(.35) grayscale(.6)}.char-card.locked:hover{transform:none;border-color:#ffffff1a;box-shadow:none}.lock-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#00000080;color:#888;font-family:var(--pf-font-ui, "Quicksand", sans-serif);font-size:13px;font-weight:700;letter-spacing:.02em;text-shadow:0 1px 4px rgba(0,0,0,.6);border-radius:12px}.lock-overlay.can-afford{background:#0000008c;cursor:pointer}.lock-overlay.can-afford .unlock-buy{color:#ffd28a;text-align:center;line-height:1.4;font-size:14px;padding:8px 16px;border:1.5px solid rgba(255,210,138,.5);border-radius:10px;background:#ffd28a1f}.char-card.locked:has(.can-afford){filter:brightness(.55) grayscale(.3)}.char-card.locked:has(.can-afford):hover{filter:brightness(.7) grayscale(.1);transform:translateY(-2px)}.char-score-badge{font-family:var(--pf-font-ui, "Quicksand", sans-serif);font-size:13px;font-weight:600;color:#ffd28a;background:#ffd28a1f;padding:4px 12px;border-radius:20px;border:1px solid rgba(255,210,138,.25)}@media (max-width: 480px){.char-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:8px}.char-name{font-size:10px;padding:4px 2px}.lock-overlay{font-size:11px}}#char-detail-modal{display:none;position:fixed;inset:0;z-index:9600;background:#000000bf;align-items:center;justify-content:center}#char-detail-modal.open{display:flex}.char-detail-inner{background:linear-gradient(180deg,#1a1020,#0d0815);border:1px solid rgba(180,120,255,.35);border-radius:18px;padding:28px 24px 24px;width:min(380px,92vw);max-height:85vh;overflow-y:auto;position:relative;text-align:center}.char-detail-close{position:absolute;top:12px;right:14px;background:none;border:none;color:#aaa;font-size:22px;cursor:pointer;line-height:1}.char-detail-close:hover{color:#fff}.char-detail-portrait-wrap{width:120px;height:120px;margin:0 auto 12px;border-radius:50%;overflow:hidden;border:2px solid rgba(180,120,255,.4);background:#ffffff0d}.char-detail-portrait{width:100%;height:100%;object-fit:cover;object-position:top}.char-detail-name{color:#e8d4ff;font-size:17px;margin:0 0 14px}.char-detail-bgms{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.char-bgm-btn{all:unset;cursor:pointer;font-size:13px;color:#c4a8f0;padding:9px 14px;border-radius:9px;background:#ffffff0d;border:1px solid transparent;transition:background .15s,border-color .15s,color .15s;text-align:left}.char-bgm-btn:hover{background:#b478ff2e;color:#fff}.char-bgm-btn.active{border-color:#a78bfa;color:#fff;background:#a78bfa2e}.char-bgm-row,.set-bgm-row{display:flex;gap:6px;align-items:stretch}.char-bgm-row .char-bgm-btn,.set-bgm-row .set-bgm-btn{flex:1}.char-bgm-pl-btn{all:unset;cursor:pointer;width:32px;text-align:center;font-size:18px;font-weight:700;color:#8b8b8b;border-radius:8px;background:#ffffff0f;border:1px solid transparent;transition:all .15s}.char-bgm-pl-btn:hover{color:#fff;background:#78c8ff2e}.char-bgm-pl-btn.in-pl{color:#a78bfa;border-color:#a78bfa}.playlist-toggle-btn{all:unset;cursor:pointer;font-size:18px;color:#c4a8f0;padding:4px 10px;border-radius:6px;margin-left:8px;background:#ffffff0f;transition:all .15s}.playlist-toggle-btn:hover{background:#a78bfa40;color:#fff}#playlist-modal{display:none;position:fixed;inset:0;z-index:9700;background:#000000bf;align-items:center;justify-content:center}#playlist-modal.open{display:flex}.pl-inner{background:linear-gradient(180deg,#1a1020,#0d0815);border:1px solid rgba(180,120,255,.35);border-radius:18px;padding:24px;width:min(380px,92vw);max-height:80vh;overflow-y:auto}.pl-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.pl-header h3{color:#e8d4ff;font-size:17px;margin:0}.pl-close{all:unset;cursor:pointer;color:#aaa;font-size:22px}.pl-close:hover{color:#fff}.pl-toggle-wrap{margin-bottom:14px}.pl-toggle-label{color:#c4a8f0;font-size:13px;cursor:pointer;display:flex;align-items:center;gap:8px}.pl-toggle-label input{accent-color:#a78bfa}.pl-list{display:flex;flex-direction:column;gap:6px}.pl-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;background:#ffffff0d;user-select:none;touch-action:none;transition:border-top .1s,border-bottom .1s}.pl-handle{color:#555;font-size:15px;cursor:grab;line-height:1}.pl-row:active .pl-handle{cursor:grabbing}.pl-dragging{opacity:.3;background:#a78bfa1a}.pl-drop-above{border-top:2px solid #a78bfa}.pl-drop-below{border-bottom:2px solid #a78bfa}.pl-num{color:#8b8b8b;font-size:12px;min-width:20px}.pl-name{flex:1;color:#e8d4ff;font-size:13px}.pl-rm{all:unset;cursor:pointer;color:#f87171;font-size:16px;padding:2px 6px}.pl-rm:hover{color:#fff}.pl-empty{color:#666;font-size:13px;text-align:center;padding:20px 0;line-height:1.6}.char-detail-select-btn{all:unset;cursor:pointer;display:block;width:100%;background:linear-gradient(135deg,#7c3aed,#5b21b6);color:#fff;font-size:15px;font-weight:700;padding:11px 0;border-radius:10px;text-align:center;transition:filter .15s;box-sizing:border-box}.char-detail-select-btn:hover{filter:brightness(1.15)}#set-modal{display:none;position:fixed;inset:0;z-index:9500;background:#000000b3;align-items:center;justify-content:center}#set-modal.open{display:flex}.set-modal-inner{background:linear-gradient(180deg,#1a1020,#0d0815);border:1px solid rgba(180,120,255,.3);border-radius:16px;padding:24px;width:min(480px,92vw);max-height:85vh;overflow-y:auto;position:relative}.set-modal-close{position:absolute;top:12px;right:14px;background:none;border:none;color:#aaa;font-size:22px;cursor:pointer;line-height:1}.set-modal-close:hover{color:#fff}.set-modal-title{color:#e8d4ff;font-size:18px;margin:0 0 16px}.set-modal-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin-bottom:14px}.set-photo-btn{all:unset;cursor:pointer;border-radius:10px;overflow:hidden;border:2px solid transparent;transition:border-color .15s;display:flex;flex-direction:column}.set-photo-btn:hover{border-color:#ffd28a}.set-photo-btn img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.set-photo-btn span{font-size:11px;color:#ccc;padding:4px 4px 6px;text-align:center}.set-modal-bgms{display:flex;flex-direction:column;gap:6px}.set-bgm-btn{all:unset;cursor:pointer;font-size:13px;color:#d4b8ff;padding:8px 12px;border-radius:8px;background:#ffffff0d;transition:background .15s,color .15s}.set-bgm-btn:hover{background:#b478ff33;color:#fff}.set-unlock-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#ffb40014;border:1px solid rgba(255,180,0,.25);border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:13px;color:#ffd28a}.set-unlock-pts{color:#aaa;font-size:12px}.set-unlock-btn{all:unset;cursor:pointer;background:linear-gradient(135deg,#8b5cf6,#6d28d9);color:#fff;font-size:13px;font-weight:700;padding:6px 14px;border-radius:8px;transition:filter .15s}.set-unlock-btn.can-afford:hover{filter:brightness(1.2)}.locked-preview{opacity:.45;cursor:default;pointer-events:none}@media (pointer: coarse){*{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}@keyframes mon-bounce-safari{0%,to{transform:translateY(0) scaleX(var(--mon-dir))}40%{transform:translateY(-6px) scaleX(var(--mon-dir))}80%{transform:translateY(-2px) scaleX(var(--mon-dir))}}.lobby-ranking-btn{display:flex;align-items:center;justify-content:center;gap:6px;margin:6px auto 0;padding:9px 22px;background:#ffd23c1f;border:1.5px solid rgba(255,200,50,.35);border-radius:20px;color:#ffd93d;font-size:13px;font-weight:700;font-family:var(--pf-font-display, inherit);cursor:pointer;transition:background .15s,transform .15s}.lobby-ranking-btn:hover{background:#ffd23c38;transform:translateY(-1px)}.ranking-icon{font-size:16px}.ranking-modal-inner{max-width:480px!important;width:min(96vw,480px)!important;max-height:min(88dvh,680px)!important;display:flex!important;flex-direction:column;overflow:hidden}.ranking-tabs{display:flex;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:0}.ranking-tab{flex:1;padding:10px;background:none;border:none;color:#888;font-size:13px;font-weight:700;cursor:pointer;transition:color .15s,border-bottom .15s;border-bottom:2px solid transparent}.ranking-tab.active{color:#ffd93d;border-bottom:2px solid #ffd93d}.ranking-podium{display:flex;justify-content:center;align-items:flex-end;gap:4px;padding:12px 12px 0;min-height:130px}.podium-item{display:flex;flex-direction:column;align-items:center;gap:3px;flex:1;max-width:110px}.podium-crown{font-size:18px;line-height:1}.podium-av{width:46px;height:46px;border-radius:50%;object-fit:cover;background:#6450a066;display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.podium-av img{width:100%;height:100%;border-radius:50%;object-fit:cover}.podium-item.rank-1 .podium-av{width:58px;height:58px;font-size:26px;outline:2px solid #ffd700;outline-offset:2px}.podium-item.rank-2 .podium-av{outline:2px solid #c0c0c0;outline-offset:2px}.podium-item.rank-3 .podium-av{outline:2px solid #cd7f32;outline-offset:2px}.podium-name{font-size:10px;font-weight:700;color:#d8d0ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:96px;text-align:center}.podium-score{font-size:11px;font-weight:900;color:#fff}.podium-base{width:100%;margin-top:4px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:900;border-radius:6px 6px 0 0}.podium-item.rank-1 .podium-base{height:48px;background:linear-gradient(180deg,#ffd70040,#ffd7001a);color:gold}.podium-item.rank-2 .podium-base{height:34px;background:#c0c0c026;color:silver}.podium-item.rank-3 .podium-base{height:22px;background:#cd7f3226;color:#cd7f32}.podium-me-tag{font-size:9px;color:#ffd93d}.ranking-my-sticky{display:flex;align-items:center;gap:10px;padding:10px 14px;background:linear-gradient(90deg,#ffd7001f,#ff960014);border-top:1px solid rgba(255,215,0,.3);flex-shrink:0}.ranking-my-sticky .rm-rank{font-size:18px;font-weight:900;color:#ffd93d;min-width:36px;text-align:center}.ranking-my-sticky .rm-name{font-weight:700;color:#fff;flex:1;font-size:13px}.ranking-my-sticky .rm-score{font-weight:900;color:#ffd93d;font-size:14px}.ranking-my-sticky .rm-meta{font-size:11px;color:#aaa}.ranking-list{flex:1;overflow-y:auto;padding:8px 0;min-height:200px;max-height:420px}.ranking-loading{text-align:center;color:#666;padding:32px;font-size:13px}.ranking-empty{text-align:center;color:#666;padding:24px 16px;font-size:13px;line-height:1.6}.ranking-row{display:flex;align-items:center;gap:10px;padding:8px 14px;transition:background .1s}.ranking-row:hover{background:#ffffff0a}.ranking-row.is-me{background:#ffd70014;border-left:3px solid #ffd93d}.rr-rank{font-size:13px;font-weight:900;min-width:28px;text-align:center;color:#888}.rr-rank.gold{color:gold;font-size:16px}.rr-rank.silver{color:silver;font-size:15px}.rr-rank.bronze{color:#cd7f32;font-size:14px}.rr-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;background:#ffffff1a;flex-shrink:0}.rr-avatar-placeholder{width:32px;height:32px;border-radius:50%;background:#6450a066;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0}.rr-info{flex:1;min-width:0}.rr-name{font-size:13px;font-weight:700;color:#e8e0ff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rr-meta{font-size:11px;color:#888;margin-top:1px}.rr-score{font-size:14px;font-weight:900;color:#fff;white-space:nowrap}.ranking-friend-search{padding:10px 12px 12px;border-top:1px solid rgba(255,255,255,.08)}.ranking-search-row{display:flex;gap:8px}.ranking-search-row input{flex:1;padding:8px 12px;background:#ffffff12;border:1px solid rgba(255,255,255,.15);border-radius:8px;color:#fff;font-size:13px;outline:none}.ranking-search-row input::placeholder{color:#555}.ranking-search-row button{padding:8px 16px;background:#6450c866;border:1px solid rgba(140,100,255,.3);border-radius:8px;color:#cbbfff;font-size:13px;font-weight:700;cursor:pointer}.ranking-search-row button:hover{background:#6450c899}.ranking-search-results{margin-top:8px}.ranking-search-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;background:#ffffff0a;margin-bottom:4px}.ranking-search-item .rsi-name{flex:1;font-size:13px;color:#e0d8ff}.ranking-search-item .rsi-score{font-size:12px;color:#aaa}.ranking-search-item .rsi-add{padding:4px 12px;background:#50b4784d;border:1px solid rgba(80,200,100,.4);border-radius:6px;color:#7fe8a0;font-size:12px;font-weight:700;cursor:pointer}.ranking-search-item .rsi-add:hover{background:#50b47880}.ranking-search-item .rsi-added{padding:4px 12px;background:#64646433;border:1px solid rgba(150,150,150,.2);border-radius:6px;color:#888;font-size:12px}.ranking-divider{height:1px;background:#ffffff0f;margin:4px 14px}.podium-meta{font-size:9px;color:#98c;margin-top:1px}.rr-me-tag{font-size:9px;color:#ffd93d;font-weight:700;vertical-align:middle}.gameover-rank-card{display:none;text-align:center;color:#ffd93d;font-size:13px;font-weight:700;margin:6px 0 2px;padding:6px 12px;background:#ffd7001a;border:1px solid rgba(255,215,0,.25);border-radius:8px}.gameover-rank-card.show{display:block;animation:fadeInUp .4s ease}.grc-title{font-size:10px;color:#aaa;font-weight:400;margin-bottom:2px}.grc-rank{font-size:26px;font-weight:900;line-height:1.1}.grc-score{font-size:15px;font-weight:700}.grc-meta{font-size:10px;color:#ccc;font-weight:400;margin-top:2px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes lobby-pan-mobile{0%{background-position:50% 100%,0% 50%}50%{background-position:50% 100%,100% 50%}to{background-position:50% 100%,0% 50%}}.gp-focus{outline:2.5px solid #ffe066!important;outline-offset:3px;box-shadow:0 0 0 4px #ffdc5040!important;transition:outline .1s,box-shadow .1s}.ranking-invite-section{background:linear-gradient(135deg,#ffc83214,#ffa01e0a);border:1px solid rgba(255,200,50,.25);border-radius:10px;padding:12px 14px;margin-bottom:10px}.invite-title{font-size:12px;color:#ffd93d;margin-bottom:8px;text-align:center}.invite-link-row{display:flex;gap:6px;margin-bottom:8px}.invite-link-input{flex:1;background:#ffffff12;border:1px solid rgba(255,255,255,.15);border-radius:6px;color:#ddd;font-size:11px;padding:5px 8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.invite-copy-btn{padding:5px 12px;background:#ffc83233;border:1px solid rgba(255,200,50,.4);border-radius:6px;color:#ffd93d;font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;transition:background .15s}.invite-copy-btn:hover{background:#ffc83259}.invite-share-row{display:flex;gap:6px;justify-content:center;margin-bottom:6px}.invite-share-btn{flex:1;padding:6px 8px;border-radius:6px;font-size:11px;font-weight:700;cursor:pointer;transition:filter .15s;border:1px solid rgba(255,255,255,.15)}.invite-share-btn:hover{filter:brightness(1.15)}.invite-share-native{background:#78b4ff2e;color:#8cbcff}.invite-share-twitter{background:#00000059;color:#fff}.invite-share-kakao{background:#fee50033;color:#ffe066}.invite-desc{font-size:10px;color:#888;text-align:center}.invite-login-notice{padding:8px 12px;background:#ffffff0a;border-radius:8px;color:#aaa;font-size:11px;text-align:center;margin-bottom:8px}.referral-reward-toast{position:fixed;top:60px;left:50%;transform:translate(-50%);background:linear-gradient(135deg,#1a1a2e,#16213e);border:1.5px solid rgba(255,200,50,.5);border-radius:12px;color:#ffd93d;font-size:14px;font-weight:700;padding:12px 22px;z-index:99999;pointer-events:none;animation:toastFadeInOut 4s ease forwards;box-shadow:0 4px 20px #ffb40033}@keyframes toastFadeInOut{0%{opacity:0;transform:translate(-50%) translateY(-8px)}10%{opacity:1;transform:translate(-50%) translateY(0)}80%{opacity:1}to{opacity:0}}.lobby-social-row{display:flex;justify-content:center;gap:8px;margin:6px auto 0;width:100%;max-width:320px;box-sizing:border-box}.lobby-social-row .lobby-ranking-btn{margin:0;flex:1;max-width:140px}.lobby-friends-btn{border-color:#78c8ff59;color:#8ecfff;background:#64b4ff14}.lobby-friends-btn:hover{background:#64b4ff33}.lobby-rank-chip{flex:1;max-width:140px;margin:0;cursor:pointer;padding:6px 10px;display:none;flex-direction:column;align-items:center;justify-content:center;border:1.5px solid rgba(100,220,150,.35);border-radius:20px;background:#50c87814;color:#7fffa0;transition:background .15s,transform .15s;text-align:center}.lobby-rank-chip:hover{background:#50c87833;transform:translateY(-1px)}.lobby-rank-chip.show{display:flex;animation:fadeInUp .4s ease}.lobby-rank-chip .grc-title{font-size:9px;color:#aaa;font-weight:400;margin-bottom:1px}.lobby-rank-chip .grc-rank{font-size:18px;font-weight:900;line-height:1.1}.lobby-rank-chip .grc-score{font-size:11px;font-weight:700}.lobby-rank-chip .grc-meta{font-size:9px;color:#ccc;margin-top:1px}#next-panel.coop-active{background:radial-gradient(circle at 22% 12%,rgba(220,200,255,.6),transparent 32%),linear-gradient(180deg,#d2befff2,#aa8ce6d9);border-color:#825ac899;transition:background .3s,border-color .3s}