/* Topic navigation is a true tab control: one focused content panel at a time. */
.game-topic-tabs { padding: 7px; gap: 4px; border: 1px solid var(--gh-line); border-radius: 10px; background: #121c2d; }
.game-topic-tab { border: 0; border-radius: 6px; padding: 10px 16px; background: transparent; color: #a9b8cc; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.game-topic-tab:hover { color: #eff6ff; background: rgba(255,255,255,.06); }
.game-topic-tab.is-active { color: #fff; background: #2b5fae; box-shadow: 0 3px 10px rgba(15, 47, 96, .34); }
.game-topic-tab em { display: inline-grid; min-width: 18px; height: 18px; margin-left: 4px; padding: 0 4px; place-items: center; border-radius: 99px; background: rgba(255,255,255,.12); color: inherit; font-size: 11px; font-style: normal; }
.game-topic-panel[hidden] { display: none; }
.game-topic-panel.is-active { animation: game-topic-panel-in .18s ease-out; }
.game-topic-panel .game-resource-grid { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.game-topic-panel .resource-panel--base { grid-column: 1 / -1; min-height: 0; padding: 20px; background: linear-gradient(110deg, #203b64, #19263a); }
.resource-panel--base h2 span { color: #79d5ae; }
.resource-base-entry { display: grid; }
.resource-base-entry .resource-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 20px; border: 0; border-top: 1px solid rgba(255,255,255,.12); padding: 10px 0; }
.resource-base-entry .resource-entry:first-child { border-top: 0; padding-top: 0; }
.resource-base-entry .resource-entry:last-child { padding-bottom: 0; }
.resource-base-entry .resource-entry b { font-size: 15px; }
.resource-base-entry .resource-entry small { margin: 0; text-align: right; }
.resource-empty--catalog { margin: 13px 0 0; padding: 0; }
.game-resource-grid--extras { align-items: start; }
.topic-related-wrap { margin-top: 30px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); }
.game-series-intro { display:flex; gap:22px; align-items:flex-start; max-width:1180px; margin:0 auto 22px; padding:20px 24px; border:1px solid var(--gh-line); border-top:0; border-radius:0 0 12px 12px; background:#101a2a; }
.game-series-intro .game-eyebrow { flex:0 0 122px; padding-top:4px; }
.game-series-intro h2 { margin:0 0 7px; font-size:17px; color:#fff; }
.game-series-intro p { margin:0; color:#b8c7dc; font-size:14px; line-height:1.75; }
.requirements-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.requirements-card { padding:18px; border:1px solid #ffffff12; border-radius:8px; background:#17243a; }
.requirements-card--recommended { background:linear-gradient(135deg,#1d3558,#17243a); border-color:#4e78af66; }
.requirements-card h2,.requirements-card h3 { margin:0 0 14px; font-size:15px; color:#fff; }
.requirements-card h3 { font-size:14px; }
.requirements-card dl { margin:0; }
.requirements-card dl div { display:grid; grid-template-columns:82px minmax(0, 1fr); gap:10px; padding:8px 0; border-top:1px solid #ffffff0d; font-size:13px; line-height:1.5; }
.requirements-card dl div:first-child { border-top:0; padding-top:0; }
.requirements-card dt { color:#8fa6c6; }.requirements-card dd { margin:0; color:#e0eaff; }
.version-requirements { margin-top:22px; padding-top:18px; border-top:1px solid #ffffff12; }.version-requirements>h2 { font-size:15px; margin:0 0 10px; }.version-requirements details { padding:12px 0; border-top:1px solid #ffffff10; }.version-requirements summary { cursor:pointer; color:#bdd6ff; font-size:13px; font-weight:700; }.version-requirements .requirements-grid { margin-top:13px; }.version-requirements .requirements-card { padding:14px; }
@keyframes game-topic-panel-in { from { opacity: .35; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 760px) {
  .game-topic-tabs { margin-bottom: 16px; overflow-x: auto; white-space: nowrap; }
  .game-topic-tab { flex: 0 0 auto; padding: 9px 13px; }
  .game-series-intro { display:block; margin:0 0 16px; padding:16px; border-radius:0 0 9px 9px; }.game-series-intro .game-eyebrow { display:block; margin-bottom:9px; }.game-series-intro p { font-size:13px; }
  .requirements-grid { grid-template-columns:1fr; }.requirements-card { padding:15px; }
}
