:root { color-scheme: light; --ink:#1f1f1f; --muted:#777; --line:#e6e3de; --paper:#fff; --accent:#2b6cb0; }
* { box-sizing:border-box; }
html { font-size:18px; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Georgia, 'Times New Roman', serif; line-height:1.65; }
button,input { font:inherit; }
button { border:1px solid var(--line); background:#fff; padding:.42rem .8rem; border-radius:4px; cursor:pointer; }
button:hover { border-color:#aaa; }
a { color:inherit; }
.site-head { height:64px; max-width:960px; margin:auto; padding:0 24px; display:flex; align-items:center; justify-content:space-between; font-family:ui-sans-serif,system-ui,sans-serif; font-size:14px; }
.site-head a { text-decoration:none; font-weight:650; letter-spacing:.03em; }
.quiet { color:var(--muted); border:0; }
.home,.article-shell,.editor { width:min(680px, calc(100% - 40px)); margin:7vh auto 12vh; }
.home-title { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
h1 { font-size:clamp(2rem, 6vw, 3.25rem); line-height:1.08; letter-spacing:-.035em; margin:0 0 .35em; font-weight:700; }
.home h1 { font-size:2rem; }
.article-list a { display:block; padding:1.25rem 0; text-decoration:none; border-bottom:1px solid var(--line); }
.admin-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid var(--line); }
.admin-row > a { flex:1; border:0; }
.admin-row > div { display:flex; gap:.4rem; }
.article-list h2 { margin:0; line-height:1.25; font-size:1.35rem; }
.article-list p { margin:.25rem 0 0; }
.muted,.byline,.article-meta { color:var(--muted); font-family:ui-sans-serif,system-ui,sans-serif; font-size:.82rem; }
.byline { margin:0 0 2.5rem; }
.story { overflow-wrap:anywhere; }
.story p { margin:0 0 1.25em; }
.story img { display:block; max-width:min(100%, 900px); height:auto; margin:2rem auto; }
.story blockquote { margin:2rem 0; padding-left:1.25rem; border-left:3px solid var(--ink); font-style:italic; }
.story pre { overflow:auto; padding:1rem; background:#f7f6f3; }
.article-actions { margin-top:4rem; border-top:1px solid var(--line); padding-top:1rem; display:flex; gap:.5rem; }
.danger { color:#a22; }
.primary { background:var(--ink); color:#fff; border-color:var(--ink); }
.editor { margin-top:4vh; }
.editor [contenteditable] { outline:0; }
.editor-title { font-size:clamp(2rem, 6vw, 3.25rem); line-height:1.08; font-weight:700; letter-spacing:-.035em; min-height:1.2em; }
.editor-author { color:var(--muted); min-height:1.6em; margin:.75rem 0 2.5rem; }
.editor-body { min-height:45vh; }
[contenteditable]:empty:before { content:attr(data-placeholder); color:#aaa; }
.toolbar { position:sticky; top:8px; z-index:2; display:flex; flex-wrap:wrap; gap:4px; background:rgba(255,255,255,.96); border:1px solid var(--line); padding:6px; border-radius:7px; margin-bottom:2rem; font-family:ui-sans-serif,system-ui,sans-serif; }
.toolbar button { padding:.22rem .55rem; min-width:34px; }
.editor-footer { display:flex; align-items:center; gap:.5rem; margin-top:2rem; font-family:ui-sans-serif,system-ui,sans-serif; }
.status { color:var(--muted); font-size:.8rem; margin-left:auto; }
dialog { border:0; border-radius:8px; box-shadow:0 14px 60px #0003; padding:1.5rem; width:min(400px, calc(100% - 32px)); font-family:ui-sans-serif,system-ui,sans-serif; }
dialog::backdrop { background:#0005; }
dialog h2 { margin-top:0; }
dialog input { width:100%; border:1px solid #bbb; padding:.65rem; margin:.5rem 0 1rem; }
.dialog-actions { display:flex; justify-content:flex-end; gap:.5rem; }
.button-link { align-self:center; color:var(--muted); text-decoration:none; padding:.42rem .8rem; }
.login-error { color:#a22; font-size:.85rem; }
.drop-active { box-shadow:inset 0 0 0 3px #7aa7d9; }
@media (max-width:600px) { html{font-size:17px}.site-head{height:52px}.home,.article-shell,.editor{margin-top:4vh}.toolbar{top:4px} }