/* Главная вики сезона: у каждой группы своя подача. Только токены tokens.css. */
.whome__head { max-width: 760px; }
.wgroup { margin-top: var(--space-8); }
/* Подпись группы: тихая метка без декора */
.wgroup__title { margin-bottom: var(--space-4); font-family: var(--font-ui); font-size: var(--fs-xs); font-weight: 600; letter-spacing: var(--tracking-meta); text-transform: uppercase; color: var(--text-faint); }

/* Сюжет: главы-карточки; число колонок задаёт модификатор по числу статей, чтобы не было сирот */
.chapters { list-style: none; display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--space-4); }
.chapters--c1 { --cols: 1; }
.chapters--c2 { --cols: 2; }
.chapters > li { display: flex; max-width: none; }
.chapter { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: var(--space-2); width: 100%; padding: var(--space-5); background: var(--surface-glass); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm), inset 0 1px 0 rgba(255, 255, 255, 0.06); transition: transform var(--dur-fast), border-color var(--dur-fast), box-shadow var(--dur-fast); }
.chapter:hover { transform: translateY(-3px); border-color: var(--border-strong); box-shadow: var(--shadow-lg), var(--glow-accent); }
.chapter__head { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-2); }
.chapter__glyph { background: var(--accent-weak); border-color: transparent; color: var(--accent); }
.chapter__title { font-family: var(--font-display); font-size: var(--fs-lg); font-weight: 700; line-height: var(--lh-tight); color: var(--text); transition: color var(--dur-fast); }
.chapter:hover .chapter__title { color: var(--accent); }
.chapter__text { flex: 1; font-size: var(--fs-sm); line-height: 1.55; color: var(--text-muted); }
.chapter__meta { display: flex; align-items: center; justify-content: space-between; margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--border-soft); font-size: var(--fs-xs); color: var(--text-faint); }
.chapter__go { color: var(--text-faint); transition: transform var(--dur-fast), color var(--dur-fast); }
.chapter:hover .chapter__go { color: var(--accent); transform: translateX(3px); }

/* Превью-плитки: обложка страницы, без неё эмблема на той же плитке */
.tile { display: grid; place-items: center; overflow: hidden; width: 100%; aspect-ratio: var(--tile-ratio, 1); border-radius: var(--r-lg); background: var(--surface-2); border: 1px solid var(--border-soft); box-shadow: var(--shadow-sm); transition: border-color var(--dur-fast), transform var(--dur-fast), box-shadow var(--dur-fast); }
.tile img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow, 300ms); }
.tile .emblem { background: transparent; border: 0; width: 56%; height: auto; aspect-ratio: 1; }
.tile .emblem svg { width: 62%; height: 62%; }
.tile .emblem--shield svg { width: 100%; height: 100%; }
.portrait:hover .tile, .crest:hover .tile { border-color: var(--border-strong); transform: translateY(-2px); box-shadow: var(--shadow-lg); }
.portrait:hover .tile img, .crest:hover .tile img { transform: scale(1.04); }

/* Действующие лица: портреты-превью */
.wgroup__cast { display: grid; grid-template-columns: repeat(var(--cols, 6), minmax(0, 1fr)); gap: var(--space-5) var(--space-4); }
.portrait { display: flex; flex-direction: column; gap: 2px; }
.portrait .tile { --tile-ratio: 4 / 5; margin-bottom: var(--space-2); }
.portrait__name { font-size: var(--fs-sm); font-weight: 650; color: var(--text); transition: color var(--dur-fast); }
.portrait__aka { font-size: var(--fs-xs); color: var(--text-muted); line-height: 1.4; }
.portrait:hover .portrait__name { color: var(--accent); }

/* Мир: строки текста — название, тип, одна строка описания */
.wgroup__world { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-6); }
.row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; column-gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--border-soft); }
.row__title { font-weight: 650; color: var(--text); transition: color var(--dur-fast); }
.row:hover .row__title { color: var(--accent); }
.row__type { font-size: var(--fs-xs); color: var(--text-faint); }
.row__text { grid-column: 1 / -1; font-size: var(--fs-sm); color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Постройки: плотная типографская сетка с тонкой линией слева */
.wgroup__builds { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--space-4) var(--space-5); }
.build { display: flex; flex-direction: column; gap: 2px; padding-left: var(--space-3); border-left: 1px solid var(--border); transition: border-color var(--dur-fast); }
.build__title { font-weight: 650; color: var(--text); }
.build__text { font-size: var(--fs-sm); line-height: 1.5; color: var(--text-muted); display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.build:hover { border-color: var(--accent); }

/* Общество: карточки-превью */
.wgroup__society { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: var(--space-5) var(--space-4); }
.crest { display: flex; flex-direction: column; gap: var(--space-2); }
.crest .tile { --tile-ratio: 16 / 10; }
.crest__name { font-size: var(--fs-sm); font-weight: 650; color: var(--text); line-height: 1.3; transition: color var(--dur-fast); }
.crest:hover .crest__name { color: var(--accent); }
/* Остальные страницы общества и карточка игроков: те же строки и сетка, что у «Мира» */
.wgroup__world--after { margin-top: var(--space-6); }
.wgroup__world--after + .wgroup__world--after { margin-top: var(--space-5); }

@media (max-width: 1100px) {
    .chapters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .chapters { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 768px) {
    .wgroup { margin-top: var(--space-7); }
    .row__text { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; }
    .wgroup__world { grid-template-columns: minmax(0, 1fr); }
    .wgroup__cast { grid-template-columns: repeat(var(--cols-sm, 3), minmax(0, 1fr)); gap: var(--space-4) var(--space-3); }
    .wgroup__society { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-3); }
}
