:root{
  --primary:#4F6BED; --on-primary:#fff; --primary-container:#DDE4FF; --on-primary-container:#00164E;
  --surface:#FDFBFF; --on-surface:#1B1B1F; --on-surface-variant:#5C5B63;
  --surface-container:#F2EEF9; --surface-container-high:#ECE7F2;
  --outline:#8E8B96; --outline-variant:#D8D4DE; --error:#BA1A1A; --ok:#146C4E;
  --radius:18px;
}
@media (prefers-color-scheme: dark){
  :root{
    --primary:#9DB2FF; --on-primary:#11194A; --primary-container:#2B3A7A; --on-primary-container:#DDE4FF;
    --surface:#111014; --on-surface:#E6E1E9; --on-surface-variant:#C9C4D0;
    --surface-container:#17161C; --surface-container-high:#1D1B22;
    --outline:#948F9C; --outline-variant:#48454F; --error:#FFB4AB; --ok:#7EE0B8;
  }
}
*{box-sizing:border-box}
body{margin:0;background:var(--surface);color:var(--on-surface);font:14px/1.55 "Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 6px}
.shell{display:flex;min-height:100vh}
.sidebar{width:238px;flex:0 0 238px;background:var(--surface-container);padding:16px 12px;display:flex;flex-direction:column;border-right:1px solid var(--outline-variant)}
.brand{display:flex;gap:10px;align-items:center;padding:4px 8px 16px}
.brand b{font-size:15px}.brand small{display:block;color:var(--on-surface-variant);font-size:11px}
.logo{width:34px;height:34px;border-radius:12px;background:var(--primary-container);color:var(--on-primary-container);display:grid;place-items:center;font-weight:700}
.logo.lg{width:44px;height:44px;font-size:20px;border-radius:14px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav-group{margin:12px 8px 6px;color:var(--on-surface-variant);font-size:11px;letter-spacing:.6px;text-transform:uppercase}
.nav-item{padding:8px 12px;border-radius:999px;color:var(--on-surface)}
.nav-item:hover{background:var(--surface-container-high);text-decoration:none}
.nav-item.active{background:var(--primary-container);color:var(--on-primary-container);font-weight:600}
.sidebar-foot{margin-top:auto;border-top:1px solid var(--outline-variant);padding-top:10px;font-size:12px;color:var(--on-surface-variant)}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:60px;display:flex;align-items:center;padding:0 24px;border-bottom:1px solid var(--outline-variant)}
.topbar h1{font-size:18px}
.content{padding:22px 24px 40px}
.card{background:var(--surface-container);border-radius:var(--radius);padding:18px;box-shadow:0 4px 18px rgba(20,20,30,.06)}
.card+.card{margin-top:14px}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.kpi .label{color:var(--on-surface-variant);font-size:12px}
.kpi .value{font-size:26px;font-weight:700;margin-top:4px}
.row{display:flex;align-items:center;gap:10px}
.row.between{justify-content:space-between}
.pill{font-size:12px;padding:2px 10px;border-radius:999px;background:var(--surface-container-high);color:var(--on-surface-variant)}
.pill.ok{color:var(--ok);background:color-mix(in oklab,var(--ok) 14%,transparent)}
.pill.warn{color:#8A5300;background:color-mix(in oklab,#FFB300 22%,transparent)}
.table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}
.table th{text-align:left;padding:9px 8px;color:var(--on-surface-variant);font-weight:500;font-size:11.5px;border-bottom:1px solid var(--outline-variant)}
.table td{padding:10px 8px;border-bottom:1px solid color-mix(in oklab,var(--outline-variant) 70%,transparent);vertical-align:top}
.table tr:last-child td{border-bottom:none}
.hint{color:var(--on-surface-variant);font-size:12px}
.muted{color:var(--on-surface-variant)}
.field{display:block;margin-bottom:12px}
.field>span{display:block;font-size:12px;color:var(--on-surface-variant);margin-bottom:6px}
input,select,textarea{width:100%;font:inherit;padding:9px 12px;border-radius:12px;border:1px solid var(--outline-variant);background:var(--surface);color:var(--on-surface)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in oklab,var(--primary) 22%,transparent)}
input[type=checkbox],input[type=radio]{width:auto}
button,.btn{font:inherit;cursor:pointer;border:none;border-radius:999px;padding:9px 18px;background:var(--surface-container-high);color:var(--on-surface)}
button:hover,.btn:hover{filter:brightness(.97);text-decoration:none}
button:active{transform:scale(.98)}
.primary{background:var(--primary);color:var(--on-primary);font-weight:600}
.danger{background:transparent;color:var(--error);border:1px solid color-mix(in oklab,var(--error) 35%,transparent)}
.sm{padding:5px 12px;font-size:12px}
.input.sm{padding:5px 10px;font-size:12px}
.w-full{width:100%}
.flash{padding:10px 14px;border-radius:12px;background:color-mix(in oklab,var(--primary) 12%,transparent);margin-bottom:14px}
.flash.err{background:color-mix(in oklab,var(--error) 14%,transparent);color:var(--error)}
.auth-wrap{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary-container),var(--surface) 60%);padding:20px}
.auth-card{width:380px;max-width:100%;background:var(--surface-container);border-radius:24px;padding:24px;box-shadow:0 18px 46px rgba(20,20,30,.16)}
.center{text-align:center}
.kv{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--outline-variant);font-size:13px}
.kv:last-child{border-bottom:none}
.kv span{color:var(--on-surface-variant)}
.code{background:var(--surface);border:1px solid var(--outline-variant);border-radius:12px;padding:12px;font-size:12px;overflow:auto;white-space:pre-wrap}
.empty{padding:24px;text-align:center;color:var(--on-surface-variant)}
.scope-list{margin:10px 0 0;padding-left:18px;line-height:1.9}
.install-body{background:linear-gradient(160deg,var(--primary-container),var(--surface) 55%)}
.install-wrap{max-width:760px;margin:0 auto;padding:36px 20px 60px}
.install-head{display:flex;gap:14px;align-items:center;margin-bottom:18px}
.install-head h1{font-size:22px}
