:root { --ink:#0b0d0f; --panel:#121519; --panel-2:#181c21; --text:#eef0eb; --muted:#8d949b; --line:#2b3037; --signal:#c3262f; --green:#54ba83; --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace; }
* { box-sizing:border-box; }
html { color-scheme:dark; }
body { margin:0; background:var(--ink); color:var(--text); font:16px/1.5 var(--sans); }
a { color:inherit; }
button,input { font:inherit; }
.login-page { min-height:100vh; display:grid; place-items:center; background:radial-gradient(circle at 70% 20%,#20252b 0,transparent 45%),var(--ink); }
.login-shell { width:min(480px,calc(100% - 32px)); }
.login-card { padding:48px; border:1px solid var(--line); background:rgba(18,21,25,.94); box-shadow:0 30px 100px rgba(0,0,0,.45); }
.system-mark,.page-heading p { margin:0 0 16px; color:var(--signal); font:12px/1.4 var(--mono); letter-spacing:.16em; text-transform:uppercase; }
.login-card h1 { margin:0 0 40px; font-size:34px; font-weight:500; letter-spacing:-.035em; }
.login-card label,.search label { display:block; margin:22px 0 8px; color:var(--muted); font-size:14px; }
.login-card input,.search input { width:100%; min-height:48px; padding:10px 12px; border:1px solid var(--line); border-radius:3px; background:#0d0f12; color:var(--text); }
.login-card input:focus,.search input:focus { outline:2px solid rgba(195,38,47,.4); border-color:var(--signal); }
.login-card button,.search button { min-height:48px; margin-top:28px; padding:0 22px; border:1px solid var(--signal); border-radius:3px; background:var(--signal); color:white; cursor:pointer; font-weight:650; }
.alert { margin:0 0 24px; padding:14px 16px; border-left:3px solid var(--signal); background:rgba(195,38,47,.12); }
.notice { margin:0 0 24px; padding:14px 16px; border-left:3px solid var(--green); background:rgba(84,186,131,.1); }
.topbar { height:68px; padding:0 28px; display:flex; align-items:center; gap:24px; border-bottom:1px solid var(--line); background:#0e1114; }
.brand { margin-right:auto; color:var(--text); text-decoration:none; font:700 15px var(--mono); letter-spacing:.12em; }
.brand span { color:var(--signal); }
.identity { color:var(--muted); font-size:14px; }
.topbar form { margin:0; }
.text-button { border:0; background:none; color:var(--text); cursor:pointer; font-size:14px; }
.app-shell { min-height:calc(100vh - 68px); display:grid; grid-template-columns:220px minmax(0,1fr); }
.sidebar { padding:32px 18px; border-right:1px solid var(--line); background:#0e1114; }
.sidebar a { display:block; margin-bottom:5px; padding:12px 14px; border-radius:3px; color:var(--muted); text-decoration:none; font-size:15px; }
.sidebar a:hover,.sidebar a.active { background:var(--panel-2); color:var(--text); }
.sidebar a.active { box-shadow:inset 3px 0 var(--signal); }
.nav-divider { height:1px; margin:22px 14px; background:var(--line); }
.workspace { min-width:0; padding:54px clamp(24px,5vw,78px) 80px; }
.page-heading { margin-bottom:38px; }
.page-heading h1 { margin:0; font-size:clamp(38px,5vw,64px); font-weight:450; line-height:1; letter-spacing:-.045em; }
.heading-row { display:flex; align-items:flex-start; justify-content:space-between; gap:30px; }
.primary-action,.secondary-action { min-height:44px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--signal); border-radius:3px; background:var(--signal); color:white; cursor:pointer; font:650 14px var(--sans); text-decoration:none; white-space:nowrap; }
.secondary-action { border-color:var(--line); background:transparent; color:var(--text); }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.metric-grid a { min-height:170px; padding:24px; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--line); background:var(--panel); text-decoration:none; }
.metric-grid span { color:var(--muted); font-size:14px; }
.metric-grid strong { font:400 clamp(42px,5vw,72px)/1 var(--mono); }
.search { max-width:700px; margin:0 0 30px; }
.search label { margin-top:0; }
.search div { display:grid; grid-template-columns:1fr auto; gap:10px; }
.search button { margin:0; }
.table-wrap { overflow:auto; border:1px solid var(--line); }
table { width:100%; border-collapse:collapse; background:var(--panel); }
th,td { padding:15px 18px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
th { color:var(--muted); background:#0e1114; font:12px var(--mono); letter-spacing:.08em; text-transform:uppercase; }
td { font-size:14px; }
td strong { display:block; font-weight:600; }
td small { display:block; color:var(--muted); font:12px var(--mono); }
.record-link { color:inherit; text-decoration:none; }
.record-link:hover strong { color:#f18e94; }
.flag,.status-pill { display:inline-block; padding:4px 8px; border:1px solid rgba(195,38,47,.45); border-radius:99px; color:#f18e94; font-size:12px; }
.quiet { color:var(--green); font-size:13px; }
.muted { color:var(--muted); }
.editor { max-width:960px; padding:30px; border:1px solid var(--line); background:var(--panel); }
.editor.narrow { max-width:700px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.span-2 { grid-column:1/-1; }
.editor label,.inline-editor label { display:block; color:var(--muted); font-size:14px; }
.editor label small { display:block; margin-top:4px; color:#717880; font-weight:400; }
.editor input:not([type=checkbox]),.editor select,.editor textarea,.inline-editor input { width:100%; min-height:46px; margin-top:8px; padding:10px 12px; border:1px solid var(--line); border-radius:3px; background:#0d0f12; color:var(--text); font:16px var(--sans); }
.editor textarea { min-height:130px; resize:vertical; }
.editor input:focus,.editor select:focus,.editor textarea:focus,.inline-editor input:focus { outline:2px solid rgba(195,38,47,.35); border-color:var(--signal); }
.editor > label { margin-top:24px; }
.editor fieldset { margin:28px 0 0; padding:20px; border:1px solid var(--line); }
.editor legend { padding:0 8px; color:var(--muted); font-size:14px; }
.check-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.check-grid label { color:var(--text); }
.check-grid input { margin-right:8px; accent-color:var(--signal); }
.form-actions { margin-top:30px; display:flex; justify-content:flex-end; }
.subsection { max-width:960px; margin-top:54px; }
.subsection-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.subsection-heading h2 { margin:0; font-size:28px; font-weight:500; }
.subsection-heading span { color:var(--muted); font-size:14px; }
.inline-editor { margin-top:20px; padding:22px; display:grid; grid-template-columns:minmax(220px,1fr) 140px auto; gap:18px; align-items:end; border:1px solid var(--line); background:var(--panel); }
.inline-editor .primary-action { width:100%; }
.danger-link { border:0; background:transparent; color:#f18e94; cursor:pointer; font:14px var(--sans); }
.empty-state { padding:28px; border:1px solid var(--line); color:var(--muted); background:var(--panel); }
.context { max-width:420px; color:var(--muted); font-family:var(--mono); font-size:12px; overflow-wrap:anywhere; }
.page-note { max-width:760px; margin:-18px 0 30px; color:var(--muted); }
.pagination { margin-top:20px; display:flex; align-items:center; justify-content:space-between; gap:18px; color:var(--muted); font-size:14px; }
.pagination div { display:flex; gap:10px; }
@media (max-width:850px) { .metric-grid { grid-template-columns:repeat(2,1fr); } .app-shell { grid-template-columns:1fr; } .sidebar { padding:10px 18px; display:flex; overflow:auto; border-right:0; border-bottom:1px solid var(--line); } .sidebar a { margin:0 4px 0 0; white-space:nowrap; } }
@media (max-width:700px) { .heading-row { display:block; } .heading-row .primary-action,.heading-row .secondary-action { margin:-16px 0 28px; } .form-grid,.check-grid { grid-template-columns:1fr; } .span-2 { grid-column:auto; } .editor { padding:22px 18px; } .inline-editor { grid-template-columns:1fr; } }
@media (max-width:520px) { .login-card { padding:32px 24px; } .identity { display:none; } .workspace { padding:38px 16px 60px; } .metric-grid { grid-template-columns:1fr 1fr; gap:10px; } .metric-grid a { min-height:135px; padding:18px; } th,td { padding:13px 14px; } }
