:root { --ink:#182233; --navy:#16243a; --red:#8b1e2d; --paper:#f4f1eb; --panel:#fff; --line:#d8d2c8; --muted:#5c687a; --green:#2f6f43; --amber:#80520f; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; }
a { color:var(--red); }
.site-header { display:flex; justify-content:space-between; align-items:center; background:var(--navy); border-bottom:5px solid var(--red); padding:1rem clamp(1rem,4vw,3rem); }
.brand { display:grid; grid-template-columns:92px 2px auto; gap:.7rem; align-items:center; color:#fff; font-size:1.15rem; font-weight:800; text-decoration:none; }
.brand img { display:block; width:92px; height:auto; }
.brand__divider { width:2px; height:44px; background:var(--red); }
.brand__name { display:grid; line-height:1.05; }
.brand__name small { margin-bottom:.25rem; color:#cfd7e3; font-size:.6rem; letter-spacing:.08em; text-transform:uppercase; }
main { width:min(1240px,calc(100% - 2rem)); margin:0 auto; padding:2rem 0 4rem; }
.hero,.panel,.login-card { background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:clamp(1.2rem,3vw,2rem); box-shadow:0 8px 24px rgb(22 36 58 / 6%); }
.hero { display:flex; justify-content:space-between; align-items:flex-start; gap:2rem; margin-bottom:1rem; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(2rem,5vw,3.4rem); line-height:1.05; letter-spacing:-.04em; }
.eyebrow { color:var(--red); font-size:.75rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }
.hero-count { display:grid; min-width:140px; text-align:right; }
.hero-count strong { font-size:3rem; line-height:1; }
.two-column { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin:1rem 0; }
.panel { margin-bottom:1rem; }
.project-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:.8rem; }
.project-card { display:block; color:var(--ink); border:1px solid var(--line); border-left:5px solid var(--red); border-radius:12px; padding:1rem; text-decoration:none; }
.project-card:hover { border-color:var(--red); transform:translateY(-1px); }
.project-card h3 { margin:.65rem 0 .3rem; }
.project-card p,.project-card small,small,.empty { color:var(--muted); }
.status { display:inline-block; border-radius:999px; background:#ece7df; padding:.18rem .55rem; font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.status.active,.status.verified { background:#dcecdf; color:var(--green); }
.status.review,.status.reported,.status.planned { background:#faebcd; color:var(--amber); }
.status.blocked,.status.stale { background:#f4d9db; color:var(--red); }
.task,.section-heading { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; align-items:center; overflow-wrap:anywhere; }
.task { border-top:1px solid var(--line); padding:.75rem 0; }
.task small { display:block; }
.note,.evidence { border-top:1px solid var(--line); padding:.8rem 0; }
.note strong { display:block; }
.stacked p { display:grid; gap:.25rem; }
label { font-weight:700; }
input,textarea,select { width:100%; border:1px solid #77736c; border-radius:8px; padding:.65rem; background:#fff; color:var(--ink); font:inherit; }
input[type=checkbox] { width:auto; }
button { border:0; border-radius:8px; background:var(--red); color:#fff; cursor:pointer; font:inherit; font-weight:800; padding:.65rem 1rem; }
button.quiet { background:transparent; }
button.small { padding:.35rem .65rem; }
.message { border-radius:10px; background:#dcecdf; margin-bottom:1rem; padding:.8rem 1rem; }
.message.error,.error { background:#f4d9db; color:var(--red); }
.login-card { width:min(460px,100%); margin:8vh auto; }
.register-note { color:var(--muted); }
.table-wrap { overflow:auto; border:1px solid var(--line); border-radius:12px; }
.editorial-table { width:100%; min-width:980px; border-collapse:collapse; }
.editorial-table th,.editorial-table td { border-bottom:1px solid var(--line); padding:.7rem; text-align:left; vertical-align:top; }
.editorial-table th { background:#eee9e1; color:var(--navy); font-size:.75rem; letter-spacing:.05em; position:sticky; top:0; text-transform:uppercase; }
.editorial-table td:first-child { min-width:220px; }
.editorial-table td:last-child { min-width:300px; }
.editorial-table small { display:block; margin-top:.25rem; }
.publication-yes { background:#dcecdf; color:var(--green); }
.publication-believed,.publication-unknown { background:#faebcd; color:var(--amber); }
details summary { cursor:pointer; font-size:1.1rem; font-weight:800; margin-bottom:.75rem; }
.site-header { gap:1rem; flex-wrap:wrap; }
.site-header nav a { color:#fff; padding:.5rem; display:inline-block; }
.site-header nav { color:#cfd7e3; }
:focus-visible { outline:3px solid #b56d06; outline-offset:3px; }
.skip-link { position:absolute; left:1rem; top:-6rem; background:#fff; padding:.75rem; z-index:10; }
.skip-link:focus { top:1rem; }
.card { background:var(--panel); border:1px solid var(--line); padding:clamp(1rem,3vw,2rem); margin:1.5rem 0; overflow-wrap:anywhere; }
.card table { width:100%; border-collapse:collapse; table-layout:fixed; margin:1rem 0; }
.card th,.card td { border-bottom:1px solid var(--line); text-align:left; vertical-align:top; padding:.5rem; overflow-wrap:anywhere; }
.card caption { text-align:left; font-weight:700; }
.card details { margin:.5rem 0; }
.site-footer { width:min(1240px,calc(100% - 2rem)); margin:0 auto; padding:1rem 0; border-top:1px solid var(--line); }
.site-footer small { display:block; overflow-wrap:anywhere; }
.environment-badge { border:1px solid #cfd7e3; border-radius:5px; color:#fff; padding:.35rem .6rem; font-weight:700; }
.security-panel { width:min(720px,100%); margin:1rem auto; }
.security-panel label { display:block; margin-bottom:.25rem; }
.security-panel form { margin:1rem 0; }
.security-panel img { max-width:100%; height:auto; }
.recovery-codes { padding-left:1.5rem; }
.recovery-codes code,.setup-key { overflow-wrap:anywhere; }
.security-actions { margin-top:1rem; }
.security-actions a { display:inline-block; min-height:44px; padding:.65rem 0; }
@media (max-width:760px) { .two-column { grid-template-columns:1fr; } .hero { display:block; } .hero-count { text-align:left; margin-top:1rem; } }
@media (max-width:480px) { .site-header { align-items:flex-start; } .brand { grid-template-columns:72px 2px auto; gap:.5rem; } .brand img { width:72px; } .brand__divider { height:36px; } .brand__name { font-size:1rem; } }
