@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";:root{--bg: #0D0D0F;--bg-elevated: #121214;--bg-hover: rgba(255, 255, 255, .04);--border: rgba(255, 255, 255, .06);--border-subtle: rgba(255, 255, 255, .03);--text-primary: #EDEDF0;--text-secondary: #8C8C94;--text-tertiary: #59595F;--accent: rgb(140, 115, 255);--accent-subtle: rgba(140, 115, 255, .15);--sidebar-width: 260px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color:var(--text-primary);background-color:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;margin:0;padding:0}body{height:100dvh;background-color:var(--bg);overflow:hidden}#root{height:100%}button{font-family:inherit;cursor:pointer;border:none;background:none}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input,textarea{font-family:inherit;background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);padding:10px 12px;font-size:14px}input:focus,textarea:focus{outline:none;border-color:var(--accent)}input::placeholder,textarea::placeholder{color:var(--text-tertiary)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff1a}.sidebar{width:var(--sidebar-width);height:100%;background:var(--bg-elevated);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0}.sidebar-overlay{display:none}.sidebar-header{display:flex;align-items:center;gap:8px;padding:20px 16px 16px}.sidebar-title{font-size:14px;font-weight:600;color:var(--text-primary);flex:1}.sidebar-add{padding:6px;color:var(--text-secondary);background:var(--bg-hover);border-radius:4px;transition:background .15s,color .15s;line-height:0}.sidebar-add:hover{background:#ffffff14;color:var(--text-primary)}.sidebar-divider{height:1px;background:var(--border);margin:0 16px 8px}.sidebar-create{padding:0 12px 8px}.sidebar-create input{width:100%;padding:8px 10px;font-size:13px}.sidebar-nav{flex:1;overflow-y:auto;padding:0 8px 16px}.sidebar-item{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:6px;cursor:pointer;transition:background .15s;touch-action:manipulation}.sidebar-item:hover,.sidebar-item.selected{background:var(--bg-hover)}.sidebar-item-icon{color:var(--text-tertiary);flex-shrink:0;margin-top:2px}.sidebar-item.selected .sidebar-item-icon{color:var(--text-secondary)}.sidebar-item-content{flex:1;min-width:0}.sidebar-item-title{display:block;font-size:13px;font-weight:500;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-item.selected .sidebar-item-title{color:var(--text-primary)}.sidebar-item-meta{display:block;font-size:11px;color:var(--text-tertiary);margin-top:2px}.sidebar-item-delete{padding:4px;color:var(--text-tertiary);border-radius:4px;opacity:0;transition:opacity .15s,background .15s,color .15s}.sidebar-item:hover .sidebar-item-delete{opacity:1}.sidebar-item-delete:hover{background:#ff646426;color:#ff6b6b}@media(max-width:768px){.sidebar{position:fixed;left:0;top:0;z-index:100;transform:translate(-100%);transition:transform .2s ease}.sidebar-open{transform:translate(0)}.sidebar-overlay{display:block;position:fixed;inset:0;background:#00000080;z-index:99}}.snippet-block{position:relative;border-radius:4px;transition:background .15s}.snippet-block:hover{background:var(--bg-hover)}.snippet-block.editing{background:transparent}.snippet-content{padding:10px 12px;font-size:15px;line-height:1.6;color:var(--text-primary);cursor:text;min-height:40px;word-wrap:break-word}.snippet-content strong{font-weight:600}.snippet-content em{font-style:italic}.snippet-textarea{width:100%;padding:10px 12px;font-size:15px;line-height:1.6;color:var(--text-primary);background:var(--bg-elevated);border:1px solid var(--accent);border-radius:4px;resize:none;overflow:hidden;font-family:inherit}.snippet-textarea:focus{outline:none}.snippet-delete{position:absolute;top:8px;right:8px;padding:6px;color:var(--text-tertiary);border-radius:4px;background:var(--bg-elevated);border:1px solid var(--border);transition:background .15s,color .15s}.snippet-delete:hover{background:#ff646426;color:#ff6b6b;border-color:#ff64644d}.snippet-content .snippet-header{font-size:18px;font-weight:600;line-height:1.3;color:var(--accent);margin:16px 0 8px}.snippet-content .snippet-header:first-child{margin-top:0}.snippet-content .snippet-subheader{font-size:15px;font-weight:600;line-height:1.4;color:var(--text-secondary);margin:12px 0 4px}.snippet-content .snippet-subheader:first-child{margin-top:0}.modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:200;padding:20px}.modal-content{width:100%;max-width:480px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;box-shadow:0 20px 60px #00000080}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}.modal-header h2{font-size:15px;font-weight:600;color:var(--text-primary);margin:0}.modal-close{padding:6px;color:var(--text-secondary);border-radius:4px;transition:background .15s,color .15s}.modal-close:hover{background:var(--bg-hover);color:var(--text-primary)}.modal-textarea{width:100%;padding:16px 20px;font-size:14px;line-height:1.6;color:var(--text-primary);background:transparent;border:none;border-bottom:1px solid var(--border);resize:none;font-family:inherit}.modal-textarea:focus{outline:none}.modal-textarea::placeholder{color:var(--text-tertiary)}.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding:16px 20px}.modal-btn{padding:10px 16px;font-size:13px;font-weight:500;border-radius:8px;transition:background .15s,opacity .15s}.modal-btn.secondary{color:var(--text-secondary);background:#ffffff0a;border:1px solid var(--border)}.modal-btn.secondary:hover{background:#ffffff14}.modal-btn.primary{color:#f5f5f5;background:linear-gradient(180deg,rgba(255,255,255,.08) 0%,transparent 100%),#2d2d30;border:1px solid rgba(255,255,255,.1)}.modal-btn.primary:hover{background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,transparent 100%),#3d3d40}.modal-btn.primary:disabled{opacity:.5;cursor:not-allowed}.organize-modal{width:100%;max-width:800px;max-height:80vh;background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;box-shadow:0 20px 60px #00000080;display:flex;flex-direction:column}.modal-header-title{display:flex;align-items:center;gap:8px;color:var(--accent)}.modal-header-title h2{font-size:15px;font-weight:600;color:var(--text-primary);margin:0}.organize-content{flex:1;overflow-y:auto;padding:20px;min-height:300px}.organize-loading,.organize-error{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:16px;color:var(--text-secondary)}.preview-columns{display:grid;grid-template-columns:1fr 1fr;gap:20px}.preview-column h3{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-tertiary);margin:0 0 12px}.preview-list{display:flex;flex-direction:column;gap:8px}.preview-list.current{opacity:.6}.preview-section{display:flex;flex-direction:column;gap:6px}.preview-header{font-size:13px;font-weight:600;color:var(--accent);padding:6px 10px;background:var(--accent-subtle);border-radius:4px;margin-top:8px}.preview-header:first-child{margin-top:0}.preview-snippet{font-size:12px;color:var(--text-secondary);padding:8px 10px;background:#ffffff05;border:1px solid var(--border-subtle);border-radius:4px;line-height:1.4}.organize-feedback{padding:0 20px 16px}.organize-feedback input{width:100%;padding:10px 12px;font-size:13px;color:var(--text-primary);background:#ffffff08;border:1px solid var(--border);border-radius:6px}.organize-feedback input:focus{outline:none;border-color:var(--accent)}.organize-feedback input::placeholder{color:var(--text-tertiary)}.modal-btn svg{vertical-align:-2px;margin-right:4px}@media(max-width:600px){.organize-modal{max-width:100%;max-height:100%;border-radius:0}.preview-columns{grid-template-columns:1fr}.preview-list.current{display:none}}.format-modal{width:100%;max-width:600px;max-height:80vh;background:var(--bg-elevated);border:1px solid var(--border);border-radius:12px;box-shadow:0 20px 60px #00000080;display:flex;flex-direction:column}.format-content{flex:1;overflow-y:auto;padding:20px;min-height:200px}.format-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:16px;color:var(--text-secondary)}.format-changes{display:flex;flex-direction:column;gap:16px}.format-change{border:1px solid var(--border);border-radius:8px;padding:12px}.format-diff{font-size:13px;line-height:1.5;color:var(--text-primary);white-space:pre-wrap}.diff-added{background:#64ff6433;color:#4ade80}.diff-removed{background:#ff646433;color:#f87171;text-decoration:line-through}@media(max-width:600px){.format-modal{max-width:100%;max-height:100%;border-radius:0}}.restore-modal{background:var(--bg-secondary);border-radius:12px;width:90%;max-width:500px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 40px #0000004d}.restore-content{flex:1;overflow-y:auto;padding:16px}.restore-loading,.restore-error,.restore-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;gap:12px;color:var(--text-secondary)}.restore-error{color:var(--error)}.backup-list{display:flex;flex-direction:column;gap:8px}.backup-item{display:flex;align-items:center;justify-content:space-between;padding:12px;background:var(--bg-primary);border-radius:8px;gap:12px}.backup-info{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.backup-date{font-size:14px;color:var(--text-primary)}.backup-reason{font-size:12px;color:var(--text-secondary)}.backup-snippets{font-size:12px;color:var(--text-tertiary)}.restore-btn{padding:8px 16px;background:var(--accent);color:#fff;border:none;border-radius:6px;font-size:13px;cursor:pointer;white-space:nowrap}.restore-btn:hover{opacity:.9}.insights-section{margin-bottom:40px;border-bottom:1px solid var(--border);padding-bottom:20px}.insights-header{display:flex;align-items:center;justify-content:space-between;padding:10px 0}.insights-title{color:var(--text-secondary);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.insights-actions{display:flex;gap:8px}.insights-error{padding:10px 12px;font-size:13px;color:#ff6b6b;background:#ff64641a;border-radius:6px;margin-bottom:16px}.insights-list{display:flex;flex-direction:column}.insight-item{padding:10px 0}.insight-item .snippet-header{font-size:13px;font-weight:600;line-height:1.3;color:#fff;margin:0 0 8px;text-transform:uppercase;letter-spacing:.5px}.insight-item .snippet-content{font-size:15px;line-height:1.6;color:var(--text-primary)}.insight-items{list-style:disc;padding-left:20px;margin:0}.insight-items li{font-size:15px;line-height:1.6;color:var(--text-primary);margin-bottom:8px}.page-detail{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.page-detail-content{flex:1;overflow-y:auto;padding:32px 24px 100px;max-width:800px;margin:0 auto;width:100%}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:32px}.page-title{font-size:32px;font-weight:700;color:var(--text-primary);margin:0;line-height:1.2;flex:1;cursor:text}.page-title-input{font-size:32px;font-weight:700;color:var(--text-primary);line-height:1.2;flex:1;background:transparent;border:none;outline:none;padding:0;margin:0;font-family:inherit;width:100%}.page-actions{display:flex;gap:8px;flex-shrink:0}.action-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;font-size:13px;font-weight:500;color:var(--text-secondary);background:#ffffff0a;border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:all .15s}.action-btn:hover{color:var(--text-primary);background:#ffffff14;border-color:var(--text-tertiary)}.action-btn.secondary{color:var(--text-tertiary);background:transparent;border-color:transparent}.action-btn.secondary:hover{color:var(--text-secondary);background:#ffffff0a;border-color:var(--border)}.page-empty{padding:48px 0;text-align:center}.page-empty p{color:var(--text-tertiary);font-size:15px}.snippets-header{display:flex;align-items:center;justify-content:space-between;padding:10px 0}.snippets-title{color:var(--text-secondary);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.snippets-actions{display:flex;gap:8px}.snippets-list{display:flex;flex-direction:column;gap:4px}.add-snippet-fab{position:absolute;bottom:24px;right:24px;width:48px;height:48px;border-radius:50%;background:var(--bg-elevated);border:1px solid var(--border);color:var(--text-primary);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000004d;transition:background .15s,transform .15s}.add-snippet-fab:hover{background:#ffffff14;transform:scale(1.05)}.add-snippet-fab:active{transform:scale(.95)}@media(max-width:768px){.page-detail-content{padding:24px 16px 100px}.page-header{flex-direction:column;gap:12px;margin-bottom:24px}.page-title,.page-title-input{font-size:24px}.page-actions{align-self:flex-start}.add-snippet-fab{bottom:16px;right:16px}}.user-menu{position:relative}.user-menu-trigger{display:flex;align-items:center;gap:6px;padding:4px 8px 4px 4px;border-radius:6px;transition:background .15s}.user-menu-trigger:hover{background:var(--bg-hover)}.user-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover}.user-avatar-placeholder{width:28px;height:28px;border-radius:50%;background:var(--accent-subtle);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}.user-menu-chevron{color:var(--text-tertiary);transition:transform .15s}.user-menu-chevron.open{transform:rotate(180deg)}.user-menu-dropdown{position:absolute;top:100%;right:0;margin-top:8px;min-width:200px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 24px #0006;z-index:50;overflow:hidden}.user-menu-info{padding:12px 14px}.user-menu-name{display:block;font-size:13px;font-weight:500;color:var(--text-primary)}.user-menu-email{display:block;font-size:12px;color:var(--text-tertiary);margin-top:2px}.user-menu-divider{height:1px;background:var(--border)}.user-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:10px 14px;font-size:13px;color:var(--text-secondary);text-align:left;transition:background .15s,color .15s}.user-menu-item:hover{background:var(--bg-hover);color:var(--text-primary)}.app-container{display:flex;height:100%}.main-content{flex:1;display:flex;flex-direction:column;min-width:0}.main-header{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid var(--border);background:var(--bg)}.sidebar-toggle{display:none;padding:8px;color:var(--text-secondary);border-radius:6px;transition:background .15s,color .15s}.sidebar-toggle:hover{background:var(--bg-hover);color:var(--text-primary)}.header-spacer{flex:1}.app-loading,.content-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--bg)}.content-loading{flex:1;min-height:auto}.spinner{width:24px;height:24px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.content-error{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--text-secondary)}.content-error button{padding:8px 16px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:6px;color:var(--text-primary);font-size:14px;transition:background .15s}.content-error button:hover{background:var(--bg-hover)}.auth-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:20px}.auth-card{display:flex;flex-direction:column;align-items:center;gap:16px;padding:48px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:16px;text-align:center;max-width:360px}.auth-icon{color:var(--accent);margin-bottom:8px}.auth-card h1{font-size:28px;font-weight:600;margin:0}.auth-card p{color:var(--text-secondary);font-size:15px;margin:0 0 8px}@media(max-width:768px){.sidebar-toggle{display:flex}}