/* Lista de conteúdos: barra de busca e filtros, cartões e paginação. */
[data-lista] { position: relative; z-index: 1; font-family: 'Instrument Sans', sans-serif; color: #0b0c0f; }
.ls-barra { background: #fff; border: 1px solid #d9d6d0; border-radius: 12px; padding: 21px; display: flex; flex-direction: column; gap: 14px; box-sizing: border-box; }
.ls-linha1 { display: flex; gap: 14px; align-items: stretch; flex-wrap: wrap; }
.ls-busca { flex: 1 1 320px; display: flex; align-items: center; gap: 12px; background: #f3f1ed; border: 1px solid #d9d6d0; border-radius: 10px; padding: 0 16px; min-height: 48px; color: #6b7078; transition: border-color .2s, box-shadow .2s; }
.ls-busca:focus-within { border-color: #0b0c0f; box-shadow: 0 0 0 3px rgba(11, 12, 15, .08); }
.ls-lupa { display: grid; place-items: center; }
.ls-q { flex: 1; min-width: 0; border: 0; background: transparent; outline: 0; font: 400 16px/22px 'Instrument Sans', sans-serif; color: #0b0c0f; padding: 12px 0; }
.ls-q::placeholder { color: #6b7078; }
.ls-q::-webkit-search-cancel-button { display: none; }
.ls-limpar-q { background: none; border: 0; cursor: pointer; font: 400 22px/22px 'Inter', sans-serif; color: #6b7078; padding: 0 2px; }
.ls-limpar-q:hover { color: #0b0c0f; }
.ls-formato { display: flex; border: 1px solid #d9d6d0; border-radius: 10px; overflow: hidden; background: #fff; }
.ls-formato button { border: 0; background: transparent; padding: 0 22px; min-height: 46px; font: 400 16px/22px 'Instrument Sans', sans-serif; color: #0b0c0f; cursor: pointer; transition: background .2s, color .2s; }
.ls-formato button.on { background: #0b0c0f; color: #f3f1ed; }
.ls-formato button:not(.on):hover { background: #f3f1ed; }
.ls-ordem { display: flex; align-items: center; gap: 8px; border: 1px solid #d9d6d0; border-radius: 10px; padding: 0 16px; min-height: 48px; background: #fff; }
.ls-ordem-t { font: 400 16px/22px 'Instrument Sans', sans-serif; color: #0b0c0f; white-space: nowrap; }
.ls-ordem select { border: 0; background: transparent; font: 400 16px/22px 'Instrument Sans', sans-serif; color: #0b0c0f; outline: 0; cursor: pointer; padding: 10px 0; max-width: 200px; }
.ls-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ls-chip { border: 1px solid #c5cad0; border-radius: 999px; padding: 9px 16px; font: 400 15px/22px 'Instrument Sans', sans-serif; color: #0b0c0f; text-decoration: none; transition: background .2s, color .2s, border-color .2s; }
.ls-chip:hover { border-color: #0b0c0f; }
.ls-chip.on { background: #0b0c0f; color: #f3f1ed; border-color: #0b0c0f; }
.ls-ativos { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ls-ativos[hidden] { display: none; }
.ls-ativo { display: inline-flex; align-items: center; gap: 8px; background: #f3f1ed; border: 1px solid #d9d6d0; border-radius: 999px; padding: 5px 6px 5px 14px; font: 500 12px/16px 'IBM Plex Mono', monospace; letter-spacing: .06em; }
.ls-ativo button { border: 0; background: #0b0c0f; color: #f3f1ed; width: 20px; height: 20px; border-radius: 50%; cursor: pointer; font: 400 14px/18px 'Inter', sans-serif; padding: 0; }
.ls-limpar-filtros { border: 0; border-bottom: 1px solid #c5cad0; background: none; font: 400 14px/20px 'Instrument Sans', sans-serif; cursor: pointer; padding: 0 0 2px; color: #0b0c0f; }

.ls-contagem { margin: 22px 0 18px; font: 400 14px/18px 'IBM Plex Mono', monospace; color: #6b7078; }
.ls-contagem[hidden] { display: none; }
.ls-grade { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; align-items: stretch; }
.ls-medio .ls-grade { grid-template-columns: repeat(2, 1fr); gap: 24px; }
.ls-estreito .ls-grade { grid-template-columns: 1fr; gap: 16px; }
.ls-estreito .ls-linha1 { flex-direction: column; }
.ls-estreito .ls-barra { padding: 15px; }
.ls-card { background: #fff; border: 1px solid #d9d6d0; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; transition: border-color .2s, transform .2s; }
.ls-card:hover { border-color: #6b7078; transform: translateY(-2px); }
.ls-capa { position: relative; height: 228px; background: #fff; overflow: hidden; border-bottom: 1px solid #d9d6d0; flex-shrink: 0; }
.ls-estreito .ls-capa { height: 160px; }
.ls-num { position: absolute; right: -18px; bottom: -58px; font: 800 180px/1 'Inter', sans-serif; color: #d9d6d0; letter-spacing: -.04em; }
.ls-estreito .ls-num { font-size: 130px; bottom: -42px; }
.ls-play { position: absolute; left: 20px; bottom: 16px; }
.ls-corpo { padding: 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.ls-tema { font: 500 10px/14px 'IBM Plex Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: #6b7078; margin: 0; }
.ls-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.ls-tag { border: 1px solid #6b7078; border-radius: 10px; padding: 3px 8px; font: 500 10px/14px 'IBM Plex Mono', monospace; letter-spacing: .1em; color: #0b0c0f; }
.ls-titulo { font: 700 20px/27px 'Inter', sans-serif; letter-spacing: -.005em; margin: 0; }
.ls-resumo { font: 400 14px/22px 'Instrument Sans', sans-serif; color: #6b7078; margin: 0; }
.ls-meta { margin-top: auto; padding-top: 12px; border-top: 1px solid #d9d6d0; display: flex; justify-content: space-between; gap: 12px; font: 400 12px/16px 'IBM Plex Mono', monospace; color: #6b7078; flex-wrap: wrap; }
.ls-corpo::after { content: none; }

.ls-vazio { background: #fff; border: 1px dashed #c5cad0; border-radius: 12px; padding: 48px 28px; text-align: center; }
.ls-vazio[hidden] { display: none; }
.ls-vazio p { margin: 0 0 8px; font: 400 16px/24px 'Instrument Sans', sans-serif; color: #6b7078; }
.ls-vazio .ls-vazio-t { font: 700 22px/30px 'Inter', sans-serif; color: #0b0c0f; }
.ls-vazio a { color: #0b0c0f; }

.ls-pag { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 40px; flex-wrap: wrap; }
.ls-pag[hidden] { display: none; }
.ls-pg { border: 1px solid #d9d6d0; background: #f3f1ed; border-radius: 10px; min-width: 42px; min-height: 44px; padding: 0 17px; font: 400 16px/22px 'Instrument Sans', sans-serif; color: #0b0c0f; cursor: pointer; transition: background .2s, color .2s; }
.ls-pg:hover:not(:disabled):not(.on) { background: #fff; border-color: #0b0c0f; }
.ls-pg.on { background: #0b0c0f; color: #f3f1ed; border-color: #0b0c0f; }
.ls-pg:disabled { color: #c5cad0; cursor: default; background: #f3f1ed; }
.ls-pg-num { display: flex; gap: 8px; }
.ls-pg-compacto { display: none; font: 400 14px/20px 'IBM Plex Mono', monospace; color: #6b7078; padding: 0 12px; }
.ls-estreito .ls-pg-num { display: none; }
.ls-estreito .ls-pg-compacto { display: inline; }
[data-lista] > * { align-self: stretch; }
.ls-estreito .ls-busca { flex: 0 0 auto; }
.ls-estreito .ls-formato button { flex: 1; }
.ls-estreito .ls-ordem select { max-width: none; flex: 1; }
.ls-estreito .ls-linha1 { flex-wrap: nowrap; }
.ls-estreito .ls-linha1 > * { min-width: 0; }
.ls-q { width: 100%; }