:root{--color-primary:#ec1f27;--color-primary-dark:#c4131b;--color-primary-tint:#ec1f2714;--color-ink:#0a0a0a;--color-heading:#282f3b;--color-body:#4a4e56;--color-muted:#888;--color-muted-on-dark:#aaafb8;--color-bg:#f0f3f9;--color-bg-off:#fafcff;--color-border:#e4e7ee;--color-white:#fff;--color-success:#0f9d58;--color-warning:#f4a100;--color-danger:#d93025;--color-info:#1a73e8;--font-heading:"League Spartan", sans-serif;--font-body:"Inter", sans-serif;--radius-card:10px;--radius-btn:10px 0 10px 0;--radius-btn-hover:0 10px 0 10px;--radius-input:8px;--shadow-soft:0 3px 16px #0000000d;--shadow-card:0 0 40px #00000017;--sidebar-width:250px;--topbar-height:64px}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:var(--font-body);color:var(--color-body);background:var(--color-bg);-webkit-font-smoothing:antialiased;font-size:14px}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-heading);line-height:1.25}a{color:inherit;text-decoration:none}ul{list-style:none}button{cursor:pointer;font-family:inherit}input,select,textarea{font-family:inherit;font-size:14px}img{max-width:100%}.btn{min-height:40px;font-family:var(--font-heading);border-radius:var(--radius-btn);white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:14px;font-weight:600;transition:all .35s;display:inline-flex}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover:not(:disabled){color:var(--color-primary);border-color:var(--color-primary);border-radius:var(--radius-btn-hover);background:#fff}.btn-outline{color:var(--color-primary);border-color:var(--color-primary);background:0 0}.btn-outline:hover:not(:disabled){background:var(--color-primary);color:#fff;border-radius:var(--radius-btn-hover)}.btn-ghost{color:var(--color-heading);border-color:var(--color-border);background:0 0}.btn-ghost:hover:not(:disabled){border-color:var(--color-primary);color:var(--color-primary)}.btn-danger{background:var(--color-danger);color:#fff}.btn-danger:hover:not(:disabled){background:#b3261e}.btn-sm{min-height:32px;padding:0 12px;font-size:13px}.card{border-radius:var(--radius-card);box-shadow:var(--shadow-soft);background:#fff;padding:20px;transition:box-shadow .25s}.card:hover{box-shadow:0 6px 24px #00000012}.card-title{align-items:center;gap:9px;margin-bottom:16px;font-size:16px;font-weight:700;display:flex}.card-title:before{content:"";background:linear-gradient(180deg, var(--color-primary), var(--color-primary-dark));border-radius:2px;width:4px;height:18px}.field{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.field label{color:var(--color-heading);font-size:13px;font-weight:600}.field .hint{color:var(--color-muted);font-size:12px}.field .error-text{color:var(--color-danger);font-size:12px}.input,.select,.textarea{border:1px solid var(--color-border);border-radius:var(--radius-input);width:100%;min-height:40px;color:var(--color-heading);background:#fff;outline:none;padding:8px 12px;transition:border-color .2s}.textarea{resize:vertical;min-height:96px}.input:focus,.select:focus,.textarea:focus{border-color:var(--color-primary)}.input.has-error,.select.has-error,.textarea.has-error{border-color:var(--color-danger)}.form-grid{grid-template-columns:repeat(2,1fr);gap:0 16px;display:grid}.form-grid .full{grid-column:1/-1}@media (width<=720px){.form-grid{grid-template-columns:1fr}}.table-wrap{overflow-x:auto}table.table{border-collapse:collapse;background:#fff;width:100%}.table th{text-align:left;font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.04em;color:var(--color-muted);border-bottom:2px solid var(--color-border);white-space:nowrap;padding:10px 12px;font-size:12px;font-weight:700}.table td{border-bottom:1px solid var(--color-border);vertical-align:middle;padding:12px}.table tbody tr:hover{background:var(--color-bg-off)}.table .num{text-align:right;font-variant-numeric:tabular-nums}.badge{text-transform:capitalize;white-space:nowrap;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;display:inline-block}.badge.gray{color:var(--color-heading);background:#eef0f4}.badge.blue{color:var(--color-info);background:#1a73e81f}.badge.amber{color:#9a6a00;background:#f4a10024}.badge.green{color:var(--color-success);background:#0f9d581f}.badge.red{color:var(--color-danger);background:#d930251f}.layout{min-height:100vh;display:flex}.sidebar{width:var(--sidebar-width);background:var(--color-ink);color:var(--color-muted-on-dark);z-index:40;flex-direction:column;transition:transform .3s;display:flex;position:fixed;inset:0 auto 0 0}.sidebar .brand{border-bottom:1px solid #ffffff14;align-items:center;gap:10px;padding:16px 20px;display:flex}.sidebar .brand img{background:#fff;border-radius:6px;height:34px;padding:3px}.sidebar .brand span{font-family:var(--font-heading);color:#fff;font-size:16px;font-weight:800}.sidebar nav{flex:1;padding:12px 0;overflow-y:auto}.sidebar .nav-group{text-transform:uppercase;letter-spacing:.08em;color:#6b7280;padding:14px 20px 6px;font-size:11px}.sidebar a.nav-item{color:var(--color-muted-on-dark);border-left:3px solid #0000;align-items:center;gap:10px;padding:10px 20px;font-size:14px;transition:all .25s;display:flex}.sidebar a.nav-item:hover{color:#fff;background:#ffffff0a;padding-left:24px}.sidebar a.nav-item.active{color:#fff;border-left-color:var(--color-primary);background:linear-gradient(90deg,#ec1f2738,#ec1f270a)}.main{margin-left:var(--sidebar-width);flex-direction:column;flex:1;min-width:0;display:flex}.topbar{height:var(--topbar-height);border-bottom:1px solid var(--color-border);z-index:30;background:#fff;justify-content:space-between;align-items:center;padding:0 24px;display:flex;position:sticky;top:0}.topbar .who{align-items:center;gap:12px;display:flex}.topbar .avatar{background:var(--color-primary);color:#fff;width:36px;height:36px;font-weight:700;font-family:var(--font-heading);border-radius:50%;justify-content:center;align-items:center;display:flex}.content{flex:1;padding:24px}.page-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.page-head h1{font-size:24px;font-weight:800}.page-head .sub{color:var(--color-muted);margin-top:4px;font-size:13px}.kpi-grid{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}@media (width<=1100px){.kpi-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.kpi-grid{grid-template-columns:1fr}}.kpi{border-radius:var(--radius-card);box-shadow:var(--shadow-soft);border-left:4px solid var(--color-primary);background:#fff;padding:18px 20px;transition:transform .25s,box-shadow .25s;position:relative;overflow:hidden}.kpi:after{content:"";background:var(--color-primary-tint);border-radius:50%;width:88px;height:88px;position:absolute;top:-34px;right:-34px}.kpi:hover{box-shadow:var(--shadow-card);transform:translateY(-3px)}.kpi .label{text-transform:uppercase;letter-spacing:.05em;color:var(--color-muted);font-size:12px;font-weight:600}.kpi .value{font-family:var(--font-heading);color:var(--color-heading);margin-top:6px;font-size:26px;font-weight:800}.kpi .meta{color:var(--color-muted);margin-top:4px;font-size:12px}.modal-backdrop{z-index:100;background:#0a0a0a8c;justify-content:center;align-items:flex-start;padding:48px 16px;display:flex;position:fixed;inset:0;overflow-y:auto}.modal{border-radius:var(--radius-card);width:100%;max-width:640px;box-shadow:var(--shadow-card);background:#fff}.modal.wide{max-width:900px}.modal-head{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.modal-head h3{font-size:17px;font-weight:700}.modal-body{padding:20px}.modal-foot{border-top:1px solid var(--color-border);justify-content:flex-end;gap:10px;padding:14px 20px;display:flex}.toolbar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.toolbar .input,.toolbar .select{width:auto}.spacer{flex:1}.pagination{justify-content:flex-end;align-items:center;gap:10px;padding-top:14px;font-size:13px;display:flex}.empty{text-align:center;color:var(--color-muted);padding:48px 16px}.empty h4{color:var(--color-heading);margin-bottom:6px;font-size:16px}.spinner{border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:28px;height:28px;margin:40px auto;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toast-wrap{z-index:200;flex-direction:column;gap:10px;display:flex;position:fixed;bottom:20px;right:20px}.toast{background:var(--color-ink);color:#fff;box-shadow:var(--shadow-card);border-radius:8px;max-width:360px;padding:12px 18px;font-size:14px;animation:.25s slideup}.toast.error{background:var(--color-danger)}.toast.success{background:var(--color-success)}@keyframes slideup{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.login-wrap{background:radial-gradient(#ffffff0b 1px, transparent 1px) 0 0 / 26px 26px, radial-gradient(ellipse at 85% 110%, #ec1f2759, transparent 55%), linear-gradient(135deg, var(--color-ink) 0%, #23272f 70%);place-items:center;min-height:100vh;padding:16px;display:grid}.login-card{width:100%;max-width:400px;box-shadow:var(--shadow-card);background:#fff;border-radius:14px;padding:36px 32px}.login-card .logo{height:56px;margin:0 auto 10px;display:block}.login-card h1{text-align:center;margin-bottom:4px;font-size:20px}.login-card .slogan{text-align:center;letter-spacing:.14em;color:var(--color-primary);margin-bottom:24px;font-size:12px;font-weight:700}@media print{.sidebar,.topbar,.toolbar,.no-print,.pagination{display:none!important}.main{margin-left:0}.content{padding:0}body{background:#fff}.card{box-shadow:none;padding:0}}@media (width<=900px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:none}.main{margin-left:0}}.backdrop-mobile{z-index:35;background:#0006;position:fixed;inset:0}