:root { --ink:#17212b; --muted:#64748b; --line:#dce3ea; --paper:#f6f8fb; --brand:#0b6e99; --accent:#e9f6fb; --warn:#865b00; --danger:#a51d2d; }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--paper); font:15px/1.45 Inter, ui-sans-serif, system-ui, sans-serif; }
a { color:inherit; text-decoration:none; }.topbar { height:64px; display:flex; align-items:center; gap:28px; padding:0 4vw; background:#fff; border-bottom:1px solid var(--line); }.brand { font-size:20px; color:var(--brand); }.topbar nav { display:flex; gap:4px; flex:1; }.topbar nav a { padding:9px 11px; color:var(--muted); border-radius:6px; }.topbar nav a.active,.topbar nav a:hover { color:var(--brand); background:var(--accent); }.link-button { border:0; background:none; color:var(--muted); cursor:pointer; }
.page-shell { width:min(1440px, 92vw); margin:40px auto; }.heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:24px; }.heading h1 { margin:0 0 5px; font-size:32px; letter-spacing:-.7px; }.heading p { margin:0; color:var(--muted); }.eyebrow { margin:0 0 6px !important; color:var(--brand) !important; font-weight:700; font-size:11px; letter-spacing:1.2px; }.metrics { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:14px; margin-bottom:22px; }.metric,.panel,.notice,.login-card { background:#fff; border:1px solid var(--line); border-radius:10px; }.metric { padding:18px; }.metric span { color:var(--muted); display:block; font-size:13px; }.metric strong { display:block; margin-top:8px; font-size:27px; }.panel { padding:22px; overflow:auto; }.panel h2 { margin-top:0; }.notice { padding:14px 17px; margin-bottom:20px; }.warning { background:#fff8e7; border-color:#f2cf7b; color:var(--warn); }.error { background:#ffeff0; border-color:#e9a8ad; color:var(--danger); } table { width:100%; border-collapse:collapse; } th { text-align:left; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.5px; } th,td { padding:11px 9px; border-bottom:1px solid var(--line); vertical-align:top; }.login-shell { min-height:100vh; display:grid; place-items:center; padding:24px; }.login-card { width:min(430px,100%); padding:34px; }.login-card h1 { margin:0 0 6px; }.login-card > p { color:var(--muted); }.stack { display:grid; gap:15px; margin-top:25px; }.stack label { display:grid; gap:6px; font-weight:600; }.stack input { border:1px solid #bdc8d3; border-radius:6px; padding:10px 12px; font:inherit; }.stack button { background:var(--brand); color:#fff; border:0; border-radius:6px; padding:11px 14px; font:inherit; cursor:pointer; } code { font-size:.9em; } @media (max-width:900px) { .metrics { grid-template-columns:repeat(2,1fr); }.topbar { height:auto; flex-wrap:wrap; padding:14px 4vw; }.topbar nav { order:3; width:100%; overflow:auto; } } @media (max-width:520px) { .metrics { grid-template-columns:1fr; } }
.success { background:#ecfbf3; border-color:#9bd8b5; color:#17613b; }
.editor-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.editor-grid label { display:grid; gap:6px; font-weight:600; }
.editor-grid input,.editor-grid select,.editor-grid textarea,.inline-form input,.inline-form select,.review-form input { border:1px solid #bdc8d3; border-radius:6px; padding:10px 12px; font:inherit; width:100%; }
.wide { grid-column:1 / -1; }.check { display:flex !important; align-items:center; gap:8px; }.check input { width:auto; }
.inline-form { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }.inline-form input { flex:1 1 220px; }.inline-form select { width:auto; }
.review-form { display:grid; gap:7px; min-width:190px; }.review-form > div { display:flex; gap:5px; flex-wrap:wrap; }.review-card { padding:14px 0; border-bottom:1px solid var(--line); max-width:620px; }.review-card:last-child { border-bottom:0; }
button.secondary { background:#687786; }.alias-list { padding-left:18px; }.alias-list span,small { color:var(--muted); }.back-link { color:var(--brand); }
.icon-button { display:inline-grid; place-items:center; width:32px; height:32px; color:var(--brand); border:1px solid var(--line); border-radius:6px; font-size:17px; }.icon-button:hover { background:var(--accent); }.danger-panel { border-color:#e9a8ad; }
@media (max-width:900px) { .editor-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:520px) { .editor-grid { grid-template-columns:1fr; } }