#app,body,html{margin:0;height:100%;font-family:system-ui,sans-serif;background:#f6f7f9;color:#0f172a}.app{display:flex;height:100%;position:relative}.sidebar{width:240px;background:#2a5c8d;background:linear-gradient(180deg,#2a5c8d,#35363d 50%);color:#fff;padding:20px;display:flex;flex-direction:column;transition:transform .3s ease}.title{font-size:18px;font-weight:700}.subtitle{color:#cbd5e1;font-size:12px;margin:8px 0 12px}.nav{display:flex;flex-direction:column;gap:10px}.btn-link{padding:10px 14px;border-radius:8px;background:#1f2937;color:#e5e7eb;text-decoration:none;text-align:center}.btn-link:hover{background:#374151}.footer{margin-top:auto;font-size:12px;color:#94a3b8}.overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:5}.main{flex:1;padding:28px;overflow:auto}.topbar{display:none;align-items:center;justify-content:space-between;margin-bottom:16px}.menu-btn{padding:6px 12px;border-radius:6px;cursor:pointer;color:#fff;background-color:transparent}.top-title{font-size:18px;font-weight:600}.card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 4px 12px rgba(15,23,42,.06);max-height:100%}.card-header{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid #e2e8f0;color:#fff;background:#2a5c8d;background:linear-gradient(90deg,#2a5c8d,#35363d 50%)}.card-title{font-size:16px;font-weight:600}.card-tools{display:flex;gap:10px;align-items:center}.btn{padding:6px 14px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;cursor:pointer}.btn:hover{border-color:#cbd5e1}.status{font-size:12px;color:#64748b}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;font-size:14px}.data-table td,.data-table th{padding:10px 14px;border:1px solid #e2e8f0}.data-table th{background:#2a5c8d;font-weight:600;text-align:left;color:#fff}.data-table tr:hover{background:#fafafa}.empty{padding:20px;text-align:center;color:#64748b}.loader{width:14px;height:14px;border-radius:50%;border:2px solid #e5e7eb;border-top-color:#2563eb;animation:spin 1s linear infinite;display:inline-block;vertical-align:middle}@keyframes spin{to{transform:rotate(1turn)}}.note{margin-top:12px;font-size:12px;color:#64748b}@media (max-width:720px){.sidebar{position:fixed;top:0;left:0;bottom:0;z-index:10;transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}.topbar{display:flex}.filter-input{padding:6px 10px;border:1px solid #e2e8f0;border-radius:6px;font-size:14px}.filter-input:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 1px #2563eb}}