@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap");:root{--bg:#f8fafc;--surface:#fff;--surface-2:#f1f5f9;--border:#e2e8f0;--border-2:#cbd5e1;--text:#0f172a;--text-2:#334155;--muted:#64748b;--muted-2:#94a3b8;--accent:#2563eb;--accent-bg:#eff6ff;--accent-hover:#1d4ed8;--green:#16a34a;--green-bg:#f0fdf4;--amber:#d97706;--amber-bg:#fffbeb;--red:#dc2626;--red-bg:#fef2f2;--purple:#7c3aed;--purple-bg:#f5f3ff;--sidebar-w:220px;--sidebar-collapsed:56px;--header-h:56px;--r:6px;--r-lg:10px;--shadow:0 1px 3px rgba(0,0,0,.08),0 1px 2px rgba(0,0,0,.04);--shadow-md:0 4px 16px rgba(0,0,0,.08)}*,:after,:before{box-sizing:border-box;margin:0;padding:0}body,html{height:100%}body{background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:.875rem;line-height:1.5;-webkit-font-smoothing:antialiased}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:3px}.layout-root{height:100vh}.layout-root,.sidebar{display:flex;overflow:hidden}.sidebar{width:var(--sidebar-w);min-width:var(--sidebar-w);background:var(--surface);border-right:1px solid var(--border);flex-direction:column;transition:width .2s ease,min-width .2s ease;z-index:50}.sidebar.collapsed,html.sidebar-collapsed-initial .sidebar:not(.collapsed){width:var(--sidebar-collapsed);min-width:var(--sidebar-collapsed)}html.sidebar-collapsed-initial .sidebar:not(.collapsed) .label,html.sidebar-collapsed-initial .sidebar:not(.collapsed) .logo-text,html.sidebar-collapsed-initial .sidebar:not(.collapsed) .nav-section,html.sidebar-collapsed-initial .sidebar:not(.collapsed) .user-meta{opacity:0;width:0}html.brand-deferred .sidebar-footer .user-avatar,html.brand-deferred .sidebar-footer .user-name,html.brand-deferred .sidebar-logo .logo-mark,html.brand-deferred .sidebar-logo .logo-text,html.brand-deferred .sidebar-logo img{visibility:hidden}.sidebar-logo{height:var(--header-h);gap:10px;padding:0 16px;border-bottom:1px solid var(--border)}.logo-mark,.sidebar-logo{display:flex;align-items:center;flex-shrink:0}.logo-mark{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,#2563eb,#7c3aed);justify-content:center;color:#fff;font-weight:800;font-size:.8rem}.logo-text{font-size:.95rem;font-weight:700;color:var(--text);white-space:nowrap;letter-spacing:-.02em}.sidebar-nav{flex:1 1;padding:8px;overflow-y:auto;overflow-x:hidden}.nav-section{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-2);padding:12px 8px 4px;white-space:nowrap;overflow:hidden}.sidebar.collapsed .nav-section{opacity:0}.nav-item{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:var(--r);text-decoration:none;color:var(--muted);font-size:.835rem;font-weight:500;transition:all .12s;cursor:pointer;white-space:nowrap;overflow:hidden;margin-bottom:1px}.nav-item:hover{background:var(--surface-2);color:var(--text)}.nav-item.active{background:var(--accent-bg);color:var(--accent);font-weight:600}.nav-item svg{flex-shrink:0;width:18px;height:18px}.nav-item span.label{overflow:hidden}.sidebar.collapsed .nav-item span.label{opacity:0;width:0}.sidebar-footer{border-top:1px solid var(--border);padding:12px;gap:10px;overflow:hidden}.sidebar-footer,.user-avatar{display:flex;align-items:center;flex-shrink:0}.user-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#7c3aed);justify-content:center;color:#fff;font-size:.68rem;font-weight:700}.user-meta{overflow:hidden}.user-name{font-size:.78rem;font-weight:600;white-space:nowrap}.user-role{font-size:.68rem;color:var(--muted);white-space:nowrap}.main-area{overflow:hidden;min-width:0}.main-area,.page-content-wrap{flex:1 1;display:flex;flex-direction:column}.page-content-wrap{overflow:auto}.page-content-wrap>*{width:100%;max-width:1500px;margin-left:auto;margin-right:auto}.page-header{height:var(--header-h);background:var(--surface);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;gap:12px;flex-shrink:0;position:-webkit-sticky;position:sticky;top:0;z-index:40}.page-title{font-size:1rem;font-weight:700;color:var(--text)}.page-subtitle{font-size:.78rem;color:var(--muted)}.header-spacer{flex:1 1}.header-actions{display:flex;align-items:center;gap:8px}.stat-pill{display:inline-flex;align-items:center;gap:4px;background:var(--surface-2);border:1px solid var(--border);border-radius:20px;padding:3px 10px;font-size:.72rem;color:var(--muted);white-space:nowrap}.stat-pill strong{color:var(--text-2);font-weight:600}.filter-bar{background:var(--surface);border-bottom:1px solid var(--border);padding:10px 24px;display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap}.search-wrap{position:relative}.search-wrap svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted-2);pointer-events:none}.search-input{width:240px;padding:6px 10px 6px 32px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface);color:var(--text);font-size:.825rem;outline:none;font-family:inherit;transition:border-color .15s,box-shadow .15s}.search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.08)}.search-input::placeholder{color:var(--muted-2)}.tab-group{display:flex;gap:0;border:1px solid var(--border);border-radius:var(--r);overflow:hidden}.tab-btn{padding:5px 14px;border:none;cursor:pointer;font-size:.78rem;font-weight:500;background:var(--surface);color:var(--muted);transition:all .12s;font-family:inherit;white-space:nowrap;border-right:1px solid var(--border)}.tab-btn:last-child{border-right:none}.tab-btn:hover{background:var(--surface-2);color:var(--text-2)}.tab-btn.active{background:var(--accent);color:#fff}.filter-select{padding:6px 10px;border:1px solid var(--border);border-radius:var(--r);background:var(--surface);color:var(--text);font-size:.825rem;outline:none;cursor:pointer;font-family:inherit}.filter-select:focus{border-color:var(--accent)}.filter-toggle{display:flex;align-items:center;gap:5px;font-size:.8rem;color:var(--muted);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.filter-toggle input{accent-color:var(--accent)}.btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:var(--r);font-size:.825rem;font-weight:500;border:none;cursor:pointer;text-decoration:none;font-family:inherit;transition:all .12s;white-space:nowrap}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{background:var(--accent-hover)}.btn-ghost{background:var(--surface);border:1px solid var(--border);color:var(--text-2)}.btn-ghost:hover{background:var(--surface-2);border-color:var(--border-2)}.btn-icon{padding:6px 8px}.btn svg{width:15px;height:15px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:visible;box-shadow:var(--shadow)}.table-area{flex:1 1;overflow:hidden;padding:16px 24px;display:flex;flex-direction:column}.card-table{flex:1 1;overflow:auto;border-radius:var(--r-lg);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow)}.data-table{width:100%;border-collapse:collapse;font-size:.825rem}.data-table thead tr th{position:-webkit-sticky;position:sticky;top:0;z-index:10;background:var(--surface-2);padding:9px 14px;text-align:left;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);white-space:nowrap;border-bottom:1px solid var(--border);-webkit-user-select:none;-moz-user-select:none;user-select:none}.data-table th.r{text-align:right}.data-table td{padding:10px 14px;border-bottom:1px solid var(--border);vertical-align:middle;color:var(--text-2)}.data-table tbody tr:last-child td{border-bottom:none}.data-table tbody tr{cursor:pointer;transition:background .08s}.data-table tbody tr:hover{background:#f8fafc}.data-table tbody tr:hover td{color:var(--text)}.data-table tbody tr.dim{opacity:.5}.c-ref{font-family:ui-monospace,SF Mono,monospace;font-size:.78rem;color:var(--accent);font-weight:600}.c-name{font-weight:500;color:var(--text)}.c-sub{font-size:.72rem;color:var(--muted);margin-top:1px}.c-r{text-align:right}.c-mono{font-family:ui-monospace,SF Mono,monospace;font-size:.8rem}.c-val{font-weight:600;color:var(--text)}.c-link{color:var(--accent);text-decoration:none;font-size:.78rem;font-family:ui-monospace,monospace}.c-link:hover{text-decoration:underline}.truncate{overflow:hidden;text-overflow:ellipsis}.badge,.truncate{white-space:nowrap}.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:20px;font-size:.7rem;font-weight:600}.badge-dot{width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}.b-draft{background:var(--surface-2);color:var(--muted);border:1px solid var(--border)}.b-sent{background:#eff6ff;color:#1d4ed8}.b-approved{background:var(--green-bg);color:var(--green)}.b-ordered{background:var(--purple-bg);color:var(--purple)}.b-declined{background:var(--red-bg);color:var(--red)}.b-invoiced{background:var(--amber-bg);color:var(--amber)}.b-archived{background:var(--surface-2);color:var(--muted)}.b-service{background:#eff6ff;color:#1d4ed8}.b-direct{background:var(--purple-bg);color:var(--purple)}.b-open{background:#eff6ff;color:#1d4ed8}.b-complete{background:var(--green-bg);color:var(--green)}.b-warn{background:var(--amber-bg);color:var(--amber)}.b-danger{background:var(--red-bg);color:var(--red)}.mg-high{color:var(--green);font-weight:600}.mg-mid{color:var(--amber);font-weight:600}.mg-low{color:var(--red);font-weight:600}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skel{background:linear-gradient(90deg,var(--surface-2) 25%,#e8eef5 50%,var(--surface-2) 75%);background-size:800px 100%;animation:shimmer 1.4s infinite;border-radius:4px;height:13px}.empty-state{padding:60px 24px;text-align:center;color:var(--muted)}.empty-state svg{opacity:.25;margin-bottom:12px}.empty-state p{font-size:.875rem}.pagination{background:var(--surface);border-top:1px solid var(--border);padding:10px 24px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.pag-info{font-size:.78rem;color:var(--muted)}.pag-btns{gap:4px}.pag-btn,.pag-btns{display:flex;align-items:center}.pag-btn{width:28px;height:28px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--text-2);cursor:pointer;font-size:.78rem;justify-content:center;transition:all .1s;font-family:inherit}.pag-btn:hover:not(:disabled){background:var(--surface-2);border-color:var(--border-2)}.pag-btn:disabled{opacity:.35;cursor:not-allowed}.pag-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.pag-label{font-size:.78rem;color:var(--muted);padding:0 8px;white-space:nowrap}.sidebar-toggle{width:28px;height:28px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .12s;flex-shrink:0}.sidebar-toggle:hover{background:var(--surface-2);color:var(--text)}@keyframes toastIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes toastOut{0%{opacity:1}to{opacity:0}}.toast{position:fixed;bottom:24px;right:24px;z-index:9999;background:var(--text);color:#fff;padding:10px 18px;border-radius:8px;font-size:.82rem;font-weight:500;box-shadow:0 8px 24px rgba(0,0,0,.18);animation:toastIn .22s ease forwards;display:flex;align-items:center;gap:8px;max-width:360px}.toast.out{animation:toastOut .2s ease forwards}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r)}a{transition:color .1s}.card-lift{transition:box-shadow .18s,transform .18s}.card-lift:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.divider{height:1px;background:var(--border);margin:1rem 0}@media print{.btn,.filter-bar,.page-header,.sidebar,.sidebar-toggle{display:none!important}.main-area{overflow:visible!important}body{background:#fff!important;font-size:11pt}.card{box-shadow:none!important;border:1px solid #ccc!important}table{page-break-inside:auto}tr{page-break-inside:avoid}a{color:inherit!important;text-decoration:none!important}}html.dark{--bg:#0f172a;--surface:#1e293b;--surface-2:#334155;--border:#334155;--border-2:#475569;--text:#f1f5f9;--text-2:#cbd5e1;--muted:#94a3b8;--muted-2:#64748b;--accent-bg:#1e3a5f;--green-bg:#052e16;--amber-bg:#1c1407;--red-bg:#1f0707;--purple-bg:#1e0f3a}