@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{font-family:'Noto Sans KR',sans-serif;color:#e9eff6;background:#0b1420;font-synthesis:none;--blue:#58c9f3;--gold:#efd77f;--red:#fb786d;--line:#ffffff18;--muted:#8a9cb1}*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button{cursor:pointer;color:inherit;border:1px solid #ffffff2a;background:#172a3e;border-radius:5px;padding:10px 16px;font-weight:700;transition:background .15s,transform .15s}button:hover:not(:disabled){background:#26445f}button:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:disabled{opacity:.38;cursor:not-allowed}button.primary{background:#dbebf6;color:#10223b;border-color:#fff}button.primary:hover:not(:disabled){background:white}button.accent{background:#d55044;border-color:#f57e72;color:white}button.quiet{background:transparent;border-color:var(--line);color:#acb9c9}a{color:var(--blue)}.eyebrow{font-size:11px;letter-spacing:2.5px;color:var(--blue);font-weight:800}.muted{color:var(--muted)}.boot{display:grid;place-content:center;height:100dvh;gap:20px;font-size:32px}.boot span{font-size:14px}.brand{display:flex;align-items:center;gap:10px;letter-spacing:2px;font-size:14px;font-weight:900}.brand img{width:32px}.brand small{display:block;color:var(--muted);font-size:9px;letter-spacing:1px}.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 4vw}.topbar nav{display:flex;gap:8px}.topbar button{font-size:12px;padding:7px 12px}.lobby{min-height:100dvh;background:radial-gradient(ellipse at 65% 8%,#203b55,transparent 58%),#0c1725}.lobby-main{max-width:1180px;margin:auto;padding:38px 28px 20px}.intro{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.intro h1{font-size:clamp(26px,3.5vw,44px);letter-spacing:-2px;margin:9px 0}.intro p{color:#a7b8ca;font-size:14px;line-height:1.8;margin:0}.ready{color:#a0e6cd;border:1px solid #a0e6cd44;border-radius:30px;padding:8px 13px;font-size:11px;white-space:nowrap}.ready:before{content:'●';margin-right:8px}.selection-heading{display:flex;align-items:center;justify-content:space-between;margin:20px 0 13px;font-size:13px}.selection-heading small{color:var(--muted)}.deck-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.deck-tile{position:relative;border:1px solid #ffffff22;border-radius:12px;overflow:hidden;background:#142a40;min-height:278px;isolation:isolate}.deck-tile.selected{border:2px solid var(--blue);box-shadow:0 0 0 3px #58c9f311}.deck-tile .art{position:absolute;inset:0 0 0 43%;z-index:-2;overflow:hidden}.deck-tile .art img{width:100%;height:145%;object-fit:cover;object-position:50% 22%;transform:rotate(12deg) scale(1.35)}.deck-tile:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#11263bf5 20%,#11263ba8 55%,#11263b0a)}.deck-tile.wing{background:#263e36}.deck-tile.wing:after{background:linear-gradient(90deg,#142f2bf5 20%,#142f2ba8 55%,#142f2b10)}.deck-info{padding:26px;max-width:70%}.deck-info .code{font:800 12px monospace;color:var(--blue);letter-spacing:2px}.wing .code{color:#a6e6b9}.deck-info h2{font-size:26px;margin:12px 0 3px;letter-spacing:-1px}.deck-info .en{font-size:11px;letter-spacing:1px;color:#a8b5c7}.deck-info p{font-size:12px;line-height:1.8;color:#c2cedb;min-height:42px}.deck-info .tags{font-size:10px;color:#d8e6f2;margin-bottom:18px}.deck-info button{font-size:12px;padding:8px 13px;margin-right:4px}.selected-tag{position:absolute;right:16px;top:15px;background:var(--blue);color:#0d2839;border-radius:3px;font-size:10px;font-weight:900;padding:5px 8px}.launch{display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px;background:#162638;border:1px solid var(--line);border-radius:9px;margin-top:20px;padding:20px 24px}.launch-options{display:flex;gap:28px;align-items:center}.launch label{font-size:10px;color:var(--muted);display:grid;gap:6px}.launch select{color:#eaf3ff;border:0;background:#20364c;padding:7px 24px 7px 10px;border-radius:4px;font-size:12px}.launch button{min-width:180px;padding:16px 25px;font-size:15px}.lobby-foot{display:flex;justify-content:space-between;gap:20px;font-size:10px;color:#7890a7;margin-top:23px;line-height:1.8}.lobby-foot a{color:#adc1d2}.notes{display:flex;gap:22px;font-size:11px;color:#a0b3c5;margin-top:20px}.notes span:before{content:'＋';color:var(--blue);margin-right:6px}
.game{height:100dvh;overflow:hidden;background:radial-gradient(ellipse at 45% 45%,#1b344c,#0b1623 72%);display:grid;grid-template-rows:48px 1fr}.game .topbar{height:48px;padding:0 18px}.game-layout{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 246px}.battle-board{display:grid;grid-template-rows:62px minmax(100px,1fr) 48px minmax(100px,1fr) 58px 165px;padding:8px 18px 0;min-height:0;position:relative;background-image:linear-gradient(#79cde506 1px,transparent 1px),linear-gradient(90deg,#79cde506 1px,transparent 1px);background-size:36px 36px}.hud{display:flex;align-items:center;gap:12px}.hud .avatar{width:35px;height:35px;display:grid;place-content:center;font-size:12px;font-weight:900;border:1px solid #6ba1c4;border-radius:50%;color:#bfeaff}.hud .identity{font-size:12px;min-width:85px}.hud small{display:block;font-size:9px;color:#91a9bf;margin-top:3px}.hud .shield-group{display:flex;gap:4px;align-items:center;margin-left:auto}.shield{width:24px;height:34px;border:1px solid #5d87aa;border-radius:3px;background:linear-gradient(140deg,#345977,#10283c);box-shadow:inset 0 0 0 3px #0d2031;color:#acdaf2;display:grid;place-content:center;font-size:10px}.hud .deck-count{font:13px monospace;margin:0 7px;color:#a5bdd1}.resources{display:flex;align-items:center;gap:4px}.resource{padding:0;width:23px;height:33px;border:1px solid #8fb4b9;border-radius:3px;background:linear-gradient(135deg,#7fc0b7,#2e646a);color:#e5fffa;font:10px monospace;transition:.2s;position:relative}.resource.rested{transform:rotate(90deg) scale(.73);opacity:.4}.resource.ex{background:linear-gradient(140deg,#bb9e4f,#5e4f2d);border-color:#e9d28b}.resource.pay{box-shadow:0 0 0 2px #ffe07c,0 0 15px #ffd36288;transform:translateY(-6px)}.resource.available{animation:resourcePulse 1.3s infinite}.resource-title{font-size:9px;color:#9db3c7;line-height:1.7;min-width:52px}.field{display:grid;grid-template-columns:78px 1fr 52px;gap:12px;align-items:center;min-height:0;position:relative}.unit-slots{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:8px;min-width:0;height:100%;max-height:170px}.slot{height:min(17vh,136px);border:1px dashed #90b9d31b;border-radius:6px;display:grid;align-items:center;justify-items:center;position:relative;min-width:0}.slot.empty:after{content:'＋';color:#6b8aa12e;font-size:22px}.unit-wrap{position:relative;width:86%;max-width:100px;aspect-ratio:5/7}.card{position:relative;display:block;width:100%;aspect-ratio:5/7;border:1px solid #7194b366;border-radius:5px;padding:0;background:#1f3a52;box-shadow:0 4px 10px #0006;transition:transform .2s,box-shadow .2s;overflow:visible}.card img{display:block;width:100%;height:100%;object-fit:cover;border-radius:4px;pointer-events:none}.card .ko-label{position:absolute;left:0;right:0;bottom:0;min-height:24px;padding:4px 3px 3px;background:linear-gradient(#0b1825e8,#0b1825);font-size:9px;line-height:1.2;text-align:center;color:#f5faff;border-radius:0 0 4px 4px;pointer-events:none}.card:hover{box-shadow:0 0 0 2px #d9efff}.card.active{border:2px solid var(--blue);box-shadow:0 0 0 2px #58c9f332}.card.usable{animation:cardPulse 2s infinite}.card.attackable{box-shadow:0 0 0 2px #f1cf68,0 0 15px #f1cf6822}.card.target{box-shadow:0 0 0 3px #fb806c;animation:targetPulse .85s infinite}.unit-wrap.rested .card{transform:rotate(90deg) scale(.85)}.unit-wrap.rested .pilot{transform:rotate(90deg) translateX(18px) scale(.8)}.stats{position:absolute;left:50%;bottom:-11px;transform:translateX(-50%);display:flex;gap:1px;z-index:4;pointer-events:none;box-shadow:0 2px 6px #0007;border-radius:3px;overflow:hidden;font:bold 12px monospace}.stats b{padding:3px 6px;background:#356890;color:#f2f7fc}.stats b.hp{background:#426758}.stats b.hurt{background:#aa4943}.pilot{position:absolute;left:6px;right:6px;top:21px;width:calc(100% - 12px);height:100%;border-radius:4px;border:1px solid #dbce89;object-fit:cover;transition:transform .2s}.link-tag{position:absolute;top:-13px;left:0;right:0;text-align:center;font:8px monospace;color:#ffe297}.status-tag{position:absolute;right:-7px;top:3px;background:#11263bee;padding:2px 4px;color:#e3bc71;font-size:8px;border:1px solid #526575;z-index:4}.base-zone{text-align:center;align-self:center}.zone-label{color:#718da6;font:8px monospace;letter-spacing:1.5px;margin-bottom:7px}.base-zone .unit-wrap{width:55px;margin:0 auto}.base-zone .empty-base{height:82px;border:1px dashed #728ba333;display:grid;place-content:center;font-size:9px;color:#7690a6}.pile{text-align:center;font-size:10px;color:#8299ae}.pile button{width:35px;height:48px;padding:0;background:repeating-linear-gradient(135deg,#284057 0 2px,#1a3046 2px 7px);border:1px solid #4d6680;font-size:13px}.pile small{display:block;margin-top:5px;font-size:8px}.command-bar{border-top:1px solid #a6c8df25;border-bottom:1px solid #a6c8df25;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 8px;background:#0f2033b5;z-index:3}.phase-readout{font-size:12px;font-weight:700}.phase-readout small{display:block;color:#91a9bf;font-size:9px;font-weight:400;margin-top:3px}.command-bar button{font-size:11px;padding:7px 12px}.turn-dot{display:inline-block;width:6px;height:6px;background:var(--blue);border-radius:50%;margin-right:7px;box-shadow:0 0 10px var(--blue)}.hand-zone{position:relative;display:flex;justify-content:center;align-items:end;isolation:isolate;overflow:visible}.hand-zone .hand-label{position:absolute;bottom:8px;left:0;color:#7289a1;font-size:9px;z-index:-1}.hand-card{position:absolute;bottom:-37px;width:115px;height:161px;transform:translateX(var(--x)) translateY(var(--y)) rotate(var(--r));transform-origin:50% 150%;transition:transform .22s,filter .2s;z-index:var(--z)}.hand-card .card{height:100%;width:100%}.hand-card:hover,.hand-card.selected{transform:translateX(var(--x)) translateY(-68px) rotate(0deg) scale(1.12);z-index:99}.hand-card.unusable:not(:hover){filter:saturate(.55) brightness(.7)}.hand-card.dealt{animation:drawIn .45s both}.hand-actions{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);display:flex;gap:3px;padding-bottom:7px;z-index:8;white-space:nowrap}.hand-actions button{font-size:10px;padding:7px 10px;background:#e4f2ff;color:#12324d}.inspector{background:#0c1725e8;border-left:1px solid var(--line);padding:16px 17px;overflow:auto;min-height:0}.inspector .eyebrow{font-size:9px}.inspector img.preview{width:100%;max-height:31vh;object-fit:contain;margin:13px 0 6px;border-radius:7px}.inspector h2{font-size:18px;margin:7px 0}.inspector .meta{font-size:10px;color:#8fa7c0;line-height:1.8}.inspector .effect{font-size:12px;line-height:1.95;margin:13px 0;color:#d5e4ee;white-space:pre-line}.inspector .hint{background:#19334a;border-left:2px solid var(--blue);padding:11px;font-size:11px;line-height:1.8;color:#a8c6dc}.inspector .placeholder{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:15px;color:#8ca4bb;font-size:12px;line-height:1.9}.inspector .placeholder img{width:65px;opacity:.6}.log-drawer{position:fixed;right:16px;bottom:14px;z-index:130;width:340px;max-width:92vw;background:#13263bf5;border:1px solid #52697c;border-radius:7px;box-shadow:0 8px 40px #0007}.log-drawer header{padding:11px 14px;display:flex;justify-content:space-between;align-items:center;font-size:12px}.log-drawer header button{padding:2px 8px;font-size:12px}.log-lines{max-height:280px;overflow:auto;padding:0 14px 14px;font-size:11px;line-height:1.8}.log-lines p{border-top:1px solid var(--line);padding-top:7px;margin:6px 0;color:#bbcbda}.drawer-toggle{position:fixed;right:17px;bottom:13px;z-index:100;font-size:10px;padding:6px 12px}.modal-scrim{position:fixed;inset:0;background:#040c16a3;backdrop-filter:blur(1px);z-index:160;display:flex;align-items:center;justify-content:center;padding:24px}.modal{width:min(780px,95vw);max-height:90dvh;overflow:auto;background:#152a40;border:1px solid #6f94b163;border-radius:12px;box-shadow:0 24px 80px #000a;padding:27px}.modal h2{font-size:23px;margin:8px 0 12px}.modal p{font-size:13px;color:#adc1d3;line-height:1.8}.modal-head{display:flex;align-items:start;justify-content:space-between;gap:20px}.modal-head button{padding:3px 9px;background:transparent}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.modal-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;margin:20px 0}.modal-cards .choice-card{width:110px;position:relative}.modal-cards .card{width:110px}.modal-cards .caption{font-size:10px;text-align:center;margin-top:8px;color:#a6bfd3}.modal-cards.opening .choice-card{animation:deal .4s both;animation-delay:calc(var(--i)*90ms)}.modal-cards .chosen{outline:3px solid var(--gold)}.choice-source{display:flex;gap:20px;align-items:center;border-top:1px solid var(--line);padding-top:14px}.choice-source img{width:70px;border-radius:4px}.choice-source p{font-size:12px}.deck-list{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:20px}.deck-list .card{width:100%}.deck-list .caption{font-size:10px;margin:8px 0;text-align:center}.rule-list{font-size:13px;line-height:2;color:#c1d2e1;padding-left:22px}.rule-list li{margin-bottom:12px}.payment-bar{position:absolute;left:12px;right:12px;bottom:165px;border:1px solid #e7ca72;padding:12px 16px;background:#243345f5;z-index:110;border-radius:6px;display:flex;align-items:center;justify-content:space-between;gap:10px;box-shadow:0 -10px 40px #0005;font-size:12px}.payment-bar small{display:block;font-size:10px;color:#e4d5a4;margin-top:5px}.payment-bar button{font-size:11px;padding:8px 12px}.payment-bar b{color:#ffe59a}.battle-board.paying .hud.player{position:relative;z-index:115;background:#293951;border-radius:5px;box-shadow:0 0 0 2px #e4cc76;padding:0 8px}.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#e7eff7;color:#152e44;border-radius:5px;padding:12px 20px;z-index:300;font-size:12px;box-shadow:0 6px 30px #0005}.turn-banner{position:fixed;top:37%;left:0;right:0;text-align:center;padding:25px;background:linear-gradient(90deg,transparent,#193850f5 25%,#193850f5 75%,transparent);color:#ecf6ff;border-top:1px solid #a2d8f65c;border-bottom:1px solid #a2d8f65c;z-index:260;animation:banner 1s both;pointer-events:none}.turn-banner b{font-size:30px;letter-spacing:9px}.turn-banner small{display:block;margin-top:7px;color:var(--blue);font-size:10px;letter-spacing:3px}.attack-svg{position:fixed;inset:0;width:100%;height:100%;z-index:250;pointer-events:none}.attack-svg path{stroke-dasharray:15 7;animation:beam .35s linear infinite;filter:drop-shadow(0 0 5px #74e1ff)}.attack-flash{position:fixed;border:2px solid #9eeaff;border-radius:50%;width:60px;height:60px;transform:translate(-50%,-50%);animation:hit .55s both;z-index:250;pointer-events:none}.flying-card{position:fixed;width:100px;height:140px;z-index:240;object-fit:cover;border-radius:5px;pointer-events:none;box-shadow:0 5px 25px #0009}.screen-reader{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@keyframes cardPulse{50%{border-color:#6cdbed;box-shadow:0 0 9px #62d7f52c}}@keyframes resourcePulse{50%{border-color:#ffe18c;box-shadow:0 0 8px #ffe18c88}}@keyframes targetPulse{50%{box-shadow:0 0 0 3px #ffaf9d,0 0 20px #ff7c6277}}@keyframes deal{from{opacity:0;transform:translate(150px,-40px) rotate(12deg)}to{opacity:1;transform:none}}@keyframes drawIn{from{opacity:0;translate:200px -130px}to{opacity:1;translate:0 0}}@keyframes banner{0%,100%{opacity:0;transform:scaleX(.9)}20%,75%{opacity:1;transform:none}}@keyframes beam{to{stroke-dashoffset:-44}}@keyframes hit{from{opacity:1;scale:.3}to{opacity:0;scale:2.2}}
@media(min-height:850px){.battle-board{grid-template-rows:70px minmax(130px,1fr) 52px minmax(130px,1fr) 68px 190px}.hand-card{width:135px;height:189px}.payment-bar{bottom:190px}.unit-wrap{max-width:115px}.slot{height:165px}}@media(max-width:1000px){.game-layout{grid-template-columns:minmax(0,1fr) 200px}.inspector{padding:12px}.battle-board{padding:6px 10px 0}.field{grid-template-columns:58px 1fr 35px;gap:6px}.slot{border:0}.unit-slots{gap:3px}.hud{gap:6px}.resource{width:18px;height:28px}.shield{width:19px;height:29px}.hud .identity{min-width:65px;font-size:10px}.hud .avatar{display:none}.deck-info{max-width:80%;padding:22px}.launch-options{gap:14px}}@media(max-width:740px){.topbar{padding:0 16px}.lobby-main{padding:25px 16px}.intro{display:block}.ready{display:inline-block;margin-top:14px}.deck-grid{grid-template-columns:1fr}.deck-tile{min-height:250px}.deck-info{max-width:72%}.launch{display:flex;flex-direction:column;align-items:stretch;padding:17px}.launch-options{flex-wrap:wrap}.lobby-foot{flex-direction:column}.notes{flex-wrap:wrap;gap:10px}.game-layout{display:block}.inspector{display:none}.game .topbar{padding:0 9px}.game .brand{font-size:11px}.game .topbar button{font-size:10px;padding:5px 7px}.battle-board{height:calc(100dvh - 48px);grid-template-rows:55px minmax(88px,1fr) 46px minmax(88px,1fr) 55px 132px;padding:4px 6px 0}.hud .identity{min-width:57px}.hud .deck-count{font-size:10px;margin:0 2px}.resource{width:13px;height:23px}.resources{gap:2px}.resource-title{font-size:8px;min-width:38px}.shield{width:12px;height:23px;font-size:8px}.hud .shield-group{gap:2px}.field{grid-template-columns:39px 1fr 27px;gap:4px}.base-zone .unit-wrap{width:35px}.pile button{width:25px;height:35px;font-size:10px}.unit-wrap{width:88%}.stats{font-size:9px;bottom:-9px}.stats b{padding:2px 3px}.card .ko-label{font-size:7px;min-height:17px;padding:2px}.hand-card{width:89px;height:125px;bottom:-20px}.hand-card:hover,.hand-card.selected{transform:translateX(var(--x)) translateY(-44px) rotate(0) scale(1.1)}.hand-actions button{font-size:9px;padding:6px}.command-bar{padding:3px}.phase-readout{font-size:10px}.phase-readout small{font-size:8px}.command-bar button{font-size:9px;padding:6px 8px}.modal{padding:19px}.modal-cards{gap:8px}.modal-cards .choice-card,.modal-cards .card{width:90px}.deck-list{grid-template-columns:repeat(3,1fr);gap:9px}.payment-bar{bottom:132px;padding:9px;font-size:10px}.payment-bar button{font-size:10px;padding:6px}.turn-banner b{font-size:24px}.status-tag{font-size:6px}.link-tag{font-size:6px}.lobby .topbar nav{gap:3px}.lobby .topbar nav button{font-size:10px;padding:6px 8px}}
.payment-bar{bottom:230px}.battle-board.paying .hand-card.selected{transform:translateX(var(--x)) translateY(-20px) rotate(0deg)}
@media(min-height:850px){.payment-bar{bottom:265px}}
@media(max-width:740px){.payment-bar{bottom:192px}.resources{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,20px);grid-auto-columns:12px;gap:2px}.resource{width:12px;height:20px;min-width:12px}.hud .identity,.hud .shield-group,.hud .deck-count{flex-shrink:0}.unit-slots{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));max-height:none;gap:6px}.slot{height:100%;min-height:0}.unit-wrap{max-width:65px;width:min(75%,65px)}.game .brand small{font-size:7px;letter-spacing:.4px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;animation-iteration-count:1!important}}