.sidebar{width:220px;flex:0 0 220px;display:flex;flex-direction:column;background:var(--surface);border-right:1px solid var(--border);overflow-y:auto;overflow-x:hidden}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:16px 14px 12px;border-bottom:1px solid var(--border)}.sidebar-logo{font-size:15px;font-weight:600;color:var(--text);letter-spacing:-.02em}.add-btn{width:26px;height:26px;border-radius:6px;background:var(--surface-2);color:var(--text);font-size:18px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);line-height:1;padding:0 0 1px}.add-btn:hover{background:var(--accent-blue);color:#0d1117;border-color:var(--accent-blue)}.search-wrap{padding:10px 10px 8px}.search-input{width:100%;padding:6px 9px;font-size:13px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);outline:none}.search-input:focus{border-color:var(--accent-blue)}.sidebar-nav{padding:4px 6px}.nav-item{display:flex;align-items:center;gap:7px;width:100%;padding:6px 8px;border-radius:var(--radius);background:transparent;color:var(--text-muted);font-size:13px;text-align:left;white-space:nowrap;overflow:hidden}.nav-item:hover,.nav-item.active{background:var(--surface-2);color:var(--text)}.nav-icon{font-size:12px;flex-shrink:0}.collection-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.nav-name{flex:1;overflow:hidden;text-overflow:ellipsis}.nav-count{font-size:11px;color:var(--text-muted);margin-left:auto;flex-shrink:0}.sidebar-section{padding:8px 6px 4px;border-top:1px solid var(--border);margin-top:4px}.section-label{font-size:10px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;padding:0 8px 6px}.tag-cloud{display:flex;flex-wrap:wrap;gap:4px;padding:0 4px}.tag-btn{padding:3px 8px;border-radius:999px;background:var(--tag-bg);color:var(--tag-text);font-size:11px;border:1px solid transparent}.tag-btn:hover{border-color:var(--tag-text)}.tag-btn.active{background:var(--tag-text);color:#0d1117}.sidebar-footer{margin-top:auto;padding:10px;border-top:1px solid var(--border)}.footer-btn{width:100%;padding:7px;background:transparent;border:1px solid var(--border);color:var(--text-muted);font-size:12px;border-radius:var(--radius)}.footer-btn:hover{border-color:var(--accent-blue);color:var(--accent-blue)}.footer-settings{margin-top:6px}.bookmark-list{list-style:none;padding:0;flex:1}.bookmark-item{display:flex;gap:14px;padding:14px 20px;border-bottom:1px solid var(--border);transition:background .1s}.bookmark-item:hover{background:var(--surface)}.bookmark-cover{flex:0 0 72px;width:72px;height:54px;border-radius:var(--radius);overflow:hidden;background:var(--surface-2)}.bookmark-cover img{width:100%;height:100%;object-fit:cover}.bookmark-body{flex:1;min-width:0}.bookmark-meta{display:flex;align-items:center;gap:8px;margin-bottom:4px}.bookmark-domain{font-size:11px;color:var(--text-muted)}.bookmark-collection{font-size:11px;background:var(--surface-2);color:var(--accent-blue);padding:1px 6px;border-radius:999px;border:1px solid var(--border)}.bookmark-time{font-size:11px;color:var(--text-muted);margin-left:auto}.bookmark-title{display:block;font-size:14px;font-weight:500;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;margin-bottom:3px}.bookmark-title:hover{color:var(--accent-blue);text-decoration:underline}.bookmark-desc{font-size:12px;color:var(--text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px}.bookmark-tags{display:flex;flex-wrap:wrap;gap:4px}.bookmark-tag{font-size:11px;color:var(--tag-text);background:var(--tag-bg);padding:1px 7px;border-radius:999px}.bookmark-actions{display:flex;flex-direction:column;gap:4px;opacity:0;transition:opacity .1s}.bookmark-item:hover .bookmark-actions{opacity:1}.action-btn{width:26px;height:26px;border-radius:var(--radius);background:var(--surface-2);color:var(--text-muted);font-size:13px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border);padding:0}.action-btn:hover{color:var(--text);border-color:var(--text-muted)}.action-btn.active{color:#f1c40f;border-color:#f1c40f}.action-btn.danger:hover{color:#f85149;border-color:#f85149}.inline-edit{display:flex;align-items:center;gap:4px}.inline-tag-input{width:140px;font-size:12px;padding:3px 6px}.empty-state{display:flex;align-items:center;justify-content:center;flex:1;height:300px;color:var(--text-muted);font-size:14px}.app{display:flex;height:100dvh;overflow:hidden}.main{flex:1;overflow-y:auto;display:flex;flex-direction:column}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:24px;width:min(520px,calc(100vw - 32px));max-height:calc(100dvh - 64px);overflow-y:auto}.modal-title{font-size:16px;font-weight:600;margin-bottom:16px;color:var(--text)}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px}.btn{padding:7px 14px;border-radius:var(--radius);font-size:13px;font-weight:500;border:1px solid transparent}.btn-primary{background:var(--accent-blue);color:#0d1117}.btn-primary:hover{background:#79b8ff}.btn-ghost{background:transparent;color:var(--text-muted);border-color:var(--border)}.btn-ghost:hover{background:var(--surface-2);color:var(--text)}.btn-danger{background:transparent;color:#f85149;border-color:#f85149}.btn-danger:hover{background:#f851491a}.form-field{margin-bottom:14px}.form-label{display:block;font-size:12px;font-weight:500;color:var(--text-muted);margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em}.form-input{width:100%;padding:8px 10px}.form-select{width:100%;padding:8px 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-family:var(--font);font-size:14px;outline:none}.form-select:focus{border-color:var(--accent-blue)}.login-screen{display:flex;align-items:center;justify-content:center;height:100dvh;background:var(--bg)}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:36px 32px;width:min(380px,calc(100vw - 32px))}.login-logo{font-size:20px;font-weight:700;color:var(--text);margin-bottom:20px;letter-spacing:-.02em}.login-card h2{font-size:18px;font-weight:600;margin-bottom:20px;color:var(--text)}.login-card .field{margin-bottom:14px}.login-card .field label{display:block;font-size:12px;font-weight:500;color:var(--text-muted);margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em}.login-card input{width:100%;padding:9px 10px}.login-card .btn-primary{width:100%;padding:10px;font-size:14px;font-weight:600;margin-top:4px}.login-error{color:#f85149;font-size:13px;margin-bottom:10px;padding:8px 10px;background:#f851491a;border-radius:var(--radius)}.login-switch{margin-top:20px;text-align:center;font-size:13px;color:var(--text-muted)}.login-switch button{background:none;border:none;color:var(--accent-blue);font-size:13px;padding:0;margin-left:4px}.login-switch button:hover{text-decoration:underline}.settings-modal{width:min(600px,calc(100vw - 32px))}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-header h3{font-size:16px;font-weight:600}.close-btn{background:none;color:var(--text-muted);font-size:16px;padding:4px 8px}.close-btn:hover{color:var(--text)}.settings-section{margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--border)}.settings-section:last-child{border-bottom:none;margin-bottom:0}.settings-section h4{font-size:14px;font-weight:600;margin-bottom:8px}.settings-hint{font-size:12px;color:var(--text-muted);margin-bottom:14px;line-height:1.5}.settings-user{display:flex;align-items:center;gap:10px}.settings-label{font-size:12px;color:var(--text-muted)}.settings-email{font-size:14px;font-weight:500;flex:1}.logout-btn{font-size:12px;padding:5px 10px;color:#f85149;border-color:#f8514966}.logout-btn:hover{background:#f851491a;color:#f85149}.key-form{display:flex;gap:8px;margin-bottom:12px}.key-reveal{background:#3fb95014;border:1px solid rgba(63,185,80,.3);border-radius:var(--radius);padding:12px;margin-bottom:16px}.key-reveal-label{font-size:12px;color:var(--success);margin-bottom:8px}.key-reveal-value{display:flex;align-items:center;gap:10px}.key-reveal-value code{font-family:SF Mono,Fira Code,monospace;font-size:12px;color:var(--text);word-break:break-all;flex:1}.keys-table{width:100%;border-collapse:collapse;font-size:13px;margin-top:8px}.keys-table th{text-align:left;color:var(--text-muted);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.04em;padding:6px 8px;border-bottom:1px solid var(--border)}.keys-table td{padding:8px;border-bottom:1px solid rgba(48,54,61,.5);vertical-align:middle}.keys-table td code{font-family:SF Mono,Fira Code,monospace;font-size:12px;color:var(--text-muted)}.btn-danger-sm{background:transparent;color:#f85149;border:1px solid rgba(248,81,73,.3);padding:3px 8px;font-size:11px;border-radius:var(--radius)}.btn-danger-sm:hover{background:#f851491a}.settings-empty{font-size:13px;color:var(--text-muted);margin-top:8px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #0d1117;--surface: #161b22;--surface-2: #21262d;--border: #30363d;--text: #e6edf3;--text-muted: #8b949e;--accent: #f78166;--accent-blue: #58a6ff;--success: #3fb950;--tag-bg: #1f2d3d;--tag-text: #58a6ff;--radius: 6px;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:var(--accent-blue);text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;border:none;border-radius:var(--radius);font-family:var(--font);font-size:13px;transition:background .1s}input,textarea{font-family:var(--font);font-size:14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);outline:none;padding:6px 10px}input:focus,textarea:focus{border-color:var(--accent-blue);box-shadow:0 0 0 3px #58a6ff1f}input::placeholder,textarea::placeholder{color:var(--text-muted)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}
