/** * Wiki explore article — left recommendations rail (desktop-first). * Single surface background; tiles are borderless (Fandom / home-adjacent). */ /* ── Left rail: sticky, no inner scroll ── */ @media (min-width: 1025px) { /* * desktop-fandom-chrome: html { overflow-x: clip } → overflow-y на html часто auto, * становится scrollport — position:sticky у инфобокса/рейла «не липнет». */ html:has(body.wiki-article-page .news-article-wiki-container--wiki-explore) { overflow-x: visible !important; overflow-y: visible !important; } .news-article-wiki-container--wiki-explore .wiki-explore-rec-sidebar { display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; /* Верх всегда от края ячейки сетки (без «плавающего» row-gap родителя) */ padding: 0 clamp(8px, 0.65vw, 12px) clamp(8px, 0.85vw, 14px) 0; margin: 0; box-sizing: border-box; position: sticky; top: var(--na-sticky-top, calc(56px + 12px)); align-self: start; z-index: 8; width: 100%; min-width: 0; max-height: none; overflow: visible; } .wiki-rec-surface { --wr-text: rgba(255, 255, 255, 0.92); --wr-muted: rgba(255, 255, 255, 0.55); --wr-faint: rgba(255, 255, 255, 0.38); --wr-accent: var(--vc-peach, #ffc58e); --wr-radius: 10px; font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; border-radius: var(--wr-radius); padding: clamp(8px, 0.75vw, 12px) clamp(12px, 0.95vw, 18px) clamp(14px, 1.1vw, 20px); box-sizing: border-box; background: linear-gradient(165deg, rgba(34, 34, 44, 0.98) 0%, rgba(22, 22, 30, 0.99) 55%, rgba(18, 18, 24, 1) 100%); border: 1px solid rgba(255, 255, 255, 0.09); box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35); } html[data-vc-rail="light"] .wiki-rec-surface { --wr-text: #111118; --wr-muted: rgba(17, 17, 24, 0.58); --wr-faint: rgba(17, 17, 24, 0.42); background: linear-gradient(165deg, #ffffff 0%, #f3f5f9 100%); border-color: rgba(15, 23, 42, 0.1); box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08); } /* Вровень с полосой вкладок: меньше внутреннего верха карточки, чем у базового .wiki-rec-surface */ .news-article-wiki-container--wiki-explore .wiki-explore-rec-sidebar .wiki-rec-surface { flex-shrink: 0; align-self: stretch; margin-top: 0; padding-top: clamp(8px, 0.68vw, 12px); } .wiki-rec-block + .wiki-rec-block { margin-top: clamp(20px, 1.65vw, 30px); padding-top: 0; border-top: none; } .wiki-rec-heading { position: relative; display: flex; align-items: center; gap: 8px; margin: 0 0 clamp(10px, 0.85vw, 14px); padding: 0 2px 8px; font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-size: clamp(12px, 0.8vw, 14px); font-weight: 800; letter-spacing: 0.04em; text-transform: none; color: var(--wr-text); line-height: 1.2; border-bottom: 1px solid rgba(255, 255, 255, 0.14); } html[data-vc-rail="light"] .wiki-rec-heading { border-bottom-color: rgba(15, 23, 42, 0.12); } .wiki-rec-heading::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: linear-gradient(135deg, var(--wr-accent), rgba(129, 140, 248, 0.9)); box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.14); flex-shrink: 0; } .wiki-rec-heading::after { content: ""; flex: 1; height: 1px; margin-left: 4px; background: linear-gradient(90deg, rgba(129, 140, 248, 0.38), transparent); } /* Левый рейл: один блок «You may also like» — чуть крупнее заголовок */ .wiki-rec-heading--rail-primary { font-size: clamp(14px, 0.98vw, 18px); margin-bottom: clamp(12px, 1vw, 16px); padding-bottom: 10px; } .wiki-rec-tiles { display: flex; flex-direction: column; gap: clamp(10px, 0.85vw, 14px); } .wiki-rec-tile { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--wr-text); min-width: 0; background: transparent; border: none; border-radius: 0; padding: 0; margin: 0; transition: opacity 0.15s ease, transform 0.15s ease; } .wiki-rec-tile:hover { opacity: 0.92; transform: translateY(-1px); } .wiki-rec-tile:focus-visible { outline: 2px solid rgba(129, 140, 248, 0.9); outline-offset: 3px; border-radius: 4px; } .wiki-rec-tile__media { position: relative; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: rgba(0, 0, 0, 0.35); } html[data-vc-rail="light"] .wiki-rec-tile__media { background: #d8dce4; } .wiki-rec-tile__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .wiki-rec-tile__label { font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-size: clamp(13px, 0.92vw, 16px); font-weight: 700; line-height: 1.28; letter-spacing: 0.01em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wiki-rec-tile__meta { font-size: clamp(10px, 0.62vw, 12px); font-weight: 600; color: var(--wr-muted); letter-spacing: 0.02em; } /* Latest news — image on top, compact home-style body */ .wiki-rec-block--news .wiki-rec-news-card { display: flex; flex-direction: column; align-items: stretch; text-decoration: none; color: inherit; background: transparent; border: none; border-radius: 0; overflow: visible; margin-top: 4px; transition: opacity 0.15s ease; } .wiki-rec-block--news .wiki-rec-news-card:hover { opacity: 0.94; } .wiki-rec-news-card__media { width: 100%; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: rgba(0, 0, 0, 0.35); margin-bottom: clamp(8px, 0.65vw, 12px); } html[data-vc-rail="light"] .wiki-rec-news-card__media { background: #d8dce4; } .wiki-rec-news-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .wiki-rec-news-card__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 0 2px; } .wiki-rec-news-card__date { font-size: clamp(12px, 0.78vw, 14px); font-weight: 600; color: var(--wr-muted); } html[data-vc-rail="light"] .wiki-rec-news-card__date { color: #5c2e0a; } .wiki-rec-news-card__title { margin: 0; font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-size: clamp(13px, 0.88vw, 15px); font-weight: 700; line-height: 1.28; color: var(--wr-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wiki-rec-news-card__excerpt { margin: 0; font-size: clamp(11px, 0.68vw, 13px); line-height: 1.45; color: var(--wr-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wiki-rec-news-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(8px, 0.65vw, 12px); margin-top: 4px; font-size: clamp(10px, 0.62vw, 12px); color: var(--wr-muted); } .wiki-rec-eng { display: inline-flex; align-items: center; gap: 4px; font-weight: 600; color: var(--wr-muted); } .wiki-rec-eng i { font-size: 0.85em; opacity: 0.85; } .wiki-rec-news-card__cta { margin-left: auto; font-weight: 800; font-size: clamp(10px, 0.62vw, 12px); letter-spacing: 0.06em; text-transform: uppercase; color: var(--wr-accent); } html[data-vc-rail="light"] .wiki-rec-news-card__cta { color: #7c2d12; } } /* Mobile / tablet: full-width block, no sticky */ @media (max-width: 1024px) { .wiki-explore-rec-sidebar { width: 100%; max-width: 100%; box-sizing: border-box; padding: clamp(12px, 2vw, 18px) 0 0; } .wiki-rec-surface { font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; border-radius: 12px; padding: clamp(9px, 2vw, 12px) clamp(14px, 3vw, 20px) clamp(14px, 3vw, 20px); background: linear-gradient(165deg, rgba(34, 34, 44, 0.98) 0%, rgba(22, 22, 30, 1) 100%); border: 1px solid rgba(255, 255, 255, 0.09); } html[data-vc-rail="light"] .wiki-rec-surface { background: linear-gradient(165deg, #ffffff 0%, #f3f5f9 100%); border-color: rgba(15, 23, 42, 0.1); } .wiki-rec-heading { margin: 0 0 12px; font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-size: 12px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(255, 255, 255, 0.9); } html[data-vc-rail="light"] .wiki-rec-heading { color: #111118; } .wiki-rec-heading--rail-primary { font-size: clamp(13px, 3.4vw, 16px); } .wiki-rec-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .wiki-rec-tile { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: rgba(255, 255, 255, 0.92); } html[data-vc-rail="light"] .wiki-rec-tile { color: #111118; } .wiki-rec-tile__media { aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #000; } .wiki-rec-tile__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .wiki-rec-tile__label { font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-size: 15px; font-weight: 700; line-height: 1.3; } .wiki-rec-tile__meta { font-size: 12px; color: rgba(255, 255, 255, 0.55); } html[data-vc-rail="light"] .wiki-rec-tile__meta { color: rgba(17, 17, 24, 0.55); } .wiki-rec-block + .wiki-rec-block { margin-top: 22px; padding-top: 0; border-top: none; } .wiki-rec-news-card { display: flex; flex-direction: column; text-decoration: none; color: inherit; } .wiki-rec-news-card__media { aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; margin-bottom: 10px; } .wiki-rec-news-card__media img { width: 100%; height: 100%; object-fit: cover; } .wiki-rec-news-card__date { font-size: 13px; font-weight: 600; } .wiki-rec-news-card__title { font-family: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-size: 15px; font-weight: 700; margin: 0 0 6px; color: rgba(255, 255, 255, 0.94); } html[data-vc-rail="light"] .wiki-rec-news-card__title { color: #111118; } .wiki-rec-news-card__excerpt { font-size: 13px; color: rgba(255, 255, 255, 0.6); margin: 0 0 8px; } html[data-vc-rail="light"] .wiki-rec-news-card__excerpt { color: rgba(17, 17, 24, 0.6); } .wiki-rec-news-card__meta { display: flex; flex-wrap: wrap; gap: 10px; font-size: 12px; color: rgba(255, 255, 255, 0.55); } html[data-vc-rail="light"] .wiki-rec-news-card__meta { color: rgba(17, 17, 24, 0.55); } } /* ── Explore page canvas + article chrome (dark / light rail, all viewports) ── */ /* Match home (hc-home) canvas */ html:not([data-vc-rail="light"]):has(.news-article-wiki-container--wiki-explore) { background-color: #1a1a22; } html[data-vc-rail="light"]:has(.news-article-wiki-container--wiki-explore) { background-color: #f5f6f8; } html:not([data-vc-rail="light"]) body.wiki-article-page { background: #1a1a22 !important; } html[data-vc-rail="light"] body.wiki-article-page { background: #f5f6f8 !important; } .main-content:has(.news-article-wiki-container--wiki-explore) { background: transparent !important; } html:not([data-vc-rail="light"]) .wiki-article-page { --wiki-bg: #1a1a22; --wiki-paper: #22222c; --wiki-border: rgba(255, 255, 255, 0.12); --wiki-border-light: rgba(255, 255, 255, 0.08); --wiki-text: rgba(255, 255, 255, 0.92); --wiki-text-secondary: rgba(255, 255, 255, 0.78); --wiki-muted: rgba(255, 255, 255, 0.52); --wiki-subtle-bg: rgba(255, 255, 255, 0.06); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-title, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-explore-article-main .article-title { color: rgba(255, 255, 255, 0.94) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .vc-breadcrumb a { color: rgba(255, 255, 255, 0.55); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-tab-btn { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.75); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-tab-btn:hover { background: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.9); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-tab-btn.active { background: rgba(99, 102, 241, 0.2); border-color: rgba(129, 140, 248, 0.45); color: #c7d2fe; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-type-header, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .hero-title-container-mock { background: #22222c !important; border-bottom-color: rgba(255, 255, 255, 0.1) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card { border-color: rgba(255, 255, 255, 0.1) !important; background: #22222c !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-collapsible-header:not(.wiki-info-card__mi-bar) { background: rgba(255, 255, 255, 0.04) !important; color: rgba(255, 255, 255, 0.88) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-card__mi-bar .wiki-collapsible-header__title, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-card__mi-bar .wiki-collapsible-header__chevron { color: rgba(255, 255, 255, 0.55) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .info-row { border-color: rgba(255, 255, 255, 0.08) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .info-cell-key { color: rgba(255, 255, 255, 0.5) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .info-cell-value { color: rgba(255, 255, 255, 0.9) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .statistics-table td { border-color: rgba(255, 255, 255, 0.08) !important; color: rgba(255, 255, 255, 0.88) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .statistics-table tr:nth-child(even) td { background: rgba(255, 255, 255, 0.03) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .vote-btn { background: rgba(255, 255, 255, 0.06) !important; border-color: rgba(255, 255, 255, 0.12) !important; color: rgba(255, 255, 255, 0.85) !important; } /* Article body text — lean on variables where editor-content allows */ html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text { color: rgba(255, 255, 255, 0.88); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text h2, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text h3 { color: rgba(255, 255, 255, 0.94); } html[data-vc-rail="light"] .news-article-wiki-container--wiki-explore .wiki-tab-btn { background: #fff; border-color: rgba(15, 23, 42, 0.12); color: #374151; } html[data-vc-rail="light"] .news-article-wiki-container--wiki-explore .wiki-tab-btn.active { background: rgba(99, 102, 241, 0.1); border-color: rgba(99, 102, 241, 0.35); color: #4338ca; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-gallery-section.wiki-collapsible-section { border-color: rgba(255, 255, 255, 0.12); background: #22222c; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-gallery-section .wiki-collapsible-header { background: rgba(255, 255, 255, 0.05); border-bottom-color: rgba(255, 255, 255, 0.1); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-gallery-section .wiki-collapsible-header__title { color: rgba(255, 255, 255, 0.92); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-gallery-section .wiki-collapsible-header__chevron { color: rgba(199, 210, 254, 0.85); } /* ── Dark rail: article column surface, ad slot, infobox table, contents, quotes ── */ html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-explore-content-shell, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-explore-page-head, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .news-article-main, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-explore-below-shell { background: #22222c !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .vc-breadcrumb .sep { color: rgba(255, 255, 255, 0.35); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .news-article-sidebar.wiki-explore-ad-sidebar { background: transparent !important; border-left-color: rgba(255, 255, 255, 0.08) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-type-header { border: none !important; border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; border-radius: 0 !important; box-shadow: none !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-caption { background: rgba(255, 255, 255, 0.04) !important; border-bottom-color: rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.78) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-type-header span, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card #wiki-type-text { color: #a5b4fc !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .hero-title-mock { color: rgba(255, 255, 255, 0.94) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-card__mi-bar { background: #3d4d6e !important; border-top-color: rgba(255, 255, 255, 0.12) !important; border-bottom-color: rgba(255, 255, 255, 0.12) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-card__mi-bar:hover { background: #485a7c !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-card__mi-bar .wiki-collapsible-header__title, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-info-card__mi-bar .wiki-collapsible-header__chevron { color: rgba(255, 255, 255, 0.9) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .wiki-collapsible-body { background: #1e1f2a !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .info-table-body { background: #262734 !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .info-cell-key { background: #3d4a63 !important; border-right-color: rgba(255, 255, 255, 0.1) !important; color: rgba(255, 255, 255, 0.92) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .info-cell-value { background: #262734 !important; color: rgba(255, 255, 255, 0.9) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .info-cell-value a { color: #c4b5fd !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-info-card .info-cell-value--muted { color: rgba(255, 255, 255, 0.45) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-article-avatar { border-bottom-color: rgba(255, 255, 255, 0.1) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section { background: #2c2f3f !important; border-color: rgba(255, 255, 255, 0.12) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .contents-collapsible-header, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-header.contents-collapsible-header { background: #4a5f82 !important; border-bottom-color: rgba(255, 255, 255, 0.12) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .contents-collapsible-header:hover, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-header.contents-collapsible-header:hover { background: #556a8f !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-header__title, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-header__title::before { color: rgba(255, 255, 255, 0.92) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .contents-collapsible-header::after, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-header.contents-collapsible-header::after { color: rgba(255, 255, 255, 0.85) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-table-wrap, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-table tbody { background: #2c2f3f !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-table td, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-collapsible-body .contents-table td { border-color: rgba(255, 255, 255, 0.08) !important; border-top-color: rgba(255, 255, 255, 0.08) !important; border-right-color: rgba(255, 255, 255, 0.08) !important; color: rgba(255, 255, 255, 0.88) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-table td:first-child { color: rgba(199, 210, 254, 0.95) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-item-btn { color: rgba(255, 255, 255, 0.88) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-item-btn:hover { color: #c4b5fd !important; } /* Подпункты Contents — как обычные строки (перебиваем wiki-collapsible.css) */ html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-collapsible-body .contents-table tr.toc-h3 td:first-child, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-body .contents-table tr.toc-h3 td:first-child { color: rgba(199, 210, 254, 0.95) !important; font-size: clamp(12px, 0.9vw, 15px) !important; font-weight: 700 !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-collapsible-body .contents-table tr.toc-h3 .contents-item-btn, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-body .contents-table tr.toc-h3 .contents-item-btn { color: rgba(255, 255, 255, 0.88) !important; font-size: clamp(12px, 0.9vw, 15px) !important; font-weight: 500 !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-collapsible-body .contents-table tr.toc-h3 .contents-item-btn:hover, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .contents-section .wiki-collapsible-body .contents-table tr.toc-h3 .contents-item-btn:hover { color: #c4b5fd !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text blockquote, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .quote-wrapper-content blockquote { background: linear-gradient(180deg, rgba(40, 42, 58, 0.98) 0%, rgba(32, 34, 48, 0.99) 100%) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08) !important; border-left-color: #818cf8 !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text blockquote p, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .quote-wrapper-content blockquote p { color: rgba(255, 255, 255, 0.88) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text blockquote .quote-source, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .quote-wrapper-content blockquote .quote-source { border-top-color: rgba(255, 255, 255, 0.12) !important; color: rgba(199, 210, 254, 0.75) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text a { color: #a5b4fc; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text a:hover { color: #c4b5fd; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text h2 { border-bottom-color: rgba(255, 255, 255, 0.14); } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-gallery-card.wiki-gallery-card--btn { background: #2f3242 !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-gallery-card.wiki-gallery-card--btn:hover { box-shadow: inset 0 0 0 1px rgba(129, 140, 248, 0.35), 0 4px 14px rgba(0, 0, 0, 0.25) !important; } /* Photo lightbox — dark rail (all viewports) */ html:not([data-vc-rail="light"]) .wiki-photo-lightbox__panel { background: #2a2838; border-color: rgba(255, 255, 255, 0.12); } html:not([data-vc-rail="light"]) .wiki-photo-lightbox__title { color: rgba(255, 255, 255, 0.94); } html:not([data-vc-rail="light"]) .wiki-photo-lightbox__sub { color: rgba(199, 210, 254, 0.82); } html:not([data-vc-rail="light"]) .wiki-photo-lightbox__main { background: linear-gradient(180deg, #242230 0%, #1e1c2a 100%); } html:not([data-vc-rail="light"]) .wiki-photo-lightbox__thumbs-outer { background: #22202e; border-top-color: rgba(255, 255, 255, 0.1); } html:not([data-vc-rail="light"]) .wiki-photo-lightbox__footer { color: rgba(255, 255, 255, 0.75); } /* Dark: in-article tables, collapsible tables, image / gallery wrappers */ html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .wiki-table-collapsible { background: #2a2d3e !important; border-color: rgba(255, 255, 255, 0.1) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .table-wrapper-content table, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .table-wrapper-content th, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .table-wrapper-content td { border-color: rgba(255, 255, 255, 0.1) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .table-wrapper-content th { background: rgba(255, 255, 255, 0.06) !important; color: rgba(255, 255, 255, 0.92) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .table-wrapper-content td { background: #262834 !important; color: rgba(255, 255, 255, 0.88) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .table-wrapper-content tr:nth-child(even) td { background: #2d3040 !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .img-wrapper-content, html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .img-wrapper-content .img-image-container { background: #2f3242 !important; border-color: rgba(255, 255, 255, 0.1) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .gallery-wrapper-content { background: #2a2d3e !important; border-color: rgba(255, 255, 255, 0.1) !important; } html:not([data-vc-rail="light"]) .news-article-wiki-container--wiki-explore .article-text .gallery-wrapper-content .gallery-image-container { background: #1e1f2a !important; } /* Mobile: tab strip (overrides wiki-article-mobile white card) */ @media (max-width: 1023px) { html:not([data-vc-rail="light"]) .wiki-article-page .news-article-wiki-container--wiki-explore .wiki-tabs-strip { background: rgba(255, 255, 255, 0.05) !important; border-color: rgba(255, 255, 255, 0.12) !important; box-shadow: none !important; } html:not([data-vc-rail="light"]) .wiki-article-page .news-article-wiki-container--wiki-explore .wiki-tab-switcher .wiki-tab-btn { background: rgba(255, 255, 255, 0.06) !important; border-color: rgba(255, 255, 255, 0.12) !important; color: rgba(255, 255, 255, 0.82) !important; } html:not([data-vc-rail="light"]) .wiki-article-page .news-article-wiki-container--wiki-explore .wiki-tab-switcher .wiki-tab-btn.active { background: rgba(99, 102, 241, 0.22) !important; border-color: rgba(129, 140, 248, 0.45) !important; color: #e0e7ff !important; } } /* ── Под центральным блоком: Popular (5 wiki tiles) + Latest news (hc = как home) ── */ .wiki-explore-below-shell { --hc-bg: #1a1a22; --hc-bg-elev: #22222c; --hc-border: rgba(255, 255, 255, 0.1); --hc-border-strong: rgba(255, 255, 255, 0.14); --hc-text: rgba(255, 255, 255, 0.92); --hc-muted: rgba(255, 255, 255, 0.58); --hc-faint: rgba(255, 255, 255, 0.42); --hc-accent: var(--vc-peach, #ffc58e); --hc-accent-text: #1a0f08; --hc-news-date: rgba(203, 213, 225, 0.92); --hc-radius: 3px; --hc-font: "Rubik", "Inter", system-ui, -apple-system, sans-serif; font-family: var(--hc-font); /* Внутри content-shell: без внешнего margin — единый фон с колонками */ margin-top: 0; padding: clamp(18px, 1.8vw, 28px) clamp(12px, 1.2vw, 24px) clamp(12px, 1.2vw, 24px); box-sizing: border-box; } html[data-vc-rail="light"] .wiki-explore-below-shell { --hc-bg: #e8eaef; --hc-bg-elev: #ffffff; --hc-border: rgba(15, 23, 42, 0.1); --hc-border-strong: rgba(15, 23, 42, 0.14); --hc-text: #111118; --hc-muted: rgba(17, 17, 24, 0.58); --hc-faint: rgba(17, 17, 24, 0.42); --hc-news-date: #5c2e0a; } /* * Отступы между секциями рекомендаций. * Важно: НЕ задавать .hc-section { margin: 0 } целиком — секции = .hc-section, и это * перетирало margin-top у .wiki-explore-feed-section + … (одинаковая специфичность, правило ниже). */ .wiki-explore-feed-section + .wiki-explore-feed-section { margin-top: clamp(28px, 2.6vw, 42px); } .wiki-explore-feed-section--popular + .wiki-explore-feed-section--random-pages { margin-top: clamp(32px, 2.9vw, 46px); } .wiki-explore-feed-section--random-pages + .wiki-explore-feed-section--latest-news { margin-top: clamp(36px, 3.2vw, 52px); } .wiki-explore-feed-section--popular + .wiki-explore-feed-section--latest-news { margin-top: clamp(36px, 3.2vw, 52px); } .wiki-explore-below-shell .hc-section { margin-left: 0; margin-right: 0; margin-bottom: 0; padding: 0; background: transparent; } .wiki-explore-below-shell .hc-section__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: clamp(14px, 1.1vw, 20px); padding-bottom: 10px; border-bottom: 1px solid var(--hc-border); } .wiki-explore-below-shell .hc-section__title { margin: 0; font-size: clamp(17px, 1.15vw, 22px); font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--hc-text); line-height: 1.1; font-family: var(--hc-font); } .wiki-explore-popular-grid, .wiki-explore-random-grid, .wiki-explore-you-may-grid { gap: clamp(10px, 0.85vw, 14px); } /* home-desktop-fandom: .hc-tile-grid только ≥1025 — сетка Popular на узких экранах */ @media (max-width: 1024px) { .news-article-wiki-container--wiki-explore .wiki-explore-rec-sidebar { display: none !important; } .wiki-explore-popular-grid, .wiki-explore-random-grid, .wiki-explore-you-may-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .wiki-explore-below-shell .hc-wiki-tile__media { aspect-ratio: 16 / 9; border-radius: var(--hc-radius, 3px); overflow: hidden; background: rgba(0, 0, 0, 0.35); border: 1px solid var(--hc-border); } html[data-vc-rail="light"] .wiki-explore-below-shell .hc-wiki-tile__media { background: #dfe3ea; } .wiki-explore-below-shell .hc-wiki-tile__media img { width: 100%; height: 100%; object-fit: cover; display: block; } .wiki-explore-below-shell .hc-wiki-tile { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: var(--hc-text); min-width: 0; } .wiki-explore-below-shell .hc-wiki-tile__label { font-size: clamp(13px, 0.95vw, 16px); font-weight: 700; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .wiki-explore-latest-news-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 2vw, 16px); } .wiki-explore-below-shell .hc-news-card { display: flex; flex-direction: column; align-items: stretch; min-width: 0; text-decoration: none; color: inherit; background: var(--hc-bg-elev); border: 1px solid #e4e7ec; border-radius: 6px; overflow: hidden; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06); } html[data-vc-rail="light"] .wiki-explore-below-shell .hc-news-card { box-shadow: 0 1px 0 rgba(15, 23, 42, 0.06); } .wiki-explore-below-shell .hc-news-card__thumb { flex: none; width: 100%; max-width: 100%; min-height: 0; aspect-ratio: 16 / 9; background: #eef1f6; border-right: none; border-bottom: 1px solid var(--hc-border); } html[data-vc-rail="light"] .wiki-explore-below-shell .hc-news-card__thumb { background: #d8dce4; } .wiki-explore-below-shell .hc-news-card__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; min-height: 0; } .wiki-explore-below-shell .hc-news-card__body { flex: 1; min-width: 0; display: flex; flex-direction: column; padding: 10px; gap: 4px; } .wiki-explore-below-shell .hc-news-card__date { font-size: 11px; font-weight: 600; color: var(--hc-news-date); letter-spacing: 0.03em; text-transform: uppercase; } .wiki-explore-below-shell .hc-news-card__title { margin: 0; font-family: var(--hc-font); font-size: clamp(12px, 3.4vw, 14px); font-weight: 700; line-height: 1.3; color: var(--hc-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wiki-explore-below-shell .hc-news-card__excerpt { margin: 0; font-size: clamp(11px, 3vw, 13px); line-height: 1.4; color: var(--hc-muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .wiki-explore-below-shell .hc-news-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-top: auto; padding-top: 6px; border-top: none; font-size: 11px; font-weight: 600; color: var(--hc-muted); } .wiki-explore-below-shell .hc-news-card__engagement { display: flex; flex-wrap: wrap; gap: 10px 12px; } .wiki-explore-below-shell .hc-eng { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; } .wiki-explore-below-shell .hc-eng i { font-size: 11px; opacity: 0.88; } .wiki-explore-below-shell .hc-news-card__cta { flex-shrink: 0; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #f8fafc; background: rgba(99, 102, 241, 0.55); padding: 5px 12px; border-radius: var(--hc-radius); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); } html[data-vc-rail="light"] .wiki-explore-below-shell .hc-news-card__cta { background: #4f46e5; box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18); } } @media (min-width: 1025px) { .wiki-explore-feed-section--you-may { display: none !important; } .wiki-explore-popular-grid > .hc-wiki-tile:nth-child(n + 6), .wiki-explore-random-grid > .hc-wiki-tile:nth-child(n + 6) { display: none !important; } }