:root{color:#172033;background:#f6f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}.app-shell{grid-template-columns:320px 1fr;min-height:100vh;display:grid}.sidebar{background:#fff;border-right:1px solid #e5e7eb;flex-direction:column;gap:16px;padding:24px;display:flex}.brand{align-items:center;gap:10px;font-size:18px;font-weight:750;display:flex}.primary,button{cursor:pointer;color:#172033;background:#eef1f7;border:0;border-radius:14px;align-items:center;gap:8px;padding:12px 14px;font-weight:650;display:inline-flex}.primary{color:#fff;background:#172033;justify-content:center}.danger{color:#be123c;background:#fff1f2}.search{border:1px solid #e5e7eb;border-radius:14px;align-items:center;gap:8px;padding:10px 12px;display:flex}.search input{width:100%;font:inherit;border:0;outline:0}.note-list{flex-direction:column;gap:8px;display:flex;overflow:auto}.note-row{text-align:left;background:#fff;border:1px solid #e5e7eb;flex-direction:column;align-items:flex-start;display:flex}.note-row.active{background:#f6f7fb;border-color:#172033}.note-row-title{font-weight:700}.note-row span:last-child{color:#667085;margin-top:5px;font-size:12px}.editor{flex-direction:column;gap:24px;padding:32px;display:flex}.editor-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.editor-header h1{margin:0;font-size:32px}.editor-header p{color:#667085;align-items:center;gap:6px;margin:6px 0 0;display:flex}.actions{gap:10px;display:flex}.paper{background:#fff;border:1px solid #e5e7eb;border-radius:24px;flex-direction:column;min-height:70vh;padding:28px;display:flex;box-shadow:0 20px 60px #0f172a0f}.title-input{border:0;outline:0;margin-bottom:16px;font-size:32px;font-weight:760}.toolbar{z-index:2;background:#fff;border:1px solid #e5e7eb;border-radius:16px;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:18px;padding:10px;display:flex;position:sticky;top:0}.toolbar button,.color-tool{color:#172033;cursor:pointer;background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;align-items:center;gap:6px;min-height:38px;padding:9px 11px;font-weight:700;display:inline-flex}.toolbar button:hover,.color-tool:hover{background:#eef1f7}.color-tool input{cursor:pointer;background:0 0;border:0;width:24px;height:24px;padding:0}.rich-editor{color:#344054;outline:0;min-height:55vh;font-size:17px;line-height:1.75}.rich-editor:empty:before{content:attr(data-placeholder);color:#98a2b3;pointer-events:none}.rich-editor h1{color:#172033;margin:18px 0 12px;font-size:34px;line-height:1.2}.rich-editor h2{color:#172033;margin:16px 0 10px;font-size:26px;line-height:1.3}.rich-editor p{margin:10px 0}.rich-editor ul,.rich-editor ol{margin:12px 0;padding-left:28px}.rich-editor li{margin:6px 0}.rich-editor blockquote{color:#475467;background:#f8fafc;border-left:4px solid #d0d5dd;border-radius:10px;margin:16px 0;padding:8px 16px}.rich-editor a{color:#175cd3}.empty{text-align:center;place-content:center;gap:12px;min-height:100vh;display:grid}.empty h2,.empty h1{margin:0}@media (width<=800px){.app-shell{grid-template-columns:1fr}.sidebar{border-bottom:1px solid #e5e7eb;border-right:0}.editor{padding:20px}.editor-header{flex-direction:column;align-items:flex-start}.title-input{font-size:24px}.toolbar{position:relative}.paper{padding:20px}}
