:root{--primary:#0284c7;--primary-dark:#0369a1;--primary-deep:#0b3c6f;--primary-soft:#e0f2fe;--bg:#f8fafc;--surface:#fff;--text:#1e293b;--heading:#0f172a;--muted:#64748b;--border:#e2e8f0;--danger:#dc2626;--radius:12px;--shadow:0 1px 3px rgba(15,23,42,.08)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,"Segoe UI",system-ui,sans-serif;color:var(--text);background:var(--bg)}a{color:inherit;text-decoration:none}button,input{font:inherit}.muted{color:var(--muted)}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--primary)}
.guest-body{background:#fff}.login-wrap{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr}.login-visual{display:flex;align-items:flex-end;padding:70px;background:linear-gradient(135deg,#0b3c6f 0%,#0284c7 58%,#38bdf8 100%);color:#fff;position:relative;overflow:hidden}.login-visual:after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.18);border-radius:50%;right:-180px;top:-130px;box-shadow:0 0 0 80px rgba(255,255,255,.04),0 0 0 160px rgba(255,255,255,.03)}.login-visual>div{max-width:620px;position:relative;z-index:1}.login-visual .eyebrow{color:#bae6fd}.login-visual h1{font-size:48px;line-height:1.1;margin:14px 0 18px}.login-visual p{font-size:18px;line-height:1.65;color:#e0f2fe}.login-panel{display:flex;align-items:center;justify-content:center;padding:36px}.login-card{width:min(420px,100%)}.login-logo,.brand-mark{display:grid;place-items:center;background:linear-gradient(135deg,var(--primary-dark),#38bdf8);color:#fff;font-weight:800}.login-logo{width:52px;height:52px;border-radius:14px;margin-bottom:25px;font-size:24px}.login-card h2{font-size:28px;color:var(--heading);margin:0 0 6px}.login-card label{display:block;font-weight:600;font-size:14px;margin:20px 0 7px}.login-card input{width:100%;height:46px;border:1px solid var(--border);border-radius:9px;padding:0 13px;outline:none}.login-card input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(14,165,233,.16)}
.btn{border:0;border-radius:9px;padding:10px 16px;font-weight:650;cursor:pointer}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{background:#fff;border:1px solid var(--border);color:var(--text)}.btn-block{width:100%;margin-top:25px;height:46px}.alert{padding:11px 13px;border-radius:9px;margin:18px 0}.alert-danger{background:#fee2e2;color:#991b1b;border:1px solid #fecaca}
.app-shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr}.sidebar{background:#fff;border-right:1px solid var(--border);padding:20px 14px;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:11px;padding:2px 8px 24px}.brand-mark{width:42px;height:42px;border-radius:11px}.brand strong,.brand small{display:block}.brand strong{font-size:18px;color:var(--primary-deep)}.brand small{font-size:11px;color:var(--muted);margin-top:2px}.nav-menu{display:grid;gap:4px}.nav-menu a{padding:11px 13px;border-radius:9px;font-size:14px;color:#475569}.nav-menu a:hover{background:var(--bg);color:var(--primary-dark)}.nav-menu a.active{background:var(--primary-soft);color:var(--primary-dark);font-weight:700;box-shadow:inset 3px 0 var(--primary)}.nav-section{font-size:10px;letter-spacing:.11em;font-weight:800;color:#94a3b8;padding:18px 13px 5px}.main-area{min-width:0}.topbar{height:64px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 25px;position:sticky;top:0;z-index:10}.topbar small,.topbar strong{display:block}.topbar small{font-size:11px;color:var(--muted)}.topbar strong{font-size:14px;margin-top:2px}.topbar-actions{display:flex;align-items:center;gap:12px}.role-badge{background:var(--primary-soft);color:var(--primary-dark);border-radius:7px;padding:6px 9px;font-size:12px;font-weight:700}.content-area{padding:28px}.page-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:23px}.page-heading h1{font-size:27px;margin:5px 0 3px;color:var(--heading)}.page-heading p{margin:0;font-size:14px}.date-chip{background:#fff;border:1px solid var(--border);border-radius:9px;padding:9px 12px;font-size:13px}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.kpi-card,.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.kpi-card{padding:20px;border-top:3px solid var(--primary)}.kpi-card span,.kpi-card small{display:block;color:var(--muted)}.kpi-card span{font-size:13px;font-weight:600}.kpi-card strong{display:block;font-size:30px;color:var(--heading);margin:10px 0 3px}.kpi-card small{font-size:11px}.dashboard-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:16px;margin-top:16px}.card{padding:20px}.card-header{border-bottom:1px solid var(--border);padding-bottom:14px}.card h2{font-size:16px;margin:0 0 4px;color:var(--heading)}.card p{font-size:13px;margin:0}.empty-state{text-align:center;padding:45px 20px;color:var(--muted)}.empty-state strong{display:block;color:var(--text);margin:10px 0 5px}.empty-icon{width:42px;height:42px;margin:auto;display:grid;place-items:center;border-radius:50%;background:var(--primary-soft);color:var(--primary);font-weight:800}.info-list{margin:8px 0 0}.info-list div{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--border)}.info-list dt{color:var(--muted);font-size:13px}.info-list dd{margin:0;font-weight:600;font-size:13px}.error-page{text-align:center;padding:80px 20px}.error-page>span{font-size:72px;font-weight:800;color:var(--primary-soft)}.error-page h1{color:var(--heading);margin-top:-10px}.error-page p{color:var(--muted);margin-bottom:25px}
@media(max-width:980px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.login-visual{padding:45px}.login-visual h1{font-size:38px}}
@media(max-width:720px){.login-wrap{grid-template-columns:1fr}.login-visual{display:none}.login-panel{min-height:100vh;padding:24px}.app-shell{display:block}.sidebar{display:none}.topbar{padding:0 16px}.content-area{padding:18px 14px 90px}.kpi-grid{grid-template-columns:1fr 1fr;gap:10px}.kpi-card{padding:15px}.kpi-card strong{font-size:25px}.page-heading{display:block}.date-chip{display:inline-block;margin-top:12px}.role-badge{display:none}}