:root {
  --navy: #0b1737;
  --navy-2: #122553;
  --ink: #14213d;
  --muted: #6b7893;
  --line: #e6ebf3;
  --surface: #ffffff;
  --bg: #f5f7fb;
  --blue: #2266e2;
  --blue-soft: #edf4ff;
  --red: #dc3b44;
  --red-soft: #fff1f1;
  --amber: #e7a326;
  --amber-soft: #fff8e8;
  --green: #20a26b;
  --green-soft: #eaf9f2;
  --shadow: 0 10px 28px rgba(18, 37, 83, .055);
  --radius: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: 'DM Sans', sans-serif; font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; touch-action: manipulation; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid rgba(34, 102, 226, .25); outline-offset: 2px; }
svg { width: 20px; height: 20px; fill: currentColor; }

.app-shell { min-height: 100vh; display: flex; }
.sidebar { background: var(--navy); color: #fff; width: 248px; min-height: 100vh; padding: 26px 16px 18px; display: flex; flex-direction: column; position: fixed; inset: 0 auto 0 0; z-index: 20; }
.brand-lockup { display: flex; align-items: center; gap: 11px; padding: 0 11px 30px; }
.brand-lockup strong { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 13px; letter-spacing: .04em; }
.brand-lockup small { display: block; color: #8fa2cc; font-size: 8px; font-weight: 700; letter-spacing: .14em; margin-top: 2px; }
.brand-mark { position: relative; width: 30px; height: 30px; flex: 0 0 30px; }
.brand-mark span { position: absolute; width: 18px; height: 9px; border-radius: 7px; transform: rotate(-44deg); }
.brand-mark span:nth-child(1) { background: #ffb322; left: 2px; top: 5px; }
.brand-mark span:nth-child(2) { background: #ec3e49; left: 10px; top: 12px; transform: rotate(44deg); }
.brand-mark span:nth-child(3) { background: #2e8cff; left: 1px; top: 17px; transform: rotate(44deg); }
.workspace-label { color: #7185b2; font-size: 10px; font-weight: 700; letter-spacing: .14em; padding: 0 14px 10px; }
.side-nav { display: grid; gap: 5px; }
.nav-item { border: 0; border-radius: 10px; background: transparent; color: #9dadd0; min-height: 46px; padding: 0 13px; display: flex; align-items: center; gap: 12px; text-align: left; transition: background .2s, color .2s; }
.nav-item svg { width: 18px; height: 18px; flex: 0 0 18px; }
.nav-item:hover, .nav-item.active { background: #1a2d61; color: #fff; }
.nav-item.active { box-shadow: inset 3px 0 0 #ffba2c; }
.nav-item span { flex: 1; font-size: 13px; font-weight: 600; }
.nav-badge { background: #e74d57; color: #fff; font-size: 10px; min-width: 20px; height: 20px; display: grid; place-items: center; border-radius: 10px; }
.vehicle-badge { background: #d49316; }
.personnel-badge { background: #7a5fd0; }
.sidebar-spacer { flex: 1; }
.support-card { background: #152758; border: 1px solid #263c76; border-radius: 13px; padding: 15px; margin: 20px 7px 18px; }
.support-icon { color: #7da4ff; margin-bottom: 10px; }
.support-icon svg { width: 22px; height: 22px; }
.support-card strong { font-size: 12px; }
.support-card p { color: #98a8c8; font-size: 11px; line-height: 1.5; margin: 5px 0 11px; }
.text-button { border: 0; background: transparent; color: var(--blue); font-weight: 700; font-size: 12px; padding: 7px 0; display: inline-flex; align-items: center; gap: 10px; }
.support-card .text-button { color: #d8e4ff; font-size: 11px; }
.text-button:hover { color: #154cae; }
.support-card .text-button:hover { color: #fff; }
.sidebar-footer { color: #8a9dc5; border-top: 1px solid #1c2d5b; padding: 17px 12px 0; font-size: 10px; display: flex; align-items: center; gap: 7px; }
.status-dot { width: 7px; height: 7px; background: #39cf8b; border-radius: 50%; box-shadow: 0 0 0 3px rgba(57, 207, 139, .12); }
.footer-version { margin-left: auto; color: #6479aa; }

.main-content { flex: 1; margin-left: 248px; min-width: 0; }
.topbar { min-height: 72px; background: rgba(255,255,255,.88); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 42px; position: sticky; top: 0; z-index: 10; backdrop-filter: blur(12px); }
.breadcrumb { display: flex; gap: 11px; align-items: center; color: #9ba6bb; font-size: 12px; }
.breadcrumb b { color: #c2cad8; font-weight: 400; }
.breadcrumb strong { color: #596985; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 24px; }
.icon-button { width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: transparent; color: #697896; border-radius: 10px; position: relative; }
.icon-button:hover { background: var(--bg); color: var(--navy); }
.icon-button i { width: 6px; height: 6px; background: var(--red); border: 2px solid white; border-radius: 50%; position: absolute; right: 9px; top: 8px; }
.profile { display: flex; align-items: center; gap: 10px; }
.avatar { background: #dce9ff; color: var(--blue); width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 800; }
.profile-copy strong, .profile-copy span { display: block; }
.profile-copy strong { font-size: 12px; color: var(--ink); }
.profile-copy span { font-size: 10px; color: #92a0b8; margin-top: 1px; }
.chevron { width: 15px; height: 15px; color: #9aa5b8; stroke: currentColor; fill: none; stroke-width: 2; }
.mobile-menu { display: none; }
.page-wrap { padding: 39px 42px 60px; max-width: 1520px; margin: 0 auto; }
.view-panel { display: none; animation: fade-in .25s ease both; }
.view-panel.active { display: block; }
@keyframes fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 25px; margin-bottom: 28px; }
.compact-heading { align-items: center; }
.eyebrow { color: #8693ab; font-size: 10px; font-weight: 800; letter-spacing: .11em; margin: 0 0 7px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: 'Space Grotesk', sans-serif; }
h1 { font-size: clamp(25px, 3vw, 31px); letter-spacing: -.045em; line-height: 1.15; margin-bottom: 8px; }
h2 { font-size: 16px; letter-spacing: -.02em; margin-bottom: 4px; }
h3 { font-size: 15px; }
.wave-mark { color: #e8a11e; display: inline-flex; vertical-align: 3px; margin-left: 4px; }.wave-mark svg { width: 20px; height: 20px; }
.heading-subtitle { color: var(--muted); font-size: 13px; margin-bottom: 0; }
.primary-button, .secondary-button, .select-button { border: 0; min-height: 42px; border-radius: 9px; padding: 0 17px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-weight: 700; font-size: 12px; transition: transform .18s, box-shadow .18s, background .18s; }
.primary-button { color: #fff; background: var(--blue); box-shadow: 0 7px 16px rgba(34, 102, 226, .19); }
.primary-button:hover { background: #1858cd; transform: translateY(-1px); box-shadow: 0 9px 20px rgba(34, 102, 226, .24); }
.primary-button svg, .secondary-button svg { width: 17px; height: 17px; }
.secondary-button { color: #52617c; background: #fff; border: 1px solid var(--line); }
.secondary-button:hover { border-color: #b9c8e1; background: #f9fbff; }
.full-button { width: 100%; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 22px; }
.stat-card, .surface { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.stat-card { min-height: 147px; padding: 19px 20px 17px; }
.stat-navy { background: var(--navy); color: #fff; border-color: var(--navy); }
.stat-top, .stat-foot { display: flex; align-items: center; justify-content: space-between; }
.stat-label { color: #8592a9; font-size: 9px; font-weight: 800; letter-spacing: .11em; }
.stat-navy .stat-label { color: #91a6d5; }
.stat-icon { color: #a1acc0; width: 29px; height: 29px; border-radius: 8px; background: #f2f4f8; display: grid; place-items: center; }
.stat-icon svg { width: 17px; height: 17px; }
.stat-icon.icon-blue { color: var(--blue); background: var(--blue-soft); }
.stat-icon.icon-amber { color: var(--amber); background: var(--amber-soft); }
.stat-icon.icon-green { color: var(--green); background: var(--green-soft); }
.stat-navy .stat-icon { color: #fff; background: #2a3d70; }
.stat-value { font-family: 'Space Grotesk', sans-serif; display: block; font-size: 34px; letter-spacing: -.065em; margin-top: 11px; line-height: 1; }
.stat-value span { font-size: 23px; margin-left: 2px; }
.stat-foot { margin-top: 15px; }
.stat-caption { color: #9ca7b9; font-size: 10px; }
.stat-navy .stat-caption { color: #8fa1c8; }
.stat-trend { border-radius: 5px; padding: 3px 6px; font-size: 9px; font-weight: 700; }
.stat-trend.up { color: #16935f; background: var(--green-soft); }.stat-trend.down { color: #c27d08; background: var(--amber-soft); }.stat-trend.neutral { color: #b8c5e0; background: #263b70; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.52fr) minmax(310px, .95fr); gap: 22px; margin-bottom: 22px; }
.chart-card, .readiness-card, .table-card, .asset-list-card { padding: 22px; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.section-heading p { color: #96a2b6; font-size: 11px; margin-bottom: 0; }
.select-button { color: #687792; background: #f8f9fc; border: 1px solid var(--line); min-height: 34px; padding: 0 10px 0 13px; font-size: 11px; }.select-button svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; }
.chart-area { height: 224px; display: flex; gap: 14px; margin-top: 18px; padding-bottom: 3px; }
.y-axis { display: flex; flex-direction: column; justify-content: space-between; color: #b0b9c8; font-size: 10px; padding: 4px 0 23px; }
.bars { flex: 1; min-width: 0; display: flex; align-items: flex-end; justify-content: space-around; border-bottom: 1px solid #e8edf5; background: repeating-linear-gradient(to bottom, transparent 0, transparent calc(25% - 1px), #eff2f7 calc(25% - 1px), #eff2f7 25%); }
.bar-column { height: 100%; width: 10%; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 5px; position: relative; }.bar { width: min(34px, 66%); height: var(--bar-height); min-height: 10px; background: #bbd3ff; border-radius: 5px 5px 0 0; transition: height .4s ease, background .2s; }.bar.highlight { background: var(--blue); }.bar-column:hover .bar { background: var(--navy-2); }.bar-value { color: #71809a; font-family: 'Space Grotesk', sans-serif; font-size: 10px; opacity: 0; transition: opacity .2s; }.bar-column:hover .bar-value, .bar.highlight + small { opacity: 1; }.bar-column small { color: #96a2b6; font-size: 10px; margin-bottom: -20px; }.chart-legend { display: flex; gap: 20px; color: #8591a5; font-size: 10px; margin: 24px 0 1px 45px; }.legend-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; margin-right: 5px; }.legend-dot.inspected { background: #bbd3ff; }.legend-dot.today { background: var(--blue); }
.more-button { border: 0; background: transparent; padding: 7px 0 7px 10px; display: flex; gap: 3px; }.more-button span { width: 3px; height: 3px; border-radius: 50%; background: #9ba7b9; }.readiness-list { display: grid; gap: 20px; margin: 28px 0 25px; }.readiness-row { display: grid; grid-template-columns: 104px 1fr 32px; align-items: center; gap: 10px; }.readiness-label strong, .readiness-label span { display: block; }.readiness-label strong { font-size: 11px; }.readiness-label span { color: #9aa5b7; font-size: 9px; margin-top: 1px; }.progress-track { height: 7px; border-radius: 5px; background: #edf0f5; overflow: hidden; }.progress-fill { width: var(--progress); height: 100%; border-radius: inherit; background: var(--blue); }.progress-fill.warning { background: #efb83e; }.progress-number { font-family: 'Space Grotesk', sans-serif; text-align: right; font-size: 11px; }.warning-text { color: #ca8a08; }.secondary-button.full-button { min-height: 38px; font-size: 11px; }
.table-card { overflow: hidden; }.table-card .section-heading { margin-bottom: 18px; }.table-scroll { overflow-x: auto; }.table-card table { width: 100%; border-collapse: collapse; min-width: 690px; }.table-card th { color: #9aa5b9; font-size: 9px; letter-spacing: .1em; text-align: left; padding: 0 12px 12px; font-weight: 800; white-space: nowrap; }.table-card td { border-top: 1px solid #edf0f5; padding: 14px 12px; color: #586680; font-size: 11px; vertical-align: middle; }.table-card td:first-child { color: var(--ink); font-weight: 700; }.table-card td:last-child { text-align: right; }.location-cell { display: flex; align-items: center; gap: 10px; }.location-cell small, .table-subline { color: #9ca8ba; display: block; font-size: 10px; font-weight: 400; margin-top: 2px; }.location-icon { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 8px; color: var(--blue); background: var(--blue-soft); }.location-icon svg { width: 15px; height: 15px; }.type-copy small, .type-copy strong { display: block; }.type-copy strong { font-size: 11px; color: #55637c; }.type-copy small { color: #a3adbd; font-size: 10px; }.status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 6px; font-size: 10px; font-weight: 700; white-space: nowrap; }.status-pill::before { content: ''; width: 5px; height: 5px; border-radius: 50%; }.status-pill.ready { color: #168e5b; background: var(--green-soft); }.status-pill.ready::before { background: #24ae74; }.status-pill.attention { color: #bb7c0a; background: var(--amber-soft); }.status-pill.attention::before { background: #e7a326; }.row-action { border: 0; background: transparent; color: #a4afc0; padding: 8px; border-radius: 7px; }.row-action:hover { background: #f2f5fa; color: var(--blue); }
.location-icon.vehicle-icon, .vehicle-detail-icon { color: #b9780a; background: var(--amber-soft); }
.location-icon.personnel-icon, .personnel-detail-icon { color: #7056c8; background: #f1edff; }
.primary-button:disabled { cursor: wait; opacity: .65; transform: none; box-shadow: none; }.primary-button.is-loading::after { content: ''; width: 13px; height: 13px; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }.primary-button.is-loading svg { display: none; }@keyframes spin { to { transform: rotate(360deg); } }

.inspection-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 22px; align-items: start; }.inspection-form { overflow: hidden; }.form-section { padding: 26px 29px; border-bottom: 1px solid var(--line); }.form-section:last-child { border-bottom: 0; }.form-section-heading { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 22px; }.form-section-heading p { color: #8d9ab0; font-size: 11px; margin-bottom: 0; }.step-number { color: var(--blue); font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 11px; background: var(--blue-soft); padding: 5px 7px; border-radius: 6px; }.form-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 16px; }.field { color: #4d5d78; font-size: 11px; font-weight: 700; display: flex; flex-direction: column; gap: 8px; }.required { color: var(--red); }.field-wide { grid-column: span 3; }.field input, .field select, .field textarea, .filter-select { color: var(--ink); background: #fbfcfe; border: 1px solid #dce3ee; border-radius: 9px; min-height: 44px; padding: 0 12px; outline: none; font-size: 12px; }.field textarea { padding-top: 11px; resize: vertical; min-height: 100px; }.field input:focus, .field select:focus, .field textarea:focus { border-color: #8eb1f5; box-shadow: 0 0 0 3px rgba(34, 102, 226, .1); }.field small { color: #93a0b3; font-weight: 400; font-size: 10px; margin-top: -2px; }.asset-preview { margin-top: 18px; }.asset-placeholder, .asset-detail { min-height: 78px; background: #f8faff; border: 1px dashed #c8d8f6; border-radius: 10px; display: flex; align-items: center; gap: 12px; padding: 14px 16px; color: #8da0bd; font-size: 11px; }.asset-placeholder svg { color: #91b2f1; }.asset-detail { border-style: solid; border-color: #deebff; justify-content: space-between; }.asset-detail-main { display: flex; align-items: center; gap: 12px; }.asset-detail-icon { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; color: var(--blue); background: #dfeaff; }.asset-detail strong, .asset-detail span { display: block; }.asset-detail strong { color: var(--ink); font-size: 12px; }.asset-detail span { color: #8292ad; font-size: 10px; margin-top: 2px; }.asset-detail-meta { color: var(--blue) !important; font-weight: 700; text-align: right; }
.checklist-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.check-item { min-height: 76px; border: 1px solid #e1e7f0; border-radius: 10px; padding: 13px; display: flex; align-items: flex-start; gap: 10px; position: relative; cursor: pointer; transition: border .18s, background .18s; }.check-item:hover { border-color: #a6c1f5; background: #fafcff; }.check-item input { position: absolute; opacity: 0; }.checkmark { width: 20px; height: 20px; border: 1.5px solid #c8d2e2; border-radius: 6px; display: grid; place-items: center; flex: 0 0 20px; margin-top: 1px; }.check-item input:checked + .checkmark { background: var(--blue); border-color: var(--blue); }.check-item input:checked + .checkmark::after { content: ''; width: 9px; height: 5px; border: solid #fff; border-width: 0 0 2px 2px; transform: rotate(-45deg) translate(1px, -1px); }.check-item:has(input:not(:checked)) { border-color: #f1d59a; background: #fffdf7; }.check-item strong, .check-item small { display: block; }.check-item strong { font-size: 11px; color: var(--ink); }.check-item small { color: #95a0b2; font-size: 9px; font-weight: 400; margin-top: 2px; }.status-preview { display: flex; align-items: center; gap: 13px; padding: 13px 15px; border: 1px solid #bde6d2; background: var(--green-soft); border-radius: 10px; margin-bottom: 18px; }.status-preview.is-attention { border-color: #f0d28d; background: var(--amber-soft); }.status-preview-icon { background: #c8f0dc; color: var(--green); width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; }.is-attention .status-preview-icon { color: var(--amber); background: #ffe9aa; }.status-preview-icon svg { width: 18px; height: 18px; }.field-kicker { color: #658872; font-size: 9px; letter-spacing: .1em; font-weight: 800; display: block; }.is-attention .field-kicker { color: #a77a18; }.status-preview strong { color: #19724e; display: block; font-family: 'Space Grotesk', sans-serif; font-size: 14px; margin-top: 2px; }.is-attention strong { color: #9f6e09; }.status-preview p { color: #65977d; font-size: 10px; margin: 1px 0 0; }.is-attention p { color: #af8b46; }.form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }.tips-card { padding: 23px; }.tips-icon, .modal-icon { width: 39px; height: 39px; display: grid; place-items: center; background: var(--amber-soft); color: var(--amber); border-radius: 11px; }.tips-icon svg, .modal-icon svg { width: 20px; height: 20px; }.tips-card h3 { margin: 14px 0 12px; }.tips-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 13px; }.tips-card li { color: #75839b; font-size: 11px; padding-left: 17px; position: relative; }.tips-card li::before { content: ''; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; border: 2px solid #8baef1; border-radius: 50%; }.tips-divider { border-top: 1px solid var(--line); margin: 20px 0 15px; }.tip-note { color: #8896ad; font-size: 10px; line-height: 1.6; margin: 0; }.tip-note strong { color: #5d6d87; }
.rating-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; }.rating-item { border: 1px solid #e1e7f0; border-radius: 10px; padding: 14px; display: grid; grid-template-columns: 1fr 132px; align-items: center; gap: 14px; }.rating-item strong, .rating-item small { display: block; }.rating-item strong { color: var(--ink); font-size: 11px; }.rating-item small { color: #95a0b2; font-size: 9px; margin-top: 3px; }.rating-item select { min-height: 40px; color: #5946a4; background: #f7f4ff; border: 1px solid #ddd5f7; border-radius: 8px; padding: 0 9px; font-size: 10px; font-weight: 700; }.personnel-score-card { display: flex; align-items: center; gap: 15px; padding: 15px; border: 1px solid #d9cff8; background: #f7f4ff; border-radius: 11px; margin-bottom: 18px; }.score-ring { width: 64px; height: 64px; border-radius: 50%; display: grid; place-content: center; text-align: center; background: #7056c8; color: #fff; box-shadow: 0 6px 16px rgba(112,86,200,.2); }.score-ring strong { font-family: 'Space Grotesk', sans-serif; font-size: 22px; line-height: 1; }.score-ring span { font-size: 8px; margin-top: 2px; }.personnel-score-card .field-kicker { color: #7664b0; }.personnel-score-card > div:last-child > strong { color: #5946a4; display: block; font-family: 'Space Grotesk', sans-serif; font-size: 16px; margin: 2px 0; }.personnel-score-card p { color: #8274aa; font-size: 10px; margin: 0; }.personnel-score-card.is-attention { background: var(--amber-soft); border-color: #efd28d; }.personnel-score-card.is-attention .score-ring { background: var(--amber); }.personnel-score-card.is-attention .field-kicker, .personnel-score-card.is-attention > div:last-child > strong { color: #9f6e09; }.personnel-score-card.is-attention p { color: #a9833b; }.personnel-tip-icon { color: #7056c8; background: #f1edff; }

.history-card { min-height: 350px; }.filter-row { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 20px; }.search-field { display: flex; align-items: center; gap: 9px; background: #fbfcfe; border: 1px solid #dce3ee; border-radius: 9px; padding: 0 12px; min-height: 40px; width: min(360px, 100%); color: #8a99b1; }.search-field svg { width: 16px; height: 16px; flex: 0 0 16px; }.search-field input { border: 0; background: transparent; outline: 0; min-width: 0; width: 100%; color: var(--ink); font-size: 12px; }.filter-select { min-height: 40px; color: #677691; }.empty-row { text-align: center !important; padding: 40px !important; color: #99a4b7 !important; }
.asset-list-toolbar { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-bottom: 21px; }.asset-list-toolbar h2 { margin-bottom: 3px; }.asset-list-toolbar p { color: #96a2b6; font-size: 11px; margin-bottom: 0; }.compact-search { width: 245px; }.asset-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }.asset-card { border: 1px solid var(--line); border-radius: 11px; padding: 15px; display: flex; align-items: flex-start; gap: 11px; }.asset-card:hover { border-color: #abc4f6; box-shadow: 0 4px 13px rgba(34, 102, 226, .08); }.asset-card-icon { color: var(--blue); background: var(--blue-soft); width: 32px; height: 32px; border-radius: 8px; display: grid; place-items: center; flex: 0 0 32px; }.asset-card-icon svg { width: 16px; height: 16px; }.asset-card h3 { color: var(--ink); font-size: 11px; margin: 0 0 4px; line-height: 1.3; }.asset-card p { color: #93a0b4; font-size: 10px; margin: 0; }.asset-card-meta { margin-left: auto; text-align: right; }.asset-card-meta strong { color: var(--green); font-size: 10px; display: block; }.asset-card-meta span { color: #a1aabd; font-size: 9px; white-space: nowrap; }
.toast { position: fixed; right: 26px; bottom: 24px; z-index: 50; display: flex; align-items: center; gap: 9px; background: var(--navy); color: #fff; border-radius: 9px; padding: 11px 15px 11px 10px; font-size: 12px; box-shadow: 0 10px 25px rgba(11, 23, 55, .23); opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity .25s, transform .25s; }.toast.show { opacity: 1; transform: none; }.toast-icon { width: 24px; height: 24px; border-radius: 50%; background: #2ab97a; display: grid; place-items: center; }.toast-icon svg { width: 13px; height: 13px; }.modal-backdrop { position: fixed; inset: 0; display: grid; place-items: center; background: rgba(8, 17, 39, .48); z-index: 60; padding: 20px; }.modal-backdrop[hidden] { display: none; }.modal { width: min(390px, 100%); background: white; border-radius: 17px; padding: 28px; box-shadow: 0 20px 50px rgba(11, 23, 55, .25); position: relative; text-align: center; }.modal-close { position: absolute; top: 12px; right: 14px; background: transparent; border: 0; color: #9ba6b8; font-size: 24px; line-height: 1; }.modal-icon { margin: 0 auto 15px; }.modal h2 { font-size: 20px; margin-bottom: 8px; }.modal p { color: #76849c; font-size: 12px; margin-bottom: 22px; }

@media (max-width: 1100px) { .stats-grid { grid-template-columns: repeat(2, 1fr); }.dashboard-grid { grid-template-columns: 1fr; }.readiness-card { min-height: auto; }.asset-cards { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 800px) { .sidebar { transform: translateX(-100%); transition: transform .25s ease; box-shadow: 15px 0 30px rgba(11,23,55,.12); }.sidebar.open { transform: none; }.main-content { margin-left: 0; }.topbar { padding: 0 20px; }.mobile-menu { border: 0; display: grid; gap: 4px; width: 40px; height: 40px; place-content: center; background: transparent; margin-right: 12px; }.mobile-menu span { width: 19px; height: 2px; background: var(--navy); border-radius: 2px; }.breadcrumb { margin-right: auto; }.profile-copy, .profile .chevron { display: none; }.topbar-actions { gap: 7px; }.page-wrap { padding: 28px 20px 45px; }.page-heading { align-items: flex-start; flex-direction: column; margin-bottom: 22px; }.compact-heading { flex-direction: column; }.page-heading .primary-button, .page-heading .secondary-button { width: 100%; }.form-grid { grid-template-columns: 1fr 1fr; }.field-wide { grid-column: span 2; }.inspection-layout { grid-template-columns: 1fr; }.tips-card { order: -1; }.checklist-grid, .rating-grid { grid-template-columns: repeat(2, 1fr); }.rating-item { grid-template-columns: 1fr; } }
@media (max-width: 500px) { body { font-size: 14px; }.stats-grid { gap: 10px; }.stat-card { padding: 15px; min-height: 137px; }.stat-label { font-size: 8px; }.stat-value { font-size: 29px; }.stat-foot { align-items: flex-start; gap: 5px; flex-direction: column; }.stat-trend { order: -1; }.surface { border-radius: 13px; }.chart-card, .readiness-card, .table-card, .asset-list-card { padding: 17px; }.chart-area { height: 190px; }.chart-legend { margin-left: 31px; gap: 10px; }.readiness-row { grid-template-columns: 93px 1fr 31px; gap: 7px; }.inspection-form .form-section { padding: 21px 17px; }.form-grid { grid-template-columns: 1fr; }.field-wide { grid-column: auto; }.checklist-grid, .rating-grid { grid-template-columns: 1fr; gap: 8px; }.check-item { padding: 10px; min-height: 83px; }.check-item small { font-size: 8px; }.rating-item { grid-template-columns: 1fr; }.form-actions { flex-direction: column-reverse; }.form-actions button { width: 100%; }.filter-row, .asset-list-toolbar { align-items: stretch; flex-direction: column; }.search-field, .compact-search { width: 100%; }.filter-select { width: 100%; }.asset-cards { grid-template-columns: 1fr; }.toast { left: 18px; right: 18px; bottom: 17px; justify-content: center; }.profile { display: none; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }

.scan-method-card { padding: 16px 18px; margin: -10px 0 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-color: #dce7fb; background: linear-gradient(135deg, #fff 0%, #f6f9ff 100%); }
.scan-method-card strong { display: block; font-family: 'Space Grotesk', sans-serif; font-size: 14px; margin: 2px 0; }
.scan-method-card p { color: #8492a9; font-size: 10px; margin: 0; }
.scan-method-actions { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; }
.module-table { margin-top: 22px; }
.module-table .section-heading { align-items: center; margin-bottom: 18px; }
.module-table table { min-width: 760px; }
.module-table#aparModuleTable table { min-width: 1250px; }
.scanner-modal { width: min(480px, 100%); }
.scanner-icon { color: var(--blue); background: var(--blue-soft); }
.scanner-frame { min-height: 220px; background: #081225; border-radius: 12px; overflow: hidden; position: relative; display: grid; place-items: center; margin: 16px 0; }
.scanner-frame::before, .scanner-frame::after { content: ''; position: absolute; width: 56px; height: 56px; border-color: #4e8cff; border-style: solid; z-index: 2; }
.scanner-frame::before { top: 22px; left: 22px; border-width: 3px 0 0 3px; }
.scanner-frame::after { right: 22px; bottom: 22px; border-width: 0 3px 3px 0; }
.scanner-frame video { width: 100%; min-height: 220px; max-height: 300px; object-fit: cover; display: block; }
.scanner-frame span { position: absolute; color: #a9b8d3; font-size: 11px; max-width: 230px; z-index: 1; }
.scan-manual { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-bottom: 9px; }
.scan-manual input { min-height: 42px; border: 1px solid #dce3ee; border-radius: 9px; padding: 0 12px; outline: none; }
.scan-manual input:focus { border-color: #8eb1f5; box-shadow: 0 0 0 3px rgba(34,102,226,.1); }
.scanner-modal .text-button { justify-content: center; margin-top: 4px; }

@media (max-width: 800px) {
  .scan-method-card { align-items: stretch; flex-direction: column; }
  .scan-method-actions { width: 100%; }
  .scan-method-actions button { flex: 1; }
}

@media (max-width: 500px) {
  .scan-method-actions { flex-direction: column; }
  .scan-method-actions button { width: 100%; }
  .scan-manual { grid-template-columns: 1fr; }
  .scan-manual button { width: 100%; }
}