:root { --text-xs: .875rem; --text-xs--line-height: 1.45; }
html { scroll-behavior: smooth; }
body { overflow-x: clip; }
.brand-logo { width: 34px; height: 34px; object-fit: contain; }
.hero-art { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; object-position: 70% 49%; opacity: .86; }
.hero-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#0b1018 0%,rgba(11,16,24,.88) 24%,rgba(11,16,24,.27) 62%,transparent),linear-gradient(0deg,#0b1018,transparent 35%); }
.hero-kicker { font-size: 14px !important; letter-spacing: .08em; }
.card-title { overflow-wrap: anywhere; }
section[aria-labelledby^="shelf-"] a[href^="/games?"] { white-space:nowrap; flex-shrink:0; }
[aria-label="Sort all games"] button[aria-pressed="true"] { background:var(--color-accent); color:var(--color-page); }
[aria-label="Sort all games"] button[aria-pressed="false"] { background:transparent; color:var(--color-muted); }
.browse-sort { min-width:0; }
.browse-sort a[aria-current="false"] { color:var(--color-muted); background:transparent; box-shadow:none; }
.browse-sort a[aria-current="page"] { color:var(--color-accent); background:color-mix(in srgb,var(--color-accent) 15%,transparent); }
.page-intro { max-width: 68ch; color: var(--color-muted); margin: 16px 0 22px; line-height: 1.6; }
.card-stats { display: inline-flex; align-items: center; gap: 4px; }
.stat-number { font-size: 14px; }
.submission-message { padding: 16px; margin: 16px 0; border-radius: 10px; border: 1px solid var(--color-edge-strong); line-height: 1.6; }
.submission-message:empty { display: none; }
.field-error { color: #fca5a5; }
.legal-content h2 { font-size: 22px; font-weight: 700; margin-top: 28px; }
.legal-content p,.legal-content li { line-height: 1.75; margin-top: 12px; }
.legal-content a { color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; }
.cookie-panel { position: fixed; z-index: 60; right: 20px; bottom: 20px; width: min(390px,calc(100vw - 32px)); border: 1px solid var(--color-edge-strong); border-radius: 12px; padding: 16px; background: var(--color-surface); box-shadow: 0 12px 40px #0006; }
.cookie-panel p { font-size: 14px; line-height: 1.5; }
.cookie-panel .cookie-buttons { display: flex; gap: 10px; margin-top: 12px; }
.cookie-panel button { flex: 1; }
[hidden] { display: none !important; }
dialog::backdrop { background: #000b; backdrop-filter: blur(3px); }
.report-form { display: grid; gap: 14px; margin-top: 16px; }
.report-form label { display: grid; gap: 7px; }
.skip-link { position: absolute; left: 16px; top: -80px; z-index: 100; padding: 12px; background: var(--color-accent); color: #0b1018; border-radius: 8px; }
.skip-link:focus { top: 10px; }
.more-navigation { display:flex; gap:12px; margin-top:24px; }
.age-notice { margin: 24px 0; padding: 22px; border: 1px solid var(--color-edge-strong); border-radius: 12px; }
@media(max-width:767px) {
  .browse-sort { display:flex; flex-wrap:wrap; width:100%; }
  .browse-sort a { flex:1 0 42%; min-height:40px; justify-content:center; }
  .hero-art { object-position: 73% 50%; opacity: .48; }
  .hero-shade { background: linear-gradient(90deg,rgba(11,16,24,.90),rgba(11,16,24,.55)),linear-gradient(0deg,#0b1018,transparent 55%); }
  .cookie-panel { right: 16px; bottom: calc(78px + env(safe-area-inset-bottom)); }
  .hero-kicker { max-width: 100%; white-space: normal; }
  .card-title { font-size: 14px !important; }
  .card-hover-host { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
}
