:root { color-scheme: dark; --paper:#17110d; --panel:#231811; --ink:#fff0dc; --muted:#d6b48e; --orange:#f68b45; --line:#6b3b1e; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:#0e0b09; font:16px/1.5 system-ui,sans-serif; }
header,main { width:min(1100px,calc(100% - 32px)); margin:auto; }
header { display:flex; justify-content:space-between; align-items:center; padding:28px 0 18px; border-bottom:1px solid var(--line); }
h1,h2,p { margin-top:0; }
h1 { margin-bottom:0; font:700 clamp(2.2rem,7vw,4.8rem)/1 Georgia,serif; }
.eyebrow { margin-bottom:6px; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; font-size:.75rem; font-weight:800; }
main { display:grid; grid-template-columns:minmax(260px,.7fr) minmax(360px,1.3fr); gap:22px; padding:28px 0; }
.panel,.login-card { padding:24px; border:1px solid var(--line); border-radius:14px; background:var(--panel); }
form,label { display:grid; gap:7px; }
form { gap:18px; }
input,button { min-height:44px; padding:9px 12px; border:1px solid var(--line); border-radius:8px; font:inherit; }
input { color:var(--ink); background:#100c09; }
button { color:#160b04; background:var(--orange); font-weight:900; cursor:pointer; }
button.quiet { min-height:38px; color:var(--ink); background:transparent; }
.remember { grid-template-columns:auto 1fr; align-items:center; }
.remember input { min-height:auto; }
article { display:grid; grid-template-columns:1fr auto; gap:2px 14px; padding:12px 0; border-bottom:1px solid #46301f; }
article small { grid-column:1/-1; color:var(--muted); }
.release-preview { display:grid; grid-template-columns:100px 1fr; gap:14px; align-items:center; margin-bottom:16px; }
.release-preview[hidden] { display:none; }
.release-preview img { width:100px; height:100px; object-fit:cover; border:1px solid var(--line); border-radius:8px; }
.release-preview div { display:grid; gap:3px; }
.release-preview span,.release-preview small,#preview-help { color:var(--muted); }
.login-page { display:grid; place-items:center; padding:20px; }
.login-card { width:min(440px,100%); }
@media (max-width:760px) { main { grid-template-columns:1fr; } header { align-items:flex-end; } }
