.novels-section { margin-bottom: 36px; }
.novel-grid-scroll:focus-visible { outline: 2px solid var(--focus); outline-offset: 4px; }
.novel-grid { --novel-gap: 16px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--novel-gap); }
.novel-card { min-width: 0; }
.cover-wrap { display: block; position: relative; aspect-ratio: 5 / 7; border-radius: 6px; overflow: hidden; background: var(--cover-bg); }
.cover-image { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.cover-placeholder { display: grid; place-items: center; height: 100%; padding: 12px; color: var(--cover-ink); font: 700 16px/1.4 Georgia, serif; text-align: center; overflow-wrap: anywhere; }
.origin-chip { position: absolute; bottom: 6px; left: 6px; border-radius: 3px; background: var(--badge-bg); color: var(--badge-text); padding: 4px 6px; font-size: 11px; line-height: 1; font-weight: 600; }
.novel-card-content { padding-top: 9px; }
.novel-title { font-size: 14px; font-weight: 600; line-height: 1.3; margin: 0 0 4px; }
.novel-title a, .novel-title > span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.novel-card-genres { min-height: 1.35em; margin: 0 0 5px; font-size: 12px; line-height: 1.35; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stat-row { display: flex; align-items: center; gap: 10px; margin: 7px 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; font-variant-numeric: tabular-nums; flex-wrap: nowrap; }
.stat { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.stat-rating { color: var(--text); }
.stat small { font-size: inherit; color: var(--muted); }

@media (max-width: 900px) {
    .novel-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .novel-grid-scroll { position: relative; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * var(--novel-gap)) / 3); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: var(--muted) transparent; padding-bottom: 10px; }
    .novel-grid-scroll .novel-card { scroll-snap-align: start; }
}

@media (max-width: 640px) {
    .novel-grid { --novel-gap: 8px; }
    .novel-title { font-size: 12px; }
    .novel-card-genres { font-size: 10px; }
    .origin-chip { font-size: 9px; padding: 3px 4px; left: 4px; bottom: 4px; }
    .stat-row { gap: 6px; font-size: 10px; }
    .stat { gap: 3px; }
    .stat .icon { width: 11px; height: 11px; }
}