*{box-sizing:border-box}html,body{margin:0;height:100%}:root{--bg:#eef0f4;--panel:#fff;--panel2:#f6f7fa;--ink:#17233b;--muted:#68758d;--line:#e1e6ef;--accent:#e8503a;--teal:#0e8f7e;--side:#101a2e;--side2:#0a1222;--sideText:#d4ddf0;--sideMuted:#8090b3;--shadow:0 14px 40px rgba(21,32,57,.12);--disp:'Bricolage Grotesque',system-ui,sans-serif;--body:'Instrument Sans',system-ui,sans-serif;--mono:'JetBrains Mono',monospace}[data-theme=dark]{--bg:#0b1120;--panel:#141c2e;--panel2:#101728;--ink:#edf1fa;--muted:#929db5;--line:#26324e;--side:#080e1b;--side2:#060b15;--sideText:#dbe3f4;--sideMuted:#7f8ca8;--shadow:0 15px 40px rgba(0,0,0,.4)}body{font-family:var(--body);color:var(--ink);background:var(--bg)}button,input,select,textarea{font:inherit;color:inherit}.hide{display:none!important}.push{margin-left:auto}.icon-btn{border:0;background:transparent;border-radius:9px;min-width:34px;height:34px;cursor:pointer;color:var(--muted)}.icon-btn:hover{background:var(--panel2);color:var(--ink)}.danger:hover{color:var(--accent)!important;background:rgba(232,80,58,.12)!important}.primary-btn,.secondary-btn,.danger-btn,.ghost-danger{border:0;border-radius:10px;padding:11px 15px;font-weight:700;cursor:pointer}.primary-btn{background:var(--accent);color:#fff;box-shadow:0 9px 22px rgba(232,80,58,.28)}.primary-btn.compact{padding:9px 14px}.secondary-btn{background:var(--panel2);border:1px solid var(--line)}.danger-btn{background:var(--accent);color:#fff}.ghost-danger{background:transparent;color:var(--accent);border:1px solid rgba(232,80,58,.35)}.inp{width:100%;border:1.5px solid var(--line);background:var(--panel2);border-radius:10px;padding:10px 12px}.inp:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(232,80,58,.12)}
/* login */.login-body{overflow:auto}.login-grid{min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr}.login-hero{padding:52px 56px;color:#eef3ff;display:flex;flex-direction:column;justify-content:space-between;background:radial-gradient(800px 420px at 100% 0,rgba(232,80,58,.26),transparent 58%),radial-gradient(700px 440px at 0 100%,rgba(14,143,126,.27),transparent 60%),linear-gradient(155deg,#15223d,#091122)}.brand-row{display:flex;gap:11px;align-items:center}.brand-row strong{font:800 21px var(--disp)}.brand-row span{font:600 11px var(--mono);color:#93a3c7;border:1px solid #304163;border-radius:999px;padding:3px 9px}.hero-copy{max-width:560px}.hero-copy h1{font:800 clamp(38px,4vw,58px)/1.04 var(--disp);letter-spacing:-.03em;margin:0 0 18px}.hero-copy h1 em{font-style:normal;color:#ff785b}.hero-copy p{color:#afbddb;font-size:17px;line-height:1.65}.hero-copy ul{padding-left:20px;color:#d2daf0;line-height:2}.login-hero small{color:#7283aa;font:500 12px var(--mono)}.login-panel{display:grid;place-items:center;padding:32px;background:radial-gradient(rgba(20,30,54,.06) 1px,transparent 1.4px) 0 0/22px 22px,var(--bg)}.auth-card{width:min(410px,100%);background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:28px;box-shadow:var(--shadow)}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--panel2);border-radius:10px;padding:4px;margin-bottom:24px}.auth-tab{border:0;background:transparent;padding:9px;border-radius:8px;font-weight:700;cursor:pointer;color:var(--muted)}.auth-tab.active{background:var(--panel);color:var(--ink);box-shadow:0 3px 12px rgba(20,30,50,.08)}.auth-form h2{font:800 25px var(--disp);margin:0}.auth-form .sub{color:var(--muted);margin:6px 0 22px}.auth-form label{display:grid;gap:7px;margin:14px 0;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.auth-form .primary-btn{width:100%;margin-top:6px}.form-error{min-height:20px;color:#c33c30;font-size:13px;font-weight:700;text-align:center;margin-top:10px}.registration-closed{margin-top:16px;padding:12px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:13px}
/* shell */.shell{height:100vh;display:grid;grid-template-columns:302px minmax(0,1fr);overflow:hidden}.sidebar{color:var(--sideText);display:flex;flex-direction:column;background:linear-gradient(180deg,var(--side),var(--side2));border-right:1px solid #08101e}.side-head{display:flex;align-items:center;gap:10px;padding:18px 16px 13px}.side-name{font:800 19px var(--disp);color:#fff}.side-tagline{font:500 10.5px var(--mono);color:var(--sideMuted)}.sidebar .icon-btn{color:var(--sideMuted)}.sidebar .icon-btn:hover{background:#1a2745;color:#fff}.new-note-btn{margin:4px 16px 12px;border:0;background:var(--accent);color:#fff;border-radius:11px;padding:11px;font-weight:800;cursor:pointer}.search-wrap{padding:0 16px 12px}.search-wrap input{width:100%;border:1px solid #273655;background:#1a2745;color:#fff;border-radius:10px;padding:10px 12px}.search-wrap input::placeholder{color:#8290ad}.search-wrap input:focus{outline:none;border-color:var(--accent)}.side-scroll{flex:1;overflow:auto;padding:0 12px 14px}.side-scroll section{margin-bottom:18px}.side-label{display:flex;justify-content:space-between;padding:0 8px 6px;color:var(--sideMuted);font-size:10.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.filter-item,.note-item{width:100%;border:0;text-align:left;background:transparent;color:var(--sideText);border-radius:9px;cursor:pointer}.filter-item{display:flex;gap:8px;align-items:center;padding:8px 9px}.filter-item:hover,.filter-item.active,.note-item:hover,.note-item.active{background:#192643}.filter-item.active,.note-item.active{box-shadow:inset 3px 0 0 var(--accent)}.filter-item small{margin-left:auto;color:var(--sideMuted)}.cat-dot{width:8px;height:8px;border-radius:3px}.tag-cloud{display:flex;gap:6px;flex-wrap:wrap;padding:0 6px}.tag-chip{border:1px solid #283655;background:transparent;color:var(--sideMuted);border-radius:999px;padding:4px 9px;font:600 11px var(--mono);cursor:pointer}.tag-chip.on{background:var(--teal);border-color:var(--teal);color:#fff}.note-item{padding:10px 11px;margin:2px 0}.note-title{display:flex;gap:6px;color:#fff;font-size:13.5px;font-weight:700}.note-title span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.note-excerpt{font-size:12px;color:var(--sideMuted);line-height:1.4;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.note-meta{display:flex;gap:7px;flex-wrap:wrap;margin-top:6px;color:var(--sideMuted);font:500 10px var(--mono)}.side-foot{display:flex;align-items:center;gap:9px;padding:12px 15px;border-top:1px solid #23314f}.side-foot>div:nth-child(2){display:grid}.side-foot strong{font-size:13px;color:#fff}.side-foot small{font:500 10px var(--mono);color:var(--sideMuted)}.avatar{width:31px;height:31px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent),#ad3528);font-weight:800;color:#fff}.canvas{min-width:0;height:100vh;display:flex;background:radial-gradient(900px 450px at 100% 0,rgba(232,80,58,.07),transparent 60%),radial-gradient(900px 450px at 0 100%,rgba(14,143,126,.07),transparent 60%),var(--bg)}.editor-pane{flex:1;min-width:0;display:flex;flex-direction:column}.ed-top{display:flex;align-items:center;padding:10px 20px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel) 85%,transparent)}.mobile-menu{display:none}.save-state{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:12px}.save-state span{width:8px;height:8px;border-radius:50%;background:var(--teal)}.save-state.dirty span{background:var(--accent)}.save-state.saving span{background:#d99114}.ed-actions{display:flex;margin-left:auto;gap:3px}.editor-scroll{flex:1;overflow:auto}.page{max-width:880px;margin:0 auto;padding:30px 44px 120px}.title-input{width:100%;border:0;background:transparent;font:800 clamp(27px,3vw,35px)/1.15 var(--disp);color:var(--ink);outline:none}.title-input::placeholder{color:color-mix(in srgb,var(--muted) 55%,transparent)}.ed-meta{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:9px 0 18px}.cat-input{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:999px;padding:6px 12px;width:145px}.cat-input:focus{outline:none;border-color:var(--teal)}.ed-tags{display:flex;gap:5px;flex-wrap:wrap}.ed-tag{background:rgba(14,143,126,.11);color:var(--teal);font:600 11px var(--mono);padding:4px 9px;border-radius:999px;cursor:pointer}.created{margin-left:auto;color:var(--muted);font:500 11px var(--mono)}.toolbar{position:sticky;top:6px;z-index:5;display:flex;flex-wrap:wrap;gap:2px;padding:7px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel) 90%,transparent);box-shadow:var(--shadow);margin-bottom:20px}.toolbar button{border:0;background:transparent;border-radius:7px;height:32px;padding:0 8px;color:var(--muted);cursor:pointer;font-size:12px}.toolbar button:hover,.toolbar button.on{background:var(--panel2);color:var(--accent)}.toolbar>i{width:1px;height:20px;background:var(--line);margin:6px 5px}.editor{min-height:55vh;outline:none;font-size:16.5px;line-height:1.75;caret-color:var(--accent);position:relative;word-wrap:break-word}.editor[data-empty="1"]:before{content:"Start writing… add #hashtags or a code block.";position:absolute;color:var(--muted);opacity:.7;pointer-events:none}.editor p{margin:.55em 0}.editor h1,.editor h2,.editor h3,.editor h4{font-family:var(--disp);line-height:1.2;margin:1.2em 0 .45em}.editor h1{font-size:30px}.editor h2{font-size:25px}.editor h3{font-size:20px}.editor ul,.editor ol{padding-left:1.5em}.editor blockquote{border-left:3px solid var(--accent);margin:1em 0;padding:.55em 1.1em;background:var(--panel2);color:var(--muted);border-radius:0 10px 10px 0}.editor a{color:var(--teal)}.editor code:not(pre code){font:.88em var(--mono);background:rgba(232,80,58,.1);color:#c94331;padding:.12em .4em;border-radius:5px}.editor pre{position:relative;background:#0f1526;color:#dbe5ff;border-radius:12px;padding:20px 17px 15px;overflow:auto;cursor:pointer;font:13.5px/1.65 var(--mono)}.editor pre:before{content:attr(data-lang);position:absolute;right:11px;top:7px;color:#61729f;font:600 9px var(--mono);text-transform:uppercase;letter-spacing:.12em}.editor pre code,.editor pre .hljs{background:transparent;padding:0}.statusbar{display:flex;gap:15px;padding:9px 22px;border-top:1px solid var(--line);background:var(--panel);color:var(--muted);font:500 11px var(--mono)}.empty-state{flex:1;display:grid;place-items:center;text-align:center}.empty-state h2{font:800 28px var(--disp);margin:14px 0 7px}.empty-state p{color:var(--muted)}.empty-logo{width:70px;height:70px;border-radius:20px;background:var(--panel);box-shadow:var(--shadow);display:grid;place-items:center;margin:auto}
/* modals */.modal-backdrop{display:none;position:fixed;inset:0;z-index:100;background:rgba(4,9,20,.58);backdrop-filter:blur(4px);place-items:center;padding:18px}.modal-backdrop.open{display:grid}.modal{width:min(520px,100%);max-height:90vh;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.4)}.modal.wide{width:min(760px,100%)}.modal.small{width:min(390px,100%)}.modal-head,.modal-foot{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line)}.modal-foot{border-top:1px solid var(--line);border-bottom:0}.modal-head h3{font:800 17px var(--disp);margin:0}.modal-head select{width:auto}.modal-body{padding:19px;overflow:auto}.modal-body.center{text-align:center}.modal-body.center p{color:var(--muted)}#codeArea{width:100%;min-height:320px;resize:vertical;border:1px solid #263455;background:#0f1526;color:#dce5ff;border-radius:10px;padding:14px;font:13px/1.65 var(--mono)}.setting-section{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--line)}.setting-section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}.setting-section h4{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.setting-section form{display:grid;gap:9px}.setting-section p{font-size:13px;color:var(--muted)}.button-row{display:flex;gap:8px;flex-wrap:wrap}.button-row.center{justify-content:center}.switch-row{display:flex;align-items:center;gap:15px}.switch-row span{display:grid}.switch-row small{color:var(--muted);margin-top:3px}.switch-row input{margin-left:auto;width:19px;height:19px;accent-color:var(--teal)}#toasts{position:fixed;right:18px;bottom:18px;z-index:200;display:grid;gap:8px}.toast{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:10px;padding:10px 14px;box-shadow:var(--shadow);font-size:13px;font-weight:700}.toast.err{border-left-color:var(--accent)}.mobile-backdrop{display:none}
@media(max-width:900px){.login-grid{grid-template-columns:1fr}.login-hero{min-height:280px;padding:30px 25px}.hero-copy h1{font-size:34px}.login-panel{padding:22px}.shell{grid-template-columns:1fr}.sidebar{position:fixed;z-index:40;inset:0 auto 0 0;width:min(320px,88vw);transform:translateX(-103%);transition:.2s;box-shadow:20px 0 55px rgba(0,0,0,.35)}body.side-open .sidebar{transform:translateX(0)}.mobile-backdrop{display:block;position:fixed;z-index:30;inset:0;background:rgba(3,8,18,.5);opacity:0;pointer-events:none;transition:.2s}body.side-open .mobile-backdrop{opacity:1;pointer-events:auto}.mobile-menu{display:block}.page{padding:24px 20px 110px}.created{width:100%;margin-left:0}.statusbar .push{display:none}}
/* v2: undo, checklist, history */
.icon-btn:disabled{opacity:.32;cursor:not-allowed}.icon-btn:disabled:hover{background:transparent;color:var(--muted)}
.editor ul.checklist{list-style:none;padding-left:0;margin:.7em 0}.editor ul.checklist>li{position:relative;padding-left:32px;min-height:1.8em;margin:.24em 0}.editor ul.checklist>li:before{content:"";position:absolute;left:2px;top:.38em;width:17px;height:17px;border:1.7px solid var(--muted);border-radius:5px;background:var(--panel);cursor:pointer}.editor ul.checklist>li[data-checked="1"]{color:var(--muted);text-decoration:line-through}.editor ul.checklist>li[data-checked="1"]:before{content:"✓";display:grid;place-items:center;background:var(--teal);border-color:var(--teal);color:#fff;font:800 12px/1 var(--body);text-decoration:none}
.history-modal{width:min(960px,96vw);height:min(680px,88vh)}.history-sub{display:block;color:var(--muted);font-size:11px;margin-top:2px}.history-grid{display:grid;grid-template-columns:300px minmax(0,1fr);min-height:0;flex:1}.history-list{overflow:auto;border-right:1px solid var(--line);padding:10px}.history-item{width:100%;display:grid;gap:4px;text-align:left;border:1px solid transparent;background:transparent;color:var(--ink);border-radius:10px;padding:11px;cursor:pointer;margin-bottom:5px}.history-item:hover{background:var(--panel2)}.history-item.active{background:var(--panel2);border-color:var(--teal)}.history-item strong{font-size:13px}.history-item span{color:var(--muted);font:500 10.5px var(--mono)}.history-item small{color:var(--muted);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-preview{min-width:0;display:flex;flex-direction:column}.history-preview-head{padding:14px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px}.history-preview-head strong{font:800 17px var(--disp)}.history-preview-head span{margin-left:auto;color:var(--muted);font:500 10.5px var(--mono)}.history-preview-body{flex:1;overflow:auto;padding:24px;font-size:15px;line-height:1.7;pointer-events:none}.history-preview-body h1,.history-preview-body h2,.history-preview-body h3,.history-preview-body h4{font-family:var(--disp)}.history-preview-body pre{white-space:pre-wrap;background:#0f1526;color:#dbe5ff;border-radius:10px;padding:14px;font:12px/1.6 var(--mono);overflow:auto}.history-preview-body ul.checklist{list-style:none;padding-left:0}.history-preview-body ul.checklist>li{position:relative;padding-left:28px}.history-preview-body ul.checklist>li:before{content:"□";position:absolute;left:0;color:var(--muted)}.history-preview-body ul.checklist>li[data-checked="1"]{text-decoration:line-through;color:var(--muted)}.history-preview-body ul.checklist>li[data-checked="1"]:before{content:"☑";color:var(--teal)}.history-preview-foot{padding:12px 18px;border-top:1px solid var(--line);display:flex;justify-content:flex-end}.history-empty{padding:20px;color:var(--muted);text-align:center;line-height:1.6}
@media(max-width:760px){.ed-top{padding:8px 10px}.ed-actions{gap:0}.ed-actions .icon-btn{min-width:30px;width:30px}.history-modal{height:92vh}.history-grid{grid-template-columns:1fr;grid-template-rows:210px minmax(0,1fr)}.history-list{border-right:0;border-bottom:1px solid var(--line)}.history-preview-head{align-items:flex-start;flex-direction:column}.history-preview-head span{margin-left:0}.history-preview-body{padding:18px}.history-modal .modal-head .secondary-btn{font-size:11px;padding:8px}}