:root {
    --ink: #243645; --muted: #6b7d89; --line: #c8d4dd; --paper: #fff;
    --canvas: #edf2f5; --nav: #263d4d; --green: #177e79; --green-soft: #e0f1ec;
    --amber: #996617; --amber-soft: #fff0ce; --blue: #327ba7; --red: #b94e40;
}
* { box-sizing: border-box; letter-spacing: 0; }
body { margin: 0; background: var(--canvas); color: var(--ink); font: 12px/1.4 Arial, Helvetica, sans-serif; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .55; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea, a { outline-offset: 2px; }
:focus-visible { outline: 2px solid var(--blue); }
[hidden] { display: none !important; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: 15px; font-weight: 700; margin-bottom: 0; }
h2 { font-size: 13px; font-weight: 700; margin-bottom: 0; }
h3 { font-size: 12px; font-weight: 700; }
svg.lucide { width: 15px; height: 15px; flex: 0 0 auto; stroke-width: 1.7; }
.module-bar { min-height: 48px; display: flex; align-items: stretch; background: var(--nav); border-bottom: 3px solid #b4cbd2; color: #deebf1; }
.brand { width: 174px; padding: 10px 12px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: white; border-right: 1px solid var(--line); }
.brand img { display: block; width: 100%; height: auto; object-fit: contain; }
.module-bar nav { display: flex; align-items: stretch; }
.module-bar nav a { padding: 0 15px; min-height: 45px; display: flex; gap: 7px; align-items: center; border-right: 1px solid #415566; font-size: 12px; white-space: nowrap; }
.module-bar nav a:hover { background: #355266; }
.module-bar nav a.active { background: #426275; color: white; box-shadow: inset 0 -3px #d6ad5e; }
#nav-flights:not(:empty) { font-size: 10px; background: #e8f2f5; color: #355667; padding: 1px 5px; border-radius: 2px; }
.module-actions { margin-left: auto; display: flex; align-items: center; gap: 9px; padding: 0 12px; }
.profile { color: inherit; border: 0; background: transparent; display: flex; align-items: center; gap: 7px; font-size: 11px; padding: 4px; }
.profile span { max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.module-actions form { margin: 0; }
.module-actions .sign-out { background: transparent; color: #d9e8ed; border-color: #587080; }
.app-shell { min-height: calc(100dvh - 48px); display: flex; flex-direction: column; }
.app-header { min-height: 33px; padding: 3px 12px; display: flex; align-items: center; gap: 12px; justify-content: space-between; background: #dae5ec; border-bottom: 1px solid #bacbd7; }
.breadcrumb { color: var(--muted); font-size: 11px; }
.breadcrumb span { margin: 0 9px; color: #8c9ca5; }
.breadcrumb strong { color: var(--ink); font-weight: 700; }
.header-right { display: flex; align-items: center; gap: 17px; font-size: 10px; }
#utc-clock { font-variant-numeric: tabular-nums; font-weight: 700; }
#sidebar-status { color: var(--muted); }
.live-tag { display: flex; gap: 5px; align-items: center; color: #14675c; font-size: 10px; white-space: nowrap; }
.live-tag::before, .footer-dot { content: ""; display: inline-block; height: 5px; width: 5px; background: currentColor; border-radius: 50%; }
.icon-button { display: inline-grid; place-items: center; border: 1px solid #b6c6d1; background: #f7fafc; border-radius: 2px; width: 27px; height: 26px; padding: 0; color: #496777; flex-shrink: 0; }
.icon-button:hover { background: #dfeaf0; color: #175879; }
.mobile-menu { display: none; }
main { padding: 0; flex: 1; min-width: 0; }
.page-heading { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 5px 10px; border-bottom: 1px solid var(--line); background: #f3f7f9; }
.page-heading .eyebrow { display: none; }
.eyebrow { display: block; font-size: 9px; color: var(--muted); margin-bottom: 5px; font-weight: 700; }
.button { display: inline-flex; gap: 6px; align-items: center; justify-content: center; background: #f8fbfd; color: var(--ink); border: 1px solid #b4c5d0; border-radius: 2px; min-height: 27px; padding: 4px 10px; font-size: 11px; font-weight: 500; white-space: normal; }
.button:hover { background: #e3edf2; }
.button.primary { background: var(--green); color: white; border-color: #116762; }
.button.primary:hover { background: #116661; }
.button.small { min-height: 24px; padding: 3px 7px; font-size: 10px; }
.button svg { width: 14px; height: 14px; }
.workspace-grid { display: grid; grid-template-columns: minmax(0,1fr); }
body[data-view="flights"] .workspace-grid { grid-template-columns: minmax(0,1fr) 350px; }
#content { min-width: 0; }
body:not([data-view="flights"]) #content { padding: 10px; }
.flight-inspector { background: #e3ecf2; border-left: 2px solid #a9bfce; min-width: 0; max-height: calc(100dvh - 143px); overflow: auto; }
#inspector-empty > h2 { padding: 9px 12px; border-bottom: 1px solid #b4c9d7; background: #d0e0e9; text-transform: uppercase; }
.flight-inspector .empty-state { padding: 60px 12px; }
.flight-inspector .dialog-header { padding: 8px 10px; background: #d0e0e9; }
.flight-inspector .dialog-header h2 { font-size: 12px; text-transform: uppercase; }
.flight-inspector .dialog-header .eyebrow { display: none; }
.flight-inspector .form-grid { gap: 11px 9px; padding: 12px 10px; }
.flight-inspector .form-grid label { font-size: 10px; }
.flight-inspector input, .flight-inspector select { height: 27px; min-height: 27px; font-size: 11px; }
.flight-inspector .dialog-footer { padding: 10px; background: #d5e4ec; justify-content: flex-start; position: sticky; bottom: 0; }
.flight-inspector #form-error { margin: 8px 10px; }
.flight-inspector textarea { min-height: 80px; }
.data-surface { border: 1px solid var(--line); background: white; overflow: auto; }
body[data-view="flights"] #content > .data-surface { min-height: calc(100dvh - 229px); border-left: 0; border-right: 0; }
table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 11px; }
th { background: #dfe9f0; color: #415968; font-size: 10px; font-weight: 700; padding: 7px 8px; text-align: left; white-space: nowrap; position: sticky; top: 0; z-index: 1; }
td { border-top: 1px solid #dce4ea; padding: 6px 8px; white-space: nowrap; }
th:not(:last-child), td:not(:last-child) { border-right: 1px solid #e0e7ed; }
tbody tr:nth-child(even) { background: #f3f7fa; }
tbody tr:hover { background: #e8f2f6; }
tbody tr.selected { background: #fff0ca; }
td strong { font-size: 11px; font-weight: 700; }
td small { color: var(--muted); display: block; margin-top: 2px; font-size: 10px; }
td.actions { text-align: right; }
td .icon-button { width: 23px; height: 22px; margin-left: 3px; }
td .icon-button svg { width: 13px; height: 13px; }
.flight-link { border: 0; background: transparent; color: #1c6178; padding: 0; font-weight: 700; text-decoration: underline; }
.flight-table { min-width: 1080px; }
.route { display: flex; align-items: center; gap: 7px; }
.route svg { width: 12px; color: #8e9da6; }
.tag { display: inline-flex; padding: 1px 5px; border-radius: 2px; font-size: 10px; line-height: 1.6; background: #e7edf0; color: #536675; white-space: nowrap; }
.tag.good { background: var(--green-soft); color: #266557; }
.tag.info { background: #e0edf8; color: #386c9b; }
.tag.warn { background: var(--amber-soft); color: var(--amber); }
.tag.bad { background: #f8e5df; color: var(--red); }
.empty-state { padding: 35px 16px; text-align: center; color: var(--muted); }
.empty-state svg { display: block; width: 24px; height: 24px; color: #91aab9; margin: 0 auto 12px; }
.empty-state h3 { color: #526c7a; margin-bottom: 7px; }
.empty-state p { font-size: 11px; margin-bottom: 12px; }
.empty-state .button { margin-top: 5px; }
.empty-state .button svg { display: inline-block; width: 14px; height: 14px; margin: 0; }
.filter-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 0; padding: 5px 8px; background: #e7eff4; border: 1px solid var(--line); border-bottom: 0; }
.filter-bar .search { width: 200px; margin-right: auto; }
.filter-bar input, .filter-bar select { height: 26px; min-height: 26px; font-size: 11px; width: auto; max-width: 100%; padding: 3px 6px; }
.filter-bar label { font-size: 10px; display: flex; align-items: center; gap: 5px; }
.filter-bar .date-navigation { display: flex; align-items: center; gap: 4px; }
input, select, textarea { width: 100%; min-width: 0; border: 1px solid #aec2cf; border-radius: 1px; background: white; padding: 5px 7px; min-height: 29px; color: var(--ink); }
textarea { resize: vertical; min-height: 90px; }
label { display: grid; gap: 4px; font-size: 11px; font-weight: 500; }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 5px 8px; color: var(--muted); background: #e4edf3; border-bottom: 1px solid var(--line); font-size: 10px; }
.pagination > div { display: flex; gap: 5px; align-items: center; }
.metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0 0 12px; border: 1px solid var(--line); background: white; }
.metric { padding: 10px 14px; border-right: 1px solid var(--line); }
.metric:last-child { border: 0; }
.metric-label { display: flex; justify-content: space-between; gap: 10px; font-size: 11px; color: var(--muted); }
.metric strong { display: inline-block; font-size: 23px; margin: 4px 9px 0 0; font-weight: 500; }
.metric small { color: var(--muted); font-size: 10px; }
.metric:nth-child(2) svg { color: var(--blue); }
.metric:nth-child(3) svg { color: var(--amber); }
.metric:nth-child(4) svg { color: var(--green); }
.overview-grid { display: grid; grid-template-columns: minmax(0,1fr) 330px; gap: 12px; }
.section-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; min-height: 24px; gap: 10px; }
.section-heading h2 { font-size: 12px; }
.section-heading a { color: var(--green); font-size: 10px; }
.section-meta { color: var(--muted); font-size: 10px; }
.intelligence { background: #e3edf3; border-left: 1px solid #bacdd9; padding: 10px; }
.intelligence h2 { display: flex; align-items: center; gap: 6px; }
.intelligence h2 svg { color: var(--green); }
.intelligence-state { display: flex; align-items: center; gap: 8px; font-size: 10px; margin-bottom: 8px; }
.alert-item { border-top: 1px solid var(--line); padding: 10px 0; display: flex; align-items: flex-start; gap: 8px; }
.alert-item > svg { color: var(--amber); width: 14px; margin-top: 1px; flex-shrink: 0; }
.alert-item strong { font-size: 11px; }
.alert-item p { font-size: 11px; color: var(--muted); margin: 4px 0 0; }
.alert-item button { border: 0; background: transparent; text-align: left; padding: 0; }
.brief-strip { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); margin-top: 10px; }
.brief-strip strong { font-size: 11px; }
.brief-strip p { font-size: 10px; color: var(--muted); margin: 4px 0 0; }
.notice { padding: 10px 12px; margin: 10px 0; border-left: 3px solid #75a5ab; background: #e4f0f1; font-size: 11px; overflow-wrap: anywhere; }
.notice.error { background: #fcf0ec; border-color: var(--red); color: #963e35; }
.notice.warning { background: #fff4e5; border-color: #c89136; color: #805b25; }
.system-summary { display: flex; gap: 28px; flex-wrap: wrap; padding: 12px; border: 1px solid var(--line); background: #e1ecf2; margin-bottom: 12px; }
.system-summary label { color: var(--muted); font-size: 10px; }
.system-summary strong { color: var(--ink); font-size: 12px; }
.app-footer { padding: 5px 10px; display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); color: #718797; font-size: 9px; background: #dbe7ef; }
.footer-dot { width: 3px; height: 3px; margin: 0 6px 2px; }
dialog { border: 1px solid #96b0c0; border-radius: 3px; padding: 0; width: min(690px,calc(100vw - 24px)); max-height: calc(100dvh - 30px); color: var(--ink); box-shadow: 0 15px 60px #203a4c44; }
dialog::backdrop { background: #203a4c55; }
.dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--line); background: #dce8f0; }
.dialog-header h2 { font-size: 15px; }
.dialog-header .eyebrow { margin-bottom: 3px; }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; padding: 16px; }
.full { grid-column: 1 / -1; }
.dialog-footer { border-top: 1px solid var(--line); padding: 10px 16px; display: flex; justify-content: flex-end; gap: 8px; background: #eaf1f5; }
dialog .notice { margin: 0 16px 15px; }
.dialog-copy { padding: 16px; margin: 0; }
.brief-content { padding: 16px; overflow-wrap: anywhere; }
.brief-content .notice { margin: 0 0 14px; }
.brief-content ul { padding-left: 18px; font-size: 12px; }
.brief-content li { margin: 6px 0; }
.brief-text { white-space: pre-wrap; line-height: 1.7; font-size: 12px; padding-top: 14px; border-top: 1px solid var(--line); }
.muted { color: var(--muted); }
#toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); z-index: 100; padding: 10px 18px; background: #284c60; color: white; border-radius: 3px; max-width: calc(100vw - 24px); box-shadow: 0 5px 20px #0002; font-size: 12px; }
.login-body { display: grid; place-items: center; min-height: 100dvh; background: #e4edf3; border-top: 5px solid var(--nav); }
.login-shell { flex: none; width: min(390px,calc(100vw - 40px)); padding: 28px; background: white; border: 1px solid #bdcdd8; border-radius: 3px; }
.login-shell .login-brand { width: 100%; min-height: 0; padding: 4px 0 24px; border: 0; margin-bottom: 8px; justify-content: flex-start; background: transparent; }
.login-brand img { width: 154px; max-width: 50%; }
.login-panel h1 { font-size: 21px; margin-bottom: 12px; }
.login-form { display: grid; gap: 17px; margin-top: 22px; }
.login-form input { min-height: 37px; }
.login-form .button { min-height: 36px; margin-top: 3px; }
.login-footer { margin: 26px 0 0; color: var(--muted); font-size: 10px; display:flex; align-items:center; justify-content:space-between; }
.signup-link { margin:18px 0 0; font-size:12px; color:var(--green); text-decoration:underline; }
.signup-shell { margin:24px 0; }
.breadcrumb { display:flex; align-items:center; min-width:0; }
.breadcrumb .company-name { margin:0; max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink); }
.module-bar nav a { padding-left:11px; padding-right:11px; }
@media(max-width:760px) { .breadcrumb .company-name { max-width:130px; } }
.airport-field { position:relative; min-width:0; }
.airport-field label { margin-bottom:4px; }
.airport-options { position:absolute; top:48px; left:0; right:0; max-height:220px; overflow:auto; background:var(--paper); border:1px solid var(--line); z-index:10; box-shadow:0 5px 14px #0003; }
.airport-options [role="option"] { padding:7px 9px; cursor:pointer; border-bottom:1px solid var(--line); display:grid; gap:2px; font-size:11px; overflow-wrap:anywhere; }
.airport-options [role="option"]:hover, .airport-options [aria-selected="true"] { background:var(--green-soft); }
.airport-options strong { color:var(--ink); }
.airport-options small, .airport-status { font-size:10px; color:var(--muted); }
.airport-status { display:block; margin-top:3px; overflow-wrap:anywhere; }
.ops-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:5px 8px; background:#dfe9f0; border-bottom:1px solid var(--line); min-height:36px; }
.ops-toolbar > strong { font-size:11px; margin-left:auto; }
.segmented { display:flex; gap:0; }
.segmented .button { border-radius:0; min-height:26px; }
.segmented .button + .button { border-left:0; }
.segmented [aria-pressed="true"] { background:#d1e6e4; color:#125e5a; box-shadow:inset 0 -2px var(--green); }
body[data-schedule="true"]:not([data-editor="true"]) .workspace-grid { grid-template-columns:minmax(0,1fr); }
body[data-schedule="true"]:not([data-editor="true"]) .flight-inspector { display:none; }
#schedule-board { height:calc(100dvh - 230px); min-height:350px; background:var(--paper); }
.schedule-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; padding:8px; border-top:1px solid var(--line); font-size:10px; }
.schedule-legend { display:flex; flex-wrap:wrap; gap:12px; }
.schedule-legend span { display:flex; align-items:center; gap:4px; }
.schedule-legend i { display:inline-block; width:10px; height:10px; border:1px solid; }
#schedule-board .vis-timeline { border:0; font:11px Arial,Helvetica,sans-serif; }
#schedule-board .vis-panel.vis-top { background:var(--canvas); }
#schedule-board .vis-labelset .vis-label { color:var(--ink); border-color:var(--line); min-height:64px; }
#schedule-board .vis-labelset .vis-label .vis-inner { padding:14px 10px; width:150px; white-space:normal; overflow-wrap:anywhere; }
.vis-label small, .schedule-calendar th small { display:block; font-size:9px; color:var(--muted); margin-top:3px; font-weight:normal; }
#schedule-board .vis-foreground .vis-group { border-color:var(--line); min-height:64px; }
.vis-foreground .vis-group:nth-child(even) { background:#748c9710; }
#schedule-board .vis-time-axis .vis-text { color:var(--ink); font-size:10px; }
#schedule-board .vis-time-axis .vis-grid.vis-minor { border-color:#849dab30; }
#schedule-board .vis-time-axis .vis-grid.vis-major { border-color:var(--line); }
.vis-item.vis-range { border-radius:2px; min-width:3px; }
#schedule-board .vis-item .vis-item-content { padding:0; max-width:100%; width:100%; }
.schedule-flight { border:0; background:transparent; color:inherit; width:100%; text-align:left; padding:5px 4px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:10px; font-weight:bold; min-height:26px; }
.vis-item.vis-selected { outline:2px solid #d59a30; }
.vis-current-time { background:#d94a64; width:2px; }
.flight-planned, #schedule-board .vis-item.flight-planned { background:#f5e4ab; color:#624719; border-color:#b69c53; }
.flight-confirmed, #schedule-board .vis-item.flight-confirmed { background:#bce4d2; color:#154a3b; border-color:#58a48a; }
.flight-airborne, #schedule-board .vis-item.flight-airborne { background:#a9d8ed; color:#16465c; border-color:#4c9abd; }
.flight-completed, #schedule-board .vis-item.flight-completed { background:#d9e1e7; color:#405564; border-color:#99adb9; }
.flight-cancelled, #schedule-board .vis-item.flight-cancelled { background:#f4d6d5; color:#773a3a; border-color:#cb9190; text-decoration:line-through; }
.calendar-scroll { height:100%; overflow:auto; }
.schedule-calendar { table-layout:fixed; width:100%; min-width:1000px; height:auto; }
.schedule-calendar th { height:34px; text-align:center; }
.schedule-calendar th:first-child { width:150px; left:0; z-index:3; }
.schedule-calendar tbody th { position:sticky; left:0; top:auto; text-align:left; background:#e8eff3; padding:14px 10px; white-space:normal; }
.schedule-calendar td { height:110px; vertical-align:top; padding:4px; white-space:normal; }
.schedule-calendar td.weekend { background:#ae81570b; }
.calendar-flight { display:block; width:100%; border:1px solid; border-radius:2px; text-align:left; margin-bottom:4px; padding:4px; overflow-wrap:anywhere; }
.calendar-flight strong { font-size:10px; }
.calendar-flight small { color:inherit; font-size:9px; }
html[data-theme="dark"] { color-scheme:dark; --ink:#e2e8ec; --muted:#a4b1b9; --line:#465159; --paper:#22282c; --canvas:#1b2024; --nav:#202c31; --green:#328f84; --green-soft:#244f43; }
html[data-theme="dark"] :is(.app-header,.page-heading,.ops-toolbar,.filter-bar,.pagination,.app-footer,.system-summary,.intelligence,.flight-inspector,.dialog-header,.dialog-footer,#inspector-empty > h2,.flight-inspector .dialog-header,.flight-inspector .dialog-footer,.vis-panel.vis-top) { background:#2b343b; border-color:var(--line); color:var(--ink); }
html[data-theme="dark"] :is(.data-surface,.metrics,dialog,.login-shell,input,select,textarea) { background:var(--paper); border-color:var(--line); color:var(--ink); }
html[data-theme="dark"] .login-body { background:var(--canvas); }
html[data-theme="dark"] .login-brand img { filter: brightness(0) invert(1); }
html[data-theme="dark"] :is(th,.schedule-calendar tbody th) { background:#303b43; color:#d6e1e7; }
html[data-theme="dark"] :is(td,th,.alert-item,.brief-strip,.vis-panel) { border-color:var(--line); }
html[data-theme="dark"] tbody tr:nth-child(even) { background:#272e33; }
html[data-theme="dark"] tbody tr:hover { background:#303c43; }
html[data-theme="dark"] tbody tr.selected { background:#4c4733; }
html[data-theme="dark"] :is(.button,.icon-button) { background:#35434c; border-color:#5b6b75; color:var(--ink); }
html[data-theme="dark"] :is(.button,.icon-button):hover { background:#415661; }
html[data-theme="dark"] .button.primary { background:#267b72; border-color:#42988d; color:white; }
html[data-theme="dark"] .segmented [aria-pressed="true"] { background:#31584f; color:#d8f4ea; }
html[data-theme="dark"] :is(.flight-link,.section-heading a,.live-tag) { color:#87d9c5; }
html[data-theme="dark"] :is(.empty-state h3,.breadcrumb strong) { color:#c9d5dc; }
html[data-theme="dark"] .notice { background:#233f43; color:#cde4e5; }
html[data-theme="dark"] .notice.error { background:#4a2b2a; color:#ffc5bb; }
html[data-theme="dark"] .notice.warning { background:#493e28; color:#ffe0a6; }
html[data-theme="dark"] .tag.good { background:#2b5146; color:#b8e9d7; }
html[data-theme="dark"] .tag.info { background:#2d4960; color:#c1e5ff; }
html[data-theme="dark"] .tag.warn { background:#51462b; color:#f1d68c; }
html[data-theme="dark"] .tag.bad { background:#573535; color:#f3bcb7; }
@media(max-width:760px) {
    .ops-toolbar { gap:6px; }
    .ops-toolbar > strong { margin-left:0; }
    #schedule-board { min-height:380px; height:calc(100dvh - 320px); }
    #schedule-board .vis-labelset .vis-label .vis-inner { width:100px; padding:12px 6px; }
    .schedule-calendar th:first-child { width:110px; }
}
@media(min-width:1450px) { body[data-view="flights"] .workspace-grid { grid-template-columns: minmax(0,1fr) 380px; } }
@media(max-width:1100px) {
    .module-bar nav a { padding: 0 10px; font-size: 11px; }
    .module-actions .profile span { display: none; }
    .module-actions { gap: 5px; padding: 0 7px; }
    body[data-view="flights"] .workspace-grid { grid-template-columns: minmax(0,1fr); }
    .flight-inspector { display: none; }
    .overview-grid { grid-template-columns: minmax(0,1fr); }
}
@media(max-width:760px) {
    .module-bar { flex-wrap: wrap; position: relative; }
    .brand { width: 163px; min-height: 45px; }
    .mobile-menu { display: inline-grid; align-self: center; margin-left: 9px; }
    .module-bar nav { display: none; order: 4; width: 100%; flex-wrap: wrap; border-top: 1px solid #4b6372; }
    body.menu-open .module-bar nav { display: flex; }
    .module-bar nav a { min-height: 38px; flex: 1 0 25%; justify-content: center; padding: 5px 9px; }
    .app-header { padding: 3px 8px; }
    .header-right { gap: 9px; }
    #sidebar-status { display: none; }
    .breadcrumb { font-size: 10px; }
    .breadcrumb span { margin: 0 5px; }
    .page-heading { padding: 6px 8px; }
    .filter-bar .search { width: 100%; }
    .filter-bar select { max-width: 145px; }
    .filter-bar .date-navigation { flex-wrap: wrap; }
    .metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .metric:nth-child(2) { border-right: 0; }
    .metric:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
    .metric { padding: 9px 11px; }
    .metric small { display: block; }
    .form-grid { grid-template-columns: minmax(0,1fr); padding: 14px; gap: 11px; }
    .form-grid input, .form-grid select { min-height: 34px; font-size: 13px; }
    .dialog-header { padding: 12px 14px; }
    .system-summary { gap: 17px; }
    #utc-clock { display: none; }
}