/* desktop-scale:native-start */
/* Terminal chrome uses one size system, independent of chart data density. */
body.terminal-active{--terminal-action-size:32px;--terminal-action-gap:8px}
body.terminal-active .flow-reference-brand{--quantsion-ink:#132d58;--quantsion-badge:#f7f9fc}
body.terminal-active[data-terminal-theme=dark] .flow-reference-brand{--quantsion-ink:#fff;--quantsion-badge:transparent}
body.terminal-active .flow-reference-brand .terminal-brand-logo{width:auto;height:27px;aspect-ratio:137.48 / 31;margin:0}
body.terminal-active .product-header__actions,body.terminal-active .terminal-header-controls{gap:var(--terminal-action-gap);align-items:center}
body.terminal-active .product-header :is(.language-picker,.account-picker){margin:0}
body.terminal-active .product-header :is([data-terminal-action],.flow-reference-bell,.lang-toggle,.account-toggle){display:inline-flex;align-items:center;justify-content:center;flex:0 0 var(--terminal-action-size);width:var(--terminal-action-size);min-width:var(--terminal-action-size);max-width:var(--terminal-action-size);height:var(--terminal-action-size);min-height:var(--terminal-action-size);max-height:var(--terminal-action-size);padding:0;margin:0;border:1px solid transparent;color:var(--terminal-muted)}
body.terminal-active .product-header :is(.terminal-action-icon,.language-globe){width:20px;min-width:20px;max-width:20px;height:20px;min-height:20px;max-height:20px}
body.terminal-active .terminal-header-controls>[data-terminal-action=help]{display:none}
body.terminal-active .terminal-header-controls>.terminal-connection{display:inline-flex;align-items:center;justify-content:center;order:-2;height:32px;gap:6px;margin:0;padding:0;border:0;border-radius:0;font:500 12px/1 'Segoe UI',sans-serif;letter-spacing:0;color:var(--terminal-text);white-space:nowrap}
body.terminal-active .terminal-connection:before{content:'';width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--terminal-muted)}
body.terminal-active .terminal-connection[data-feed-status=live]:before{background:#16a34a}
body.terminal-active .terminal-connection:is([data-feed-status=connecting],[data-feed-status=stale]):before{background:#d99b27}
@media (min-width:761px) and (hover:hover), (min-width:761px) and (pointer:fine), (min-width:761px) and (min-width:1101px){
 body[data-page=dashboard].terminal-active{--psv-header-height:40px}
 body.terminal-active .product-header{height:40px;min-height:40px}
 body.terminal-active .product-header__inner{display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(450px,1fr);gap:16px;padding:0 12px;height:100%}
 body.terminal-active .dashboard-main{height:calc(100dvh - 40px)}
 body.terminal-active .terminal-mode-nav{margin:0;gap:0;justify-content:center}
 body.terminal-active .terminal-mode-nav>button{height:100%;padding:0 20px;gap:8px;font:500 12px/1 'Segoe UI',sans-serif}
 body.terminal-active .terminal-mode-nav>button svg{width:16px;height:16px}
 body.terminal-active .product-header__actions{justify-content:flex-end;min-width:0;width:100%;max-width:600px}
 body.terminal-active .flow-reference-search{display:flex;flex:1 1 180px;max-width:220px;min-width:32px;width:auto;height:32px;padding:0 8px;gap:6px;overflow:hidden;border-radius:4px;font:12px/1 'Segoe UI',sans-serif}
 body.terminal-active .flow-reference-search .terminal-action-icon{width:14px;min-width:14px;max-width:14px;height:14px;min-height:14px;max-height:14px}
 body.terminal-active .flow-reference-search>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 body.terminal-active .terminal-header-controls{flex-shrink:0}
 body.terminal-active .terminal-header-controls>.terminal-connection{width:auto;flex:0 0 auto}
 body.terminal-active .flow-reference-clock{display:inline-flex;align-items:baseline;gap:4px;order:-1;width:max-content;min-width:max-content;flex:0 0 auto;margin:0;padding:0;font:500 12px/1 'Segoe UI',sans-serif;font-variant-numeric:tabular-nums;color:var(--terminal-text);white-space:nowrap}
 body.terminal-active .flow-reference-clock>span{flex:none;font:inherit;color:inherit}
 body.terminal-active .terminal-workspace-menu{top:39px;left:12px}
}
@media (min-width:761px) and (max-width:1099px) and (hover:hover), (min-width:761px) and (max-width:1099px) and (pointer:fine), (min-width:761px) and (max-width:1099px) and (min-width:1101px){
 body.terminal-active .product-header__inner{grid-template-columns:auto auto minmax(0,1fr);gap:8px}
 body.terminal-active .flow-reference-brand .terminal-brand-logo{height:25px}
 body.terminal-active .terminal-mode-nav>button{padding:0 8px;gap:6px}
 body.terminal-active .terminal-mode-nav>button svg{width:14px;height:14px}
}
@media(max-width:900px){body.terminal-active .flow-reference-search{display:none}}
@media (max-width:760px), (max-width:1100px) and (hover:none) and (pointer:coarse){
 body.terminal-active .terminal-header-controls>.terminal-connection{font-size:11px;padding-inline:2px}
 body.terminal-active .flow-reference-clock{display:none}
}
/* desktop-scale:native-end */

/* desktop-scale:native-start */
/* Mobile uses a single page scroll and a labelled five-item navigation bar. */
@media (max-width:760px), (max-width:1100px) and (hover:none) and (pointer:coarse){
 html:has(body[data-page=dashboard]),body[data-page=dashboard]{max-width:100%;overflow-x:clip;overscroll-behavior-x:none;touch-action:pan-y pinch-zoom}
 html:has(body.terminal-active){scroll-behavior:auto;scroll-padding-block:56px calc(64px + env(safe-area-inset-bottom))}
}
body.terminal-active[data-terminal-view=""] .dashboard-stage{overflow-y:auto;color:var(--terminal-text);background:var(--terminal-bg)}
body.terminal-active[data-terminal-view=""] .flow-reference-search{visibility:hidden}
body.terminal-active .dashboard-notification-list:empty{border:0}
body.terminal-active .terminal-connection:empty{display:none}
body.terminal-active .dashboard-view-head{padding:18px 16px;margin:0;border-color:var(--terminal-border)}
body.terminal-active .dashboard-view-head :is(h1,h2){color:var(--terminal-text)}
body.terminal-active .dashboard-view-head p{color:var(--terminal-muted)}
body.terminal-active .dashboard-account-panel{--psv-text:var(--terminal-text);--psv-muted:var(--terminal-muted);--psv-copy:var(--terminal-muted);--psv-line:var(--terminal-border);--psv-accent-pale:var(--terminal-accent);background:var(--terminal-surface);border-color:var(--terminal-border)}
@media (max-width:760px), (max-width:1100px) and (hover:none) and (pointer:coarse){
 body[data-page=dashboard]{height:auto;min-height:100dvh;overflow-y:visible;overflow-x:clip}
 body[data-page=dashboard] .dashboard-main{height:auto;min-height:calc(100dvh - 56px);padding-bottom:calc(72px + env(safe-area-inset-bottom))}
 body[data-page=dashboard] .dashboard-app,body[data-page=dashboard] .dashboard-stage{height:auto;min-height:0;overflow:visible}
 body.terminal-active{--terminal-action-gap:4px;--terminal-action-size:32px;--psv-header-height:56px}
 body.terminal-active .product-header{height:56px;min-height:56px}
 body.terminal-active .product-header__inner{padding-inline:8px;gap:6px}
 body.terminal-active .product-header__inner{display:flex;justify-content:space-between}
 body.terminal-active .flow-reference-brand{pointer-events:auto}
 body.terminal-active .flow-reference-search,body.terminal-active .flow-reference-bell{display:none!important}
 body[data-page=dashboard] .dashboard-app{display:block}
 body.terminal-active .flow-reference-brand .terminal-brand-logo{height:23px;max-width:104px}
 body.terminal-active .terminal-header-controls>.terminal-connection{flex:0 1 auto;width:auto;max-width:none;min-width:0;padding:0 6px;font-size:11px;white-space:nowrap;line-height:14px}
 body.terminal-active .flow-reference-brand{flex:1 1 auto;min-width:0}
 body.terminal-active .product-header__actions{flex:0 0 auto;gap:4px}
 body.terminal-active .flow-reference-clock{display:none}
 body[data-page=dashboard] .dashboard-nav{position:fixed;inset:auto 0 0;z-index:50;display:flex;flex-direction:row;justify-content:space-around;width:100%;height:calc(64px + env(safe-area-inset-bottom));padding:4px 6px calc(4px + env(safe-area-inset-bottom));gap:0}
 body[data-page=dashboard] .dashboard-nav button,body[data-page=dashboard] .dashboard-nav button:last-child{display:flex;flex:1 1 0;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:auto;height:56px;min-width:0;margin:0;padding:4px 1px}
 body[data-page=dashboard] .dashboard-nav button svg{width:20px;height:20px;flex:none}
 body[data-page=dashboard] .dashboard-nav-label{position:static;display:block;visibility:visible;opacity:1;transform:none;width:auto;padding:0;border:0;background:none;font-size:10px;line-height:14px;white-space:nowrap;color:inherit}
 body.terminal-active .dashboard-nav button:is([data-dashboard-view-button=monitor],[data-dashboard-view-button=analyze],[data-dashboard-view-button=flow])>.dashboard-nav-label{display:none}
 body.terminal-active .dashboard-nav .flow-reference-label{display:block;font-size:10px;line-height:14px}
 body[data-page=dashboard] .dashboard-nav button[aria-pressed=true]::before{inset:auto 8px 0;height:2px;width:auto}
 .terminal-hybrid-host{height:auto;min-height:calc(100dvh - 120px)}
 .terminal-workspace-frame[data-active=true]{position:relative;inset:auto;height:var(--terminal-content-height,calc(100dvh - 120px))}
 body.terminal-active .dashboard-account-panel dl>div{font-size:12px}
 body.terminal-active .dashboard-account-panel dd{overflow-wrap:anywhere}
}
/* desktop-scale:native-end */

/* desktop-scale:native-start */
/* Notification information stays beside its trigger, over the current view. */
body.terminal-active [data-terminal-notifications]{position:fixed;inset:auto;box-sizing:border-box;width:min(360px,calc(100vw - 16px));max-height:min(420px,calc(100dvh - 80px));margin:0;padding:0;overflow:auto;border:1px solid var(--terminal-border);border-radius:8px;background:var(--terminal-surface);color:var(--terminal-text);box-shadow:0 10px 28px #0004;font:400 13px/20px 'IBM Plex Sans','Segoe UI',sans-serif}
body.terminal-active .terminal-notification-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px;border-bottom:1px solid var(--terminal-border)}
body.terminal-active .terminal-notification-heading h2{margin:0;font:600 14px/20px 'IBM Plex Sans','Segoe UI',sans-serif;color:var(--terminal-text)}
body.terminal-active .terminal-notification-heading button{display:grid;place-items:center;flex:none;width:32px;height:32px;margin:0;padding:0;border:0;border-radius:4px;background:transparent;color:var(--terminal-muted);font:400 16px/1 'Segoe UI',sans-serif;cursor:pointer}
body.terminal-active .terminal-notification-heading button:focus-visible{outline:2px solid var(--terminal-accent);outline-offset:-2px}
body.terminal-active .terminal-notification-empty{margin:0;padding:20px 16px;color:var(--terminal-muted)}
body.terminal-active [data-terminal-notifications] .dashboard-notification-list{border:0;background:transparent}
body.terminal-active [data-terminal-notifications] .dashboard-notification-list article{min-height:0;grid-template-columns:8px minmax(0,1fr);gap:12px;padding:12px 16px;border-color:var(--terminal-border)}
body.terminal-active [data-terminal-notifications] .dashboard-notification-list strong{color:var(--terminal-text);font-size:13px}
body.terminal-active [data-terminal-notifications] .dashboard-notification-list p{color:var(--terminal-muted);font-size:13px}
body.terminal-active [data-terminal-notifications] .dashboard-notification-list time{grid-column:2;color:var(--terminal-muted);font-size:11px}
@media (max-width:760px), (max-width:1100px) and (hover:none) and (pointer:coarse){body.terminal-active .terminal-notification-heading button{width:44px;height:44px}}
/* desktop-scale:native-end */