:root{font-family:Pretendard,Apple SD Gothic Neo,Inter,system-ui,sans-serif;color:#f8f1da;background:#0c1714;font-synthesis:none;--panel: rgba(14, 24, 20, .92);--line: rgba(218, 201, 137, .38);--gold: #f2d06d;--green: #9cc45b;--red: #ed7769}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:720px;min-height:480px;background:#0c1714}canvas{display:block}button{font:inherit}#orientation-lock{position:fixed;inset:0;z-index:20000;display:none;place-items:center;padding:24px;color:#f3edcf;background:radial-gradient(circle at center,#21392c,#07110d 70%)}#orientation-lock.visible{display:grid}.orientation-card{width:min(420px,88vw);text-align:center}.rotate-phone{width:54px;height:82px;margin:0 auto 22px;display:grid;place-items:center;border:3px solid #d8cb85;border-radius:10px;color:#d8cb85;font-size:42px;transform:rotate(90deg);animation:rotate-hint 1.8s ease-in-out infinite}.orientation-card strong{display:block;color:#eef1b8;font-size:23px}.orientation-card p{margin:12px 0 20px;color:#aebbb0;font-size:13px}.orientation-card button{min-width:170px;height:44px;border:1px solid #becf75;border-radius:9px;color:#fff5d0;background:#405b35;font-weight:800}@keyframes rotate-hint{0%,to{transform:rotate(90deg) scale(1)}50%{transform:rotate(75deg) scale(1.06)}}#loading-screen{--loading-progress: 0%;position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;background:#07100d94;opacity:1;transition:opacity .4s ease}#loading-screen:after{content:"";position:absolute;inset:0;background:#040b096b;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}#loading-screen.loading-complete{opacity:0;pointer-events:none}.loading-backdrop{position:absolute;inset:-28px;width:calc(100% + 56px);height:calc(100% + 56px);object-fit:cover;filter:blur(16px) saturate(.72) brightness(.52);transform:scale(1.08)}.loading-focus{position:relative;z-index:2;width:min(760px,78vw);text-align:center}.loading-focus img{display:block;width:100%;height:auto;filter:drop-shadow(0 14px 20px rgba(0,0,0,.48))}.loading-focus p{margin:4px 0 14px;color:#f3e8b9;font-size:15px;font-weight:800;letter-spacing:.06em;text-shadow:0 2px 5px #000}.loading-track{width:min(340px,52vw);height:7px;margin:0 auto;overflow:hidden;border-radius:99px;background:#030a07bf;box-shadow:0 0 0 1px #e1d39159}.loading-track span{display:block;width:var(--loading-progress);height:100%;border-radius:inherit;background:linear-gradient(90deg,#729a3f,#d8db72);transition:width .18s ease}kbd{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border:1px solid #b8a979;border-bottom-width:3px;border-radius:5px;color:#f8e9ae;background:#18251f;font:700 12px/1 monospace}.game-hud{position:fixed;inset:0;z-index:10;pointer-events:none;-webkit-user-select:none;user-select:none}.hud-top{position:absolute;inset:0 0 auto;min-height:64px;display:grid;grid-template-columns:190px 130px 1fr 90px;align-items:center;gap:12px;padding:9px 18px;background:linear-gradient(180deg,#070f0cf7,#0b1410e0);border-bottom:1px solid var(--line);box-shadow:0 8px 30px #0000003d}.hud-brand{color:#b9d675;font:900 18px/1.1 Georgia,serif;letter-spacing:.8px}.hud-resource{justify-self:start;padding:9px 13px;border:1px solid #766333;border-radius:10px;background:#231f13;color:var(--gold);font-weight:800}.hud-base-status{display:flex;justify-content:center;align-items:center;gap:18px;font-weight:800;font-size:14px}.hud-base-status .ally{color:#6ee0ad}.hud-base-status .enemy{color:#ff8d7e}.hud-base-status .versus{color:#e9dba8;opacity:.55;font-size:11px}.hud-time{justify-self:end;font:800 17px/1 monospace;color:#eadfb9}.hud-bottom{position:absolute;inset:auto 0 0;display:flex;justify-content:center;gap:12px;padding:10px 18px 14px;background:linear-gradient(0deg,#070f0cfa,#0c1612e3);border-top:1px solid var(--line)}.production-panel{display:grid;grid-template-columns:repeat(4,minmax(135px,176px));gap:8px;pointer-events:auto}.unit-button,.hud-action{position:relative;min-height:62px;color:#f5efd7;background:linear-gradient(180deg,#263b30,#18271f);border:1px solid #607151;border-radius:10px;cursor:pointer;transition:transform .12s,border-color .12s,filter .12s}.unit-button:hover:not(:disabled):not(.unavailable),.hud-action:hover{transform:translateY(-2px);border-color:#b6cf76;filter:brightness(1.12)}.unit-button:disabled{cursor:not-allowed;filter:grayscale(.55) brightness(.65)}.unit-button.unavailable{border-color:#4b5347;filter:grayscale(.55) brightness(.65)}.unit-button.unavailable:hover{filter:grayscale(.35) brightness(.78)}.unit-button{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:5px;padding:3px 7px 3px 3px;overflow:hidden}.unit-portrait{position:relative;display:none;width:58px;height:58px;overflow:hidden;align-self:end;pointer-events:none}.unit-portrait.visible{display:block}.unit-portrait img{position:absolute;top:0;left:0;width:288px;height:174px;max-width:none;object-fit:fill}.unit-key{position:absolute;z-index:2;top:5px;left:5px;width:21px;height:21px;display:grid;place-items:center;border-radius:5px;background:#0d1712e6;color:#e4cc73;font:800 12px monospace;box-shadow:0 1px 4px #00000073}.unit-details{min-width:0}.unit-name{display:block;margin:1px 0 3px;overflow:hidden;font-weight:800;font-size:14px;white-space:nowrap;text-overflow:ellipsis}.unit-cost{display:block;color:#d8c986;font-size:12px}.promotion-buttons{display:grid;grid-template-columns:repeat(2,94px);gap:8px;pointer-events:auto}.hud-action{padding:7px;font-size:14px;font-weight:800}.hud-action.special{border-color:#805e8c;background:linear-gradient(180deg,#45364d,#2a2230)}.hud-action kbd{margin-left:4px}.camera-controls{position:absolute;right:18px;top:82px;display:grid;grid-template-columns:repeat(2,42px);gap:5px;pointer-events:auto}.camera-controls button{width:42px;height:38px;border:1px solid rgba(238,222,168,.42);border-radius:8px;background:#0c1712d1;color:#f4e7bb;cursor:pointer}.camera-controls button:hover{background:#2f4b3bf5}.camera-controls .settings-button{grid-column:1 / -1;width:89px;font-size:12px}.hud-toast{position:absolute;top:78px;left:50%;transform:translate(-50%,-10px);opacity:0;max-width:min(620px,75vw);padding:10px 18px;border:1px solid #b9a565;border-radius:9px;background:#181d13ed;color:#ffe8a5;font-weight:750;text-align:center;transition:.2s}.hud-toast.visible{opacity:1;transform:translate(-50%)}.promotion-modal{position:absolute;inset:0;display:none;place-items:center;pointer-events:auto;background:#040907b8;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.promotion-modal.visible{display:grid}.promotion-card{position:relative;width:min(720px,88vw);padding:28px;border:1px solid #a18e57;border-radius:18px;background:linear-gradient(145deg,#192921,#101a15);box-shadow:0 24px 70px #0000008c}.promotion-card h2{margin:0;color:#d9e99f;font:900 28px Georgia,serif}.modal-help{margin:7px 0 20px;color:#aeb9a7;font-size:13px}.modal-close{position:absolute;right:15px;top:12px;border:0;background:none;color:#c9c4aa;font-size:30px;cursor:pointer}.promotion-options{display:grid;gap:10px;max-height:min(58vh,520px);overflow-y:auto}.promotion-option{display:grid;grid-template-columns:38px 150px 1fr 55px;align-items:center;gap:12px;min-height:66px;padding:10px 14px;text-align:left;border:1px solid #526c55;border-radius:10px;background:#1e3227;color:#f2ecd7;cursor:pointer}.promotion-option:hover:not(:disabled){border-color:#bdd57b;background:#294432}.promotion-option:disabled{opacity:.45;cursor:not-allowed}.promotion-option strong{color:#dce8ae}.promotion-option span{color:#b8c2b4;font-size:13px}.promotion-option em{color:var(--gold);font-style:normal;font-weight:800;text-align:right}.empty-options{color:#aeb9a7;text-align:center;padding:25px}.settings-modal{position:fixed;inset:0;z-index:10000;display:none;place-items:center;padding:24px;background:#030907b8;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.settings-modal.visible{display:grid}.settings-card{position:relative;width:min(460px,90vw);padding:30px;border:1px solid #a9995f;border-radius:18px;background:linear-gradient(145deg,#1c3026,#0e1914);box-shadow:0 25px 80px #0000009e,inset 0 1px #ffffff14}.settings-card h2{margin:2px 0 26px;color:#eef1bb;font:900 30px/1 Georgia,serif}.settings-kicker{margin:0;color:#8fa471;font:800 10px/1 monospace;letter-spacing:.15em}.settings-close{position:absolute;top:12px;right:15px;border:0;background:none;color:#d9d3b6;font-size:30px;cursor:pointer}.volume-setting{display:block;padding:18px;border:1px solid rgba(174,190,126,.28);border-radius:12px;background:#050d0a61}.volume-setting>span{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.volume-setting strong{color:#f1ecd2;font-size:15px}.volume-setting output{min-width:52px;color:#e8ce6c;font-weight:900;text-align:right}.volume-setting input{width:100%;accent-color:#aaca65;cursor:pointer}.volume-setting small{display:block;margin-top:10px;color:#8f9b91;font-size:11px}.auth-screen{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;padding:24px;background:#0309077a;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.auth-card{width:min(430px,88vw);padding:34px;border:1px solid #ad9b60;border-radius:20px;background:linear-gradient(145deg,#1c3026fa,#0a130ffc);box-shadow:0 28px 90px #000000ad,inset 0 1px #ffffff14}.auth-kicker{margin:0 0 7px;color:#91a772;font:800 10px/1 monospace;letter-spacing:.16em}.auth-card h1{margin:0;color:#eff2bd;font:900 31px/1.1 Georgia,Pretendard,serif}.auth-description{margin:10px 0 22px;color:#acb7aa;font-size:13px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:20px;padding:4px;border:1px solid rgba(169,153,95,.3);border-radius:10px;background:#030a076b}.auth-tabs button{height:38px;border:0;border-radius:7px;color:#9fa99f;background:transparent;font-weight:800;cursor:pointer}.auth-tabs button.active{color:#fff2bd;background:#314c3b;box-shadow:inset 0 0 0 1px #c5d78459}.auth-form{display:grid;gap:14px}.auth-form label{display:grid;gap:7px}.auth-form label span{color:#ded8ba;font-size:13px;font-weight:800}.auth-form input{width:100%;height:46px;padding:0 13px;border:1px solid #536a57;border-radius:9px;outline:none;color:#f6f1da;background:#0c1813;font-size:15px}.auth-form input:focus{border-color:#bad174;box-shadow:0 0 0 3px #aac8661f}.auth-form input:disabled{opacity:.6}.auth-status{min-height:19px;margin:0;color:#cbdc9c;font-size:12px;line-height:1.45}.auth-status.error{color:#ff9e8d}.auth-submit{height:49px;border:1px solid #c4d77b;border-radius:10px;color:#fff7d5;background:linear-gradient(180deg,#527039,#344c2b);font-weight:900;cursor:pointer}.auth-submit:hover:not(:disabled){filter:brightness(1.12);transform:translateY(-1px)}.auth-submit:disabled{opacity:.62;cursor:wait}.auth-card>small{display:block;margin-top:17px;color:#7f8c83;font-size:10px;text-align:center}.home-chat{position:fixed;z-index:120;top:76px;right:18px;bottom:28px;width:clamp(290px,31vw,390px);display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr) auto auto;overflow:hidden;border:1px solid rgba(193,177,111,.62);border-radius:16px;color:#eee9d3;background:linear-gradient(160deg,#14251df7,#08120efa);box-shadow:0 18px 55px #00000085,inset 0 1px #ffffff0f}.home-chat>header{display:flex;justify-content:space-between;align-items:center;padding:14px 15px 8px}.home-chat>header strong{color:#edf0b8;font:900 17px/1 Georgia,Pretendard,serif}.chat-live{padding:4px 7px;border:1px solid rgba(141,208,123,.35);border-radius:99px;color:#a8e392;background:#33693147;font:800 9px/1 monospace;letter-spacing:.08em}.chat-toggle{display:none;width:30px;height:28px;padding:0;border:1px solid #718160;border-radius:7px;color:#ece3b6;background:#263c30;cursor:pointer}.chat-description{margin:0;padding:0 15px 11px;border-bottom:1px solid rgba(201,188,130,.18);color:#b8c3b5;font-size:11px}.chat-announcement{margin:8px 10px 0;padding:9px 10px;border:1px solid rgba(240,192,69,.7);border-radius:9px;background:linear-gradient(135deg,#63420eeb,#312713f0);box-shadow:inset 3px 0 #f0c34e}.chat-announcement>div{display:flex;align-items:center;gap:6px}.chat-announcement span{padding:2px 5px;border-radius:4px;color:#392606;background:#f1c957;font:950 8px/1 monospace}.chat-announcement strong{color:#ffe69a;font-size:10px}.chat-announcement time{margin-left:auto;color:#a99568;font:9px/1 monospace}.chat-announcement p{margin:6px 0 0;color:#fff4c9;font-size:12px;font-weight:750;line-height:1.4;overflow-wrap:anywhere;white-space:pre-wrap}.chat-announcement-form{display:grid;grid-template-columns:minmax(0,1fr) 42px 42px;gap:4px;padding:7px 10px 0}.chat-announcement-form input{min-width:0;height:30px;padding:0 8px;border:1px solid #8c7131;border-radius:6px;outline:0;color:#fff1b7;background:#17130a;font-size:10px}.chat-announcement-form button{height:30px;padding:0;border:1px solid #b89134;border-radius:6px;color:#fff0b6;background:#5b431b;font-size:9px;font-weight:900;cursor:pointer}.chat-announcement-form button:last-child{border-color:#665f4c;color:#c9c1a8;background:#282820}.chat-announcement-form :disabled{opacity:.55;cursor:wait}.chat-messages{min-height:0;overflow-y:auto;padding:10px;scrollbar-width:thin;scrollbar-color:#607151 transparent}.chat-empty{margin:30px 15px;color:#849187;font-size:12px;line-height:1.6;text-align:center}.chat-message{margin:0 0 8px;padding:8px 9px;border:1px solid rgba(129,148,116,.18);border-radius:9px;background:#112119b8}.chat-message.mine{border-color:#b9cf7161;background:#334927ad}.chat-message.featured{border-color:#f2c553b8;background:linear-gradient(135deg,#5b4114c7,#2d2b18d1);box-shadow:inset 3px 0 #e7bd4f,0 0 14px #e2b53d1a}.chat-message>div{display:flex;justify-content:space-between;gap:8px;align-items:center}.chat-message strong{overflow:hidden;color:#dce8ae;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.chat-message.featured strong{color:#ffe28a;font-weight:950}.chat-message.featured strong:after{content:attr(data-badge);margin-left:6px;padding:2px 4px;border:1px solid rgba(255,221,112,.5);border-radius:4px;color:#ffe8a3;background:#5f3d0aa6;font:800 7px/1 monospace;vertical-align:1px}.chat-message time{flex:none;color:#78867c;font:10px/1 monospace}.chat-message p{margin:5px 0 0;color:#ebe8d7;font-size:12px;line-height:1.45;overflow-wrap:anywhere;white-space:pre-wrap}.chat-message.featured p{color:#fff3c7;font-weight:700}.chat-status{min-height:16px;margin:0;padding:0 11px 4px;color:#e09b87;font-size:10px}.chat-form{display:grid;grid-template-columns:minmax(0,1fr) 58px;gap:6px;padding:8px 10px 10px;border-top:1px solid rgba(201,188,130,.18)}.chat-form input{min-width:0;height:36px;padding:0 10px;border:1px solid #4f6554;border-radius:8px;outline:0;color:#f1eedb;background:#0a1611;font-size:12px}.chat-form input:focus{border-color:#acc86c;box-shadow:0 0 0 2px #a9c8671a}.chat-form button{height:36px;border:1px solid #a9bf6b;border-radius:8px;color:#fff4cd;background:#3d5834;font-size:12px;font-weight:800;cursor:pointer}.chat-form button:hover:not(:disabled){filter:brightness(1.14)}.chat-form button:disabled,.chat-form input:disabled{opacity:.58}.online-lobby-screen{position:fixed;inset:0;z-index:8500;display:grid;place-items:center;padding:24px;background:#03090757;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.online-lobby-card{position:relative;width:min(620px,90vw);min-height:500px;padding:34px 42px 30px;overflow:hidden;border:1px solid #ad9b60;border-radius:22px;text-align:center;background:linear-gradient(145deg,#1d3227fa,#09130efc);box-shadow:0 28px 90px #000000ad,inset 0 1px #ffffff14}.online-back{position:absolute;top:18px;left:18px;height:34px;padding:0 11px;border:1px solid rgba(187,175,119,.42);border-radius:8px;color:#d9d2b0;background:#08120d8c;font-size:11px;font-weight:800;cursor:pointer}.online-back:hover:not(:disabled){color:#fff4c8;border-color:#b9ce76}.online-kicker{margin:4px 0 7px;color:#a4bd72;font:800 10px/1 monospace;letter-spacing:.18em}.online-lobby-card h1{margin:0;color:#eff2bd;font:900 32px/1.1 Georgia,Pretendard,serif}.online-description{margin:10px auto 22px;color:#acb7aa;font-size:13px}.online-tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:22px;padding:4px;border:1px solid rgba(169,153,95,.3);border-radius:11px;background:#030a076b}.online-tabs button{height:42px;border:0;border-radius:8px;color:#9fa99f;background:transparent;font-weight:800;cursor:pointer}.online-tabs button.active{color:#fff2bd;background:#314c3b;box-shadow:inset 0 0 0 1px #c5d78459}.online-view{display:grid;justify-items:center;min-height:260px;align-content:center;padding:22px;border:1px solid rgba(144,164,111,.24);border-radius:15px;background:#050d094d}.online-mode-icon{color:#d9cd77;font:38px/1 Georgia,serif;text-shadow:0 5px 18px rgba(218,198,99,.24)}.online-view h2{margin:13px 0 5px;color:#edf0c2;font-size:22px}.online-view p{max-width:390px;margin:0 0 20px;color:#9eaa9f;font-size:12px;line-height:1.55}.online-view input{width:min(270px,90%);height:56px;margin:0 0 12px;border:1px solid #6d795a;border-radius:10px;outline:0;color:#fff0aa;background:#08140f;font:900 25px/1 monospace;letter-spacing:.28em;text-align:center;text-transform:uppercase}.online-view input:focus{border-color:#c1d378;box-shadow:0 0 0 3px #aec96a1f}.online-primary,.online-secondary{min-width:190px;height:48px;border-radius:10px;font-weight:900;cursor:pointer}.online-primary{border:1px solid #c4d77b;color:#fff7d5;background:linear-gradient(180deg,#527039,#344c2b)}.online-secondary{border:1px solid #877c59;color:#dcd4b8;background:#26372e}.online-primary:hover:not(:disabled),.online-secondary:hover:not(:disabled){filter:brightness(1.14);transform:translateY(-1px)}.online-lobby-card button:disabled,.online-lobby-card input:disabled{opacity:.58;cursor:wait}.online-status{min-height:19px;margin:13px 0 0;color:#cbdc9c;font-size:12px}.online-status.error{color:#ff9e8d}.online-room{min-height:305px;padding:18px 24px;border:1px solid rgba(170,188,117,.28);border-radius:15px;background:#040c0861}.room-role{margin:0 0 13px;color:#a8b7a8;font-size:12px}.room-code-label{display:block;color:#839083;font-size:9px;font-weight:900;letter-spacing:.14em}.room-code{margin:4px 0 18px;padding:3px 12px 5px;border:0;color:#f7dc78;background:transparent;font:900 34px/1 monospace;letter-spacing:.18em;cursor:copy}.room-players{display:grid;grid-template-columns:1fr 42px 1fr;align-items:center;gap:9px}.room-players>div{display:grid;min-height:92px;align-content:center;padding:10px;border:1px solid #526958;border-radius:11px;background:#182b21}.room-players>div:last-child{border-style:dashed;opacity:.72}.online-room.room-full .room-players>div:last-child{border-style:solid;border-color:#a6c66c;opacity:1}.room-players span{color:#d4bd63;font:900 10px/1 monospace}.room-players strong{margin:7px 0 4px;overflow:hidden;color:#f0edd2;font-size:15px;text-overflow:ellipsis}.room-players small{color:#8d9a8e;font-size:10px}.room-players b{color:#d5c889;font:900 14px/1 Georgia,serif}.room-waiting{min-height:18px;margin:15px 0;color:#aebb9f;font-size:11px}.online-room.room-full .room-waiting{color:#cce596}.hidden{display:none!important}@media(max-width:980px){.hud-top{grid-template-columns:150px 105px 1fr 65px;padding-inline:10px}.hud-brand{font-size:14px}.hud-base-status{gap:8px;font-size:12px}.production-panel{grid-template-columns:repeat(4,minmax(105px,1fr))}.promotion-buttons{grid-template-columns:82px}.unit-name{font-size:12px}}@media(max-height:620px){.hud-top{min-height:52px;padding-block:5px}.hud-bottom{padding-block:6px}.unit-button,.hud-action{min-height:50px}.unit-portrait{width:48px;height:48px}.unit-portrait img{width:238px;height:144px}.unit-button{grid-template-columns:48px minmax(0,1fr)}.camera-controls{top:62px}.hud-toast{top:60px}.home-chat{top:58px;bottom:14px}.home-chat>header{padding-block:10px 6px}}.mobile-device body{min-width:0;min-height:0;touch-action:none;overscroll-behavior:none}.mobile-device canvas{touch-action:none}@media(max-height:450px)and (orientation:landscape){.auth-screen{padding:8px}.auth-card{width:min(430px,80vw);padding:15px 22px;border-radius:14px}.auth-kicker{margin-bottom:3px}.auth-card h1{font-size:23px}.auth-description{margin:4px 0 9px;font-size:11px}.auth-tabs{margin-bottom:9px;padding:3px}.auth-tabs button{height:30px}.auth-form{grid-template-columns:1fr 1fr;gap:7px 10px}.auth-form label{gap:3px}.auth-form label span{font-size:10px}.auth-form input{height:36px;font-size:12px}.auth-status{grid-column:1 / -1;min-height:16px;font-size:10px}.auth-submit{grid-column:1 / -1;height:37px}.auth-card>small{display:none}.settings-card{max-height:90vh;padding:18px}.settings-card h2{margin-bottom:12px;font-size:24px}.volume-setting{padding:11px}.mobile-device .home-chat{top:auto;right:10px;bottom:9px;width:278px;height:43px;display:block;border-radius:11px;transition:height .18s ease}.mobile-device .home-chat.expanded{top:48px;bottom:9px;height:auto;display:grid}.mobile-device .home-chat>header{height:42px;padding:7px 9px}.mobile-device .home-chat>header strong{font-size:14px}.mobile-device .home-chat:not(.expanded)>:not(header){display:none}.mobile-device .chat-live{margin-left:auto;margin-right:6px}.mobile-device .chat-toggle{display:block}.mobile-device .hud-top{min-height:45px;grid-template-columns:82px minmax(0,1fr) 48px;gap:5px;padding:4px 7px}.mobile-device .hud-brand{display:none}.mobile-device .hud-resource{padding:6px 7px;font-size:11px}.mobile-device .hud-base-status{gap:4px;font-size:9px}.mobile-device .hud-base-status .versus{font-size:8px}.mobile-device .hud-time{font-size:12px}.mobile-device .hud-bottom{align-items:center;gap:4px;padding:3px 4px 4px}.mobile-device .production-panel{flex:0 0 auto;grid-template-columns:repeat(4,48px);gap:3px}.mobile-device .promotion-buttons{flex:0 0 auto;grid-template-columns:repeat(2,46px);gap:3px}.mobile-device .unit-button,.mobile-device .hud-action{width:48px;min-height:46px;height:46px;border-radius:6px}.mobile-device .unit-button{display:block;padding:0}.mobile-device .unit-portrait{position:absolute;top:0;left:50%;width:44px;height:35px;transform:translate(-50%)}.mobile-device .unit-portrait img{top:-11px;width:228px;height:138px}.mobile-device .unit-key,.mobile-device .unit-name{display:none}.mobile-device .unit-details{position:absolute;z-index:2;right:0;bottom:0;left:0;min-height:14px;display:grid;place-items:center;background:#070f0ce0}.mobile-device .unit-cost{color:#f4d96f;font-size:9px;font-weight:900;line-height:14px;white-space:nowrap}.mobile-device .hud-action{width:46px;padding:2px;font-size:8px}.mobile-device .hud-action kbd{min-width:14px;height:15px;padding:0 2px;font-size:7px}.mobile-device .camera-controls{top:50px;right:6px;grid-template-columns:repeat(2,32px);gap:3px}.mobile-device .camera-controls button{width:32px;height:29px;border-radius:6px}.mobile-device .camera-controls .settings-button{width:67px;font-size:9px}.mobile-device .hud-toast{top:48px;max-width:64vw;padding:6px 10px;font-size:10px}.mobile-device .promotion-card{width:min(600px,92vw);max-height:88vh;overflow-y:auto;padding:16px}.mobile-device .promotion-card h2{font-size:20px}.mobile-device .modal-help{margin:4px 0 8px;font-size:10px}.mobile-device .promotion-options{gap:5px}.mobile-device .promotion-option{min-height:43px;grid-template-columns:27px 105px 1fr 43px;gap:6px;padding:5px 8px;font-size:10px}.mobile-device .promotion-option span{font-size:9px}.mobile-device .online-lobby-screen{padding:7px}.mobile-device .online-lobby-card{width:min(690px,94vw);min-height:0;height:94vh;padding:15px 30px 10px}.mobile-device .online-back{top:9px;left:10px;height:28px;font-size:9px}.mobile-device .online-kicker{margin:0 0 3px;font-size:8px}.mobile-device .online-lobby-card h1{font-size:23px}.mobile-device .online-description{margin:3px auto 7px;font-size:10px}.mobile-device .online-tabs{width:70%;margin:0 auto 7px}.mobile-device .online-tabs button{height:31px;font-size:11px}.mobile-device .online-view{min-height:210px;padding:8px}.mobile-device .online-mode-icon{font-size:25px}.mobile-device .online-view h2{margin:5px 0 2px;font-size:17px}.mobile-device .online-view p{margin-bottom:7px;font-size:9px}.mobile-device .online-view input{height:39px;margin-bottom:6px;font-size:18px}.mobile-device .online-primary,.mobile-device .online-secondary{min-width:150px;height:34px;font-size:10px}.mobile-device .online-room{min-height:0;padding:7px 18px}.mobile-device .room-role{margin-bottom:3px;font-size:9px}.mobile-device .room-code{margin:1px 0 4px;font-size:24px}.mobile-device .room-players>div{min-height:55px;padding:4px}.mobile-device .room-players strong{margin:3px 0 1px;font-size:11px}.mobile-device .room-waiting{margin:5px 0;font-size:9px}.mobile-device .online-status{margin-top:4px;font-size:9px}}