@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--color-bg: #fafafa;--color-surface: #ffffff;--color-surface-sunken: #f4f4f5;--color-surface-muted: #f9fafb;--color-overlay: rgba(15, 23, 42, .55);--color-border: #e4e4e7;--color-border-strong: #d4d4d8;--color-border-subtle: #f1f5f9;--color-ink: #18181b;--color-ink-muted: #52525b;--color-ink-subtle: #71717a;--color-ink-disabled: #a1a1aa;--color-ink-inverse: #ffffff;--accent-50: #eef2ff;--accent-100: #e0e7ff;--accent-500: #6366f1;--accent-600: #4f46e5;--accent-700: #4338ca;--accent-ring: color-mix(in oklab, var(--accent-600) 35%, transparent);--accent-contrast: #ffffff;--status-ok-fg: #047857;--status-ok-bg: #ecfdf5;--status-ok-border: #a7f3d0;--status-ok-solid: #059669;--status-bad-fg: #b91c1c;--status-bad-bg: #fef2f2;--status-bad-border: #fecaca;--status-bad-solid: #dc2626;--status-warn-fg: #b45309;--status-warn-bg: #fffbeb;--status-warn-border: #fde68a;--status-warn-solid: #d97706;--status-info-fg: #1e40af;--status-info-bg: #eff6ff;--status-info-border: #bfdbfe;--role-chip-bg: #18181b;--role-chip-fg: #fafafa;--role-supervisor-dot: var(--accent-600);--role-approver-dot: #7c3aed;--role-submitter-dot: #0891b2;--role-field-dot: #71717a;--space-0: 0;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-7: 32px;--space-8: 40px;--space-9: 48px;--space-10: 64px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-full: 999px;--shadow-xs: 0 1px 2px rgba(15, 23, 42, .04);--shadow-sm: 0 1px 2px rgba(15, 23, 42, .04), 0 1px 3px rgba(15, 23, 42, .06);--shadow-md: 0 4px 12px rgba(15, 23, 42, .08), 0 2px 4px rgba(15, 23, 42, .04);--shadow-lg: 0 24px 48px rgba(15, 23, 42, .18), 0 8px 16px rgba(15, 23, 42, .08);--font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;--text-xs: 11px;--lh-xs: 16px;--text-sm: 12px;--lh-sm: 18px;--text-base: 13px;--lh-base: 20px;--text-md: 14px;--lh-md: 22px;--text-lg: 16px;--lh-lg: 24px;--text-xl: 18px;--lh-xl: 26px;--text-2xl: 22px;--lh-2xl: 30px;--text-3xl: 28px;--lh-3xl: 36px;--text-4xl: 36px;--lh-4xl: 42px;--weight-regular: 400;--weight-medium: 500;--weight-semibold:600;--weight-bold: 700;--tracking-tight: -.01em;--tracking-normal: 0;--tracking-mono: .04em;--ease-out: cubic-bezier(.2, .7, .3, 1);--duration-fast: .12s;--duration-base: .2s;--duration-slow: .32s;--row-y-comfortable: 12px;--row-y-compact: 8px}.app,.app *{box-sizing:border-box}.app{font-family:var(--font-sans);color:var(--color-ink);background:var(--color-bg);font-size:var(--text-md);line-height:var(--lh-md);height:100%;width:100%;position:relative;display:flex;flex-direction:column;overflow:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-feature-settings:"cv11","ss01","tnum";container-type:inline-size;container-name:app}.app *::selection{background:var(--accent-100);color:var(--color-ink)}.app-header{flex:0 0 auto;height:56px;display:flex;align-items:center;gap:var(--space-3);padding:0 var(--space-6);background:var(--color-surface);border-bottom:1px solid var(--color-border);position:relative;z-index:2}.app-logo{display:flex;align-items:center;gap:var(--space-2);font-weight:var(--weight-semibold);color:var(--color-ink);letter-spacing:var(--tracking-tight)}.app-logo-mark{width:28px;height:28px;border-radius:var(--radius-sm);background:var(--color-ink);color:var(--color-ink-inverse);display:grid;place-items:center}.app-logo-mark svg{width:16px;height:16px;stroke-width:2}.app-logo-text{font-size:var(--text-md);font-weight:var(--weight-semibold)}.app-logo-sub{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink-subtle);letter-spacing:var(--tracking-mono);text-transform:uppercase;margin-left:var(--space-2);padding-left:var(--space-3);border-left:1px solid var(--color-border)}.app-nav{display:flex;gap:var(--space-1);margin-left:var(--space-5)}.app-nav button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--color-ink-muted);font-family:inherit;font-size:var(--text-md);font-weight:var(--weight-medium);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-2);transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}.app-nav button:hover{background:var(--color-surface-sunken);color:var(--color-ink)}.app-nav button[aria-current=page]{color:var(--color-ink);background:var(--color-surface-sunken)}.app-nav button[aria-current=page]:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent-600);margin-right:2px}.app-nav .nav-count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink-subtle);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full);padding:1px 6px;margin-left:2px}.app-nav button[aria-current=page] .nav-count{color:var(--accent-700);background:var(--accent-50);border-color:var(--accent-100)}.header-right{margin-left:auto;display:flex;align-items:center;gap:var(--space-2)}.icon-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;width:32px;height:32px;border-radius:var(--radius-sm);display:grid;place-items:center;cursor:pointer;color:var(--color-ink-muted);transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}.icon-btn:hover{background:var(--color-surface-sunken);color:var(--color-ink)}.icon-btn svg{width:16px;height:16px;stroke-width:1.75}.user-chip{display:inline-flex;align-items:center;gap:var(--space-2);padding:4px 10px 4px 4px;border-radius:var(--radius-full);background:var(--color-surface-sunken);border:1px solid var(--color-border);cursor:pointer;transition:background var(--duration-fast) var(--ease-out)}.user-chip:hover{background:var(--color-bg)}.user-avatar{width:24px;height:24px;border-radius:var(--radius-full);background:var(--accent-600);color:var(--accent-contrast);display:grid;place-items:center;font-size:var(--text-xs);font-weight:var(--weight-semibold)}.user-name{font-size:var(--text-md);font-weight:var(--weight-medium)}.user-chevron{color:var(--color-ink-subtle)}.user-chevron svg{width:14px;height:14px}.role-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--radius-full);background:var(--role-chip-bg);color:var(--role-chip-fg);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-mono);text-transform:uppercase;font-family:var(--font-mono)}.role-dot{width:6px;height:6px;border-radius:var(--radius-full);background:currentColor}.role-dot.supervisor{color:var(--role-supervisor-dot)}.role-dot.approver{color:var(--role-approver-dot)}.role-dot.submitter{color:var(--role-submitter-dot)}.role-dot.field{color:var(--role-field-dot)}.viewas-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-ink);font-family:inherit;font-size:var(--text-xs);font-weight:var(--weight-medium);padding:5px 22px 5px 10px;border-radius:var(--radius-sm);cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--color-ink-muted) 50%),linear-gradient(135deg,var(--color-ink-muted) 50%,transparent 50%);background-position:calc(100% - 12px) 50%,calc(100% - 8px) 50%;background-size:4px 4px,4px 4px;background-repeat:no-repeat;transition:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out)}.viewas-select:hover{background-color:var(--color-surface-sunken)}.viewas-select[data-active=true]{background-color:var(--accent-600);color:var(--color-ink-inverse);border-color:var(--accent-600);background-image:linear-gradient(45deg,transparent 50%,var(--color-ink-inverse) 50%),linear-gradient(135deg,var(--color-ink-inverse) 50%,transparent 50%)}.viewas-strip{display:flex;align-items:center;gap:var(--space-3);padding:6px var(--space-6);background:var(--color-ink);color:var(--color-ink-inverse);font-size:var(--text-sm);border-bottom:1px solid var(--color-border)}.viewas-strip strong{font-weight:var(--weight-semibold)}.viewas-strip svg{width:14px;height:14px;opacity:.9}.viewas-strip .viewas-spacer{flex:1}.viewas-strip button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.15);background:#ffffff14;color:var(--color-ink-inverse);font-family:inherit;font-size:var(--text-xs);padding:3px 10px;border-radius:var(--radius-sm);cursor:pointer;font-weight:var(--weight-medium)}.viewas-strip button:hover{background:#ffffff26}.app[data-viewas-style=ring] .app-body{position:relative}.app[data-viewas-style=ring][data-viewas-active=true] .app-body:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:2px solid var(--accent-600);pointer-events:none;z-index:5}.viewas-chip{position:absolute;bottom:var(--space-5);left:50%;transform:translate(-50%);background:var(--color-ink);color:var(--color-ink-inverse);font-size:var(--text-sm);font-weight:var(--weight-medium);padding:8px 14px 8px 12px;border-radius:var(--radius-full);display:inline-flex;align-items:center;gap:10px;box-shadow:var(--shadow-lg);z-index:60}.viewas-chip svg{width:14px;height:14px}.viewas-chip .role-dot{width:8px;height:8px}.viewas-chip button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--color-ink-inverse);opacity:.7;cursor:pointer;padding:0;margin-left:2px;display:grid;place-items:center}.viewas-chip button:hover{opacity:1}.viewas-chip button svg{width:14px;height:14px}.app[data-viewas-style=header] .role-chip[data-previewing=true]{background:var(--accent-600);color:var(--accent-contrast)}.app[data-viewas-style=header] .role-chip[data-previewing=true]:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent-contrast);animation:viewas-pulse 1.4s var(--ease-out) infinite}@keyframes viewas-pulse{0%,to{opacity:1}50%{opacity:.4}}.app-body{flex:1 1 auto;overflow:auto;padding:var(--space-6) var(--space-7)}.view-header{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}.view-title{font-size:var(--text-2xl);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-tight);margin:0}.view-subtitle{font-size:var(--text-md);color:var(--color-ink-muted);margin:4px 0 0}.view-actions{display:flex;gap:var(--space-2)}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid transparent;background:transparent;color:var(--color-ink);font-family:inherit;font-size:var(--text-md);font-weight:var(--weight-medium);padding:7px 14px;border-radius:var(--radius-sm);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out);white-space:nowrap}.btn svg{width:14px;height:14px;stroke-width:2}.btn-primary{background:var(--accent-600);color:var(--accent-contrast);border-color:var(--accent-600)}.btn-primary:hover{background:var(--accent-700);border-color:var(--accent-700)}.btn-secondary{background:var(--color-surface);border-color:var(--color-border-strong);color:var(--color-ink)}.btn-secondary:hover{background:var(--color-surface-sunken)}.btn-ghost{color:var(--color-ink-muted)}.btn-ghost:hover{background:var(--color-surface-sunken);color:var(--color-ink)}.btn-success{background:var(--status-ok-solid);color:var(--accent-contrast);border-color:var(--status-ok-solid)}.btn-success:hover{filter:brightness(.95)}.btn-danger{background:var(--color-surface);color:var(--status-bad-fg);border-color:var(--color-border-strong)}.btn-danger:hover{background:var(--status-bad-bg);border-color:var(--status-bad-border)}.btn-sm{padding:5px 10px;font-size:var(--text-sm)}.btn:disabled,.btn[aria-disabled=true]{opacity:.5;pointer-events:none}.field{display:block;width:100%;font-family:inherit;font-size:var(--text-md);color:var(--color-ink);background:var(--color-surface);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);padding:7px 10px;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.field:focus{outline:0;border-color:var(--accent-600);box-shadow:0 0 0 3px var(--accent-ring)}.field[disabled],.field[readonly]{background:var(--color-surface-sunken);color:var(--color-ink-muted);cursor:not-allowed}select.field{padding-right:28px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");background-repeat:no-repeat;background-position:right 10px center}.input-with-icon{position:relative}.input-with-icon svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);width:14px;height:14px;color:var(--color-ink-subtle);pointer-events:none}.input-with-icon .field{padding-left:32px}.field-label{display:block;font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-ink-muted);margin-bottom:6px}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-bottom:var(--space-6)}.kpi-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);display:flex;flex-direction:column;gap:8px;position:relative}.kpi-card .kpi-head{display:flex;align-items:center;justify-content:space-between;color:var(--color-ink-muted)}.kpi-card .kpi-label{font-size:var(--text-sm);font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:var(--tracking-mono);font-family:var(--font-mono)}.kpi-card .kpi-icon{width:28px;height:28px;border-radius:var(--radius-sm);display:grid;place-items:center;background:var(--color-surface-sunken);color:var(--color-ink-muted)}.kpi-card .kpi-icon svg{width:14px;height:14px}.kpi-card .kpi-value{font-size:var(--text-3xl);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-tight);font-variant-numeric:tabular-nums;line-height:1.1}.kpi-card .kpi-foot{font-size:var(--text-xs);color:var(--color-ink-subtle);font-family:var(--font-mono);display:flex;align-items:center;gap:6px}.kpi-card[data-tone=ok] .kpi-icon{background:var(--status-ok-bg);color:var(--status-ok-fg)}.kpi-card[data-tone=bad] .kpi-icon{background:var(--status-bad-bg);color:var(--status-bad-fg)}.kpi-card[data-tone=warn] .kpi-icon{background:var(--status-warn-bg);color:var(--status-warn-fg)}.kpi-card[data-tone=info] .kpi-icon{background:var(--accent-50);color:var(--accent-700)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden}.card-header{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-3)}.card-header h3{margin:0;font-size:var(--text-md);font-weight:var(--weight-semibold)}.card-header .card-sub{font-size:var(--text-sm);color:var(--color-ink-muted);margin-left:var(--space-2)}.card-header .card-actions{margin-left:auto;display:flex;gap:var(--space-2)}.card-body{padding:var(--space-5)}.pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);font-weight:var(--weight-semibold);font-family:var(--font-mono);letter-spacing:var(--tracking-mono);text-transform:uppercase;padding:3px 8px 3px 6px;border-radius:var(--radius-full);border:1px solid transparent;white-space:nowrap}.pill .pill-dot{width:6px;height:6px;border-radius:var(--radius-full);background:currentColor}.pill[data-tone=ok]{color:var(--status-ok-fg);background:var(--status-ok-bg);border-color:var(--status-ok-border)}.pill[data-tone=bad]{color:var(--status-bad-fg);background:var(--status-bad-bg);border-color:var(--status-bad-border)}.pill[data-tone=warn]{color:var(--status-warn-fg);background:var(--status-warn-bg);border-color:var(--status-warn-border)}.pill[data-tone=info]{color:var(--status-info-fg);background:var(--status-info-bg);border-color:var(--status-info-border)}.pill[data-tone=neutral]{color:var(--color-ink-muted);background:var(--color-surface-sunken);border-color:var(--color-border)}.badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--text-xs);font-family:var(--font-mono);letter-spacing:var(--tracking-mono);text-transform:uppercase;padding:2px 7px;border-radius:var(--radius-sm);border:1px solid var(--color-border);color:var(--color-ink-muted);background:var(--color-surface)}.table-wrap{overflow-x:auto}.table{width:100%;border-collapse:collapse;font-size:var(--text-base);font-variant-numeric:tabular-nums}.table thead th{position:sticky;top:0;text-align:left;font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--color-ink-muted);letter-spacing:var(--tracking-mono);text-transform:uppercase;padding:10px 14px;background:var(--color-surface-sunken);border-bottom:1px solid var(--color-border);white-space:nowrap;font-family:var(--font-mono)}.table tbody td{padding:var(--row-y-comfortable) 14px;border-bottom:1px solid var(--color-border-subtle);vertical-align:middle;white-space:nowrap;color:var(--color-ink)}.app[data-density=compact] .table tbody td{padding-top:var(--row-y-compact);padding-bottom:var(--row-y-compact)}.table tbody tr{cursor:pointer;transition:background var(--duration-fast) var(--ease-out)}.table tbody tr:hover{background:var(--accent-50)}.table tbody tr:hover .row-actions{opacity:1}.table .col-serial{font-family:var(--font-mono);font-weight:var(--weight-semibold);color:var(--color-ink)}.table .col-muted{color:var(--color-ink-muted)}.table .col-em-dash{color:var(--color-ink-disabled)}.table .col-num{text-align:right;font-variant-numeric:tabular-nums}.row-actions{display:inline-flex;gap:2px;opacity:0;transition:opacity var(--duration-fast) var(--ease-out)}.row-actions .icon-btn{width:28px;height:28px}.row-actions .icon-btn svg{width:14px;height:14px}.table-toolbar{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);background:var(--color-surface)}.table-toolbar .search{flex:1;max-width:340px}.table-toolbar .toolbar-spacer{flex:1}.table-toolbar .result-count{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink-subtle);letter-spacing:var(--tracking-mono);text-transform:uppercase}.fleet-bar{display:flex;height:8px;border-radius:var(--radius-full);background:var(--color-surface-sunken);overflow:hidden;min-width:160px}.fleet-bar span{display:block;height:100%}.fleet-bar .seg-ok{background:var(--status-ok-solid)}.fleet-bar .seg-bad{background:var(--status-bad-solid)}.fleet-bar .seg-warn{background:var(--status-warn-solid);opacity:.55}.fleet-pct{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-ink-muted);font-variant-numeric:tabular-nums;margin-left:var(--space-3)}.modal-scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);display:grid;place-items:center;padding:var(--space-5);z-index:70;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal{width:100%;max-width:680px;max-height:calc(100% - 24px);background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden}.modal[data-size=lg]{max-width:880px}.modal-head{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-5) var(--space-5) var(--space-4);border-bottom:1px solid var(--color-border)}.modal-head h2{margin:0;font-size:var(--text-xl);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-tight)}.modal-head .modal-sub{margin-top:4px;color:var(--color-ink-muted);font-size:var(--text-md)}.modal-head .modal-close{margin-left:auto}.modal-body{padding:var(--space-5);overflow:auto;flex:1 1 auto}.modal-foot{padding:var(--space-4) var(--space-5);border-top:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-2);background:var(--color-surface)}.modal-foot .foot-note{font-size:var(--text-sm);color:var(--color-ink-muted)}.modal-foot .foot-spacer{flex:1}.section-label{font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-mono);text-transform:uppercase;color:var(--color-ink-subtle);margin:0 0 var(--space-3);display:flex;align-items:center;gap:6px}.section-label svg{width:12px;height:12px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3) var(--space-5)}.field-grid .field-row.span-2{grid-column:1 / -1}.field-row .field-static{font-size:var(--text-md);font-weight:var(--weight-medium);color:var(--color-ink)}.field-row .field-static.muted{color:var(--color-ink-disabled)}.section-block{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);margin-bottom:var(--space-4);background:var(--color-surface)}.section-block.locked{background:var(--color-surface-sunken)}.section-block.locked .field-static{color:var(--color-ink-muted)}.history{display:flex;flex-direction:column}.history-item{display:flex;gap:var(--space-3);padding:var(--space-3) 0;border-top:1px solid var(--color-border-subtle);font-size:var(--text-sm)}.history-item:first-child{border-top:0;padding-top:0}.history-item .ts{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink-subtle);flex:0 0 110px;letter-spacing:var(--tracking-mono)}.history-item .who{font-weight:var(--weight-semibold);color:var(--color-ink);margin-right:6px}.history-item .what{color:var(--color-ink-muted)}.diff-chip{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-mono);font-size:var(--text-xs);padding:1px 6px;border-radius:var(--radius-sm);background:var(--color-surface-sunken);border:1px solid var(--color-border);color:var(--color-ink-muted);margin:0 2px}.diff-chip.from{color:var(--status-bad-fg);background:var(--status-bad-bg);border-color:var(--status-bad-border)}.diff-chip.to{color:var(--status-ok-fg);background:var(--status-ok-bg);border-color:var(--status-ok-border)}.lock-badge{display:inline-flex;align-items:center;gap:4px;font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink-subtle);letter-spacing:var(--tracking-mono);text-transform:uppercase}.lock-badge svg{width:12px;height:12px}.toast{position:absolute;right:var(--space-5);bottom:var(--space-5);background:var(--color-ink);color:var(--color-ink-inverse);padding:10px 14px;border-radius:var(--radius-md);box-shadow:var(--shadow-lg);font-size:var(--text-sm);display:inline-flex;align-items:center;gap:var(--space-2);z-index:80}.toast svg{width:14px;height:14px;color:var(--status-ok-solid)}.approval-card{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5);margin-bottom:var(--space-3);background:var(--color-surface)}.approval-card .ap-head{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3)}.approval-card .ap-changes{display:flex;flex-direction:column;gap:6px;margin-bottom:var(--space-3)}.approval-card .ap-foot{display:flex;gap:var(--space-2)}.row{display:flex;align-items:center;gap:var(--space-3)}.row-gap-2{gap:var(--space-2)}.spacer{flex:1}.muted{color:var(--color-ink-muted)}.subtle{color:var(--color-ink-subtle)}.mono{font-family:var(--font-mono);letter-spacing:var(--tracking-mono)}.tnum{font-variant-numeric:tabular-nums}.region-mid,.region-vco{color:var(--color-ink-muted)}.table .cell-meta{display:none}@container app (max-width: 1024px){.app-header{height:52px;padding:0 var(--space-4);gap:var(--space-2)}.app-logo-sub{display:none}.app-logo-text{font-size:var(--text-base)}.app-nav{display:none}.header-right{gap:var(--space-1)}.header-right .icon-btn[aria-label=Help],.header-right .icon-btn[aria-label=Notifications],.user-chip .user-name{display:none}.user-chip{padding:4px}.app-body{padding:var(--space-4);padding-bottom:calc(var(--space-4) + 64px)}.view-header{flex-direction:column;align-items:stretch;gap:var(--space-3);margin-bottom:var(--space-4)}.view-title{font-size:var(--text-xl)}.view-subtitle{font-size:var(--text-sm)}.view-actions{display:flex;flex-wrap:wrap}.kpi-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-3);margin-bottom:var(--space-4)}.kpi-card{padding:var(--space-3) var(--space-4)}.kpi-card .kpi-value{font-size:var(--text-2xl)}.app-body>div[style*="grid-template-columns: 1.6fr 1fr"],.app-body>div[style*="1.6fr 1fr"]{grid-template-columns:1fr!important}.table thead{display:none}.table,.table tbody,.table tbody tr,.table tbody td{display:block;width:100%}.table tbody tr{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border-subtle);position:relative;cursor:pointer}.table tbody tr:hover{background:transparent}.table tbody tr:active{background:var(--accent-50)}.table tbody td{padding:0;border:0;white-space:normal}.table.pumps-table tbody td.cell-serial{font-family:var(--font-mono);font-weight:600;font-size:var(--text-md)}.table.pumps-table tbody td.cell-status{display:inline-block;margin-left:auto}.table.pumps-table tbody td.cell-customer{font-size:var(--text-md);color:var(--color-ink);margin-top:4px}.table.pumps-table tbody td.cell-customer.empty{color:var(--color-ink-disabled);font-style:italic}.table.pumps-table tbody td.cell-meta{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-ink-subtle);margin-top:4px;display:flex;gap:10px;align-items:center}.table.pumps-table tbody td.cell-meta:before{content:""}.table.pumps-table tbody td.cell-actions,.table.pumps-table tbody td.cell-hide{display:none}.table.pumps-table tbody tr{display:grid;grid-template-columns:1fr auto;grid-template-areas:"serial   status" "customer customer" "meta     meta";gap:2px 8px}.table.pumps-table tbody td.cell-serial{grid-area:serial}.table.pumps-table tbody td.cell-status{grid-area:status;justify-self:end;align-self:center}.table.pumps-table tbody td.cell-customer{grid-area:customer}.table.pumps-table tbody td.cell-meta{grid-area:meta}.table.fleet-table{display:table}.table.fleet-table thead{display:table-header-group}.table.fleet-table tbody{display:table-row-group}.table.fleet-table tbody tr{display:table-row;padding:0}.table.fleet-table tbody td{display:table-cell;padding:var(--row-y-comfortable) 12px;border-bottom:1px solid var(--color-border-subtle)}.table.fleet-table .fleet-bar{min-width:100px}.table-toolbar{flex-wrap:wrap;padding:var(--space-3);gap:var(--space-2)}.table-toolbar .search{max-width:none;flex:1 1 100%;order:-1}.table-toolbar select.field{flex:1;min-width:0}.table-toolbar .toolbar-spacer{display:none}.table-toolbar .result-count{flex:1 1 100%;text-align:right}.modal-scrim{padding:0;align-items:flex-end}.modal{max-width:none;width:100%;height:100%;max-height:100%;border-radius:0;border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg)}.modal-head{padding:var(--space-4)}.modal-head h2{font-size:var(--text-lg)}.modal-body{padding:var(--space-4)}.modal-foot{padding:var(--space-3) var(--space-4);padding-bottom:calc(var(--space-3) + env(safe-area-inset-bottom,0px));background:var(--color-surface);box-shadow:0 -1px 0 var(--color-border)}.modal-foot .foot-note{display:none}.modal-foot .btn{flex:1;justify-content:center}.modal:before{content:"";display:block;width:36px;height:4px;border-radius:999px;background:var(--color-border-strong);margin:8px auto 0}.field-grid{grid-template-columns:1fr;gap:var(--space-3)}.field-grid .field-row.span-2{grid-column:auto}.section-block{padding:var(--space-3) var(--space-4)}.app[data-viewas-style=strip] .viewas-strip{padding:6px var(--space-4);font-size:var(--text-xs)}.app[data-viewas-style=ring][data-viewas-active=true] .app-body:before{border-width:2px}.viewas-chip{bottom:calc(72px + env(safe-area-inset-bottom,0px));font-size:var(--text-xs);padding:6px 12px 6px 10px}.app-tabs{display:flex;position:absolute;bottom:0;left:0;right:0;background:var(--color-surface);border-top:1px solid var(--color-border);padding:4px var(--space-2) calc(4px + env(safe-area-inset-bottom,0px));z-index:4;height:64px;box-sizing:content-box}.app-tabs button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--color-ink-muted);cursor:pointer;font-family:inherit;font-size:10px;font-weight:var(--weight-medium);letter-spacing:var(--tracking-mono);text-transform:uppercase;border-radius:var(--radius-sm);padding:4px 0;position:relative}.app-tabs button svg{width:20px;height:20px;stroke-width:1.75}.app-tabs button[aria-current=page]{color:var(--accent-600)}.app-tabs button .nav-count{position:absolute;top:4px;right:24px;background:var(--status-bad-solid);color:var(--color-ink-inverse);border-radius:var(--radius-full);font-family:var(--font-mono);font-size:9px;font-weight:var(--weight-semibold);padding:1px 5px;min-width:14px;text-align:center;border:0}}.app-menu-btn{display:none}@container app (max-width: 1024px){.app-menu-btn{display:grid;place-items:center;width:36px;height:36px;border:0;background:transparent;color:var(--color-ink);border-radius:var(--radius-sm);cursor:pointer;margin-right:var(--space-1)}.app-menu-btn svg{width:20px;height:20px;stroke-width:1.75}.app-menu-btn:hover{background:var(--color-surface-sunken)}}.drawer-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);z-index:60;opacity:0;pointer-events:none;transition:opacity var(--duration-base) var(--ease-out)}.drawer-scrim[data-open=true]{opacity:1;pointer-events:auto}.drawer{position:absolute;top:0;left:0;bottom:0;width:280px;max-width:80%;background:var(--color-surface);border-right:1px solid var(--color-border);z-index:61;transform:translate(-100%);transition:transform var(--duration-base) var(--ease-out);display:flex;flex-direction:column}.drawer[data-open=true]{transform:translate(0)}.drawer-head{padding:var(--space-4);border-bottom:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-3)}.drawer-head .app-logo-mark{width:32px;height:32px}.drawer-nav{padding:var(--space-3);display:flex;flex-direction:column;gap:2px}.drawer-nav button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;text-align:left;font-family:inherit;font-size:var(--text-md);font-weight:var(--weight-medium);color:var(--color-ink);padding:var(--space-3);border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;gap:var(--space-3)}.drawer-nav button:hover{background:var(--color-surface-sunken)}.drawer-nav button[aria-current=page]{background:var(--accent-50);color:var(--accent-700)}.drawer-nav button svg{width:18px;height:18px}.drawer-nav .nav-count{margin-left:auto;font-family:var(--font-mono);font-size:var(--text-xs);background:var(--accent-100);color:var(--accent-700);border-radius:var(--radius-full);padding:1px 8px}.drawer-foot{margin-top:auto;padding:var(--space-4);border-top:1px solid var(--color-border);display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-sm)}.status-toggle{display:flex;gap:6px;padding:6px;background:var(--color-surface-sunken);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-bottom:var(--space-4)}.status-toggle button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;flex:1;font-family:inherit;font-size:var(--text-md);font-weight:var(--weight-semibold);color:var(--color-ink-muted);padding:var(--space-3) var(--space-2);border-radius:var(--radius-sm);cursor:pointer;background:transparent;display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}.status-toggle button svg{width:16px;height:16px}.status-toggle button[aria-pressed=true]{background:var(--color-surface);box-shadow:var(--shadow-sm)}.status-toggle button[aria-pressed=true][data-tone=ok]{color:var(--status-ok-fg)}.status-toggle button[aria-pressed=true][data-tone=bad]{color:var(--status-bad-fg)}.status-toggle button[aria-pressed=true][data-tone=warn]{color:var(--status-warn-fg)}.sync-badge{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:var(--tracking-mono);text-transform:uppercase;padding:3px 9px;border-radius:var(--radius-full);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-ink-muted)}.sync-badge[data-state=syncing]{color:var(--status-info-fg);border-color:var(--status-info-border);background:var(--status-info-bg)}.sync-badge[data-state=pending]{color:var(--status-warn-fg);border-color:var(--status-warn-border);background:var(--status-warn-bg)}.sync-badge[data-state=offline]{color:var(--status-bad-fg);border-color:var(--status-bad-border);background:var(--status-bad-bg)}.sync-badge svg{width:11px;height:11px}.sync-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--status-ok-solid)}.sync-badge[data-state=syncing] .dot{background:var(--status-info-fg);animation:sync-pulse 1.2s var(--ease-out) infinite}.sync-badge[data-state=pending] .dot{background:var(--status-warn-solid)}.sync-badge[data-state=offline] .dot{background:var(--status-bad-solid)}@keyframes sync-pulse{0%,to{opacity:1}50%{opacity:.35}}.swipe-row{position:relative;overflow:hidden}.swipe-row .swipe-bg{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-mono);text-transform:uppercase;pointer-events:none}.swipe-row .swipe-bg.left{background:var(--status-ok-solid);color:var(--color-ink-inverse);justify-content:flex-start;padding-left:var(--space-4)}.swipe-row .swipe-bg.right{background:var(--status-bad-solid);color:var(--color-ink-inverse);justify-content:flex-end;padding-right:var(--space-4)}.swipe-row .swipe-bg svg{width:16px;height:16px;margin-right:6px}.swipe-row .swipe-fg{position:relative;background:var(--color-surface);transition:transform var(--duration-base) var(--ease-out)}.swipe-row[data-state=left] .swipe-fg{transform:translate(120px)}.swipe-row[data-state=right] .swipe-fg{transform:translate(-120px)}.action-sheet-scrim{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--color-overlay);display:flex;align-items:flex-end;z-index:70}.action-sheet{width:100%;background:var(--color-surface);border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);padding:var(--space-3) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom,0px));box-shadow:var(--shadow-lg)}.action-sheet:before{content:"";display:block;width:36px;height:4px;border-radius:999px;background:var(--color-border-strong);margin:0 auto var(--space-3)}.action-sheet h4{margin:0 0 var(--space-2);font-size:var(--text-sm);color:var(--color-ink-muted);font-weight:var(--weight-medium)}.action-sheet button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;width:100%;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);background:transparent;font-family:inherit;font-size:var(--text-md);font-weight:var(--weight-medium);color:var(--color-ink);border-radius:var(--radius-sm);cursor:pointer;min-height:44px}.action-sheet button:hover{background:var(--color-surface-sunken)}.action-sheet button svg{width:18px;height:18px}.action-sheet button[data-tone=bad]{color:var(--status-bad-fg)}.action-sheet button[data-tone=ok]{color:var(--status-ok-fg)}.skel{display:block;background:linear-gradient(90deg,var(--color-surface-sunken) 0%,var(--color-surface-muted) 50%,var(--color-surface-sunken) 100%);background-size:200% 100%;border-radius:var(--radius-sm);animation:skel-shimmer 1.4s ease-in-out infinite}@keyframes skel-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skel.s-text{height:12px;width:60%}.skel.s-title{height:22px;width:40%}.skel.s-sub{height:14px;width:30%;margin-top:8px}.skel.s-value{height:28px;width:50%}.skel.s-btn{height:32px;width:96px;border-radius:var(--radius-sm)}.skel.s-row{height:40px;width:100%}.skel-stack>*+*{margin-top:var(--space-2)}.error-banner{display:flex;align-items:center;gap:var(--space-3);background:var(--status-bad-bg);color:var(--status-bad-fg);border:1px solid var(--status-bad-fg);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-5);font-size:var(--text-sm)}.error-banner .error-message{flex:1}.error-banner .btn{background:var(--color-surface);color:var(--status-bad-fg);border-color:var(--status-bad-fg)}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}