/* Společný základ pro tři směry. Variantní vzhled je v night.css / daylight.css / launchpad.css. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
a { color: inherit; }
h1, h2, h3, p, ul { margin: 0; }
ul { padding: 0; list-style: none; }
[hidden] { display: none !important; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

.skip-link {
  position: fixed; left: 12px; top: -80px; z-index: 200;
  padding: 12px 18px; min-height: 44px; background: #fff; color: #101b2b;
  font-weight: 700; text-decoration: none; border: 2px solid currentColor;
}
.skip-link:focus { top: 12px; }

:focus-visible { outline: 3px solid var(--focus, #83d3e9); outline-offset: 3px; }
:focus:not(:focus-visible) { outline: none; }
.btn:disabled, [data-reset-all]:disabled { opacity: .42; cursor: default; }

/* Obrázky: rezervovaný poměr, contain, bezpečný fallback přes listener v app.js */
.thumb {
  position: relative; display: grid; place-items: center; overflow: hidden;
  aspect-ratio: 460 / 215; background: var(--thumb-bg, #0b1522);
}
.thumb img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; opacity: 0; transition: opacity 220ms ease;
}
.thumb img.is-loaded { opacity: 1; }
.thumb.is-missing img { display: none; }
.thumb-fallback {
  position: relative; z-index: 0; padding: 14px; text-align: center;
  font-size: 12px; line-height: 1.35; color: var(--thumb-fg, #8296a8);
}

.badge-new {
  position: absolute; z-index: 2; left: 10px; top: 10px;
  padding: 4px 8px; font-size: 10px; font-weight: 800;
  letter-spacing: .1em; text-transform: uppercase;
}

/* Full descriptions and usable touch targets across all three variants. */
.game-card .card-desc { display: block; overflow: visible; -webkit-line-clamp: unset; }
.game-card .card-tag, .feature-tags .card-tag { min-height: 44px; }
[data-results-heading] { scroll-margin-top: 110px; }
input, select { caret-color: var(--focus, currentColor); }

/* Panel filtrů: zavřený nesmí být v tab pořadí ani v a11y stromu */
[data-filter-panel][data-open="false"] { display: none !important; }
[data-scrim] {
  position: fixed; inset: 0; z-index: 70; border: 0; padding: 0;
  background: rgba(4, 8, 12, .62);
}
body.filters-open { overflow: hidden; }

/* Prázdný stav a chyba dat */
.data-error {
  padding: 28px; border: 2px dashed currentColor;
  max-width: 620px; margin: 24px auto; text-align: center;
}
.data-error h2 { font-size: 22px; margin-bottom: 8px; }
.data-error p { line-height: 1.6; }

.tag-option {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  width: 100%; min-height: 44px; padding: 7px 10px;
  background: transparent; border: 0; border-bottom: 1px solid var(--line);
  text-align: left; font-size: 13.5px; line-height: 1.3;
}
.tag-option::before {
  content: ""; flex: 0 0 12px; width: 12px; height: 12px;
  border: 1px solid currentColor; border-radius: 1px; opacity: .5;
}
.tag-option[aria-pressed="true"]::before {
  background: currentColor; opacity: 1;
  box-shadow: inset 0 0 0 2px var(--bg, #fff);
}
.tag-option .tag-name { min-width: 0; flex: 1 1 auto; }
.tag-option .tag-count { font-variant-numeric: tabular-nums; opacity: .72; font-size: 12px; }
.tag-option[aria-pressed="true"] { font-weight: 700; }
.tag-option[aria-pressed="true"] .tag-count { opacity: 1; }

.selected-chip, .selected-clear, .card-tag, .kind-btn, .filter-trigger, .btn {
  min-height: 44px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}