:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#202124;background:#f7f8fa;font-synthesis:none}*{box-sizing:border-box}html,body,#app{height:100%;margin:0}button,input,textarea{font:inherit}button{color:inherit}.screen-center{min-height:100%;display:grid;place-items:center}.muted{color:#7a828e}.login-page{min-height:100%;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#f8fafc,#eef2f7)}.login-card{width:min(420px,100%);background:#fff;border:1px solid #e1e6ee;border-radius:18px;padding:36px;box-shadow:0 24px 70px #1a274417;text-align:center}.brand-mark,.logo{display:grid;place-items:center;font-weight:800;background:#111827;color:#fff;border-radius:10px}.brand-mark{width:54px;height:54px;margin:0 auto 18px;font-size:23px}.login-card h1{margin:0 0 8px}.login-card p{margin:0 0 24px;color:#6b7280}.login-card small{display:block;margin-top:16px;color:#9299a5}.google-btn{width:100%;border:1px solid #d9dee7;background:#fff;border-radius:10px;padding:12px 16px;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;font-weight:600}.google-btn:hover{background:#f8fafc}.google-g{color:#4285f4;font-weight:800;font-size:18px}.app-shell{height:100vh;display:grid;grid-template-columns:230px 360px minmax(0,1fr);overflow:hidden;background:#fff}.sidebar{background:#f4f6f8;border-right:1px solid #e1e5ea;display:flex;flex-direction:column;min-width:0;z-index:40}.sidebar-head{height:62px;display:flex;align-items:center;gap:10px;padding:0 16px;border-bottom:1px solid #e1e5ea}.logo{width:30px;height:30px;font-size:14px}nav{padding:12px 10px;display:grid;gap:4px}.nav-item{border:0;background:transparent;border-radius:8px;padding:9px 10px;display:flex;gap:10px;align-items:center;cursor:pointer;text-align:left}.nav-item:hover{background:#e9edf2}.nav-item.active{background:#dfe7f3;font-weight:650}.sidebar-foot{margin-top:auto;border-top:1px solid #e1e5ea;padding:12px;display:flex;align-items:center;gap:9px}.avatar{width:32px;height:32px;border-radius:50%}.user-meta{min-width:0;flex:1;display:grid}.user-meta strong,.user-meta small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-meta strong{font-size:12px}.user-meta small{font-size:10px;color:#7d8591}.list-pane{border-right:1px solid #e1e5ea;min-width:0;display:flex;flex-direction:column;background:#fbfcfd}.list-top{height:62px;padding:10px;display:flex;gap:8px;align-items:center;border-bottom:1px solid #e1e5ea}.search-box{flex:1;height:38px;border:1px solid #dbe0e7;background:#fff;border-radius:9px;display:flex;align-items:center;gap:8px;padding:0 10px}.search-box input{border:0;outline:0;min-width:0;width:100%;background:transparent}.new-btn{width:38px;height:38px;border:0;border-radius:50%;background:#1769e0;color:#fff;display:grid;place-items:center;cursor:pointer}.list-title{height:44px;padding:0 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf0f4}.list-title span{color:#8b929e;font-size:12px}.notes-list{overflow:auto;flex:1}.note-row{width:100%;border:0;border-bottom:1px solid #edf0f4;background:transparent;padding:12px 14px;cursor:pointer;text-align:left}.note-row:hover{background:#f2f5f8}.note-row.selected{background:#e8f1fd;box-shadow:inset 3px 0 #1769e0}.row-title{font-weight:700;font-size:13px;display:flex;align-items:center;gap:5px;margin-bottom:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row-preview{color:#646c78;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row-date{color:#a0a6af;font-size:10px;margin-top:7px}.empty-list{padding:34px 18px;color:#9aa1aa;text-align:center}.editor-pane{min-width:0;display:flex;flex-direction:column;background:#fff}.editor-top{height:62px;border-bottom:1px solid #e6e9ee;padding:0 18px;display:flex;align-items:center;justify-content:space-between}.save-state{font-size:11px;color:#8c949f}.editor-actions{display:flex;align-items:center;gap:5px}.icon-btn{border:0;background:transparent;width:34px;height:34px;display:grid;place-items:center;border-radius:8px;cursor:pointer}.icon-btn:hover,.icon-btn.active{background:#edf2f8}.icon-btn.danger:hover,.danger{color:#c73535}.text-action{border:0;background:transparent;padding:8px 10px;border-radius:7px;cursor:pointer;display:flex;align-items:center;gap:6px}.text-action:hover{background:#f2f4f7}.editor-wrap{flex:1;min-height:0;display:flex;flex-direction:column;padding:34px clamp(24px,5vw,76px)}.title-input{font-size:24px;font-weight:750;border:0;outline:0;padding:0 0 9px}.tags-input{border:0;border-bottom:1px solid #eef0f3;outline:0;padding:0 0 12px;color:#77808c;font-size:12px}.content-input{flex:1;resize:none;border:0;outline:0;padding:20px 0 40px;line-height:1.65;min-height:0}.editor-empty{flex:1;display:grid;place-items:center;align-content:center;color:#a0a7b1;text-align:center}.editor-empty h2{color:#6f7783;margin:12px 0 0}.editor-empty p{margin:5px 0 0}.readonly-content{white-space:pre-wrap;line-height:1.65}.readonly-tags{color:#8a929d}.mobile-only{display:none}.overlay{position:fixed;inset:0;background:#11182759;z-index:30}@media(max-width:900px){.app-shell{grid-template-columns:330px minmax(0,1fr)}.sidebar{position:fixed;left:-250px;top:0;bottom:0;width:230px;transition:left .2s ease;box-shadow:12px 0 30px #00000014}.sidebar.open{left:0}.mobile-only{display:grid}}@media(max-width:650px){.app-shell{grid-template-columns:1fr}.list-pane{grid-column:1}.editor-pane{position:fixed;inset:0;z-index:20;transform:translate(100%);transition:transform .2s ease}.list-pane:has(.note-row.selected)+.editor-pane{transform:translate(0)}.editor-wrap{padding:24px 20px}}