:root{--on-primary:var(--main-primary,#6366f1);--on-primary-hover:var(--main-primary-dark,#4f46e5);--on-primary-light:#6366f114;--on-primary-border:#6366f133;--on-success:#10b981;--on-error:#ef4444;--on-text:#1e293b;--on-text-secondary:#475569;--on-text-muted:#64748b;--on-text-placeholder:#94a3b8;--on-bg:#fff;--on-bg-hover:#f8fafc;--on-bg-sidebar:#fff;--on-border:#e2e8f0;--on-border-light:#f1f5f9;--on-card-shadow:0 1px 3px #0000000f, 0 1px 2px #0000000a;--on-radius:var(--main-radius);--on-radius-lg:var(--main-radius-lg)}._on-container{background:var(--on-bg);border-radius:var(--on-radius-lg);max-width:1200px;min-height:600px;box-shadow:var(--on-card-shadow);border-style:solid;border-width:1px;border-color:var(--on-border);gap:0;margin:0 auto;display:flex;overflow:hidden}._on-main{flex-direction:column;flex:1;min-width:0;display:flex}._on-btn-icon{width:2rem;height:2rem;color:var(--on-text-muted);cursor:pointer;border-radius:var(--on-radius);background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}._on-btn-icon:hover{background:var(--on-bg-hover);color:var(--on-text)}._on-btn-icon._on-btn-delete:hover{color:var(--on-error);background:#ef444414}._on-btn-icon._on-btn-new{color:var(--on-primary)}._on-btn-icon._on-btn-new:hover{background:var(--on-primary-light)}._on-badge{color:var(--on-primary);background:var(--on-primary-light);border-radius:var(--main-radius-full,9999px);text-align:center;min-width:1.25rem;padding:.0625rem .4375rem;font-size:.6875rem;font-weight:600;line-height:1.4}._on-badge:empty{display:none}._on-status{color:var(--on-text-placeholder);white-space:nowrap;font-size:.6875rem}._on-status.is-saving{color:var(--on-primary)}._on-status.is-saved{color:var(--on-success)}._on-container.is-expanded{max-width:none;min-height:100vh;box-shadow:none;z-index:9998;border-width:0;border-radius:0;position:fixed;top:0;bottom:0;left:0;right:0}@media (max-width:768px){._on-container{min-height:auto;box-shadow:none;border-width:0;border-radius:0;flex-direction:column}._on-btn-icon{width:2.5rem;height:2.5rem}}@media (max-width:480px){._on-btn-icon{width:2.25rem;height:2.25rem}}._on-sidebar{border-right-style:solid;border-right-width:1px;border-right-color:var(--on-border);background:var(--on-bg-sidebar);flex-direction:column;flex-shrink:0;width:260px;display:flex}._on-sidebar.is-collapsed{display:none}._on-sidebar-header{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);justify-content:space-between;align-items:center;padding:.625rem .75rem;display:flex}._on-sidebar-title{align-items:center;gap:var(--main-space-2,.5rem);color:var(--on-text);letter-spacing:.02em;margin:0;font-size:.8125rem;font-weight:600;display:flex}._on-sidebar-title svg{color:var(--on-text-muted)}._on-sidebar-search{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);padding:.5rem .75rem}._on-search-input-wrap{border-radius:var(--on-radius);border-style:solid;border-width:1px;border-color:var(--on-border);background:var(--on-bg-hover);align-items:center;gap:.375rem;padding:.375rem .625rem;display:flex}._on-search-input-wrap svg{color:var(--on-text-placeholder);flex-shrink:0}._on-search-input{color:var(--on-text);background:0 0;border:none;outline:none;flex:1;min-width:0;padding:0;font-size:.75rem}._on-search-input::placeholder{color:var(--on-text-placeholder)}._on-note-list{flex:1;min-height:200px;overflow-y:auto}._on-note-item{cursor:pointer;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);align-items:center;gap:.5rem;padding:.5rem .75rem;display:flex}._on-note-item:last-child{border-bottom-width:0}._on-note-item:hover{background:var(--on-bg-hover)}._on-note-item.is-active{background:var(--on-primary-light)}._on-note-item-info{flex-direction:column;flex:1;gap:.125rem;min-width:0;display:flex}._on-note-item-title{color:var(--on-text);white-space:nowrap;text-overflow:ellipsis;font-size:.8125rem;font-weight:500;overflow:hidden}._on-note-item-meta{color:var(--on-text-muted);align-items:center;gap:.375rem;font-size:.6875rem;display:flex}._on-note-item-mode{color:var(--on-primary);background:var(--on-primary-light);border-radius:var(--main-radius-full,9999px);white-space:nowrap;align-items:center;gap:.1875rem;padding:.0625rem .375rem;font-size:.625rem;font-weight:500;display:inline-flex}._on-note-item-delete{width:1.25rem;height:1.25rem;color:var(--on-text-placeholder);cursor:pointer;border-radius:var(--on-radius);opacity:0;background:0 0;border:none;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}._on-note-item:hover ._on-note-item-delete{opacity:1}._on-note-item-delete:hover{color:var(--on-error);background:#ef444414}._on-note-list-empty{padding:var(--main-space-6,1.5rem) var(--main-space-3,.75rem);color:var(--on-text-placeholder);flex-direction:column;align-items:center;gap:.375rem;display:flex}._on-note-list-empty svg{opacity:.4}._on-note-list-empty p{margin:0;font-size:.75rem}@media (max-width:768px){._on-sidebar{border-bottom-style:solid;border-bottom-width:1px;border-right-width:0;border-bottom-color:var(--on-border);width:100%}._on-sidebar.is-collapsed{display:none}._on-sidebar-header{padding:.5rem .75rem}._on-search-input{font-size:1rem}._on-search-input-wrap{padding:.5rem .75rem}._on-note-list{-webkit-overflow-scrolling:touch;min-height:auto;max-height:240px}._on-note-item{gap:.625rem;padding:.625rem .75rem}._on-note-item-title{font-size:.875rem}._on-note-item-meta{font-size:.75rem}._on-note-item-delete{opacity:1;width:2rem;height:2rem}}@media (max-width:480px){._on-note-list{max-height:200px}}._on-toolbar{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem .75rem;display:flex}._on-toolbar-left{flex:1;align-items:center;gap:.375rem;min-width:0;display:flex}._on-title-input{color:var(--on-text);border-radius:var(--on-radius);background:0 0;border:none;outline:none;flex:1;min-width:0;padding:.25rem .375rem;font-size:.9375rem;font-weight:600}._on-title-input:focus{background:var(--on-bg-hover)}._on-title-input::placeholder{color:var(--on-text-placeholder);font-weight:400}._on-toolbar-right{flex-shrink:0;align-items:center;gap:.5rem;display:flex}._on-toolbar-actions{align-items:center;gap:.125rem;display:flex}._on-editor-tabs{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);align-items:center;gap:0;padding:0 .75rem;display:flex}._on-editor-tab{color:var(--on-text-muted);cursor:pointer;white-space:nowrap;background:0 0;border:none;align-items:center;gap:.375rem;padding:.5rem .75rem;font-size:.75rem;font-weight:500;display:inline-flex;position:relative}._on-editor-tab:after{content:"";background:0 0;border-radius:1px;height:2px;position:absolute;bottom:0;left:.375rem;right:.375rem}._on-editor-tab:hover{color:var(--on-text)}._on-editor-tab.is-active{color:var(--on-primary)}._on-editor-tab.is-active:after{background:var(--on-primary)}._on-editor-tab svg{flex-shrink:0}._on-editor-tabs-right{align-items:center;margin-left:auto;display:flex}._on-word-count{color:var(--on-text-muted);white-space:nowrap;padding:.5rem 0;font-size:.6875rem}@media (max-width:768px){._on-toolbar{flex-wrap:nowrap;gap:.25rem;padding:.375rem .5rem}._on-toolbar-left{gap:.25rem;min-width:0}._on-toolbar-right{gap:.25rem}._on-toolbar-actions{gap:0}._on-title-input{padding:.375rem .5rem;font-size:1rem}._on-status{display:none}._on-status.is-saving,._on-status.is-saved{font-size:.625rem;display:inline}._on-editor-tabs{scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:.125rem;padding:0 .5rem;overflow-x:auto}._on-editor-tabs::-webkit-scrollbar{display:none}._on-editor-tab span{display:none}._on-editor-tab{flex-shrink:0;min-height:2.5rem;padding:.625rem}._on-editor-tabs-right{flex-shrink:0}._on-word-count{font-size:.625rem}}@media (max-width:480px){._on-word-count{display:none}}._on-editor-wrap{flex-direction:column;flex:1;min-height:400px;display:flex}._on-editor-panel{flex:1;display:none}._on-editor-panel.is-active{flex-direction:column;display:flex}._on-editor-panel[data-panel=rich]{padding:0}._on-editor-panel[data-panel=rich] .tox-tinymce{flex:1;border-width:0!important;border-radius:0!important}._on-editor-panel[data-panel=rich] .tox .tox-toolbar-overlord{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light)}._on-textarea{width:100%;color:var(--on-text);resize:none;background:0 0;border:none;outline:none;flex:1;min-height:400px;padding:1rem 1.25rem;font-size:.875rem;line-height:1.75}._on-textarea::placeholder{color:var(--on-text-placeholder)}._on-textarea-mono{font-family:var(--main-font-mono,"SF Mono", "Fira Code", "Fira Mono", "Roboto Mono", monospace);-moz-tab-size:4;tab-size:4;font-size:.8125rem;line-height:1.7}@media (max-width:768px){._on-editor-wrap{min-height:320px}._on-textarea{-webkit-overflow-scrolling:touch;min-height:320px;padding:.875rem 1rem;font-size:1rem;line-height:1.65}._on-textarea-mono{font-size:.9375rem;line-height:1.6}}@media (max-width:480px){._on-editor-wrap{min-height:280px}._on-textarea{min-height:280px;padding:.75rem .875rem}}._on-md-split{flex:1;min-height:400px;display:flex}._on-md-editor{flex:1;min-width:0;display:flex}._on-md-editor ._on-textarea{flex:1}._on-md-preview{border-left-style:solid;border-left-width:1px;border-left-color:var(--on-border);flex-direction:column;flex:1;min-width:0;display:none;overflow:hidden}._on-md-split.is-preview-active ._on-md-preview{display:flex}._on-md-preview-header{color:var(--on-text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);background:var(--on-bg-hover);padding:.5rem 1rem;font-size:.6875rem;font-weight:600}._on-md-preview-body{color:var(--on-text);flex:1;padding:1rem 1.25rem;font-size:.875rem;line-height:1.75;overflow-y:auto}._on-md-preview-body h1{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);color:var(--on-text);margin:0 0 .75rem;padding-bottom:.375rem;font-size:1.5rem;font-weight:700}._on-md-preview-body h2{color:var(--on-text);margin:1.25rem 0 .5rem;font-size:1.25rem;font-weight:600}._on-md-preview-body h3{color:var(--on-text);margin:1rem 0 .375rem;font-size:1.0625rem;font-weight:600}._on-md-preview-body h4{color:var(--on-text);margin:.75rem 0 .25rem;font-size:.9375rem;font-weight:600}._on-md-preview-body p{margin:0 0 .75rem}._on-md-preview-body ul,._on-md-preview-body ol{margin:0 0 .75rem;padding-left:1.5rem}._on-md-preview-body li{margin-bottom:.25rem}._on-md-preview-body code{font-family:var(--main-font-mono);background:var(--on-bg-hover);color:var(--on-primary);border-radius:3px;padding:.125rem .375rem;font-size:.8125rem}._on-md-preview-body pre{background:var(--on-bg-hover);border-radius:var(--on-radius);border-style:solid;border-width:1px;border-color:var(--on-border-light);margin:0 0 .75rem;padding:.75rem 1rem;overflow-x:auto}._on-md-preview-body pre code{color:var(--on-text);background:0 0;padding:0}._on-md-preview-body blockquote{border-left-style:solid;border-left-width:3px;border-left-color:var(--on-primary);color:var(--on-text-secondary);background:var(--on-primary-light);border-radius:0 var(--on-radius) var(--on-radius) 0;margin:0 0 .75rem;padding:.5rem 1rem}._on-md-preview-body a{color:var(--on-primary);text-decoration:underline}._on-md-preview-body hr{border-width:1px 0 0;border-top-style:solid;border-top-color:var(--on-border);margin:1rem 0}._on-md-preview-body strong{color:var(--on-text);font-weight:600}._on-md-preview-body img{border-radius:var(--on-radius);max-width:100%}._on-btn-preview{color:var(--on-text-muted);cursor:pointer;border-radius:var(--on-radius);white-space:nowrap;background:0 0;border:none;align-items:center;gap:.25rem;margin-right:.5rem;padding:.25rem .5rem;font-size:.6875rem;font-weight:500;display:inline-flex}._on-btn-preview:hover{color:var(--on-text);background:var(--on-bg-hover)}._on-btn-preview.is-active{color:var(--on-primary);background:var(--on-primary-light)}._on-md-preview-empty{height:100%;color:var(--on-text-placeholder);flex-direction:column;justify-content:center;align-items:center;gap:.5rem;font-size:.8125rem;display:flex}._on-md-preview-empty svg{opacity:.3}@media (max-width:768px){._on-md-split{flex-direction:column;min-height:320px}._on-md-split.is-preview-active ._on-md-editor{flex:50%;min-height:180px;max-height:50vh}._on-md-split.is-preview-active ._on-md-preview{border-top-style:solid;border-top-width:1px;border-left-width:0;border-top-color:var(--on-border);flex:50%;min-height:180px}._on-md-preview-body{-webkit-overflow-scrolling:touch;padding:.875rem 1rem;font-size:1rem;line-height:1.65}._on-md-preview-header{padding:.5rem .875rem}._on-btn-preview{min-height:2.25rem;padding:.5rem .625rem;font-size:.75rem}}@media (max-width:480px){._on-md-preview-body{padding:.75rem .875rem}._on-md-preview-body h1{font-size:1.375rem}._on-md-preview-body h2{font-size:1.1875rem}}._on-sidebar-footer{border-top-style:solid;border-top-width:1px;border-top-color:var(--on-border-light);padding:.5rem .75rem}._on-storage-toggle{background:var(--on-bg-hover);border-radius:var(--on-radius);cursor:pointer;width:100%;color:var(--on-text-muted);border:none;align-items:center;gap:.375rem;padding:.375rem .5rem;font-size:.6875rem;font-weight:500;display:flex}._on-storage-heading{color:var(--on-text-placeholder);white-space:nowrap}._on-storage-toggle:hover{color:var(--on-text)}._on-storage-icon{align-items:center;display:flex}._on-storage-label{text-align:left;flex:1}._on-storage-toggle.is-cloud{color:var(--on-primary);background:var(--on-primary-light)}._on-storage-toggle.is-cloud:hover{color:var(--on-primary-hover)}._on-settings-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;opacity:0;visibility:hidden;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}._on-settings-overlay.is-active{opacity:1;visibility:visible}._on-settings-popup{background:var(--on-bg);border-radius:12px;width:90%;max-width:420px;overflow:hidden;box-shadow:0 20px 60px #0000004d}._on-settings-header{border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:var(--on-border-light);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}._on-settings-header h3{color:var(--on-text);align-items:center;gap:.5rem;margin:0;font-size:.9375rem;font-weight:600;display:flex}._on-settings-header h3 svg{color:var(--on-text-muted)}._on-settings-close{width:2rem;height:2rem;color:var(--on-text-muted);cursor:pointer;border-radius:var(--on-radius);background:0 0;border:none;justify-content:center;align-items:center;display:flex}._on-settings-close:hover{background:var(--on-bg-hover);color:var(--on-text)}._on-settings-body{padding:1rem 1.25rem 1.25rem}._on-settings-desc{color:var(--on-text-secondary);margin:0 0 1rem;font-size:.8125rem;line-height:1.5}._on-storage-options{flex-direction:column;gap:.5rem;display:flex}._on-storage-option{border-style:solid;border-width:2px;border-color:var(--on-border);border-radius:var(--on-radius-lg);cursor:pointer;background:var(--on-bg);align-items:center;gap:.75rem;padding:.75rem 1rem;display:flex}._on-storage-option:hover{border-color:var(--on-primary-border);background:var(--on-bg-hover)}._on-storage-option.is-active{border-color:var(--on-primary);background:var(--on-primary-light)}._on-storage-option-icon{background:var(--on-bg-hover);width:2.25rem;height:2.25rem;color:var(--on-text-muted);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}._on-storage-option.is-active ._on-storage-option-icon{background:var(--on-primary);color:#fff}._on-storage-option-info{flex:1;min-width:0}._on-storage-option-name{color:var(--on-text);font-size:.8125rem;font-weight:600}._on-storage-option-desc{color:var(--on-text-muted);margin-top:.125rem;font-size:.6875rem}._on-storage-option-check{color:var(--on-primary);flex-shrink:0;display:none}._on-storage-option.is-active ._on-storage-option-check{display:flex}@media (max-width:768px){._on-storage-toggle{min-height:2.25rem;padding:.5rem .625rem;font-size:.75rem}._on-settings-overlay{align-items:flex-end}._on-settings-popup{-webkit-overflow-scrolling:touch;border-bottom-right-radius:0;border-bottom-left-radius:0;width:100%;max-width:100%;max-height:90vh;overflow-y:auto}._on-settings-header{background:var(--on-bg);z-index:1;padding:.875rem 1rem;position:sticky;top:0}._on-settings-close{width:2.5rem;height:2.5rem}._on-settings-body{padding:.875rem 1rem 1.25rem}._on-storage-option{gap:.875rem;padding:.875rem 1rem}._on-storage-option-name{font-size:.875rem}._on-storage-option-desc{font-size:.75rem}}