/* Viewport-aware cockpit. Keep controls readable instead of scaling the page. */
:root{--cockpit-height:59px;--rail-width:68px;--rail-gap:18px;--window-top:calc(var(--cockpit-height) + 42px);--window-bottom:100px;--window-space:calc(100dvh - var(--window-top) - var(--window-bottom))}
.workspace-nav{min-height:0;bottom:12px;overscroll-behavior:contain}
.workspace-nav nav{min-height:0}
.workspace-top,.workspace-top-actions,.workspace-hud .metrics,.workspace-hud .metric{min-width:0}
.workspace-top .workspace-brand{min-width:0;overflow:hidden}
.workspace-brand #workspace-airline{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.workspace-hud .metric-value{font-size:clamp(14px,1.35vw,19px);font-variant-numeric:tabular-nums}
.workspace-events{left:calc(var(--rail-width) + var(--rail-gap)*2);right:var(--rail-gap);top:calc(var(--cockpit-height) + 8px)}
.workspace-map .map-top{left:calc(var(--rail-width) + var(--rail-gap)*2);top:calc(var(--cockpit-height) + 44px);max-width:calc(100vw - var(--rail-width) - var(--rail-gap)*3);flex-wrap:wrap}
.management-window{left:calc(50% + var(--rail-width)/2);top:calc(var(--window-top) + var(--window-space)/2);transform:translate(-50%,-50%);width:min(1120px,calc(100vw - var(--rail-width) - var(--rail-gap)*3));max-width:calc(100vw - 16px);min-width:min(300px,calc(100vw - 16px))}
.management-window:not(.minimized){height:min(760px,var(--window-space));max-height:var(--window-space);min-height:min(220px,var(--window-space))}
.management-window.market-window,.management-window.exchange-window,.management-window.orders-expanded{left:calc(50% + var(--rail-width)/2);right:auto;top:calc(var(--window-top) + var(--window-space)/2);transform:translate(-50%,-50%);width:min(1420px,calc(100vw - var(--rail-width) - var(--rail-gap)*3));max-width:calc(100vw - 16px);max-height:var(--window-space)}
.management-window .window-titlebar{min-height:0;padding:12px 18px;flex-shrink:0}
.management-window #page-content{padding:clamp(14px,1.7vw,24px)}
.overlay .modal,.overlay .modal:is(.wide,.aircraft-purchase-window,.incident-dialog,.study-dialog,.newspaper-dialog){left:calc(50% + var(--rail-width)/2);right:auto;top:calc(var(--window-top) + var(--window-space)/2);transform:translate(-50%,-50%);max-width:calc(100vw - var(--rail-width) - var(--rail-gap)*3);min-width:0;max-height:var(--window-space)}
.overlay .modal-head{padding:14px 20px}
.overlay .modal-body{padding:clamp(14px,1.7vw,22px)}
.overlay .modal-foot{padding:12px 20px}
.workspace-map .plane-inspector{max-width:calc(100vw - 24px);max-height:var(--window-space)}
.map-utility-panel,.map-chat{max-width:calc(100vw - 24px);max-height:calc(100dvh - var(--cockpit-height) - 24px)}

@media(min-width:601px) and (max-height:820px){
 :root{--rail-width:152px;--rail-gap:12px}
 .workspace-nav{left:var(--rail-gap);top:calc(var(--cockpit-height) + 8px);width:var(--rail-width);padding:6px;gap:4px;overflow:hidden}
 .workspace-nav nav{display:grid;grid-auto-rows:minmax(0,1fr);gap:1px;flex:1;overflow:visible}
 .workspace-nav nav button,.workspace-nav>button{flex-direction:row;justify-content:flex-start;gap:9px;padding:4px 7px;min-height:0}
 .workspace-nav button svg{width:17px;height:17px;flex-shrink:0}
 .workspace-nav button span{font-size:11px;line-height:1.2;white-space:nowrap;text-align:left}
 .workspace-nav>button{flex:0 0 30px;border-top:1px solid var(--line);border-radius:0 0 7px 7px}
 .workspace-clock{width:min(700px,calc(100vw - var(--rail-width) - 120px));left:calc(50% + var(--rail-width)/2)}
}
@media(min-width:601px) and (max-height:560px){
 .workspace-nav nav{grid-template-columns:repeat(2,minmax(0,1fr))}
 .workspace-nav nav button{flex-direction:column;justify-content:center;gap:2px;padding:2px}
 .workspace-nav button span{font-size:9px}
 .workspace-nav>button{flex-basis:26px}
 :root{--window-bottom:82px;--window-top:calc(var(--cockpit-height) + 36px)}
 .workspace-clock .clock-bar{padding:7px 12px}
}
@media(max-width:1100px){
 .workspace-top-actions>.top-settings span,.workspace-top-actions>.btn .top-route-label{display:none}
 .workspace-top-actions>.top-settings{padding:7px 9px}
 .workspace-connection{min-width:95px}
 .workspace-top .workspace-connection .save-indicator{max-width:105px}
}
@media(max-width:1000px){
 :root{--cockpit-height:105px}
 .workspace-top{height:var(--cockpit-height);grid-template-columns:minmax(110px,1fr) auto;padding:5px 12px;gap:5px 10px}
 .workspace-top>.workspace-hud{height:43px;grid-row:2;grid-column:1/-1}
 .workspace-hud .metrics{grid-template-columns:repeat(4,minmax(0,1fr));height:43px}
 .workspace-hud .metric{height:43px;padding:1px 10px}
 .workspace-hud .metric:nth-child(n){display:block}
 .workspace-hud .metric-value{font-size:18px;line-height:20px}
 .workspace-hud .metric-label{font-size:9px}
 .workspace-hud .metric-foot{font-size:8px}
 .workspace-nav{top:calc(var(--cockpit-height) + 8px)}
 .workspace-map .map-top button{font-size:10px;padding:7px 9px}
}
@media(max-width:760px){
 .management-window.orders-expanded{grid-template-columns:minmax(0,1fr) 240px}
 .management-window .window-titlebar{padding:10px 14px}
 .management-window .window-titlebar h2{font-size:18px}
 .overlay .modal-head h2{font-size:20px}
}
@media(max-width:600px){
 :root{--rail-width:0px;--rail-gap:8px;--window-bottom:155px;--window-top:calc(var(--cockpit-height) + 42px)}
 .workspace-nav{inset:auto 0 0;width:100%;height:76px;display:block;padding:4px 6px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
 .workspace-nav nav,body.mp-host .workspace-nav nav{display:flex;width:max-content;height:56px;gap:3px}
 .workspace-nav nav button{width:78px;flex:0 0 78px;height:54px;flex-direction:column;padding:5px 2px;gap:4px}
 .workspace-nav nav button span{font-size:10px;line-height:1.15;white-space:normal}
 .workspace-nav nav button svg{width:18px;height:18px}
 .workspace-nav>button{display:none}
 .workspace-clock{left:8px;right:8px;width:auto;bottom:85px;transform:none}
 .workspace-clock .speed-controls{flex-wrap:wrap;gap:2px}
 .workspace-clock .speed-controls button{min-width:25px}
 .management-window{left:50%;right:auto;width:calc(100vw - 16px);top:calc(var(--window-top) + var(--window-space)/2);transform:translate(-50%,-50%)}
 .management-window.market-window,.management-window.exchange-window,.management-window.orders-expanded{left:50%;right:auto;top:calc(var(--window-top) + var(--window-space)/2);transform:translate(-50%,-50%);width:calc(100vw - 16px)}
 .overlay .modal,.overlay .modal:is(.wide,.aircraft-purchase-window,.incident-dialog,.study-dialog,.newspaper-dialog){left:50%;right:auto;max-width:calc(100vw - 16px);top:calc(var(--window-top) + var(--window-space)/2);transform:translate(-50%,-50%);width:calc(100vw - 16px)}
 .workspace-map .plane-inspector{left:8px;right:8px;width:auto;transform:none;top:var(--window-top)}
 .management-window.orders-expanded{display:grid;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) minmax(0,1fr)}
 .orders-expanded>.window-titlebar{grid-column:1;grid-row:1}.orders-expanded>#page-content{grid-column:1;grid-row:2;max-height:none}.aircraft-order-extension{grid-column:1;grid-row:3;max-height:none;min-height:0}
 .aircraft-order-extension .aircraft-order-content{min-height:0}
 .map-utility-panel,.map-chat{max-height:calc(100dvh - var(--cockpit-height) - 90px)}
}

[data-theme=dark] .exchange-window .exchange-tabs button.active{color:#233b27}
