@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600&display=swap";body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--primary: #ebd8a0;--primary-hover: #ca9d38;--bg: #f5f5f5;--surface: #ffffff;--text: #1f2937;--text-secondary: #6b7280;--border: #e5e7eb;--danger: #ef4444;--danger-hover: #dc2626;--radius: 8px;--shadow: 0 1px 3px rgba(0, 0, 0, .1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Space Grotesk,Segoe UI,system-ui,sans-serif;background:radial-gradient(circle at top,rgba(255,240,195,.75),transparent 68%),radial-gradient(circle at bottom,rgba(255,234,170,.55),transparent 72%),var(--bg);color:var(--text);line-height:1.6}.loading-screen{display:flex;align-items:center;justify-content:center;min-height:200px;color:var(--text-secondary);font-size:1.1rem}.navbar{display:flex;align-items:center;justify-content:space-between;padding:0 24px;height:56px;background:transparent;border-bottom:none;box-shadow:none;position:sticky;top:0;z-index:100}.nav-brand{font-size:1.25rem;font-weight:700;color:#e5af0e}.nav-right{display:flex;align-items:center;gap:12px}.nav-user{font-size:.9rem;color:var(--text-secondary)}.btn-logout{padding:6px 14px;border:1px solid var(--border);border-radius:var(--radius);background:transparent;color:var(--text-secondary);cursor:pointer;font-size:.85rem;transition:all .15s}.btn-logout:hover{background:var(--bg);color:var(--text)}.main-content{max-width:960px;margin:0 auto;padding:24px 16px}.auth-page{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:16px}.auth-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:40px 32px;width:100%;max-width:400px}.auth-card h1{text-align:center;color:var(--primary);font-size:1.5rem;margin-bottom:4px}.auth-card h2{text-align:center;font-size:1.1rem;font-weight:500;color:var(--text-secondary);margin-bottom:24px}.auth-card form{display:flex;flex-direction:column;gap:16px}.auth-card label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--text-secondary)}.auth-card input{padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius);font-size:1rem;outline:none;transition:border-color .15s}.auth-card input:focus{border-color:var(--primary)}.auth-card button[type=submit]{margin-top:8px;border:none;border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer;background:linear-gradient(135deg,#f3d882,#e7c35d);color:#4f4326;transition:transform .15s ease,box-shadow .15s ease;display:inline-flex;align-items:center;justify-content:center;flex-wrap:nowrap;width:100%;font-size:1rem}.auth-card button[type=submit]:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 16px #e1b64f57}.auth-card button[type=submit]:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.auth-link{text-align:center;margin-top:16px;font-size:.9rem;color:var(--text-secondary)}.auth-link a{color:var(--primary);text-decoration:none}.auth-link a:hover{text-decoration:underline}.error-msg{background:#fef2f2;color:var(--danger);padding:8px 12px;border-radius:var(--radius);font-size:.9rem;margin-bottom:8px}.hint{font-size:.8rem;color:var(--text-secondary)}.bookmarks-page{min-height:60vh}.toolbar{display:flex;align-items:center;gap:16px;margin-bottom:20px}.search-bar{flex:1;position:relative}.search-bar .search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#9aa0a6;pointer-events:none;z-index:1}.search-bar input{width:100%;padding:10px 36px 10px 40px;border:1px solid #e9e3cf;border-radius:28px;font-size:14px;outline:none;background:var(--surface);transition:border-color .15s}.search-bar input:focus{border-color:var(--primary)}.search-bar .clear-btn{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-secondary);cursor:pointer;font-size:.9rem;padding:4px 6px}.total-count{font-size:.85rem;color:var(--text-secondary);white-space:nowrap}.btn-add-bookmark{padding:8px 18px;background:linear-gradient(135deg,#f3d882,#e7c35d);color:#4f4326;border:none;border-radius:var(--radius);font-size:.9rem;cursor:pointer;white-space:nowrap;transition:transform .15s,box-shadow .15s}.btn-add-bookmark:hover{transform:translateY(-1px);box-shadow:0 6px 16px #e1b64f57}.already-bookmarked-hint{color:#dc2626;font-size:.9rem;font-weight:500;margin-right:auto}.checking-hint{color:var(--text-secondary);font-size:.85rem;margin-right:auto}.bookmark-grid{display:grid;grid-template-columns:repeat(4,220px);gap:16px}.bookmark-card{background:#fffdf7;border:1px solid #e9e3cf;border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px;transition:background-color .15s ease;cursor:pointer}.bookmark-card:hover{background:#f5edda}.bookmark-card.pinned{border-width:1px}.card-header{display:flex;align-items:flex-start;gap:10px}.favicon{flex-shrink:0;border-radius:12px;width:32px;height:32px;object-fit:cover}.card-title-group{min-width:0;flex:1}.card-title{font-weight:600;font-size:15px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}.card-url{font-size:13px;color:#9e8e63;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;display:block}.card-url:hover{color:var(--primary)}.pin-badge{font-size:.7rem;background:#f7e2b1;color:#89640d;padding:2px 6px;border-radius:8px;flex-shrink:0;margin-right:4px}.bookmark-menu-wrap{position:relative;flex-shrink:0}.menu-trigger{background:none;border:none;cursor:pointer;font-size:1.2rem;color:var(--text-secondary);padding:2px 6px;border-radius:4px;visibility:hidden;line-height:1}.bookmark-card:hover .menu-trigger{visibility:visible}.menu-trigger:hover{background:#0000000f}.bookmark-dropdown{position:absolute;top:100%;right:0;z-index:10;background:#fff;border:1px solid #e9e3cf;border-radius:8px;box-shadow:0 4px 12px #0000001a;min-width:100px;display:flex;flex-direction:column;overflow:hidden}.bookmark-dropdown.hidden{display:none}.bookmark-dropdown button{background:none;border:none;padding:8px 14px;text-align:left;cursor:pointer;font-size:.9rem;color:var(--text)}.bookmark-dropdown button:hover{background:#f9f4e8}.bookmark-dropdown .dropdown-danger:hover{color:var(--danger);background:#fef2f2}.card-desc{font-size:13px;color:#8e846ab8;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;padding-left:42px}.empty-state{text-align:center;padding:60px 16px;color:var(--text-secondary);font-size:1.1rem}.pagination{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:24px;padding:16px 0}.pagination button{padding:8px 16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;font-size:.9rem;transition:all .15s}.pagination button:hover:not(:disabled){background:var(--bg);border-color:var(--primary);color:var(--primary)}.pagination button:disabled{opacity:.4;cursor:not-allowed}.page-info{font-size:.9rem;color:var(--text-secondary)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:200;padding:16px}.modal-content{background:#fdf8ea;border-radius:var(--radius);padding:24px;width:100%;max-width:480px;box-shadow:0 8px 24px #00000026}.modal-content h3{margin-bottom:16px;font-size:1.1rem}.modal-content form{display:flex;flex-direction:column;gap:14px}.modal-content label{display:flex;flex-direction:column;gap:4px;font-size:.9rem;color:var(--text-secondary)}.modal-content input,.modal-content textarea{padding:10px 12px;border:1px solid #e9e3cf;border-radius:12px;font-size:.9rem;font-family:inherit;outline:none;resize:vertical;transition:border-color .15s;background:#fdf8ea}.modal-content input:focus,.modal-content textarea:focus{border-color:var(--primary)}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}.modal-actions button{padding:8px 20px;border-radius:var(--radius);font-size:.9rem;cursor:pointer;transition:all .15s}.modal-actions button[type=submit]{background:linear-gradient(135deg,#f3d882,#e7c35d);color:#4f4326;border:none;transition:transform .15s,box-shadow .15s}.modal-actions button[type=submit]:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 16px #e1b64f57}.modal-actions button[type=submit]:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:transparent;border:1px solid #e9e3cf;color:var(--text);transition:transform .15s,box-shadow .15s}.btn-secondary:hover{transform:translateY(-1px);box-shadow:0 6px 16px #e1b64f57;background:transparent}@media(max-width:640px){.bookmark-grid{grid-template-columns:1fr}.toolbar{flex-direction:column;align-items:stretch}.total-count{text-align:right}}