:root{font-family:-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:#f3f7ec;background:#12384b;font-synthesis:none;--navy:#102d42;--blue:#459bff;--mint:#3addbd;--gold:#ffdd66;--stageW:100vw}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}button,a,input{touch-action:manipulation}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid white;outline-offset:3px}button:disabled{cursor:wait;filter:saturate(.5);opacity:.65}button{border:0}a{color:inherit;text-decoration:none}#game{height:100dvh;width:100%;display:grid;grid-template-rows:52px minmax(0,1fr) auto;position:relative;overflow:hidden}.topbar{display:flex;align-items:center;gap:9px;padding:0 12px;background:#112e42;border-bottom:3px solid #071f30;z-index:2}.topbar .home{font-size:36px;line-height:44px;width:44px;text-align:center;flex:none}.small-title{font-size:17px;white-space:nowrap;letter-spacing:-1px}.topbar #round{margin-left:auto;font-size:12px;color:#d1e6e8;white-space:nowrap}#lives{color:#ff8f82;font-size:17px;letter-spacing:1px;white-space:nowrap}#sound{background:#24475a;width:44px;height:44px;border-radius:8px;font-size:18px;flex:none}#sound span{font-size:8px;display:block;line-height:9px}#arena-panel{min-height:0;display:flex;flex-direction:column;background:#66c8b4;position:relative}#command{background:#163d51;padding:9px 20px 8px;position:relative;z-index:1;border-bottom:4px solid #0d2a3f}.order-top{display:flex;justify-content:space-between;font-size:11px;font-weight:800;letter-spacing:.5px;color:#b9d7d6}#total{font-size:15px;color:#fff5c2}.ratio-order{display:flex;align-items:center;justify-content:center;gap:15px;height:42px;font-weight:900}.ratio-order strong{font-size:37px;vertical-align:middle;padding:0 8px}.lane-left{color:#8fc9ff}.lane-right{color:#80ffe0}.ratio-colon{font-size:28px;color:#e5eee7}#order-note{font-size:11px;text-align:center;margin:0;color:#c5dbda}#viewport{position:relative;min-height:0;flex:1;overflow:hidden}#arena{display:block;width:100%;height:100%;touch-action:none}.lane-tag{position:absolute;top:16%;font-size:10px;font-weight:800;letter-spacing:.3px;background:#173952e8;border:2px solid #83c6ff;border-radius:7px;padding:4px 8px;text-align:center;pointer-events:none;transform:translateX(-50%)}.lane-tag b{display:block;font-size:16px}.lane-tag.left{left:30%;color:#bce3ff}.lane-tag.right{left:70%;border-color:#63efc8;color:#8fffe3}.home-tag{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:800;color:#e9fff0;text-shadow:0 1px 3px #124340;white-space:nowrap;background:#1b4e4c99;padding:3px 9px;border-radius:5px}.home-tag span{color:#ffdf75}#battle-call{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:95%;text-align:center;font-size:30px;font-weight:1000;letter-spacing:-1px;text-shadow:0 3px 0 #143244,2px 0 0 #143244,-2px 0 0 #143244;pointer-events:none}#deployment{padding:10px 16px max(10px,env(safe-area-inset-bottom));background:linear-gradient(145deg,#193d52,#112e42);border-top:4px solid #092436;z-index:2}#progress{display:flex;gap:5px;margin-bottom:8px}#progress i{height:5px;background:#37566a;border-radius:1px;flex:1}#progress i.done{background:#ffdc62}#progress i.active{background:#effbf4}#feedback{min-height:37px;margin:0 0 5px}#feedback b{display:block;font-size:13px;color:#ffdf75;line-height:18px}#feedback span{display:block;font-size:11px;line-height:15px;color:#d2e6e6}.allocation{display:flex;justify-content:space-between;align-items:end}.count{display:flex;align-items:center;gap:8px}.count span{font-size:11px;font-weight:800}.count b{font-size:27px;line-height:32px}.count small{font-size:11px;margin-left:3px}.count.left{color:#93cbff}.count.right{color:#78ffe0}#split-wrap{position:relative;height:40px;margin:0 1px;touch-action:none}#split-track{height:15px;position:absolute;left:0;right:0;top:13px;background:#39d6b5;border:3px solid #082a3d;border-radius:8px;box-shadow:0 2px 0 #050f20;overflow:visible}#split-fill{position:absolute;left:0;top:0;bottom:0;width:50%;background:#469fff;border-radius:4px 0 0 4px}#split-handle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:43px;height:36px;display:grid;place-items:center;border-radius:8px;color:#193a51;background:#fff1bd;border:3px solid #143349;font-size:24px;box-shadow:0 3px 0 #082235}#split{opacity:0;position:absolute;width:100%;height:44px;left:0;top:0;margin:0;cursor:ew-resize;touch-action:none}.precision{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:7px}.precision button{min-width:75px;height:44px;border-radius:7px;background:#30566c;border:2px solid #08283b;font-weight:900;font-size:14px;box-shadow:0 2px 0 #061e2d}.precision button:active{transform:translateY(2px);box-shadow:none}.precision span{font-size:10px;color:#a4c4ce}.primary{display:flex;align-items:center;justify-content:center;gap:15px;width:100%;height:56px;background:linear-gradient(#ffe680,#ffcb46);color:#283a39;border:3px solid #08283b;border-radius:10px;font-size:23px;font-weight:1000;letter-spacing:-1px;box-shadow:0 4px 0 #061e2d;transition:transform .1s}.primary:active{transform:translateY(3px);box-shadow:0 1px 0 #061e2d}.primary small{font-size:11px;letter-spacing:0}.camp-record{display:flex;justify-content:space-between;font-size:9px;color:#8eafbe;margin-top:9px}.campaign-title{display:none}.overlay{position:absolute;inset:52px 0 0;z-index:5;display:flex;flex-direction:column;justify-content:space-between;align-items:center;pointer-events:auto;background:linear-gradient(180deg,#102e42ea 0%,#183b5140 32%,#14394805 53%,#123346ed 81%,#0e293cff 100%)}[hidden]{display:none!important}.title-head{text-align:center;padding-top:23px;transform:rotate(-3deg)}.eyebrow{display:inline-block;font-size:12px;font-weight:900;letter-spacing:2px;color:#b6f6e1}.title-head h1{font-weight:1000;font-size:clamp(54px,12vw,82px);letter-spacing:-5px;line-height:.96;margin:16px 0 12px;color:#fff1bd;-webkit-text-stroke:2px #153344;paint-order:stroke fill;text-shadow:0 5px 0 #d38539,0 9px 0 #123249}.title-head h1 em{font-style:normal;color:#ffe56e;font-size:1.27em}.title-head p{font-size:18px;font-weight:900;color:#eaffef;letter-spacing:-.7px}.title-bottom{text-align:center;width:min(350px,90vw);padding-bottom:25px}.title-bottom>p{font-size:14px;line-height:1.55;font-weight:700;margin:10px 0 16px}.title-bottom>span{display:block;font-size:10px;margin-top:16px;color:#a6c6cc}.title-bottom #load-note{font-size:10px;min-height:15px;margin:5px 0 0;color:#b8d4d6}.title-bottom .primary{height:64px}.result-box{text-align:center;margin:auto;padding:25px 20px;width:min(420px,94vw);border:3px solid #76dbc0;border-radius:18px;background:#153d52f5;box-shadow:0 12px 0 #071f3288}.result-box h2{font-size:40px;line-height:1.12;margin:16px 0;color:#ffe780;letter-spacing:-2px}.result-box p{font-size:15px;line-height:1.6;white-space:pre-line}.result-box #reward{margin:20px 0;font-size:14px;color:#8effdf;font-weight:800}.result-box>a{display:block;min-height:44px;line-height:44px;margin-top:10px;font-size:13px;color:#b9d6de}body.failed .result-box{border-color:#e7a897}body.failed .result-box h2{color:#ffc9a8}@media(min-width:900px){#game{grid-template-columns:minmax(0,1fr) 340px;grid-template-rows:62px minmax(0,1fr)}.topbar{grid-column:1/3;padding:0 25px;gap:17px}.small-title{font-size:22px}.topbar #round{font-size:15px}#lives{font-size:22px}#arena-panel{grid-column:1;grid-row:2}#command{padding:14px 32px 12px}.order-top{font-size:13px}.ratio-order{height:55px;font-size:19px}.ratio-order strong{font-size:48px}#order-note{font-size:13px}#deployment{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center;padding:25px;border-top:0;border-left:5px solid #0b293b}.campaign-title{display:block;margin-bottom:auto;padding:18px 0 22px}.campaign-title>span{font-size:11px;color:#71e0c5;letter-spacing:2px}.campaign-title b{display:block;font-size:26px;line-height:1.35;margin-top:15px;letter-spacing:-1.4px}.campaign-title p{font-size:13px;color:#b5ced4;line-height:1.7}#feedback{min-height:75px;margin:15px 0}#feedback b{font-size:18px;line-height:25px}#feedback span{font-size:13px;line-height:20px;margin-top:5px}.allocation{margin-top:10px}.count{display:block}.count b{display:block;font-size:43px;line-height:52px}.count.right{text-align:right}.count span{font-size:12px}#split-wrap{margin:12px 0}.precision{margin-bottom:28px}.precision button{height:48px;min-width:80px}.primary{height:67px;flex:none}.camp-record{margin-top:auto;padding-top:30px;font-size:11px}.lane-tag{font-size:12px;top:14%;padding:6px 12px}.lane-tag b{font-size:24px}.home-tag{bottom:18px;font-size:13px}.overlay{inset:62px 0 0;flex-direction:row;padding:0 7%;background:linear-gradient(90deg,#0e3045ed,#0e30451a 55%,#0c2c42ed)}.title-head{width:42%;padding-top:0}.title-head h1{font-size:clamp(75px,9vw,125px)}.title-head .eyebrow{font-size:15px}.title-head p{font-size:23px}.title-bottom{width:300px;padding-bottom:0;align-self:center}.title-bottom>p{font-size:18px}.title-bottom>span{font-size:11px}.result-box{width:420px}.home-tag{left:50%}}@media(max-width:360px){.topbar{gap:5px;padding:0 6px}.small-title{font-size:15px}.topbar #round{font-size:10px}#lives{font-size:14px}#deployment{padding-left:12px;padding-right:12px}#command{padding:6px 15px}.ratio-order{height:35px}.ratio-order strong{font-size:31px}#feedback b{font-size:12px}#feedback span{font-size:10px}.primary small{font-size:10px}}@media(max-height:700px) and (max-width:899px){#game{grid-template-rows:46px minmax(0,1fr) auto}.topbar{height:46px}#command{padding-top:5px;padding-bottom:5px}.ratio-order{height:34px}.ratio-order strong{font-size:30px}#deployment{padding-top:6px;padding-bottom:7px}#feedback{min-height:31px}.precision{margin-bottom:3px}.primary{height:48px}.camp-record{margin-top:5px}#progress{margin-bottom:4px}.overlay{top:46px}.title-head{padding-top:12px}.title-head h1{font-size:49px;margin:8px 0}.title-head p{margin:8px}.title-bottom{padding-bottom:12px}.title-bottom>p{font-size:12px;margin-bottom:8px}}

#intro{background-image:linear-gradient(180deg,#102e4270 0%,#102e4200 45%,#0d2c41ee 85%),url("./assets/title-keyart.png");background-size:cover;background-position:center center}@media(min-width:900px){#intro{background-image:linear-gradient(90deg,#123549a0,#12354900 55%,#102c43cc),url("./assets/title-keyart.png");background-position:center center}}

.lane-tag{top:auto;bottom:8%;}.lane-tag.left{left:25%}.lane-tag.right{left:75%}@media(min-width:900px){.lane-tag{top:auto;bottom:7%;}.lane-tag.left{left:34%}.lane-tag.right{left:66%}}

.guide #split-handle{animation:guide-pulse 1.4s ease-in-out infinite}.guide:after{content:"여기를 끌어 나누세요 ↓";position:absolute;bottom:35px;left:50%;transform:translateX(-50%);font-size:10px;font-weight:800;white-space:nowrap;background:#fff0bb;color:#19384e;padding:3px 7px;border-radius:5px;pointer-events:none}@keyframes guide-pulse{50%{box-shadow:0 0 0 7px #ffe59355,0 3px 0 #082235}}@media(prefers-reduced-motion:reduce){.guide #split-handle{animation:none}}

.arena-touch{position:absolute;z-index:3;width:46px;height:46px;border:4px solid #ffe593;background:#fff0bb22;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%)}
/* Arena second edition: the battlefield owns the screen; the console stays at the thumb. */
#game{grid-template-rows:44px minmax(0,1fr) auto}.topbar{height:44px;padding:0 8px;border-bottom:2px solid #081e2e;gap:8px;background:linear-gradient(#254255,#142d40)}.topbar .home,#sound{height:44px;line-height:44px}.topbar .home{width:30px;min-width:44px}.small-title{font-size:16px;letter-spacing:-.7px}#sound{line-height:normal;width:44px;border-radius:0;background:#ffffff0b}#arena-panel{display:block;background:#354d62}#viewport{width:100%;height:100%;overflow:hidden}#command{position:absolute;left:10px;right:10px;top:8px;z-index:2;padding:5px 12px 4px;display:grid;grid-template-columns:90px 1fr;grid-template-rows:34px 13px;border:2px solid #81918e;border-bottom:3px solid #061c2b;border-radius:3px;background:linear-gradient(100deg,#18354cef,#284650f0);box-shadow:0 3px 8px #071b3555}.order-top{display:flex;flex-direction:column;gap:1px;justify-content:center;font-size:9px;letter-spacing:0}#total{font-size:15px}.ratio-order{height:34px;gap:8px;font-size:12px;justify-content:flex-end}.ratio-order strong{font-size:31px;padding:0 4px}.ratio-colon{font-size:24px}#order-note{grid-column:1/3;font-size:9px;white-space:nowrap;color:#c8d8cf;text-align:center;line-height:13px}.lane-tag{bottom:7%;padding:2px 6px;font-size:9px;background:#163549da;border-radius:3px;border-width:1px;box-shadow:0 2px 0 #051b2a55}.lane-tag b{font-size:15px}.lane-tag.left{left:28%}.lane-tag.right{left:72%}.home-tag{bottom:8px;font-size:9px;padding:3px 7px;background:#122c43d9;border:1px solid #83937b;border-radius:2px}#battle-call{font-size:27px;top:42%;letter-spacing:-1.3px}#deployment{padding:6px 12px max(6px,env(safe-area-inset-bottom));border-top:4px solid #a9a991;background:linear-gradient(#304b5a,#152e43);box-shadow:inset 0 2px 0 #0a2334;display:block}#progress{height:3px;margin-bottom:5px;gap:4px}#progress i{height:3px}#feedback{min-height:31px;margin:0 0 3px}#feedback b{font-size:11px;line-height:15px}#feedback span{font-size:10px;line-height:13px}.allocation{height:25px;margin:0}.count{display:flex;align-items:center;gap:6px}.count b{font-size:24px;line-height:26px}.count span{font-size:10px}.count small{font-size:10px}#split-wrap{height:38px;margin:0 9px}#split-track{top:14px;height:13px;border-width:2px}#split-handle{width:44px;height:32px;font-size:22px;border-width:2px;border-radius:4px}#split{height:44px;top:-3px}.control-row{display:grid;grid-template-columns:64px 64px minmax(0,1fr);gap:8px;align-items:center}.precision{display:contents}.precision span{display:none}.precision button{min-width:0;width:64px;height:46px;border-radius:4px;font-size:12px;box-shadow:0 2px 0 #071b29;background:linear-gradient(#557084,#304b60);border:2px solid #162e42}.control-row .primary{height:48px;border-radius:5px;font-size:20px;gap:0;border-width:2px;box-shadow:0 3px 0 #071c2b}.control-row .primary small{display:none}.camp-record{font-size:8px;margin-top:6px;padding:0}.overlay{inset:44px 0 0}.guide:after{font-size:9px;bottom:32px;padding:2px 6px}.guide #split-handle{animation:guide-pulse 1.4s ease-in-out infinite}#intro{background-image:linear-gradient(180deg,#102e4270 0%,#102e4200 45%,#0d2c41ee 85%),url("./assets/title-keyart.png?v=2")}.arena-touch{pointer-events:none;position:absolute;width:32px;height:32px;border:3px solid #ffe5a0;border-radius:50%;z-index:4}
@media(min-width:900px){#game{grid-template-columns:minmax(0,1fr) 286px;grid-template-rows:44px minmax(0,1fr)}.topbar{grid-column:1/3;padding:0 18px;gap:14px}.small-title{font-size:20px}.topbar #round{font-size:13px}#lives{font-size:18px}#arena-panel{grid-column:1;grid-row:2}#command{left:28px;right:28px;top:15px;padding:8px 18px 5px;grid-template-columns:140px 1fr;grid-template-rows:37px 16px;max-width:none}.order-top{font-size:11px}#total{font-size:20px}.ratio-order{height:37px;font-size:16px;justify-content:center}.ratio-order strong{font-size:36px}#order-note{font-size:11px;line-height:16px}#deployment{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center;padding:20px 16px;border-top:0;border-left:4px solid #9fa591}.campaign-title{display:block;margin:0 0 auto;padding:25px 0 20px}.campaign-title>span{font-size:10px}.campaign-title b{font-size:24px;line-height:1.35;margin-top:13px}.campaign-title p{font-size:12px}.allocation{height:auto;margin-top:20px}.count{display:block}.count b{font-size:37px;line-height:43px}.count span{font-size:11px}#feedback{min-height:74px;margin-top:16px}#feedback b{font-size:16px;line-height:22px}#feedback span{font-size:12px;line-height:19px;margin-top:5px}#split-wrap{height:48px;margin:12px 9px}#split-track{top:17px}#split{top:0}.control-row{grid-template-columns:54px 54px minmax(0,1fr);gap:5px}.precision button{width:54px;height:48px;font-size:11px}.control-row .primary{height:50px;font-size:16px;letter-spacing:-1px}.camp-record{margin-top:auto;padding-top:35px;font-size:9px}.lane-tag{bottom:7%;font-size:10px;padding:4px 9px}.lane-tag b{font-size:20px}.lane-tag.left{left:34%}.lane-tag.right{left:66%}.home-tag{font-size:11px;bottom:16px}.overlay{inset:44px 0 0}.guide:after{bottom:38px}#intro{background-image:linear-gradient(90deg,#123549a0,#12354900 55%,#102c43cc),url("./assets/title-keyart.png?v=2")}}
@media(max-width:360px){.topbar{padding:0 3px;gap:4px}.small-title{font-size:14px}.topbar #round{font-size:10px}#command{left:7px;right:7px;padding:4px 9px;grid-template-columns:82px 1fr}.ratio-order{gap:5px;font-size:11px}.ratio-order strong{font-size:28px}#order-note{font-size:8px}#deployment{padding:5px 10px}#feedback b{font-size:10px}#feedback span{font-size:9px}.control-row{grid-template-columns:56px 56px minmax(0,1fr);gap:6px}.precision button{width:56px;font-size:11px}.control-row .primary{font-size:18px}.count span{font-size:9px}.lane-tag b{font-size:13px}.home-tag{font-size:8px}}
#intro{background-image:linear-gradient(180deg,#132b43b8,#132b431a 38%,#122b4360 58%,#102c43f5 88%)}body[data-phase="title"] #command{opacity:0}body[data-phase="title"] #deployment{visibility:hidden}.title-head{padding-top:17px}.title-head h1{font-size:clamp(54px,12vw,76px)}@media(min-width:900px){#intro{background-image:linear-gradient(90deg,#12314ccc,#12354900 53%,#102c43d9)}.title-head h1{font-size:clamp(80px,9vw,118px)}}
#feedback{min-height:39px}#feedback b{font-size:13px;line-height:18px}#feedback span{font-size:12px;line-height:16px}#command{grid-template-rows:34px 16px}#order-note{font-size:11px;line-height:16px}.precision button{font-size:12px}.camp-record{font-size:9px}@media(max-width:360px){#feedback b{font-size:12px;line-height:17px}#feedback span{font-size:11px;line-height:15px}#feedback{min-height:37px}#order-note{font-size:10px}.precision button{font-size:12px}}@media(min-width:900px){#feedback{min-height:74px}#feedback b{font-size:16px;line-height:22px}#feedback span{font-size:13px;line-height:19px}#order-note{font-size:12px}}
/* Revision 3: quiet metal rims and tabular army counts retain the console footprint. */
#command{box-shadow:inset 0 1px 0 #d9e4cf2b,0 3px 8px #071b3555}.precision button{box-shadow:inset 0 1px 0 #dce6e22b,0 2px 0 #071b29}.count b,.ratio-order strong{font-variant-numeric:tabular-nums}.control-row .primary{box-shadow:inset 0 1px 0 #fff6caa6,0 3px 0 #071c2b}.lane-tag{box-shadow:inset 0 1px 0 #cbdccb24,0 2px 0 #051b2a55}
