.rails-den-bookmark-control { display: inline-flex; flex-direction: column; align-items: flex-start; max-width: 100%; }
.rails-den-bookmark-control form { display: inline-flex; margin: 0; }
.rails-den-bookmark-toggle { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.35rem; padding: .45rem .75rem; color: var(--rails-den-text); background: var(--rails-den-surface-raised); border: 1px solid var(--rails-den-border); border-radius: 8px; font: inherit; font-weight: 700; cursor: pointer; }
.rails-den-post-bookmark-control, .rails-den-post-bookmark-control form { display: inline; }
.rails-den-post-bookmark-control .rails-den-bookmark-toggle { min-height: auto; padding: 0; color: var(--rails-den-muted); background: transparent; border: 0; font-weight: inherit; }
.rails-den-bookmark-control.is-bookmarked .rails-den-bookmark-toggle { border-color: var(--rails-den-primary); box-shadow: inset 0 0 0 1px var(--rails-den-primary); }
.rails-den-bookmark-toggle:hover { color: var(--rails-den-text); border-color: var(--rails-den-primary); }
.rails-den-bookmark-toggle:focus-visible, .rails-den-bookmark-note-editor summary:focus-visible, .rails-den-bookmark-card a:focus-visible, .rails-den-bookmark-card button:focus-visible, .rails-den-bookmark-card textarea:focus-visible { outline: 2px solid var(--rails-den-primary); outline-offset: 3px; }
.rails-den-bookmark-control[aria-busy="true"] { opacity: .65; }
.rails-den-bookmark-control-error, .rails-den-bookmark-errors { margin: .4rem 0 0; color: var(--rails-den-danger); font-size: .88rem; }
.rails-den-bookmarks-header { margin: 1rem 0 1.5rem; }
.rails-den-bookmarks-header h1, .rails-den-bookmarks-header p { margin: .25rem 0; }
.rails-den-bookmarks-header > p:last-child, .rails-den-bookmark-context, .rails-den-bookmark-saved { color: var(--rails-den-muted); }
.rails-den-bookmark-list { display: grid; gap: 1rem; }
.rails-den-bookmark-card { padding: clamp(1rem, 3vw, 1.4rem); background: var(--rails-den-surface); border: 1px solid var(--rails-den-border); border-radius: var(--rails-den-radius); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.rails-den-bookmark-card-header, .rails-den-bookmark-card-actions, .rails-den-bookmark-note-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; }
.rails-den-bookmark-card-header { justify-content: space-between; }
.rails-den-bookmark-type { padding: .25rem .55rem; color: var(--rails-den-text); background: var(--rails-den-surface-raised); border: 1px solid var(--rails-den-border); border-radius: 999px; font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.rails-den-bookmark-card h2 { margin: .8rem 0 .2rem; font-size: 1.25rem; }
.rails-den-bookmark-context, .rails-den-bookmark-excerpt { margin: .3rem 0; }
.rails-den-bookmark-excerpt { line-height: 1.55; }
.rails-den-bookmark-note { margin: 1rem 0; padding: .8rem 1rem; background: var(--rails-den-surface-input); border-left: 3px solid var(--rails-den-primary); border-radius: 6px; }
.rails-den-bookmark-note p, .rails-den-bookmark-note span { margin: .3rem 0 0; white-space: pre-wrap; }
.rails-den-bookmark-note-editor { margin: 1rem 0; }
.rails-den-bookmark-note-editor summary { width: fit-content; color: var(--rails-den-text); cursor: pointer; font-weight: 700; }
.rails-den-bookmark-note-editor form { display: grid; gap: .55rem; margin-top: .7rem; }
.rails-den-bookmark-note-editor label { font-weight: 700; }
.rails-den-bookmark-note-editor textarea { width: 100%; min-height: 7rem; resize: vertical; padding: .7rem; color: var(--rails-den-text); background: var(--rails-den-surface-input); border: 1px solid var(--rails-den-border); border-radius: 8px; font: inherit; }
.rails-den-bookmark-card-actions { margin-top: 1rem; }
.rails-den-bookmark-remove, .rails-den-bookmark-cancel { min-height: 2.35rem; padding: .45rem .75rem; color: var(--rails-den-danger); background: transparent; border: 1px solid var(--rails-den-danger); border-radius: 8px; font: inherit; font-weight: 700; cursor: pointer; }
.rails-den-bookmark-cancel { color: var(--rails-den-muted); border-color: var(--rails-den-border); }
.rails-den-bookmarks-empty { display: grid; justify-items: center; gap: .5rem; padding: clamp(2rem, 8vw, 5rem) 1rem; text-align: center; background: var(--rails-den-surface); border: 1px dashed var(--rails-den-border); border-radius: var(--rails-den-radius); }
.rails-den-bookmarks-empty > span { font-size: 2.4rem; }
.rails-den-bookmarks-empty h2, .rails-den-bookmarks-empty p { margin: 0; }
.rails-den-bookmarks-empty p { color: var(--rails-den-muted); }
@media (max-width: 36rem) { .rails-den-bookmark-card-header { align-items: flex-start; flex-direction: column; } .rails-den-bookmark-card-actions > *, .rails-den-bookmark-card-actions form, .rails-den-bookmark-card-actions button { width: 100%; } .rails-den-bookmark-card-actions a, .rails-den-bookmark-card-actions button { justify-content: center; text-align: center; } .rails-den-bookmark-note-actions { align-items: stretch; flex-direction: column; } }