/* Encyklopedia (encyclopedia) - frontend. Template-independent: the module reads the shared --cms-* tokens a template
   may define (AGENTS.md, section 23) and falls back to Bootstrap variables. Layout reacts to the width of the module or
   block (container queries). Link classes are written twice (".enc-x.enc-x") so template rules such as ".mn-template a"
   do not recolour them. */

.enc-module,.enc-block{
  --enc-accent:var(--cms-accent,var(--bs-primary,#0d6efd));
  --enc-accent-ink:var(--cms-accent-ink,var(--enc-accent));
  --enc-accent-soft:var(--cms-accent-soft,color-mix(in srgb,var(--enc-accent) 12%,transparent));
  --enc-solid:var(--cms-button-bg,var(--enc-accent));
  --enc-on-solid:var(--cms-button-color,#fff);
  --enc-text:var(--bs-body-color,#212529);
  --enc-muted:var(--bs-secondary-color,#6c757d);
  --enc-border:var(--bs-border-color,#dee2e6);
  --enc-surface:var(--cms-surface,var(--bs-body-bg,#fff));
  --enc-soft:var(--cms-surface-soft,var(--bs-tertiary-bg,#f8f9fa));
  --enc-line:var(--cms-surface-border-width,1px);
  --enc-radius:var(--cms-radius,12px);
  --enc-radius-sm:var(--cms-radius-sm,8px);
  --enc-search-radius:var(--cms-search-radius,var(--enc-radius-sm));
  --enc-display:var(--cms-font-display,inherit);
  container-type:inline-size;
}
:where(.enc-module,.enc-block) a:not([class]){color:var(--enc-accent-ink)}

.enc-module{margin-bottom:2rem}
.enc-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;font-size:.85rem;color:var(--enc-muted);margin-bottom:.5rem}
.enc-crumbs a{color:inherit;text-decoration:none}
.enc-crumbs a:hover{color:var(--enc-accent-ink);text-decoration:underline}
.enc-crumbs .bi{font-size:.7rem}
.enc-head{margin-bottom:1rem}
.enc-head__title{margin:0 0 .4rem;font-size:clamp(1.6rem,1.3rem + 1.2vw,2.2rem);line-height:1.15;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.enc-head__letter{display:inline-grid;place-items:center;min-width:2.6rem;height:2.6rem;padding:0 .4rem;border-radius:var(--enc-radius-sm);background:var(--enc-solid);color:var(--enc-on-solid);font-size:1.4rem}
.enc-head__lead{color:var(--enc-muted);max-width:70ch;margin:0 0 .5rem}
.enc-head__meta{color:var(--enc-muted);font-size:.9rem;margin:0}

.enc-search{display:flex;max-width:34rem;margin:0 0 1rem}
.enc-search .form-control{border-radius:var(--enc-search-radius) 0 0 var(--enc-search-radius)}
.enc-search .btn{border-radius:0 var(--enc-search-radius) var(--enc-search-radius) 0;padding-inline:1rem}
.enc-search--compact{max-width:none;margin:0 0 .75rem}

.enc-letters{margin:0 0 1.5rem}
.enc-letters__list{display:flex;flex-wrap:wrap;gap:.3rem;list-style:none;margin:0;padding:0}
.enc-letters__item.enc-letters__item{display:inline-grid;place-items:center;min-width:2.1rem;height:2.1rem;padding:0 .35rem;border:var(--enc-line) solid var(--enc-border);border-radius:var(--enc-radius-sm);background:var(--enc-surface);color:var(--enc-accent-ink);font-weight:700;font-size:.9rem;text-decoration:none;line-height:1}
.enc-letters__item.enc-letters__item:hover{background:var(--enc-accent-soft);border-color:var(--enc-accent)}
.enc-letters__item.enc-letters__item.is-active{background:var(--enc-solid);border-color:var(--enc-solid);color:var(--enc-on-solid)}
.enc-letters__item.is-empty{color:var(--enc-muted);opacity:.45;font-weight:500;background:transparent}
.enc-letters--compact{margin-top:1.5rem}
.enc-letters--compact .enc-letters__item.enc-letters__item,.enc-letters--compact .enc-letters__item.is-empty{min-width:1.8rem;height:1.8rem;font-size:.8rem}

.enc-columns{display:grid;gap:1rem}
@container (min-width:44rem){.enc-columns{grid-template-columns:repeat(auto-fit,minmax(14rem,1fr))}}
.enc-section{margin:0 0 1.25rem}
.enc-section--card{padding:1rem 1.1rem;border:var(--enc-line) solid var(--enc-border);border-radius:var(--enc-radius);background:var(--enc-surface)}
.enc-section__title{display:flex;align-items:center;gap:.45rem;font-size:1.05rem;margin:0 0 .65rem}
.enc-section__title .bi{color:var(--enc-accent-ink)}
.enc-list{list-style:none;margin:0;padding:0}
.enc-list__item{display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .5rem;padding:.35rem 0;border-bottom:1px solid color-mix(in srgb,var(--enc-border) 70%,transparent)}
.enc-list__item:last-child{border-bottom:0}
.enc-list__link.enc-list__link{color:var(--enc-accent-ink);text-decoration:none;font-weight:600}
.enc-list__link.enc-list__link:hover{text-decoration:underline}
.enc-list__item.is-empty .enc-list__link.enc-list__link{color:var(--enc-text);font-weight:500}
.enc-list__soon{font-size:.72rem;padding:.05rem .45rem;border-radius:999px;background:var(--enc-soft);color:var(--enc-muted);text-transform:uppercase;letter-spacing:.04em}
.enc-list__views{margin-left:auto;font-size:.8rem;color:var(--enc-muted);white-space:nowrap}
.enc-list__summary{flex:1 1 100%;margin:.1rem 0 0;font-size:.88rem;color:var(--enc-muted)}
.enc-list--rows .enc-list__item{padding:.6rem 0}
@container (min-width:40rem){.enc-list--rows{columns:2;column-gap:2rem}.enc-list--rows .enc-list__item{break-inside:avoid}}
.enc-empty{padding:1.25rem;border:var(--enc-line) dashed var(--enc-border);border-radius:var(--enc-radius);color:var(--enc-muted);text-align:center}
.enc-more.enc-more{display:inline-flex;align-items:center;gap:.35rem;margin-top:.6rem;font-size:.88rem;font-weight:600;color:var(--enc-accent-ink);text-decoration:none}

.enc-entry__eyebrow{margin:0;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--enc-accent-ink)}
.enc-entry__meta{display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;margin:0 0 .5rem;font-size:.85rem;color:var(--enc-muted)}
.enc-entry__content{overflow-wrap:break-word;margin-bottom:1.5rem}
.enc-entry__content img{max-width:100%;height:auto;border-radius:var(--enc-radius-sm)}
.enc-entry__content h2,.enc-entry__content h3{margin-top:1.5rem}
.enc-entry__content table{max-width:100%;display:block;overflow-x:auto}
.enc-entry__content pre,.enc-entry__content code{white-space:pre-wrap}
.enc-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin:0 0 1.5rem}
@container (min-width:36rem){.enc-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container (min-width:56rem){.enc-gallery{grid-template-columns:repeat(4,minmax(0,1fr))}}
.enc-gallery__item{display:block;padding:0;border:var(--enc-line) solid var(--enc-border);border-radius:var(--enc-radius-sm);background:var(--enc-soft);overflow:hidden;cursor:zoom-in}
.enc-gallery__item img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform .2s ease}
.enc-gallery__item:hover img,.enc-gallery__item:focus-visible img{transform:scale(1.03)}
.enc-gallery__item:focus-visible{outline:2px solid var(--enc-accent);outline-offset:2px}
.enc-entry__soon{display:flex;align-items:center;gap:.6rem;padding:1rem 1.15rem;margin-bottom:1.5rem;border-radius:var(--enc-radius);background:var(--enc-soft);color:var(--enc-muted)}
.enc-pager{display:grid;gap:.75rem;margin:0 0 1.5rem}
@container (min-width:36rem){.enc-pager{grid-template-columns:1fr 1fr}.enc-pager__link--next{grid-column:2;text-align:right;justify-content:flex-end}}
.enc-pager__link.enc-pager__link{display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;border:var(--enc-line) solid var(--enc-border);border-radius:var(--enc-radius);background:var(--enc-surface);color:var(--enc-text);text-decoration:none;font-weight:600;line-height:1.3}
.enc-pager__link.enc-pager__link:hover{border-color:var(--enc-accent);color:var(--enc-accent-ink)}
.enc-pager__link small{display:block;font-weight:500;font-size:.75rem;color:var(--enc-muted)}

/* Block */
.enc-block .enc-list__item{padding:.3rem 0}
.enc-block__more.enc-block__more{display:inline-block;margin-top:.5rem;font-size:.85rem;font-weight:600;color:var(--enc-accent-ink)}