/* Shared desktop/mobile composition; the existing selected card is the only card. */
body{padding:48px 20px 12px!important}
#shell#shell,#shell#shell:has(.main-card.selected){width:100%!important;max-width:1600px!important;height:calc(100dvh - 60px)!important;margin:0 auto;grid-template-rows:140px minmax(0,1fr) 86px!important}
#shell#shell>.dashboard,#shell#shell>.dashboard:has(.main-card.selected){overflow:auto!important;gap:16px!important;padding:6px 24px 12px!important;justify-content:flex-start}
#shell#shell .hud-console{flex:none!important;display:grid!important;gap:16px!important;align-items:start;overflow-x:auto;overflow-y:hidden;padding-bottom:8px!important;scrollbar-width:thin;scrollbar-color:#52838b #09171c}
#shell#shell:not(.window-mobile) .hud-console{grid-template-columns:repeat(4,minmax(180px,1fr))!important}
#shell#shell.window-mobile .hud-console{grid-template-columns:repeat(2,minmax(140px,1fr))!important}
#shell#shell .hud-unit{min-width:0}
#shell#shell .hud-face,#shell#shell .channels-hud .hud-face{width:var(--fit-face)!important;height:var(--fit-face)!important;max-width:none;aspect-ratio:1}
#shell#shell .hud-value strong{font-size:clamp(28px,calc(var(--fit-face)*.22),62px)!important}
#shell#shell .hud-value strong small{font-size:clamp(12px,calc(var(--fit-face)*.085),23px)!important}
#shell#shell .hud-value>span{font-size:clamp(7px,calc(var(--fit-face)*.034),10px)!important;letter-spacing:1px}
#shell#shell .clock-hud .refresh-readout time{font-size:clamp(14px,calc(var(--fit-face)*.095),27px)!important}
#shell#shell .clock-hud .clock-city,#shell#shell .clock-hud .refresh-label{font-size:clamp(7px,calc(var(--fit-face)*.027),8px)!important;letter-spacing:.4px}
#shell#shell .hud-label{font-size:clamp(8px,calc(var(--fit-face)*.034),11px)!important;margin-top:6px;white-space:normal;text-align:center}
#shell#shell .hud-caption{font-size:clamp(8px,calc(var(--fit-face)*.03),10px)!important;line-height:1.5;margin-top:5px;max-width:100%}
#shell#shell .telemetry-label{font-size:8px!important;gap:12px;flex:none}
#shell#shell .mobile-tabs{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px!important;flex:none!important;height:auto!important;min-height:44px!important;padding:3px!important;overflow:visible!important;border:0}
#shell#shell .mobile-tabs button{min-height:44px!important;height:auto!important;min-width:0;padding:8px 6px!important;font-size:13px!important;white-space:normal;line-height:1.25;border:1px solid #8cd5de30;border-radius:5px;background:linear-gradient(180deg,#a8eef00b,#2c7d8912);box-shadow:inset 0 0 6px #8fdfdf0c;color:#abc7cd}
#shell#shell .mobile-tabs button[aria-selected=true]{border-color:#a7eff16b;color:#e0f7f8;background:linear-gradient(180deg,#a8eef018,#2c7d8926);box-shadow:inset 0 0 8px #8fdfdf22,0 0 5px #75d4dd18}
#shell#shell .dashboard-grid,#shell#shell .dashboard-grid:has(.main-card.selected){display:block!important;flex:0 0 270px!important;height:270px!important;min-height:270px!important;width:100%;overflow:visible!important}
#shell#shell .dashboard-grid>.main-card{display:none!important;height:270px!important;min-height:270px!important}
#shell#shell .dashboard-grid>.main-card.selected{display:block!important}
#shell#shell .main-card .portfolio-legend{flex-direction:row!important}
#shell#shell.window-mobile .main-card .portfolio-legend{flex-direction:column!important}
#shell#shell>footer{padding:0!important;display:flex;justify-content:center;align-items:flex-start;overflow:visible}
#shell#shell>footer .footer-actions{position:relative!important;top:12px!important;bottom:auto!important;left:auto!important;transform:none!important;gap:8px!important;flex:none;width:auto}
#shell#shell>footer .footer-actions button{height:44px!important;min-height:44px!important;font-size:13px!important;padding:6px 12px!important}
#shell#shell>footer .footer-actions button[data-open=editor]{width:140px!important}
#shell#shell>footer>span{display:none!important}
#view-control{position:fixed;left:24px;top:3px;z-index:1000;display:flex;gap:8px;align-items:center;font:11px system-ui;color:#bedce1}
#view-choice{height:38px;min-height:38px;padding:4px 8px;border:1px solid #93d8df55;border-radius:5px;background:#0b1c24;color:#dbf3f4;font:12px system-ui}
#window-collapse{display:block;position:fixed;right:24px;top:3px;z-index:1000;height:38px;min-height:38px;font:11px system-ui;padding:4px 10px;border:1px solid #93d8df33;background:#0b1c24;color:#bedce1;border-radius:5px}
#window-chip{position:fixed;left:24px;bottom:24px;z-index:1001;display:block;width:150px;height:75px;min-height:0;padding:18px 0 0;border:0;border-radius:0;background:var(--chip-frame) center/100% 100% no-repeat;font:14px ui-monospace,monospace;letter-spacing:4px;clip-path:none;filter:drop-shadow(0 8px 14px #0009)}
#window-chip:before{display:none}
#window-chip:focus-visible{outline:1px solid #9ddde5;outline-offset:4px}
.window-collapsed #shell#shell,.window-collapsed #layers{visibility:hidden!important;pointer-events:none;opacity:0}
#window-chip[hidden],#window-collapse[hidden],#view-control[hidden]{display:none!important}
#shell#shell:not(.window-mobile){--fit-face:180px} /* Inline measured size overrides this default. */
#shell#shell .hud-face svg{width:100%;height:100%}
@media(max-width:900px){
 body{padding:48px 8px 8px!important}
 #shell#shell,#shell#shell:has(.main-card.selected){height:calc(100dvh - 56px)!important;grid-template-rows:116px minmax(0,1fr) 86px!important}
 #shell#shell>.dashboard,#shell#shell>.dashboard:has(.main-card.selected){padding:6px 12px 12px!important}
 #view-control{left:12px}#window-collapse{right:12px}
}
#shell#shell.window-mobile>.dashboard{padding-inline:12px!important}
#shell#shell.window-mobile .mobile-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:450px){#shell#shell>footer .footer-actions{gap:5px!important}#shell#shell>footer .footer-actions button{font-size:12px!important;padding-inline:8px!important}#shell#shell>footer .footer-actions button[data-open=editor]{width:118px!important}}
@media(prefers-reduced-motion:reduce){#shell#shell,#window-chip{animation:none!important;transition:none!important}}
