:root { --navy:#1e3a8a; --primary:#1e40af; --blue:#3b82f6; --blue-soft:#eff6ff; --amber:#d97706; --amber-soft:#fff7ed; --green:#047857; --green-soft:#ecfdf5; --red:#b91c1c; --red-soft:#fef2f2; --ink:#172554; --muted:#64748b; --line:#dbe5f1; --canvas:#f8fafc; --white:#fff; --shadow:0 12px 32px rgba(30,64,175,.09); font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif; color:var(--ink); background:var(--canvas); }
* { box-sizing:border-box; } body { margin:0; min-width:320px; } button,input,select,textarea { font:inherit; } button { cursor:pointer; } button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid rgba(59,130,246,.35); outline-offset:2px; } [hidden] { display:none !important; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:radial-gradient(circle at 8% 10%,#dbeafe 0,transparent 26%),radial-gradient(circle at 93% 90%,#fef3c7 0,transparent 22%),var(--canvas); }.login-card { width:min(440px,100%); padding:42px; border:1px solid #d8e4f4; border-radius:24px; background:rgba(255,255,255,.93); box-shadow:var(--shadow); }.brand-mark { width:48px; height:48px; border-radius:15px; display:grid; place-items:center; color:#fff; background:linear-gradient(135deg,var(--primary),var(--blue)); font-weight:800; font-size:21px; }.brand-mark.small { width:32px; height:32px; border-radius:10px; font-size:15px; }.eyebrow { margin:0 0 7px; color:var(--blue); font-size:12px; font-weight:800; letter-spacing:.1em; }.login-card h1,.topbar h1,.section-heading h2,.panel h2 { margin:0; color:var(--navy); }.login-card h1 { margin-top:18px; font-size:28px; }.muted,.section-heading p,.panel-heading p { color:var(--muted); line-height:1.65; }.stack-form { display:grid; gap:10px; margin-top:28px; }.stack-form label,.dialog label { font-size:14px; font-weight:700; }.stack-form input,.dialog select,.dialog textarea { width:100%; border:1px solid #cbd5e1; border-radius:10px; padding:11px 12px; color:var(--ink); background:#fff; }.button { min-height:40px; padding:0 15px; border:1px solid transparent; border-radius:9px; font-weight:700; transition:.16s ease; }.button.primary { color:#fff; background:var(--primary); }.button.primary:hover { background:#1d4ed8; }.button.secondary { color:var(--primary); border-color:#bfdbfe; background:var(--blue-soft); }.button.ghost { color:var(--muted); border-color:var(--line); background:#fff; }.button.danger { color:var(--red); border-color:#fecaca; background:var(--red-soft); }.button[disabled] { cursor:not-allowed; opacity:.58; }.form-error { color:var(--red); font-size:13px; margin:3px 0; }.login-hint { margin:24px 0 0; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; line-height:1.6; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:256px minmax(0,1fr); }.sidebar { position:sticky; top:0; height:100vh; padding:24px 16px; color:#dbeafe; background:linear-gradient(180deg,#172554,#1e3a8a); }.sidebar-brand { display:flex; align-items:center; gap:10px; padding:0 10px 28px; color:#fff; font-size:19px; font-weight:800; }.nav-list { display:grid; gap:6px; }.nav-item { width:100%; min-height:44px; padding:11px 13px; color:#cbd5e1; text-align:left; border:0; border-radius:10px; background:transparent; font-weight:700; white-space:normal; }.nav-item:hover,.nav-item.active { color:#fff; background:rgba(255,255,255,.14); }.sidebar-note { position:absolute; bottom:24px; left:26px; right:26px; display:grid; gap:7px; padding-top:20px; border-top:1px solid rgba(255,255,255,.18); font-size:12px; line-height:1.55; }.sidebar-note span { color:#bfdbfe; }.content { width:100%; max-width:1720px; padding:32px clamp(28px,4vw,64px) 60px; }.topbar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:25px; border-bottom:1px solid var(--line); }.topbar h1 { font-size:28px; }.topbar-actions { display:flex; align-items:center; gap:12px; flex:0 0 auto; }.status-chip { display:inline-flex; align-items:center; min-height:28px; padding:0 10px; border-radius:999px; font-size:12px; font-weight:800; }.status-chip.ok { color:var(--green); background:var(--green-soft); }.status-chip.warn { color:#b45309; background:#fffbeb; }.status-chip.neutral { color:var(--muted); background:#e2e8f0; }.global-message { margin:18px 0 0; padding:11px 13px; border:1px solid #bfdbfe; border-radius:10px; color:#1e40af; background:var(--blue-soft); font-size:14px; }.global-message.error { border-color:#fecaca; color:var(--red); background:var(--red-soft); }.view { display:none; padding-top:28px; }.view.active { display:block; }.notice { margin-bottom:20px; padding:13px 15px; border:1px solid #bfdbfe; border-radius:12px; color:#1e40af; background:var(--blue-soft); line-height:1.6; }.notice.warn { border-color:#fed7aa; color:#9a3412; background:var(--amber-soft); }.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:22px; }.metric-grid.compact { grid-template-columns:repeat(3,minmax(0,1fr)); }.metric { min-height:126px; padding:20px; border:1px solid #dce6f3; border-radius:14px; background:var(--white); box-shadow:0 4px 12px rgba(15,23,42,.025); }.metric .label { display:block; color:var(--muted); font-size:13px; font-weight:700; }.metric .value { display:block; margin-top:14px; color:var(--navy); font-size:30px; font-weight:800; letter-spacing:-.04em; }.metric .detail { display:block; margin-top:5px; color:var(--muted); font-size:12px; line-height:1.45; }.grid-two { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }.panel { padding:22px; border:1px solid #dce6f3; border-radius:15px; background:var(--white); box-shadow:0 4px 12px rgba(15,23,42,.025); }.panel-heading,.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:17px; }.panel h2 { font-size:18px; }.panel-heading p { margin:5px 0 0; font-size:13px; }.health-list,.action-list { display:grid; gap:12px; }.health-row,.action-row { display:flex; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid #eef2f7; }.health-row:last-child,.action-row:last-child { border-bottom:0; }.health-row span:first-child,.action-row span:first-child { font-weight:700; }.health-row small,.action-row small { color:var(--muted); }.section-heading { margin-bottom:22px; }.section-heading h2 { font-size:25px; }.section-heading p { max-width:820px; margin:7px 0 0; font-size:14px; }.table-wrap { width:100%; overflow-x:auto; }.data-table { width:100%; border-collapse:collapse; min-width:680px; }.data-table th,.data-table td { padding:13px 12px; border-bottom:1px solid #e9eef5; text-align:left; vertical-align:top; font-size:13px; }.data-table th { color:var(--muted); background:#f8fafc; font-weight:800; white-space:nowrap; }.data-table td strong { display:block; color:var(--ink); }.data-table td small { display:block; margin-top:4px; color:var(--muted); line-height:1.45; }.candidate-list { display:flex; flex-wrap:wrap; gap:6px; }.candidate { padding:4px 7px; border-radius:6px; color:#1d4ed8; background:var(--blue-soft); font-size:12px; }.empty { padding:28px 12px; color:var(--muted); text-align:center; }.catalog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }.catalog-card { padding:20px; border:1px solid #dce6f3; border-radius:14px; background:#fff; }.catalog-card h3 { margin:0; color:var(--navy); font-size:16px; }.catalog-card p { margin:9px 0; color:var(--muted); font-size:13px; line-height:1.6; }.catalog-card code { color:#475569; font-size:11px; word-break:break-all; }.tag { display:inline-flex; margin-top:4px; padding:4px 8px; border-radius:999px; font-size:11px; font-weight:800; }.tag.public { color:var(--green); background:var(--green-soft); }.tag.controlled { color:#b45309; background:#fffbeb; }.tag.aggregate { color:#1d4ed8; background:var(--blue-soft); }.check-list,.deny-list { display:grid; gap:13px; padding:0; margin:18px 0 0; list-style:none; }.check-list li,.deny-list li { padding-left:22px; position:relative; line-height:1.55; }.check-list li::before { content:"✓"; position:absolute; left:0; color:var(--green); font-weight:900; }.deny-list li::before { content:"—"; position:absolute; left:0; color:var(--red); font-weight:900; }.dialog { width:min(540px,calc(100vw - 32px)); padding:0; border:0; border-radius:16px; box-shadow:0 24px 60px rgba(15,23,42,.25); }.dialog::backdrop { background:rgba(15,23,42,.45); }.dialog form { display:grid; gap:11px; padding:24px; }.dialog-heading { display:flex; align-items:start; justify-content:space-between; }.dialog h2 { margin:0; color:var(--navy); font-size:21px; }.icon-button { width:32px; height:32px; border:0; border-radius:8px; color:var(--muted); background:#f1f5f9; font-size:22px; line-height:1; }.source-name { margin:0 0 6px; padding:11px; border-radius:9px; color:var(--ink); background:#f8fafc; font-weight:700; }.dialog-actions { display:flex; justify-content:flex-end; gap:9px; padding-top:9px; } code { padding:1px 4px; border-radius:4px; color:#1d4ed8; background:#eff6ff; }
@media (max-width:1100px) { .content { padding:28px 30px 52px; }.metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.catalog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.metric-grid.compact { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:601px) and (max-width:820px) { .app-shell { grid-template-columns:208px minmax(0,1fr); }.sidebar { padding:18px 10px; }.sidebar-brand { padding:0 8px 20px; font-size:17px; }.nav-item { padding:10px 11px; font-size:14px; }.content { padding:24px 20px 48px; }.topbar { align-items:flex-start; }.topbar-actions { flex-wrap:wrap; justify-content:flex-end; }.topbar h1 { font-size:25px; }.panel { padding:18px; } }
@media (min-width:421px) and (max-width:600px) { .app-shell { grid-template-columns:152px minmax(0,1fr); }.sidebar { padding:16px 8px; }.sidebar-brand { padding:0 6px 18px; font-size:15px; }.brand-mark.small { width:28px; height:28px; font-size:13px; }.nav-list { gap:4px; }.nav-item { min-height:40px; padding:9px 10px; font-size:13px; line-height:1.25; }.sidebar-note { display:none; }.content { padding:20px 16px 42px; }.topbar { align-items:flex-start; gap:12px; }.topbar h1 { font-size:24px; }.topbar-actions .status-chip { display:none; }.metric-grid,.metric-grid.compact,.grid-two,.catalog-grid { grid-template-columns:1fr; }.metric { min-height:112px; padding:17px; }.panel { padding:17px; } }
@media (max-width:420px) { .app-shell { display:block; }.sidebar { position:sticky; z-index:5; height:auto; padding:10px 12px; }.sidebar-brand { padding:0 5px 9px; }.nav-list { display:flex; overflow-x:auto; gap:4px; }.nav-item { width:auto; min-height:40px; flex:0 0 auto; padding:8px 9px; font-size:13px; white-space:nowrap; }.sidebar-note { display:none; }.content { padding:20px 16px 40px; }.topbar { align-items:flex-start; }.topbar h1 { font-size:22px; }.topbar-actions .status-chip { display:none; }.grid-two,.metric-grid,.metric-grid.compact,.catalog-grid { grid-template-columns:1fr; }.section-heading { flex-direction:column; }.section-heading .button { width:100%; }.login-card { padding:30px 24px; }.panel { padding:16px; } }
@media (prefers-reduced-motion:reduce) { * { transition:none !important; scroll-behavior:auto !important; } }

.table-actions { display:flex; flex-wrap:wrap; gap:8px; min-width:190px; }.inline-search { display:flex; gap:8px; }.inline-search input { min-width:0; flex:1; }.inline-search .button { flex:0 0 auto; }.data-table select { min-width:106px; }.data-table textarea { min-width:220px; width:100%; margin-bottom:7px; }.data-table .button { white-space:nowrap; }
.account-cell,.account-profile-head { display:flex; align-items:center; gap:10px; }.account-avatar { width:32px; height:32px; flex:0 0 auto; border-radius:50%; object-fit:cover; background:#dbeafe; }.account-avatar.placeholder { display:inline-grid; place-items:center; color:#1d4ed8; font-size:13px; font-weight:800; }.account-avatar.large { width:52px; height:52px; font-size:20px; }.account-dialog-content { display:grid; gap:18px; padding:24px; }.account-profile-head { padding-bottom:16px; border-bottom:1px solid #e5edf6; }.account-profile-head h3,.subheading { margin:0; color:var(--navy); }.account-profile-head p { margin:5px 0 0; color:var(--muted); font-size:13px; }.subheading { font-size:17px; }.profile-stack { display:grid; gap:12px; }.profile-card { padding:16px; border:1px solid #dce6f3; border-radius:12px; background:#f8fbff; }.profile-card h3 { margin:0 0 12px; color:var(--navy); font-size:16px; }.detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0; }.detail-grid div { min-width:0; }.detail-grid dt { color:var(--muted); font-size:12px; }.detail-grid dd { margin:3px 0 0; overflow-wrap:anywhere; color:var(--ink); font-size:13px; line-height:1.45; }.profile-card .muted { margin:14px 0 0; font-size:12px; }
@media (max-width:600px) { .inline-search { flex-direction:column; }.inline-search .button { width:100%; }.table-actions { min-width:230px; } }