:root{--bg:#f7f5f1;--paper:#fffdf9;--ink:rgba(20,18,15,.94);--muted:#706a61;--line:rgba(33,28,20,.12);--blue:#0075de;--blue-dark:#005bab;--danger:#b42318;--shadow:rgba(0,0,0,.04) 0 4px 18px,rgba(0,0,0,.027) 0 2px 8px,rgba(0,0,0,.02) 0 1px 3px}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 25% 0,rgba(0,117,222,.08),transparent 34rem),var(--bg);color:var(--ink);font:16px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}.shell{height:100vh;display:grid;grid-template-columns:330px 1fr;overflow:hidden}.sidebar{border-right:1px solid var(--line);background:rgba(255,253,249,.78);backdrop-filter:blur(18px);display:flex;flex-direction:column;min-width:0}.brand{display:flex;gap:12px;align-items:center;padding:22px 20px}.brand span{display:block;color:var(--muted);font-size:13px}.mark{width:38px;height:38px;border-radius:12px;background:var(--ink);color:var(--paper);display:grid;place-items:center;font:700 24px "Source Serif 4",serif}.sidebar-actions{display:flex;gap:8px;padding:0 20px 18px}.small{padding:8px 11px;font-size:14px}.primary,.ghost,.danger{border:1px solid transparent;border-radius:9px;padding:10px 14px;font-weight:700}.primary{background:var(--blue);color:#fff}.primary:hover{background:var(--blue-dark)}.ghost{background:rgba(0,0,0,.045);color:var(--ink);border-color:var(--line)}.danger{background:#fff0ee;color:var(--danger);border-color:#ffd6d1}.link-button{border:0;background:transparent;color:var(--muted);padding:0}.search{display:block;padding:0 20px 16px;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.search input{display:block;width:100%;margin-top:7px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px 12px;color:var(--ink);text-transform:none;letter-spacing:0;font-weight:500}.panel-heading{padding:0 20px 8px;color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.drafts-heading{padding-top:14px}.folder-panel{padding:0 10px 8px;border-bottom:1px solid var(--line)}.folder-list{display:grid;gap:5px;max-height:190px;overflow:auto;padding:0 0 8px}.folder-pill{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid transparent;background:rgba(255,255,255,.55);border-radius:10px;padding:8px 10px;color:var(--ink);font-weight:700;text-align:left}.folder-pill:hover,.folder-pill.selected{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}.folder-pill em{font-style:normal;color:var(--muted);font-size:12px;background:#f4f1ec;border-radius:999px;padding:2px 7px}.folder-pill.selected em{background:#f2f9ff;color:#097fe8}.tree{overflow:auto;padding:0 10px 20px}.folder{margin:8px 0}.folder-title{position:sticky;top:0;width:100%;text-align:left;border:0;background:rgba(247,245,241,.92);padding:7px 10px;color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;border-radius:8px}.folder-title.selected{background:#f2f9ff;color:#097fe8}.empty-folder{margin:3px 10px 8px;color:var(--muted);font-size:12px;font-style:italic}.file{display:block;width:100%;text-align:left;border:1px solid transparent;background:transparent;border-radius:12px;padding:10px;margin:3px 0;color:var(--ink)}.file:hover,.file.active{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}.file strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file span{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tags{margin-top:5px;display:flex;gap:4px;flex-wrap:wrap}.tag{font-size:11px;background:#f2f9ff;color:#097fe8;border-radius:999px;padding:2px 7px}.sidebar-footer{margin-top:auto;padding:16px 20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:10px}.sidebar-footer a{color:var(--muted);text-decoration:none}.workspace{min-width:0;display:flex;flex-direction:column}.topbar{height:116px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 32px;border-bottom:1px solid var(--line);background:rgba(247,245,241,.55)}.eyebrow{margin:0 0 4px;color:var(--blue);text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:800}.topbar h1{margin:0;font:800 clamp(24px,3vw,38px)/1.05 "Source Serif 4",serif;letter-spacing:-.03em}.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.save-state{color:var(--muted);font-size:13px;min-width:74px;text-align:right}.empty-state{margin:auto;max-width:720px;text-align:center;padding:40px}.empty-state h2{font:800 clamp(34px,5vw,64px)/.98 "Source Serif 4",serif;letter-spacing:-.04em;margin:18px 0 12px}.empty-state p{color:var(--muted);font-size:18px}.paper-stack{position:relative;width:130px;height:100px;margin:0 auto}.paper-stack span{position:absolute;inset:0;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.paper-stack span:nth-child(1){transform:rotate(-8deg)}.paper-stack span:nth-child(2){transform:translate(9px,6px) rotate(3deg)}.paper-stack span:nth-child(3){transform:translate(18px,12px) rotate(8deg)}.hidden{display:none!important}.editor-wrap{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:0}.editor-wrap.preview-off{grid-template-columns:1fr}.editor-wrap.preview-off .preview{display:none}textarea#editor{width:100%;height:100%;resize:none;border:0;border-right:1px solid var(--line);outline:0;background:var(--paper);padding:42px max(48px,7vw);font:20px/1.75 "Source Serif 4",Georgia,serif;color:var(--ink);tab-size:2}.preview{overflow:auto;background:#fff;padding:42px max(48px,6vw);font:18px/1.72 "Source Serif 4",Georgia,serif}.preview h1,.preview h2,.preview h3{font-family:Inter,system-ui,sans-serif;letter-spacing:-.03em;line-height:1.1}.preview h1{font-size:42px}.preview h2{font-size:30px;margin-top:1.8em}.preview code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;background:#f6f5f4;border:1px solid var(--line);border-radius:6px;padding:.1em .3em}.preview pre{background:#1f1d1a;color:#fff;border-radius:14px;padding:18px;overflow:auto}.preview pre code{background:transparent;border:0;padding:0}.preview blockquote{border-left:4px solid var(--blue);margin-left:0;padding-left:18px;color:var(--muted)}.preview img{max-width:100%;border-radius:12px}.login-page{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(460px,100%);background:rgba(255,253,249,.86);border:1px solid var(--line);border-radius:24px;padding:34px;box-shadow:var(--shadow);backdrop-filter:blur(18px)}.login-card h1{font:800 52px/1 "Source Serif 4",serif;letter-spacing:-.04em;margin:0 0 8px}.muted{color:var(--muted)}.error{background:#fff0ee;color:var(--danger);border:1px solid #ffd6d1;border-radius:12px;padding:10px}.login-form{display:grid;gap:14px;margin-top:22px}.login-form label{font-weight:700}.login-form input{width:100%;border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:6px;background:#fff}dialog{border:1px solid var(--line);border-radius:18px;padding:0;box-shadow:rgba(0,0,0,.15) 0 24px 80px;background:var(--paper);max-width:460px;width:calc(100% - 32px)}dialog::backdrop{background:rgba(20,18,15,.25);backdrop-filter:blur(4px)}dialog form{padding:22px}dialog h2{margin:0 0 16px}dialog label{display:block;font-weight:700;margin:12px 0}dialog input,dialog select{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;background:#fff;margin-top:6px}dialog menu{display:flex;justify-content:flex-end;gap:8px;padding:0;margin:20px 0 0}@media(max-width:900px){.shell{grid-template-columns:1fr}.sidebar{position:fixed;z-index:5;inset:0 18% 0 0;transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.editor-wrap{grid-template-columns:1fr}.preview{display:none}.topbar{height:auto;align-items:flex-start;flex-direction:column;padding:18px}.toolbar{justify-content:flex-start}textarea#editor{padding:24px;font-size:18px}}
/* Folder/file simplification + Markdown syntax editor */
.sidebar-actions{flex-wrap:wrap}.sidebar-actions .danger{flex-basis:100%}.files-heading{padding-top:14px}.CodeMirror{height:100%;width:100%;border:0;border-right:1px solid var(--line);background:var(--paper);font:20px/1.75 "Source Serif 4",Georgia,serif;color:var(--ink)}.CodeMirror-scroll{padding:42px max(48px,7vw);box-sizing:border-box}.cm-s-kleiber .CodeMirror-lines{padding:0}.cm-s-kleiber .CodeMirror-cursor{border-left:2px solid var(--blue)}.cm-s-kleiber .cm-header{font-family:Inter,system-ui,sans-serif;font-weight:800;color:#1f1d1a}.cm-s-kleiber .cm-strong{font-weight:800;color:#0f172a}.cm-s-kleiber .cm-em{font-style:italic;color:#5b4636}.cm-s-kleiber .cm-link,.cm-s-kleiber .cm-url{color:#006ecb}.cm-s-kleiber .cm-quote{color:#706a61;border-left:3px solid var(--blue);padding-left:8px}.cm-s-kleiber .cm-comment{color:#8b6f47}.cm-s-kleiber .cm-hr{color:#b89b6a}.cm-s-kleiber .cm-formatting{color:#b08b5a}.cm-s-kleiber .cm-variable-2{color:#8a4b00}.cm-s-kleiber .cm-keyword{color:#7c3aed}.cm-s-kleiber .cm-atom{color:#b42318}.cm-s-kleiber .cm-string{color:#067647}.cm-s-kleiber .cm-meta{color:#6b7280}.cm-s-kleiber .cm-comment.cm-frontmatter,.cm-s-kleiber .cm-def{color:#7c3aed}.cm-s-kleiber .CodeMirror-selected{background:#dbeafe!important}dialog select{width:100%;padding:11px;border:1px solid var(--line);border-radius:10px;background:#fff;margin-top:6px}
.last-saved{color:var(--muted);font-size:13px;white-space:nowrap;background:rgba(255,255,255,.55);border:1px solid var(--line);border-radius:999px;padding:6px 10px}
/* Front matter is YAML, not Markdown: keep keys readable and prevent underscore emphasis. */
.cm-s-kleiber .cm-frontmatter.cm-strong{font-weight:400}.cm-s-kleiber .cm-frontmatter.cm-atom{color:#7c3aed}.cm-s-kleiber .cm-frontmatter.cm-string{color:#067647}.cm-s-kleiber .cm-frontmatter.cm-def,.cm-s-kleiber .cm-frontmatter.cm-meta{color:#8a4b00;font-weight:600}
.helper-strip{display:flex;align-items:center;gap:8px;padding:10px 32px;border-bottom:1px solid var(--line);background:rgba(255,253,249,.62)}.helper-strip span{color:var(--muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-right:4px}.helper-strip .ghost{background:#fff}.toolbar .primary{white-space:nowrap}@media(max-width:900px){.helper-strip{padding:10px 18px;flex-wrap:wrap}}

/* Keep the page chrome fixed and scroll only the editor/preview panes. */
html,body{height:100%;overflow:hidden}.shell{height:100dvh;min-height:0;overflow:hidden}.workspace{height:100dvh;min-height:0;overflow:hidden;display:flex;flex-direction:column}.topbar,.helper-strip{flex:0 0 auto}.topbar{min-height:116px;height:auto}.editor-wrap{flex:1 1 auto;min-height:0;overflow:hidden}.editor-wrap .CodeMirror{height:100%;min-height:0}.editor-wrap .CodeMirror-scroll{height:100%;min-height:0;overflow:auto}.preview{height:100%;min-height:0;overflow:auto}.CodeMirror-vscrollbar,.CodeMirror-hscrollbar{outline:0}@media(max-width:900px){.shell,.workspace{height:100dvh}.topbar{min-height:0}.editor-wrap{min-height:0;overflow:hidden}.editor-wrap .CodeMirror-scroll{height:100%;overflow:auto}}
/* Plain mode uses the real textarea so Grammarly/browser writing tools can attach. */
.helper-separator{margin-left:14px;padding-left:14px;border-left:1px solid var(--line)}#togglePlainMode[aria-pressed="true"]{background:#f2f9ff;border-color:#9bd0ff;color:#075ea8}textarea#editor{overflow:auto}
/* Recently edited files */
.recent-panel{padding:0 10px 8px;border-bottom:1px solid var(--line)}.recent-files{display:grid;gap:5px;padding-bottom:8px}.recent-file{display:block;width:100%;text-align:left;border:1px solid transparent;background:rgba(255,255,255,.55);border-radius:10px;padding:8px 10px;color:var(--ink)}.recent-file:hover,.recent-file.active{background:#fff;border-color:var(--line);box-shadow:var(--shadow)}.recent-file strong{display:block;font-size:13px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent-file span{display:block;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
