:root{color-scheme:dark;font-family:Inter,system-ui,sans-serif;background:#181622;color:#f8f5ff;--muted:#bdb5cf;--panel:#242131;--accent:#d4bbff}
*{box-sizing:border-box}
body{margin:0;max-width:720px;margin-inline:auto;padding:0 16px 40px}
header,nav{display:flex;align-items:center;gap:8px}
header{padding-block:20px;justify-content:space-between;letter-spacing:.07em}
header span{font-size:.8rem;color:var(--muted)}
nav{overflow-x:auto;padding-bottom:8px}
h1{font-size:1.8rem;margin-block:20px 12px}
h2{font-size:1.25rem}
p{line-height:1.45}
article,form{border:1px solid #3d364d;background:var(--panel);border-radius:14px;padding:16px;margin-block:12px}
article h2,article p:first-child{margin-top:0}
form form{padding:0}
label{display:grid;gap:5px;margin-bottom:12px;color:var(--muted)}
input,textarea,select{width:100%;font:inherit;border:1px solid #61566f;border-radius:8px;padding:10px;background:#1e1b28;color:inherit}
.social{display:inline-block;color:var(--accent);margin:4px 12px 8px 0}
button,a.button{border:0;border-radius:8px;padding:10px 12px;font:inherit;background:var(--accent);color:#211733;cursor:pointer;margin:4px 6px 4px 0;text-decoration:none;display:inline-block}
button.secondary{background:#3a324b;color:inherit}
button:disabled{opacity:.6;cursor:wait}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid white;outline-offset:2px}
small{color:var(--muted)}
img{max-width:100%;max-height:220px;border-radius:10px;display:block;margin:8px 0}
dialog{max-width:min(90vw,420px);border:1px solid #61566f;border-radius:14px;background:var(--panel);color:inherit}
#status{position:sticky;bottom:12px;background:#383049;padding:10px;border-radius:8px}
#status:empty{display:none}