:root { --bg:#0a0a0a; --panel:#141414; --panel2:#1a1a1a; --line:#292929; --text:#e7e7e7; --muted:#898989; --yellow:#e8c840; --green:#58c878; --red:#ff6b6b; --blue:#6ca4ff; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; }
a { color:var(--yellow); }
.site-header { min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:12px max(24px,calc((100vw - 1240px)/2)); border-bottom:1px solid #202020; background:#0d0d0d; position:sticky; top:0; z-index:10; }
.brand { display:flex; align-items:center; gap:12px; color:#fff; text-decoration:none; }
.brand-mark { width:42px; height:42px; border-radius:9px; display:grid; place-items:center; background:var(--yellow); color:#090909; font-weight:800; letter-spacing:1px; }
.brand strong,.brand small { display:block; }
.brand small { margin-top:2px; color:#777; font-size:11px; text-transform:uppercase; letter-spacing:1px; }
nav { display:flex; align-items:center; gap:18px; }
nav>a:not(.button) { color:#aaa; text-decoration:none; font-size:14px; }
nav>a:hover { color:#fff; }
.user-name { color:#666; font-size:13px; padding-left:12px; border-left:1px solid #333; }
.page-shell { width:min(1240px,calc(100% - 40px)); margin:0 auto; padding:48px 0 72px; }
.page-heading { margin-bottom:28px; }
.page-heading h1 { margin:3px 0 7px; font-size:34px; font-weight:400; letter-spacing:.2px; color:#fff; }
.heading-row { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; }
.eyebrow { margin:0; color:var(--yellow); font-size:12px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; }
.muted { color:var(--muted); margin:0; line-height:1.55; }
.button { display:inline-flex; justify-content:center; align-items:center; border-radius:7px; padding:10px 15px; border:1px solid #3a3a3a; text-decoration:none; font-weight:650; font-size:14px; cursor:pointer; font-family:inherit; white-space:nowrap; }
.button-primary { color:#090909; background:var(--yellow); border-color:var(--yellow); }
.button-primary:hover { background:#f1d24f; }
.button-quiet { color:#bbb; background:#171717; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px; }
.stat { padding:20px; border:1px solid var(--line); border-radius:10px; background:var(--panel); }
.stat span { display:block; color:#888; font-size:12px; text-transform:uppercase; letter-spacing:1px; }
.stat strong { display:block; margin-top:8px; font-size:28px; font-weight:450; color:#fff; }
.panel { border:1px solid var(--line); border-radius:12px; background:var(--panel); overflow:hidden; margin-bottom:22px; }
.compact-panel { padding-bottom:4px; }
.panel-heading { min-height:60px; padding:15px 20px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.panel-heading h2 { margin:0; font-size:17px; color:#fff; }
.panel-heading span,.panel-heading a { font-size:12px; color:#777; }
.table-wrap { overflow:auto; }
table { width:100%; border-collapse:collapse; }
th { padding:12px 16px; color:#777; font-size:11px; text-transform:uppercase; letter-spacing:1px; text-align:left; background:#111; }
td { padding:15px 16px; border-top:1px solid #242424; color:#aaa; font-size:13px; vertical-align:middle; }
tbody tr:hover { background:#171717; }
td:first-child { min-width:310px; width:48%; }
.item-title { display:block; color:#f0f0f0; font-size:14px; font-weight:650; text-decoration:none; margin-bottom:5px; }
td small { display:block; color:#777; line-height:1.4; }
.status-form { margin:0; }
.status { border:1px solid #3a3a3a; background:#202020; color:#ddd; border-radius:999px; padding:6px 10px; font:inherit; font-size:12px; }
.status-ready,.status-verified,.status-done { border-color:#355f42; color:#8dde9f; }
.status-in_progress,.status-review { border-color:#665b30; color:#f1d86a; }
.status-blocked { border-color:#633838; color:#ff8b8b; }
.doc { display:inline-block; border-radius:999px; padding:5px 9px; background:#222; color:#aaa; font-size:11px; }
.doc-current { color:#86db9b; background:#17301e; }
.doc-missing,.doc-stale { color:#ff8f8f; background:#351b1b; }
.doc-draft,.doc-review { color:#e8d173; background:#342f18; }
.activity-list { padding:6px 20px; }
.activity { display:grid; grid-template-columns:12px 1fr auto; gap:12px; align-items:start; padding:14px 0; border-bottom:1px solid #242424; font-size:13px; }
.activity:last-child { border-bottom:0; }
.activity-dot { width:8px; height:8px; border-radius:50%; background:var(--yellow); margin-top:4px; }
.activity strong { color:#ddd; }
.activity p { color:#777; margin:4px 0 0; }
.activity small { color:#5f5f5f; }
.activity time { color:#666; font-size:11px; }
.full-history { padding:10px 24px; }
.login-card { width:min(460px,100%); margin:7vh auto 0; padding:36px; border-radius:14px; background:var(--panel); border:1px solid #2b2b2b; }
.login-card h1 { color:#fff; font-size:30px; font-weight:450; margin:7px 0 10px; }
.login-card .muted { margin-bottom:28px; }
label { display:block; color:#aaa; font-size:13px; font-weight:600; margin-bottom:7px; }
input,textarea,select { width:100%; color:#eee; background:#191919; border:1px solid #383838; border-radius:7px; padding:10px 11px; font:inherit; }
input:focus,textarea:focus,select:focus { outline:none; border-color:var(--yellow); box-shadow:0 0 0 2px rgba(232,200,64,.13); }
.login-card .button { width:100%; margin-top:14px; }
.code-input { text-align:center; font-size:25px; letter-spacing:8px; }
.subtle-link { display:block; text-align:center; margin-top:15px; color:#777; font-size:12px; }
.alert { border-radius:7px; padding:10px 12px; margin:12px 0; font-size:13px; }
.alert-error { color:#ff9696; border:1px solid #633737; background:#281616; }
.form-panel { padding:24px; }
.form-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }
.field-wide { grid-column:1/-1; }
.field input[type=checkbox] { width:auto; }
.field-error { color:var(--red); font-size:12px; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; border-top:1px solid #292929; margin-top:24px; padding-top:20px; }
.health-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.health-card { padding:22px; border:1px solid var(--line); border-radius:12px; background:var(--panel); }
.health-card.health-ok { border-top:3px solid var(--green); }
.health-card.health-bad { border-top:3px solid var(--red); }
.health-title { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.health-title h2 { margin:0; color:#fff; font-size:17px; }
.health-title span { font-size:11px; color:#888; }
.health-card>a { display:block; margin:10px 0 20px; font-size:12px; color:#777; overflow-wrap:anywhere; }
.health-metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.health-metrics div { background:#101010; border-radius:7px; padding:10px; }
.health-metrics small,.health-metrics strong { display:block; }
.health-metrics small { color:#666; font-size:10px; text-transform:uppercase; }
.health-metrics strong { margin-top:5px; font-size:14px; }
.checked-at,.empty { color:#666; font-size:12px; }
.checked-at { margin:15px 0 0; }
@media (max-width:900px) { .stats-grid,.health-grid { grid-template-columns:repeat(2,1fr); } .site-header { position:static; align-items:flex-start; } nav { flex-wrap:wrap; justify-content:flex-end; } }
@media (max-width:640px) { .site-header { padding:12px 16px; } .brand small,.user-name { display:none; } nav { gap:10px; } nav>a:not(.button) { font-size:12px; } .page-shell { width:calc(100% - 24px); padding-top:28px; } .heading-row { align-items:flex-start; flex-direction:column; } .stats-grid,.health-grid,.form-grid { grid-template-columns:1fr; } .field-wide { grid-column:auto; } .activity { grid-template-columns:10px 1fr; } .activity time { grid-column:2; } .login-card { margin-top:1vh; padding:25px; } }
