:root {
  --ink:#10233d;
  --muted:#627287;
  --accent:#0088a8;
  --accent-dark:#006b85;
  --paper:#ffffff;
  --surface:#f4f7fa;
  --line:#dce4ea;
  --danger:#c51b37;
  --warning:#bc6b00;
  --success:#087f5b;
  --sidebar:#10233d;
}
* { box-sizing:border-box; }
body { background:var(--surface); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; margin:0; }
a { color:var(--accent-dark); font-weight:650; text-decoration:none; }
a:hover { text-decoration:underline; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:1.55rem; margin-bottom:0; }
h2 { font-size:1.05rem; margin-bottom:1rem; }
h3 { font-size:.93rem; margin:.3rem 0 .55rem; }
small { color:var(--muted); display:block; font-size:.75rem; font-weight:500; margin-top:2px; }
button,input,select,textarea { font:inherit; }
input,select,textarea { background:#fff; border:1px solid #cbd7df; border-radius:7px; color:var(--ink); margin-top:5px; min-height:38px; padding:8px 10px; width:100%; }
textarea { min-height:74px; resize:vertical; }
input:focus,select:focus,textarea:focus { border-color:var(--accent); box-shadow:0 0 0 3px #0088a825; outline:none; }
label { color:var(--ink); display:block; font-size:.82rem; font-weight:650; }
hr { border:0; border-top:1px solid var(--line); margin:1.35rem 0; }
table { border-collapse:collapse; width:100%; }
th { background:#edf3f6; color:#455769; font-size:.72rem; letter-spacing:.02em; text-align:left; text-transform:uppercase; }
td,th { border-bottom:1px solid var(--line); padding:9px 8px; vertical-align:top; }
td { font-size:.84rem; }
tfoot td { font-weight:750; }
.app-shell { display:grid; grid-template-columns:242px minmax(0,1fr); min-height:100vh; }
.sidebar { background:var(--sidebar); color:#edf6fa; display:flex; flex-direction:column; padding:22px 14px; }
.identity { align-items:center; display:flex; gap:10px; margin:0 7px 27px; }
.identity img { background:#fff; border-radius:8px; max-height:42px; max-width:46px; object-fit:contain; padding:3px; }
.identity strong { display:block; font-size:.96rem; }
.identity small { color:#aac3d1; }
.brand-mark { align-items:center; background:#00c7dc; border-radius:11px; color:#06334a; display:inline-flex; font-size:1.25rem; font-weight:900; height:42px; justify-content:center; width:42px; }
.sidebar nav { display:grid; gap:3px; }
.sidebar nav a { border-radius:7px; color:#cfdfeb; font-size:.88rem; padding:10px 11px; }
.sidebar nav a:hover,.sidebar nav a.active { background:#23425e; color:#fff; text-decoration:none; }
.sidebar-user { border-top:1px solid #355570; margin:24px 7px 0; margin-top:auto; padding-top:16px; }
.sidebar-user strong { display:block; font-size:.83rem; }
.sidebar-user small { color:#aac3d1; margin-bottom:8px; }
.link-button { background:none; border:0; color:#b9d4e3; cursor:pointer; font-size:.8rem; padding:0; }
.main-content { max-width:1600px; overflow:hidden; padding:28px; width:100%; }
.page-header { align-items:center; display:flex; justify-content:space-between; margin-bottom:22px; }
.eyebrow { color:var(--accent-dark); font-size:.72rem; font-weight:800; letter-spacing:.08em; margin-bottom:4px; text-transform:uppercase; }
.muted,.hint { color:var(--muted); font-size:.84rem; }
.hint { margin:0; }
.panel { background:var(--paper); border:1px solid #e2e9ee; border-radius:12px; box-shadow:0 3px 12px #2234440c; padding:20px; }
.panel.narrow { max-width:940px; }
.panel-title { align-items:center; display:flex; gap:12px; justify-content:space-between; }
.panel-title h2 { margin-bottom:0; }
.metrics { display:grid; gap:15px; grid-template-columns:repeat(4,minmax(0,1fr)); margin-bottom:20px; }
.metrics article { background:#fff; border:1px solid #e2e9ee; border-radius:11px; box-shadow:0 3px 12px #2234440c; display:grid; gap:8px; padding:17px; }
.metrics article span { color:var(--muted); font-size:.78rem; font-weight:650; }
.metrics article strong { color:var(--ink); font-size:1.3rem; }
.metrics .warning strong { color:var(--warning); }
.small-metrics { grid-template-columns:1fr 1fr; margin:14px 0; }
.small-metrics article { padding:12px; }
.two-columns { display:grid; gap:20px; grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:20px; }
.inventory-layout { grid-template-columns:minmax(340px,.9fr) minmax(500px,1.3fr); }
.form-grid { display:grid; gap:14px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.form-grid.compact { align-items:end; grid-template-columns:repeat(4,minmax(0,1fr)); }
.form-grid .full { grid-column:1/-1; }
.stacked-form { display:grid; gap:15px; }
.check { align-items:center; display:flex; gap:8px; min-height:38px; }
.check input { height:16px; margin:0; min-height:0; width:16px; }
.primary,.secondary,.danger { border:0; border-radius:7px; cursor:pointer; display:inline-block; font-size:.84rem; font-weight:750; min-height:38px; padding:10px 14px; text-align:center; text-decoration:none; }
.primary { background:var(--accent); color:white; }
.primary:hover { background:var(--accent-dark); color:#fff; text-decoration:none; }
.secondary { background:#e8f2f5; color:#07586d; }
.secondary:hover { background:#d6eaf0; text-decoration:none; }
.danger { background:var(--danger); color:#fff; }
.danger:hover { background:#a9112a; }
.small { font-size:.77rem; min-height:31px; padding:7px 10px; }
.quick-actions { display:flex; flex-wrap:wrap; gap:9px; }
.table-wrap { overflow:auto; }
.badge { background:#e2f4f7; border-radius:99px; color:#086276; font-size:.75rem; font-weight:750; padding:5px 9px; white-space:nowrap; }
.danger-text { color:var(--danger); font-weight:800; }
.alert { border:1px solid; border-radius:8px; font-size:.86rem; margin:0 0 16px; padding:11px 13px; }
.alert.success { background:#e7f8f0; border-color:#a6dfc6; color:#07573b; }
.alert.error { background:#fff0f2; border-color:#ffbac4; color:#a30f28; }
.status { border-radius:99px; display:inline-block; font-size:.72rem; font-weight:750; padding:4px 8px; white-space:nowrap; }
.status.draft { background:#eef1f4; color:#5a6673; }
.status.pending_billing { background:#fff1d9; color:#965400; }
.status.invoiced { background:#e4f8ef; color:#087451; }
.status.void { background:#fde7eb; color:#b11b34; }
.detail-grid { display:grid; gap:16px; grid-template-columns:repeat(3,minmax(0,1fr)); margin:18px 0; }
.detail-grid > div { background:#f5f8fa; border-radius:8px; padding:11px; }
.detail-grid p { font-size:.84rem; margin:5px 0 0; }
.actions,.workflow-actions { align-items:end; display:flex; flex-wrap:wrap; gap:10px; }
.workflow-actions { border-top:1px solid var(--line); margin-top:17px; padding-top:16px; }
.inline-form { align-items:end; background:#f5f8fa; border-radius:8px; display:flex; flex-wrap:wrap; gap:9px; padding:10px; }
.inline-form label { flex:1 1 220px; }
.danger-zone { background:#fff3f4; }
.total-row td { background:#e2f4f7; font-size:1rem; }
.note { background:#f4f7fa; border-left:3px solid var(--accent); font-size:.85rem; margin:16px 0 0; padding:10px; }
.quote-lines select,.quote-lines input,.quote-lines textarea { font-size:.78rem; margin:0; min-width:100px; padding:6px; }
.quote-lines textarea { min-height:38px; }
.quote-lines .line-remove { background:#fff0f2; border:0; border-radius:5px; color:var(--danger); cursor:pointer; font-weight:800; min-height:32px; }
.permission-grid { border-top:1px solid var(--line); display:grid; gap:10px; grid-template-columns:repeat(2,minmax(0,1fr)); padding-top:12px; }
.permission-grid h3 { grid-column:1/-1; }
.permission-grid label { background:#f5f8fa; border-radius:7px; padding:8px; }
.auth-body { align-items:center; background:linear-gradient(135deg,#edf9fb,#f7f7fb); display:flex; justify-content:center; min-height:100vh; padding:24px; }
.login-card,.install-card { background:#fff; border:1px solid #e1e8ee; border-radius:16px; box-shadow:0 14px 40px #10233d1b; max-width:490px; padding:30px; width:100%; }
.install-card { max-width:760px; }
.login-card .brand-mark,.install-card .brand-mark { margin-bottom:16px; }
.login-card h1,.install-card h1 { margin-bottom:7px; }
.install-card h2 { border-top:1px solid var(--line); margin:22px 0 2px; padding-top:20px; }
@media (max-width:1050px) {
  .app-shell { grid-template-columns:1fr; }
  .sidebar { gap:12px; padding:13px 16px; }
  .identity { margin:0; }
  .sidebar nav { display:flex; flex-wrap:wrap; }
  .sidebar nav a { padding:7px 9px; }
  .sidebar-user { border:0; margin:0; padding:0; }
  .sidebar-user form { display:inline; }
  .main-content { padding:19px; }
  .inventory-layout { grid-template-columns:1fr; }
}
@media (max-width:720px) {
  .main-content { padding:14px; }
  .metrics,.two-columns,.form-grid,.detail-grid,.permission-grid { grid-template-columns:1fr; }
  .form-grid.compact { grid-template-columns:1fr; }
  .form-grid .full { grid-column:auto; }
  .page-header { margin-bottom:16px; }
  .panel { padding:15px; }
  .inline-form { display:grid; }
  .actions { align-items:stretch; display:grid; width:100%; }
}