:root{--bg:#f4f6f8;--panel:#fff;--ink:#17212b;--muted:#65717d;--line:#dde3e8;--primary:#193b63;--primary2:#285b91;--success:#177245;--danger:#b42318;--warning:#945e00;--radius:14px;--shadow:0 4px 18px rgba(20,32,44,.07)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}a{color:var(--primary2);text-decoration:none}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:245px;background:#102943;color:#fff;padding:22px 16px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;gap:12px;align-items:center}.brand-mark{width:42px;height:42px;border-radius:10px;background:#fff;color:#102943;display:grid;place-items:center;font-weight:900}.brand strong,.brand small{display:block}.brand small{opacity:.65;margin-top:3px}.sidebar nav{margin-top:28px;display:grid;gap:5px}.sidebar nav a{color:#dbe6ef;padding:11px 12px;border-radius:9px}.sidebar nav a:hover,.sidebar nav a.active{background:#244967;color:#fff}.sidebar-footer{margin-top:auto;border-top:1px solid rgba(255,255,255,.12);padding-top:15px;display:grid;gap:6px}.sidebar-footer a{color:#bcd0df}.main{margin-left:245px;min-height:100vh}.topbar{height:82px;background:#fff;border-bottom:1px solid var(--line);padding:0 28px;display:flex;align-items:center;gap:14px}.topbar h1{font-size:22px;margin:0}.topbar small{color:var(--muted)}.menu-btn{display:none}.content{padding:26px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.cards.compact{grid-template-columns:repeat(2,minmax(220px,300px))}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}.metric small{display:block;color:var(--muted);margin-bottom:9px}.metric strong{font-size:25px}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.card-title,.toolbar,.quick-actions,.form-actions,.filter{display:flex;align-items:center;gap:10px}.card-title{justify-content:space-between;margin-bottom:12px}.card-title h2,.form-card h2{font-size:17px;margin:0}.toolbar{justify-content:space-between;margin-bottom:18px}.quick-actions{margin-bottom:20px;flex-wrap:wrap}.btn{border:1px solid #cbd4db;background:#fff;border-radius:9px;padding:10px 14px;color:var(--ink);cursor:pointer;font-weight:600;display:inline-block}.btn:hover{background:#f7f9fa}.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn.primary:hover{background:var(--primary2)}.btn.full{width:100%}.btn.large{padding:12px 20px}.search{display:flex;gap:8px}.search input{min-width:290px}.filter{gap:12px;flex-wrap:wrap}.filter.card{margin-bottom:18px;justify-content:flex-start}.filter label{display:flex;align-items:center;gap:6px}label{display:grid;gap:6px;color:#3c4854;font-weight:600}input,select,textarea{width:100%;padding:10px 11px;border:1px solid #cfd8df;border-radius:8px;background:#fff;color:var(--ink);font:inherit}textarea{resize:vertical;min-height:70px}.form-card{margin-bottom:18px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.span-2{grid-column:span 2}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px 10px;border-bottom:1px solid #edf0f2;white-space:nowrap}th{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}.empty{text-align:center;color:var(--muted);padding:25px}.badge{display:inline-block;padding:4px 8px;border-radius:999px;background:#eef2f5;font-size:12px}.badge.success{background:#e8f6ee;color:var(--success)}.badge.danger{background:#fdecec;color:var(--danger)}.alert{margin:18px 26px 0;padding:12px 15px;border-radius:10px;background:#eef4fa;border:1px solid #d4e3f1}.alert.success{background:#eaf7ef;border-color:#c8e9d3;color:var(--success)}.alert.error{background:#fff0ef;border-color:#f2cfcb;color:var(--danger)}.alert.warning{background:#fff7e7;border-color:#f2ddb4;color:var(--warning);margin:0 0 18px}.totals{display:grid;gap:14px}.totals>div{display:flex;justify-content:space-between;font-size:17px}.hidden{display:none!important}.icon-btn{border:0;background:#f3f5f6;width:30px;height:30px;border-radius:8px;font-size:20px;cursor:pointer}.invoice{max-width:950px;margin:auto}.invoice-head{display:flex;justify-content:space-between;border-bottom:2px solid var(--ink);padding-bottom:15px;margin-bottom:15px}.invoice-head h2{margin:0}.invoice-customer{padding:10px 0 20px}.invoice-total{margin-left:auto;width:280px;text-align:right}.invoice-total .grand{font-size:18px;border-top:1px solid var(--line);padding-top:8px}.login-body{min-height:100vh;display:grid;place-items:center;background:#eef2f5;padding:20px}.login-card{width:min(420px,100%);background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);padding:28px}.login-card form{display:grid;gap:15px}.login-brand{margin-bottom:24px}.login-brand .brand-mark{background:#102943;color:#fff}.muted{color:var(--muted)}.center{text-align:center}code{background:#eef2f5;padding:2px 5px;border-radius:4px}
@media(max-width:900px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main{margin-left:0}.menu-btn{display:block;border:0;background:#eef2f5;border-radius:8px;padding:8px 10px;font-size:18px}.cards{grid-template-columns:1fr 1fr}.grid-2{grid-template-columns:1fr}.content{padding:18px}.topbar{padding:0 18px}.alert{margin:14px 18px 0}}
@media(max-width:600px){.cards,.cards.compact{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.toolbar{align-items:stretch;flex-direction:column}.search{width:100%}.search input{min-width:0}.quick-actions .btn{flex:1;text-align:center}.invoice-head{display:block}.invoice-total{width:100%}}
@media print{.sidebar,.topbar,.toolbar,.alert,.no-print{display:none!important}.main{margin:0}.content{padding:0}.card{box-shadow:none;border:0}.invoice{max-width:none}}