:root{--ink:#f1f4fb;--dim:#9aa3b5;--blue:#2f8cff;--cyan:#5fd8ff;--gold:#ffd43b;--red:#ff4d5e;--panel:#0a0d16f0;--line:#ffffff1f;--display:"Oswald", "Malgun Gothic", sans-serif;--body:"IBM Plex Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", sans-serif;--st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px);--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);font-family:var(--body);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:#07080d;margin:0;overflow:hidden}#app{touch-action:none;position:fixed;inset:0}#view,#fx{width:100%;height:100%;display:block;position:absolute;inset:0}#fx{pointer-events:none}[hidden],body.scheme-touch .pc-only,body.scheme-pc .touch-only{display:none!important}button,a.ghost{font:700 1rem var(--body);color:var(--ink);cursor:pointer;text-align:center;touch-action:manipulation;background:#ffffff1a;border:0;border-radius:12px;min-height:46px;padding:12px 18px;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid var(--gold);outline-offset:2px}button.primary{color:#fff;font:700 1.12rem var(--body);background:linear-gradient(#4aa3ff,#1f6fe0);box-shadow:0 4px #0f3f8a}button.primary:active{transform:translateY(2px);box-shadow:0 2px #0f3f8a}.ghost{background:0 0!important;border:1.5px solid #ffffff40!important}#hud{pointer-events:none;position:absolute;inset:0}#hud button{pointer-events:auto}.top{top:calc(8px + var(--st));left:calc(10px + var(--sl));right:calc(10px + var(--sr));align-items:flex-start;gap:8px;display:flex;position:absolute}.vitals{gap:4px;width:min(38vw,220px);display:grid}.bar{border:1px solid var(--line);background:#0009;border-radius:5px;height:14px;position:relative;overflow:hidden}.bar i{width:100%;transition:width .12s;position:absolute;inset:0 auto 0 0}.bar.hp{height:17px}.bar.hp i{background:linear-gradient(90deg,#36d27a,#a3ff5c)}.bar.hp.low i{background:linear-gradient(90deg,#ff4d5e,#ff8a5a)}.bar.hp span{font:700 .78rem/16px var(--display);color:#0b140d;position:absolute;top:0;right:6px}.xprow{align-items:center;gap:6px;display:flex}.xprow b{font:700 .86rem var(--display);color:var(--gold);text-shadow:0 1px 2px #000;min-width:38px}.bar.xp{flex:1;height:8px}.bar.xp i{background:linear-gradient(90deg,#ffb020,#ffe066)}.clock{text-shadow:0 2px 4px #000;flex:1;justify-items:center;gap:1px;display:grid}.clock b{font:700 1.6rem/1 var(--display);letter-spacing:.04em}.clock span{font:700 .72rem var(--display);letter-spacing:.2em;color:var(--cyan)}.right{gap:6px;display:flex}button.icon{border:1px solid var(--line);background:#0000008c;border-radius:10px;width:40px;height:40px;min-height:40px;padding:0;font-size:1.05rem}.row2{top:calc(58px + var(--st));left:calc(10px + var(--sl));right:calc(10px + var(--sr));justify-content:space-between;align-items:flex-start;display:flex;position:absolute}.skills{flex-wrap:wrap;gap:5px;max-width:70vw;display:flex}.skills .s{background:#0000008c;border:1px solid #ffa03c99;border-radius:9px;place-items:center;width:34px;height:34px;display:grid;position:relative}.skills .s.passive{border-color:#6ebeff99}.skills .s.passive b{color:#7cc4ff;background:#001426;border-color:#7cc4ff}.skills .s b{font:700 .64rem var(--display);color:#ffb35a;background:#1a0d00;border:1px solid #ffb35a;border-radius:6px;padding:0 3px;line-height:13px;position:absolute;bottom:-4px;right:-3px}.kills{font:700 1rem var(--display);background:#00000080;border-radius:8px;align-items:center;gap:5px;padding:3px 9px;display:flex}.kills span{color:var(--red);font-size:.78rem}.combo{right:calc(14px + var(--sr));opacity:0;text-shadow:0 3px 8px #000;justify-items:end;transition:opacity .2s;display:grid;position:absolute;top:30%}.combo.on{opacity:1}.combo b{font:700 2.4rem/1 var(--display);color:var(--gold)}.combo span{font:700 .8rem var(--display);letter-spacing:.3em}.combo.pop b{animation:.25s pop}@keyframes pop{50%{transform:scale(1.35)}}.banner{opacity:0;text-align:center;text-shadow:0 3px 8px #000;justify-items:center;gap:2px;transition:opacity .25s,transform .25s;display:grid;position:absolute;top:24%;left:0;right:0;transform:translateY(10px)}.banner.on{opacity:1;transform:none}.banner small{font:700 .9rem var(--display);color:var(--gold);letter-spacing:.25em}.banner b{font:700 clamp(1.4rem, 6vw, 2.2rem) var(--body)}.toast{left:50%;bottom:calc(52px + var(--sb));border:1px solid var(--line);max-width:88vw;font:600 .9rem var(--body);text-align:center;opacity:0;background:#000000b8;border-radius:10px;padding:8px 14px;transition:opacity .2s;position:absolute;transform:translate(-50%)}.toast.on{opacity:1}.toast.warn{border-color:var(--red);color:#ffd0d4}.stick{opacity:0;pointer-events:none;background:#ffffff0f;border:2px solid #ffffff40;border-radius:50%;width:112px;height:112px;margin:-56px 0 0 -56px;position:absolute}.stick.on{opacity:1}.stick i{background:#ffffffd9;border-radius:50%;width:48px;height:48px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 8px #00000080}.stick-hint,.keys{left:50%;bottom:calc(14px + var(--sb));font:600 .74rem var(--body);color:#fff9;white-space:nowrap;background:#00000073;border-radius:8px;padding:4px 10px;transition:opacity .6s;position:absolute;transform:translate(-50%)}.overlay{padding:calc(14px + var(--st)) 14px calc(14px + var(--sb));background:radial-gradient(#0a0e1c8c,#030408e6);place-items:center;display:grid;position:absolute;inset:0;overflow-y:auto}.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;gap:10px;width:min(420px,100%);padding:22px 20px;display:grid;box-shadow:0 20px 60px #0009}.panel h2{font:700 1.6rem var(--body);text-align:center;margin:0 0 4px}.menu-panel{background:linear-gradient(#101c38f2,#080a14f2);width:min(560px,100%)}.logo{line-height:.92;font:700 clamp(2.3rem, 11vw, 3.4rem) var(--display);letter-spacing:.05em;justify-items:center;margin:0;display:grid}.logo span:first-child{color:#fff;text-shadow:0 0 16px #50a0ff99,0 4px #1d4fd8}.logo span:last-child{color:var(--gold);text-shadow:0 4px #b3261e}.lead{text-align:center;color:#cdd6ea;margin:2px 0;font-size:.88rem;line-height:1.5}.pick-title{color:var(--cyan);font:700 .9rem var(--body)!important;text-align:left!important;margin:4px 0 0!important}.boxers{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.boxer{color:var(--ink);font:400 .74rem var(--body);background:linear-gradient(#23365e,#142038);border:2px solid #33507f;border-radius:14px;justify-items:center;gap:4px;padding:6px 6px 10px;display:grid;position:relative}.boxer img{aspect-ratio:1;background:radial-gradient(circle at 50% 40%,#5aa9ff55,#0000);border-radius:10px;width:100%;max-width:120px}.boxer .name{font:700 .9rem var(--display);letter-spacing:.03em}.boxer .desc{color:#b9c4dc;min-height:3.6em;font-size:.7rem;line-height:1.35}.boxer .stats{width:100%;color:var(--dim);gap:2px;font-size:.62rem;display:grid}.boxer .stats div{grid-template-columns:2.6em 1fr;align-items:center;gap:4px;display:grid}.boxer .stats i{background:linear-gradient(90deg,#ffb020,#ffe066);border-radius:3px;height:5px;display:block}.boxer[aria-checked=true]{border-color:var(--gold);background:linear-gradient(#2d4b85,#182a4d);box-shadow:0 0 0 2px #ffd43b59,0 8px 22px #00000080}.boxer[aria-checked=true]:after{content:"선택됨";font:700 .62rem var(--body);background:var(--gold);color:#241a00;border-radius:999px;padding:1px 7px;position:absolute;top:-9px;right:6px}.records{grid-template-columns:repeat(4,1fr);gap:6px;margin:0;display:grid}.records div{text-align:center;background:#00000059;border-radius:10px;padding:6px 4px}.records dt{color:var(--dim);font-size:.66rem}.records dd{font:700 1.05rem var(--display);margin:2px 0 0}.row{gap:8px;display:flex}.row>*{flex:1}.kicker{text-align:center;font:700 .8rem var(--display);letter-spacing:.3em;color:var(--gold);margin:0}.tally{background:#0000004d;border-radius:10px;grid-template-columns:auto 1fr;gap:6px 14px;margin:4px 0;padding:12px 14px;display:grid}.tally dt{color:var(--dim);font-size:.86rem}.tally dd{text-align:right;font:700 .96rem var(--body);margin:0}.record{text-align:center;color:var(--gold);margin:0;font-weight:700}.note{color:var(--dim);text-align:center;font-size:.86rem}.build{color:#d6def0;flex-wrap:wrap;justify-content:center;gap:6px;font-size:.78rem;display:flex}.build span{background:#ffffff12;border-radius:6px;padding:2px 7px}.overlay.cards{background:radial-gradient(#0a142880,#020308db)}.cards-wrap{justify-items:center;gap:10px;width:min(780px,100%);display:grid}.cards-wrap h2{font:700 1.35rem var(--body);text-shadow:0 3px 8px #000;margin:0}.card-list{grid-template-columns:repeat(3,1fr);gap:10px;width:100%;display:grid}.card{--c1:#6b7486;--c2:#3d4352;text-align:left;background:linear-gradient(180deg, var(--c1), var(--c2));color:#fff;font:400 .8rem var(--body);border:2px solid #ffffff59;border-radius:14px;grid-template-rows:auto auto 1fr;grid-template-columns:60px 1fr;align-items:start;gap:3px 10px;padding:12px 12px 10px;animation:.26s ease-out both cardIn;display:grid;position:relative;box-shadow:0 8px 22px #00000080}.card:nth-child(2){animation-delay:50ms}.card:nth-child(3){animation-delay:.1s}@keyframes cardIn{0%{opacity:0;transform:translate(-30px)}}.card:hover,.card:focus-visible{border-color:#fff;transform:translateY(-2px)}.card.common{--c1:#7c8494;--c2:#4a5060}.card.uncommon{--c1:#3fbf6a;--c2:#1f7a42}.card.rare{--c1:#2fa0ff;--c2:#1458b8}.card.epic{--c1:#f06ac8;--c2:#a0307e}.card.skill{--c1:#ff9a3c;--c2:#b8461a}.card.evolution{--c1:#ffcf4a;--c2:#8a3fd1;box-shadow:0 0 0 2px #ffcf4a8c,0 0 24px #b478ff73}.card.transcend{--c1:#c77dff;--c2:#2a1a6e;box-shadow:0 0 0 2px #c77dff80,0 0 20px #785aff66}.card .recipe{color:#ffe9a8;grid-column:2/-1;font-size:.72rem;line-height:1.3}.card .key{display:none}.card canvas{background:#00000040;border-radius:10px;grid-row:span 3;align-self:center;width:56px!important;height:56px!important}.card .name{font:700 1rem var(--display);letter-spacing:.02em}.card .desc{color:#f2f5fb;font-size:.76rem;line-height:1.38}.card .stat{font:700 .76rem var(--body);background:#0000004d;border-radius:6px;justify-self:start;margin-top:2px;padding:1px 7px}.card .tag{font:700 .62rem var(--display);letter-spacing:.1em;color:#fff;background:#0b0f18;border:1px solid;border-radius:999px;padding:1px 8px;position:absolute;top:-9px;right:10px}.card.skill .tag{color:#ffb35a}.hint{color:var(--dim);margin:0;font-size:.78rem}@media (max-width:600px) and (orientation:portrait){.card-list{grid-template-columns:1fr;gap:9px}.boxers{gap:6px}.records{grid-template-columns:repeat(2,1fr)}}@media (max-height:480px){.card{grid-template-columns:44px 1fr;padding:8px}.card canvas{width:44px!important;height:44px!important}.card .desc{font-size:.7rem}.menu-panel{gap:6px;padding:12px 14px}.lead,.boxer .desc{display:none}.boxer img{max-width:70px}.combo{top:40%}}@media (min-width:900px) and (min-height:560px){body.scheme-pc .vitals{left:50%;bottom:calc(24px + var(--sb));gap:7px;width:min(640px,50vw);position:fixed;transform:translate(-50%)}body.scheme-pc .bar.hp{border-width:2px;border-radius:10px;height:34px;box-shadow:0 6px 18px #00000080}body.scheme-pc .bar.hp:before{content:"HP";z-index:1;font:700 1.05rem/30px var(--display);color:#fff;text-shadow:0 2px 3px #000;position:absolute;top:0;left:12px}body.scheme-pc .bar.hp span{z-index:1;text-align:center;font:700 1.3rem/30px var(--display);color:#fff;text-shadow:0 2px 3px #000;left:0;right:0}body.scheme-pc .xprow b{min-width:52px;font-size:1.1rem}body.scheme-pc .bar.xp{border-radius:6px;height:12px}body.scheme-pc .keys{bottom:calc(104px + var(--sb))}body.scheme-pc .toast{bottom:calc(118px + var(--sb))}body.scheme-pc .cards-wrap{gap:18px;width:min(1500px,94vw)}body.scheme-pc .cards-wrap .kicker{font-size:1.2rem}body.scheme-pc .cards-wrap h2{font-size:2.2rem}body.scheme-pc .card-list{gap:28px}body.scheme-pc .card{text-align:center;border-width:3px;border-radius:22px;grid-template-rows:none;grid-template-columns:1fr;align-content:center;justify-items:center;row-gap:16px;min-height:min(58vh,540px);padding:40px 26px 28px;font-size:1rem}body.scheme-pc .card:hover,body.scheme-pc .card:focus-visible{transform:translateY(-6px)scale(1.02);box-shadow:0 14px 34px #0009}body.scheme-pc .card canvas{border-radius:18px;grid-row:auto;width:clamp(100px,16vh,150px)!important;height:clamp(100px,16vh,150px)!important}body.scheme-pc .card .name{font-size:clamp(1.45rem,2.1vw,2.05rem)}body.scheme-pc .card .desc{max-width:36ch;font-size:clamp(1.02rem,1.25vw,1.28rem);line-height:1.5}body.scheme-pc .card .stat{border-radius:9px;justify-self:center;padding:5px 14px;font-size:1.12rem}body.scheme-pc .card .tag{padding:4px 16px;font-size:.92rem;top:-15px;left:50%;right:auto;transform:translate(-50%)}body.scheme-pc .card .key{width:38px;height:38px;font:700 1.3rem/36px var(--display);text-align:center;background:#00000059;border:1px solid #fff6;border-radius:10px;display:block;position:absolute;top:14px;left:14px}body.scheme-pc .cards-wrap .hint{font-size:1.05rem}}#skills{z-index:30}.skills-panel{width:min(620px,100%);max-height:calc(100dvh - 28px - var(--st) - var(--sb));grid-template-rows:auto auto 1fr;padding:16px 14px}.sk-head{align-items:center;gap:10px;display:flex}.sk-head h2{flex:1;text-align:left!important;margin:0!important;font-size:1.25rem!important}.sk-head button{width:auto;padding:8px 14px}.sk-tabs{flex-wrap:wrap;gap:6px;display:flex}.sk-tabs button{color:#fff;width:auto;font:700 .85rem var(--body);background:#ffffff0f;border:1px solid #ffffff38;border-radius:999px;margin:0;padding:7px 14px}.sk-tabs button[aria-selected=true]{color:#241800;background:linear-gradient(#ffd23f,#e8a400);border-color:#0000}.sk-body{overscroll-behavior:contain;align-content:start;gap:8px;min-height:0;display:grid;overflow-y:auto}.sk-rule{color:#ffe9a8;background:#ffd23f1f;border-radius:10px;margin:0;padding:8px 10px;font-size:.8rem}.sk-card{border-left:3px solid var(--c1,#7c8494);background:#ffffff0d;border-radius:12px;grid-template-columns:44px 1fr;gap:10px;padding:10px;display:grid}.sk-card.common{--c1:#7c8494}.sk-card.uncommon{--c1:#3fbf6a}.sk-card.rare{--c1:#2fa0ff}.sk-card.epic{--c1:#f06ac8}.sk-card.skill{--c1:#ff9a3c}.sk-card.evolution{--c1:#ffcf4a}.sk-card.transcend{--c1:#c77dff}.sk-card canvas{background:#00000040;border-radius:8px}.sk-txt{gap:3px;min-width:0;font-size:.82rem;line-height:1.35;display:grid}.sk-txt>b{font:700 .95rem var(--display);flex-wrap:wrap;align-items:baseline;gap:8px;display:flex}.sk-lim{font:600 .7rem var(--body);color:var(--dim)}.sk-desc{color:#d9e0f0}.sk-stat{color:#9fd8ff;font-size:.76rem}.sk-cond{color:#ffb36b;font-size:.76rem}.sk-recipe{color:#ffe9a8;flex-wrap:wrap;align-items:center;gap:4px;font-size:.76rem;display:flex}.sk-chip{background:#ffcf4a24;border:1px solid #ffcf4a59;border-radius:999px;align-items:center;gap:4px;padding:2px 8px 2px 3px;display:inline-flex}.sk-var{color:var(--dim);gap:2px;margin:2px 0 0;padding:0;font-size:.74rem;list-style:none;display:grid}.sk-var li.me{color:#fff}.sk-var li.me b{color:var(--gold,#ffd23f)}.sk-var b{color:#c8d2ea;font-weight:700}
