@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");:root{color-scheme:light;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background-color:#F8FAF9;color:#0f172a;letter-spacing:-.01em;--accent:#2563eb;--accent-hover:#1d4ed8;--accent-glow:rgba(37,99,235,0.18);--violet:#7c3aed;--surface:#ffffff;--surface-alt:#f8fafc;--border:rgba(148,163,184,0.18);--text-secondary:#64748b;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--shadow-sm:0 1px 2px rgba(15,23,42,0.04),0 2px 8px rgba(15,23,42,0.04);--shadow-md:0 4px 12px rgba(15,23,42,0.05),0 12px 32px rgba(15,23,42,0.06);--shadow-lg:0 8px 24px rgba(15,23,42,0.06),0 24px 48px rgba(15,23,42,0.1);--shadow-paper:0 1px 3px rgba(15,23,42,0.03),0 8px 30px rgba(15,23,42,0.04);--transition:0.2s cubic-bezier(0.4,0,0.2,1)}*{box-sizing:border-box}body{margin:0;background:#F8FAF9;min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:inherit;text-decoration:none}.app-shell{height:100dvh;width:100vw;flex-direction:column;overflow:hidden;border-radius:0}.app-shell,.header{display:flex;background:var(--surface)}.header{height:85px;justify-content:space-between;align-items:center;gap:16px;padding:0 24px;border-bottom:1px solid var(--border);flex-shrink:0}.title-row{display:flex;align-items:center;gap:12px}.brand-logo{height:65px;width:auto;-o-object-fit:contain;object-fit:contain}.header h1{font-size:20px;font-weight:700;margin:0;letter-spacing:-.3px}.header p{margin:3px 0 0}.header p,.note-meta{color:var(--text-secondary);font-size:13px}.note-meta{display:flex;gap:12px;align-items:center}.note-meta .pill{background:rgba(99,102,241,.08);border:1px solid rgba(99,102,241,.22);color:#4f46e5;padding:4px 12px;border-radius:20px;font-weight:600;font-size:12px;letter-spacing:.2px;box-shadow:0 1px 2px rgba(99,102,241,.04)}.note-meta-updated{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:500;color:#94a3b8;letter-spacing:.1px}.header-sync-dot{display:inline-block;width:7px;height:7px;border-radius:50%;flex-shrink:0}.header-sync-dot--green{background:#22c55e;animation:syncPulse 2s cubic-bezier(.4,0,.6,1) infinite}.header-sync-dot--orange{background:#f97316;animation:orangePulse .9s cubic-bezier(.4,0,.6,1) infinite}.header-sync-dot--gray{background:#94a3b8}@keyframes orangePulse{0%,to{box-shadow:0 0 0 0 rgba(249,115,22,.55);opacity:1}50%{box-shadow:0 0 0 5px rgba(249,115,22,0);opacity:.75}}.sync-button{background:linear-gradient(180deg,#ffffff,#f8fafc);border:1px solid #e2e8f0;border-radius:8px;padding:7px 16px;font-weight:500;font-size:13px;color:#475569;display:inline-flex;align-items:center;gap:8px;cursor:pointer;box-shadow:0 1px 3px rgba(15,23,42,.06),inset 0 1px 0 #ffffff;transition:all .2s cubic-bezier(.16,1,.3,1)}.sync-button:hover{background:linear-gradient(180deg,#f8fafc,#f1f5f9);border-color:#cbd5e1;color:#0f172a;transform:translateY(-1px) scale(1.02);box-shadow:0 4px 12px rgba(15,23,42,.08),inset 0 1px 0 #ffffff}.sync-button:active{transform:translateY(0) scale(.98);box-shadow:0 1px 2px rgba(15,23,42,.04)}.sync-button .icon{font-size:14px;color:#64748b;transition:color .2s}.sync-button:hover .icon{color:#0f172a}.btn-sync{background:linear-gradient(180deg,#3b82f6,#2563eb);border:1px solid rgba(37,99,235,.6);color:#ffffff;font-weight:600;box-shadow:0 2px 8px rgba(37,99,235,.25),inset 0 1px 0 rgba(255,255,255,.15);position:relative;overflow:hidden}.btn-sync:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.1),transparent 50%);pointer-events:none}.btn-sync:hover{background:linear-gradient(180deg,#2563eb,#1d4ed8);border-color:#1d4ed8;color:#ffffff;transform:translateY(-1px) scale(1.02);box-shadow:0 6px 20px rgba(37,99,235,.35),inset 0 1px 0 rgba(255,255,255,.15)}.btn-sync:active{transform:translateY(0) scale(.98);box-shadow:0 1px 4px rgba(37,99,235,.2)}.btn-import{background:#eef2ff;border-color:#c7d2fe;color:#4f46e5;font-weight:600;box-shadow:none}.btn-import:hover{background:#e0e7ff;border-color:#a5b4fc;color:#3730a3;transform:translateY(-1px) scale(1.02);box-shadow:0 4px 12px rgba(99,102,241,.12)}.btn-import:active{background:#c7d2fe;transform:translateY(0) scale(.98)}.import-login-popup{position:absolute;top:calc(100% + 14px);left:50%;transform:translateX(-50%);width:280px;background:#ffffff;border:1px solid rgba(148,163,184,.12);border-radius:20px;box-shadow:0 25px 60px rgba(15,23,42,.15),0 8px 24px rgba(15,23,42,.08);padding:24px 22px 20px;z-index:300;text-align:center;animation:popIn .25s cubic-bezier(.16,1,.3,1)}.import-login-popup-arrow{position:absolute;top:-7px;left:50%;transform:translateX(-50%) rotate(45deg);width:14px;height:14px;background:#ffffff;border-left:1px solid rgba(148,163,184,.12);border-top:1px solid rgba(148,163,184,.12);border-radius:3px 0 0 0}@keyframes popIn{0%{opacity:0;transform:translateX(-50%) translateY(-8px) scale(.95)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}.import-login-popup-icon{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,#eef2ff,#e0e7ff);border:1px solid rgba(99,102,241,.12);color:#6366f1;display:grid;place-items:center;margin:0 auto 14px}.import-login-popup-title{font-size:16px;font-weight:800;color:#0f172a;margin:0 0 6px;letter-spacing:-.2px}.import-login-popup-sub{font-size:12.5px;color:#64748b;margin:0 0 15px!important;line-height:1.6}.import-login-popup-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;background:#ffffff;color:#1e293b;font-size:13.5px;font-weight:600;border:1px solid #e2e8f0;border-radius:12px;cursor:pointer;transition:all .18s ease;box-shadow:0 1px 4px rgba(15,23,42,.08)}.import-login-popup-btn:hover{background:#f8fafc;border-color:#cbd5e1;box-shadow:0 4px 14px rgba(15,23,42,.1);transform:translateY(-1px)}.import-login-popup-btn:active{transform:translateY(0);box-shadow:0 1px 3px rgba(15,23,42,.06)}.guide-btn-wrapper{position:relative}.guide-btn{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:1px solid rgba(99,102,241,.3);border-radius:8px;background:linear-gradient(180deg,rgba(99,102,241,.08),rgba(99,102,241,.03));color:#4f46e5;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.02),inset 0 1px 0 rgba(255,255,255,.6);transition:all .25s cubic-bezier(.16,1,.3,1)}.guide-btn:hover{background:linear-gradient(180deg,rgba(99,102,241,.12),rgba(99,102,241,.05));border-color:rgba(99,102,241,.5);transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,.12),inset 0 1px 0 rgba(255,255,255,.8)}.guide-tip{top:calc(100% + 12px);right:0;display:flex;align-items:center;gap:10px;border:1px solid rgba(255,255,255,.08);color:#f8fafc;font-size:13px;font-weight:500;letter-spacing:.2px;padding:10px 16px;border-radius:10px;white-space:nowrap;box-shadow:0 12px 32px -4px rgba(0,0,0,.24),0 4px 12px -2px rgba(0,0,0,.12);transform-origin:top right;animation:tipSlideIn .35s cubic-bezier(.16,1,.3,1);z-index:200}.guide-tip,.guide-tip:before{position:absolute;background:#0f172a}.guide-tip:before{content:"";top:-5px;right:20px;width:10px;height:10px;border-top:1px solid rgba(255,255,255,.08);border-left:1px solid rgba(255,255,255,.08);transform:rotate(45deg);border-top-left-radius:2px}@keyframes tipSlideIn{0%{opacity:0;transform:translateY(-8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.guide-tip-beacon{display:inline-block;width:8px;height:8px;border-radius:50%;background:#3b82f6;box-shadow:0 0 8px rgba(59,130,246,.6);flex-shrink:0;animation:beaconPulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes beaconPulse{0%{box-shadow:0 0 0 0 rgba(59,130,246,.7)}70%{box-shadow:0 0 0 6px rgba(59,130,246,0)}to{box-shadow:0 0 0 0 rgba(59,130,246,0)}}.guide-tip-dismiss{background:none;border:none;color:#64748b;cursor:pointer;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;transition:all .2s ease;margin-left:4px}.guide-tip-dismiss:hover{color:#f8fafc;background:rgba(255,255,255,.1)}.note-layout{flex:1}.note-layout,.sidebar{display:flex;min-height:0;overflow:hidden}.sidebar{width:300px;flex-shrink:0;background:linear-gradient(180deg,#fafbfc,#f3f5f7);border-right:1px solid rgba(148,163,184,.15);flex-direction:column;padding:16px 16px 0;gap:12px}.sidebar-search{position:relative;margin-bottom:4px}.search-icon{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--text-secondary);pointer-events:none;opacity:.6}.search-input{width:100%;box-sizing:border-box;padding:9px 12px 9px 34px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-size:13px;color:var(--text);outline:none;transition:all var(--transition)}.search-input::-moz-placeholder{color:var(--text-secondary);opacity:.6}.search-input::placeholder{color:var(--text-secondary);opacity:.6}.search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.1)}.sidebar-new-btn{border:none;border-radius:10px;padding:10px 16px;font-weight:600;font-size:14px;background:linear-gradient(180deg,#3b82f6,#2563eb);color:#ffffff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all var(--transition);box-shadow:0 2px 8px rgba(37,99,235,.25)}.sidebar-new-btn:hover{background:linear-gradient(180deg,#2563eb,#1d4ed8);box-shadow:0 4px 14px rgba(37,99,235,.35);transform:translateY(-1px)}.sidebar-new-btn:active{transform:translateY(0);box-shadow:0 1px 4px rgba(37,99,235,.2)}.note-list{display:flex;flex-direction:column;gap:4px;flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(148,163,184,.35) transparent}.note-list::-webkit-scrollbar{width:5px}.note-list::-webkit-scrollbar-track{background:transparent}.note-list::-webkit-scrollbar-thumb{background:rgba(148,163,184,.35);border-radius:999px}.note-card{border-radius:10px;padding:14px 14px 14px 16px;border:1px solid rgba(148,163,184,.12);cursor:pointer;background:#ffffff;display:flex;align-items:flex-start;gap:10px;box-shadow:0 1px 2px rgba(15,23,42,.03);transition:all .2s cubic-bezier(.16,1,.3,1);will-change:transform,box-shadow;position:relative}.note-card:before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:transparent;transition:background .2s ease}.note-card:hover{border-color:rgba(148,163,184,.22);background:#fafbfc;box-shadow:0 2px 8px rgba(15,23,42,.06);transform:translateY(-1px)}.note-card.active{background:rgba(37,99,235,.06);border-color:rgba(37,99,235,.18);box-shadow:0 2px 12px rgba(37,99,235,.1);transform:none}.note-card.active:before{background:var(--accent);width:4px;top:6px;bottom:6px}.note-card-icon{flex-shrink:0;opacity:.4;margin-top:2px;transition:opacity .2s}.note-card.active .note-card-icon,.note-card:hover .note-card-icon{opacity:1;color:var(--accent)}.note-card-content{overflow:hidden;flex:1;min-width:0}.note-card h3{margin:0 0 2px;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#1e293b;transition:color .2s}.note-card:hover h3{color:#0f172a}.note-card.active h3{color:var(--accent-hover)}.note-card-meta{display:flex;align-items:center;gap:6px;margin-bottom:4px}.note-card-date{font-size:11px;color:var(--text-secondary);opacity:.75}.note-card-preview{margin:0;font-size:12px;line-height:1.45;color:#94a3b8;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.note-card p{margin:0;font-size:12px;color:var(--text-secondary)}.note-sync-icon{flex-shrink:0;margin-left:auto;color:#cbd5e1;display:flex;align-items:center;transition:color var(--transition);cursor:pointer;padding:4px;border-radius:4px;border:none;background:none;font:inherit}.note-sync-icon:not(.synced):hover{color:#3b82f6;background:rgba(59,130,246,.08)}.note-sync-icon.synced{color:#3b82f6;cursor:default}.note-delete-icon{flex-shrink:0;color:#cbd5e1;display:flex;align-items:center;cursor:pointer;padding:4px;border-radius:4px;transition:color var(--transition),background var(--transition);border:none;background:none;font:inherit}.note-delete-icon:hover{color:#ef4444;background:rgba(239,68,68,.08)}.editor-panel{flex:1;background:#F1F3F5;min-height:0;position:relative}.editor-header,.editor-panel{display:flex;flex-direction:column}.editor-header{padding:36px 48px 12px;gap:16px;flex-shrink:0}.note-title{width:100%;font-size:38px;font-weight:800;border:none;outline:none;font-family:inherit;letter-spacing:-.8px;background:transparent;color:#0f172a;line-height:1.2}.note-title::-moz-placeholder{color:#cbd5e1}.note-title::placeholder{color:#cbd5e1}.editor-toolbar{gap:4px;padding:10px 20px;margin:0 48px 12px;border:1px solid rgba(148,163,184,.12);border-bottom:2px solid rgba(148,163,184,.1);border-radius:10px;background:rgba(248,250,252,.7);backdrop-filter:blur(8px);flex-shrink:0;flex-wrap:wrap;box-shadow:0 1px 3px rgba(15,23,42,.04),0 4px 12px rgba(15,23,42,.02)}.editor-toolbar,.toolbar-group{display:flex;align-items:center}.toolbar-group{gap:2px}.toolbar-divider{width:1px;height:18px;background:var(--border);margin:0 6px;flex-shrink:0}.editor-toolbar button{border:none;background:transparent;border-radius:8px;width:32px;height:32px;display:grid;place-items:center;cursor:pointer;color:#94a3b8;transition:all var(--transition);padding:0;flex-shrink:0}.editor-toolbar button:hover{background:rgba(99,102,241,.06);color:#475569}.editor-toolbar button:active{transform:scale(.92)}.editor-toolbar button.is-active{background:rgba(99,102,241,.1);color:var(--accent)}.editor-toolbar button svg{display:block}.copy-message{font-size:12px;color:var(--text-secondary);align-self:center;white-space:nowrap;margin-left:8px;animation:fadeIn .25s ease}@keyframes fadeIn{0%{opacity:0;transform:translateX(-4px)}to{opacity:1;transform:translateX(0)}}.toolbar-link-popover{display:flex;align-items:center;gap:8px;padding:8px 16px;margin:0 48px 8px;background:#f8fafc;border:1px solid rgba(148,163,184,.25);border-radius:10px;box-shadow:0 2px 8px rgba(15,23,42,.06);animation:fadeIn .15s ease;flex-shrink:0}.toolbar-link-input{flex:1;border:1px solid var(--border);border-radius:6px;padding:6px 10px;font-size:13px;font-family:inherit;outline:none;background:#fff;color:#1e293b;transition:border-color .2s}.toolbar-link-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.08)}.toolbar-link-confirm{border:none;border-radius:6px;padding:6px 14px;font-size:13px;font-weight:600;background:var(--accent);color:#fff;cursor:pointer;transition:background .2s}.toolbar-link-confirm:hover{background:var(--accent-hover)}.toolbar-link-cancel{border:none;background:none;font-size:14px;color:#94a3b8;cursor:pointer;padding:4px;border-radius:4px;transition:color .2s}.toolbar-link-cancel:hover{color:#475569}.editor-container{padding:20px 48px 48px;flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;justify-content:stretch;position:relative}.editor-statusbar{position:sticky;bottom:12px;float:right;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.85);backdrop-filter:blur(8px);border:1px solid rgba(148,163,184,.15);border-radius:999px;padding:3px 10px 3px 8px;box-shadow:0 1px 4px rgba(15,23,42,.06);pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;margin-top:-36px;margin-right:4px}.statusbar-label{font-size:11px;font-weight:500;color:#94a3b8;letter-spacing:.1px}.statusbar-sync-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;flex-shrink:0;animation:syncPulse 1.4s cubic-bezier(.4,0,.6,1) infinite}@keyframes syncPulse{0%,to{box-shadow:0 0 0 0 rgba(34,197,94,.5);opacity:1}50%{box-shadow:0 0 0 5px rgba(34,197,94,0);opacity:.8}}.editor-container>div{width:100%;max-width:860px;margin:0 auto;flex:1;background:#ffffff;border:1px solid rgba(148,163,184,.14);border-radius:14px;box-shadow:0 1px 3px rgba(15,23,42,.04),0 6px 16px rgba(15,23,42,.05),0 16px 40px rgba(15,23,42,.04);padding:40px 56px}.editor-container .ProseMirror{outline:none;min-height:100%;width:100%;line-height:1.7;font-size:18px;color:#1e293b;caret-color:#2563eb;font-weight:420}.editor-container .ProseMirror p{width:100%;display:block;margin:0 0 1em}.editor-container .ProseMirror h1{margin:1.4em 0 .5em;font-size:32px;font-weight:800;letter-spacing:-.6px;color:#0f172a}.editor-container .ProseMirror h2{margin:1.3em 0 .4em;font-size:24px;font-weight:700;letter-spacing:-.4px;color:#1e293b}.editor-container .ProseMirror h3{margin:1.2em 0 .4em;font-size:20px;font-weight:700;color:#1e293b}.editor-container .ProseMirror strong{color:#0f172a;font-weight:700}.editor-container .ProseMirror blockquote{border-left:3px solid #2563eb;margin:1em 0;padding:.4em 1em;color:#475569;background:rgba(37,99,235,.03);border-radius:0 8px 8px 0}.editor-container .ProseMirror hr{border:none;border-top:2px solid #e2e8f0;margin:2em 0}.editor-container .ProseMirror ol,.editor-container .ProseMirror ul{padding-left:1.4em;margin:0 0 1em}.editor-container .ProseMirror ul[data-type=taskList]{list-style:none;padding-left:0;margin:0 0 1em}.editor-container .ProseMirror ul[data-type=taskList] li{display:flex;align-items:flex-start;gap:8px;margin-bottom:4px}.editor-container .ProseMirror ul[data-type=taskList] li>label{flex-shrink:0;display:flex;align-items:center;margin-top:3px;cursor:pointer}.editor-container .ProseMirror ul[data-type=taskList] li>label input[type=checkbox]{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid #94a3b8;border-radius:4px;cursor:pointer;transition:all .15s ease;position:relative;background:#fff}.editor-container .ProseMirror ul[data-type=taskList] li>label input[type=checkbox]:hover{border-color:var(--accent);box-shadow:0 0 0 3px rgba(59,130,246,.1)}.editor-container .ProseMirror ul[data-type=taskList] li>label input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.editor-container .ProseMirror ul[data-type=taskList] li>label input[type=checkbox]:checked:after{content:"";position:absolute;left:4px;top:1px;width:6px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}.editor-container .ProseMirror ul[data-type=taskList] li>div{flex:1;min-width:0}.editor-container .ProseMirror ul[data-type=taskList] li[data-checked=true]>div{text-decoration:line-through;opacity:.5}.editor-container .ProseMirror ul[data-type=taskList] ul[data-type=taskList]{margin-top:4px;margin-left:24px}.code-block-wrapper{position:relative;margin:12px 0 16px}.code-block-wrapper pre{background:#f6f8fa;color:#24292e;font-family:JetBrains Mono,Fira Code,Cascadia Code,ui-monospace,monospace;font-size:13px;line-height:1.7;padding:16px 48px 16px 20px;border-radius:8px;overflow-x:auto;-moz-tab-size:2;-o-tab-size:2;tab-size:2;border:1px solid #d1d5db;margin:0}.code-block-wrapper pre code{background:none;color:inherit;font-size:inherit;padding:0;border-radius:0;border:none}.code-copy-btn{position:absolute;top:8px;right:8px;z-index:2;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.04);border:1px solid rgba(0,0,0,.1);border-radius:6px;color:#6e7781;cursor:pointer;transition:all .15s ease;padding:0}.code-copy-btn:hover{background:rgba(0,0,0,.08);color:#24292e;border-color:rgba(0,0,0,.2)}.code-copy-btn.copied{color:#1a7f37;background:rgba(26,127,55,.1);border-color:rgba(26,127,55,.25)}.code-block-wrapper .hljs-keyword,.code-block-wrapper .hljs-operator,.code-block-wrapper .hljs-selector-tag{color:#cf222e;font-weight:500}.code-block-wrapper .hljs-addition,.code-block-wrapper .hljs-string,.code-block-wrapper .hljs-template-string,.code-block-wrapper .hljs-template-tag{color:#0a3069}.code-block-wrapper .hljs-attr,.code-block-wrapper .hljs-function,.code-block-wrapper .hljs-selector-id,.code-block-wrapper .hljs-title{color:#6639ba}.code-block-wrapper .hljs-literal,.code-block-wrapper .hljs-number,.code-block-wrapper .hljs-params,.code-block-wrapper .hljs-variable{color:#0550ae}.code-block-wrapper .hljs-comment,.code-block-wrapper .hljs-quote{color:#6e7781;font-style:italic}.code-block-wrapper .hljs-built_in,.code-block-wrapper .hljs-type{color:#953800}.code-block-wrapper .hljs-name,.code-block-wrapper .hljs-tag{color:#116329}.code-block-wrapper .hljs-link,.code-block-wrapper .hljs-regexp{color:#0a3069}.code-block-wrapper .hljs-deletion{color:#82071e;background:#ffebe9}.code-block-wrapper .hljs-emphasis{font-style:italic}.code-block-wrapper .hljs-strong{font-weight:700}.editor-container .ProseMirror :not(pre)>code{background:rgba(59,130,246,.08);color:#1d4ed8;font-family:JetBrains Mono,Fira Code,monospace;font-size:.88em;padding:2px 6px;border-radius:5px;border:1px solid rgba(59,130,246,.12)}.editor-container .ProseMirror img{max-width:100%;height:auto;border-radius:10px;margin:12px 0;border:1px solid rgba(148,163,184,.2);box-shadow:0 2px 8px rgba(0,0,0,.06);transition:box-shadow .2s ease;cursor:default}.editor-container .ProseMirror img:hover{box-shadow:0 4px 16px rgba(0,0,0,.1)}.editor-container .ProseMirror img.ProseMirror-selectednode{outline:2px solid var(--accent);outline-offset:2px}.copy-easy{display:inline-flex;align-items:center;gap:5px;border:1px dashed rgba(37,99,235,.4);border-radius:8px;padding:2px 6px;margin-right:6px;font-style:italic;background:rgba(59,130,246,.06);color:var(--accent-hover);max-width:100%}.copy-easy-text{display:inline}.copy-easy-icon{width:16px;height:16px;display:inline-block;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='9' width='13' height='13' rx='3'/%3E%3Crect x='2' y='2' width='13' height='13' rx='3'/%3E%3C/svg%3E") no-repeat 50%/contain;opacity:.7;cursor:pointer;margin-left:2px;transition:opacity var(--transition)}.copy-easy-icon:hover{opacity:1}.copy-toast{position:fixed;right:24px;bottom:24px;background:linear-gradient(135deg,var(--accent),#4f46e5);color:#ffffff;padding:10px 18px;border-radius:999px;font-weight:600;font-size:13px;box-shadow:0 10px 28px rgba(37,99,235,.32);z-index:30;animation:toastIn .3s ease}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.note-card.deleting{animation:slideOut .3s ease forwards;pointer-events:none}@keyframes slideOut{0%{opacity:1;transform:translateX(0);max-height:60px}60%{opacity:0;transform:translateX(-40px);max-height:60px}to{opacity:0;transform:translateX(-40px);max-height:0;padding:0 12px;margin:0;overflow:hidden}}.delete-toast{position:fixed;right:24px;bottom:24px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#ffffff;padding:10px 18px;font-size:13px;box-shadow:0 10px 28px rgba(239,68,68,.32);z-index:30;display:flex;align-items:center;gap:8px;animation:toastIn .3s ease}.delete-toast,.status-pill{border-radius:999px;font-weight:600}.status-pill{font-size:12px;color:var(--accent);background:rgba(37,99,235,.1);padding:5px 12px}.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);align-items:center;justify-content:center;z-index:20;animation:fadeIn .2s ease}.modal,.modal-overlay{display:flex;padding:24px}.modal{background:var(--surface);border-radius:var(--radius-lg);width:min(680px,100%);box-shadow:var(--shadow-lg);flex-direction:column;gap:18px;animation:modalIn .25s ease}@keyframes modalIn{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;justify-content:space-between;gap:16px;align-items:center}.modal-header h2{margin:0 0 4px;font-size:20px;font-weight:700;letter-spacing:-.3px}.modal-header p{margin:0;color:var(--text-secondary);font-size:14px}.icon-button{border:none;background:rgba(148,163,184,.15);width:34px;height:34px;border-radius:50%;cursor:pointer;font-weight:600;display:grid;place-items:center;transition:all var(--transition);flex-shrink:0}.icon-button:hover{background:rgba(148,163,184,.3)}.modal-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.confirm-modal{width:min(420px,100%);text-align:center;padding:32px 24px 24px;gap:20px}.confirm-modal h2{margin:0;font-size:20px;font-weight:700;color:var(--text-color)}.confirm-modal p{margin:0 0 12px;color:var(--text-secondary);font-size:15px;line-height:1.5}.confirm-actions{display:flex;justify-content:center;gap:12px;margin-top:8px}.btn-cancel,.btn-delete{padding:10px 20px;border-radius:var(--radius);font-size:14px;font-weight:600;cursor:pointer;transition:all var(--transition);border:none}.btn-cancel{background:rgba(148,163,184,.15);color:var(--text-color)}.btn-cancel:hover{background:rgba(148,163,184,.25)}.btn-delete{background:#ef4444;color:white;box-shadow:0 4px 12px rgba(239,68,68,.2)}.btn-delete:hover{background:#dc2626;transform:translateY(-1px);box-shadow:0 6px 16px rgba(239,68,68,.3)}.btn-delete:active{transform:translateY(0)}.provider-card{border:1px solid var(--border);border-radius:16px;padding:16px;display:flex;align-items:center;gap:12px;text-align:left;background:var(--surface-alt);cursor:pointer;transition:all var(--transition)}.provider-card:not(:disabled):hover{border-color:rgba(37,99,235,.4);box-shadow:0 6px 16px rgba(37,99,235,.1);transform:translateY(-1px)}.provider-card:disabled{cursor:not-allowed;opacity:.6}.provider-card.active{border-color:rgba(37,99,235,.4);background:#eef2ff}.provider-card h3{margin:0 0 3px;font-size:15px;font-weight:600}.provider-card p{margin:0;color:var(--text-secondary);font-size:13px}.provider-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgba(37,99,235,.1);color:var(--accent-hover);font-weight:700;font-size:18px;flex-shrink:0}.provider-icon.onedrive{background:rgba(56,189,248,.12);color:#0284c7}.provider-pill{font-size:11px;font-weight:600;color:var(--violet);background:rgba(124,58,237,.1);padding:4px 10px;border-radius:999px;margin-left:auto;white-space:nowrap}.sync-status{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 16px;border-radius:14px;background:var(--surface-alt);border:1px solid var(--border)}.sync-status h4{margin:0 0 3px;font-size:14px}.sync-status p{margin:0;color:var(--text-secondary);font-size:13px}.toggle-switch{position:relative;width:44px;height:24px;border-radius:999px;background:rgba(148,163,184,.3);border:none;cursor:pointer;padding:0;flex-shrink:0;transition:background .25s ease}.toggle-switch.active{background:#10b981}.toggle-knob{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:white;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .25s ease}.toggle-switch.active .toggle-knob{transform:translateX(20px)}.modal-footer{display:flex;justify-content:flex-end}.modal-footer .ghost{border:1px solid var(--border);background:transparent;border-radius:10px;padding:8px 18px;cursor:pointer;font-weight:600;font-size:13px;transition:all var(--transition)}.modal-footer .ghost:hover{background:var(--surface-alt)}.status-group{display:flex;align-items:center;gap:12px}.copy-fab{position:absolute;right:16px;top:16px;width:36px;height:36px;border-radius:10px;border:none;background:rgba(37,99,235,.08);color:var(--accent-hover);display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 12px var(--accent-glow);transition:all var(--transition)}.copy-fab:hover{background:rgba(37,99,235,.15)}@media (max-width:960px){.app-shell{padding:14px;gap:12px}.note-layout{grid-template-columns:1fr;flex:unset}.header{flex-direction:column;align-items:flex-start}.editor-container{min-height:55vh}.editor-toolbar{flex-wrap:wrap}}@media (max-width:640px){.header h1{font-size:20px}.note-title{font-size:18px}.modal{padding:18px}.brand-logo{height:48px}}.dropdown-wrapper{position:relative}.dropdown-backdrop{position:fixed;inset:0;z-index:90}.dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);min-width:240px;padding:6px;z-index:100;animation:modalIn .15s ease}.dropdown-section{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);padding:8px 12px 4px}.dropdown-divider{height:1px;background:var(--border);margin:4px 0}.dropdown-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:none;border-radius:8px;background:transparent;color:var(--text-primary);font-size:13px;font-weight:500;cursor:pointer;transition:all var(--transition);text-align:left}.dropdown-menu button:hover{background:rgba(37,99,235,.08);color:var(--accent)}.dropdown-menu button:disabled{opacity:.4;cursor:not-allowed}.dropdown-menu button:disabled:hover{background:transparent;color:var(--text-primary)}.dropdown-menu button svg{flex-shrink:0;opacity:.6}.hidden-input{display:none}.help-btn{width:28px!important;height:28px!important;border-radius:50%!important;color:var(--text-secondary)!important;opacity:.6;transition:all var(--transition)}.help-btn:hover{opacity:1;color:var(--accent)!important;background:rgba(37,99,235,.08)!important}.tut-modal{background:var(--surface);border-radius:16px;width:min(860px,95vw);max-height:90vh;box-shadow:0 24px 80px rgba(0,0,0,.18);display:flex;flex-direction:column;animation:modalIn .3s ease;overflow:hidden}.tut-header{justify-content:space-between;padding:20px 24px 12px}.tut-header,.tut-header-left{display:flex;align-items:center}.tut-header-left{gap:12px}.tut-logo{font-size:28px;line-height:1}.tut-header h2{margin:0;font-size:18px;font-weight:700;letter-spacing:-.3px}.tut-subtitle{margin:2px 0 0;font-size:13px;color:var(--text-secondary)}.tut-progress-bar{height:3px;background:var(--border);margin:0 24px;border-radius:99px;overflow:hidden}.tut-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),#6366f1);border-radius:99px;transition:width .3s ease}.tut-body{display:flex;flex:1;min-height:0;overflow:hidden}.tut-nav{width:220px;flex-shrink:0;border-right:1px solid var(--border);padding:12px 8px;overflow-y:auto;background:var(--surface-alt)}.tut-nav-category{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-secondary);padding:10px 10px 4px;margin-top:4px}.tut-nav-item{display:flex;align-items:center;gap:8px;width:100%;padding:7px 10px;border:none;border-radius:8px;background:transparent;cursor:pointer;font-size:13px;color:#64748b;text-align:left;transition:all .15s ease}.tut-nav-item:hover{background:rgba(59,130,246,.06);color:#334155}.tut-nav-item.active{background:rgba(59,130,246,.1);color:var(--accent);font-weight:600}.tut-nav-item.done{color:#94a3b8}.tut-nav-icon{font-size:15px;flex-shrink:0}.tut-nav-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tut-nav-check{font-size:12px;color:#4ade80;font-weight:700}.tut-content{flex:1;padding:24px 28px;overflow-y:auto;animation:tutFadeIn .25s ease}@keyframes tutFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.tut-step-badge{display:inline-block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--accent);background:rgba(37,99,235,.08);padding:3px 10px;border-radius:99px;margin-bottom:10px}.tut-step-title{font-size:20px;font-weight:700;margin:0 0 6px;display:flex;align-items:center;gap:8px;letter-spacing:-.3px}.tut-step-icon{font-size:22px}.tut-step-desc{margin:0 0 20px;color:var(--text-secondary);font-size:14px;line-height:1.5}.tut-step-visual{border:1px solid var(--border);border-radius:12px;padding:20px}.tut-footer,.tut-step-visual{background:var(--surface-alt)}.tut-footer{display:flex;justify-content:space-between;align-items:center;padding:14px 24px;border-top:1px solid var(--border)}.tut-footer-counter{font-size:13px;color:var(--text-secondary);font-weight:500}.tut-footer-actions{display:flex;gap:10px}.tut-footer-actions button{border:none;border-radius:8px;padding:8px 18px;font-weight:600;font-size:13px;background:var(--accent);color:#fff;cursor:pointer;transition:all .15s ease}.tut-footer-actions button:hover{background:var(--accent-hover);transform:translateY(-1px)}.tut-footer-actions button.ghost{background:transparent;color:var(--text-secondary);border:1px solid var(--border)}.tut-footer-actions button.ghost:hover{background:var(--surface);color:#0f172a}.tut-footer-actions button:disabled{opacity:.35;cursor:not-allowed;transform:none}.tut-done-btn{background:linear-gradient(135deg,var(--accent),#6366f1)!important;box-shadow:0 2px 12px rgba(99,102,241,.3)}.tut-hint{font-size:12px;color:#6d28d9;background:rgba(124,58,237,.06);padding:8px 12px;border-radius:8px;border-left:3px solid #7c3aed;margin-top:12px}.tut-hint kbd{background:rgba(124,58,237,.12);padding:1px 6px;border-radius:4px;font-family:inherit;font-size:11px;font-weight:600}.tut-visual-notes{display:flex;flex-direction:column;gap:12px}.tut-sidebar-mock{background:#fff;border:1px solid var(--border);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:6px}.tut-search-mock{display:flex;align-items:center;gap:6px;padding:8px 10px;background:var(--surface-alt);border-radius:8px;font-size:12px;color:#94a3b8}.tut-search-icon{font-size:13px}.tut-new-btn-mock{padding:8px;text-align:center;background:var(--accent);color:#fff;border-radius:8px;font-size:12px;font-weight:600}.tut-note-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;font-size:12px;transition:background .15s}.tut-note-item.active{background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.2)}.tut-note-icon{font-size:16px}.tut-note-name{font-weight:600;color:#1e293b}.tut-note-date{font-size:11px;color:#94a3b8}.tut-keys{font-size:12px;color:#64748b;text-align:center}.tut-keys kbd{background:rgba(59,130,246,.08);padding:2px 6px;border-radius:4px;font-family:inherit;font-size:11px;border:1px solid rgba(59,130,246,.15)}.tut-visual-formatting{display:flex;flex-direction:column;gap:14px}.tut-toolbar-mock{display:flex;align-items:center;gap:4px;padding:6px 10px;background:#fff;border:1px solid var(--border);border-radius:8px;width:-moz-fit-content;width:fit-content}.tut-tb{width:28px;height:28px;display:grid;place-items:center;font-size:13px;font-weight:700;color:#94a3b8;border-radius:6px}.tut-tb.active{background:rgba(59,130,246,.1);color:var(--accent)}.tut-tb-divider{width:1px;height:16px;background:var(--border);margin:0 4px}.tut-demo-text{font-size:14px;line-height:1.6;color:#334155}.tut-demo-text p{margin:0 0 6px}.tut-inline-code{background:rgba(59,130,246,.08);color:#1d4ed8;padding:1px 5px;border-radius:4px;font-family:JetBrains Mono,monospace;font-size:12px;border:1px solid rgba(59,130,246,.12)}.tut-visual-lists{display:flex;flex-direction:column;gap:8px}.tut-list-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.tut-list-col{background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px}.tut-list-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--accent);margin-bottom:8px}.tut-mock-ol,.tut-mock-ul{padding-left:18px;margin:0;font-size:13px;color:#334155;line-height:1.8}.tut-mock-tasks{display:flex;flex-direction:column;gap:4px}.tut-mock-tasks label{display:flex;align-items:center;gap:6px;font-size:13px;color:#334155;cursor:default}.tut-mock-tasks input[type=checkbox]{accent-color:var(--accent);width:14px;height:14px}.tut-mock-tasks .done{text-decoration:line-through;opacity:.5}.tut-visual-code{display:flex;flex-direction:column;gap:10px}.tut-code-block-mock{position:relative;background:#1e293b;border-radius:10px;padding:16px 48px 16px 20px;overflow:hidden}.tut-code-block-mock pre{margin:0;color:#e2e8f0;font-family:JetBrains Mono,monospace;font-size:12px;line-height:1.7;white-space:pre-wrap}.tut-code-block-mock code{color:inherit;background:none;font-size:inherit;padding:0;border:none}.tut-code-copy-mock{position:absolute;top:8px;right:8px;width:28px;height:28px;display:grid;place-items:center;background:rgba(148,163,184,.15);border:1px solid rgba(148,163,184,.2);border-radius:6px;font-size:12px}.tut-visual-smartpaste{display:flex;flex-direction:column;gap:10px}.tut-paste-examples{display:flex;flex-direction:column;gap:8px}.tut-paste-row{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#fff;border:1px solid var(--border);border-radius:10px}.tut-paste-label{display:flex;align-items:center;gap:8px;flex:1;font-size:13px;color:#334155}.tut-paste-badge{font-size:10px;font-weight:700;text-transform:uppercase;padding:2px 8px;border-radius:4px;letter-spacing:.5px}.tut-paste-badge.json{background:#fef3c7;color:#92400e}.tut-paste-badge.code{background:#e0e7ff;color:#3730a3}.tut-paste-badge.link{background:#d1fae5;color:#065f46}.tut-paste-arrow{color:var(--accent);font-weight:700}.tut-paste-result{font-size:12px;color:#64748b;flex:1}.tut-visual-linkpreview{display:flex;flex-direction:column;gap:12px}.tut-link-card-mock{display:flex;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:#fff}.tut-link-img-mock{width:120px;background:linear-gradient(135deg,#e0e7ff,#c7d2fe);flex-shrink:0}.tut-link-info{padding:12px 14px;display:flex;flex-direction:column;gap:4px}.tut-link-site{display:flex;align-items:center;gap:4px;font-size:11px;color:#94a3b8}.tut-link-favicon{font-size:12px}.tut-link-title{font-size:14px;font-weight:600;color:#1e293b}.tut-link-desc{font-size:12px;color:#64748b;line-height:1.4}.tut-visual-images{display:flex;flex-direction:column}.tut-image-methods{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tut-method-card{text-align:center;padding:16px 12px;background:#fff;border:1px solid var(--border);border-radius:10px;transition:all .15s ease}.tut-method-card:hover{border-color:var(--accent);box-shadow:0 2px 12px rgba(59,130,246,.08)}.tut-method-icon{font-size:24px;margin-bottom:6px}.tut-method-title{font-size:13px;font-weight:600;color:#1e293b}.tut-method-desc{font-size:11px;color:#94a3b8;margin-top:2px}.tut-visual-copyeasy{display:flex;flex-direction:column;gap:14px}.tut-ce-steps{justify-content:center}.tut-ce-step,.tut-ce-steps{display:flex;align-items:center;gap:8px}.tut-ce-step{padding:10px 14px;background:#fff;border:1px solid var(--border);border-radius:10px;font-size:13px;color:#334155}.tut-ce-num{width:22px;height:22px;display:grid;place-items:center;background:var(--accent);color:#fff;border-radius:99px;font-size:11px;font-weight:700;flex-shrink:0}.tut-ce-arrow{color:var(--accent);font-weight:700;font-size:16px}.tut-ce-icon{display:inline-flex;background:rgba(59,130,246,.1);padding:1px 4px;border-radius:4px;font-size:12px}.tut-ce-demo{text-align:center;font-size:14px;color:#475569;padding:12px;background:#fff;border:1px solid var(--border);border-radius:10px}.tut-ce-marked{display:inline-flex;align-items:center;gap:4px;border:1px dashed rgba(37,99,235,.4);border-radius:6px;padding:2px 8px;background:rgba(59,130,246,.05);color:var(--accent-hover);font-weight:600;font-style:italic}.tut-ce-copy-icon{font-size:12px;cursor:pointer}.tut-visual-sync{display:flex;flex-direction:column;gap:14px}.tut-sync-flow{display:flex;align-items:center;justify-content:center;gap:12px}.tut-sync-cloud,.tut-sync-device{text-align:center;padding:12px 16px;border-radius:10px;font-size:12px;font-weight:600;color:#334155}.tut-sync-device{background:#fff;border:1px solid var(--border)}.tut-sync-cloud{background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.2);color:var(--accent)}.tut-cloud-icon,.tut-device-icon{font-size:24px;margin-bottom:4px;display:block}.tut-sync-arrows{display:flex;flex-direction:column;color:var(--accent);font-weight:700;font-size:14px;line-height:1;gap:2px}.tut-sync-features{display:flex;justify-content:center;gap:16px;font-size:12px;color:#64748b}.tut-visual-export{display:flex;flex-direction:column}.tut-export-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.tut-export-card{text-align:center;padding:14px 10px;background:#fff;border:1px solid var(--border);border-radius:10px;transition:all .15s ease}.tut-export-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 4px 14px rgba(59,130,246,.08)}.tut-export-card.import{background:rgba(59,130,246,.04);border-color:rgba(59,130,246,.2)}.tut-export-icon{font-size:22px;margin-bottom:4px}.tut-export-format{font-size:13px;font-weight:700;color:#1e293b}.tut-export-info{font-size:11px;color:#94a3b8;margin-top:2px}.link-preview-card{display:flex;border:1px solid rgba(148,163,184,.25);border-radius:12px;overflow:hidden;margin:12px 0;text-decoration:none;color:inherit;transition:all .2s ease;background:#fff;max-width:600px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.04)}.link-preview-card:hover{border-color:var(--accent);box-shadow:0 4px 16px rgba(59,130,246,.1);transform:translateY(-1px)}.link-preview-image{width:160px;min-height:100px;flex-shrink:0;overflow:hidden;background:#f1f5f9}.link-preview-image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border:none;border-radius:0;margin:0;box-shadow:none}.link-preview-content{padding:14px 16px;flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.link-preview-site{display:flex;align-items:center;gap:6px;font-size:12px;color:#64748b}.link-preview-favicon{width:16px;height:16px;border-radius:2px;border:none!important;box-shadow:none!important;margin:0!important}.link-preview-title{font-size:15px;font-weight:600;color:#1e293b;line-height:1.3}.link-preview-desc,.link-preview-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.link-preview-desc{font-size:13px;color:#64748b;line-height:1.4}.link-preview-loading{padding:16px;display:flex;flex-direction:column;gap:10px;width:100%}.link-preview-shimmer{height:14px;border-radius:6px;background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.link-preview-shimmer.short{width:60%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (max-width:768px){.note-layout{flex-direction:column}.sidebar{width:100%;height:35vh;min-height:200px;border-right:none;border-bottom:1px solid var(--border);padding:12px}.header{height:auto;padding:16px;flex-wrap:wrap;gap:12px}.note-meta,.title-row{width:100%;justify-content:space-between}.editor-header{padding:20px 20px 10px}.editor-toolbar{padding:8px 16px;gap:6px;overflow-x:auto;flex-wrap:wrap}.editor-container{padding:16px 20px}.note-title{font-size:28px}}.user-chip-wrapper{position:relative}.user-chip{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border-radius:999px;border:1px solid rgba(148,163,184,.2);background:#fff;box-shadow:0 1px 3px rgba(15,23,42,.05);cursor:pointer;font-size:13px;font-weight:500;color:#1e293b;max-width:160px;transition:border-color .15s,box-shadow .15s}.user-chip:hover{border-color:rgba(148,163,184,.4);box-shadow:0 2px 8px rgba(15,23,42,.08)}.user-chip-avatar{-o-object-fit:cover;object-fit:cover}.user-chip-avatar,.user-chip-initial{width:28px;height:28px;border-radius:50%;flex-shrink:0}.user-chip-initial{background:linear-gradient(135deg,#3b82f6,#6366f1);color:#fff;font-weight:700;font-size:13px;display:grid;place-items:center}.user-chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:80px}.user-chip-pro{font-size:10px;font-weight:700;letter-spacing:.4px;background:linear-gradient(135deg,#3b82f6,#6366f1);color:#fff;padding:2px 6px;border-radius:999px;flex-shrink:0}.user-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:210px;background:#ffffff;border:1px solid rgba(148,163,184,.18);border-radius:12px;box-shadow:0 8px 24px rgba(15,23,42,.1),0 2px 8px rgba(15,23,42,.06);z-index:300;overflow:hidden;animation:tipSlideIn .2s cubic-bezier(.16,1,.3,1)}.user-menu-email{font-size:12px;color:#64748b;padding:12px 14px 6px;font-weight:500;word-break:break-all}.user-menu-pro-badge{font-size:11px;font-weight:700;color:#2563eb;background:rgba(37,99,235,.07);margin:2px 10px 6px;padding:3px 10px;border-radius:999px;display:inline-block}.user-menu-divider{height:1px;background:rgba(148,163,184,.15);margin:4px 0}.user-menu-signout{display:flex;align-items:center;gap:8px;width:100%;padding:10px 14px;border:none;background:none;font-size:13px;font-weight:600;color:#ef4444;cursor:pointer;transition:background .15s;text-align:left}.user-menu-signout:hover{background:rgba(239,68,68,.06)}.paywall-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px;animation:fadeIn .2s ease}.paywall-modal{background:#ffffff;border-radius:20px;padding:40px;max-width:480px;width:100%;text-align:center;box-shadow:0 4px 16px rgba(15,23,42,.08),0 24px 56px rgba(15,23,42,.14);position:relative;animation:slideUp .3s cubic-bezier(.16,1,.3,1)}@keyframes slideUp{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.paywall-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:16px;color:#94a3b8;cursor:pointer;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;transition:all .2s}.paywall-close:hover{color:#475569;background:#f1f5f9}.paywall-icon{font-size:48px;margin-bottom:12px}.paywall-avatar{width:64px;height:64px;border-radius:50%;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;border:3px solid #e2e8f0}.paywall-avatar-fallback{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;font-size:24px;font-weight:700;letter-spacing:-.5px}.paywall-title{font-size:22px;font-weight:800;color:#0f172a;margin:0 0 12px;letter-spacing:-.4px}.paywall-desc{font-size:14px;line-height:1.6;color:#475569;margin:0 0 24px}.paywall-price-card{background:#f8fafc;border:1px solid rgba(148,163,184,.2);border-radius:14px;padding:20px 24px;margin:0 0 24px;text-align:center}.paywall-price-label{font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:#94a3b8;margin-bottom:4px}.paywall-price{font-size:32px;font-weight:800;color:#0f172a;letter-spacing:-.6px;margin-bottom:12px}.paywall-price span{font-size:14px;font-weight:500;color:#64748b}.paywall-price-original{font-size:18px;font-weight:500;color:#94a3b8;text-decoration:line-through;text-decoration-color:#f87171;margin-right:2px}.paywall-price-sub{font-size:11.5px;color:#2563eb;font-weight:500;margin:4px 0 14px;letter-spacing:.1px}.paywall-early-bird{display:flex;flex-direction:column;align-items:center;gap:6px;background:linear-gradient(135deg,#eff6ff,#f0fdf4);border:1px solid #bfdbfe;border-radius:12px;padding:14px 20px;margin:0 0 20px}.paywall-early-bird-badge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:#2563eb;background:#dbeafe;padding:3px 10px;border-radius:999px}.paywall-early-bird-price{font-size:26px;font-weight:800;color:#0f172a;letter-spacing:-.5px}.paywall-early-bird-original{font-size:16px;font-weight:500;color:#94a3b8;text-decoration:line-through;text-decoration-color:#f87171;margin-right:4px}.paywall-early-bird-sub{font-size:12px;color:#475569;font-weight:500}.paywall-features{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:14px;color:#334155;font-weight:500}.paywall-actions{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.paywall-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:14px 20px;border-radius:12px;border:none;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;font-size:15px;font-weight:700;cursor:pointer;text-decoration:none;box-shadow:0 4px 14px rgba(37,99,235,.35);transition:all .2s cubic-bezier(.16,1,.3,1)}.paywall-btn-primary:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 8px 24px rgba(37,99,235,.45)}.paywall-btn-primary:active{transform:translateY(0) scale(.98)}.paywall-footnote{font-size:12px;color:#94a3b8;margin:0;line-height:1.5}.legal-shell{min-height:100vh;background:#F1F3F5;display:flex;flex-direction:column;font-family:Inter,system-ui,sans-serif}.legal-header{background:#fff;border-bottom:1px solid rgba(148,163,184,.15);padding:16px 32px;display:flex;align-items:center}.legal-logo:hover{opacity:.8}.legal-main{flex:1;display:flex;justify-content:center;padding:48px 24px}.legal-card{background:#fff;border-radius:16px;border:1px solid rgba(148,163,184,.14);box-shadow:0 1px 3px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.05);padding:48px 56px;width:100%;max-width:720px}.legal-title{font-size:28px;font-weight:800;color:#0f172a;margin:0 0 36px;letter-spacing:-.5px;padding-bottom:20px;border-bottom:1px solid #f1f5f9}.legal-sections{display:flex;flex-direction:column;gap:28px}.legal-section-title{font-size:15px;font-weight:700;color:#1e293b;margin:0 0 6px}.legal-section-num{color:var(--accent);font-weight:800}.legal-section-body{font-size:14px;line-height:1.75;color:#475569;margin:0}.legal-footer{padding:20px 32px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:13px;color:#94a3b8;border-top:1px solid rgba(148,163,184,.12);background:#fff}.legal-footer a{color:#64748b;text-decoration:none;font-weight:500;transition:color .15s}.legal-footer a:hover{color:var(--accent)}@media (max-width:640px){.legal-card{padding:32px 24px}.legal-title{font-size:22px}}.storage-info{flex-shrink:0;margin:0 -4px;padding:10px 12px;background:linear-gradient(135deg,#fffbeb,#fefce8);border:1px solid rgba(245,158,11,.2);border-radius:10px;display:flex;flex-direction:column;gap:5px}.storage-info-header{display:flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:#92400e;letter-spacing:.1px}.storage-info-close{margin-left:auto;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:5px;border:none;background:none;color:#b45309;cursor:pointer;flex-shrink:0;opacity:.7;transition:opacity .15s,background .15s}.storage-info-close:hover{opacity:1;background:rgba(180,83,9,.1)}.storage-info-body{font-size:11px;line-height:1.55;color:#78350f;margin:0}.storage-info-body strong{font-weight:700;color:#92400e}.storage-info-cta{display:inline-flex;align-items:center;gap:4px;align-self:flex-start;font-size:11px;font-weight:600;color:#2563eb;background:rgba(37,99,235,.07);border:1px solid rgba(37,99,235,.18);border-radius:6px;padding:3px 8px;cursor:pointer;transition:all .15s ease;margin-top:2px}.storage-info-cta:hover{background:rgba(37,99,235,.12);border-color:rgba(37,99,235,.3);transform:translateX(1px)}.sidebar-legal{display:flex;align-items:center;flex-direction:row;gap:0;padding:12px 4px 16px;margin-top:4px;border-top:1px solid rgba(148,163,184,.18);flex-shrink:0}.sidebar-legal a{font-size:11px;font-weight:500;color:#b0bec5;text-decoration:none;transition:color .15s ease,text-decoration-color .15s ease;letter-spacing:.1px;padding:2px 6px;border-radius:4px;text-underline-offset:3px}.sidebar-legal a:hover{color:#475569;text-decoration:underline;text-decoration-color:rgba(71,85,105,.35)}.sidebar-legal span{font-size:10px;color:#dde1e7;line-height:1;-webkit-user-select:none;-moz-user-select:none;user-select:none}.conflict-overlay{position:fixed;inset:0;background:rgba(15,23,42,.6);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:16px}.conflict-modal{background:#ffffff;border-radius:18px;box-shadow:0 24px 64px rgba(15,23,42,.18),0 4px 16px rgba(15,23,42,.1);width:100%;max-width:680px;max-height:90dvh;overflow-y:auto;animation:slideUp .3s cubic-bezier(.16,1,.3,1)}.conflict-header{display:flex;align-items:flex-start;gap:14px;padding:24px 24px 0}.conflict-header-icon{font-size:28px;flex-shrink:0;line-height:1;margin-top:2px}.conflict-title{font-size:18px;font-weight:800;color:#0f172a;margin:0 0 4px;letter-spacing:-.3px}.conflict-subtitle{font-size:13px;color:#64748b;margin:0;line-height:1.5}.conflict-list{padding:16px 24px 24px;display:flex;flex-direction:column;gap:16px}.conflict-card{border:1px solid rgba(148,163,184,.2);border-radius:14px;overflow:hidden;background:#f8fafc}.conflict-note-title{padding:12px 16px;font-size:13px;font-weight:700;color:#0f172a;background:#f1f5f9;border-bottom:1px solid rgba(148,163,184,.15)}.conflict-versions{display:grid;grid-template-columns:1fr auto 1fr;gap:0}.conflict-version{padding:14px 16px;display:flex;flex-direction:column;gap:8px}.conflict-version-local{border-right:1px solid rgba(148,163,184,.15)}.conflict-version-label{display:flex;align-items:center;justify-content:space-between;gap:8px}.conflict-badge{font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px}.conflict-badge-local{background:rgba(99,102,241,.1);color:#4f46e5}.conflict-badge-cloud{background:rgba(37,99,235,.1);color:#2563eb}.conflict-version-time{font-size:11px;color:#94a3b8}.conflict-preview{color:#475569;line-height:1.55;flex:1;margin:0;background:#ffffff;border:1px solid rgba(148,163,184,.15);padding:8px 10px;min-height:60px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;line-clamp:4}.conflict-btn,.conflict-preview{font-size:12px;border-radius:8px}.conflict-btn{width:100%;padding:8px 12px;border:none;font-weight:700;cursor:pointer;transition:all .15s ease;margin-top:auto}.conflict-btn-local{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#ffffff;box-shadow:0 2px 6px rgba(99,102,241,.3)}.conflict-btn-local:hover{background:linear-gradient(135deg,#4f46e5,#4338ca);box-shadow:0 4px 12px rgba(99,102,241,.4);transform:translateY(-1px)}.conflict-btn-cloud{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#ffffff;box-shadow:0 2px 6px rgba(37,99,235,.3)}.conflict-btn-cloud:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 4px 12px rgba(37,99,235,.4);transform:translateY(-1px)}.conflict-vs{display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#94a3b8;letter-spacing:.5px;padding:0 6px;background:#f1f5f9}@media (max-width:640px){.header{height:auto;min-height:56px;padding:8px 12px;gap:8px;flex-wrap:nowrap}.brand-logo{height:38px}.note-meta .pill,.note-meta>span:not(.dropdown-wrapper):not(.guide-btn-wrapper){display:none}.note-meta{gap:6px}.btn-import,.btn-import span{font-size:0;padding:7px 10px;gap:0}.btn-import svg{width:18px;height:18px;font-size:medium}.btn-sync{padding:7px 10px;font-size:0;gap:0}.btn-sync svg{width:18px;height:18px;font-size:medium}.guide-btn{padding:6px 10px;font-size:0;gap:0}.guide-btn svg{width:16px;height:16px;font-size:medium}.user-chip-name{display:none}.user-chip{padding:3px 6px 3px 3px;gap:4px}.note-layout{flex-direction:column}.sidebar{width:100%;height:auto;max-height:45vh;border-right:none;border-bottom:1px solid rgba(148,163,184,.18);padding:10px 12px 0;gap:8px}.note-list{max-height:28vh}.sidebar-legal{padding:8px 4px 10px}.storage-info{display:none}.panel:not(.sidebar){flex:1;min-height:0}.paywall-modal{margin:16px;padding:24px 20px;width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow-y:auto}.paywall-early-bird{padding:10px 14px}.legal-shell{padding:0}}@media (max-width:400px){.header{padding:6px 10px}.brand-logo{height:32px}}