:root{--brand:#4F46E5;--brand-hover:#4338CA;--brand-light:#EEF2FF;--success:#065F46;--success-bg:#D1FAE5;--danger:#991B1B;--danger-bg:#FEE2E2;--warning:#92400E;--warning-bg:#FEF3C7;--neutral:#6B7280;--neutral-bg:#F3F4F6;--border:#E5E7EB;--text:#111827;--text-sub:#6B7280;--radius:10px;--radius-sm:7px;--shadow-card:0 1px 4px rgba(0,0,0,0.06);--shadow-modal:0 20px 60px rgba(0,0,0,0.2)}*,:after,:before{box-sizing:border-box}html{-webkit-tap-highlight-color:transparent}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--text);background:#F9FAFB;margin:0}.shell{display:flex;height:100vh;overflow:hidden}.sidebar{width:240px;min-width:240px;background:#fff;border-right:1px solid var(--border);flex-direction:column}.main-content,.sidebar{display:flex;overflow:hidden}.main-content{flex:1 1;flex-direction:column;min-width:0}.topbar{background:#fff;border-bottom:1px solid var(--border);padding:14px 24px;display:flex;align-items:center;gap:12px;flex-shrink:0}.topbar-title{font-size:18px;font-weight:800;color:var(--text);margin:0}.topbar-sub{font-size:13px;color:var(--text-sub);margin-top:2px}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}.page-content{flex:1 1;overflow-y:auto;padding:24px;-webkit-overflow-scrolling:touch}.sidebar-logo{display:flex;align-items:center;gap:10px;padding:18px 16px 12px}.sidebar-logo-icon{width:36px;height:36px;background:var(--brand);border-radius:9px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:16px;flex-shrink:0}.sidebar-logo-text{font-size:15px;font-weight:800;color:var(--text)}.sidebar-logo-sub{font-size:11px;color:var(--text-sub);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}.sidebar-section-label{font-size:10px;font-weight:700;color:#9CA3AF;text-transform:uppercase;letter-spacing:.08em;padding:10px 16px 4px}.sidebar-nav{display:flex;flex-direction:column;gap:1px;padding:0 8px}.sidebar-link{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;font-size:13.5px;color:var(--text-sub);text-decoration:none;font-weight:500;transition:background .12s,color .12s;white-space:nowrap;overflow:hidden}.sidebar-link.active,.sidebar-link:hover{background:var(--brand-light);color:var(--brand)}.sidebar-link.active{font-weight:700}.sidebar-link-icon{font-size:15px;width:20px;text-align:center;flex-shrink:0}.sidebar-footer{padding:12px;border-top:1px solid var(--border)}.sidebar-user{gap:10px;margin-bottom:8px}.sidebar-avatar,.sidebar-user{display:flex;align-items:center}.sidebar-avatar{width:34px;height:34px;border-radius:50%;background:var(--brand-light);color:var(--brand);font-weight:800;font-size:14px;justify-content:center;flex-shrink:0}.sidebar-user-name{font-size:13px;font-weight:700;color:var(--text)}.sidebar-user-role{font-size:11px;color:var(--text-sub)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:var(--radius-sm);font-family:inherit;font-weight:600;cursor:pointer;transition:opacity .12s,background .12s;text-decoration:none;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--brand);color:#fff;padding:10px 18px;font-size:14px}.btn-primary:hover:not(:disabled){background:var(--brand-hover)}.btn-ghost{background:#fff;color:var(--text);border:1px solid var(--border);padding:9px 16px;font-size:14px}.btn-ghost:hover:not(:disabled){background:var(--neutral-bg)}.btn-danger{background:var(--danger-bg);color:var(--danger);border:1px solid #fecaca;padding:9px 16px;font-size:14px}.btn-danger:hover:not(:disabled){background:#FEE2E2}.btn-sm{padding:6px 12px;font-size:12px}.btn-xs{padding:4px 8px;font-size:11px;border-radius:5px}.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:700}.badge-indigo{background:#E0E7FF;color:#3730A3}.badge-green{background:var(--success-bg);color:var(--success)}.badge-red{background:var(--danger-bg);color:var(--danger)}.badge-yellow{background:var(--warning-bg);color:var(--warning)}.badge-gray{background:var(--neutral-bg);color:var(--neutral)}.badge-blue{background:#DBEAFE;color:#1E40AF}.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-card)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.card-title{font-size:15px;font-weight:700;color:var(--text)}.table-wrapper{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-card);overflow-x:auto}.table{width:100%;border-collapse:collapse;min-width:480px}.table th{padding:11px 16px;text-align:left;font-size:11px;font-weight:700;color:#9CA3AF;text-transform:uppercase;letter-spacing:.06em;background:#FAFAFA;border-bottom:1px solid var(--border);white-space:nowrap}.table td{padding:13px 16px;border-bottom:1px solid #f3f4f6;font-size:13.5px;color:var(--text);vertical-align:middle}.table tbody tr:last-child td{border-bottom:none}.table tbody tr:hover td{background:#FAFAFA}.topbar-badge{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text-sub);padding:5px 10px;background:var(--neutral-bg);border-radius:20px;font-weight:600}.topbar-badge-dot{width:7px;height:7px;border-radius:50%;background:#22C55E;flex-shrink:0}.empty-state{text-align:center;padding:48px 24px}.empty-state-icon{font-size:40px;margin-bottom:12px}.empty-state-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:6px}.empty-state-sub{font-size:13px;color:var(--text-sub)}input[type=date],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],select,textarea{font-family:inherit;font-size:14px;color:var(--text);background:#F9FAFB;border:1px solid #d1d5db;border-radius:8px;outline:none;transition:border-color .15s,box-shadow .15s}input:focus,select:focus,textarea:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px rgba(79,70,229,.1)}input::placeholder{color:#9CA3AF}.spinner{display:inline-block;width:18px;height:18px;border:2px solid rgba(79,70,229,.2);border-top:2px solid var(--brand);border-radius:50%;animation:spin .65s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.loading-center{justify-content:center;padding:48px;gap:10px;color:var(--text-sub)}.loading-center,.toast{display:flex;align-items:center;font-size:14px}.toast{position:fixed;top:20px;right:20px;z-index:9999;padding:12px 18px;border-radius:10px;font-weight:600;color:#fff;box-shadow:0 4px 20px rgba(0,0,0,.2);gap:8px;animation:slideIn .2s ease}.toast-success{background:#15803D}.toast-error{background:#B91C1C}.toast-warn{background:#92400E}@keyframes slideIn{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}.alert{padding:12px 14px;border-radius:8px;font-size:13px;margin-bottom:14px}.alert-error{background:var(--danger-bg);border:1px solid #fecaca;color:var(--danger)}.alert-success{background:var(--success-bg);border:1px solid #86efac;color:var(--success)}.alert-warn{background:var(--warning-bg);border:1px solid #fcd34d;color:var(--warning)}.alert-info{background:#DBEAFE;border:1px solid #bfdbfe;color:#1E40AF}@media (max-width:768px){.page-content{padding:16px 16px 32px}.topbar{padding:12px 16px}.topbar-title{font-size:16px}.table td,.table th{padding:10px 12px}.btn-ghost,.btn-primary{padding:9px 14px;font-size:13px}.page-content{padding-bottom:env(safe-area-inset-bottom,24px)}.shell{overflow-y:auto}}.back-btn{display:inline-flex;align-items:center;gap:6px;color:var(--text-sub);font-size:13px;font-weight:600;cursor:pointer;background:none;border:none;font-family:inherit;padding:6px 0;margin-bottom:12px}.back-btn:hover{color:var(--brand)}.back-btn:before{content:"←";font-size:15px}.breadcrumb{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-sub);margin-bottom:6px;flex-wrap:wrap}.breadcrumb a{color:var(--text-sub);text-decoration:none}.breadcrumb a:hover{color:var(--brand);text-decoration:underline}.breadcrumb-sep{color:#D1D5DB}.breadcrumb-current{color:var(--text);font-weight:600}@media print{.btn,.hamburger-btn,.sidebar,.topbar{display:none!important}.main-content{margin:0}.page-content{padding:0;overflow:visible}}