.guide-page.article-page { max-width: none; }
.product-video { margin: 32px 0 40px; }
.product-video__player { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.product-video__preview { display: block; position: relative; width: 100%; height: 100%; padding: 0; border: 0; background: var(--panel); color: white; cursor: pointer; }
.product-video__preview img { width: 100%; height: 100%; object-fit: cover; }
.product-video__preview::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 55%, rgba(0,0,0,.85)); }
.product-video__play { position: absolute; z-index: 1; top: 50%; left: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; width: 72px; height: 72px; padding-left: 4px; border-radius: 50%; background: var(--lime); color: var(--bg); font-size: 26px; box-shadow: 0 4px 24px rgba(0,0,0,.35); }
.product-video__preview:hover .product-video__play { background: var(--cyan); }
.product-video__preview:focus-visible { outline-offset: -5px; }
.product-video__label { position: absolute; z-index: 1; bottom: 16px; left: 20px; right: 20px; text-align: left; font-weight: 700; font-size: clamp(.85rem, 2vw, 1rem); }
.product-video__player iframe { display: block; width: 100%; height: 100%; border: 0; }
.product-video figcaption { margin-top: 12px; color: var(--muted); font-size: .88rem; line-height: 1.6; }
@media (max-width: 480px) { .product-video__play { width: 54px; height: 54px; font-size: 20px; } .product-video__label { left: 12px; bottom: 10px; } }
.product-video__fallback { aspect-ratio: 16 / 9; }
.product-video__fallback iframe { display: block; width: 100%; height: 100%; border: 0; border-radius: 16px; }
.article-catalog { margin-top: 36px; }
.article-catalog [hidden] { display: none !important; }
.article-catalog__results { min-width: 0; }
.article-catalog__tools { display: grid; align-self: start; gap: 16px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--panel); }
.article-filter { min-width: 0; margin: 0; padding: 0; border: 0; }
.article-filter legend { margin-bottom: 8px; padding: 0; color: var(--muted); font-size: .9rem; font-weight: 600; }
.article-filter__options { display: flex; flex-wrap: wrap; gap: 6px; }
.article-filter__chip { min-height: 36px; max-width: 100%; padding: 6px 11px; border: 1px solid var(--line); border-radius: 24px; background: var(--bg); color: var(--ink); font: inherit; font-size: .85rem; cursor: pointer; }
.article-filter__chip:hover { border-color: var(--cyan); }
.article-filter__chip[aria-pressed="true"] { border-color: var(--lime); background: var(--lime); color: var(--bg); font-weight: 600; }
.article-filter__clear { justify-self: start; min-height: 36px; padding: 6px 0; border: 0; background: transparent; color: var(--cyan); font: inherit; font-size: .9rem; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
@media (max-width: 480px) { .article-catalog__tools { padding: 16px; } }
.article-catalog [data-catalog-status] { color: var(--muted); font-size: .9rem; margin: 20px 0; }
.article-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 18px; margin-top: 32px; }
.article-pagination button { padding: 10px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--ink); cursor: pointer; }
.article-pagination button:hover:not(:disabled) { border-color: var(--cyan); }
.article-pagination button:disabled { opacity: .45; cursor: default; }
.article-pagination span { color: var(--muted); font-size: .9rem; }
.article-cover { margin: 0 0 40px; }
.article-cover img { width: 100%; height: auto; border-radius: 16px; }

@media (min-width: 901px) {
  .article-catalog--filterable { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 28px; align-items: start; }
  .article-catalog--filterable .article-catalog__tools { grid-column: 2; grid-row: 2; }
  .article-catalog--filterable .article-catalog__results { grid-column: 1; grid-row: 2; }
  .article-catalog--filterable .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-catalog--filterable [data-catalog-status] { grid-column: 1 / -1; grid-row: 1; margin: 0; }
}
@media (pointer: coarse) { .article-filter__chip, .article-filter__clear { min-height: 44px; } }

.article-breadcrumbs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-bottom: 24px; color: var(--muted); font-size: .85rem; }
.article-breadcrumbs a:hover, .article-byline a:hover { color: var(--cyan); }
.article-byline { font-size: .9rem; }
.article-byline a { text-decoration: underline; text-underline-offset: .2em; }