:root {
    --bg: #f5f7fb;
    --panel: #ffffff;
    --text: #172033;
    --muted: #6b7280;
    --line: #e5e7eb;
    --primary: #2f6fed;
    --primary-soft: #eaf1ff;
    --success: #166534;
    --success-bg: #dcfce7;
    --danger: #b91c1c;
    --danger-bg: #fee2e2;
    --warning-bg: #fef3c7;
    --warning: #92400e;
    --shadow: 0 10px 35px rgba(15, 23, 42, 0.08);
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--primary);text-decoration:none}
.app-shell{min-height:100vh;display:grid;grid-template-columns:290px 1fr}
.sidebar{background:#101828;color:#fff;padding:22px 18px;display:flex;flex-direction:column;gap:18px}
.brand{display:flex;gap:12px;align-items:center}
.brand-mark{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,#4f8cff,#2f6fed);display:grid;place-items:center;font-weight:700}
.brand h1{margin:0;font-size:20px}
.brand p{margin:4px 0 0;color:#c9d1e1;font-size:13px}
.nav-section-title{font-size:12px;text-transform:uppercase;color:#97a3ba;margin:8px 10px 0}
.nav{display:grid;gap:6px;max-height:calc(100vh - 240px);overflow:auto;padding-right:2px}
.nav a{color:#d7ddee;padding:11px 12px;border-radius:12px;display:block}
.nav a:hover,.nav a.active{background:rgba(255,255,255,.08);color:#fff}
.sidebar-footer{margin-top:auto;display:grid;gap:12px}
.user-card{background:rgba(255,255,255,.06);padding:12px;border-radius:14px}
.user-card strong{display:block}
.user-card span{color:#c9d1e1;font-size:13px}
.switcher{display:flex;gap:8px;align-items:center}
.switcher select{width:100%}
.main-content{padding:26px}
.topbar{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:16px}
.topbar h2{margin:0 0 6px;font-size:28px}
.topbar p{margin:0;color:var(--muted)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:20px;margin-bottom:18px}
.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.panel-head h3{margin:0}
.grid-2,.grid-3,.grid-4,.stats-grid{display:grid;gap:16px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.stats-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.stat-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:var(--shadow)}
.stat-card span{display:block;color:var(--muted);font-size:13px;margin-bottom:10px}
.stat-card strong{font-size:28px}
input,select,textarea,button{font:inherit}
input,select,textarea{width:100%;padding:11px 12px;border:1px solid #d4d9e2;border-radius:12px;background:#fff}
textarea{resize:vertical;min-height:90px}
button,.button,.ghost-button,.danger-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:10px 14px;cursor:pointer}
button,.button{background:var(--primary);color:#fff}
.ghost-button{background:var(--primary-soft);color:var(--primary)}
.danger-button{background:#fff1f2;color:var(--danger)}
.inline-form{display:inline}
.form-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}
label{display:block;font-weight:600;font-size:14px;margin-bottom:8px}
table{width:100%;border-collapse:collapse}
th,td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.small{font-size:12px;color:var(--muted)}
.badge{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:700}
.badge-draft{background:#e5e7eb;color:#374151}
.badge-pending{background:#dbeafe;color:#1d4ed8}
.badge-approved,.badge-posted{background:#dcfce7;color:#166534}
.badge-rejected,.badge-cancelled{background:#fee2e2;color:#b91c1c}
.badge-open{background:#fef3c7;color:#92400e}
.alert{border-radius:14px;padding:14px 16px;margin-bottom:16px;font-weight:600}
.alert-success{background:var(--success-bg);color:var(--success)}
.alert-error{background:var(--danger-bg);color:var(--danger)}
.alert-warning{background:var(--warning-bg);color:var(--warning)}
.filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;align-items:end}
.actions-cell{display:flex;gap:8px;flex-wrap:wrap}
.line-table input,.line-table select{min-width:110px}
.line-table th,.line-table td{padding:8px}
.right{text-align:right}
.center{text-align:center}
.login-page{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(180deg,#eef4ff,#f8fafc)}
.login-card{width:100%;max-width:460px;background:#fff;border-radius:24px;padding:28px;box-shadow:var(--shadow);border:1px solid var(--line)}
.note-box{margin-top:18px;background:var(--primary-soft);color:#244aa8;border-radius:16px;padding:14px;font-size:14px;line-height:1.5}
.kpi-pair{display:flex;justify-content:space-between;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}
.print-card{background:#fff;border:1px dashed #94a3b8;border-radius:14px;padding:18px;max-width:900px}
.cheque{border:2px solid #94a3b8;border-radius:18px;padding:24px;background:#fff;max-width:880px}
.cheque h3{margin:0 0 16px}
.print-only{display:none}
@media (max-width: 1100px){
    .app-shell{grid-template-columns:1fr}
    .sidebar{position:sticky;top:0;z-index:2}
}
@media (max-width: 900px){
    .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
    .topbar{flex-direction:column}
}
@media print{
    .sidebar,.topbar .button,.panel-head .button,.panel-head .ghost-button,.no-print{display:none !important}
    .app-shell{display:block}
    .main-content{padding:0}
    .panel{box-shadow:none;border:none;padding:0;margin:0}
    .print-only{display:block}
}