:root { color-scheme: light dark; }
body { font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; margin: 2rem; max-width: 980px; }
header { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:1rem; }
nav a { margin-right: 10px; text-decoration: none; }
.post { border-bottom: 1px solid #e8e8e8; padding: .9rem 0; }
.title { font-weight: 700; margin-bottom: 4px; }
.meta { color:#666; font-size:12px; margin-top:6px; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.cat { background:#f2f2f2; padding:3px 8px; margin-right:6px; border-radius:12px; font-size:12px; display:inline-block; }
.list-empty { color:#666; padding:1rem 0; }
.btn { padding:8px 12px; border:0; border-radius:8px; background:#111; color:#fff; cursor:pointer; }
.btn.subtle { background:#eee; color:#111; }
.input, input[type="text"], textarea, select { width:100%; padding:10px; border:1px solid #ccc; border-radius:8px; }
.grid { display:grid; gap:12px; }
.muted { color:#666; }
.modal-back{ position:fixed; inset:0; background:rgba(0,0,0,.5); display:none; align-items:center; justify-content:center; z-index:1000;}
.modal{ background:#fff; max-width:760px; width:92vw; border-radius:12px; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.25);}
.modal h3{ margin-top:0; }