.online-match{position:fixed;inset:0;z-index:60;display:grid;grid-template-rows:47px minmax(0,1fr);background:#080d18;color:#e7d7d2;overflow:hidden;isolation:isolate}.online-match button{touch-action:manipulation}.online-match-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 14px;border-bottom:1px solid #9c7d8366;background:#0c1320}.online-match-bar>div{min-width:0}.online-match-bar span{display:block;font:7px var(--mono,monospace);letter-spacing:1.2px;color:#c598ab}.online-match-bar strong{display:block;font:9px var(--mono,monospace);margin-top:4px;color:#a4cbbf}.online-match-bar>button{min-height:34px;padding:7px 12px;border:1px solid #9b91a34f;color:#ddd0d5;font:9px var(--mono,monospace);white-space:nowrap}.online-boards{display:grid;min-height:0;overflow:hidden}.is-pvp .online-boards{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2px;background:#a17d8055}.online-local,.online-opponent{position:relative;min-width:0;min-height:0;overflow:hidden;background:#11172a;contain:layout paint}.online-local-mount{position:absolute;inset:0}.online-board-label{position:absolute;left:12px;top:70px;z-index:7;display:flex;gap:10px;pointer-events:none;font:7px var(--mono,monospace);letter-spacing:.8px}.online-board-label b{color:#a3d9ca}.online-board-label span{color:#a6a9bd}.online-opponent>canvas{display:block;width:100%;height:100%;pointer-events:none}.online-opponent>header{position:absolute;z-index:3;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;padding:12px 14px;background:#0b1325ed;border:1px solid #bf8b9b66;pointer-events:none}.online-opponent header span{font:7px var(--mono,monospace);letter-spacing:.9px;color:#c397ab;display:block}.online-opponent header strong{display:block;font:13px var(--mono,monospace);margin-top:6px;color:#e3d4d4}.online-opponent header b{display:block;color:#e8d6ae;font:24px var(--mono,monospace);text-align:right}.online-opponent header small{display:block;margin-top:4px;font:8px var(--mono,monospace);color:#af9cae}.online-opponent>footer{position:absolute;bottom:10px;left:12px;right:12px;display:flex;justify-content:space-between;font:9px var(--mono,monospace);color:#b9bdcd;background:#0c1421df;padding:8px 10px;pointer-events:none}.online-match .war-pause,.online-match [data-war=speed],.online-match [data-war=begin],.online-match .war-warmup{display:none!important}.online-match .war-stage{position:absolute;inset:0}.online-match .war-hud{top:10px;left:10px;right:10px;max-width:none;padding:9px 11px;gap:12px;background:#0b1325eb}.online-match .war-hud .war-stat{min-width:0}.online-match .war-menu{width:30px;height:30px}.online-match .heart-readout{width:132px;min-width:84px}.online-match .heart-readout>span{font-size:6px}.online-match .heart-readout strong{font-size:21px}.online-match .war-stat>span{font-size:6px}.online-match .war-stat>strong{font-size:19px}.online-match .resource-stat{display:block}.online-match .war-overview{top:92px;right:10px;width:135px}.online-match .war-overview>div:first-child{padding:7px}.online-match .war-overview>div:first-child>span{font-size:5px}.online-match .route-alerts{top:91px;left:10px}.online-match .route-alerts button{min-width:105px;min-height:30px;padding:6px}.online-match .route-alerts button>span{font-size:5px}.online-match .route-alerts button>b{font-size:9px}.online-match .war-boss{top:213px;max-width:calc(100% - 30px);width:360px}.online-match .war-level{bottom:110px;width:130px}.online-match .war-fortify{left:10px;bottom:12px;width:66px;height:73px}.online-match .war-skills{right:10px;bottom:12px;max-width:calc(100% - 92px);padding:6px}.online-match .skill-key{width:44px;min-width:0;height:61px}.online-match .skill-key svg{width:22px;height:22px}.online-match .skill-key>b,.online-match .skill-key>small{font-size:7px}.online-match .skill-dock-buttons{gap:4px}.online-match .skill-dock-label{font-size:5px;letter-spacing:.6px;padding-bottom:6px;gap:10px}.online-match .skill-dock-label>span{font-size:4px}.online-match .war-aim{left:10px;right:10px;bottom:110px;max-width:none;width:auto;padding:12px}.online-match .war-aim>p{font-size:11px;margin:9px 0}.online-match .aim-heading h3{font-size:18px}.online-match .aim-action>button{min-height:40px}.online-match .war-instruction{display:none}.online-match .war-context{max-width:calc(100% - 20px);padding:15px;top:auto!important;bottom:110px!important;left:10px!important;right:10px!important;width:auto!important;max-height:calc(100% - 180px)!important}.online-match .war-context .context-top{top:-15px}.online-match .war-operation{font-size:6px;bottom:96px;left:10px}.online-match .war-lesson{max-width:calc(100% - 24px)}.online-match .war-cutin{height:80px}.online-match .war-cutin b{font-size:21px}.online-match .war-log{top:190px;max-width:calc(100% - 25px);font-size:8px}.online-ownership{position:absolute;z-index:7;left:10px;bottom:145px;display:grid;gap:6px;font:7px var(--mono,monospace);pointer-events:none}.online-ownership[hidden]{display:none}.online-ownership span{background:#0b1423d9;padding:5px 7px;color:#7f9eaf}.online-ownership b{color:#d5c0cb;margin-left:7px;font-weight:400}.online-partner-note{font:10px/1.6 var(--mono,monospace);color:#a8cabc;border-top:1px solid #92bfb533;padding-top:9px}.online-match-message{position:absolute;z-index:30;top:52px;left:50%;transform:translateX(-50%);width:min(450px,calc(100% - 24px));padding:12px 15px;background:#162437f5;border:1px solid #9ab5c27c;font:11px/1.6 var(--mono,monospace);text-align:center}.online-match-message[hidden],.online-match-dialog[hidden]{display:none!important}.online-match-dialog{position:absolute;z-index:40;top:50%;left:50%;transform:translate(-50%,-50%);width:min(460px,calc(100% - 26px));max-height:calc(100% - 40px);overflow:auto;padding:25px;background:#101a2df8;border:1px solid #b998a1;box-shadow:0 15px 50px #0008}.online-match-dialog>span{font:8px var(--mono,monospace);letter-spacing:1px;color:#cfa4b7}.online-match-dialog h2{font-size:29px;font-weight:400;margin:16px 0;color:#eddbd7}.online-match-dialog p{font:12px/1.8 var(--mono,monospace);color:#a9b7cb}.online-match-dialog>div{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}.online-match-dialog button{min-height:44px;padding:10px 15px;border:1px solid #b68da36b;background:#273046;color:#e9d8de;font:11px var(--mono,monospace)}.online-match.link-stale .online-match-bar strong{color:#edb5a1}.online-match[data-interactive=false] .online-local-mount canvas{cursor:progress}
@media(max-width:1100px){.online-match .kills-stat{display:none}.online-match .heart-readout{width:110px}.online-match .war-hud{gap:9px}.online-match .war-stat>strong{font-size:16px}.online-match .heart-readout strong{font-size:18px}.online-match .war-level{display:none}.online-match .war-aim .aim-heading>svg{width:24px}.online-match .war-overview{width:108px}.online-match .war-overview>div:first-child>span{font-size:4px}.online-match .war-overview>div:first-child>b{font-size:5px}.online-match .war-context h2{font-size:23px}}
@media(max-width:650px) and (orientation:portrait){.online-match{grid-template-rows:49px minmax(0,1fr)}.is-pvp .online-boards{grid-template-columns:1fr;grid-template-rows:minmax(0,7fr) minmax(145px,3fr)}.online-match-bar{padding:7px 9px;gap:5px}.online-match-bar span{font-size:6px;letter-spacing:.5px}.online-match-bar strong{font-size:7px}.online-match-bar>button{padding:7px;min-height:36px;font-size:8px}.online-match .war-hud{top:7px;left:7px;right:7px;gap:8px;padding:7px}.online-match .war-menu{height:29px;width:27px;min-width:27px}.online-match .heart-readout{width:113px}.online-match .heart-readout>span{font-size:5px}.online-match .heart-readout strong{font-size:17px}.online-match .war-stat>span{font-size:5px}.online-match .war-stat>strong{font-size:15px}.online-match .war-hud .resource-stat{display:block}.online-board-label{top:63px;left:9px;font-size:6px}.online-match .route-alerts{left:7px;top:81px;gap:3px}.online-match .route-alerts button{min-width:90px;min-height:25px;padding:5px}.online-match .route-alerts button>span{font-size:4px}.online-match .war-overview{right:7px;top:81px;width:102px}.online-match .war-boss{top:171px;padding:8px}.online-match .war-boss>span{font-size:6px}.online-match .war-fortify{left:7px;bottom:8px;width:58px;height:68px}.online-match .war-skills{right:7px;bottom:8px;max-width:calc(100% - 77px);padding:5px}.online-match .skill-key{width:41px;height:57px;padding:5px 2px}.online-match .skill-key svg{width:19px;height:19px}.online-match .skill-key>b,.online-match .skill-key>small{font-size:6px}.online-match .skill-dock-buttons{gap:3px}.online-match .war-aim{left:7px;right:7px;bottom:91px;padding:10px}.online-match .aim-heading h3{font-size:17px}.online-match .war-aim>p{font-size:10px;line-height:1.5}.online-match .war-context{bottom:90px!important;max-height:calc(100% - 163px)!important}.online-match .war-operation{bottom:81px;font-size:5px}.online-ownership{bottom:120px;left:7px;font-size:6px;gap:4px}.online-opponent>header{top:7px;left:7px;right:7px;padding:7px 10px}.online-opponent header span{font-size:6px}.online-opponent header strong{font-size:9px;margin-top:4px}.online-opponent header b{font-size:17px}.online-opponent header small{font-size:6px}.online-opponent>footer{bottom:7px;left:7px;right:7px;font-size:7px;padding:6px 8px}.online-match-dialog{padding:20px}.online-match-dialog h2{font-size:25px}.online-match-dialog p{font-size:11px}}
@media(max-height:480px) and (orientation:landscape){.online-match{grid-template-rows:39px minmax(0,1fr)}.online-match-bar{padding:4px 9px}.online-match-bar span{font-size:5px}.online-match-bar strong{font-size:6px;margin-top:3px}.online-match-bar>button{min-height:29px;font-size:7px}.online-match .war-hud{top:5px;left:5px;right:5px;padding:5px;gap:7px}.online-match .heart-readout{width:99px}.online-match .heart-readout strong{font-size:16px}.online-match .heart-readout>span{font-size:4px}.online-match .war-menu{width:24px;height:25px;min-width:24px}.online-match .war-stat>span{font-size:4px}.online-match .war-stat>strong{font-size:13px}.online-board-label{top:52px;left:7px;font-size:5px}.online-match .route-alerts{top:69px;left:6px;gap:2px}.online-match .route-alerts button{min-width:80px;min-height:21px;padding:3px 5px}.online-match .route-alerts button>span{font-size:4px}.online-match .route-alerts button>b{font-size:7px}.online-match .war-overview{top:68px;right:6px;width:91px}.online-match .war-fortify{left:6px;bottom:6px;width:48px;height:52px}.online-match .war-fortify>span{font-size:15px}.online-match .war-fortify b{font-size:6px}.online-match .war-fortify small{font-size:4px}.online-match .war-skills{right:6px;bottom:6px;max-width:calc(100% - 65px);padding:4px}.online-match .skill-key{width:36px;height:46px;padding:3px 2px;gap:2px}.online-match .skill-key svg{width:17px;height:17px}.online-match .skill-key>b,.online-match .skill-key>small{font-size:5px}.online-match .skill-dock-label{font-size:4px;padding-bottom:4px}.online-match .skill-dock-buttons{gap:3px}.online-match .war-aim{bottom:72px;padding:8px 10px}.online-match .war-aim>p{font-size:9px;margin:6px 0}.online-match .aim-heading h3{font-size:15px}.online-match .aim-heading>button{width:29px;height:29px;min-width:29px}.online-match .aim-action{padding-top:5px}.online-match .aim-action>button{min-height:30px;font-size:9px}.online-match .war-context{bottom:69px!important;max-height:calc(100% - 127px)!important;padding:10px}.online-match .war-context .context-top{top:-10px}.online-match .war-boss{top:140px}.online-match .war-operation{bottom:62px;font-size:4px}.online-ownership{bottom:98px;font-size:5px}.online-opponent>header{top:6px;left:6px;right:6px;padding:8px}.online-opponent header strong{font-size:10px}.online-opponent header b{font-size:19px}.online-opponent>footer{bottom:6px;font-size:7px;padding:6px}}
/* Shared draft time is finite and belongs to the room clock. */
.online-match-actions{display:flex;gap:7px;align-items:center}.online-match-actions button{min-height:34px;padding:7px 12px;border:1px solid #9b91a34f;color:#ddd0d5;font:9px var(--mono,monospace);white-space:nowrap}.online-match-actions [data-online-deploy]{border-color:#8bb7a273;color:#b7d6c6;background:#172c2c}.online-match-actions button[hidden]{display:none!important}.online-draft{position:absolute;inset:82px 10px 100px;z-index:20;max-height:calc(100% - 182px);overflow:auto;padding:17px;background:#0e182bf5;border:1px solid #c9a6b7;box-shadow:0 6px 30px #0008}.online-draft[hidden]{display:none!important}.online-draft header>span{display:block;font:7px var(--mono,monospace);color:#b991a6;letter-spacing:1px}.online-draft header>strong{display:block;font-size:24px;font-weight:400;margin:9px 0;color:#ead6db}.online-draft header>small{display:block;font:10px var(--mono,monospace);color:#cdb389;margin-bottom:14px}.online-draft>div{display:grid;gap:8px}.online-draft>div>button{padding:12px 14px;border:1px solid #8295b45c;background:#17253a;text-align:left;min-height:62px}.online-draft>div b{display:block;font:12px var(--mono,monospace);color:#dfc7d6;margin-bottom:6px}.online-draft>div span{display:block;font:11px/1.6 var(--mono,monospace);color:#aab9ce}.online-draft footer{display:flex;align-items:center;justify-content:space-between;gap:13px;margin-top:13px}.online-draft footer>span{font:8px/1.6 var(--mono,monospace);color:#8098b7}.online-draft footer>button{flex-shrink:0;min-height:39px;padding:8px 10px;border:1px solid #a88fa95e;color:#d8c4d1;font:9px var(--mono,monospace)}
@media(max-width:650px){.online-match-actions{gap:4px}.online-match-actions button{font-size:7px;padding:7px;min-height:36px}.online-draft{inset:71px 7px 87px;max-height:calc(100% - 158px);padding:12px}.online-draft header>strong{font-size:21px}.online-draft>div>button{padding:10px;min-height:57px}.online-draft>div b{font-size:11px}.online-draft>div span{font-size:10px}.online-draft footer>span{font-size:7px}.online-draft footer>button{font-size:8px;min-height:38px}}
@media(max-height:480px) and (orientation:landscape){.online-match-actions button{font-size:6px;min-height:29px;padding:5px 7px}.online-draft{inset:57px 6px 65px;max-height:calc(100% - 122px);padding:10px}.online-draft header>strong{font-size:18px;margin:6px 0}.online-draft>div{gap:5px}.online-draft>div>button{padding:8px;min-height:45px}.online-draft>div b{font-size:9px}.online-draft>div span{font-size:8px}.online-draft footer{margin-top:8px}.online-draft footer>span{font-size:6px}}

.online-sign-in{display:inline-flex;align-items:center;min-height:44px;padding:10px 15px;border:1px solid #b68da36b;background:#273046;color:#e9d8de;font:11px var(--mono,monospace);text-decoration:none}

/* Both renderer surfaces are positioned: retained art must stay below actors. */
.online-opponent{isolation:isolate}
.online-opponent>.battle-map-layer{z-index:0}
.online-opponent>canvas[data-online-opponent-canvas]{position:absolute;inset:0;z-index:1}
.online-opponent>header,.online-opponent>footer{z-index:3}

/* Online controls remain usable while the battlefield keeps the screen. */
.online-match{grid-template-rows:58px minmax(0,1fr)}
.online-match:focus{outline:none}
.online-match button:focus-visible,.online-match select:focus-visible,.online-match a:focus-visible{outline:2px solid #f0c4db;outline-offset:2px}
.online-match-bar{padding:5px 12px}.online-match-bar span{font-size:9px;line-height:1.4;letter-spacing:.6px}.online-match-bar strong{font-size:11px;line-height:1.45;margin-top:3px}
.online-match-actions button{min-height:44px;font-size:11px;padding:9px 12px}
.online-match .war-hud{padding:7px 9px;gap:10px}.online-match .war-menu{height:44px;width:44px;min-width:44px}
.online-match .heart-readout>span,.online-match .war-stat>span{font-size:9px;letter-spacing:.3px}.online-match .heart-readout strong{font-size:21px}.online-match .war-stat>strong{font-size:19px}
.online-board-label{top:82px;font-size:9px;letter-spacing:.3px}.online-match .route-alerts{top:105px;display:flex;flex-direction:row;gap:5px}
.online-match .route-alerts button{min-height:44px;min-width:85px;padding:6px}.online-match .route-alerts button>span{font-size:8px}.online-match .route-alerts button>b{font-size:11px}
.online-match .war-overview{top:105px;width:145px}.online-match .war-overview>div:first-child{padding:4px 6px;min-height:44px;gap:5px}.online-match .war-overview>div:first-child>span{font-size:8px;letter-spacing:0}.online-match .war-overview>div:first-child>b{font-size:9px}.online-match .war-overview button{min-height:44px;min-width:44px}.online-match .war-overview.collapsed{width:145px}
.online-match .war-fortify{width:66px;min-height:70px}.online-match .war-fortify b{font-size:9px}.online-match .war-fortify small{font-size:8px}
.online-match .war-skills{max-width:calc(100% - 90px)}.online-match .skill-dock-buttons{gap:4px;overflow-x:auto;max-width:100%;scrollbar-width:thin}.online-match .skill-key{flex-shrink:0;width:46px;min-width:44px;height:66px;padding:5px 2px}.online-match .skill-key>b,.online-match .skill-key>small{font-size:9px}.online-match .skill-key svg{width:22px;height:22px}.online-match .skill-dock-label{font-size:8px;letter-spacing:0;padding-bottom:5px}.online-match .skill-dock-label>span{font-size:8px}
.online-match .war-aim{bottom:110px}.online-match .aim-heading>button,.online-match .aim-action>button,.online-match .war-context button{min-height:44px}.online-match .aim-heading>button{min-width:44px}.online-match .war-context .context-top>button{width:44px;height:44px}
.online-match .war-context .context-budget{font:11px/1.6 var(--mono,monospace);color:#bdd2d0;margin-block:10px}.online-match .war-context .action-reason{display:block;font:10px/1.5 var(--mono,monospace);margin-top:4px;color:#b3a7b9}
.online-match .war-operation{font-size:8px}.online-ownership{font-size:9px;max-width:calc(100% - 20px)}.online-ownership span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.online-opponent header span,.online-opponent header small,.online-opponent>footer{font-size:10px}.online-opponent header strong{font-size:13px}.online-match-message{top:65px}
.online-match-dialog>span,.online-draft header>span{font-size:10px}.online-match-dialog p{font-size:12px}.online-match-dialog button,.online-match-dialog select{font-size:12px;min-height:44px}
.online-local-settings{padding:14px 0;border-block:1px solid #8e9cad40;margin-top:18px;display:grid;gap:12px}.online-local-settings>div{display:grid;gap:8px}.online-local-settings label{font:12px var(--mono,monospace);color:#d0b6c8}.online-local-settings select{width:100%;padding:9px;background:#17273e;border:1px solid #9f88a76b;color:#e3d4df}.online-local-settings>button{justify-self:start}.online-local-settings>small{font:11px/1.6 var(--mono,monospace);color:#9eafc5}
.online-draft footer>button{min-height:44px;font-size:11px}.online-draft footer>span{font-size:10px}.online-draft>div b{font-size:12px}.online-draft>div span{font-size:11px}
@media(max-width:1400px){.online-match .route-alerts button{width:44px;min-width:44px}.online-match .route-alerts button>span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.online-match .war-overview{width:130px}.online-match .war-overview.collapsed{width:130px}.online-match .war-overview>div:first-child>span{font-size:7px}.online-match .heart-readout{width:110px}}
@media(max-width:650px) and (orientation:portrait){
 .online-match{grid-template-rows:62px minmax(0,1fr)}.online-match-bar{padding:5px 7px;gap:7px}.online-match-bar span{font-size:8px}.online-match-bar strong{font-size:10px;line-height:1.4}.online-match-actions{gap:5px}.online-match-actions button{font-size:10px;padding:7px;min-height:44px}.online-match-actions [data-online-deploy]{max-width:91px;white-space:normal}
 .online-match .war-hud{padding:5px;gap:7px}.online-match .war-menu{height:44px;width:44px;min-width:44px}.online-match .heart-readout{width:105px;min-width:85px}.online-match .heart-readout>span,.online-match .war-stat>span{font-size:8px}.online-match .war-stat>strong{font-size:17px}
 .online-board-label{top:76px;font-size:9px}.online-match .route-alerts,.online-match .war-overview{top:99px}.online-match .war-overview,.online-match .war-overview.collapsed{width:130px}
 .online-match .war-fortify{width:58px;min-height:70px}.online-match .war-skills{max-width:calc(100% - 78px);padding:5px}.online-match .skill-key{width:44px;min-width:44px;height:62px}.online-match .skill-key>b,.online-match .skill-key>small{font-size:8px}.online-match .skill-dock-label,.online-match .skill-dock-label>span{font-size:8px}.online-match .skill-dock-label{gap:6px}
 .online-match .war-operation{font-size:8px;bottom:94px}.online-match .war-aim{bottom:104px}.online-match .war-context{bottom:102px!important}.online-ownership{bottom:132px;font-size:9px;gap:4px}.online-opponent header span,.online-opponent header small,.online-opponent>footer{font-size:9px}.online-opponent header strong{font-size:11px}.online-match-message{top:68px}.online-draft{inset:77px 7px 101px;max-height:calc(100% - 178px)}
}
@media(max-height:480px) and (orientation:landscape){
 .online-match{grid-template-rows:52px minmax(0,1fr)}.online-match-bar{padding:4px 8px}.online-match-bar span{font-size:8px}.online-match-bar strong{font-size:10px}.online-match-actions button{min-height:44px;font-size:10px;padding:7px 10px}
 .online-match .war-hud{padding:3px 5px;gap:7px}.online-match .war-menu{width:44px;height:44px;min-width:44px}.online-match .heart-readout{width:92px;min-width:72px}.online-match .heart-readout>span,.online-match .war-stat>span{font-size:8px}.online-match .war-stat>strong{font-size:16px}.online-match .heart-readout strong{font-size:18px}
 .online-board-label,.online-ownership,.online-match .war-operation{display:none}.online-match .route-alerts,.online-match .war-overview{top:64px}.online-match .route-alerts button{min-height:44px}.online-match .war-overview,.online-match .war-overview.collapsed{width:114px}.online-match .war-overview>div:first-child>span{display:none}
 .online-match .war-fortify{width:50px;min-height:62px;height:62px}.online-match .war-fortify b{font-size:8px}.online-match .war-fortify small{font-size:7px}.online-match .war-skills{max-width:calc(100% - 66px);padding:4px}.online-match .skill-key{height:54px;min-width:44px;width:44px}.online-match .skill-key>b,.online-match .skill-key>small{font-size:8px}.online-match .skill-key svg{width:18px;height:18px}.online-match .skill-dock-label{font-size:8px}.online-match .skill-dock-label>span{display:none}
 .online-match .war-aim{bottom:83px}.online-match .war-context{bottom:82px!important;max-height:calc(100% - 142px)!important}.online-match .aim-action>button{min-height:44px;font-size:11px}.online-match .aim-heading>button{height:44px;width:44px;min-width:44px}.online-match .war-boss{top:120px}.online-match-message{top:57px}.online-draft{inset:61px 6px 80px;max-height:calc(100% - 141px)}.online-draft>div b{font-size:11px}.online-draft>div span{font-size:10px}.online-draft footer>span{font-size:9px}
}