/* Biblioteca · home: «Slik fungerer det» y botones de categoría. */
.bk-howto { max-width: 65ch; margin: 1.25rem auto 0; text-align: left; padding-left: 1.2rem; }
.bk-howto li { margin-bottom: .5rem; }

/* Botones de categoría en UNA fila en escritorio, sea cual sea su número (la base fija 8 columnas y la 9.ª salta de línea) */
@media (min-width: 900px) {
  .hx-cats { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: .45rem; }
  .hx-cat { padding: .35rem .25rem .4rem; }
  .hx-cat-txt { font-size: .66rem; overflow-wrap: anywhere; }
}

/* Flechas de la franja de categorías también en móvil (el CSS compartido solo las muestra desde 600 px); se puede arrastrar con el dedo y pulsar las flechas */
@media (max-width: 599px) {
  .hx-cats { padding-inline: 1.9rem; scroll-padding-inline: 1.9rem; }
  .hx-cats-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 1.5rem; height: 1.5rem; padding: 0 0 .1rem; border-radius: 50%; font-size: 1rem; line-height: 1; cursor: pointer; color: var(--hx-ink, var(--color-text)); background: color-mix(in srgb, var(--color-surface) 88%, transparent); border: 1px solid color-mix(in srgb, var(--color-text) 18%, transparent); box-shadow: 0 1px 4px rgba(0,0,0,.25); }
  .hx-cats-nav:not([hidden]) { display: grid; place-items: center; }
  html[data-theme="dark"] .hx-cats-nav { color: #fff; background: rgba(18, 48, 47, .92); border-color: rgba(255,255,255,.18); }
  .hx-cats-nav--prev { left: .2rem; } .hx-cats-nav--next { right: .2rem; }
}

/* Filas de la home (book-row): 6 libros; 2 columnas en móvil (3 filas), 3 en tableta, 6 en escritorio (1 fila) + botón «Se alle».
   Flex con ancho fijo por tarjeta: si hay menos de las columnas, quedan centradas. */
.bk-grid.bk-row { --cols: 2; --gap: 1rem; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--gap); }
.bk-grid.bk-row > .bk-card { flex: 0 0 calc((100% - var(--gap) * (var(--cols) - 1)) / var(--cols)); min-width: 0; }
.bk-row-all { text-align: center; margin: 1.1rem 0 0; }
@media (min-width: 600px) { .bk-grid.bk-row { --cols: 3; } }
@media (min-width: 1000px) { .bk-grid.bk-row { --cols: 6; --gap: 1.25rem; } }

/* «Se alle bøkene»: solo texto y una flecha, sin caja, para no competir con las portadas */
.bk-row-all .showcase-cta-link { display: inline; padding: 0; background: none; border: 0; box-shadow: none; border-radius: 0; font-size: .9rem; font-weight: 600; color: var(--color-accent-warm); text-decoration: none; opacity: .85; }
.bk-row-all .showcase-cta-link::after { content: "→"; display: inline-block; margin-left: .4em; transition: transform .15s ease; }
.bk-row-all .showcase-cta-link:hover, .bk-row-all .showcase-cta-link:focus-visible { opacity: 1; text-decoration: underline; text-underline-offset: 3px; }
.bk-row-all .showcase-cta-link:hover::after { transform: translateX(3px); }
@media (prefers-reduced-motion: reduce) { .bk-row-all .showcase-cta-link::after { transition: none; } }

/* Filas de la home: autor+edad reservan 2 líneas (las sinopsis quedan alineadas), título de bloque más presente y separadores más finos */
.bk-row .bk-card-meta { line-height: 1.3; min-height: 2.6em; }
.bk-shelf-block { border-top: 2px solid color-mix(in srgb, var(--c) 55%, transparent); }
.bk-shelf-h { font-size: 1.75rem; font-weight: 500; }

/* Zona táctil ≥ 44 px en las flechas de la franja de categorías sin agrandar el círculo visible */
.hx-cats-nav { position: absolute; }
.hx-cats-nav::after { content: ""; position: absolute; inset: -10px; }