:root{--bg:#fbfaf7;--ink:#222;--mut:#777;--line:#e6e2da;--acc:#2a5db0;--side:#f3f0ea}
*{box-sizing:border-box}body{margin:0;font:16px/1.55 -apple-system,system-ui,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);display:flex;min-height:100vh}
a{color:var(--acc);text-decoration:none}a:hover{text-decoration:underline}
nav.side{width:250px;flex:none;background:var(--side);padding:1.2rem 1rem;border-right:1px solid var(--line);position:sticky;top:0;height:100vh;overflow:auto}
nav .brand{display:block;font-weight:700;font-size:1.3rem;color:var(--ink);margin-bottom:.8rem}
nav h4{margin:1.2rem 0 .3rem;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
nav ul.topics{list-style:none;margin:0;padding:0}nav ul.topics li{display:flex;justify-content:space-between;padding:.15rem 0}nav a.on{font-weight:600}
nav .n{color:var(--mut);font-size:.8rem}nav .search input{width:100%;padding:.4rem .5rem;border:1px solid var(--line);border-radius:6px}
nav details summary{cursor:pointer;color:var(--mut);font-size:.9rem}nav details form{display:flex;flex-direction:column;gap:.3rem;margin-top:.4rem}
nav .cloud a{font-size:.85rem;margin-right:.3rem}nav .logout{margin-top:2rem}nav .logout button{background:none;border:none;color:var(--mut);cursor:pointer;padding:0}
main{flex:1;max-width:60rem;padding:2rem 3rem}
h1{margin:.2rem 0 .8rem;font-size:1.7rem}h2{font-size:1.1rem;margin:1.8rem 0 .5rem;color:#444}
.head{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.btn{background:var(--acc);color:#fff;padding:.4rem .9rem;border-radius:6px;font-size:.9rem}.btn:hover{text-decoration:none;opacity:.9}
.muted{color:var(--mut)}.small{font-size:.85rem}.crumbs{color:var(--mut);margin:0}
ul.notes,ul.artifacts{list-style:none;padding:0;margin:0}ul.notes li,ul.artifacts li{padding:.45rem 0;border-bottom:1px solid var(--line)}
.tag{font-size:.8rem;color:#7a5c00;background:#f7ecc7;padding:.05rem .4rem;border-radius:4px;margin-left:.3rem}
.kind{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);margin-right:.4rem}
form.inline{display:inline}button.x{background:none;border:none;color:var(--mut);cursor:pointer;font-size:1rem;margin-left:.3rem}
input,textarea,select{font:inherit;padding:.45rem .55rem;border:1px solid var(--line);border-radius:6px;background:#fff;width:100%}
button{font:inherit;padding:.45rem .9rem;border:none;border-radius:6px;background:var(--acc);color:#fff;cursor:pointer}button.danger{background:#b23a3a}button.muted{background:none;color:var(--mut);padding:0}
details.edit{margin:1rem 0}details.edit summary{cursor:pointer;color:var(--mut)}details.edit form{display:flex;flex-direction:column;gap:.4rem;margin:.6rem 0}
form.attach label{display:flex;flex-direction:column;font-size:.85rem;color:var(--mut)}
form.editor{display:flex;flex-direction:column;gap:.5rem}.split{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.split textarea{min-height:60vh;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92rem}
.preview{border:1px solid var(--line);border-radius:6px;padding:.5rem 1rem;background:#fff;overflow:auto;max-height:70vh}.row{display:flex;gap:1rem;align-items:center}
article.md,.desc{max-width:44rem}.md pre{background:#f4f2ee;padding:.7rem;overflow-x:auto;border-radius:6px}.md code{font-size:.92em}.md img{max-width:100%}.md blockquote{border-left:3px solid var(--line);margin:0;padding-left:1rem;color:#555}
.md table,main table{border-collapse:collapse;width:100%}.md td,.md th,main td,main th{border-bottom:1px solid var(--line);padding:.35rem .5rem;text-align:left}main th{color:var(--mut);font-weight:600;font-size:.85rem}
p.snip{margin:.2rem 0 0;color:#555;font-size:.9rem}mark{background:#fff2a8}.foot{margin-top:3rem}
body.login{align-items:center;justify-content:center}body.login form{display:flex;flex-direction:column;gap:.6rem;width:18rem}body.login h1{text-align:center}.err{color:#b23a3a;margin:0;text-align:center}
@media(max-width:800px){body{flex-direction:column}nav.side{width:auto;height:auto;position:static}main{padding:1rem}.split{grid-template-columns:1fr}}
