:root{--color-primary: #0b3d66;--color-primary-dark: #082a47;--color-accent: #0f7c6c;--color-bg: #f4f6f8;--color-surface: #ffffff;--color-border: #dde3e8;--color-text: #1c2530;--color-text-muted: #5b6b7a;--color-danger: #b3261e;--color-danger-bg: #fdecea;--color-success: #1e7d4b;--color-success-bg: #e9f7ef;--radius: 8px;--shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);--shadow-md: 0 4px 12px rgba(16, 24, 40, .08);--header-height: 64px;--sidebar-width: 240px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Segoe UI,system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased}a{color:var(--color-primary)}button{font-family:inherit}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--radius);border:1px solid transparent;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .15s ease,border-color .15s ease}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-dark)}.btn-primary:disabled{background:#93a3b0;cursor:not-allowed}.btn-secondary{background:#fff;color:var(--color-primary);border-color:var(--color-border)}.btn-secondary:hover{background:#f0f4f7}.btn-danger{background:#fff;color:var(--color-danger);border-color:#f0c7c4}.btn-danger:hover{background:var(--color-danger-bg)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:24px}.page{padding:24px;max-width:1100px;margin:0 auto}.page-title{font-size:22px;font-weight:700;margin:0 0 4px}.page-subtitle{color:var(--color-text-muted);margin:0 0 24px;font-size:14px}.badge{display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600}.badge-active{background:var(--color-success-bg);color:var(--color-success)}.badge-disabled{background:var(--color-danger-bg);color:var(--color-danger)}.badge-pending{background:#fff4e0;color:#9a6300}.badge-neutral{background:#eef1f4;color:var(--color-text-muted)}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--color-border)}th{color:var(--color-text-muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}input[type=text],input[type=search],input[type=email]{width:100%;padding:10px 12px;border:1px solid var(--color-border);border-radius:var(--radius);font-size:14px}.form-field{margin-bottom:16px}.form-field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--color-text-muted)}.error-banner{background:var(--color-danger-bg);color:var(--color-danger);border:1px solid #f0c7c4;border-radius:var(--radius);padding:12px 16px;font-size:14px;margin-bottom:16px}.center-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.auth-card{width:100%;max-width:420px;text-align:center}.auth-card .brand{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:8px}.auth-card h1{font-size:20px;margin:0 0 24px}.app-shell{display:flex;min-height:100vh}.app-header{position:sticky;top:0;z-index:20;height:var(--header-height);background:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 20px}.app-header .title{font-weight:700;font-size:16px}.app-header .user-info{display:flex;align-items:center;gap:16px;font-size:13px}.app-sidebar{width:var(--sidebar-width);flex-shrink:0;background:var(--color-surface);border-right:1px solid var(--color-border);padding:16px 12px}.app-sidebar nav a{display:block;padding:10px 14px;border-radius:var(--radius);color:var(--color-text);text-decoration:none;font-size:14px;font-weight:500;margin-bottom:4px}.app-sidebar nav a.active,.app-sidebar nav a:hover{background:#eef4f8;color:var(--color-primary)}.app-main{flex:1;min-width:0}.hamburger-btn{display:none;background:transparent;border:none;color:#fff;font-size:22px;cursor:pointer}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.stat-card{padding:20px}.stat-card .value{font-size:28px;font-weight:700;color:var(--color-primary)}.stat-card .label{color:var(--color-text-muted);font-size:13px;margin-top:4px}@media (max-width: 860px){.app-sidebar{position:fixed;top:var(--header-height);left:0;bottom:0;z-index:30;transform:translate(-100%);transition:transform .2s ease;box-shadow:var(--shadow-md)}.app-sidebar.open{transform:translate(0)}.hamburger-btn{display:inline-block}.app-header .user-info span.text-detail{display:none}}