:root{font-family:Inter,system-ui,Arial,sans-serif;color:#152033;background:#f5f7fb}*{box-sizing:border-box}body{margin:0}header{height:64px;background:#101827;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;position:sticky;top:0;z-index:10}.brand{color:#fff;text-decoration:none;font-weight:800;letter-spacing:.03em}.brand span{font-weight:400;color:#aeb8ca;margin-left:.5rem}nav{display:flex;align-items:center;gap:1.2rem}nav a,.link{color:#dbe4f3;text-decoration:none;background:none;border:0;padding:0;font:inherit;cursor:pointer}main{max-width:1280px;margin:0 auto;padding:32px 5vw}.page-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:24px}h1{margin:.1rem 0;font-size:2rem}h2{margin-top:0}.muted,.help{color:#667085}.card,.scan-card{background:#fff;border:1px solid #e5e9f0;border-radius:14px;padding:22px;margin-bottom:22px;box-shadow:0 2px 8px rgba(16,24,39,.04)}.scan-card{border:2px solid #2563eb}.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:22px}.stack{display:grid;gap:15px}label{display:grid;gap:6px;font-weight:600}input{width:100%;border:1px solid #cfd6e3;border-radius:9px;padding:11px 12px;font:inherit;background:#fff}button,.button{border:0;border-radius:9px;background:#2563eb;color:#fff;padding:11px 16px;font-weight:700;text-decoration:none;cursor:pointer;display:inline-block}.secondary{background:#e9eef8;color:#24324a}.danger{background:#c62828}.actions,.inline-form,#scan-form,.correction{display:flex;gap:10px;align-items:center}.inline-form input,#scan-form input:first-child{flex:1}.correction input{width:90px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.stat{background:#fff;border:1px solid #e5e9f0;border-radius:12px;padding:18px}.stat strong{display:block;font-size:1.65rem}.stat span{color:#667085}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid #edf0f5;white-space:nowrap}th{font-size:.8rem;text-transform:uppercase;color:#667085}.badge{padding:4px 9px;border-radius:999px;font-size:.8rem;font-weight:700}.badge.open{background:#dcfce7;color:#166534}.badge.closed{background:#e5e7eb;color:#374151}.badge.pending-review{background:#fef3e0;color:#b54708}.badge.review{background:#fef3e0;color:#b54708}.badge.missed{background:#fdeced;color:#c01c28}.alert{padding:13px 16px;border-radius:10px;margin-bottom:18px}.error{background:#fee2e2;color:#991b1b}.success{background:#dcfce7;color:#166534}.positive{color:#047857;font-weight:700}.negative{color:#b91c1c;font-weight:700}.variance-row{background:#fffaf0}.mono{font-family:ui-monospace,Consolas,monospace}.auth{min-height:75vh;display:grid;place-items:center}.auth .card{width:min(420px,100%)}ol{line-height:1.9}@media(max-width:800px){.grid.two,.stats{grid-template-columns:1fr 1fr}.page-head{align-items:flex-start;flex-direction:column}header{padding:0 16px}.brand span{display:none}main{padding:22px 14px}.actions{flex-wrap:wrap}#scan-form{display:grid;grid-template-columns:1fr 85px}#scan-form button{grid-column:1/-1}}@media(max-width:480px){.stats,.grid.two{grid-template-columns:1fr}nav a{display:none}}
select{width:100%;border:1px solid #cfd6e3;border-radius:9px;padding:11px 12px;font:inherit;background:#fff}.barcode-field{min-height:78px;font-size:2rem;font-weight:800;letter-spacing:.04em;border:3px solid #2563eb;padding:16px 20px}.qty-label{min-width:120px;font-size:.8rem;color:#667085}.qty-label input{font-size:1.25rem;font-weight:700;text-align:center}#scan-form button{min-height:78px;font-size:1.05rem}.scan-card h2{font-size:1.65rem}.inline-form select{width:auto;min-width:220px}@media(max-width:800px){.barcode-field{font-size:1.4rem;min-height:68px}#scan-form{grid-template-columns:1fr 100px}.qty-label{min-width:0}#scan-form button{min-height:56px}}
.loud-alert{border:3px solid #b91c1c;font-size:1.1rem;animation:alarm-pulse .35s ease-in-out 3}.scan-error-flash::before{content:"";position:fixed;inset:0;background:rgba(220,38,38,.22);pointer-events:none;z-index:9999;animation:screen-flash .3s ease-in-out 3}.location-assignment{display:grid;gap:8px;min-width:280px}.location-assignment select,select[multiple]{min-height:110px}.location-assignment button{width:max-content}@keyframes alarm-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.015);box-shadow:0 0 0 6px rgba(220,38,38,.18)}}@keyframes screen-flash{0%,100%{opacity:0}50%{opacity:1}}
.location-picker{display:grid;gap:10px}.location-add-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.location-add-row select{min-width:220px;min-height:44px}.location-chips{display:flex;gap:8px;flex-wrap:wrap;min-height:16px}.location-chip{display:inline-flex;align-items:center;gap:8px;background:#e8efff;border:1px solid #b8cbfa;border-radius:999px;padding:6px 7px 6px 12px;font-weight:700;color:#18376b}.location-chip-remove{display:inline-grid;place-items:center;width:25px;height:25px;padding:0;border:0;border-radius:50%;background:#c81e1e;color:#fff;font-size:20px;line-height:1;cursor:pointer}.location-chip-remove:hover{background:#991b1b}.location-assignment{display:grid;gap:8px;min-width:330px}.location-assignment .secondary{width:max-content}

/* v3.3 inventory insights dashboard */
.insights-head{align-items:flex-end}.month-filter{min-width:240px}.month-filter label{margin:0}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:18px 0}.metric-card{background:#fff;border:1px solid #dfe5ee;border-radius:14px;padding:20px;box-shadow:0 4px 14px rgba(30,50,80,.06)}.metric-card strong{display:block;font-size:1.75rem;margin:8px 0}.metric-card small{color:#667085}.metric-card.negative{border-left:5px solid #c62828}.metric-card.positive{border-left:5px solid #16803c}.metric-label{font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:#667085;font-weight:700}.section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.section-head h2{margin-bottom:4px}.text-negative{color:#b42318;font-weight:700}.text-positive{color:#067647;font-weight:700}.dashboard-lower{margin-top:18px}.insight-callout{padding:16px;border-radius:10px;margin-bottom:16px}.insight-callout.warning{background:#fff1f0;border:1px solid #fecdca}.insight-callout.good{background:#ecfdf3;border:1px solid #abefc6}.insight-callout p{margin:8px 0 0}.insights-table td,.insights-table th{white-space:nowrap}@media(max-width:1050px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.metric-grid{grid-template-columns:1fr}.insights-head{align-items:stretch}.month-filter{min-width:0;width:100%}}

/* v3.4 location coverage drill-down */
.metric-link{display:block;color:inherit;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.metric-link:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(30,50,80,.12);border-color:#94b4f8}.back-link{display:inline-block;margin-bottom:8px;color:#2563eb;text-decoration:none;font-weight:700}.coverage-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:18px 0}.coverage-stat{background:#fff;border:1px solid #dfe5ee;border-radius:14px;padding:18px;border-left:5px solid #667085}.coverage-stat span{font-size:.82rem;text-transform:uppercase;letter-spacing:.04em;color:#667085;font-weight:800}.coverage-stat strong{display:block;font-size:2rem;margin:5px 0}.coverage-stat small{color:#667085}.coverage-stat.open{border-left-color:#d97706}.coverage-stat.closed{border-left-color:#16803c}.coverage-stat.not-initiated{border-left-color:#98a2b3}.status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:5px 10px;font-size:.8rem;font-weight:800}.status-pill.open{background:#fff4d6;color:#92400e}.status-pill.closed{background:#dcfce7;color:#166534}.status-pill.not-initiated{background:#f2f4f7;color:#475467}.status-subtext{font-size:.78rem;color:#667085;margin-top:6px}.coverage-row.status-open{background:#fffdf5}.coverage-row.status-not_initiated{background:#fafafa}.coverage-actions{display:grid;gap:8px;min-width:145px}.coverage-actions .button{text-align:center;padding:8px 11px}.coverage-actions>a:not(.button){font-size:.85rem;text-align:center}.coverage-table td{vertical-align:top;white-space:normal;min-width:120px}.coverage-table th{white-space:nowrap}@media(max-width:1050px){.coverage-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.coverage-summary{grid-template-columns:1fr}}

/* v3.5 pending catalog items */
.pending-stat{border-left:5px solid #dc2626}.pending-item-row{background:#fff0f0}.pending-item-row:hover{background:#ffe4e4}.pending-label{display:inline-block;background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;border-radius:999px;padding:5px 10px;font-size:.78rem;font-weight:800;margin-bottom:10px}.approval-form{display:grid;grid-template-columns:minmax(220px,2fr) minmax(130px,1fr) minmax(150px,1fr) 120px 140px auto;gap:8px;align-items:end;min-width:900px}.approval-form label{font-size:.76rem;color:#667085}.approval-form input{min-width:0}.approve-button{background:#15803d;white-space:nowrap}.approve-button:hover{background:#166534}@media(max-width:950px){.approval-form{grid-template-columns:1fr 1fr;min-width:560px}.approval-form .approve-button{grid-column:1/-1}}

/* v3.6 location history and monthly count controls */
.location-history-card{position:relative;min-height:465px}.location-search-wrap{position:relative;margin-bottom:14px}.location-suggestions{position:absolute;left:0;right:0;top:100%;z-index:20;background:#fff;border:1px solid #cfd6e3;border-radius:9px;box-shadow:0 10px 24px rgba(16,24,39,.14);max-height:220px;overflow:auto}.location-suggestion{display:block;width:100%;text-align:left;background:#fff;color:#152033;border:0;border-radius:0;padding:11px 13px;font-weight:600}.location-suggestion:hover,.location-suggestion:focus{background:#eef4ff}.location-history-list{min-height:270px}.location-history-entry{padding:12px 4px;border-bottom:1px solid #edf0f5}.location-history-entry a{text-decoration:none;color:#1d4ed8}.location-history-entry p{margin:4px 0 0}.location-code{display:inline-block;margin-left:8px;padding:2px 7px;border-radius:999px;background:#eef2f7;color:#475467;font-size:.75rem;font-weight:800}.card-pagination{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:15px}.card-pagination button{padding:8px 12px}.card-pagination button:disabled{opacity:.45;cursor:not-allowed}.system-date{display:grid;gap:3px;padding:12px 14px;border:1px solid #d7e0ed;background:#f8fafc;border-radius:10px}.system-date span{font-size:.78rem;text-transform:uppercase;color:#667085;font-weight:800}.system-date small{color:#667085}.system-date strong{font-size:1.05rem}@media(max-width:520px){.card-pagination{font-size:.88rem}.card-pagination button{padding:8px 9px}}

/* v3.7 location timezone and AJAX count-location picker */
.ajax-location-picker{position:relative;display:grid;gap:6px}.ajax-location-picker .location-suggestions{top:72px}.ajax-location-suggestion{display:grid;gap:3px}.ajax-location-suggestion span{font-size:.82rem;color:#667085;font-weight:500}.location-no-result{padding:13px;color:#667085}.selected-location{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #b8cbfa;background:#eef4ff;border-radius:10px;padding:11px 12px}.selected-location strong{color:#18376b}.selected-location span{font-weight:800;color:#475467}.selected-location small{display:block;color:#667085;margin-top:3px}.selected-location .location-chip-remove{flex:0 0 auto}.ajax-location-picker input[readonly]{background:#f8fafc;color:#475467}

/* v3.8 administration workspace */
.admin-section-head{align-items:center;margin-bottom:14px}.admin-count{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#eef2f7;color:#475467;font-size:.82rem;font-weight:800;white-space:nowrap}.admin-search-wrap{position:relative;margin-bottom:14px}.admin-search-wrap input,.user-toolbar input{min-height:46px}.admin-locations-table .compact{padding:7px 10px;font-size:.84rem}.admin-pagination{justify-content:flex-start;flex-wrap:wrap}.admin-pagination #admin-location-page-status{min-width:88px;text-align:center}.page-number-wrap{display:flex;gap:5px}.page-number{min-width:34px;padding:7px 9px;background:#fff;color:#344054;border:1px solid #d0d5dd}.page-number.active{background:#2563eb;color:#fff;border-color:#2563eb}.empty-state{padding:24px;text-align:center;color:#667085;background:#f8fafc;border:1px dashed #cfd6e3;border-radius:10px}.user-toolbar{display:grid;grid-template-columns:minmax(260px,2fr) minmax(160px,1fr) minmax(150px,1fr);gap:10px;margin-bottom:16px}.user-card-list{display:grid;gap:12px}.user-management-card{border:1px solid #dfe5ee;border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 3px 12px rgba(30,50,80,.04)}.user-card-summary{display:grid;grid-template-columns:52px minmax(170px,1.1fr) minmax(220px,1.5fr) auto;gap:14px;align-items:center;padding:16px}.user-avatar{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#e8efff;color:#1d4ed8;font-size:1.25rem;font-weight:900}.user-identity>strong{font-size:1.05rem}.user-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:6px}.role-badge{display:inline-flex;border-radius:999px;padding:4px 9px;font-size:.76rem;font-weight:800}.role-badge.admin{background:#ede9fe;color:#5b21b6}.role-badge.owner{background:#fef0e8;color:#b54708}.role-badge.manager{background:#dbeafe;color:#1d4ed8}.role-badge.employee{background:#f2f4f7;color:#475467}.user-location-summary{display:grid;gap:2px}.user-location-summary>strong{font-size:1.25rem}.user-location-summary small{color:#667085;white-space:normal}.user-edit-toggle{white-space:nowrap}.user-card-editor{border-top:1px solid #e4e7ec;background:#f8fafc;padding:18px}.user-editor-grid{display:grid;grid-template-columns:2fr 1.2fr 1fr;gap:22px}.user-editor-grid section{min-width:0}.user-editor-grid h3{margin:0 0 11px;font-size:1rem}.compact-form{gap:9px}.compact-form button,.user-editor-grid form>button{width:max-content}.admin-users-card .location-assignment{min-width:0}.admin-users-card .location-add-row select{min-width:180px;flex:1}.admin-users-card .location-chip{max-width:100%}@media(max-width:980px){.user-card-summary{grid-template-columns:52px 1fr auto}.user-location-summary{grid-column:2/-1}.user-editor-grid{grid-template-columns:1fr 1fr}.user-editor-grid section:first-child{grid-column:1/-1}}@media(max-width:680px){.user-toolbar{grid-template-columns:1fr}.user-card-summary{grid-template-columns:46px 1fr}.user-edit-toggle{grid-column:1/-1;width:100%}.user-location-summary{grid-column:1/-1}.user-editor-grid{grid-template-columns:1fr}.user-editor-grid section:first-child{grid-column:auto}.admin-pagination{justify-content:center}.page-number-wrap{order:3;width:100%;justify-content:center}}

/* v3.9 location performance and state controls */
.performance-filter-bar{display:grid;grid-template-columns:minmax(170px,1.2fr) minmax(150px,1fr) minmax(170px,1fr) auto auto;gap:12px;align-items:end;padding:14px;border:1px solid var(--border,#dfe5ec);border-radius:12px;background:#f8fafc;margin:12px 0}.performance-filter-bar label{margin:0}.performance-filter-bar select{width:100%}.performance-filter-bar button,.performance-filter-bar .button{white-space:nowrap}.performance-summary-strip{display:flex;flex-wrap:wrap;gap:10px 22px;padding:10px 2px 14px;color:#52606d;font-size:.9rem}.performance-table th{white-space:nowrap}.rank-pill{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:30px;border-radius:999px;background:#e8eef8;font-weight:800}.state-badge{display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;background:#edf2f7;font-size:.78rem;font-weight:800;letter-spacing:.04em}.location-performance-card{grid-column:1/-1}.performance-heading{margin-bottom:4px}
@media(max-width:900px){.performance-filter-bar{grid-template-columns:1fr 1fr}.performance-filter-bar button,.performance-filter-bar .button{width:100%;text-align:center}}@media(max-width:580px){.performance-filter-bar{grid-template-columns:1fr}.performance-summary-strip{display:grid;gap:5px}}
.inline-state-form{margin:0}.inline-state-form select{min-width:72px;padding:7px 8px;font-weight:700}
.locked-finish{opacity:.9}.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.65);display:grid;place-items:center;padding:20px;z-index:1000}.modal-backdrop[hidden]{display:none}.modal-card{background:#fff;border-radius:16px;max-width:620px;width:100%;padding:24px;box-shadow:0 30px 80px rgba(0,0,0,.3)}.modal-actions{display:flex;gap:10px;flex-wrap:wrap}.pending-barcode-list{max-height:160px;overflow:auto;background:#fff1f2;border:1px solid #fecdd3;border-radius:10px;padding:12px 32px}.override-panel{margin-top:20px;border-top:1px solid #ddd;padding-top:12px}.override-panel textarea{min-height:90px}.stat-link{text-decoration:none;color:inherit;display:block;margin-bottom:14px}.pending-approval-card{border-left:5px solid #dc2626;background:#fff7f7}.approval-global{grid-template-columns:2fr 1fr 1fr 1fr 1fr auto}.empty-state{text-align:center;padding:40px}.approval-head{display:flex;justify-content:space-between;gap:16px}@media(max-width:900px){.approval-global{grid-template-columns:1fr}}

/* v4.1 session directory and AJAX feedback */
.card-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.card-toolbar h2{margin-bottom:.2rem}.compact-search{min-width:min(360px,100%);font-size:.82rem}.compact-search input{margin-top:.3rem}.pagination-bar{display:flex;align-items:center;justify-content:center;gap:.55rem;flex-wrap:wrap;margin-top:1rem}.page-number-group{display:flex;gap:.3rem}.inline-empty{padding:1rem;text-align:center}.approval-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.compact{padding:.55rem .8rem}.ajax-action-form button[disabled]{opacity:.55;cursor:wait}
@media(max-width:700px){.card-toolbar,.approval-head{align-items:stretch;flex-direction:column}.compact-search{min-width:0}}

.header-eastern-clock{margin-left:auto;display:grid;line-height:1.1;text-align:right;min-width:170px;padding-left:16px;border-left:1px solid rgba(255,255,255,.18)}
.header-eastern-clock span,.header-eastern-clock small{font-size:.72rem;opacity:.78}.header-eastern-clock strong{font-size:.92rem;margin:3px 0}
.clickable-location-row{cursor:pointer}.clickable-location-row:hover{background:rgba(37,99,235,.06)}.location-performance-link{text-decoration:none}
.selected-month-row{background:#eef6ff!important;outline:2px solid #60a5fa;outline-offset:-2px}.selected-month-row td:first-child{font-weight:700}
@media(max-width:850px){.header-eastern-clock{order:3;width:100%;border-left:0;padding:6px 0 0;text-align:left;grid-template-columns:auto auto 1fr;gap:8px;align-items:center}}
.catalog-actions{display:flex;gap:.65rem;flex-wrap:wrap;align-items:center}.catalog-actions .button{white-space:nowrap}.import-progress{margin-top:1rem;padding:1rem;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc}.import-progress-head{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.55rem}.progress-track{height:18px;background:#e2e8f0;border-radius:999px;overflow:hidden}.progress-bar{height:100%;background:linear-gradient(90deg,#2563eb,#16a34a);transition:width .25s ease;border-radius:999px}.import-progress.success{border-color:#86efac;background:#f0fdf4}.import-progress.error{border-color:#fca5a5;background:#fef2f2}

/* ==========================================================================\n   v5.0 enterprise interface\n   ========================================================================== */
:root{
  --navy-950:#06142f;--navy-900:#071a3d;--navy-850:#0a2350;--blue-600:#1769e0;
  --blue-500:#2f7df4;--blue-100:#e8f1ff;--surface:#fff;--canvas:#f4f7fc;
  --text:#101c36;--muted-v5:#68758d;--line:#e2e8f2;--shadow:0 8px 28px rgba(19,42,82,.08);
  --radius-lg:16px;--radius-md:12px;
}
html{scroll-behavior:smooth}body{background:var(--canvas);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.app-header{height:82px;padding:0;background:linear-gradient(100deg,var(--navy-950),var(--navy-900) 58%,#08275a);box-shadow:0 2px 12px rgba(5,20,47,.24);z-index:100}
.header-inner{width:100%;max-width:1680px;margin:auto;height:100%;padding:0 30px;display:flex;align-items:center;gap:22px}
.app-brand{min-width:190px;display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}
.brand-mark{width:42px;height:42px;border:1px solid rgba(255,255,255,.55);border-radius:11px;display:grid;place-items:center;font-weight:900;font-size:18px;background:linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.03));box-shadow:inset 0 1px rgba(255,255,255,.25)}
.brand-copy{display:grid;line-height:1.05}.brand-copy strong{font-size:18px;letter-spacing:.035em}.brand-copy small{font-size:10px;text-transform:uppercase;letter-spacing:.18em;color:#b8c8e5;margin-top:5px;font-weight:700}
.primary-navigation{display:flex;align-items:center;gap:4px;flex:1;min-width:0}
.primary-navigation .nav-item{position:relative;display:flex;align-items:center;gap:8px;padding:11px 12px;border-radius:10px;color:#d9e3f4;text-decoration:none;font-weight:650;font-size:14px;white-space:nowrap;transition:background .18s,color .18s,transform .18s}
.primary-navigation .nav-item svg{width:19px;height:19px;fill:currentColor;opacity:.92;flex:none}
.primary-navigation .nav-item:hover{color:#fff;background:rgba(255,255,255,.09);transform:translateY(-1px)}
.primary-navigation .nav-item.active{color:#fff;background:linear-gradient(135deg,#164d9d,#1a64d3);box-shadow:0 7px 18px rgba(0,83,194,.28)}
.nav-alert-dot{width:7px;height:7px;border-radius:50%;background:#ff5b5b;box-shadow:0 0 0 3px rgba(255,91,91,.16)}
.header-tools{display:flex;align-items:center;gap:14px;margin-left:auto}
.header-eastern-clock{position:static;min-width:180px;padding:5px 15px;border-left:1px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;gap:10px;text-align:left;color:#fff}
.header-eastern-clock>svg{width:25px;height:25px;fill:#d9e7ff;flex:none}.clock-copy{display:grid;line-height:1.08}.clock-copy small{color:#bdcbe3;font-size:11px}.clock-copy strong{font-size:15px;margin:3px 0}.clock-copy em{font-style:normal;color:#c6d2e6;font-size:10px}
.user-menu-wrap{position:relative}.user-menu-button{background:transparent;padding:7px 8px;border:1px solid transparent;border-radius:11px;display:flex;align-items:center;gap:9px;color:#fff}.user-menu-button:hover,.user-menu-button[aria-expanded="true"]{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)}
.user-avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#2e83f6,#22b5b2);font-weight:850}.user-copy{display:grid;text-align:left;line-height:1.1}.user-copy strong{font-size:13px}.user-copy small{color:#b9c9e4;font-size:10px;margin-top:3px}.chevron{width:18px;height:18px;fill:currentColor}
.user-menu{position:absolute;right:0;top:calc(100% + 12px);width:230px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 18px 50px rgba(6,20,47,.2);padding:8px;color:var(--text);z-index:120}.user-menu[hidden]{display:none}.user-menu:before{content:"";position:absolute;right:25px;top:-6px;width:11px;height:11px;background:#fff;border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.user-menu-heading{display:grid;padding:10px 11px 12px;border-bottom:1px solid var(--line);margin-bottom:5px}.user-menu-heading span{font-size:12px;color:var(--muted-v5);margin-top:3px}.user-menu a,.user-menu-logout{width:100%;display:block;text-align:left;color:#273550;text-decoration:none;background:transparent;border:0;border-radius:8px;padding:10px 11px;font:inherit;font-size:13px;font-weight:650}.user-menu a:hover,.user-menu-logout:hover{background:#f0f5fd;color:#125bc6}
.mobile-menu-button{display:none;width:42px;height:42px;padding:10px;background:transparent;border:1px solid rgba(255,255,255,.18)}.mobile-menu-button span{display:block;height:2px;background:#fff;margin:4px 0;border-radius:2px}
.login-header{height:74px;display:flex;align-items:center;padding:0 5vw;background:linear-gradient(100deg,var(--navy-950),var(--navy-900));color:#fff}
main#app-main,body.app-shell main{max-width:1440px;padding:36px 34px 54px;margin:auto;width:100%}
.page-head{margin-bottom:26px}.page-head h1,h1{font-size:clamp(1.75rem,2.3vw,2.35rem);letter-spacing:-.035em;color:#0b1833}.page-head .muted{max-width:850px;line-height:1.5}
h2{letter-spacing:-.018em;color:#10203e}.muted,.help{color:var(--muted-v5)}
.card,.scan-card,.metric-card,.stat{border-color:var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow)}.card{padding:24px}.metric-card{padding:23px;min-height:154px;transition:transform .18s,box-shadow .18s}.metric-card:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(19,42,82,.12)}
.metric-label{font-size:.77rem;letter-spacing:.07em}.metric-card strong{letter-spacing:-.035em;font-size:1.9rem}
button,.button{border-radius:10px;box-shadow:0 3px 10px rgba(37,99,235,.12);transition:transform .15s,filter .15s,box-shadow .15s}button:hover,.button:hover{filter:brightness(1.04);transform:translateY(-1px);box-shadow:0 6px 15px rgba(37,99,235,.18)}button:disabled{transform:none;box-shadow:none;cursor:not-allowed;opacity:.55}
input,select,textarea{border-color:#cbd5e3;border-radius:10px;min-height:43px;transition:border .15s,box-shadow .15s}input:focus,select:focus,textarea:focus{outline:none;border-color:#4e8deb;box-shadow:0 0 0 3px rgba(47,125,244,.14)}
.table-wrap{border:1px solid var(--line);border-radius:12px;background:#fff}table{background:#fff}thead{background:#f7f9fc}th{color:#56647c;font-size:.73rem;letter-spacing:.045em;padding:13px 14px}td{padding:13px 14px}tbody tr{transition:background .12s}tbody tr:hover{background:#f8fbff}
.badge,.status-pill,.state-badge,.rank-pill{font-weight:750}.section-head{margin-bottom:12px}
.auth{min-height:calc(100vh - 74px)}.auth .card{border:0;box-shadow:0 24px 70px rgba(7,26,61,.16);padding:32px}
.mobile-nav-backdrop{position:fixed;inset:82px 0 0;background:rgba(4,14,34,.55);z-index:89}.mobile-nav-backdrop[hidden]{display:none}
@media(max-width:1240px){.header-inner{padding:0 18px;gap:12px}.app-brand{min-width:160px}.brand-copy strong{font-size:15px}.primary-navigation .nav-item{padding:10px 9px;font-size:12px;gap:6px}.primary-navigation .nav-item svg{width:17px}.header-eastern-clock{min-width:150px;padding:5px 10px}.user-copy{display:none}}
@media(max-width:960px){
 .app-header{height:72px}.header-inner{padding:0 14px}.mobile-menu-button{display:block;order:3;margin-left:auto}.header-tools{order:2;margin-left:auto}.header-eastern-clock{display:none}.user-menu-button{padding:3px}.user-copy,.user-menu-button .chevron{display:none}
 .primary-navigation{position:fixed;top:72px;left:0;bottom:0;width:min(330px,87vw);padding:16px;background:#081b3e;display:flex;flex-direction:column;align-items:stretch;gap:5px;transform:translateX(-105%);transition:transform .22s ease;z-index:100;box-shadow:18px 0 40px rgba(4,14,34,.28);overflow:auto}
 .primary-navigation.open{transform:translateX(0)}.primary-navigation .nav-item{font-size:14px;padding:13px 14px}.primary-navigation .nav-item svg{width:20px;height:20px}
 .mobile-nav-backdrop{inset:72px 0 0}.user-menu{right:0;top:calc(100% + 10px)}
 main#app-main,body.app-shell main{padding:26px 18px 45px}
}
@media(max-width:620px){.app-brand{min-width:0}.brand-copy small{display:none}.brand-mark{width:38px;height:38px}.metric-grid,.stats,.grid.two{grid-template-columns:1fr}.card{padding:18px}.page-head{gap:13px}.header-inner{gap:8px}.user-avatar{width:34px;height:34px}}
.catalog-filter-grid{display:grid;grid-template-columns:minmax(240px,2fr) repeat(3,minmax(160px,1fr)) auto;gap:14px;align-items:end;margin:18px 0}.filter-actions{display:flex;gap:8px;align-items:center}.pagination{display:flex;justify-content:center;align-items:center;gap:16px;padding-top:18px}.pagination .disabled{pointer-events:none;opacity:.45}.danger.small{padding:8px 12px;font-size:.82rem}.inline-delete-form{margin:0}.product-catalog-card table{min-width:1180px}@media(max-width:1100px){.catalog-filter-grid{grid-template-columns:1fr 1fr}}@media(max-width:680px){.catalog-filter-grid{grid-template-columns:1fr}.filter-actions{width:100%}}

/* v5.3 professional navigation and system information */
.nav-dropdown{position:relative}.nav-dropdown>.nav-item{border:0;background:transparent;box-shadow:none}.nav-dropdown.active>.nav-item{color:#fff;background:linear-gradient(135deg,#164d9d,#1a64d3);box-shadow:0 7px 18px rgba(0,83,194,.28)}
.nav-chevron{width:15px!important;height:15px!important;transition:transform .18s}.nav-dropdown.open .nav-chevron{transform:rotate(180deg)}
.nav-dropdown-menu{position:absolute;top:calc(100% + 12px);right:0;width:310px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 22px 55px rgba(4,18,47,.23);z-index:140}.nav-dropdown-menu[hidden]{display:none}.nav-dropdown-menu:before{content:"";position:absolute;right:28px;top:-6px;width:11px;height:11px;background:#fff;border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.nav-dropdown-menu a{display:grid;gap:3px;padding:12px 13px;border-radius:10px;text-decoration:none;color:#17233b}.nav-dropdown-menu a:hover,.nav-dropdown-menu a.active{background:#edf4ff;color:#0e59c5}.nav-dropdown-menu strong{font-size:13px}.nav-dropdown-menu small{font-size:11px;color:#738097;line-height:1.35}
.eyebrow{display:block;margin-bottom:6px;font-size:.72rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#3971bd}.system-page-head{align-items:flex-end}.release-badge{padding:10px 15px;border-radius:999px;background:#e8f1ff;color:#135ab9;font-weight:850;box-shadow:inset 0 0 0 1px #c8ddfb}
.system-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(115deg,#071a3d,#0b3474);color:#fff;border:0}.system-hero>div:first-child{display:flex;align-items:center;gap:16px}.system-product-mark{width:58px;height:58px;display:grid;place-items:center;border-radius:15px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.1);font-weight:900;font-size:22px}.system-hero h2{margin:0;color:#fff}.system-hero p{margin:5px 0 0;color:#c5d5ee}.health-indicator{display:grid;grid-template-columns:auto auto;column-gap:8px;align-items:center;text-align:right}.health-indicator>span{width:10px;height:10px;border-radius:50%;background:#31d47b;box-shadow:0 0 0 5px rgba(49,212,123,.14)}.health-indicator small{grid-column:1/3;color:#bdd0ed;margin-top:5px}
.system-stat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;margin-bottom:22px}.system-stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:19px;box-shadow:var(--shadow);display:grid;gap:5px}.system-stat span{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.055em;color:#65738a}.system-stat strong{font-size:1.8rem;letter-spacing:-.04em;color:#10203e}.system-stat small{color:#7a879b}.system-stat.attention{border-color:#f2c86f;background:#fffaf0}.system-stat.attention strong{color:#b06800}
.system-grid{align-items:start}.system-details{margin:0}.system-details>div{display:grid;grid-template-columns:minmax(150px,1fr) 1.25fr;gap:20px;padding:14px 0;border-bottom:1px solid #e8edf5}.system-details>div:last-child{border:0}.system-details dt{color:#68758d;font-weight:650}.system-details dd{margin:0;text-align:right;font-weight:750;color:#16243d}.system-details dd small{display:block;font-weight:500;color:#7c889a;margin-top:4px}.environment-pill{display:inline-block;padding:5px 9px;border-radius:999px;background:#eef4ff;color:#175ec3;font-size:.8rem}.status-online{display:inline-flex;align-items:center;gap:7px;color:#128049}.status-online i{width:8px;height:8px;border-radius:50%;background:#27bd68}.storage-meter{height:10px;background:#e7edf5;border-radius:999px;overflow:hidden;margin-top:18px}.storage-meter span{display:block;height:100%;background:linear-gradient(90deg,#1769e0,#20a873);border-radius:inherit}.release-note-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.release-note-grid>div{padding:17px;border:1px solid #e3eaf4;border-radius:12px;background:#f9fbfe}.release-note-grid strong{color:#173e78}.release-note-grid p{margin:7px 0 0;color:#66758c;line-height:1.5}
@media(max-width:1200px){.system-stat-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:960px){.nav-dropdown{width:100%}.nav-dropdown>.nav-item{width:100%}.nav-dropdown-menu{position:static;width:100%;margin-top:5px;box-shadow:none;background:#0d2a5b;border-color:rgba(255,255,255,.12)}.nav-dropdown-menu:before{display:none}.nav-dropdown-menu a{color:#fff}.nav-dropdown-menu a:hover,.nav-dropdown-menu a.active{background:rgba(255,255,255,.1);color:#fff}.nav-dropdown-menu small{color:#b7c9e7}.system-stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.system-hero{align-items:flex-start;flex-direction:column}.health-indicator{text-align:left}.system-stat-grid,.release-note-grid{grid-template-columns:1fr}.system-details>div{grid-template-columns:1fr;gap:5px}.system-details dd{text-align:left}}

/* v5.4 Backup & Recovery */
.backup-console{margin-top:1.25rem}.backup-grid{align-items:start}.backup-settings-form,.drive-setup{border:1px solid var(--border,#dfe5ec);border-radius:14px;padding:1rem}.section-head.compact{margin-bottom:.75rem}.section-head.compact h3{margin:.1rem 0}.check-row{display:flex!important;align-items:center;gap:.55rem;font-weight:700;margin:.75rem 0}.check-row input{width:auto}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.form-grid label{display:grid;gap:.35rem;font-weight:600}.form-grid input,.form-grid select,.upload-row input{width:100%}.upload-row{display:flex;gap:.6rem;align-items:center;margin:1rem 0}.setup-steps{background:#f7f9fc;border-radius:10px;padding:.85rem;margin:.8rem 0}.setup-steps ol{margin:.5rem 0 0 1.25rem}.setup-steps li{margin:.35rem 0}.status-chip{display:inline-flex;padding:.25rem .55rem;border-radius:999px;background:#eef2f6;font-size:.78rem;font-weight:700}.status-chip.online,.status-chip.completed{background:#e7f8ee;color:#176b3a}.status-chip.running{background:#e8f1ff;color:#1859a9}.status-chip.failed,.status-chip.completed_with_warning{background:#fff0e5;color:#9a4600}.notice{padding:.75rem 1rem;border-radius:10px;margin:.8rem 0}.notice.success{background:#e7f8ee;color:#176b3a}.notice.warning{background:#fff0e5;color:#884000}.security-note{margin-top:1rem}@media(max-width:800px){.form-grid{grid-template-columns:1fr}.upload-row{align-items:stretch;flex-direction:column}}

/* v5.5 Location lifecycle management */
.table-subtext{display:block;color:#758197;font-size:.78rem;margin-top:.25rem}.location-action-row{display:flex;gap:.45rem;align-items:center}.location-manage-menu{position:relative}.location-manage-menu>summary{list-style:none;cursor:pointer}.location-manage-menu>summary::-webkit-details-marker{display:none}.location-manage-panel{}.location-manage-panel h3{margin:.15rem 0 .7rem}.location-status-actions{border-top:1px solid #e5eaf2;margin-top:1rem;padding-top:1rem}.danger-zone{border:1px solid #fecaca;background:#fff7f7;border-radius:12px;padding:14px;margin-top:1rem}.danger-zone h3{color:#b91c1c}.danger-zone p{color:#7f1d1d;font-size:.86rem;line-height:1.45}.alert.success{background:#e7f8ee;color:#176b3a;border:1px solid #b7ebca}@media(max-width:760px){.location-action-row{align-items:stretch;flex-direction:column}.location-manage-menu,.location-manage-menu>summary{width:100%}.admin-locations-table th:nth-child(4),.admin-locations-table td:nth-child(4),.admin-locations-table th:nth-child(5),.admin-locations-table td:nth-child(5){display:none}}

/* v5.6 inventory analytics */
.analytics-workspace{overflow:hidden}.analytics-heading{margin-bottom:1rem}.analytics-filter-bar{display:grid;grid-template-columns:repeat(5,minmax(140px,1fr)) auto;gap:.8rem;align-items:end;padding:1rem;border:1px solid var(--border);border-radius:14px;background:var(--surface-soft,#f7f9fc);margin-bottom:1.2rem}.analytics-filter-bar label{font-size:.82rem;font-weight:700;color:var(--muted);display:grid;gap:.35rem}.analytics-filter-bar select{width:100%}.analytics-filter-bar button{height:42px}.analytics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.analytics-card{border:1px solid var(--border);border-radius:16px;padding:1rem;background:var(--surface,#fff);min-width:0}.analytics-card-wide{grid-column:1/-1}.analytics-card-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:.75rem}.analytics-card-head h3{margin:0 0 .2rem}.analytics-card-head p{margin:0}.chart-type-badge{white-space:nowrap;font-size:.72rem;font-weight:800;padding:.25rem .55rem;border-radius:999px;background:#eaf1ff;color:#174ea6}.chart-canvas-wrap{position:relative;min-height:280px}.chart-canvas-tall{min-height:360px}.chart-canvas-wrap canvas{display:block;width:100%;height:100%}.chart-empty{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-weight:700;text-align:center}.chart-legend{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem .75rem;margin-top:.8rem}.chart-legend-item{display:flex;align-items:center;justify-content:space-between;gap:.65rem;font-size:.8rem}.chart-legend-label{display:flex;align-items:center;min-width:0;gap:.45rem}.chart-legend-label span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chart-legend-dot{width:10px;height:10px;border-radius:3px;flex:0 0 auto}.chart-legend-value{font-weight:800;white-space:nowrap}@media(max-width:1100px){.analytics-filter-bar{grid-template-columns:repeat(3,minmax(150px,1fr))}.analytics-filter-bar button{width:100%}}@media(max-width:760px){.analytics-filter-bar{grid-template-columns:1fr}.analytics-grid{grid-template-columns:1fr}.analytics-card-wide{grid-column:auto}.chart-legend{grid-template-columns:1fr}.chart-canvas-wrap{min-height:250px}}

/* v5.8 Pending Review master-data selectors */
.approval-select-form label{display:flex;flex-direction:column;gap:6px;font-size:.76rem;color:#667085}
.approval-select-form select,.approval-select-form .new-master-value{width:100%;min-width:0}
.approval-select-form .new-master-value{margin-top:4px;border-color:#2563eb;background:#eff6ff}

.profile-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.profile-field{border:1px solid var(--border);border-radius:12px;padding:14px;background:var(--surface)}.profile-field>label:first-child{display:block}.profile-field input[type=text],.profile-field input[type=date],.profile-field textarea,.profile-field input[type=file]{width:100%;margin-top:6px}.report-toggle{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border)}@media(max-width:800px){.profile-fields{grid-template-columns:1fr}}

/* v6.2: native hidden must override the chart empty-state layout. */
.chart-empty[hidden]{display:none!important}
.analytics-actions{display:flex;gap:.5rem;align-items:center}.analytics-actions .button{height:42px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}@media(max-width:1100px){.analytics-actions{width:100%}.analytics-actions>*{flex:1}}

/* v6.3 live analytics refresh */
.analytics-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.analytics-live-status{min-width:150px;color:var(--muted,#64748b);font-size:.88rem;font-weight:650}.analytics-workspace.analytics-loading .analytics-grid{opacity:.55;pointer-events:none}.analytics-workspace.analytics-loading{cursor:progress}.analytics-actions button[disabled]{opacity:.7;cursor:wait}
.pending-photo-panel{border:2px solid var(--accent,#2563eb);margin:1rem 0}.pending-photo-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.photo-capture-card{display:flex;flex-direction:column;gap:.55rem;border:1px dashed #94a3b8;border-radius:12px;padding:1rem;background:#f8fafc;cursor:pointer}.photo-capture-card input[type=file]{position:absolute;inline-size:1px;block-size:1px;opacity:0}.photo-capture-card img{width:100%;max-height:280px;object-fit:contain;border-radius:10px;background:#fff;border:1px solid #dbe3ef}.photo-upload-actions{grid-column:1/-1;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.pending-photo-review{display:grid;grid-template-columns:repeat(2,minmax(0,260px));gap:1rem;margin:1rem 0}.pending-photo-review>div{display:flex;flex-direction:column;gap:.45rem}.pending-photo-review img{width:100%;height:220px;object-fit:contain;background:#f8fafc;border:1px solid #dbe3ef;border-radius:10px}.photo-missing{height:120px;display:grid;place-items:center;border:1px dashed #94a3b8;border-radius:10px;color:#64748b;background:#f8fafc}.pending-review-action{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.6rem}@media(max-width:700px){.pending-photo-form,.pending-photo-review{grid-template-columns:1fr}}
/* v6.5.1 sequential camera workflow */
.photo-workflow-backdrop{position:fixed;inset:0;z-index:1200;background:rgba(15,23,42,.72);display:grid;place-items:center;padding:1rem}.photo-workflow-backdrop[hidden]{display:none}.photo-workflow-modal{width:min(640px,100%);max-height:94vh;overflow:auto;background:#fff;border-radius:18px;box-shadow:0 24px 80px rgba(0,0,0,.32);padding:1.25rem}.photo-workflow-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border-bottom:1px solid #e2e8f0;padding-bottom:1rem}.photo-step{text-align:center;padding:1.25rem 0}.photo-step[hidden]{display:none}.photo-step-number{width:42px;height:42px;border-radius:999px;display:grid;place-items:center;margin:0 auto .6rem;background:#e0e7ff;color:#3730a3;font-weight:800;font-size:1.1rem}.photo-step-actions{display:flex;justify-content:center;gap:.75rem;flex-wrap:wrap;margin:1rem 0}.photo-step>img{display:block;width:min(100%,420px);max-height:360px;object-fit:contain;margin:1rem auto 0;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc}.photo-final-previews{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}.photo-final-previews img{width:100%;height:230px;object-fit:contain;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc}.photo-workflow-status{text-align:center;margin:.5rem 0 0}.photo-capture-flash{animation:photoCaptureFlash .35s ease}@keyframes photoCaptureFlash{50%{opacity:.35}}@media(max-width:600px){.photo-workflow-modal{border-radius:14px;padding:1rem}.photo-final-previews{grid-template-columns:1fr}.photo-final-previews img{height:180px}.photo-step-actions button{width:100%}}

.cycle-type-banner{border:2px solid #dc2626;background:#fff5f5;border-radius:14px;padding:18px;text-align:center;display:grid;gap:6px}.cycle-type-banner span{color:#991b1b;font-size:.9rem;font-weight:700;letter-spacing:.08em}.cycle-type-banner strong{color:#dc2626;font-size:1.35rem}.cycle-type-banner em{font-style:normal;color:var(--muted)}.cycle-legend{display:grid;gap:10px;margin:16px 0}.cycle-legend div{display:flex;gap:12px;align-items:center}.cycle-legend b{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#fee2e2;color:#991b1b}.cycle-legend span{color:var(--muted)}

/* v7.2 Orbit enterprise theme and advanced dashboard */
.orbit-theme{--bg:#071126;--bg-deep:#050b18;--surface:#0d1a35;--surface-2:#111f3f;--surface-soft:#142447;--border:#22345a;--text:#f4f7ff;--muted:#91a0bf;--accent:#6d4aff;--accent-2:#1f8fff;--success:#2bd887;--warning:#ffad32;--danger:#ff556f;--viz-series-1:#2f78ff;--viz-series-2:#6d4aff;--viz-series-3:#14b8a6;--viz-series-4:#23c875;--viz-series-5:#ff9f2d;--viz-series-6:#ef476f;background:radial-gradient(circle at 72% 8%,rgba(70,57,190,.16),transparent 28%),linear-gradient(135deg,#071126,#091733 60%,#071126);color:var(--text);min-height:100vh}.orbit-layout{display:grid;grid-template-columns:265px minmax(0,1fr);min-height:100vh}.app-sidebar{position:fixed;inset:0 auto 0 0;width:265px;padding:18px 14px;background:linear-gradient(180deg,#08142c 0%,#0a1733 55%,#071126 100%);border-right:1px solid rgba(118,137,184,.18);z-index:70;display:flex;flex-direction:column;overflow-y:auto}.app-content-shell{grid-column:2;min-width:0}.orbit-brand{display:flex;flex-direction:column;align-items:flex-start;text-decoration:none;padding:0 4px 20px;border-bottom:1px solid rgba(136,153,192,.16)}.orbit-brand-logo{display:block;width:205px;height:76px;object-fit:contain;object-position:left center}.brand-subtitle{text-transform:uppercase;letter-spacing:.25em;color:#a8b3cb;font-size:.62rem;font-weight:700;margin:-16px 0 0 73px}.sidebar-navigation{display:grid;gap:7px;padding:18px 0}.sidebar-navigation .nav-item{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:0 13px;border:1px solid transparent;border-radius:11px;color:#d7def0;background:transparent;text-decoration:none;font-weight:650;font-size:.93rem;transition:.18s ease}.sidebar-navigation .nav-item svg{width:20px;height:20px;fill:currentColor;flex:0 0 auto}.sidebar-navigation .nav-item:hover{background:rgba(109,74,255,.12);color:white}.sidebar-navigation .nav-item.active,.sidebar-navigation .nav-dropdown.active>.nav-item{background:linear-gradient(135deg,rgba(109,74,255,.78),rgba(68,64,190,.6));border-color:rgba(164,140,255,.32);box-shadow:0 12px 28px rgba(63,44,168,.24);color:white}.sidebar-navigation .nav-chevron{margin-left:auto;width:17px}.nav-count{margin-left:auto;min-width:20px;height:20px;display:grid;place-items:center;border-radius:999px;background:var(--danger);color:white;font-size:.68rem}.nav-count:empty{display:none}.nav-dropdown{position:relative}.nav-dropdown-menu{position:static;margin:5px 4px 0;padding:7px;background:#0a1732;border:1px solid var(--border);border-radius:12px;box-shadow:none}.nav-dropdown-menu a{display:grid;gap:2px;color:#d8e0f2;text-decoration:none;padding:9px;border-radius:8px}.nav-dropdown-menu a:hover{background:#15264b}.nav-dropdown-menu small{color:var(--muted);font-size:.7rem}.sidebar-cycle-card{margin-top:auto;border:1px solid rgba(128,102,255,.38);background:linear-gradient(145deg,rgba(97,62,216,.17),rgba(17,30,63,.7));border-radius:14px;padding:14px;color:#fff}.sidebar-cycle-card>small{text-transform:uppercase;letter-spacing:.1em;color:#aab6d2;font-size:.66rem}.sidebar-cycle-card>div{display:flex;align-items:center;gap:10px;margin:12px 0 5px}.sidebar-cycle-card>div>strong{font-size:2.1rem;color:#ff5d65}.sidebar-cycle-card>div>span{font-size:.8rem;font-weight:750;line-height:1.25}.sidebar-cycle-card p{font-size:.71rem;color:#aebbd6;margin:0 0 12px}.sidebar-cycle-card footer{border-top:1px solid rgba(144,161,199,.17);padding-top:10px;display:flex;align-items:center;gap:6px;font-size:.72rem;color:#8fe2b6}.sidebar-cycle-card footer b{margin-left:auto;color:#bdc8df;font-size:.68rem}.status-dot{width:7px;height:7px;border-radius:50%;background:var(--success);box-shadow:0 0 9px var(--success)}.sidebar-version{color:#657493;font-size:.66rem;line-height:1.5;padding:14px 4px 0}.orbit-topbar{height:78px;position:sticky;top:0;z-index:60;background:rgba(5,13,31,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(119,138,182,.18);padding:0 26px;display:flex;align-items:center;gap:22px}.header-tools{display:flex;align-items:center;gap:16px;margin-left:auto}.header-eastern-clock{display:flex;align-items:center;gap:10px;padding:0 18px;border-left:1px solid rgba(135,151,187,.2);border-right:1px solid rgba(135,151,187,.2)}.header-eastern-clock svg{width:25px;height:25px;fill:#9b7cff}.clock-copy{display:grid}.clock-copy small,.clock-copy em{color:#8e9bb7;font-size:.68rem;font-style:normal}.clock-copy strong{font-size:1rem;color:#fff}.user-menu-button{background:#0c1832;border:1px solid transparent;color:#fff;display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px}.user-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#17a7d9,#6b4df5);font-weight:800}.user-copy{display:grid;text-align:left}.user-copy small{font-size:.68rem;color:#9eabc4}.user-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:#0c1933;border:1px solid var(--border);border-radius:12px;padding:8px;box-shadow:0 22px 50px rgba(0,0,0,.38)}.user-menu a,.user-menu button{color:#e8edfa;background:transparent}.orbit-theme #app-main{max-width:none;margin:0;padding:28px 30px 48px}.orbit-theme .card,.orbit-theme .scan-card,.orbit-theme .metric-card{background:linear-gradient(145deg,rgba(15,29,59,.96),rgba(10,22,47,.96));border-color:var(--border);color:var(--text);box-shadow:0 15px 38px rgba(0,0,0,.12)}.orbit-theme input,.orbit-theme select,.orbit-theme textarea{background:#0a1731;border-color:#2b3c63;color:#eef3ff}.orbit-theme input::placeholder,.orbit-theme textarea::placeholder{color:#7786a6}.orbit-theme table{color:#e6ecfa}.orbit-theme th{color:#99a8c6;background:#111f40}.orbit-theme td{border-color:#22345a}.orbit-theme a{color:#7eb1ff}.orbit-theme .muted,.orbit-theme .help{color:var(--muted)}.orbit-theme button,.orbit-theme .button{background:linear-gradient(135deg,#6d4aff,#245eea);color:#fff}.orbit-theme .button.secondary{background:#162748;border:1px solid #33466e;color:#dae4fa}
.orbit-dashboard-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:24px}.dashboard-title-wrap{display:flex;gap:16px;align-items:flex-start}.dashboard-title-icon{width:50px;height:50px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(109,74,255,.35),rgba(32,97,235,.22));box-shadow:inset 0 0 0 1px rgba(156,132,255,.24)}.dashboard-title-icon svg{width:25px;fill:#9a7dff}.eyebrow{text-transform:uppercase;letter-spacing:.13em;color:#7da8ff;font-size:.69rem;font-weight:800}.orbit-dashboard-head h1{font-size:2rem;margin:3px 0 5px}.orbit-dashboard-head p{color:var(--muted);margin:0}.dashboard-head-controls{display:flex;gap:12px}.dashboard-control{min-width:210px;padding:13px 15px;border:1px solid var(--border);border-radius:12px;background:linear-gradient(145deg,#101e3d,#0b1832);display:grid;gap:4px}.dashboard-control small{color:#8e9bb8}.dashboard-control strong{font-size:.95rem}.dashboard-control span{font-size:.7rem;color:#92a0bd}.count-type-control strong{display:flex;align-items:center;gap:9px}.count-type-control strong b{font-size:1.9rem;color:#ff575f}.orbit-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:18px}.orbit-kpi{min-height:133px;display:flex;align-items:flex-start;gap:13px;padding:18px;border:1px solid var(--border);border-radius:14px;background:linear-gradient(145deg,#101e3d,#0b1730);color:var(--text);text-decoration:none;box-shadow:0 16px 38px rgba(0,0,0,.12)}.orbit-kpi>div{display:grid;gap:6px;min-width:0}.orbit-kpi small{color:#9ba8c3}.orbit-kpi strong{font-size:1.75rem;color:#fff;line-height:1.1}.orbit-kpi span:last-child{color:#8f9db9;font-size:.75rem}.orbit-kpi.positive strong{color:#2ade88}.orbit-kpi.negative strong{color:#ff667b}.kpi-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:1.25rem;font-weight:900;flex:0 0 auto}.kpi-icon.purple{background:rgba(116,78,255,.18);color:#a689ff}.kpi-icon.blue{background:rgba(31,143,255,.16);color:#5faaff}.kpi-icon.green{background:rgba(38,207,126,.16);color:#37dc91}.kpi-icon.teal{background:rgba(20,184,166,.16);color:#2ad6c3}.kpi-icon.amber{background:rgba(255,173,50,.17);color:#ffb84b}.orbit-dashboard-grid{display:grid;gap:14px;margin-bottom:18px}.primary-grid{grid-template-columns:1.65fr .95fr 1.15fr}.secondary-grid{grid-template-columns:.85fr 1.05fr 1.2fr}.orbit-panel{background:linear-gradient(145deg,rgba(14,28,57,.97),rgba(9,20,44,.97));border:1px solid var(--border);border-radius:14px;padding:17px;min-width:0;box-shadow:0 18px 45px rgba(0,0,0,.12)}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:13px}.panel-head h2,.panel-head h3{margin:0 0 4px;font-size:1.02rem}.panel-head p{margin:0;color:var(--muted);font-size:.76rem}.panel-head>a{font-size:.72rem;text-decoration:none}.panel-chip{padding:4px 9px;border-radius:999px;background:#17284e;color:#91b9ff;font-size:.67rem}.compact-period-filter label{font-size:.66rem;color:var(--muted)}.compact-period-filter select{padding:6px 28px 6px 9px;font-size:.72rem}.dashboard-trend-canvas{min-height:295px}.dashboard-donut-canvas{min-height:230px}.dashboard-legend{grid-template-columns:1fr;margin-top:5px;max-height:125px;overflow:auto}.location-progress-list{display:grid;gap:11px}.location-progress-row{display:grid;grid-template-columns:1fr auto;gap:6px 12px;color:inherit!important;text-decoration:none;padding:7px 0;border-bottom:1px solid rgba(117,139,182,.12)}.location-progress-row:last-child{border-bottom:0}.location-progress-copy{display:grid;gap:2px}.location-progress-copy strong{font-size:.78rem}.location-progress-copy span{font-size:.66rem;color:var(--muted)}.progress-value{display:flex;align-items:center;gap:7px}.progress-value b{font-size:.76rem}.status-badge{font-size:.61rem;padding:3px 7px;border-radius:999px;background:#172745;color:#a8b5ce}.status-badge.open{color:#43dc90;background:rgba(38,210,127,.11)}.status-badge.closed{color:#73aaff;background:rgba(49,127,255,.12)}.status-badge.review{color:#ffbd50;background:rgba(255,174,44,.12)}.status-badge.not_started{color:#ff697d;background:rgba(255,85,111,.1)}.status-badge.missed{color:#ff697d;background:rgba(255,85,111,.1)}.progress-track{grid-column:1/-1;height:5px;background:#1c2b4d;border-radius:999px;overflow:hidden}.progress-track i{display:block;height:100%;background:linear-gradient(90deg,#6c4cff,#1e91ff);border-radius:inherit}.advanced-analytics{margin-bottom:18px}.advanced-analytics .analytics-filter-bar{background:#0b1832;border-color:#293a60}.advanced-analytics .analytics-ranking-wrap{border-top:1px solid var(--border);padding-top:16px}.schedule-list,.data-list,.activity-list{display:grid}.schedule-row{display:flex;align-items:center;gap:11px;padding:10px;border:1px solid #24365d;border-radius:10px;margin-bottom:8px;background:#0b1832}.schedule-row.active{border-color:#5650d6;background:rgba(92,66,217,.14)}.schedule-row>b{width:31px;height:31px;border-radius:8px;display:grid;place-items:center;background:#153d33;color:#47d995}.schedule-row b.type-b{background:#292052;color:#a98aff}.schedule-row b.type-c{background:#4b3213;color:#ffb64c}.schedule-row>span{display:grid;flex:1}.schedule-row strong{font-size:.76rem}.schedule-row small{color:var(--muted);font-size:.66rem}.schedule-row em{font-style:normal;color:#7383a4}.data-list-head,.data-list-row{display:grid;grid-template-columns:1fr 80px 45px;gap:9px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(117,139,182,.13)}.data-list-head{font-size:.62rem;text-transform:uppercase;color:#8290ad}.data-list-row>span{display:grid;min-width:0}.data-list-row strong{font-size:.7rem}.data-list-row small{font-size:.65rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.data-list-row b{font-size:.73rem;text-align:right}.data-list-row em{font-size:.72rem;text-align:right;font-style:normal}.activity-panel .panel-head>strong{font-size:1.4rem}.activity-panel .panel-head>strong small{font-size:.65rem;color:var(--muted)}.activity-list>div{display:grid;grid-template-columns:9px 1fr auto;gap:8px;align-items:start;padding:7px 0;border-bottom:1px solid rgba(117,139,182,.12)}.activity-dot{width:7px;height:7px;border-radius:50%;background:#a457ff;margin-top:5px;box-shadow:0 0 9px #a457ff}.activity-list p{display:grid;margin:0}.activity-list strong{font-size:.72rem}.activity-list small,.activity-list time{font-size:.62rem;color:var(--muted)}.panel-empty{color:var(--muted);font-size:.76rem}.category-detail-panel{margin-bottom:0}.orbit-theme .table-wrap{border:1px solid #22345a;border-radius:10px}.orbit-theme .insights-table thead th{background:#101f41}.text-positive{color:#34dc8b!important}.text-negative{color:#ff697d!important}.orbit-login-header{background:#071329;padding:12px 5vw;height:90px}.orbit-login-header .orbit-brand-logo{height:70px}
@media(max-width:1380px){.orbit-kpi-grid{grid-template-columns:repeat(3,1fr)}.primary-grid{grid-template-columns:1.4fr 1fr}.location-panel{grid-column:1/-1}.secondary-grid{grid-template-columns:repeat(2,1fr)}.activity-panel{grid-column:1/-1}}
@media(max-width:1050px){.orbit-layout{display:block}.app-sidebar{transform:translateX(-100%);transition:.2s ease}.app-sidebar.open{transform:translateX(0)}.app-content-shell{margin-left:0}.orbit-topbar{padding:0 16px}.mobile-menu-button{display:flex}.orbit-dashboard-head{flex-direction:column}.dashboard-head-controls{width:100%}.dashboard-control{flex:1}.primary-grid,.secondary-grid{grid-template-columns:1fr}.composition-panel,.location-panel,.activity-panel{grid-column:auto}.orbit-kpi-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.orbit-theme #app-main{padding:20px 14px 38px}.header-eastern-clock{display:none}.orbit-dashboard-head h1{font-size:1.55rem}.dashboard-title-icon{display:none}.dashboard-head-controls{flex-direction:column}.orbit-kpi-grid{grid-template-columns:1fr}.orbit-kpi{min-height:105px}.analytics-filter-bar{grid-template-columns:1fr!important}.user-copy{display:none}.orbit-topbar{height:66px}.primary-grid,.secondary-grid{gap:11px}.orbit-panel{padding:14px}}


/* ============================================================================
   v7.3 Orbit light-canvas theme

   The shell (sidebar + top bar) stays dark navy; the working surface becomes
   light. Tokens are re-scoped on #app-main rather than redefined globally, so
   the dark chrome keeps the .orbit-theme values it already had and only the
   content region flips. Everything below is additive: no v7.2 rule is edited,
   which keeps the change reversible by deleting this block.
   ========================================================================= */

/* Chart canvases read their palette from :root via getComputedStyle on
   document.documentElement, so the visualisation tokens must live here to
   reach them. They are tuned for the light working surface. */
:root{
  --viz-series-1:#5b3df5;
  --viz-series-2:#2f7df4;
  --viz-series-3:#16b981;
  --viz-series-4:#f5a524;
  --viz-series-5:#ef4444;
  --viz-series-6:#14b8a6;
  --accent:#5b3df5;
  --text:#101828;
  --muted:#667085;
  --border:#e6e8f0;
}

/* --- canvas ------------------------------------------------------------- */
.orbit-theme{
  background:#f6f7fb;
}

.orbit-theme #app-main{
  --surface:#ffffff;
  --surface-2:#fbfbfe;
  --surface-soft:#f2f3f9;
  --border:#e8eaf2;
  --text:#101828;
  --muted:#667085;
  --accent:#5b3df5;
  --accent-2:#2f7df4;
  --success:#16b981;
  --warning:#f5a524;
  --danger:#ef4444;
  background:#f6f7fb;
  color:var(--text);
}

/* --- generic surfaces --------------------------------------------------- */
.orbit-theme #app-main .card,
.orbit-theme #app-main .scan-card,
.orbit-theme #app-main .metric-card,
.orbit-theme #app-main .orbit-panel{
  background:#fff;
  border:1px solid var(--border);
  color:var(--text);
  border-radius:14px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.04);
}

.orbit-theme #app-main h1,
.orbit-theme #app-main h2,
.orbit-theme #app-main h3,
.orbit-theme #app-main strong,
.orbit-theme #app-main b{color:var(--text)}

.orbit-theme #app-main .panel-head p,
.orbit-theme #app-main .muted,
.orbit-theme #app-main .help{color:var(--muted)}

.orbit-theme #app-main a{color:var(--accent)}
.orbit-theme #app-main .panel-head>a{font-weight:600}

/* --- form controls ------------------------------------------------------ */
.orbit-theme #app-main input,
.orbit-theme #app-main select,
.orbit-theme #app-main textarea{
  background:#fff;
  border:1px solid #dfe2ec;
  color:var(--text);
}
.orbit-theme #app-main input::placeholder,
.orbit-theme #app-main textarea::placeholder{color:#98a2b3}
.orbit-theme #app-main input:focus,
.orbit-theme #app-main select:focus,
.orbit-theme #app-main textarea:focus{
  outline:2px solid rgba(91,61,245,.35);
  outline-offset:1px;
  border-color:var(--accent);
}

.orbit-theme #app-main button,
.orbit-theme #app-main .button{background:var(--accent);color:#fff;border:1px solid transparent}
.orbit-theme #app-main .button.secondary,
.orbit-theme #app-main button.secondary{
  background:#fff;color:var(--text);border:1px solid #dfe2ec;
}

/* --- page header -------------------------------------------------------- */
.orbit-theme #app-main .dashboard-title-icon{
  background:#efe9ff;
  box-shadow:inset 0 0 0 1px #ded2ff;
}
.orbit-theme #app-main .dashboard-title-icon svg{fill:var(--accent)}

.orbit-theme #app-main .dashboard-control{
  background:#fff;
  border:1px solid var(--border);
  box-shadow:0 1px 2px rgba(16,24,40,.04);
}
.orbit-theme #app-main .dashboard-control small{color:var(--muted)}
.orbit-theme #app-main .dashboard-control span{color:var(--muted)}

/* --- KPI row ------------------------------------------------------------ */
.orbit-theme #app-main .orbit-kpi{
  background:#fff;
  border:1px solid var(--border);
  color:var(--text);
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.04);
}
.orbit-theme #app-main .orbit-kpi small{color:var(--muted)}
.orbit-theme #app-main .orbit-kpi strong{color:var(--text)}
.orbit-theme #app-main .orbit-kpi span:last-child{color:var(--muted)}
.orbit-theme #app-main .orbit-kpi.positive strong{color:#0f9d68}
.orbit-theme #app-main .orbit-kpi.negative strong{color:#d92d20}
.orbit-theme #app-main .orbit-kpi:hover{border-color:#d6d9e6}

/* Rounded tiles rather than circles, matching the header icon treatment. */
.orbit-theme #app-main .kpi-icon{border-radius:12px}
.orbit-theme #app-main .kpi-icon.purple{background:#efe9ff;color:#5b3df5}
.orbit-theme #app-main .kpi-icon.blue{background:#e6f0ff;color:#2f7df4}
.orbit-theme #app-main .kpi-icon.green{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .kpi-icon.teal{background:#e0f7f5;color:#0e9a8d}
.orbit-theme #app-main .kpi-icon.amber{background:#fef3e0;color:#d98207}

/* --- progress and status ------------------------------------------------ */
.orbit-theme #app-main .progress-track{background:#eef0f6}
.orbit-theme #app-main .progress-track i{background:linear-gradient(90deg,#5b3df5,#2f7df4)}
.orbit-theme #app-main .location-progress-row{border-bottom-color:var(--border)}
.orbit-theme #app-main .location-progress-copy span{color:var(--muted)}

.orbit-theme #app-main .status-badge{background:#f2f4f7;color:#475467;font-weight:600}
.orbit-theme #app-main .status-badge.open{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .status-badge.closed{background:#e6f0ff;color:#175cd3}
.orbit-theme #app-main .status-badge.review{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .status-badge.not_started{background:#fdeced;color:#c01c28}

/* --- schedule, data and activity lists ---------------------------------- */
.orbit-theme #app-main .schedule-row{
  background:#fff;
  border:1px solid var(--border);
}
.orbit-theme #app-main .schedule-row.active{
  border-color:#c3b5fd;
  background:#f7f4ff;
}
.orbit-theme #app-main .schedule-row>b{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .schedule-row b.type-b{background:#efe9ff;color:#5b3df5}
.orbit-theme #app-main .schedule-row b.type-c{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .schedule-row small{color:var(--muted)}
.orbit-theme #app-main .schedule-row em{color:var(--muted)}

.orbit-theme #app-main .data-list-head,
.orbit-theme #app-main .data-list-row{border-bottom:1px solid var(--border)}
.orbit-theme #app-main .data-list-head{color:var(--muted);font-weight:600;letter-spacing:.04em}
.orbit-theme #app-main .data-list-row small{color:var(--muted)}

.orbit-theme #app-main .activity-list>div{border-bottom:1px solid var(--border)}
.orbit-theme #app-main .activity-dot{background:var(--accent);box-shadow:none}
.orbit-theme #app-main .activity-list small,
.orbit-theme #app-main .activity-list time{color:var(--muted)}
.orbit-theme #app-main .panel-empty{color:var(--muted)}

/* --- tables ------------------------------------------------------------- */
.orbit-theme #app-main table{color:var(--text)}
.orbit-theme #app-main th{
  color:var(--muted);
  border-bottom:1px solid var(--border);
  font-weight:600;
}
.orbit-theme #app-main td{border-bottom:1px solid var(--border)}
.orbit-theme #app-main tbody tr:hover td{background:#fafbff}
.orbit-theme #app-main .table-wrap{border:1px solid var(--border);background:#fff}
.orbit-theme #app-main .insights-table thead th{background:#f8f9fc}

/* --- analytics ---------------------------------------------------------- */
.orbit-theme #app-main .advanced-analytics .analytics-filter-bar,
.orbit-theme #app-main .advanced-analytics .analytics-ranking-wrap,
.orbit-theme #app-main .category-detail-panel{
  background:#fff;
  border:1px solid var(--border);
}
.orbit-theme #app-main .panel-chip{background:#f2f4f7;color:#475467}
.orbit-theme #app-main .dashboard-legend{color:var(--text)}
.orbit-theme #app-main .text-positive{color:#0f9d68}
.orbit-theme #app-main .text-negative{color:#d92d20}

/* --- shell refinements to match the light canvas ------------------------ */
.orbit-theme .orbit-topbar{
  background:#0b1430;
  border-bottom:1px solid rgba(119,138,182,.16);
}
.orbit-theme .app-sidebar{border-right:1px solid rgba(118,137,184,.14)}

@media(prefers-reduced-motion:reduce){
  .orbit-theme #app-main *{transition:none!important;animation:none!important}
}

/* --- corrections surfaced by the light canvas ---------------------------- */

/* `.orbit-theme button` (0,0,1,1) outranks `.user-menu-button` (0,0,1,0), so
   the chrome buttons in the top bar were being painted with the primary
   gradient. Re-assert them with enough specificity to win. */
.orbit-theme .orbit-topbar .user-menu-button{
  background:#0c1832;
  color:#fff;
}
.orbit-theme .orbit-topbar .user-menu-button:hover,
.orbit-theme .orbit-topbar .user-menu-button[aria-expanded="true"]{
  background:#132347;
  border-color:rgba(255,255,255,.14);
}
.orbit-theme .orbit-topbar .mobile-menu-button{background:transparent}
.orbit-theme .user-menu a,
.orbit-theme .user-menu button{
  background:transparent;
  color:#e8edfa;
}
.orbit-theme .user-menu a:hover,
.orbit-theme .user-menu button:hover{background:rgba(255,255,255,.07)}

/* Long currency values (monthly change) overflowed the fixed-width KPI card. */
.orbit-theme #app-main .orbit-kpi strong{
  font-size:clamp(1.2rem,1.45vw,1.7rem);
  overflow-wrap:anywhere;
  letter-spacing:-.01em;
}
.orbit-theme #app-main .orbit-kpi small,
.orbit-theme #app-main .orbit-kpi span:last-child{overflow-wrap:anywhere}

/* Currency figures must not break mid-number; scale the type instead. */
.orbit-theme #app-main .orbit-kpi strong{
  font-size:clamp(1.05rem,1.28vw,1.55rem);
  white-space:nowrap;
  overflow-wrap:normal;
}
.orbit-theme #app-main .orbit-kpi small{font-size:.76rem;line-height:1.3}

/* `.orbit-theme th` also sets a dark background, which the earlier rule left
   in place because it only reset the text colour. */
.orbit-theme #app-main th{background:#f8f9fc}
.orbit-theme #app-main thead th{background:#f8f9fc}
.orbit-theme #app-main .table-wrap thead th{background:#f8f9fc}

/* At the 650px breakpoint the menu button switches to display:flex without a
   direction, which laid the three 2px bars out in a row and collapsed them to
   nothing. Stack them again. */
.orbit-theme .mobile-menu-button{
  flex-direction:column;
  justify-content:center;
}
.orbit-theme .mobile-menu-button span{
  width:100%;
  flex:0 0 2px;
}

/* --- brand lockup ------------------------------------------------------- */

/* The logo is a stacked lockup (swirl above a full-width ORBIT wordmark) at
   532x306. The v7.2 rule constrained it to 205x76 with object-fit:contain, so
   the height won and the artwork rendered ~132px wide, pinned left inside a
   205px box - while the subtitle was pushed right by a hard 73px margin.
   Nothing lined up. Size by width instead and centre the column. */
.orbit-theme .app-sidebar .orbit-brand{
  align-items:center;
  gap:4px;
  padding:2px 4px 18px;
}
.orbit-theme .app-sidebar .orbit-brand-logo{
  width:100%;
  max-width:184px;
  height:auto;
  object-fit:contain;
  object-position:center;
}
.orbit-theme .app-sidebar .brand-subtitle{
  margin:-6px 0 0;
  align-self:stretch;
  text-align:center;
  /* letter-spacing adds a trailing gap after the final letter, which drags the
     text visually left of centre; indent by the same amount to correct it. */
  text-indent:.25em;
}

/* The sign-in header uses the same lockup. Its bar is 90px tall with 12px of
   padding, leaving 66px; the stacked mark plus subtitle must fit inside that
   or the subtitle clips at the bottom edge. */
.orbit-theme .orbit-login-header .orbit-brand{
  align-items:center;
  gap:3px;
  padding:0;
  border-bottom:0;
}
.orbit-theme .orbit-login-header .orbit-brand-logo{
  width:auto;
  height:58px;
  object-position:center;
}
/* Tightened so the subtitle is no wider than the wordmark above it - at the
   sidebar's tracking it would overhang the smaller sign-in mark on both sides. */
.orbit-theme .orbit-login-header .brand-subtitle{
  margin:-2px 0 0;
  align-self:stretch;
  text-align:center;
  font-size:.52rem;
  letter-spacing:.16em;
  text-indent:.16em;
}

/* ============================================================================
   Deployment & HTTPS page
   The markup used .panel, .panel-heading, .page-heading, .form-check,
   .command-block, .data-table and .stack-lg, none of which had any CSS, so the
   sections rendered as unstyled blocks with oversized native checkboxes.
   ========================================================================= */

.orbit-theme #app-main .page-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.orbit-theme #app-main .page-heading h1{margin:2px 0 6px;font-size:1.7rem}
.orbit-theme #app-main .page-heading p{margin:0;color:var(--muted);max-width:72ch}
.orbit-theme #app-main .page-heading .eyebrow{margin:0}

.orbit-theme #app-main .panel{
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  padding:20px;
  margin-bottom:16px;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.04);
}
.orbit-theme #app-main .panel-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}
.orbit-theme #app-main .panel-heading h2{margin:0 0 4px;font-size:1.05rem}
.orbit-theme #app-main .panel-heading p{margin:0;color:var(--muted);font-size:.8rem;max-width:70ch}

.orbit-theme #app-main .stack-lg{display:block}

/* Status badges: the page uses success/warning/danger, which only had the
   count-session variants defined. */
.orbit-theme #app-main .status-badge.success{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .status-badge.warning{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .status-badge.danger{background:#fdeced;color:#c01c28}
.orbit-theme #app-main .page-heading .status-badge,
.orbit-theme #app-main .panel-heading .status-badge{
  font-size:.72rem;
  padding:6px 12px;
  white-space:nowrap;
  flex:0 0 auto;
}

/* Long values (URLs, timestamps) were overflowing the metric cards. */
.orbit-theme #app-main .metric-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px 16px;
  min-width:0;
}
.orbit-theme #app-main .metric-card span{
  display:block;
  color:var(--muted);
  font-size:.72rem;
  margin-bottom:5px;
}
.orbit-theme #app-main .metric-card strong{
  display:block;
  font-size:.95rem;
  line-height:1.35;
  overflow-wrap:anywhere;
}

/* Security posture checklist */
.orbit-theme #app-main .posture-list{display:grid;gap:0}
.orbit-theme #app-main .posture-row{
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
  padding:12px 0;
  border-bottom:1px solid var(--border);
}
.orbit-theme #app-main .posture-row:last-child{border-bottom:0}
.orbit-theme #app-main .posture-mark{
  width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;
  font-size:.72rem;font-weight:800;
}
.orbit-theme #app-main .posture-row.pass .posture-mark{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .posture-row.warn .posture-mark{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .posture-row.fail .posture-mark{background:#fdeced;color:#c01c28}
.orbit-theme #app-main .posture-copy strong{display:block;font-size:.85rem}
.orbit-theme #app-main .posture-copy span{display:block;color:var(--muted);font-size:.76rem;margin-top:2px}
.orbit-theme #app-main .posture-state{
  font-size:.62rem;text-transform:uppercase;letter-spacing:.06em;
  font-weight:700;padding:4px 9px;border-radius:999px;white-space:nowrap;
}
.orbit-theme #app-main .posture-row.pass .posture-state{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .posture-row.warn .posture-state{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .posture-row.fail .posture-state{background:#fdeced;color:#c01c28}

/* Toggle rows: the native checkbox was rendering at heading size with the
   label wrapping onto its own line. */
.orbit-theme #app-main .form-check{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:13px 15px;
  border:1px solid var(--border);
  border-radius:11px;
  background:#fbfbfe;
  margin:0 0 10px;
  cursor:pointer;
}
.orbit-theme #app-main .form-check:hover{border-color:#cfd4e4;background:#f7f8fd}
.orbit-theme #app-main .form-check-input{
  width:18px;height:18px;
  flex:0 0 18px;
  margin:1px 0 0;
  accent-color:var(--accent);
  cursor:pointer;
}
.orbit-theme #app-main .form-check-label{
  display:block;
  font-size:.85rem;
  font-weight:600;
  line-height:1.35;
}
.orbit-theme #app-main .form-check-label small{
  display:block;
  font-weight:400;
  color:var(--muted);
  font-size:.76rem;
  margin-top:3px;
}
.orbit-theme #app-main .toggle-grid{display:grid;gap:0}

/* Copyable host commands */
.orbit-theme #app-main .command-block{
  background:#0d1730;
  color:#dbe4ff;
  border:1px solid #1d2a4d;
  border-radius:11px;
  padding:15px 17px;
  margin:0;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.78rem;
  line-height:1.75;
  overflow-x:auto;
  white-space:pre;
}
.orbit-theme #app-main .command-block .cmd-comment{color:#7f8db0}

.orbit-theme #app-main .data-table{width:100%;border-collapse:collapse}
.orbit-theme #app-main .data-table th,
.orbit-theme #app-main .data-table td{
  text-align:left;padding:10px 12px;border-bottom:1px solid var(--border);font-size:.8rem;
}
.orbit-theme #app-main .data-table th{
  color:var(--muted);font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;background:#f8f9fc;
}

.orbit-theme #app-main .notice{
  border-radius:11px;padding:13px 16px;margin:0 0 16px;font-size:.83rem;
  border:1px solid var(--border);background:#f8f9fc;color:var(--text);
}
.orbit-theme #app-main .notice.success{background:#e3f9f0;border-color:#b6ecd5;color:#0b6d4a}
.orbit-theme #app-main .notice.warning{background:#fef3e0;border-color:#f6dcb0;color:#8a5406}
.orbit-theme #app-main .notice.danger{background:#fdeced;border-color:#f5c6cb;color:#96151f}

.orbit-theme #app-main .actions{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}

/* Certificate expiry meter */
.orbit-theme #app-main .cert-meter{
  height:6px;border-radius:999px;background:#eef0f6;overflow:hidden;margin-top:10px;
}
.orbit-theme #app-main .cert-meter i{display:block;height:100%;border-radius:inherit;background:#16b981}
.orbit-theme #app-main .cert-meter.warn i{background:#f5a524}
.orbit-theme #app-main .cert-meter.fail i{background:#ef4444}

@media(max-width:760px){
  .orbit-theme #app-main .page-heading,
  .orbit-theme #app-main .panel-heading{flex-direction:column;align-items:stretch}
  .orbit-theme #app-main .posture-row{grid-template-columns:22px minmax(0,1fr);row-gap:6px}
  .orbit-theme #app-main .posture-state{grid-column:2;justify-self:start}
}

/* `.metric-card{min-height:154px}` was sized for the old large-number cards;
   these hold short status strings, so it left most of each card empty. */
.orbit-theme #app-main .metric-card{
  min-height:0;
  align-content:start;
}
.orbit-theme #app-main .metric-grid{
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:12px;
  margin:0;
}
.orbit-theme #app-main .panel .metric-grid{margin:0}

/* With the global search removed, .header-tools and .mobile-menu-button both
   carried margin-left:auto, so the free space was split between them and the
   user avatar floated to the middle of the bar. One auto margin is enough:
   it pushes the whole group to the right edge. */
@media(max-width:1050px){
  .orbit-theme .orbit-topbar .mobile-menu-button{margin-left:0}
  .orbit-theme .orbit-topbar .header-tools{margin-left:auto}
}

/* ============================================================================
   Insights and Reports: sidebar groups, tiles, filter bars, wide tables
   ========================================================================= */

.app-sidebar .nav-group{margin:2px 0}
.app-sidebar .nav-group-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:9px 12px;
  background:transparent;
  border:0;
  border-radius:9px;
  color:#8e9bba;
  font-size:.66rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
}
.app-sidebar .nav-group-toggle:hover{background:rgba(255,255,255,.05);color:#c3cde3}
.app-sidebar .nav-group-toggle .nav-chevron{
  width:16px;height:16px;fill:currentColor;
  transition:transform .16s ease;
}
.app-sidebar .nav-group.open .nav-group-toggle .nav-chevron{transform:rotate(180deg)}
.app-sidebar .nav-group-items{display:none;padding:2px 0 6px}
.app-sidebar .nav-group.open .nav-group-items{display:grid;gap:1px}
.app-sidebar .nav-subitem{
  display:block;
  padding:8px 12px 8px 26px;
  border-radius:8px;
  color:#c2cbe0;
  text-decoration:none;
  font-size:.82rem;
  line-height:1.3;
}
.app-sidebar .nav-subitem:hover{background:rgba(255,255,255,.06);color:#fff}
.app-sidebar .nav-subitem.active{
  background:linear-gradient(135deg,#5b3df5,#3f2fd0);
  color:#fff;
  font-weight:600;
}

/* Landing tiles */
.orbit-theme #app-main .tile-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(268px,1fr));
  gap:14px;
}
.orbit-theme #app-main .nav-tile{
  display:grid;
  gap:6px;
  align-content:start;
  padding:18px 20px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:14px;
  text-decoration:none;
  color:var(--text);
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.04);
  transition:border-color .16s,transform .16s;
}
.orbit-theme #app-main .nav-tile:hover{border-color:#c6c9dc;transform:translateY(-2px)}
.orbit-theme #app-main .nav-tile strong{font-size:1rem}
.orbit-theme #app-main .nav-tile span{color:var(--muted);font-size:.82rem;line-height:1.45}
.orbit-theme #app-main .nav-tile em{
  font-style:normal;color:var(--accent);font-size:.78rem;font-weight:600;margin-top:4px;
}

/* Filter bar shared by reports and insights */
.orbit-theme #app-main .filter-bar{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:12px;
  padding:14px 16px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  margin-bottom:16px;
}
.orbit-theme #app-main .filter-bar label{display:grid;gap:5px;min-width:170px}
.orbit-theme #app-main .filter-bar label span{
  font-size:.7rem;color:var(--muted);font-weight:600;
}
.orbit-theme #app-main .filter-bar select{height:40px}
.orbit-theme #app-main .filter-bar .button{height:40px;display:inline-flex;align-items:center}

/* Report tables can be much wider than the viewport. */
.orbit-theme #app-main .table-scroll{overflow-x:auto;margin:0 -4px}
.orbit-theme #app-main .table-scroll .data-table{min-width:100%}
.orbit-theme #app-main .data-table td.num,
.orbit-theme #app-main .data-table th.num{text-align:right;white-space:nowrap}
.orbit-theme #app-main .data-table tbody tr:hover td{background:#fafbff}
.orbit-theme #app-main .data-table tfoot td{
  font-weight:700;border-top:2px solid var(--border);background:#f8f9fc;
}
.orbit-theme #app-main .report-note{
  margin:0 0 14px;color:var(--muted);font-size:.8rem;
}
.orbit-theme #app-main .page-heading .eyebrow a{text-decoration:none}

/* ============================================================================
   Count status pills

   Closed and Missed are both "not open", but they mean opposite things: one
   was worked and finished, the other expired with nothing scanned. Colour has
   to carry that difference, so Closed is neutral grey and Missed is red.
   ========================================================================= */
.orbit-theme #app-main .status-badge.open{background:#e3f9f0;color:#0f9d68}
.orbit-theme #app-main .status-badge.closed{background:#eef0f4;color:#4b5563}
.orbit-theme #app-main .status-badge.review{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .status-badge.missed{background:#fdeced;color:#c01c28}
.orbit-theme #app-main .data-table .status-badge{
  display:inline-block;
  font-size:.66rem;
  font-weight:700;
  padding:4px 10px;
  border-radius:999px;
  white-space:nowrap;
}

/* ============================================================================
   Sidebar alignment

   Nav labels sit at 45px (13px padding + 20px icon + 12px gap). The group
   headings and their sub-items were starting at 12px and 26px, so nothing in
   the sidebar lined up. They are indented to the same 45px here.

   The headings also inherited `box-shadow` from the global `button,.button`
   rule, which made them read as raised cards rather than section labels.
   ========================================================================= */
.app-sidebar .nav-group-toggle{
  padding:10px 13px 10px 46px;
  box-shadow:none;
  border:0;
  min-height:38px;
}
.app-sidebar .nav-group-toggle:hover{box-shadow:none}
.app-sidebar .nav-subitem{
  padding:9px 13px 9px 46px;
}
.app-sidebar .nav-group + .nav-group{margin-top:0}
.app-sidebar .nav-group-items{padding-bottom:4px}

/* ============================================================================
   Sidebar groups, final treatment

   Aligning every label to one indent removed the hierarchy — twenty entries
   read as a single flat list. Sub-items now carry their own icons in the same
   column as the top-level ones, so alignment and structure both hold: the icon
   column does the aligning, and weight, size and colour do the ranking.
   ========================================================================= */

.app-sidebar .nav-group{
  margin:6px 0 2px;
  padding-top:6px;
  border-top:1px solid rgba(136,153,192,.12);
}
.app-sidebar .nav-group:first-of-type{border-top:0}

.app-sidebar .nav-group-toggle{
  padding:6px 13px 6px 13px;
  min-height:30px;
  color:#7c8aab;
  font-size:.63rem;
  letter-spacing:.14em;
}
.app-sidebar .nav-group-toggle:hover{background:transparent;color:#a9b6d2}
.app-sidebar .nav-group-toggle .nav-chevron{width:14px;height:14px;opacity:.7}

.app-sidebar .nav-group-items{padding:2px 0 4px}

/* Same 13px padding + 20px icon + 12px gap as .nav-item, so every icon and
   every label in the sidebar shares one column. */
.app-sidebar .nav-subitem{
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 13px;
  min-height:38px;
  border:1px solid transparent;
  border-radius:10px;
  color:#aab6d0;
  font-size:.855rem;
  font-weight:500;
  text-decoration:none;
  transition:.16s ease;
}
.app-sidebar .nav-subitem svg{
  width:20px;
  height:20px;
  flex:0 0 auto;
  fill:currentColor;
  opacity:.72;
}
.app-sidebar .nav-subitem span{min-width:0}
.app-sidebar .nav-subitem:hover{
  background:rgba(109,74,255,.12);
  color:#fff;
}
.app-sidebar .nav-subitem:hover svg{opacity:1}
.app-sidebar .nav-subitem.active{
  background:linear-gradient(135deg,rgba(109,74,255,.78),rgba(68,64,190,.6));
  border-color:rgba(164,140,255,.32);
  box-shadow:0 12px 28px rgba(63,44,168,.24);
  color:#fff;
  font-weight:650;
}
.app-sidebar .nav-subitem.active svg{opacity:1}

/* The two groups sit between the primary links and the account links, so give
   the block after them a matching rule. */
.app-sidebar .nav-group + .nav-item{
  margin-top:6px;
  padding-top:0;
  border-top:1px solid rgba(136,153,192,.12);
}

/* ============================================================================
   Group headings are navigation items

   Insights and Reports were styled as section captions — small uppercase, wide
   tracking, muted grey — so they read as dividers rather than as part of the
   menu. They are destinations with their own pages, exactly like
   Administration, so they now use the same type, size, weight, colour, icon
   column and hit area as every other top-level link.
   ========================================================================= */

.app-sidebar .nav-group{
  margin:0;
  padding-top:0;
  border-top:0;
}
.app-sidebar .nav-group + .nav-item{
  margin-top:0;
  padding-top:0;
  border-top:0;
}

.app-sidebar .nav-group-toggle{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:46px;
  padding:0 13px;
  border:1px solid transparent;
  border-radius:11px;
  background:transparent;
  box-shadow:none;
  color:#d7def0;
  font-family:inherit;
  font-size:.93rem;
  font-weight:650;
  letter-spacing:normal;
  text-transform:none;
  text-align:left;
  cursor:pointer;
  transition:.18s ease;
}
.app-sidebar .nav-group-toggle > svg:first-child{
  width:20px;
  height:20px;
  flex:0 0 auto;
  fill:currentColor;
}
.app-sidebar .nav-group-toggle > span{flex:1 1 auto;min-width:0}
.app-sidebar .nav-group-toggle .nav-chevron{
  width:17px;
  height:17px;
  margin-left:auto;
  flex:0 0 auto;
  opacity:.8;
  transition:transform .16s ease;
}
.app-sidebar .nav-group-toggle:hover{
  background:rgba(109,74,255,.12);
  color:#fff;
  box-shadow:none;
}

/* The open section is indicated on the parent without the full accent pill,
   because the active sub-item already carries that and two purple rows in a
   row would compete. */
.app-sidebar .nav-group.open > .nav-group-toggle{
  background:rgba(255,255,255,.05);
  color:#fff;
}

/* The reporting date card is now a control rather than a readout. */
.orbit-theme #app-main .reporting-date-control{
  display:grid;
  gap:4px;
  align-content:start;
  /* Wide enough for the longest label ("September 07, 2026 — Today") plus the
     chevron, so the selected value is never clipped. */
  min-width:268px;
}
.orbit-theme #app-main .reporting-date-control label{margin:0;cursor:pointer}
.orbit-theme #app-main .reporting-date-control small{color:var(--muted);font-size:.72rem}
.orbit-theme #app-main .reporting-date-control select{
  height:auto;
  padding:2px 26px 2px 0;
  border:0;
  background:transparent;
  color:var(--text);
  font-size:.92rem;
  font-weight:700;
  cursor:pointer;
  appearance:none;
  text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23667085'%3E%3Cpath d='m7 10 5 5 5-5H7Z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right center;
  background-size:18px;
}
.orbit-theme #app-main .reporting-date-control select:focus{
  outline:2px solid rgba(91,61,245,.35);
  outline-offset:3px;
  border-radius:6px;
}

/* ============================================================================
   Sign-in card
   The heading uses the Orbit mark rather than the raw COMPANY_NAME string, so
   the sign-in page always shows the product's identity consistently.
   ========================================================================= */
.orbit-theme .auth-shell{display:grid;place-items:center;min-height:100vh;padding:24px}
.orbit-theme .auth-card{
  max-width:420px;
  width:100%;
  margin:0 auto;
  padding:34px 32px 30px;
  overflow:hidden;
}
/* The mark is white artwork built for the dark rail, so it needs a dark panel
   to sit on. Bleeding it to the card edges makes that read as a deliberate
   header rather than a patch behind the logo. */
.orbit-theme .auth-brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  margin:-34px -32px 22px;
  padding:26px 32px 22px;
  border-radius:14px 14px 0 0;
  background:linear-gradient(160deg,#0a1733 0%,#0b1430 60%,#071126 100%);
}
.orbit-theme .auth-logo{
  display:block;
  width:100%;
  max-width:210px;
  height:auto;
  object-fit:contain;
}
.orbit-theme .auth-subtitle{
  text-transform:uppercase;
  letter-spacing:.16em;
  text-indent:.16em;
  font-size:.58rem;
  font-weight:700;
  color:#8a93ad;
}
.orbit-theme .auth-lede{
  text-align:center;
  margin:0 0 20px;
  font-size:.86rem;
}

/* ============================================================================
   Roles & Permissions grid
   ========================================================================= */
.orbit-theme #app-main .rbac-panel{padding:0;overflow:hidden}
.orbit-theme #app-main .rbac-scroll{overflow-x:auto}
.orbit-theme #app-main .rbac-grid{
  width:100%;
  border-collapse:collapse;
  min-width:640px;
}
.orbit-theme #app-main .rbac-grid thead th{
  position:sticky;
  top:0;
  background:#f8f9fc;
  border-bottom:1px solid var(--border);
  padding:14px 16px;
  font-size:.78rem;
  text-align:center;
  white-space:nowrap;
}
.orbit-theme #app-main .rbac-grid thead th.rbac-perm-col{
  text-align:left;
  width:52%;
}
.orbit-theme #app-main .rbac-role-col{min-width:120px}
.orbit-theme #app-main .rbac-lock{
  display:block;
  font-size:.6rem;
  font-weight:600;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-top:2px;
}
.orbit-theme #app-main .rbac-category td{
  background:#f2f3f9;
  font-size:.68rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#5b6478;
  padding:8px 16px;
}
.orbit-theme #app-main .rbac-perm{
  padding:12px 16px;
  border-bottom:1px solid var(--border);
}
.orbit-theme #app-main .rbac-perm strong{display:block;font-size:.88rem}
.orbit-theme #app-main .rbac-perm small{display:block;color:var(--muted);font-size:.76rem;margin-top:2px}
.orbit-theme #app-main .rbac-cell{
  text-align:center;
  border-bottom:1px solid var(--border);
  padding:12px 16px;
}
.orbit-theme #app-main .rbac-cell input[type=checkbox]{
  width:19px;height:19px;
  accent-color:var(--accent);
  cursor:pointer;
}
.orbit-theme #app-main .rbac-cell input[disabled]{cursor:not-allowed;opacity:.55}
.orbit-theme #app-main .rbac-grid tbody tr:hover .rbac-perm,
.orbit-theme #app-main .rbac-grid tbody tr:hover .rbac-cell{background:#fafbff}

/* Cut-off time selects on the cycle schedule page need room for "10:00 PM". */
.orbit-theme #app-main table select[name^="cutoff_hour"]{min-width:104px;padding:9px 10px}

/* Grouped sub-items in the Administration dropdown. */
.nav-dropdown-group{border-bottom:1px solid rgba(117,139,182,.14);padding-bottom:6px;margin-bottom:6px}.nav-dropdown-group-title{display:block;padding:8px 14px 4px;font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#8290ad}.nav-dropdown-menu a.nav-dropdown-sub{padding-left:26px}

/* Master product catalog — product list (replaces the wide clipping table). */
.catalog-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.catalog-row{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;padding:14px 16px;border:1px solid #e5e9f0;border-radius:12px;background:#fff;transition:border-color .12s ease,box-shadow .12s ease}
.catalog-row:hover{border-color:#c7d2fe;box-shadow:0 3px 12px rgba(37,99,235,.07)}
.catalog-row-main{min-width:0;flex:1 1 auto}
.catalog-row-name{margin:0 0 4px;font-size:1rem;font-weight:750;line-height:1.35;color:#152033}
.catalog-row-ids{font-size:.8rem;color:#667085;margin-bottom:9px}
.catalog-row-ids .mono{font-family:ui-monospace,Consolas,monospace}
.catalog-chips{display:flex;flex-wrap:wrap;gap:6px}
.catalog-chip{font-size:.72rem;font-weight:700;padding:3px 10px;border-radius:999px;background:#eef2f7;color:#475569;white-space:nowrap}
.catalog-chip.cat{background:#eef0ff;color:#4f46e5}
.catalog-chip.sub{background:#f1f5f9;color:#475569}
.catalog-chip.brand{background:#f1f5f9;color:#334155}
.catalog-chip.fits{background:#e0f2fe;color:#0369a1}
.catalog-chip.vendor{background:#f8fafc;color:#64748b;border:1px solid #eef0f5}
.catalog-row-side{display:flex;align-items:center;gap:22px;flex:0 0 auto}
.catalog-prices{display:flex;gap:20px;text-align:right}
.catalog-price{display:flex;flex-direction:column;gap:1px}
.catalog-price span{font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;color:#94a3b8;font-weight:800}
.catalog-price strong{font-size:.98rem;color:#0f172a}
.catalog-price.retail strong{color:#047857}
.catalog-empty{padding:28px;text-align:center}
@media(max-width:760px){.catalog-row{flex-direction:column;align-items:stretch}.catalog-row-side{width:100%;justify-content:space-between;gap:14px}}

/* Breadcrumb trail. */
.breadcrumbs{margin:0 0 18px}
.breadcrumbs ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:2px;margin:0;padding:0;font-size:.82rem}
.breadcrumbs li{display:flex;align-items:center;color:#8290ad}
.breadcrumbs li+li::before{content:"›";margin:0 8px;color:#b6c0d4;font-size:.95rem}
.breadcrumbs a{color:#5a6b8c;text-decoration:none;font-weight:600}
.breadcrumbs a:hover{color:#2563eb;text-decoration:underline}
.breadcrumbs [aria-current="page"]{color:#152033;font-weight:700}
.orbit-theme .breadcrumbs a{color:#8ea6d8}
.orbit-theme .breadcrumbs [aria-current="page"]{color:#e6ecf7}
.orbit-theme .breadcrumbs li{color:#6d7da3}

/* Product edit form. */
.item-edit-meta{color:#8290ad;font-size:.8rem;margin-bottom:14px}
.item-edit-meta .mono{font-family:ui-monospace,Consolas,monospace}
.item-edit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.item-edit-grid label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.9rem}
.item-edit-grid label.span-2{grid-column:span 2}
.item-edit-actions{display:flex;gap:12px;margin-top:20px}
@media(max-width:820px){.item-edit-grid{grid-template-columns:1fr 1fr}.item-edit-grid label.span-2{grid-column:span 2}}
@media(max-width:520px){.item-edit-grid{grid-template-columns:1fr}.item-edit-grid label.span-2{grid-column:span 1}}

/* Audit Report — plain-language activity feed. */
.audit-controls{display:flex;flex-wrap:wrap;align-items:end;gap:18px}
.audit-controls label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:.85rem}
.audit-toggle{flex-direction:row!important;align-items:center;gap:8px;font-weight:600}
.audit-export{margin-left:auto;display:flex;gap:10px}
.audit-feed{display:flex;flex-direction:column;gap:8px}
.audit-entry{border:1px solid #e5e9f0;border-radius:11px;background:#fff;overflow:hidden}
.audit-entry>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:12px 15px;transition:background .12s}
.audit-entry>summary::-webkit-details-marker{display:none}
.audit-entry>summary:hover{background:#f8fafc}
.audit-dot{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:#94a3b8}
.audit-entry.cat-security .audit-dot{background:#e5484d}
.audit-entry.cat-catalog .audit-dot{background:#4f46e5}
.audit-entry.cat-counts .audit-dot{background:#0ea5e9}
.audit-entry.cat-reports .audit-dot{background:#12b981}
.audit-entry.cat-system .audit-dot{background:#94a3b8}
.audit-when{flex:0 0 auto;font-size:.78rem;color:#8290ad;font-variant-numeric:tabular-nums;min-width:118px}
.audit-summary{flex:1 1 auto;font-size:.9rem;color:#152033;min-width:0}
.audit-tag{flex:0 0 auto;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#64748b;background:#eef2f7;padding:3px 9px;border-radius:999px;white-space:nowrap}
.audit-entry.cat-security .audit-tag{color:#c01c28;background:#fdeced}
/* Category chip on the Activity & Audit Log table (v7.20.0). */
.audit-cat{display:inline-block;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#64748b;background:#eef2f7;padding:3px 9px;border-radius:999px;white-space:nowrap}
.audit-cat.cat-security{color:#c01c28;background:#fdeced}
.audit-cat.cat-catalog{color:#4338ca;background:#eef0ff}
.audit-cat.cat-counts{color:#0369a1;background:#e0f2fe}
.audit-cat.cat-reports{color:#0f766e;background:#dcfaf1}
.audit-detail{border-top:1px solid #eef0f5;padding:14px 16px;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;background:#fbfcfe}
.audit-detail>div{display:flex;flex-direction:column;gap:2px}
.audit-detail .audit-raw{grid-column:1 / -1}
.audit-k{font-size:.64rem;text-transform:uppercase;letter-spacing:.05em;color:#94a3b8;font-weight:800}
.audit-v{font-size:.86rem;color:#152033}
.audit-v .mono{font-family:ui-monospace,Consolas,monospace;font-size:.8rem;color:#475569}
.report-rowcount{background:#eef7f0;color:#0f9d68;font-weight:700;font-size:.8rem;padding:6px 12px;border-radius:999px}
@media(max-width:680px){.audit-detail{grid-template-columns:1fr}.audit-when{min-width:0}.audit-tag{display:none}}

/* Scanner detail. */
.scanner-loc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:6px}
.scanner-loc{border:1px solid #e5e9f0;border-radius:10px;padding:12px 14px;background:#fff}
.scanner-loc strong{display:block;font-size:.92rem;color:#152033;margin-bottom:3px}
.scanner-loc span{font-size:.78rem;color:#667085}
.catalog-chip.loc{background:#eaf5ff;color:#0369a1}
/* Clickable report rows (generic drill-down). */
tr.row-link{cursor:pointer}
tr.row-link:hover{background:#f4f7ff}

/* Scanner detail summary cards. */
.scanner-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}.scanner-summary-card{background:#fff;border:1px solid #e5e9f0;border-radius:12px;padding:16px 18px}.scanner-summary-label{display:block;font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:#94a3b8;font-weight:800;margin-bottom:6px}.scanner-summary-card strong{display:block;font-size:1.5rem;color:#0f172a;line-height:1.1}.scanner-summary-card small{display:block;margin-top:5px;font-size:.75rem;color:#8290ad}@media(max-width:900px){.scanner-summary{grid-template-columns:1fr 1fr}}@media(max-width:520px){.scanner-summary{grid-template-columns:1fr}}

/* Status-email scheduled send time. */
.send-time-row{margin:6px 0 2px;padding:12px 14px;background:#f7f8fb;border-radius:10px}
.send-time-selects{display:flex;align-items:center;gap:8px;margin-top:4px}
.send-time-selects select{min-width:70px}
.send-time-selects span{color:#8290ad;font-weight:700}

/* Mobile nav fix: the slide-in drawer must sit ABOVE the dimming backdrop, or
   the backdrop swallows every tap on the menu (and closes it). Previously the
   sidebar was z-index 70 and the backdrop 89, so nav links were unclickable on
   phones and tablets. Keep both below the modal layer (1000). */
.app-sidebar{z-index:120}
.mobile-nav-backdrop{z-index:110}

/* In-field camera scan button + camera overlay (count page). */
.barcode-input-wrap{position:relative;flex:1;display:flex}
.barcode-input-wrap .barcode-field{flex:1;padding-right:64px}
.barcode-camera-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:48px;height:48px;min-height:0;display:grid;place-items:center;padding:0;border-radius:10px;background:#2563eb;color:#fff;border:0;cursor:pointer}
.barcode-camera-btn:hover{background:#1d4ed8}
#scan-form{align-items:stretch}
.scanner-overlay{position:fixed;inset:0;z-index:1200;background:rgba(6,12,26,.92);display:grid;place-items:center;padding:16px}
.scanner-overlay[hidden]{display:none}
.scanner-modal{width:min(520px,100%);background:#0b1730;border-radius:18px;padding:16px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.scanner-video-wrap{position:relative;width:100%;aspect-ratio:4/3;background:#000;border-radius:12px;overflow:hidden}
#scanner-video{width:100%;height:100%;object-fit:cover;display:block}
.scanner-reticle{position:absolute;left:10%;right:10%;top:38%;bottom:38%;border:3px solid rgba(37,99,235,.9);border-radius:12px;box-shadow:0 0 0 100vmax rgba(0,0,0,.25)}
.scanner-hint{color:#dbe4f3;text-align:center;font-weight:600;margin:14px 6px 4px;line-height:1.4}
.scanner-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:6px}.scanner-zoom-row{display:flex;align-items:center;gap:10px;margin-top:10px;color:#c7d2e6;font-size:.75rem}.scanner-zoom-row input[type=range]{flex:1;accent-color:#6c4cff}
@media(max-width:800px){.barcode-input-wrap .barcode-field{padding-right:58px}.barcode-camera-btn{width:44px;height:44px;right:6px}}

/* Feedback. */
.sidebar-feedback{margin-top:auto;padding-top:10px}
.feedback-nav{position:relative}
.feedback-count{background:#e5484d;color:#fff}
.feedback-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:20px;align-items:start}
.feedback-new textarea{width:100%;border:1px solid #cfd6e3;border-radius:9px;padding:11px 12px;font:inherit;resize:vertical}
.feedback-thread-list{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.feedback-thread-row{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding:13px 15px;border:1px solid #e5e9f0;border-radius:11px;background:#fff;text-decoration:none;color:inherit;transition:border-color .12s,box-shadow .12s}
.feedback-thread-row:hover{border-color:#c7d2fe;box-shadow:0 3px 12px rgba(37,99,235,.06)}
.feedback-thread-row.unread{background:#f5f8ff;border-color:#c7d2fe}
.feedback-thread-title{font-weight:750;color:#152033;display:flex;align-items:center;gap:8px}
.unread-dot{width:9px;height:9px;border-radius:50%;background:#2563eb;flex:0 0 auto}
.feedback-thread-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:7px}
.feedback-chip{font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:999px;background:#eef2f7;color:#475569;white-space:nowrap}
.feedback-chip.cat-bug{background:#fdeced;color:#c01c28}
.feedback-chip.cat-feature{background:#eef0ff;color:#4f46e5}
.feedback-chip.cat-suggestion{background:#e0f2fe;color:#0369a1}
.feedback-chip.cat-question{background:#fef3e0;color:#b54708}
.feedback-status{font-size:.72rem;font-weight:800;padding:3px 9px;border-radius:999px;text-transform:uppercase;letter-spacing:.03em}
.feedback-status.status-open{background:#dcfce7;color:#166534}
.feedback-status.status-in_progress{background:#fef3e0;color:#b54708}
.feedback-status.status-resolved{background:#e5e7eb;color:#374151}
.feedback-by{font-size:.78rem;color:#475569;font-weight:600}
.feedback-count-label,.feedback-when{font-size:.76rem;color:#8290ad;white-space:nowrap}
.feedback-empty{padding:26px;text-align:center}
.feedback-filter{display:flex;gap:6px;flex-wrap:wrap}
.feedback-filter a{font-size:.8rem;font-weight:700;padding:5px 11px;border-radius:999px;text-decoration:none;color:#475569;background:#eef2f7}
.feedback-filter a.active{background:#2563eb;color:#fff}
.feedback-admin-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.feedback-admin-label{font-weight:700;color:#475569}
.status-btn{background:#eef2f7;color:#334155;padding:8px 14px}
.status-btn.current{outline:2px solid #94a3b8}
.status-btn.status-resolved{background:#dcfce7;color:#166534}
.status-btn.status-in_progress{background:#fef3e0;color:#b54708}
.feedback-messages{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
.feedback-message{max-width:78%;padding:12px 15px;border-radius:14px}
.feedback-message.from-user{align-self:flex-start;background:#f1f5f9;border-bottom-left-radius:4px}
.feedback-message.from-admin{align-self:flex-end;background:#e8efff;border-bottom-right-radius:4px}
.feedback-message-head{display:flex;align-items:center;gap:8px;margin-bottom:5px;font-size:.82rem}
.feedback-admin-tag{background:#2563eb;color:#fff;font-size:.66rem;font-weight:800;padding:2px 7px;border-radius:999px;text-transform:uppercase}
.feedback-message-time{color:#8290ad;font-size:.74rem}
.feedback-message-body{white-space:pre-wrap;line-height:1.5;color:#1e293b}
.feedback-reply textarea{width:100%;border:1px solid #cfd6e3;border-radius:9px;padding:11px 12px;font:inherit;resize:vertical}
@media(max-width:900px){.feedback-layout{grid-template-columns:1fr}.feedback-message{max-width:90%}}

/* Compact feedback nav badge (was stretching full width). */
.feedback-nav{display:flex;align-items:center;gap:10px}
.feedback-nav>span:nth-child(2){flex:1}
.nav-count.feedback-count{flex:0 0 auto;width:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:800;margin-left:auto}

/* Pending-photo: camera icon button + live camera capture overlay. */
.photo-camera-icon-btn{display:inline-grid;place-items:center;width:64px;height:64px;padding:0;border-radius:14px;background:#2563eb;color:#fff;border:0;cursor:pointer}
.photo-camera-icon-btn:hover{background:#1d4ed8}
.photo-step-actions{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:6px}
.photo-camera-overlay{position:fixed;inset:0;z-index:1300;background:rgba(6,12,26,.94);display:grid;place-items:center;padding:16px}
.photo-camera-overlay[hidden]{display:none}
.photo-camera-modal{width:min(560px,100%);background:#0b1730;border-radius:18px;padding:16px;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.photo-camera-video-wrap{position:relative;width:100%;aspect-ratio:4/3;background:#000;border-radius:12px;overflow:hidden}
#photo-camera-video{width:100%;height:100%;object-fit:cover;display:block}
.photo-camera-hint{color:#dbe4f3;text-align:center;font-weight:600;margin:14px 6px 10px}
.photo-camera-actions{display:flex;gap:12px;justify-content:center}
#photo-camera-capture{background:#2563eb;min-width:150px}

/* Install-app affordance (Android/Chrome). Hidden unless the browser offers it. */
.pwa-install-button{position:fixed;right:16px;bottom:16px;z-index:1400;background:#2563eb;color:#fff;border:0;border-radius:999px;padding:12px 20px;font-weight:800;box-shadow:0 8px 24px rgba(37,99,235,.35);cursor:pointer}
.pwa-install-button[hidden]{display:none}

/* Bulk upload landing (Administration → Bulk Upload) */
.bulk-upload-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:8px}
.bulk-upload-option{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit;transition:transform .12s ease,box-shadow .12s ease}
.bulk-upload-option:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(15,23,42,.12)}
.bulk-upload-option h2{margin:0}
.bulk-upload-option .button{align-self:flex-start;margin-top:auto}

/* ---- v7.17.0 Phase 3: territory-aware user management ---- */
.role-badge.super_admin{background:#e0e7ff;color:#3730a3}
.role-badge.store{background:#ecfdf5;color:#047857}
.visually-hidden-select{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.user-role-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.user-role-tab{border:1px solid #d0d5dd;background:#fff;color:#475467;border-radius:999px;padding:7px 15px;font-size:.85rem;font-weight:700;cursor:pointer;transition:background .12s,color .12s,border-color .12s}
.user-role-tab:hover{background:#f2f4f7}
.user-role-tab.active{background:#2563eb;color:#fff;border-color:#2563eb}
.state-fieldset{border:1px solid #e4e7ec;border-radius:12px;padding:14px;margin:2px 0}
.state-fieldset legend{padding:0 6px;font-weight:800;font-size:.9rem;color:#344054}
.state-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px 14px;max-height:230px;overflow:auto;padding:4px 2px}
.state-check{display:flex;align-items:center;gap:8px;font-size:.86rem;color:#344054;font-weight:600;cursor:pointer;padding:3px 4px;border-radius:7px}
.state-check:hover{background:#f2f4f7}
.state-check input{width:16px;height:16px;flex:none}
.state-check span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-editor-grid section.span-2{grid-column:1/-1}
[data-user-state-filter]{max-width:230px}
@media(max-width:680px){.state-grid{grid-template-columns:1fr;max-height:200px}}

/* v7.21.0 - Pending Review pagination bar */
.queue-position{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin:0 0 .9rem}
.queue-position p{margin:0}
.queue-size-label{display:flex;align-items:center;gap:.45rem;font-size:.82rem;color:#475467;font-weight:700;margin:0}
.queue-size-label select{min-height:38px;padding:.3rem .5rem;margin:0}
.approvals-pager{gap:.6rem;align-items:center;position:sticky;bottom:0;z-index:5;padding:.7rem;margin-top:1.1rem;background:rgba(255,255,255,.94);backdrop-filter:blur(6px);border:1px solid #e4e7ec;border-radius:12px;box-shadow:0 -2px 12px rgba(30,50,80,.06)}
.approvals-pager form{margin:0}
.approvals-pager .pager-jump select{min-height:40px;margin:0;font-weight:700}
.approvals-pager button[disabled]{opacity:.45;cursor:not-allowed}
.pager-note{text-align:center;font-size:.8rem;margin:.5rem 0 0}
@media(max-width:680px){.approvals-pager{flex-wrap:nowrap}.approvals-pager .pager-jump{flex:1;min-width:0}.approvals-pager .pager-jump select{width:100%}}

/* v7.23.0 - feedback priority and attachments */
.priority-picker{border:1px solid #e4e7ec;border-radius:12px;padding:.7rem .8rem;margin:0}
.priority-picker legend{font-size:.82rem;font-weight:700;color:#344054;padding:0 .3rem}
.priority-options{display:flex;gap:.5rem;flex-wrap:wrap}
.priority-option{display:flex;align-items:center;gap:.4rem;border:1px solid #e4e7ec;border-radius:999px;padding:.35rem .7rem;cursor:pointer;font-size:.85rem;font-weight:600;margin:0}
.priority-option input{width:15px;height:15px;flex:none;margin:0}
.priority-option:hover{background:#f2f4f7}
.priority-option:has(input:checked){border-color:#4338ca;background:#eef2ff;color:#3730a3}
.feedback-priority{display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;padding:.16rem .5rem;border-radius:999px}
.feedback-priority.priority-high{background:#fee4e2;color:#b42318}
.feedback-priority.priority-medium{background:#fef0c7;color:#b54708}
.feedback-priority.priority-low{background:#e0eaff;color:#3538cd}
.feedback-priority.priority-high::before{content:"";width:6px;height:6px;border-radius:50%;background:#d92d20}
.priority-btn.priority-high.current{background:#b42318;border-color:#b42318;color:#fff}
.priority-btn.priority-medium.current{background:#b54708;border-color:#b54708;color:#fff}
.priority-btn.priority-low.current{background:#3538cd;border-color:#3538cd;color:#fff}
.feedback-priority-filter{margin:0 0 .8rem;align-items:center}
.feedback-filter-label{font-size:.78rem;font-weight:700;color:#667085;margin-right:.2rem}
.feedback-attach-label{font-size:.78rem;color:#475467;font-weight:600}
.feedback-attachments{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.6rem}
.feedback-attachment{margin:0;max-width:260px}
.feedback-attachment img,.feedback-attachment video{width:100%;max-height:220px;object-fit:cover;border-radius:10px;border:1px solid #e4e7ec;background:#0c111d;display:block}
.feedback-attachment video{object-fit:contain}
.feedback-attachment figcaption{font-size:.72rem;color:#667085;margin-top:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attachment-error{color:#b42318;font-weight:700}
@media(max-width:680px){.feedback-attachment{max-width:100%}}

/* v7.24.0 - Scraping Tool */
.scrape-progress{display:flex;flex-direction:column;gap:.6rem}
.scrape-progress p{margin:0}
.progress-track{height:10px;border-radius:999px;background:#eaecf0;overflow:hidden}
.progress-fill{height:100%;background:linear-gradient(90deg,#4338ca,#6366f1);transition:width .4s ease}
.run-downloads{display:flex;gap:.5rem;flex-wrap:wrap}
.add-vendor{margin-top:1rem;border:1px dashed #d0d5dd;border-radius:12px;padding:.7rem .9rem}
.add-vendor summary{cursor:pointer;font-weight:700;font-size:.9rem;color:#3538cd}
.add-vendor form{margin-top:.8rem}
.inline-time{display:inline-flex;align-items:center;gap:.4rem}
.inline-time select{margin:0;min-width:80px}

/* v7.25.0 - vendor diagnosis */
.diagnosis-card{border-left:4px solid #4338ca}
.diagnosis-steps{list-style:none;margin:.8rem 0 0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.diagnosis-step{display:flex;gap:.7rem;align-items:flex-start;padding:.6rem .7rem;border-radius:10px;background:#f9fafb;border:1px solid #eaecf0}
.diagnosis-step p{margin:.15rem 0 0;font-size:.86rem;color:#475467}
.diagnosis-state{flex:none;font-size:.68rem;font-weight:800;letter-spacing:.05em;padding:.2rem .45rem;border-radius:6px;margin-top:.1rem}
.diagnosis-step.state-ok .diagnosis-state{background:#d1fadf;color:#027a48}
.diagnosis-step.state-warn .diagnosis-state{background:#fef0c7;color:#b54708}
.diagnosis-step.state-fail{background:#fef3f2;border-color:#fecdca}
.diagnosis-step.state-fail .diagnosis-state{background:#fee4e2;color:#b42318}
.diagnose-actions{display:flex;gap:.5rem;flex-wrap:wrap}

/* --- Inter-Store Transfer (v7.27.0) --------------------------------------- */
.transfer-store-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.transfer-store-bar>div{display:grid;gap:3px}
.transfer-store-bar strong{font-size:1.25rem}
.transfer-store-switch{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.transfer-store-switch label{font-size:.78rem;font-weight:700;color:var(--muted);display:grid;gap:.3rem}
.transfer-store-switch select{min-width:230px}
.transfer-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:18px 0}
.transfer-action-card{display:flex;align-items:center;gap:16px;padding:22px;border:1px solid var(--border,#dfe5ec);border-radius:14px;background:#fff;text-decoration:none;color:inherit;transition:transform .16s,box-shadow .16s,border-color .16s}
.transfer-action-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(19,42,82,.12)}
.transfer-action-card>div{display:grid;gap:5px;min-width:0}
.transfer-action-card strong{font-size:1.1rem}
.transfer-action-card small{color:var(--muted);line-height:1.45}
.transfer-action-card.pending,.transfer-action-card.disabled{opacity:.6;pointer-events:none}
.transfer-kpis{margin-bottom:18px}
.transfer-search-bar{display:grid;grid-template-columns:minmax(260px,2.4fr) auto auto;gap:12px;align-items:end}
.transfer-search-bar label{display:grid;gap:.35rem;font-size:.8rem;font-weight:700;color:var(--muted)}
.transfer-search-bar input,.transfer-search-bar select{width:100%;min-height:48px}
.transfer-search-bar .transfer-search-field input{font-size:1.05rem}
.transfer-search-bar button,.transfer-search-bar .button{min-height:48px;white-space:nowrap}
.availability-card{margin-top:16px}
.availability-table td.num,.availability-table th.num{text-align:right}
.availability-table th{white-space:nowrap}
.qty-unknown{color:#b54708;font-weight:700;font-size:.82rem}
.stock-source{display:inline-flex;padding:3px 8px;border-radius:999px;font-size:.72rem;font-weight:800}
.stock-source.live{background:#e3f9f0;color:#0f9d68}
.stock-source.counted{background:#e6f0ff;color:#175cd3}
.stock-source.none{background:#f2f4f7;color:#667085}
.transfer-status{display:inline-flex;padding:4px 10px;border-radius:999px;font-size:.76rem;font-weight:800;background:#f2f4f7;color:#475467}
.transfer-status.s-requested{background:#eef2f7;color:#344054}
.transfer-status.s-accepted,.transfer-status.s-preparing{background:#e6f0ff;color:#175cd3}
.transfer-status.s-ready_for_pickup,.transfer-status.s-ready_to_ship{background:#efe9ff;color:#5b3df5}
.transfer-status.s-picked_up,.transfer-status.s-shipped,.transfer-status.s-in_transit{background:#fef3e0;color:#b54708}
.transfer-status.s-received,.transfer-status.s-completed{background:#e3f9f0;color:#0f9d68}
.transfer-status.s-rejected,.transfer-status.s-cancelled,.transfer-status.s-voided{background:#f2f4f7;color:#667085}
.transfer-status.s-receipt_exception{background:#fdeced;color:#c01c28}
.store-picker{border:1px solid var(--border,#dfe5ec);border-radius:12px;padding:14px}
.store-picker legend{font-weight:800;font-size:.85rem;padding:0 6px}
.store-checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px;max-height:320px;overflow:auto}
.store-checkbox{display:flex!important;align-items:center;gap:10px;padding:9px 11px;border:1px solid var(--border,#dfe5ec);border-radius:10px;background:#fff;font-weight:600;cursor:pointer}
.store-checkbox input{width:auto;flex:0 0 auto}
.store-checkbox span{display:grid;gap:2px;min-width:0}
.store-checkbox small{color:var(--muted);font-size:.74rem}
.store-checkbox:has(input:checked){border-color:#5b3df5;background:#f6f3ff}
.group-list{display:grid;gap:14px}
.group-card{border:1px solid var(--border,#dfe5ec);border-radius:14px;padding:18px;background:#fff}
.group-card.inactive{opacity:.75;background:#fbfcfe}
.group-card>header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.group-card h3{margin:0 0 4px;font-size:1.1rem}
.group-card h3 a{text-decoration:none}
.group-card p{margin:2px 0}
.group-chip-list{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.group-chip-list .location-chip{background:#eef2f7;border:1px solid #dfe5ee;color:#344054;border-radius:999px;padding:5px 12px;font-weight:700;font-size:.82rem}
.group-chip-list .location-chip small{margin-left:6px;color:#667085;font-weight:600}
.compact-alert{padding:.6rem .85rem;font-size:.85rem;margin:10px 0}
.group-editor>summary{list-style:none;cursor:pointer;width:max-content}
.group-editor>summary::-webkit-details-marker{display:none}
.group-editor-panel{margin-top:14px;padding-top:14px;border-top:1px solid var(--border,#dfe5ec);display:grid;gap:10px}
.group-editor-panel h4{margin:8px 0 0;font-size:.95rem}
@media(max-width:900px){.transfer-actions{grid-template-columns:1fr}.transfer-search-bar{grid-template-columns:1fr}.transfer-search-bar button,.transfer-search-bar .button{width:100%}.group-card>header{flex-direction:column}}

/* ---- Inter Transfer: the fulfilment lifecycle (v7.28.0) ------------------ */
.form-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:4px}
.form-actions form{margin:0}
.qty-input{width:96px;text-align:center;font-weight:700}
.request-inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.request-inline .qty-input{width:74px}
.request-inline small{flex-basis:100%;white-space:normal}
.transfer-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:18px}
.transfer-summary>div{display:grid;gap:3px;min-width:0}
.transfer-summary strong{font-size:1.05rem;overflow-wrap:anywhere}
.transfer-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}
.transfer-tab{padding:9px 16px;border-radius:999px;border:1px solid var(--border,#dfe5ec);background:#fff;color:inherit;text-decoration:none;font-weight:700;font-size:.88rem}
.transfer-tab.active{background:#5b3df5;border-color:#5b3df5;color:#fff}
.tab-count{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;background:rgba(0,0,0,.12);font-size:.76rem}
.transfer-timeline{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.transfer-timeline li{position:relative;margin-left:11px;padding:14px 0 14px 22px;border-left:2px solid var(--border,#dfe5ec)}
.transfer-timeline li:last-child{border-left-color:transparent}
.transfer-timeline li>div{display:grid;gap:5px;min-width:0}.timeline-headline{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;min-width:0}.timeline-headline strong{font-size:.95rem;line-height:1.35}.timeline-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;font-size:.8rem;color:#667085;min-width:0}.timeline-meta .sep{opacity:.45}.timeline-role{padding:2px 8px;border-radius:999px;background:#eef2f8;color:#475467;font-size:.72rem;font-weight:700;letter-spacing:.02em;text-transform:capitalize;white-space:nowrap}
.transfer-timeline strong{font-size:.95rem}
.timeline-dot{position:absolute;left:-9px;top:16px;width:16px;height:16px;border-radius:50%;background:#c7d0e0;border:3px solid #fff;box-shadow:0 0 0 1px #dfe5ec}
.timeline-dot.accepted,.timeline-dot.received,.timeline-dot.completed,.timeline-dot.exception_resolved{background:#0f9d68}
.timeline-dot.rejected,.timeline-dot.cancelled,.timeline-dot.voided,.timeline-dot.exception{background:#c01c28}
.timeline-dot.handed_off,.timeline-dot.in_transit,.timeline-dot.ready{background:#b54708}
.timeline-dot.submitted,.timeline-dot.preparing{background:#175cd3}
.timeline-move{font-size:.76rem;font-weight:700;color:#5b3df5;white-space:nowrap;padding:2px 9px;border-radius:999px;background:#f0edff;border:1px solid #e0dafe}
.timeline-note{margin:6px 0 0;font-size:.87rem;color:#475467;white-space:pre-wrap;overflow-wrap:anywhere;padding:9px 12px;border-radius:9px;background:var(--surface-soft,#f7f9fc);border:1px solid var(--line,#e5e9f0)}
a.metric-card{text-decoration:none;color:inherit}
.orbit-theme .transfer-tab{background:#132244;border-color:#2b3c63;color:#dae4fa}
.orbit-theme .transfer-tab.active{background:linear-gradient(135deg,#6d4aff,#245eea);border-color:#6d4aff;color:#fff}
.orbit-theme .transfer-timeline li{border-left-color:#22345a}
.orbit-theme .timeline-dot{border-color:#0d1a35;box-shadow:0 0 0 1px #22345a;background:#2b3c63}
.orbit-theme .timeline-note{color:#a9b6d2}
@media(max-width:700px){.transfer-summary{grid-template-columns:1fr 1fr}.request-inline{flex-direction:column;align-items:stretch}.request-inline .qty-input{width:100%}}

/* ---- Inter Transfer: statements and settlement (v7.29.0) ----------------- */
/* A balance is never shown as a bare signed number: the sign is resolved into
   a direction sentence server-side, and these two classes colour it. Green is
   money coming to us, red money leaving - the same reading as .positive and
   .negative elsewhere, kept separate so a statement figure can be restyled
   without touching every variance table in the app. */
/* The Statements entry point sits below the two-up action grid rather than
   inside it: a third column would squeeze all three on a laptop, and money is
   a different kind of errand from finding a part. */
.transfer-action-wide{width:100%;margin:0 0 18px}
.balance-owed-to-us{color:#047857}
.balance-owed-by-us{color:#b91c1c}
.entry-type{display:inline-flex;padding:3px 9px;border-radius:999px;font-size:.74rem;font-weight:800;background:#f2f4f7;color:#475467;white-space:nowrap}
.entry-type.e-transfer{background:#e6f0ff;color:#175cd3}
.entry-type.e-payment{background:#e3f9f0;color:#0f9d68}
.entry-type.e-opening_balance{background:#efe9ff;color:#5b3df5}
.entry-type.e-adjustment{background:#fef3e0;color:#b54708}
table tfoot th{border-top:2px solid #dfe5ec;border-bottom:0;font-size:.85rem;text-transform:none;color:#152033;font-weight:800}
.orbit-theme .balance-owed-to-us{color:#4ade80}
.orbit-theme .balance-owed-by-us{color:#f87171}
.orbit-theme .entry-type{background:#132244;color:#dae4fa}
.orbit-theme table tfoot th{border-top-color:#22345a;color:#eaf1ff}

/* --- Inter Transfer management, search and aging (v7.30.0) --------------- */
.manage-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.manage-columns>.card{margin:0}
.search-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;align-items:end}
.search-filters label{display:grid;gap:.35rem;font-size:.78rem;font-weight:700;color:var(--muted)}
.search-filters label.wide{grid-column:1/-1}
.search-filters input,.search-filters select{width:100%;min-height:42px}
.search-actions{display:flex;gap:10px;align-items:end}
.search-actions button,.search-actions .button{min-height:42px;white-space:nowrap}
.filter-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.filter-chip{display:inline-flex;padding:5px 12px;border-radius:999px;background:#eef2f7;color:#344054;font-size:.8rem;font-weight:700}
.age-bucket{display:inline-flex;padding:3px 10px;border-radius:999px;font-size:.76rem;font-weight:800;background:#e3f9f0;color:#0f9d68;white-space:nowrap}
.age-bucket.ageing{background:#fef3e0;color:#b54708}
.age-bucket.old{background:#fdeced;color:#c01c28}
.age-warn{color:#b54708}
.aging-bars{display:grid;gap:12px}
.aging-bar{display:grid;grid-template-columns:110px minmax(0,1fr) 110px;gap:14px;align-items:center}
.aging-bar-label{font-size:.82rem;font-weight:700;color:var(--muted)}
.aging-bar strong{text-align:right;font-variant-numeric:tabular-nums}
.aging-bar-track{height:12px;border-radius:999px;background:#eef2f7;overflow:hidden}
.aging-bar-fill{height:100%;border-radius:999px;background:#12b981;min-width:2px}
.aging-bar-fill.b2{background:#5b3df5}
.aging-bar-fill.b3{background:#f0932b}
.aging-bar-fill.b4{background:#e5484d}
.aging-bar-fill.b5{background:#c01c28}
.aging-bar-fill.b6{background:#8b0f18}
.reconcile-check.ok .section-head h2::before{content:"✓ ";color:#0f9d68}
.reconcile-check.bad .section-head h2::before{content:"! ";color:#c01c28}
.metric-card.warn{border-color:#f0932b}
.orbit-theme .filter-chip{background:#132244;color:#dae4fa}
.orbit-theme .aging-bar-track{background:#132244}
.orbit-theme .age-bucket{background:#123b2c;color:#4ade80}
.orbit-theme .age-bucket.ageing{background:#3a2a10;color:#fbbf24}
.orbit-theme .age-bucket.old{background:#3d1620;color:#f87171}
@media(max-width:900px){.manage-columns{grid-template-columns:1fr}.aging-bar{grid-template-columns:90px minmax(0,1fr) 92px;gap:10px}}
.statement-head-actions{display:flex;gap:10px;flex-wrap:wrap}

.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 2px 2px}.pager-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

/* ============================================================================
   v7.38.0 Orbit palette

   The interface carried a violet accent from v7.2. The logo is teal, and an
   application whose primary action colour disagrees with its own mark looks
   like two products stapled together.

   Same approach as the v7.3 light canvas: additive, at the end of the file, so
   it is reversible by deleting this block. Only the accent moves — the greys,
   the semantic success/warning/danger colours and the light canvas are already
   neutral and already agree with teal.

   The mark's darker arc samples at #22977C, which is only 3.63:1 against white
   — below AA, and a regression on the 6.12:1 the violet managed. #157F66 is
   that same hue taken down until it measures **4.93:1**, so links, buttons and
   white-on-accent text all clear AA. The lighter #3EC2A3 is used for gradient
   stops and fills only, never for text.
   ========================================================================= */
:root{
  --accent:#157f66;
  --accent-2:#3ec2a3;
  /* The first chart series is the accent, so a single-series chart is the
     brand colour rather than an arbitrary one. The rest keep their spread —
     six teals would be unreadable next to each other on the six-month page. */
  --viz-series-1:#157f66;
  --viz-series-2:#2f7df4;
  --viz-series-3:#7c5cf5;
  --viz-series-4:#f5a524;
  --viz-series-5:#ef4444;
  --viz-series-6:#0e7490;
}

.orbit-theme{
  --accent:#157f66;
  --accent-2:#3ec2a3;
}

/* The dark rail's active item, hover wash and focus ring were violet literals
   rather than token references, so they have to be restated rather than
   inherited. */
.orbit-theme .sidebar-navigation .nav-item:hover{background:rgba(21,127,102,.16)}
.orbit-theme .sidebar-navigation .nav-item.active,
.orbit-theme .sidebar-navigation .nav-dropdown.active>.nav-item{
  background:linear-gradient(135deg,rgba(21,127,102,.85),rgba(20,116,94,.66));
  border-color:rgba(96,214,182,.34);
  box-shadow:0 12px 28px rgba(12,86,68,.28);
}
.orbit-theme .sidebar-cycle-card{
  border-color:rgba(62,194,163,.34);
  background:linear-gradient(145deg,rgba(23,120,97,.20),rgba(17,30,63,.7));
}
.orbit-theme .header-eastern-clock svg{fill:#4ecfae}
.orbit-theme .user-avatar{background:linear-gradient(135deg,#3ec2a3,#127961)}
.orbit-theme .activity-dot{background:#2fb894;box-shadow:0 0 9px rgba(47,184,148,.7)}

/* Working surface: the buttons, links and progress fills that read --accent
   already follow it. These three carried hard-coded violet. */
.orbit-theme #app-main .progress-track i{background:linear-gradient(90deg,#157f66,#3ec2a3)}
.orbit-theme #app-main .kpi-icon.purple{background:#e2f6f0;color:#127961}
.orbit-theme #app-main .schedule-row b.type-b{background:#e2f6f0;color:#0f7a61}
.orbit-theme #app-main .schedule-row.active{
  border-color:#9adcc7;
  background:#effaf6;
}
.orbit-theme #app-main .dashboard-title-icon{
  background:#e2f6f0;
  box-shadow:inset 0 0 0 1px #bfe9db;
}
.orbit-theme #app-main .eyebrow{color:#0f7a61}

/* --- brand lockup, horizontal ---------------------------------------------
   The Galaxi artwork was a *stacked* lockup: swirl above a full-width wordmark
   at 532x306. The Orbit lockup is horizontal — mark left, wordmark right, and
   roughly 3.4:1 rather than 1.7:1. The negative top margins that pulled the
   INVENTORY MANAGEMENT subtitle up under a tall stacked mark now pull it into
   the wordmark's baseline, so they are reset here. */
.orbit-theme .app-sidebar .orbit-brand-logo{max-width:196px}
.orbit-theme .app-sidebar .brand-subtitle{margin:6px 0 0}
.orbit-theme .orbit-login-header .orbit-brand-logo{height:44px}
.orbit-theme .orbit-login-header .brand-subtitle{margin:4px 0 0}
.orbit-theme .auth-logo{max-width:196px}
.orbit-theme .auth-brand{gap:6px}

/* ============================================================================
   v7.38.1 — the Inter Transfer surfaces were being painted with dark-chrome
   colours on the light working canvas

   Fourteen rules written between v7.27.0 and v7.30.0 are scoped `.orbit-theme
   X`. At the time that meant "the dark interface". Since the v7.3 light canvas
   they mean "anywhere in the application", because `.orbit-theme` sits on
   <body> and the working surface is inside it. So every one of them has been
   painting a dark background onto a white page.

   The tab strip was the visible casualty, and it failed in a specific way worth
   recording. The tabs are <a> elements:

     .orbit-theme #app-main a           (1,1,1)  colour: var(--accent)
     .orbit-theme .transfer-tab         (0,2,0)  background:#132244; colour:#dae4fa
     .orbit-theme .transfer-tab.active  (0,3,0)  background:violet; colour:#fff

   The link rule carries an id, so it beats both on colour while losing on
   background. The result is the accent colour on a dark navy pill — and on the
   active pill, violet text on a violet fill. Neither rule is wrong on its own;
   the pair is, and no amount of adjusting either colour fixes it.

   **v7.38.0's teal made it worse, not better.** Swapping the accent from violet
   to a darker teal dropped the inactive tabs from ~4:1 to about 1.6:1 against
   that navy. Changing a token is safe only where every consumer of it is known,
   and this one had a consumer nobody had looked at.

   Fixed by restoring the light-surface intent at `#app-main` specificity —
   additive, at the end of the file, reversible by deletion, and it leaves the
   original rules in place for whenever the dark interface returns.
   ========================================================================= */

/* --- tab strip ----------------------------------------------------------- */
.orbit-theme #app-main .transfer-tab{
  background:#ffffff;
  border:1px solid #d7dbe7;
  color:#344054;            /* 9.7:1 on white */
}
.orbit-theme #app-main .transfer-tab:hover{
  border-color:#9adcc7;
  background:#f4fbf8;
  color:#0f7a61;
}
.orbit-theme #app-main .transfer-tab.active{
  background:var(--accent);
  border-color:var(--accent);
  color:#ffffff;            /* 4.93:1 on the accent */
}
.orbit-theme #app-main .transfer-tab .tab-count{
  background:rgba(16,24,40,.09);
  color:inherit;
}
.orbit-theme #app-main .transfer-tab.active .tab-count{
  background:rgba(255,255,255,.24);
  color:#ffffff;
}

/* --- timeline ------------------------------------------------------------ */
.orbit-theme #app-main .transfer-timeline li{border-left-color:#e3e6ef}
.orbit-theme #app-main .timeline-dot{
  background:#c7d0e0;
  border-color:#ffffff;
  box-shadow:0 0 0 1px #dfe5ec;
}
.orbit-theme #app-main .timeline-dot.accepted,
.orbit-theme #app-main .timeline-dot.received,
.orbit-theme #app-main .timeline-dot.completed,
.orbit-theme #app-main .timeline-dot.exception_resolved{background:#0f9d68}
.orbit-theme #app-main .timeline-dot.rejected,
.orbit-theme #app-main .timeline-dot.cancelled,
.orbit-theme #app-main .timeline-dot.voided,
.orbit-theme #app-main .timeline-dot.exception{background:#c01c28}
.orbit-theme #app-main .timeline-dot.handed_off,
.orbit-theme #app-main .timeline-dot.in_transit,
.orbit-theme #app-main .timeline-dot.ready{background:#b54708}
.orbit-theme #app-main .timeline-dot.submitted,
.orbit-theme #app-main .timeline-dot.preparing{background:#175cd3}
.orbit-theme #app-main .timeline-note{color:#475467}
.orbit-theme #app-main .timeline-move{color:#0f7a61}

/* --- money, chips and totals --------------------------------------------- */
/* Direction colours must stay legible on white: the dark-chrome pair (#4ade80
   / #f87171) measures 1.7:1 and 3.0:1 there. */
.orbit-theme #app-main .balance-owed-to-us{color:#047857}   /* 5.0:1 */
.orbit-theme #app-main .balance-owed-by-us{color:#b91c1c}   /* 6.2:1 */
.orbit-theme #app-main .entry-type{background:#f2f4f7;color:#475467}
.orbit-theme #app-main .entry-type.e-transfer{background:#e6f0ff;color:#175cd3}
.orbit-theme #app-main .entry-type.e-payment{background:#e3f9f0;color:#0b7a52}
.orbit-theme #app-main .entry-type.e-opening_balance{background:#e2f6f0;color:#0f7a61}
.orbit-theme #app-main .entry-type.e-adjustment{background:#fef3e0;color:#b54708}
.orbit-theme #app-main table tfoot th{border-top:2px solid #dfe5ec;color:#152033}

/* --- search, chips and aging --------------------------------------------- */
.orbit-theme #app-main .filter-chip{background:#eef2f7;color:#344054}
.orbit-theme #app-main .aging-bar-track{background:#eef2f7}
/* #0F9D68 is only 3.16:1 on the mint chip, and these badges are 0.76rem —
   small text, so 4.5 is the bar, not 3. Darkened until it clears. */
.orbit-theme #app-main .age-bucket{background:#e3f9f0;color:#0b7a52}
.orbit-theme #app-main .age-bucket.ageing{background:#fef3e0;color:#b54708}
.orbit-theme #app-main .age-bucket.old{background:#fdeced;color:#c01c28}
.orbit-theme #app-main .aging-bar-fill.b2{background:#0f7a61}

/* ============================================================================
   v7.41.1 — the Returns scan row

   The barcode field is 78px tall at 2rem in an 800-weight face. That is right
   on the count page: a phone in one hand, a part in the other, in a stockroom,
   and the field has the screen to itself. Dropped onto Returns beside a store
   picker and a quantity box it dominated the page on desktop and pushed
   everything below the fold on a phone.

   Same field, smaller here, and laid out as a row that wraps rather than a grid
   that stretches. Scoped to `.scan-panel` so the count page is untouched.
   ========================================================================= */
.scan-panel{padding:18px 20px}
.scan-panel h2{font-size:1.15rem;margin:0 0 12px}
.scan-panel .help{margin:10px 0 0;font-size:.82rem;color:#667085}

.scan-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px}
.scan-row-code{flex:1 1 260px;min-width:0}
.scan-row .barcode-field{
  min-height:48px;
  font-size:1.05rem;
  font-weight:600;
  letter-spacing:.02em;
  border-width:2px;
  padding:11px 14px;
  padding-right:52px;
  text-transform:none;
}
.scan-row .barcode-field::placeholder{font-weight:500;letter-spacing:0;color:#98a2b3}
.scan-row .barcode-camera-btn{width:38px;height:38px;right:5px}
.scan-row .barcode-camera-btn svg{width:20px;height:20px}
.scan-row-field{flex:0 1 190px;min-width:0}
.scan-row-qty{flex:0 0 88px}
.scan-row-field span,.scan-row-qty span{
  display:block;font-size:.72rem;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;color:#667085;margin:0 0 4px;
}
.scan-row-field select,.scan-row-qty input{min-height:48px}
.scan-row-qty input{text-align:center;font-weight:600}
.scan-row>button{min-height:48px;flex:0 0 auto}

/* A phone gets the field on its own line and the rest sharing the next one,
   rather than four things fighting over 380px. */
@media(max-width:640px){
  .scan-panel{padding:14px 14px}
  .scan-row-code{flex:1 1 100%}
  .scan-row-field{flex:1 1 140px}
  .scan-row-qty{flex:0 0 72px}
  .scan-row>button{flex:1 1 100%}
  .scan-row .barcode-field{font-size:1rem;min-height:46px}
}

/* The bucket's X: a square button, not a full-width block in a table cell. */
.data-table .button.danger{padding:4px 10px;min-height:0;font-size:.9rem;line-height:1.4}
/* `.orbit-theme #app-main .filter-bar label` sets `display:grid` and carries an
   id, so a plain `.filter-bar label.checkbox` loses to it and the box stacks
   above its own word. Same shape as the v7.38.1 tab-strip defect: an id in the
   layout rule beating a class in the exception. Matched at the same weight. */
.orbit-theme #app-main .filter-bar label.checkbox,
.filter-bar label.checkbox{
  display:flex;flex-direction:row;align-items:center;gap:8px;
  font-size:.85rem;min-width:0;
}
.orbit-theme #app-main .filter-bar label.checkbox input,
.filter-bar label.checkbox input{width:auto;min-height:0;margin:0}
.orbit-theme #app-main .filter-bar label.checkbox span,
.filter-bar label.checkbox span{margin:0;font-weight:500;text-transform:none;letter-spacing:0}

/* v7.42.0 — two actions on a bucket row. Side by side on a wide screen, stacked
   on a narrow one, and neither of them stretching to fill the cell. */
.row-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.row-actions form{margin:0}
.row-actions .button{white-space:nowrap}
.row-actions .button.secondary{padding:4px 10px;min-height:0;font-size:.82rem;line-height:1.4}
@media(max-width:640px){.row-actions{justify-content:flex-start}}

/* v7.43.0 — device labels. Rescaled in v7.43.3, retuned in v7.43.4.
   Sized in millimetres because the output is paper. Every measurement is a
   fraction of --label-scale, which the server derives from the stock height, so
   a shorter label shrinks its contents rather than pushing the UPC off the
   bottom edge — which prints as a label with no barcode and nothing to say so. */
.label-sheet{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.label-card{
  --label-scale:1;
  /* v7.54.6 — positioning context for the price, which is pulled out of the
     column flow and pinned to the bottom-right corner. */
  position:relative;
  background:#fff;border:1px solid #cfd6e3;border-radius:4px;
  padding:calc(var(--label-scale) * 2mm);
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;overflow:hidden;
  margin:0 auto;
  font-family:Helvetica,Arial,sans-serif;color:#000;
}
/* Smaller than v7.43.3 so a long product name lands on two lines rather than
   three, and clipped at two: a third line would push a barcode off the label,
   and a name that is one word short is a smaller loss than a missing UPC. */
/* v7.54.5 — three lines, not two. Removing the SKU line gave the name back the
   space it was competing for, which is what was clipping
   "Apple MacBook Air 13-inch (M2) 1TB Midnight" mid-title. Still clipped, just
   one line later: a third line is affordable now, a fourth would push the UPC
   off the bottom edge, and a name one word short is a smaller loss than a
   missing barcode. */
.label-name{
  font-size:calc(var(--label-scale) * 3.4mm);font-weight:800;
  line-height:1.15;margin:0 0 calc(var(--label-scale) * 0.8mm);width:100%;
  max-height:calc(var(--label-scale) * 3.4mm * 1.15 * 3);overflow:hidden;
}
.label-sku{
  font-size:calc(var(--label-scale) * 2.7mm);font-weight:500;
  line-height:1.15;margin:0;
}
/* v7.47.1 — the price sits ON the SKU line, not below it.
   On 50.8 x 38.1mm stock the card has roughly 3mm of vertical headroom once
   both barcodes are drawn. v7.47.0 gave the price its own 4.6mm line, which
   would have pushed the UPC off the bottom edge — the exact failure the notes
   above warn about. Sharing a row costs almost nothing and still leaves the
   price the second-largest thing on the label. */
/* v7.54.6 — the meta row no longer takes a line of its own. It held the SKU and
   the price; the SKU went in v7.54.5 and the price is now absolutely
   positioned, so an absolutely positioned only-child leaves this wrapper at
   zero height on its own. `margin:0` is what makes that true — nothing else is
   needed, and `display:contents` was tried first and dropped: it has print
   engine and accessibility-tree quirks that are not worth taking on for a
   wrapper that already collapses. */
.label-meta{margin:0;width:100%}
/* v7.54.6 — bottom-right, in the dead space beside the UPC digits.
   The barcodes are centred and their digit lines are short, so the corner is
   genuinely free; taking the price out of the column flow also gives the
   product name back the line the price was occupying.
   `max-width` is the guard that matters: a four-figure price must be allowed to
   look cramped rather than to run under the barcode above it, because a price
   overlapping a barcode is unreadable *and* unscannable. */
.label-price{
  position:absolute;
  right:calc(var(--label-scale) * 2mm);
  bottom:calc(var(--label-scale) * 1.2mm);
  max-width:45%;
  font-size:calc(var(--label-scale) * 3.6mm);font-weight:800;
  line-height:1.15;white-space:nowrap;text-align:right;
}
.label-heading{
  font-size:calc(var(--label-scale) * 2.6mm);font-weight:700;letter-spacing:.04em;
  line-height:1.15;margin:calc(var(--label-scale) * 0.4mm) 0 0;width:100%;
}
.label-code{width:100%;line-height:0;display:flex;justify-content:center}
/* The cap is on height only. The drawing is bars and nothing else now, so it is
   far wider than it is tall and fills the label's width at this height — which
   is what makes the modules wide enough to scan. */
.label-code svg{
  display:block;margin:0 auto;
  width:100%;height:auto;max-height:calc(var(--label-scale) * 6mm);
}
/* v7.91.0 — the QR pair on Returns (RMA) and Recycle labels. Side by side and
   equal width, so neither symbol is the one that got squeezed; a 50mm Code 128
   on a 38mm label prints bars narrower than the scanner resolves, which is what
   made these hard to read. `align-items:start` keeps both squares on the same
   top line when one caption wraps and the other does not. Lives here rather
   than in the template's own <style> because that is where every other label
   rule lives, and test_typeahead_markup checks classes against this file. */
.label-qr-row{display:flex;gap:2mm;align-items:start;justify-content:center;width:100%}
.label-qr{display:flex;flex-direction:column;align-items:center;flex:1 1 0;min-width:0}
.label-qr svg{width:100%;height:auto;max-width:16mm;display:block}
.label-qr .label-code-text{word-break:break-all;line-height:1.05}

.label-code-text{
  font-size:calc(var(--label-scale) * 2.4mm);letter-spacing:.08em;
  line-height:1.2;width:100%;margin:calc(var(--label-scale) * 0.3mm) 0 0;
}
@media print{.no-print{display:none !important}}

/* v7.43.1 — a measurement and its unit are one field, so they sit on one line
   and the number does not stretch to fill a grid cell on its own. */
.size-field .size-row{display:flex;gap:6px;align-items:center}
.size-field .size-row input{flex:1 1 auto;min-width:0}
.size-field .size-row select{flex:0 0 82px;width:82px}

/* v7.43.2 — an IMEI is 15 characters and a serial can be longer; the field
   should not be the same width as a quantity box. */
.code-field{min-width:320px}

/* v7.47.0 — why a label was flagged, under its badge. Unscoped on purpose:
   no `.orbit-theme` rule means no light-surface counterpart is needed. */
.finding-reasons{margin:6px 0 0;padding-left:16px;font-size:.78rem;color:#667085;line-height:1.4}
.finding-reasons li{margin:0 0 2px}

/* v7.51.4 — the serial prompt has to be seen as well as heard. The tone needs
   an audio context this document may not have been granted (a 303 landing has
   no click behind it on iOS), so sound is the courtesy and this is the
   guarantee. Three short pulses, then still: a permanent animation on a panel
   somebody works in front of all day stops being information.
   Unscoped deliberately — no `.orbit-theme` rule, so no `#app-main`
   counterpart is owed. */
.serial-prompt-alert{animation:serial-prompt-pulse .4s ease-in-out 3}
@keyframes serial-prompt-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.012);box-shadow:0 0 0 5px rgba(37,99,235,.16)}}
@media(prefers-reduced-motion:reduce){.serial-prompt-alert{animation:none}}

/* v7.51.5 — the count page's inline serial panel, replacing `window.prompt()`.
   `.barcode-input-wrap` is `position:relative;flex:1;display:flex`, which is
   what floats the camera button inside the field; nesting it in the label needs
   the label to be a flex column or the wrap collapses to content width and the
   button lands over the middle of the input. */
.serial-panel{margin:12px 0 0}
.serial-panel[hidden]{display:none}
.serial-panel .code-field{display:flex;flex-direction:column;gap:4px;flex:1}
.serial-panel .barcode-input-wrap{width:100%}
/* Room for the camera button so a long IMEI does not run underneath it. */
.serial-panel #serial-input{width:100%;padding-right:58px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em}
#serial-panel-error{color:#b42318;font-weight:600}
@media(max-width:600px){.serial-panel .scan-row>*{width:100%}.serial-panel .code-field{min-width:0}}

/* v7.52.0 — devices on an inter-store transfer. One block per serialised line:
   what is needed, what has been scanned, and the field for the next one. */
.device-panel .device-line{border:1px solid var(--border,#dfe5ec);border-radius:12px;padding:12px 14px;margin:10px 0}
.device-panel .device-line.is-complete{background:#f6fdf9;border-color:#bbe7cd}
.device-line-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.device-list{list-style:none;margin:10px 0;padding:0;display:grid;gap:6px}
.device-list li{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:.9rem}
.device-list .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em}
/* A destructive control that reads as text, not a button: removing a scanned
   device is a correction, and a full-weight button beside every serial turns
   the list into a wall of red. */
.link-button{background:none;border:0;padding:0;color:#b42318;font-weight:600;font-size:.82rem;cursor:pointer;text-decoration:underline}
.device-scan{margin-top:10px}
.device-scan .code-field{display:flex;flex-direction:column;gap:4px;flex:1;min-width:260px}
.device-scan .barcode-input-wrap{width:100%}
.device-scan .device-serial-input{width:100%;padding-right:58px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.02em}
@media(max-width:600px){.device-scan>*{width:100%}.device-scan .code-field{min-width:0}}

/* v7.52.1 — the device's own state on the label history page. Colour carries
   meaning here, so it is never the only carrier: the word is always present. */
.device-state{display:inline-block;padding:2px 8px;border-radius:999px;font-size:.76rem;font-weight:700;background:#eef2f7;color:#344054}
.device-state-in_stock{background:#e7f7ee;color:#116b3f}
.device-state-sold{background:#eef2f7;color:#475467}
.device-state-transferred{background:#eaf1fd;color:#1d4ed8}
.device-state-returned{background:#fef6e7;color:#8a5a00}
.device-state-scrapped,.device-state-missing{background:#fdecec;color:#b42318}

/* v7.53.0 — an editable cost inside a table cell. Narrow and right-aligned so
   the column still reads as a column of money rather than a row of form. */
.cost-input{width:5.5rem;text-align:right;padding:4px 6px;font-variant-numeric:tabular-nums}
.cost-form{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.row-muted{opacity:.72}
.button.small{padding:4px 10px;font-size:.8rem}

/* v7.53.2 — the delivery check's verdict, seen as well as heard. The tone needs
   an audio context a 303 landing may not have been granted, so the pulse is the
   half that always works. Three pulses then still: a permanent animation on a
   panel somebody works in front of all day stops being information. */
.scan-outcome-refused .alert,.scan-outcome-over .alert,.scan-outcome-warned .alert{animation:scan-outcome-pulse .4s ease-in-out 3}
@keyframes scan-outcome-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
@media(prefers-reduced-motion:reduce){.scan-outcome-refused .alert,.scan-outcome-over .alert,.scan-outcome-warned .alert{animation:none}}
.alert.warning{background:#fff8ea;border-color:#f0c980;color:#7a4b00}

/* v7.53.3 — purchase order status, coloured by what it asks of you rather than
   by a palette. Grey = nothing to do. Indigo = waiting on the vendor. Amber =
   part-arrived, somebody must finish it. Green = done. Muted = stopped.
   The word is always present, so colour is reinforcement and never the sole
   carrier of the meaning. */
.status-badge.status-draft{background:#eef2f7;color:#475467}
.status-badge.status-ordered{background:#eaf1fd;color:#1d4ed8}
.status-badge.status-partial{background:#fff4e5;color:#8a5a00}
.status-badge.status-received{background:#e7f7ee;color:#116b3f}
.status-badge.status-closed,.status-badge.status-cancelled{background:#f2f4f7;color:#667085;text-decoration:line-through}

/* v7.53.4 — the add-to-catalog queue. A real dialog: it dims what is behind it
   so the operator knows the page is waiting, and it scrolls internally rather
   than growing past the viewport on a phone. */
.modal-backdrop{position:fixed;inset:0;background:rgba(16,24,40,.55);display:flex;align-items:center;justify-content:center;padding:18px;z-index:80}
.modal-backdrop[hidden]{display:none}
.modal{background:#fff;border-radius:14px;padding:20px;max-width:900px;width:100%;max-height:88vh;overflow:auto;box-shadow:0 18px 50px rgba(16,24,40,.28)}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px}
.modal-head h2{margin:0}
.modal-actions{display:flex;gap:10px;align-items:center;margin-top:14px}
@media(max-width:700px){.modal{padding:14px}.modal-actions{flex-wrap:wrap}.modal-actions>*{flex:1}}

/* v7.54.0 — the store inventory filter. Six stacked full-width selects pushed
   the table itself below the fold; a grid puts the whole filter in two rows and
   leaves the stock on screen, which is what the page is for. */
.filter-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;align-items:end}
.filter-bar .filter-search{grid-column:1/-1}
.suggest-wrap{position:relative}
.suggest-wrap input{width:100%}
.suggest-list{position:absolute;z-index:40;top:100%;left:0;right:0;margin:4px 0 0;padding:4px;list-style:none;background:#fff;border:1px solid var(--border,#dfe5ec);border-radius:10px;box-shadow:0 12px 28px rgba(16,24,40,.16);max-height:320px;overflow:auto}
.suggest-list[hidden]{display:none}
.suggest-item{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;background:none;border:0;padding:8px 10px;border-radius:8px;cursor:pointer}
.suggest-item:hover,.suggest-item:focus{background:#eef2f7}
.suggest-item small{color:#667085;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

/* v7.54.1 — availability at a glance on the request page. Four states, not
   three: "never counted" is amber-grey and says so in words, because colouring
   it red would assert an out-of-stock nobody has established and send a
   requesting store past a shelf that may hold the part. */
.stock-status{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.76rem;font-weight:700;white-space:nowrap}
.stock-status-in_stock{background:#e7f7ee;color:#116b3f}
.stock-status-soon{background:#fff4e5;color:#9a5b00}
.stock-status-out{background:#fdecec;color:#b42318}
.stock-status-unknown{background:#f2f4f7;color:#667085;border:1px dashed #c4ccd8}

/* v7.54.3 — the store's name on the label, and the carrier lock state. Both
   sit above/below the product name in smaller type: the name is what identifies
   the item and must stay the largest thing on 38mm of stock. */
.label-store{font-size:calc(7pt * var(--label-scale,1));font-weight:700;letter-spacing:.04em;text-transform:uppercase;text-align:center;line-height:1.1}

/* v7.54.3 — pager under a product list. */
.pager{display:flex;align-items:center;justify-content:center;gap:14px;padding:12px 0}
.pager .is-disabled{opacity:.45;pointer-events:none}
.inline-label{display:flex;align-items:center;gap:6px;font-size:.85rem;color:#475467}

/* v7.55.0 — the store name on the label form. */
.store-name-field{display:flex;flex-direction:column;gap:4px}
.store-name-field .field-label{font-size:.8rem;color:#475467}
.store-name-edit{display:flex;gap:6px;align-items:center}
.store-name-edit input{min-width:180px}

/* v7.63.0 — classes used by templates since v7.56.0 that were never defined.
   Each was invented in markup and silently fell back to the default block
   layout, which is why a checkbox floated free of its label and a summary panel
   read "1Need a decision" with the number welded to the word. Jinja parses
   happily whatever class you name, and nothing in the suite compared markup
   against the stylesheet, so all three shipped looking broken. */

/* A stacked column of labelled fields. Used by the reordering, order bucket,
   estimate and return policy forms. */
.stacked-form{display:flex;flex-direction:column;gap:14px;max-width:560px}
.stacked-form label{display:flex;flex-direction:column;gap:5px}
.stacked-form label > span{font-size:.78rem;font-weight:600;color:var(--muted,#5b6577)}
.stacked-form input,.stacked-form select,.stacked-form textarea{width:100%}
.stacked-form button{align-self:flex-start}

/* A checkbox is a row, not a stacked field — the label sits beside it. This
   existed only under `.filter-bar`, so the same markup in any other form put a
   full-width input under its own caption. */
.orbit-theme #app-main label.checkbox,
label.checkbox{
  display:flex;flex-direction:row;align-items:center;gap:8px;
  font-size:.85rem;min-width:0;
}
.orbit-theme #app-main label.checkbox input,
label.checkbox input{width:auto;min-height:0;margin:0;flex:0 0 auto}
.orbit-theme #app-main label.checkbox > span,
label.checkbox > span{margin:0;font-weight:500;text-transform:none;letter-spacing:0}

/* A row of headline figures. The number leads, its caption sits under it — as
   two blocks, or they run together on one line. */
.stat-row{display:flex;flex-wrap:wrap;gap:12px}
.stat-row .stat{
  display:flex;flex-direction:column;gap:2px;flex:1 1 150px;
  padding:12px 14px;border:1px solid var(--border,#dfe5ec);border-radius:10px;
  background:var(--surface,#fff);
}
.stat-value{font-size:1.35rem;font-weight:700;line-height:1.15}
.stat-label{font-size:.75rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted,#5b6577)}

/* Row actions under a table, and the reorder/readiness badge colours. The
   badge markup is `class="badge state-{{ code }}"` — driven by a code, never by
   matching words — so each state needs its own rule or every badge renders in
   the default grey and the column stops carrying meaning at a glance. */
.panel-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}
.badge.state-order{background:#fee2e2;color:#991b1b}
.badge.state-transfer{background:#e0e7ff;color:#3730a3}
.badge.state-on_order{background:#e0f2fe;color:#075985}
.badge.state-ok{background:#dcfce7;color:#166534}
.badge.state-thin{background:#f3f4f6;color:#4b5563}
.badge.state-unknown{background:#fef3e0;color:#b54708}

/* v7.68.0 — the FedEx label card.
   Laid out like the artefact it produces: a shipping label has a FROM block and
   a TO block, so the two addresses sit side by side rather than as rows in a
   table. That is the one structural liberty here and it is taken because it
   matches the thing, not to decorate it. Everything else stays in Orbit's
   ordinary panel vocabulary. */
.fedex-card{display:flex;flex-direction:column;gap:16px}
.fedex-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.fedex-head h2{margin:2px 0 0}

.fedex-parties{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.fedex-party{
  display:flex;flex-direction:column;gap:4px;padding:14px 16px;
  border:1px solid var(--border,#dfe5ec);border-radius:12px;
  background:var(--surface,#fff);
}
/* An address FedEx will refuse is marked here rather than only in prose: the
   person is looking at two blocks and needs to know which one is the problem. */
.fedex-party.is-wrong{border-color:#e8b4b4;background:#fef6f6}
.fedex-lines{display:flex;flex-direction:column;gap:2px;font-size:.9rem;color:var(--muted,#5b6577)}

.fedex-box{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  padding:10px 16px;border:1px dashed var(--border,#dfe5ec);border-radius:12px;
  font-size:.9rem;
}
.fedex-box .stat-label{margin-right:2px}

.fedex-edit summary{
  cursor:pointer;font-size:.85rem;font-weight:600;color:var(--muted,#5b6577);
  padding:6px 0;
}
.fedex-edit summary:focus-visible{outline:2px solid var(--accent,#157f66);outline-offset:3px}
.fedex-edit[open] summary{margin-bottom:8px}
.fedex-edit textarea{width:100%;font-family:inherit}

@media (max-width:640px){
  .fedex-box{flex-direction:column;align-items:flex-start;gap:6px}
}

/* v7.71.2 — the raw request behind a failed rate quote. Monospaced, scrollable
   and selectable: this exists to be read carefully and forwarded to FedEx
   support, so it must not wrap in a way that mangles the JSON. */
.code-block{
  margin:8px 0 0;padding:12px 14px;max-height:340px;overflow:auto;
  background:#0f172a;color:#e2e8f0;border-radius:10px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;
  line-height:1.5;white-space:pre;
}

/* v7.78.0 — the right-hand side of the FedEx card header, where the wallet
   balance sits beside the service and environment. Right-aligned so the figure
   lines up with the card edge and reads as a status rather than a heading. */
.fedex-head-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right}
.fedex-head-right .stat{padding:0;border:0;background:none;gap:0;flex:0 0 auto}
.fedex-head-right .stat-value{font-size:1.15rem}

/* v7.82.0 — the **modal panel**, one implementation.
   ------------------------------------------------------------------
   A named pattern, used wherever a row has a form behind it: location
   management, user accounts, and whatever comes next.

   `details.modal-panel` + `.modal-panel-body`. Built on `<details>` rather than
   a JavaScript widget for two reasons — it opens with scripting unavailable,
   and inline scripts do not re-run after this application swaps `<main>`, so a
   panel that depended on one would work until the first navigation and then
   quietly stop.

   v7.81.0 shipped this for locations under its own class names. Generalising it
   now, before a third copy exists: two implementations of the same pattern
   diverge on the day somebody fixes one of them. */
details.modal-panel > summary{list-style:none;cursor:pointer}
details.modal-panel > summary::-webkit-details-marker{display:none}
details.modal-panel[open]::before{
  content:"";position:fixed;inset:0;z-index:59;background:rgba(16,24,40,.55);
}
.orbit-theme #app-main details.modal-panel[open] > .modal-panel-body,
details.modal-panel[open] > .modal-panel-body{
  position:fixed;z-index:61;top:50%;left:50%;transform:translate(-50%,-50%);
  right:auto;width:min(760px,94vw);max-height:88vh;overflow:auto;
  background:#fff;border:1px solid var(--border,#dfe6f0);border-radius:16px;
  padding:22px;box-shadow:0 30px 80px rgba(6,20,47,.35);
}
/* Closed, it is simply absent — no stray box in the flow of the table. */
details.modal-panel:not([open]) > .modal-panel-body{display:none}

.modal-panel-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
  border-bottom:1px solid var(--border,#e5eaf2);
  padding-bottom:12px;margin-bottom:16px;
}
.modal-panel-head h3{margin:0}
/* The user editor is wider than a location's: five sections of forms rather
   than two. Nothing else differs, so it is one extra rule and not a copy. */
.orbit-theme #app-main details.modal-panel.user-account-panel[open] > .modal-panel-body,
details.modal-panel.user-account-panel[open] > .modal-panel-body{width:min(920px,95vw)}
.modal-panel-close{
  border:0;background:none;cursor:pointer;font-size:1.5rem;line-height:1;
  padding:2px 8px;border-radius:8px;color:var(--muted,#5b6577);
}
.modal-panel-close:hover{background:#eef2f7}
.modal-panel-close:focus-visible{outline:2px solid var(--accent,#157f66);outline-offset:2px}

@media(max-width:760px){
  /* Near full screen on a phone: a centred card with margins wastes the room a
     form needs. */
  .orbit-theme #app-main details.modal-panel[open] > .modal-panel-body,
  details.modal-panel[open] > .modal-panel-body{
    inset:3vh 3vw auto;top:3vh;left:3vw;transform:none;
    width:auto;max-height:94vh;padding:16px;
  }
}

/* v7.83.0 — the bought label, shown rather than downloaded.
   Tall enough that a 4×6 label is legible without scrolling inside the frame,
   capped so the modal itself never grows past the viewport. */
.label-preview{display:block;width:100%;height:min(62vh,560px);border:1px solid var(--border,#dfe6f0);border-radius:12px;background:#f8fafc}
.orbit-theme #app-main details.modal-panel.label-preview-panel[open] > .modal-panel-body,
details.modal-panel.label-preview-panel[open] > .modal-panel-body{width:min(680px,94vw)}
/* The comparison holds a table of up to nine services and wants the room. */
.orbit-theme #app-main details.modal-panel.service-compare-panel[open] > .modal-panel-body,
details.modal-panel.service-compare-panel[open] > .modal-panel-body{width:min(880px,95vw)}

/* v7.85.0 — the vendor editor. Wider than a location's because it carries two
   textareas: a returns address and RMA instructions. */
.orbit-theme #app-main details.modal-panel.vendor-edit-panel[open] > .modal-panel-body,
details.modal-panel.vendor-edit-panel[open] > .modal-panel-body{width:min(640px,94vw)}

/* v7.86.0 — the page loader.
   A two-pixel indeterminate bar across the top of the window. Two pixels
   because a shop-floor tablet on a slow connection needs to know something is
   happening, and does not need a spinner covering the page it is still reading.

   **Animated in CSS, not driven from JavaScript.** A script that has to paint
   each frame competes with the page it is waiting for, and stops entirely if
   the tab is throttled — which is precisely when a load is slowest. */
.page-loader{
  position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;
  pointer-events:none;opacity:0;transition:opacity .15s ease;
  background:rgba(21,127,102,.16);
}
.page-loader.is-loading{opacity:1}
.page-loader-bar{
  height:100%;width:35%;border-radius:0 3px 3px 0;
  background:linear-gradient(90deg,var(--accent,#157f66),#4f46e5);
  transform:translateX(-100%);
}
.page-loader.is-loading .page-loader-bar{animation:page-loader-sweep 1.1s ease-in-out infinite}
@keyframes page-loader-sweep{
  0%{transform:translateX(-100%)}
  60%{transform:translateX(180%)}
  100%{transform:translateX(320%)}
}
/* A button that has been pressed and is waiting. It keeps its width so the
   layout does not jump while the label changes. */
.is-working{opacity:.72;cursor:progress}

@media(prefers-reduced-motion:reduce){
  /* No sweep. The bar still appears, so the feedback is not lost — it simply
     does not move for somebody who has asked for that. */
  .page-loader.is-loading .page-loader-bar{animation:none;transform:none;width:100%}
}
/* The live region that announces a load to a screen reader. Present in the
   accessibility tree, absent from the page. `.visually-hidden-select` already
   existed for a different element; this is the general one. */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ----------------------------------------------------------------- v7.94.0
   Live Stock.

   **Every rule lives here, not in the template.** `test_typeahead_markup`
   caught v7.91.0 putting label classes in a template's own `<style>` block,
   and the same rule applies: one stylesheet, one place to change a colour.

   Status is never carried by colour alone — each state has a text label in the
   key, an `aria-label` on the cell naming the state in words, and N/A renders
   as literal text rather than an empty or greyed cell. Section 11.4. */

.live-stock-layout{display:block}


.live-stock-grid-panel{min-width:0}
/* Horizontal scroll on a narrow viewport rather than a squeezed grid: a
   quantity that has to be guessed at is worse than one that has to be
   scrolled to. Section 11.3. */
.live-stock-scroll{overflow-x:auto;max-height:70vh;overflow-y:auto}
.live-stock-table{min-width:720px}
/* Sticky header and model column — section 6.3. Scrolling to Motorola must not
   cost you the knowledge of which column is Battery. */
.live-stock-table thead th{position:sticky;top:0;z-index:2;background:var(--surface,#fff)}
.live-stock-table .live-model-col,.live-stock-table tbody th{position:sticky;left:0;z-index:1;background:var(--surface,#fff);text-align:left}
.live-stock-table thead th.live-model-col{z-index:3}
.live-stock-table td.numeric,.live-stock-table th.numeric{text-align:center;white-space:nowrap}
.live-family-row{background:#f7f8fa;font-weight:750}
.live-family-row th{background:#f7f8fa}
/* **`th{text-transform:uppercase}` is a global rule** and this table puts its
   model names in `<th>` for the row-header semantics a grid needs. Left alone,
   every handset rendered as IPHONE SE 2022. Row headers here are content, not
   column labels. */
.live-stock-table tbody th{text-transform:none;font-size:.95rem;color:#152033;letter-spacing:0}
.live-model-name{font-weight:600;padding-left:34px}
.family-mark{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:6px;background:#152033;color:#fff;font-size:.72rem;font-weight:800;margin-right:9px;vertical-align:middle}
.family-mark.brand-apple{background:#152033}
.family-mark.brand-samsung{background:#1d4ed8}
.family-mark.brand-google{background:#0f9d58}
.family-mark.brand-motorola{background:#6d4aff}
.family-name{vertical-align:middle}
.year-chip{display:inline-block;margin-left:8px;padding:1px 7px;border-radius:999px;background:#eef2f7;color:#475467;font-size:.72rem;font-weight:700}

.live-cell{display:inline-block;min-width:52px;padding:4px 10px;border-radius:8px;border:1px solid transparent;font-weight:700;font-variant-numeric:tabular-nums;cursor:pointer;background:#dcfce7;color:#166534}
.live-cell:hover{filter:brightness(.96)}
.live-cell:focus-visible{outline:3px solid #2563eb;outline-offset:2px}
.live-cell.low{background:#fef3e0;color:#b54708}
.live-cell.out{background:#fee2e2;color:#991b1b}
/* Negative is an anomaly, not a low. It is never clamped to zero and it does
   not read as "nearly out" — section 4.3. */
.live-cell.negative{background:#fee2e2;color:#991b1b;border-color:#991b1b;border-style:dashed}
.live-cell.na{background:transparent;color:#6b7280;cursor:default;font-weight:500}
.live-cell.static{cursor:default}

.live-stock-key{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.live-key{font-size:.86rem;color:#4b5563;display:inline-flex;align-items:center;gap:6px}
.live-key::before{content:"";width:9px;height:9px;border-radius:50%;background:#16a34a}
/* Named rather than left to the default above: `test_no_new_class_is_used_without_being_styled`
   is right that a class used in markup and defined nowhere is a silent
   fallback, even when the fallback happens to look correct today. */
.live-key.in-stock::before{background:#16a34a}
.live-key.low::before{background:#f59e0b}
.live-key.out::before{background:#ef4444}
.live-key.na::before{background:#d1d5db}



.drawer-head{margin-bottom:14px}
.drawer-eyebrow{display:block;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:#2563eb;font-weight:750}
.drawer-head h2{margin:4px 0 2px}
.drawer-head h2:focus-visible{outline:3px solid #2563eb;outline-offset:3px}
.drawer-total{background:#1d4ed8;color:#fff;border-radius:12px;padding:14px 16px;margin-bottom:16px}
.drawer-total .metric-label{color:#c7d7fe}
.drawer-total .metric-value{display:block;font-size:2rem;line-height:1.1;margin:2px 0}
.drawer-total .muted{color:#c7d7fe}
.drawer-section{font-size:.9rem;margin:0 0 8px;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.drawer-foot{margin-top:14px}
.drawer-table{width:100%}

.location-breakdown{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.location-row{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;cursor:pointer;text-align:left}
.location-row:hover{border-color:#93c5fd;background:#f8fbff}
.location-row:focus-visible{outline:3px solid #2563eb;outline-offset:2px}
.location-name{display:grid;gap:1px;min-width:0}
.location-qty{text-align:right;display:grid;gap:1px;white-space:nowrap}
.location-qty strong{font-size:1.35rem;line-height:1.1;color:#1d4ed8;font-variant-numeric:tabular-nums}
.location-qty.low strong{color:#b54708}
.location-qty.out strong,.location-qty.negative strong{color:#991b1b}

.link-button{background:none;border:0;padding:0;color:#2563eb;font-weight:600;cursor:pointer;font-size:.86rem}
.link-button:focus-visible{outline:3px solid #2563eb;outline-offset:2px}

/* v7.94.4. A rebuild finding that is a data question, not a failure. */
.alert.warning{background:#fef3e0;color:#b54708}

/* ----------------------------------------------------------------- v7.95.1
   Live Stock cell colours.

   **The state colours were never reaching the page.** `.orbit-theme button`
   paints every button with the theme's purple gradient, and a Live Stock cell
   *is* a button — so in stock, low, out and negative all rendered identically
   while the legend above them promised green, amber and red. A grid whose
   whole job is to be read at a glance showed one colour for four different
   facts, and the legend made it worse by insisting otherwise.

   **Scoped to `#app-main`, and that is the point.** `.orbit-theme` sits on
   <body> and covers both the dark chrome and the *light* working surface;
   `test_every_dark_chrome_rule_has_a_light_surface_counterpart` exists because
   v7.38.1 shipped dark rules that bled onto the white canvas. The grid lives
   on the light surface, so these are light colours — and `#app-main` also buys
   the specificity needed to beat the gradient (an id and two classes against
   one class and an element). Writing them as `.orbit-theme .live-cell` would
   have been both unreadable here and a rule with no counterpart. */

.orbit-theme #app-main .live-cell{background:#dcfce7;color:#15803d;border:1px solid #86efac;box-shadow:none;font-weight:750}
.orbit-theme #app-main .live-cell:hover{background:#bbf7d0;border-color:#4ade80}
.orbit-theme #app-main .live-cell.low{background:#fef3c7;color:#b45309;border-color:#fcd34d}
.orbit-theme #app-main .live-cell.low:hover{background:#fde68a;border-color:#f59e0b}
.orbit-theme #app-main .live-cell.out{background:#fee2e2;color:#b91c1c;border-color:#fca5a5}
.orbit-theme #app-main .live-cell.out:hover{background:#fecaca;border-color:#f87171}
/* Negative is an anomaly, not a low: a dashed edge so it does not read as
   "nearly out" at a glance. */
.orbit-theme #app-main .live-cell.negative{background:#fee2e2;color:#7f1d1d;border:1px dashed #b91c1c}
.orbit-theme #app-main .live-cell.na{background:transparent;color:#94a3b8;border-color:transparent;font-weight:500}
.orbit-theme #app-main .live-cell:focus-visible{outline:3px solid #2563eb;outline-offset:2px}

/* A location row is a button too, which is why every store in the drawer read
   as a solid purple block with its address unreadable inside it. */
.orbit-theme #app-main .location-row{background:#fff;border:1px solid #e2e8f0;color:#0f172a}
.orbit-theme #app-main .location-row:hover{background:#f8fbff;border-color:#93c5fd}
.orbit-theme #app-main .location-row .muted{color:#64748b}
.orbit-theme #app-main .location-row.selected{border-color:#2563eb;background:#eff6ff;box-shadow:0 0 0 1px #2563eb}
.orbit-theme #app-main .location-qty strong{color:#1d4ed8}
.orbit-theme #app-main .location-qty.low strong{color:#b45309}
.orbit-theme #app-main .location-qty.out strong,.orbit-theme #app-main .location-qty.negative strong{color:#b91c1c}
.orbit-theme #app-main .live-stock-table tbody th{text-transform:none;color:#0f172a}
.orbit-theme #app-main .live-family-row th,.orbit-theme #app-main .live-family-row{background:#f1f5f9;color:#0f172a}

/* The store card sits **below** the aggregate rather than replacing it, so the
   totals stay on screen while its parts are read. */


/* ----------------------------------------------------------------- v7.96.0
   The model panel.

   **One dialog the drill happens inside**, replacing the side column. A super
   admin goes region → store → parts and each step replaces the last in the
   same frame, with the bar saying where they are. A 380px side drawer could
   not hold three levels without either squeezing the grid or scrolling away
   from it — and the grid is the thing being read.

   Scoped `.orbit-theme #app-main` where colour is involved: `.orbit-theme` is
   on <body> and covers the dark chrome *and* the white working surface, so a
   bare rule bleeds onto the light canvas. The panel is chrome over the light
   surface, so its own shell is dark and its body is light. */
.model-panel{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:20px}
.model-panel[hidden]{display:none}
.model-panel-backdrop{position:absolute;inset:0;background:rgba(5,11,24,.62);backdrop-filter:blur(2px)}
/* **Wide enough for the table it holds.** 680px forced the store detail into a
   horizontal scrollbar — five columns of product, on hand, reserved, available
   and cost do not fit, and a quantity you have to scroll sideways to read is a
   quantity you will misread. */
.model-panel-frame{position:relative;width:min(1040px,100%);max-height:min(90vh,1000px);display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:0 30px 70px rgba(5,11,24,.45);overflow:hidden}
.model-panel-frame:focus{outline:none}
.model-panel-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 18px;background:#101e3d;color:#fff;font-weight:750;flex:0 0 auto}
.model-panel-close{background:transparent;border:0;color:#c7d2ea;font-size:1.6rem;line-height:1;padding:0 4px;cursor:pointer;border-radius:8px}
.model-panel-close:hover{color:#fff}
.model-panel-close:focus-visible{outline:3px solid #9a7dff;outline-offset:2px}
.model-panel-body{padding:20px;overflow-y:auto;flex:1 1 auto;background:#fff;color:#0f172a}
body.model-panel-open{overflow:hidden}
.panel-step{display:block}
@media (max-width:640px){.model-panel{padding:0}.model-panel-frame{width:100%;max-height:100vh;border-radius:0}}

.orbit-theme #app-main .model-panel-body,.model-panel-body{background:#fff}

/* ----------------------------------------------------------------- v7.96.2
   Inside the panel.

   `th,td{white-space:nowrap}` is a global rule, and the store detail's product
   column carries a name, a SKU, a subtype, a vendor and a last-movement date.
   Nowrap put all of it on one line and pushed the four numeric columns off the
   edge — the panel grew a horizontal scrollbar and the figures went out of
   sight. The product cell wraps; the numbers do not, because a quantity broken
   across two lines is worse than a wide column. */
.model-panel-body .drawer-table{width:100%;table-layout:fixed}
.model-panel-body .drawer-table th[scope="row"]{white-space:normal;width:auto}
.model-panel-body .drawer-table th[scope="row"] .muted{display:block;margin-top:2px}
.model-panel-body .drawer-table td,.model-panel-body .drawer-table thead th{white-space:nowrap;width:110px;text-align:right}
.model-panel-body .drawer-table thead th:first-child{text-align:left;width:auto}
.model-panel-body .drawer-total .metric-value{font-size:2.3rem}
.model-panel-body .location-breakdown{gap:10px}
.model-panel-body .drawer-foot{border-top:1px solid #e2e8f0;padding-top:12px}
.model-panel-body .link-button{margin-bottom:10px;display:inline-block}
@media (max-width:900px){.model-panel-body .drawer-table td,.model-panel-body .drawer-table thead th{width:78px}}