:root { --tblr-primary:#206bc4; --panel-nav:#15243a; --panel-muted:#66758a; }
body { background:#f5f7fb; color:#24334b; font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif; }
[hidden] { display:none!important; }
a { text-underline-offset:3px; }
button,a,input,select,textarea { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #60a5fa!important; outline-offset:3px; }
.skip-link { position:fixed; top:-80px; left:20px; z-index:2000; padding:12px; background:white; }
.skip-link:focus { top:10px; }
.sidebar { position:fixed; inset:0 auto 0 0; width:248px; background:var(--panel-nav); color:#c1ccdc; display:flex; flex-direction:column; z-index:100; padding:32px 18px 22px; }
.brand { display:flex; gap:12px; align-items:center; color:white; font-size:21px; font-weight:700; text-decoration:none; padding:0 12px 38px; letter-spacing:-.5px; }
.brand:hover { color:white; text-decoration:none; }
.brand small { display:block; color:#94a6bd; font-size:11px; font-weight:400; letter-spacing:.2px; padding-top:5px; }
.brand-mark { display:grid; place-items:center; width:36px; height:38px; border-radius:9px; background:#347ddb; color:#fff; font-size:28px; font-weight:600; }
.nav-caption { font-size:10px; letter-spacing:1.5px; padding:0 15px 13px; color:#7f94af; font-weight:600; }
.sidebar nav { display:flex; flex-direction:column; gap:5px; }
.nav-item { display:flex; gap:13px; align-items:center; padding:12px 15px; color:#bac8da; border-radius:7px; text-decoration:none; font-size:13px; font-weight:500; }
.nav-item:hover { background:#ffffff0b; color:#fff; text-decoration:none; }
.nav-item.active { background:#2c6dc6; color:white; box-shadow:0 3px 10px #0a152a30; }
.nav-item svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.6; fill:none; flex:none; }
.sidebar-note { margin-top:auto; padding:18px 12px 0; border-top:1px solid #ffffff12; font-size:11px; display:flex; align-items:center; gap:10px; }
.workspace { margin-left:248px; min-height:100vh; display:flex; flex-direction:column; }
.topbar { background:#fff; min-height:76px; border-bottom:1px solid #e5eaf2; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 38px; }
.topbar-location { font-size:12px; color:#77869a; }
.topbar-location>span:first-child { margin:0 10px; color:#c6ced9; }
#breadcrumb { color:#33445e; }
.topbar-account { display:flex; gap:12px; align-items:center; font-size:12px; }
.account-avatar { width:34px; height:34px; display:grid; place-items:center; background:#eaf1fb; border-radius:50%; color:#2e6ab4; font-size:11px; font-weight:700; }
.menu-toggle { display:none; }
.page-content { padding:34px 38px; width:100%; max-width:1600px; margin:0 auto; flex:1; }
.page-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:27px; }
.page-heading h1 { font-size:26px; line-height:1.3; font-weight:650; letter-spacing:-.6px; margin:0 0 7px; }
.page-heading p { color:var(--panel-muted); font-size:13px; margin:0; max-width:760px; }
.page-actions,.row-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.row-actions { justify-content:flex-end; }
.panel-footer { display:flex; justify-content:space-between; gap:20px; padding:18px 38px; color:#8794a6; font-size:11px; border-top:1px solid #e5eaf2; }
.card { border-color:#e4e9f1; border-radius:9px; box-shadow:0 2px 5px #15243a03; }
.card-header { min-height:62px; padding:18px 22px; gap:15px; flex-wrap:wrap; }
.card-title { font-size:14px; font-weight:600; }
.card-body { padding:22px; }
.table { margin-bottom:0; }
.table thead th { background:#f8fafc; color:#7a8799; font-size:10px; text-transform:uppercase; letter-spacing:.7px; padding:13px 22px; font-weight:600; border-color:#e9edf4; }
.table tbody td { padding:17px 22px; vertical-align:middle; border-color:#edf0f5; font-size:13px; }
.table tbody tr:last-child td { border-bottom:0; }
.table .subline { display:block; margin-top:4px; font-size:11px; color:#8490a1; }
.table-responsive { border-radius:0 0 9px 9px; }
.badge { font-size:10px; font-weight:600; letter-spacing:.1px; padding:6px 9px; }
.stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; margin-bottom:26px; }
.stat-card { padding:22px; display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.stat-label { font-size:12px; color:#76849a; margin-bottom:12px; }
.stat-value { font-size:29px; font-weight:650; line-height:1; letter-spacing:-1px; }
.stat-note { font-size:11px; color:#8795a9; margin-top:12px; }
.stat-symbol { background:#edf3fd; color:#3979c7; border-radius:9px; padding:10px; font-size:17px; }
.overview-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr); gap:24px; }
.step-list { list-style:none; margin:0; padding:0; }
.step-list li { display:flex; gap:13px; padding:16px 0; border-bottom:1px solid #edf0f5; }
.step-list li:last-child { border:0; }
.step-number { background:#edf3fd; width:28px; height:28px; flex:none; display:grid; place-items:center; color:#3979c7; font-size:12px; border-radius:50%; }
.step-list strong { display:block; font-size:12px; margin-bottom:5px; }
.step-list p { font-size:12px; color:#8390a2; margin:0; }
.filter-bar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:20px; }
.filter-bar .form-control { max-width:300px; }
.filter-bar .form-select { max-width:240px; }
.empty-state { text-align:center; padding:48px 24px; color:#7c8ca1; }
.empty-state h3 { font-size:15px; color:#455771; margin:0 0 9px; }
.empty-state p { font-size:13px; margin:0 auto; max-width:440px; }
.form-label { font-size:12px; font-weight:600; margin-bottom:8px; }
.form-hint { font-size:12px; }
.form-control,.form-select { min-height:40px; border-color:#dce3ed; border-radius:6px; }
.btn { font-size:12px; border-radius:6px; font-weight:500; min-height:36px; }
.btn-sm { min-height:30px; font-size:11px; }
.form-group { margin-bottom:18px; }
.form-error { color:#b42318; font-size:12px; margin:8px 0; }
.notifications { position:fixed; right:24px; bottom:24px; width:min(420px,calc(100vw - 48px)); z-index:1200; }
.notification { padding:16px 18px; border-radius:8px; box-shadow:0 8px 30px #14243b26; background:#fff; border-left:4px solid #2fb344; display:flex; gap:14px; justify-content:space-between; font-size:13px; }
.notification.error { border-color:#d63939; }.notification.info { border-color:#206bc4; }
.notification.warning { border-color:#f59f00; }
.notification button { border:0; background:transparent; font-size:20px; color:#7c899c; padding:0; }
.action-dialog { width:min(580px,calc(100vw - 32px)); border:0; border-radius:12px; padding:0; box-shadow:0 18px 90px #15243a55; max-height:90vh; }
.action-dialog::backdrop { background:#101e33a1; }
.dialog-header { display:flex; align-items:center; justify-content:space-between; padding:22px 26px; border-bottom:1px solid #e8edf4; }
.dialog-header h2 { font-size:18px; margin:0; }
.dialog-content { padding:24px 26px; }
.dialog-footer { padding:17px 26px; border-top:1px solid #e8edf4; display:flex; justify-content:flex-end; gap:10px; background:#fafbfd; }
.auth-page { min-height:100vh; display:grid; place-items:center; padding:36px 20px; background:radial-gradient(ellipse at 30% 15%,#e6effd,transparent 55%),#f5f7fb; }
.auth-wrap { width:100%; max-width:420px; }
.auth-brand { justify-content:center; color:#233b5b; padding:0 0 30px; }.auth-brand:hover{color:#233b5b;}
.auth-card { padding:32px; }.auth-card h1 { font-size:22px; letter-spacing:-.4px; text-align:center; margin:0 0 9px; }
.auth-caption { color:#7a899d; text-align:center; font-size:13px; margin-bottom:28px; }
.auth-footnote { text-align:center; margin-top:22px; font-size:11px; color:#8291a5; }
.secret-value { display:block; padding:12px; font-family:ui-monospace,monospace; overflow-wrap:anywhere; background:#f1f5fb; border:1px solid #e1e9f4; border-radius:6px; user-select:all; font-size:14px; }
.status-detail { font-size:11px; color:#728199; margin-top:6px; max-width:300px; }
.sensitive-note { color:#7b879b; font-size:12px; }
.error-page { padding:32px; text-align:center; }
.section-stack { display:grid; gap:24px; }
@media (min-width:1600px) { .page-content{padding-top:44px;} }
@media (max-width:1100px) { .sidebar{width:220px;} .workspace{margin-left:220px;} .topbar,.page-content{padding-left:24px;padding-right:24px;} .stat-grid{grid-template-columns:repeat(2,1fr);} .overview-grid{grid-template-columns:1fr;} }
@media (max-width:760px) { .sidebar{transform:translateX(-100%);transition:transform .18s;} body.menu-open .sidebar{transform:none;} .workspace{margin-left:0;} .menu-toggle{display:inline-flex;} .topbar{min-height:64px;padding:12px 18px;} .topbar-location{display:none;} .topbar-account{gap:9px;} .page-content{padding:25px 18px;} .page-heading{flex-direction:column;gap:14px;} .page-heading h1{font-size:23px;} .page-actions{width:100%;} .stat-grid{gap:12px;} .stat-card{padding:17px;} .stat-value{font-size:25px;} .stat-symbol{display:none;} .panel-footer{padding:16px 18px;} .card-body{padding:18px;} .table tbody td,.table thead th{padding-left:16px;padding-right:16px;} .auth-card{padding:26px;} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{transition:none!important;scroll-behavior:auto!important;} }