.continue-feature { display: grid; grid-template-columns: 9rem minmax(0, 1fr); gap: var(--space-32); align-items: stretch; }
.continue-feature > .book-cover-link { height: 100%; }
.continue-feature > .book-cover-link .book-cover-wrap { height: 100%; min-height: 100%; aspect-ratio: auto; }
.continue-content { max-width: 44rem; }
.continue-content h3, .club-feature h3, .book-hero h1 { font-family: var(--font-editorial); font-weight: 600; }
.continue-content h3 { font-size: var(--text-2xl); }
.continue-content .author { margin-top: var(--space-4); color: var(--text-secondary); }
.continue-content .progress-meta { margin-top: var(--space-24); }
.continue-content .progress-track { margin-top: var(--space-8); }
.continue-actions { display: flex; flex-wrap: wrap; gap: var(--space-12); margin-top: var(--space-24); }
.reading-carousel { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: var(--space-24); overflow: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; }
.reading-carousel.multiple { grid-auto-columns: calc((100% - var(--space-24)) / 2); }
.reading-carousel > * { scroll-snap-align: start; }
.reading-carousel.multiple .continue-feature { grid-template-columns: 7rem minmax(0, 1fr); gap: var(--space-24); padding: var(--space-24); }
.reading-carousel.multiple .continue-content h3 { font-size: var(--text-xl); }
.reading-nav { display: flex; align-items: center; gap: var(--space-8); }
.reading-nav.two-readings { display: none; }
.reading-counter { min-width: 4.5rem; color: var(--text-muted); font-size: var(--text-sm); text-align: right; }
.reading-nav .button { min-height: 2rem; width: 2rem; }

.home-secondary { display: grid; grid-template-columns: 7fr 5fr; gap: var(--space-24); align-items: stretch; }
.home-secondary > article { display: flex; min-width: 0; flex-direction: column; }
.home-secondary > article > .surface { flex: 1; }
.month-feature { display: grid; grid-template-columns: 6.5rem 1fr; gap: var(--space-24); align-items: center; }
.month-feature .book-cover-wrap { aspect-ratio: 2 / 3; }
.month-feature h3 { font-family: var(--font-editorial); }
.month-feature .button, .event-card .button { margin-top: var(--space-24); }
.event-layout { display: grid; height: 100%; grid-template-columns: 4rem minmax(0, 1fr); gap: var(--space-24); align-items: center; }
.event-date { display: inline-grid; min-width: 4rem; grid-template-columns: 1fr; border-right: 1px solid var(--border-strong); padding-right: var(--space-16); text-align: center; }
.event-date strong { font-size: var(--text-2xl); line-height: 1; }
.event-date span { margin-top: var(--space-4); color: var(--text-secondary); font-size: var(--text-xs); font-weight: 600; letter-spacing: .08em; }
.event-card h3 { margin-top: 0; }
.event-card p { margin-top: var(--space-4); color: var(--text-secondary); font-size: var(--text-sm); }
.event-card .button { margin-top: var(--space-16); }

.shelf-toolbar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-24); margin-bottom: var(--space-32); }
.shelf-header-actions { display: flex; gap: var(--space-8); }
.list-header-actions { display: flex; gap: var(--space-8); }
.user-list-description { max-width: 46rem; color: var(--text-secondary); }
.list-page-toolbar { justify-content: flex-start; margin-top: var(--space-24); }
.view-toggle { display: flex; gap: var(--space-4); }
.book-grid.list-view { grid-template-columns: 1fr; gap: 0; }
.book-grid.list-view .book-card { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr) auto 2.5rem; align-items: center; gap: var(--space-16); border-top: 1px solid var(--border-subtle); padding: var(--space-12) 0; }
.book-grid.list-view .book-card:last-child { border-bottom: 1px solid var(--border-subtle); }
.book-grid.list-view .book-cover-link { grid-row: span 3; width: 3.5rem; }
.book-grid.list-view .book-cover-wrap { width: 3.5rem; margin: 0; }
.book-grid.list-view .book-title { grid-column: 2; grid-row: 1; min-height: 0; }
.book-grid.list-view .book-author { grid-column: 2; grid-row: 2; min-height: 0; }
.book-grid.list-view .book-card-tags { grid-column: 3; grid-row: 1 / span 2; justify-content: flex-end; margin: 0; }
.book-grid.list-view .context-trigger { position: static; grid-column: 4; grid-row: 1 / span 2; opacity: 1; }

.club-feature { position: relative; display: grid; grid-template-columns: 10rem minmax(0, 1fr); gap: var(--space-32); align-items: stretch; cursor: pointer; }
.club-feature > .book-cover-wrap { height: 100%; min-height: 100%; aspect-ratio: auto; }
.club-feature:focus-visible { outline: 2px solid var(--text-primary); outline-offset: 3px; }
.club-discussion-icon { position: absolute; top: var(--space-16); right: var(--space-16); display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid var(--border-default); border-radius: var(--radius); background: var(--bg-page); color: var(--text-secondary); }
.club-feature:hover .club-discussion-icon { color: var(--text-primary); border-color: var(--border-strong); }
.club-feature h3 { font-size: var(--text-2xl); }
.club-meta { display: flex; flex-wrap: wrap; gap: var(--space-24); margin-top: var(--space-24); }
.club-meta strong, .club-meta span { display: block; }
.club-meta strong { font-size: var(--text-lg); }
.club-meta span { color: var(--text-secondary); font-size: var(--text-sm); }
.vote-list { border-top: 1px solid var(--border-default); }
.vote-option { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--space-16); align-items: center; border-bottom: 1px solid var(--border-default); padding: var(--space-16) 0; cursor: pointer; }
.vote-option.selected, .vote-option:has(input:checked) { background: var(--bg-surface); box-shadow: inset 3px 0 var(--text-secondary); padding-inline: var(--space-16); }
.vote-option input { width: 1.125rem; height: 1.125rem; accent-color: var(--text-primary); }
.vote-option strong { font-family: var(--font-editorial); font-size: var(--text-lg); }
.vote-option .book-status { display: block; margin-top: var(--space-4); }
.vote-count { color: var(--text-secondary); font-size: var(--text-sm); }
.vote-actions { display: flex; align-items: center; gap: var(--space-16); margin-top: var(--space-24); }
.vote-note { color: var(--text-muted); font-size: var(--text-sm); }
.previous-read-carousel { grid-auto-columns: min(16rem, calc((100% - 4.5rem) / 4)); }
.previous-read-carousel .book-author { margin-top: var(--space-4); }
.previous-read-carousel .book-status { margin-top: var(--space-8); }
.discussion-list { display: grid; }
.comment { display: grid; grid-template-columns: 2.5rem 1fr; gap: var(--space-12); border-bottom: 1px solid var(--border-subtle); padding: var(--space-16) 0; }
.comment-avatar { display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 1px solid var(--border-default); border-radius: 50%; background: var(--bg-surface); font-size: var(--text-xs); font-weight: 700; }
.comment-head { display: flex; justify-content: space-between; gap: var(--space-16); }
.comment-head time { color: var(--text-muted); font-size: var(--text-xs); }
.comment p { margin-top: var(--space-8); color: var(--text-secondary); }

.agenda-summary { margin: var(--space-24) 0 var(--space-32); color: var(--text-secondary); }
.agenda-summary strong { color: var(--text-primary); }
.timeline-month + .timeline-month { margin-top: var(--space-48); }
.month-label { margin-bottom: var(--space-16); color: var(--text-muted); font-size: var(--text-xs); font-weight: 700; letter-spacing: .1em; }
.timeline-item { display: grid; grid-template-columns: 4.5rem 1px minmax(0, 1fr); gap: var(--space-24); }
.timeline-date { padding-top: var(--space-16); text-align: right; }
.timeline-date strong { display: block; font-size: var(--text-lg); line-height: 1; }
.timeline-date span { color: var(--text-muted); font-size: var(--text-xs); font-weight: 600; }
.timeline-line { background: var(--border-default); }
.timeline-content { border-bottom: 1px solid var(--border-subtle); padding: var(--space-12) 0 var(--space-24); }
.timeline-title { display: block; font-size: var(--text-md); font-weight: 600; }
.timeline-trigger-meta { display: block; margin-top: var(--space-4); color: var(--text-muted); font-size: var(--text-xs); }
.timeline-content > p { margin-top: var(--space-4); color: var(--text-secondary); font-size: var(--text-sm); }
.timeline-details { margin-top: var(--space-16); color: var(--text-secondary); }
.timeline-details p + p { margin-top: var(--space-8); }
.timeline-details .button { margin-top: var(--space-16); }

.calendar-toolbar { margin-bottom: var(--space-24); }
.agenda-header-actions { display: flex; align-items: center; gap: var(--space-12); }
.agenda-view-toggle { display: flex; gap: var(--space-4); }
.calendar-section { margin-top: 0; }
.calendar-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-24); margin-bottom: var(--space-16); }
.calendar-heading p { margin-top: var(--space-4); color: var(--text-secondary); font-size: var(--text-sm); }
.calendar-navigation { display: flex; gap: var(--space-8); }
.calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); overflow: hidden; border-top: 1px solid var(--border-default); border-left: 1px solid var(--border-default); border-radius: var(--radius); }
.calendar-weekday { border-right: 1px solid var(--border-default); border-bottom: 1px solid var(--border-default); padding: var(--space-8) var(--space-12); color: var(--text-muted); font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; text-align: right; }
.calendar-day { display: flex; min-width: 0; min-height: 6.5rem; flex-direction: column; gap: var(--space-8); border-right: 1px solid var(--border-default); border-bottom: 1px solid var(--border-default); background: var(--bg-page); padding: var(--space-8); color: var(--text-primary); text-align: left; cursor: pointer; transition: background var(--transition); }
.calendar-day:hover { background: var(--bg-surface-hover); }
.calendar-day.outside { background: var(--bg-sidebar); color: var(--text-disabled); }
.calendar-day.today { box-shadow: inset 0 0 0 1px var(--text-secondary); }
.calendar-day-number { align-self: flex-end; display: grid; min-width: 1.5rem; height: 1.5rem; place-items: center; font-size: var(--text-sm); font-weight: 600; }
.calendar-day.today .calendar-day-number { background: var(--text-primary); color: var(--bg-page); }
.calendar-day-events { display: grid; gap: var(--space-4); min-width: 0; }
.calendar-event { display: block; overflow: hidden; border-left: 2px solid var(--text-secondary); background: var(--bg-elevated); padding: var(--space-4) var(--space-8); color: var(--text-secondary); font-size: var(--text-xs); line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event span { color: var(--text-primary); font-weight: 600; }
.calendar-more { color: var(--text-muted); font-size: var(--text-xs); }
.day-events { display: grid; gap: var(--space-24); }
.day-event { border-top: 1px solid var(--border-default); padding-top: var(--space-16); }
.day-event:first-child { border-top: 0; padding-top: 0; }
.day-event-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-16); }
.day-event-head h3 { margin-top: var(--space-4); font-family: var(--font-editorial); }
.day-event-head > strong { font-size: var(--text-sm); }
.event-type { color: var(--text-muted); font-size: var(--text-xs); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.day-event > p { margin-top: var(--space-8); color: var(--text-secondary); }
.day-event .event-attendees { color: var(--text-muted); font-size: var(--text-sm); }
.day-event .button { margin-top: var(--space-16); }
.agenda-list { max-width: 58rem; border-top: 1px solid var(--border-default); }
.agenda-list-month { border-bottom: 1px solid var(--border-default); padding: var(--space-32) 0 var(--space-12); font-size: var(--text-lg); }
.agenda-list-month:first-child { padding-top: var(--space-8); }
.agenda-list-event { display: grid; width: 100%; grid-template-columns: 4rem minmax(0, 1fr) auto; gap: var(--space-24); align-items: center; border-bottom: 1px solid var(--border-default); background: transparent; padding: var(--space-16) var(--space-8); color: var(--text-primary); text-align: left; cursor: pointer; }
.agenda-list-event:hover { background: var(--bg-surface); }
.agenda-list-date { display: grid; justify-items: center; border-right: 1px solid var(--border-default); }
.agenda-list-date strong { font-size: var(--text-xl); line-height: 1.1; }
.agenda-list-date span { color: var(--text-muted); font-size: var(--text-xs); text-transform: uppercase; }
.agenda-list-copy { display: grid; min-width: 0; gap: var(--space-4); }
.agenda-list-copy > strong { font-size: var(--text-md); }
.agenda-list-copy > span:last-child { overflow: hidden; color: var(--text-secondary); font-size: var(--text-sm); text-overflow: ellipsis; white-space: nowrap; }
.agenda-list-arrow { color: var(--text-muted); }

.profile-header { display: grid; grid-template-columns: 4.5rem 1fr; gap: var(--space-16); align-items: center; margin-bottom: var(--space-24); }
.profile-header .avatar { width: 4.5rem; height: 4.5rem; }
.profile-header h1 { font-size: var(--text-2xl); }
.profile-header p { color: var(--text-secondary); }
.profile-header .profile-total { margin-top: var(--space-8); color: var(--text-primary); font-size: var(--text-sm); }
.membership-wrap { max-width: 38rem; }
.membership-card { position: relative; aspect-ratio: 1.586 / 1; overflow: hidden; border: 1px solid var(--border-strong); border-radius: var(--radius); background: #111; padding: var(--space-32); }
.membership-card::before { content: ''; position: absolute; top: var(--space-32); right: var(--space-32); width: 4rem; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); height: var(--space-8); }
.membership-card-content { position: relative; display: flex; height: 100%; flex-direction: column; }
.membership-brand { font-size: var(--text-sm); font-weight: 700; letter-spacing: .16em; }
.membership-name { margin-top: auto; font-family: var(--font-editorial); font-size: var(--text-2xl); }
.membership-meta { display: flex; gap: var(--space-24); margin-top: var(--space-8); color: var(--text-secondary); font-size: var(--text-xs); text-transform: uppercase; }
.qr-code { position: absolute; right: 0; bottom: 0; width: 4.5rem; aspect-ratio: 1; border: .375rem solid #f2f2f0; background: #f2f2f0; }
.qr-code::before { content: ''; position: absolute; inset: 0; border: .45rem solid #0b0b0b; }
.qr-code::after { content: ''; position: absolute; left: 1.45rem; top: 1.45rem; width: .7rem; height: .7rem; background: #0b0b0b; box-shadow: -1rem -1rem 0 -.1rem #0b0b0b, 1rem -1rem 0 -.1rem #0b0b0b, -1rem 1rem 0 -.1rem #0b0b0b, 1rem 1rem 0 -.1rem #0b0b0b; }
.membership-action { margin-top: var(--space-16); }
.achievement-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-16); }
.achievement { border-top: 1px solid var(--border-strong); padding-top: var(--space-16); }
.achievement-number { display: grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); font-size: var(--text-xs); font-weight: 700; }
.achievement h3 { margin-top: var(--space-12); font-size: var(--text-md); }
.achievement p { margin-top: var(--space-4); color: var(--text-muted); font-size: var(--text-sm); }
.history-list { border-top: 1px solid var(--border-default); }
.history-row { display: flex; justify-content: space-between; border-bottom: 1px solid var(--border-default); padding: var(--space-16) 0; }
.history-row span { color: var(--text-secondary); }

.back-link { display: inline-flex; align-items: center; gap: var(--space-8); margin-bottom: var(--space-32); color: var(--text-secondary); font-size: var(--text-sm); }
.back-link:hover { color: var(--text-primary); }
.book-page-layout { display: grid; grid-template-columns: minmax(12rem, 18rem) minmax(0, 1fr); gap: clamp(var(--space-32), 5vw, var(--space-64)); align-items: start; max-width: 72rem; }
.book-sticky-cover { position: sticky; top: calc(var(--topbar-height) + var(--space-32)); }
.book-hero-cover { max-width: 18rem; }
.book-hero-cover .book-cover-wrap { aspect-ratio: 2 / 3; }
.book-page-content { min-width: 0; }
.book-info h1 { font-family: var(--font-editorial); font-size: var(--text-3xl); font-weight: 600; }
.book-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-24); }
.book-hero-author { margin-top: var(--space-8); color: var(--text-secondary); font-size: var(--text-lg); }
.book-hero-rating { margin-top: var(--space-16); color: var(--text-secondary); font-size: var(--text-sm); }
.book-hero-status { margin-top: var(--space-24); }
.book-hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-12); margin-top: var(--space-24); }
.book-progress { max-width: 34rem; margin-top: var(--space-24); }
.book-progress .progress-track { margin-top: var(--space-8); }
.book-details { max-width: 58rem; margin-top: var(--space-48); }
.book-details .accordion-panel p { max-width: 48rem; }
.book-review-actions { justify-content: flex-start; }
.rating-wrap { display: flex; align-items: center; gap: var(--space-16); margin: var(--space-8) 0 var(--space-16); }
.half-rating { gap: var(--space-4); }
.rating-star { position: relative; display: inline-block; width: 2.5rem; height: 2.5rem; color: var(--text-disabled); font-size: var(--text-xl); line-height: 2.5rem; text-align: center; }
.rating-empty, .rating-fill { position: absolute; inset: 0; pointer-events: none; }
.rating-fill { width: 100%; overflow: hidden; clip-path: inset(0 calc(100% - var(--rating-fill)) 0 0); color: var(--text-primary); white-space: nowrap; }
.half-rating .rating-hit { position: absolute; top: 0; bottom: 0; z-index: 1; width: 50%; height: 100%; background: transparent; padding: 0; cursor: pointer; }
.rating-hit-left { left: 0; }
.rating-hit-right { right: 0; }
.rating-hit:focus-visible { outline-offset: -2px; }
.rating-value { color: var(--text-muted); font-size: var(--text-sm); }
.edition-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-16) var(--space-32); }
.edition-grid dt { color: var(--text-muted); font-size: var(--text-xs); }
.edition-grid dd { margin: var(--space-4) 0 0; }

.settings-layout { max-width: 52rem; }
.settings-section { border-top: 1px solid var(--border-default); padding: var(--space-24) 0 var(--space-32); }
.settings-section h2 { font-size: var(--text-lg); }
.settings-section > p { margin-top: var(--space-4); color: var(--text-muted); font-size: var(--text-sm); }
.settings-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-16); margin-top: var(--space-24); }
.check-row { display: flex; align-items: flex-start; gap: var(--space-12); margin-top: var(--space-16); }
.check-row input { width: 1.125rem; height: 1.125rem; margin-top: .15rem; accent-color: var(--text-primary); }
.check-row label span { display: block; color: var(--text-muted); font-size: var(--text-sm); }

.admin-section { max-width: 72rem; }
.admin-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--space-24); margin-bottom: var(--space-24); }
.admin-section-heading p { margin-top: var(--space-4); color: var(--text-muted); font-size: var(--text-sm); }
.admin-list { border-top: 1px solid var(--border-default); }
.admin-row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-24); border-bottom: 1px solid var(--border-default); padding: var(--space-16) 0; }
.admin-row-main { display: grid; min-width: 0; gap: var(--space-4); }
.admin-row-main > span:not(.admin-badges) { overflow-wrap: anywhere; color: var(--text-secondary); font-size: var(--text-sm); }
.admin-badges { display: flex; flex-wrap: wrap; gap: var(--space-8); }
.admin-badges .book-status { margin-top: var(--space-4); }
.admin-row-actions { display: flex; flex: 0 0 auto; align-items: center; gap: var(--space-8); }
.admin-role-control { width: 10.5rem; }
.admin-inline-form { max-width: 52rem; }
.admin-wide-field { margin-top: var(--space-16); }
.admin-form-help { margin-top: var(--space-16); }

.add-book-results { display: grid; max-height: 20rem; overflow-y: auto; border-top: 1px solid var(--border-default); margin-top: var(--space-16); }
.add-book-result { display: grid; grid-template-columns: 3rem 1fr auto; gap: var(--space-12); align-items: center; border-bottom: 1px solid var(--border-subtle); background: transparent; padding: var(--space-12) 0; color: var(--text-primary); text-align: left; cursor: pointer; }
.add-book-result:hover { background: var(--bg-surface-hover); }
.add-book-result > .book-cover-wrap { width: 3rem; aspect-ratio: 2 / 3; }
.add-book-result small { display: block; color: var(--text-secondary); }
.add-book-confirm { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: var(--space-24); align-items: stretch; }
.add-book-confirm-cover { height: 100%; min-height: 100%; }
.add-book-confirm-cover .book-cover-wrap { height: 100%; min-height: 100%; aspect-ratio: auto; }
.add-book-confirm h3 { font-family: var(--font-editorial); font-size: var(--text-xl); }
.add-book-confirm-author { margin-top: var(--space-4); color: var(--text-secondary); }
.add-book-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-12) var(--space-24); margin: var(--space-24) 0; }
.add-book-facts dt { color: var(--text-muted); font-size: var(--text-xs); }
.add-book-facts dd { margin: var(--space-4) 0 0; }
.add-book-confirm-actions { justify-content: space-between; }
.list-cover-tile { position: relative; display: flex; aspect-ratio: 2 / 3; flex-direction: column; justify-content: flex-end; overflow: hidden; border: 1px solid var(--border-default); border-radius: var(--radius-sm); background: var(--bg-surface); margin-bottom: var(--space-12); padding: var(--space-24); }
.list-cover-tile::before { content: ''; position: absolute; top: var(--space-16); left: var(--space-16); width: 2.5rem; border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border-strong); height: var(--space-8); }
.list-cover-tile strong { font-family: var(--font-editorial); font-size: var(--text-xl); line-height: 1.2; }
.list-cover-tile span { margin-top: var(--space-8); color: var(--text-secondary); font-size: var(--text-sm); }
.list-card .book-status { border-style: dashed; }
.book-grid.list-view .list-cover-tile { width: 3.5rem; margin: 0; padding: var(--space-8); }
.book-grid.list-view .list-cover-tile::before, .book-grid.list-view .list-cover-tile strong, .book-grid.list-view .list-cover-tile span { display: none; }
