:root{--color-bg:#eef1f8;--color-surface:#fff;--color-border:#e7eaf3;--color-text:#1f2a44;--color-text-muted:#7b8399;--color-primary:#24325c;--color-primary-dark:#182142;--color-accent:#f5a623;--color-accent-dark:#e0940f;--color-success:#1fa971;--color-danger:#e0574e;--color-warning:#d9a441;--sidebar-width:232px;--header-height:64px;--radius-lg:16px;--radius-md:12px;--shadow-card:0 4px 18px #1f2a440f;--shadow-card-hover:0 8px 26px #1f2a441a;font-family:Segoe UI,Inter,system-ui,-apple-system,Arial,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{overflow-x:hidden}.app-shell{width:100%;min-width:0}body{background:var(--color-bg);color:var(--color-text);font-size:14px}a{color:var(--color-primary);text-decoration:none}button{cursor:pointer;font-family:inherit}.app-shell{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);color:#aab2cf;background:linear-gradient(#17203c 0%,#111830 100%);flex-direction:column;flex-shrink:0;display:flex}.sidebar-brand{color:#fff;letter-spacing:.01em;border-bottom:1px solid #ffffff14;margin-bottom:10px;padding:22px 22px 18px;font-size:18px;font-weight:800}.sidebar-nav{flex-direction:column;flex:1;gap:4px;padding:8px 12px;display:flex}.sidebar-link{color:#aab2cf;border-radius:11px;align-items:center;gap:12px;padding:11px 14px;font-size:13.5px;font-weight:600;transition:background .15s,color .15s,box-shadow .15s;display:flex}.sidebar-link span:first-child{background:#ffffff0f;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:15px;display:flex}.sidebar-link:hover{color:#fff;background:#ffffff12}.sidebar-link.active{background:linear-gradient(135deg, #f7b955, var(--color-accent));color:#1f2a44;box-shadow:0 6px 16px #f5a62359}.sidebar-link.active span:first-child{background:#1f2a441f}.sidebar-footer{color:#6d7593;border-top:1px solid #ffffff14;padding:16px 22px;font-size:11.5px}.main-area{flex-direction:column;flex:1;min-width:0;display:flex}.topbar{height:var(--header-height);background:var(--color-surface);z-index:2;justify-content:space-between;align-items:center;padding:0 28px;display:flex;box-shadow:0 2px 12px #1f2a440d}.topbar-title{color:var(--color-text);font-size:18px;font-weight:800}.topbar-user{color:var(--color-text-muted);align-items:center;gap:14px;font-size:13px;display:flex}.btn-logout{color:var(--color-danger);background:#fdecea;border:none;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700}.btn-logout:hover{background:#fbdcd8}.content{flex:1;padding:26px 28px;overflow-y:auto}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:20px}.stat-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:20px;display:grid}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);padding:18px}.stat-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:6px;font-size:12px}.stat-value{font-size:26px;font-weight:700}.grid-2{grid-template-columns:1.3fr 1fr;gap:16px;display:grid}@media (width<=900px){.grid-2{grid-template-columns:1fr}}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;border-bottom:1px solid var(--color-border);padding:13px 14px}th{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:11.5px;font-weight:700}tbody tr{transition:background .12s}tr:hover td{background:#f7f8fc}.badge{border-radius:999px;padding:4px 12px;font-size:12px;font-weight:700;display:inline-block}.badge-active{color:var(--color-success);background:#e2f7ee}.badge-inactive{color:var(--color-danger);background:#fdecea}.form-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}@media (width<=700px){.form-grid{grid-template-columns:1fr}}label{color:var(--color-text-muted);margin-bottom:6px;font-size:12px;font-weight:700;display:block}input,select,textarea{border:1px solid var(--color-border);width:100%;color:var(--color-text);background:#fbfcfe;border-radius:10px;padding:10px 13px;font-family:inherit;font-size:13px}input:focus,select:focus,textarea:focus{border-color:var(--color-accent);background:#fff;outline:none;box-shadow:0 0 0 3px #f5a62326}.btn{border:1px solid #0000;border-radius:999px;padding:10px 20px;font-size:13px;font-weight:700;transition:transform .1s,box-shadow .15s,background .15s}.btn-primary{background:linear-gradient(135deg, #2c3968, var(--color-primary));color:#fff;box-shadow:0 6px 16px #24325c47}.btn-primary:hover:not(:disabled){background:var(--color-primary-dark);transform:translateY(-1px)}.btn-primary:disabled{opacity:.6;cursor:default;transform:none}.btn-secondary{border-color:var(--color-border);color:var(--color-text);background:#fff}.btn-secondary:hover{background:#f3f5fa}.btn-danger{border-color:var(--color-danger);color:var(--color-danger);background:#fff}.btn-danger:hover{background:#fdecea}.btn-sm{padding:7px 14px;font-size:12px}.toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;display:flex}.filters{flex-wrap:wrap;gap:10px;display:flex}.filters input,.filters select{width:auto;min-width:160px}.alert{border-radius:10px;margin-bottom:14px;padding:11px 16px;font-size:13px;font-weight:600}.alert-error{color:var(--color-danger);background:#fdecea;border:1px solid #f7cdc8}.alert-success{color:var(--color-success);background:#e2f7ee;border:1px solid #bfeed8}.alert-warning{color:var(--color-warning);background:#fef4e0;border:1px solid #f5dfab}.modal-backdrop{z-index:50;background:#0f121e80;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{border-radius:var(--radius-lg);background:#fff;width:560px;max-width:92vw;max-height:88vh;padding:26px;overflow-y:auto;box-shadow:0 30px 70px #0f121e59}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal-header h2{margin:0;font-size:17px;font-weight:800}.modal-close{color:var(--color-text-muted);background:0 0;border:none;font-size:18px}.pagination{align-items:center;gap:10px;margin-top:14px;font-size:13px;display:flex}.login-wrap{background:#e9ebef;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-panel{background:#fff;border-radius:20px;width:900px;max-width:100%;min-height:560px;display:flex;overflow:hidden;box-shadow:0 25px 60px #1f2a442e}.login-panel-left{text-align:center;flex-direction:column;flex:0 0 42%;align-items:center;padding:44px 40px;display:flex}.login-brand{color:var(--color-accent);letter-spacing:1px;margin-bottom:18px;font-size:30px;font-weight:800}.login-avatar{width:68px;height:68px;margin-bottom:18px}.login-avatar svg{width:100%;height:100%}.login-tabs{border-bottom:1px solid var(--color-border);width:100%;margin-bottom:22px;padding-bottom:10px}.login-tabs-title{border-bottom:2px solid #1f2a44;margin-bottom:-11px;padding-bottom:10px;font-size:17px;font-weight:700;display:inline-block}.login-panel-left form{width:100%}.login-input{text-align:left;background:#f6f7fa;border:1px solid #eef0f3;border-radius:999px;align-items:center;gap:10px;margin-bottom:16px;padding:4px;display:flex}.login-input:focus-within{border-color:var(--color-accent);box-shadow:0 0 0 3px #f5a62326}.login-input-icon{background:linear-gradient(135deg, var(--color-accent), #f7c568);color:#fff;border-radius:999px;flex:none;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.login-input-icon svg{width:16px;height:16px}.login-input input{background:0 0;border:none;outline:none;flex:1;padding:10px 14px 10px 0;font-size:14px}.login-submit{color:#fff;cursor:pointer;background:linear-gradient(135deg, var(--color-accent), #f7c568);border:none;border-radius:999px;width:100%;margin-top:6px;padding:12px;font-size:15px;font-weight:700;box-shadow:0 10px 24px #f5a62359}.login-submit:disabled{opacity:.7;cursor:default}.login-panel-right{background:radial-gradient(circle at 70% 30%,#eef1fb 0%,#dfe4f6 60%,#d3daf2 100%);flex:1;justify-content:center;align-items:center;padding:20px;display:flex}.login-illustration{width:100%;max-width:420px;height:auto}@media (width<=720px){.login-panel{flex-direction:column}.login-panel-right{display:none}}.section-title{color:var(--color-text);margin:0 0 14px;font-size:15px;font-weight:800}.text-muted{color:var(--color-text-muted)}.mt-20{margin-top:20px}.empty-state{text-align:center;color:var(--color-text-muted);padding:40px 0}.icon-btn{--icon-btn-accent:36, 50, 92;background:rgba(var(--icon-btn-accent), .08);width:36px;height:36px;color:rgb(var(--icon-btn-accent));border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;padding:0;transition:background .15s,box-shadow .15s,transform .1s;display:inline-flex}.icon-btn svg{stroke:currentColor;fill:none;width:16px;height:16px}.icon-btn:hover:not(:disabled){background:rgb(var(--icon-btn-accent));color:#fff;box-shadow:0 4px 12px rgba(var(--icon-btn-accent), .35);transform:translateY(-1px)}.icon-btn:active:not(:disabled){transform:translateY(0)}.icon-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.icon-btn-sm{border-radius:9px;width:32px;height:32px}.icon-btn-sm svg{width:14px;height:14px}.icon-btn-danger{--icon-btn-accent:224, 87, 78}.icon-btn-success{--icon-btn-accent:31, 169, 113}.icon-btn-muted{--icon-btn-accent:123, 131, 153}.icon-btn-group{align-items:center;gap:8px;display:inline-flex}.dash-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.dash-header h1{margin:0 0 4px;font-size:22px;font-weight:800}.dash-header .subtitle{color:var(--color-text-muted);margin:0;font-size:13px}.dash-datetime{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);white-space:nowrap;box-shadow:var(--shadow-card);align-items:center;gap:10px;padding:9px 16px;font-size:13px;font-weight:700;display:flex}.dash-datetime svg{width:15px;height:15px;stroke:var(--color-accent);fill:none;flex-shrink:0}.dash-datetime .sep{color:var(--color-border);font-weight:400}.dash-filters{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);flex-wrap:wrap;align-items:flex-end;gap:20px;margin-bottom:18px;padding:16px 20px;display:flex}.dash-filters .filter-field{min-width:160px}.dash-filters .filter-field label{align-items:center;gap:6px;margin-bottom:6px;display:flex}.dash-filters .filter-field label svg{width:13px;height:13px;stroke:var(--color-text-muted);fill:none}.dash-filters select{min-width:160px}.kpi-grid{grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:20px;display:grid}@media (width<=1100px){.kpi-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}}.kpi-card{border-radius:var(--radius-lg);border:1px solid var(--color-border);box-shadow:var(--shadow-card);padding:18px 18px 16px;position:relative;overflow:hidden}.kpi-card:before{content:"";background:var(--kpi-accent,var(--color-primary));height:4px;position:absolute;top:0;left:0;right:0}.kpi-icon{background:var(--kpi-icon-bg,#24325c1f);border-radius:11px;justify-content:center;align-items:center;width:40px;height:40px;margin-bottom:12px;display:flex}.kpi-icon svg{width:19px;height:19px;stroke:var(--kpi-accent,var(--color-primary));fill:none}.kpi-value{color:var(--kpi-accent,var(--color-text));font-size:28px;font-weight:800;line-height:1.1}.kpi-label{color:var(--color-text);margin-top:2px;font-size:13px;font-weight:600}.kpi-trend{color:var(--kpi-accent,var(--color-text-muted));align-items:center;gap:4px;margin-top:8px;font-size:12px;font-weight:600;display:flex}.kpi-trend svg{stroke:currentColor;fill:none;width:11px;height:11px}.kpi-bar-track{background:#0000000f;border-radius:999px;height:5px;margin-top:10px;overflow:hidden}.kpi-bar-fill{background:var(--kpi-accent,var(--color-primary));border-radius:999px;height:100%}.kpi-blue{--kpi-accent:#2f5fdd;--kpi-icon-bg:#2f5fdd21;background:linear-gradient(160deg,#eef2ff 0%,#fff 65%)}.kpi-green{--kpi-accent:#1fa971;--kpi-icon-bg:#1fa97124;background:linear-gradient(160deg,#e9f9f2 0%,#fff 65%)}.kpi-red{--kpi-accent:#e0574e;--kpi-icon-bg:#e0574e21;background:linear-gradient(160deg,#fdecea 0%,#fff 65%)}.kpi-amber{--kpi-accent:#d9a441;--kpi-icon-bg:#d9a44126;background:linear-gradient(160deg,#fef4e0 0%,#fff 65%)}.kpi-purple{--kpi-accent:#7c4dff;--kpi-icon-bg:#7c4dff24;background:linear-gradient(160deg,#f2eeff 0%,#fff 65%)}