/* Compact discovery: reserve visual priority for real game artwork. */
.site-header { position: relative !important; min-height: 0 !important; padding: 0 12px !important; }
.site-header > .header-inner, .site-header:not(:has(> .header-inner)) { display: grid !important; grid-template-columns: minmax(0,1fr) 44px !important; align-items: center !important; gap: 0 10px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
.site-header .brand, .site-header .wordmark { min-height: 44px !important; font-size: 18px !important; line-height: 1.15 !important; margin: 0 !important; gap: 8px !important; }
.site-header .brand-mark,.site-header .book-mark,.site-header .mark,.site-header .brand > svg { max-width: 25px !important; max-height: 25px !important; }
.site-header nav { grid-column: 1 / -1 !important; display: flex !important; flex-wrap: nowrap !important; white-space: nowrap !important; overflow-x: auto !important; scrollbar-width: none; min-width: 0 !important; gap: 18px !important; padding: 0 !important; margin: 0 !important; border: 0 !important; }
.site-header nav a { flex: 0 0 auto; font-size: 12px !important; line-height: 1.25 !important; min-height: 28px !important; padding: 4px 0 7px !important; border-width: 0 0 1px !important; }
.compact-open { display: grid !important; place-items: center !important; width: 44px !important; height: 44px !important; min-height: 44px !important; padding: 10px !important; border: 0 !important; background: transparent !important; color: inherit !important; cursor: pointer; font-size: 0 !important; overflow: hidden; }
.compact-open svg { width: 24px; height: 24px; stroke: currentColor; stroke-width: 1.7; fill: none; }
.compact-open:not(:has(svg))::before { content: ''; width: 22px; height: 22px; display: block; background: currentColor; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 7h16M4 17h16M9 4v6m6 4v6' fill='none' stroke='black' stroke-width='1.7'/%3E%3C/svg%3E") center/contain no-repeat; }
.compact-open:focus-visible,.compact-card:focus-visible { outline: 3px solid currentColor !important; outline-offset: 3px; }
.compact-discovery main { padding-top: 8px !important; }
.compact-sr-only,.compact-discovery .compact-quiet-heading,.compact-search-summary,.compact-discovery #home-status,.compact-discovery #zone-status { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; }
.compact-game-list { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 12px !important; margin: 0 !important; padding: 0 !important; }
.compact-game-list > * { min-width: 0; margin: 0 !important; padding: 0 !important; border: 0 !important; }
.compact-list-actions { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 14px 0; }
.compact-list-actions:empty { display: none; }
.compact-list-actions button { min-height: 44px; }
.compact-card { display: flex !important; flex-direction: column !important; position: relative !important; min-width: 0 !important; width: 100% !important; min-height: 0 !important; height: auto !important; padding: 0 !important; gap: 0 !important; margin-top: 0 !important; margin-bottom: 0 !important; overflow: hidden !important; text-decoration: none !important; color: inherit !important; transform: none !important; }
.compact-card .compact-cover { display: block !important; position: relative !important; width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; overflow: hidden !important; padding: 0 !important; margin: 0 !important; }
.compact-card .compact-cover img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; margin: 0 !important; padding: 0 !important; max-width: none !important; max-height: none !important; }
.compact-card .compact-title { display: block !important; font-size: 13px !important; line-height: 1.3 !important; font-weight: 600 !important; padding: 7px 8px 9px !important; margin: 0 !important; text-align: left !important; overflow-wrap: anywhere; }
.compact-discovery :is(.home-row,.comparison-grid,.pair-grid,.feature-grid,.photo-row,.photo-pair,.card-grid,.game-grid,.rows) { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; align-items: start !important; gap: 12px !important; }
.compact-discovery .photo-row > .photo-pair { display: contents !important; }
.compact-discovery :is(.shelf-block,.comparison,.photo-strip,.pair-block,.panel-block,.home-panel,.game-batch,.catalogue-batch,.catalogue-block,.contact-batch) { padding: 0 !important; margin-top: 0 !important; margin-bottom: 14px !important; min-height: 0 !important; }
.compact-discovery :is(.shelf-footer,.panel-bottom,.queue-note) p { display: none; }
.compact-discovery :is(.shelf-footer,.panel-bottom,.queue-note) { padding: 6px 0 !important; margin: 0 0 8px !important; min-height: 0 !important; }
.compact-discovery .manual-spread .compact-cover,.compact-discovery .feature.compact-card .compact-cover { aspect-ratio: 2 / 1 !important; }
.compact-discovery .manual-spread { margin-bottom: 12px !important; }
.compact-controls { max-width: min(92vw,520px) !important; width: 520px !important; max-height: calc(100dvh - 24px) !important; padding: 16px !important; overflow-y: auto !important; overscroll-behavior: contain; border-radius: 12px; color: inherit; }
.compact-controls[open] { display: flex !important; flex-direction: column !important; gap: 14px !important; }
.compact-controls::backdrop { background: rgb(12 21 31 / .55); }
.compact-controls > form:not([role="search"]) { display: contents !important; }
.compact-controls :is(.dialog-body,.filter-body,.filter-content,.dialog-content) { overflow: visible !important; max-height: none !important; min-height: 0 !important; padding: 0 !important; }
.compact-controls :is(.dialog-header,.dialog-heading,.compact-dialog-heading) { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 !important; margin: 0 !important; }
.compact-controls h2 { font-size: 20px !important; margin: 0 !important; }
.compact-controls :is(.dialog-footer,.dialog-actions,.filter-actions) { position: sticky !important; bottom: -16px; padding: 12px 0 max(12px,env(safe-area-inset-bottom)) !important; background: var(--paper,var(--surface,#fff)); margin: 0 !important; }
.compact-controls .compact-search { display: flex !important; flex-direction: column !important; gap: 8px !important; width: 100% !important; padding: 0 !important; margin: 0 !important; }
.compact-controls .compact-search > div { display: flex !important; gap: 8px; }
.compact-controls .compact-search :is(input[type=search],.search-field) { width: 100% !important; min-width: 0 !important; min-height: 44px !important; }
.compact-controls .compact-search button { min-height: 44px !important; }
.compact-controls :is(.lane-buttons,.zone-tabs,.input-switch,.queue-tabs) { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 8px !important; width: 100% !important; margin: 0 !important; }
.compact-controls :is(.lane-buttons,.zone-tabs,.input-switch,.queue-tabs) button { min-width: 0 !important; min-height: 44px !important; }
@media (min-width: 768px) { .compact-game-list { grid-template-columns: repeat(4,minmax(0,1fr)) !important; gap: 16px !important; } .compact-card .compact-title { font-size: 14px !important; } .site-header { padding-inline: 24px !important; } }
@media (max-width: 420px) { .compact-game-list,.compact-discovery :is(.home-row,.comparison-grid,.pair-grid,.feature-grid,.photo-row,.card-grid,.game-grid,.rows) { gap: 9px !important; } .compact-card .compact-title { padding: 6px !important; } }

.compact-card { grid-area: auto !important; grid-column: auto !important; grid-row: auto !important; }
.compact-discovery .compact-photo-grid > .compact-card:last-child { grid-column: 1 / -1 !important; }
.compact-discovery .compact-photo-grid > .compact-card:last-child .compact-cover { aspect-ratio: 2.5 / 1 !important; }
@media (min-width: 768px) { .compact-discovery .compact-cover { max-height: 230px !important; } .compact-discovery .compact-photo-grid { grid-template-columns: repeat(3,minmax(0,1fr)) !important; } .compact-discovery .compact-photo-grid > .compact-card:last-child { grid-column: auto !important; } .compact-discovery .compact-photo-grid > .compact-card:last-child .compact-cover { aspect-ratio: 4 / 3 !important; } }

@media (max-width: 767px) { .compact-discovery .manual-spread .compact-cover,.compact-discovery .feature.compact-card .compact-cover { aspect-ratio: 2.3 / 1 !important; } }
.compact-cover img[hidden] { display: none !important; }
.compact-cover .compact-image-fallback { position: absolute; inset: 0; display: grid; place-items: center; padding: 12px; font-size: 14px; }

/* One quiet set of required information links on every page. */
.compact-footer {
  display: block !important;
  min-height: 0 !important;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom)) !important;
  font-size: 12px !important;
}
.compact-footer > nav {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 2px 18px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.compact-footer > nav > a {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  padding: 3px 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  white-space: nowrap;
}

/* A bottom panel keeps selection controls within easy reach. */
dialog.compact-dialog-sheet {
  position: fixed !important; inset: auto 0 0 !important; margin: 0 auto !important;
  width: min(680px,100vw) !important; max-width: 100vw !important;
  height: fit-content !important; max-height: 82dvh !important;
  border-radius: 20px 20px 0 0 !important;
  padding-bottom: max(16px,env(safe-area-inset-bottom)) !important;
}
dialog.compact-dialog-sheet::before { content: ''; display: block; flex: 0 0 4px; width: 36px; height: 4px; margin: -4px auto 0; border-radius: 4px; background: currentColor; opacity: .25; }

/* Quiet rounded details retain each site's own palette and selection pattern. */
.compact-card { border-radius: 12px !important; }
.compact-card .compact-cover { border-radius: 12px 12px 0 0 !important; }
.compact-controls { border: 1px solid color-mix(in srgb,currentColor 14%,transparent) !important; box-shadow: 0 18px 60px rgb(14 24 36 / .16) !important; }
.compact-controls button,.compact-controls input[type=search] { border-radius: 10px !important; font: inherit; }
.compact-controls input[type=search] { border: 1px solid color-mix(in srgb,currentColor 22%,transparent) !important; padding: 10px 12px !important; }
.compact-controls button { min-height: 40px; padding-inline: 14px; }
.compact-controls :is([data-compact-close],[data-filter-close],#filter-close,#close-filters) {
  min-height: 40px !important; border-radius: 999px !important; padding: 8px 14px !important;
  border: 1px solid color-mix(in srgb,currentColor 12%,transparent) !important;
  color: inherit !important; background: color-mix(in srgb,currentColor 4%,transparent) !important;
  box-shadow: none !important;
}
.compact-controls :is(.radio-row,.radio-option,.radio-label),.compact-controls label:has(> input[type=radio]) { border-radius: 9px !important; }
.compact-list-actions button { border-radius: 999px !important; padding-inline: 20px !important; }
.compact-controls :is(button,input),.compact-card,.compact-category-strip > :is(a,button) { transition: background-color 140ms ease,border-color 140ms ease,box-shadow 140ms ease; }
.site-header nav::-webkit-scrollbar { display: none; }
@media (prefers-reduced-motion: reduce) { .compact-controls :is(button,input),.compact-card,.compact-category-strip > :is(a,button) { transition: none !important; } }

/* Fixed site identity: three columns on phones from 375px, two on narrow phones. */
@media (min-width: 375px) and (max-width: 767px) {
  .compact-discovery .compact-game-list { grid-template-columns: repeat(3,minmax(0,1fr)) !important; gap: 9px !important; }
  .compact-discovery .compact-title { font-size: 12px !important; line-height: 1.35 !important; padding: 6px !important; }
}
@media (max-width: 374px) {
  .compact-discovery .compact-game-list { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 9px !important; }
}

/* Artwork fills its entire cover; equal two-line captions keep rows aligned. */
.compact-card .compact-cover { flex: 0 0 auto !important; }
.compact-card .compact-cover > img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
.compact-card .compact-title {
  box-sizing: border-box !important; display: -webkit-box !important;
  -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  line-height: 1.3 !important; height: calc(2.6em + 16px) !important;
  min-height: calc(2.6em + 16px) !important; max-height: calc(2.6em + 16px) !important;
  overflow: hidden !important;
}
.compact-discovery main { row-gap: 0 !important; }
.compact-discovery main > :is(section,article),.compact-discovery main > div > :is(section,article) { min-height: 0 !important; margin-block: 0 18px !important; }

/* Keep the selected game and preview close to the compact site header. */
.compact-player main { padding-top: 8px !important; }
.compact-player :is(.breadcrumb,.breadcrumbs,.crumb,.back-row) { padding: 0 !important; margin: 0 0 8px !important; font-size: 12px !important; line-height: 1.5 !important; min-height: 0 !important; }
.compact-player :is(.game-heading,.game-title,.play-title) { padding: 0 !important; margin: 0 0 12px !important; gap: 8px !important; min-height: 0 !important; }
.compact-player main h1 { font-size: clamp(20px,3vw,28px) !important; line-height: 1.15 !important; margin: 0 !important; }
.compact-player :is(.game-heading,.game-title,.play-title) :is(p,.eyebrow,.meta) { margin: 4px 0 0 !important; font-size: 12px !important; line-height: 1.4 !important; }
.compact-player :is(.player-block,.player-panel) { padding: 0 !important; margin-top: 0 !important; }
.compact-player :is(.player-tools,.player-toolbar,.player-controls,.stage-toolbar) { gap: 6px !important; padding: 8px !important; }
.compact-player :is(.player-tools,.player-toolbar,.player-controls,.stage-toolbar) button { min-height: 40px !important; padding: 7px 12px !important; border-radius: 10px !important; font-size: 12px !important; }
.compact-player :is(.player-status,.stage-status) { font-size: 12px !important; line-height: 1.45 !important; padding: 8px 10px !important; margin: 0 !important; }
.compact-player :is(.preview-label,.preview-tag) { max-width: calc(100% - 20px) !important; padding: 6px 10px !important; font-size: 11px !important; border-radius: 8px !important; }
/* Cover sizing applies before connection. Existing iframe and fullscreen geometry remains authoritative. */
.compact-player:not(:has(:fullscreen)) :is(.player-stage,#player-screen,#game-stage,#game-screen,#stage-screen,#stage):not(:has(iframe)):not(:has(.stage-screen)):not(:fullscreen) { aspect-ratio: 4 / 3 !important; min-height: 0 !important; }
.compact-player :is(.player-stage,#game-screen) > img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }

.compact-player :is(.game-head,.inspect-heading) { padding: 0 !important; margin: 0 0 12px !important; }
.compact-player :is(.game-head,.inspect-heading) :is(.meta,p,.category-label) { font-size: 12px !important; margin: 4px 0 !important; line-height: 1.4 !important; }
.compact-player .game-facts { gap: 8px !important; font-size: 12px !important; margin-top: 4px !important; }
.compact-player .player-actions { display: flex !important; flex-wrap: wrap !important; gap: 6px !important; padding: 8px !important; }
.compact-player .player-actions button { min-height: 40px !important; padding: 7px 12px !important; border-radius: 10px !important; font-size: 12px !important; }
.compact-player :is(.preview-panel,.picture) > img { width: 100% !important; height: 100% !important; object-fit: cover !important; }

@media (max-width:374px) {
  .compact-discovery #sheet-groups > .compact-game-list > :last-child:nth-child(2n+1):not(:first-child) { grid-column: 1 / -1 !important; }
  .compact-discovery #sheet-groups > .compact-game-list > :last-child:nth-child(2n+1):not(:first-child) .compact-cover { aspect-ratio: 8 / 3 !important; }
}

.compact-controls :is(.dialog-footer,.dialog-actions,.filter-actions) { bottom: 0 !important; z-index: 2; padding: 10px 0 max(10px,env(safe-area-inset-bottom)) !important; }

/* Keep actions outside the scrollable choices so they never cover a filter group. */
#sheet-filters {
  padding: 12px 16px 0 !important; overflow: hidden !important;
  height: min(620px,82dvh) !important; max-height: 82dvh !important;
  background: var(--paper); gap: 10px !important;
}
#sheet-filters > .dialog-header { flex: 0 0 auto; padding-bottom: 8px !important; }
#sheet-filters .dialog-header h2 { font-size: 18px !important; }
#sheet-filters .dialog-header button { min-height: 44px; padding: 8px 12px !important; }
#sheet-filters > .sheet-filter-scroll {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  scrollbar-gutter: stable; padding: 0 2px 8px 0;
}
#sheet-filters #filter-form { display: block !important; margin-top: 16px; }
#sheet-filters .filter-body { overflow: visible !important; padding: 0 !important; }
#sheet-filters .compact-search { display: grid !important; grid-template-columns: minmax(0,1fr) auto !important; gap: 8px !important; }
#sheet-filters .compact-search .sr-only { position: absolute !important; }
#sheet-filters .compact-search :is(input,button) { font-size: 14px !important; }
#sheet-filters .filter-group summary { min-height: 46px; font-size: 14px; }
#sheet-filters .radio-grid { gap: 7px; }
#sheet-filters .radio-grid label { min-height: 44px; padding: 8px; font-size: 13px; border-radius: 9px; }
#sheet-filters .radio-grid label span { font-size: 12px; }
#sheet-filters .radio-grid input { width: 16px; height: 16px; }
#sheet-filters > .dialog-actions {
  position: static !important; flex: 0 0 auto; margin: 0 !important;
  padding: 10px 0 max(12px,env(safe-area-inset-bottom)) !important;
}
#sheet-filters > .dialog-actions button { min-height: 44px; font-size: 14px; }

/* A real combined search/category form for pages without a native filter panel. */
#compact-discover { height: min(540px,calc(100dvh - 24px)) !important; overflow: hidden !important; }
#compact-discover > .compact-dialog-heading { flex: 0 0 auto; }
#compact-discover > .compact-search { flex: 1 1 auto; min-height: 0; overflow: hidden; gap: 12px !important; }
#compact-discover .compact-search-field { display: flex !important; flex-direction: column; flex: 0 0 auto; gap: 6px !important; }
#compact-discover .compact-search-field label { font-size: 13px; }
#compact-discover .compact-category-choices { flex: 1 1 auto; min-height: 0; padding: 0; margin: 0; border: 0; overflow-y: auto; overscroll-behavior: contain; }
#compact-discover .compact-category-choices legend { padding: 0 0 8px; font-size: 13px; font-weight: 700; }
#compact-discover .compact-category-choices > div { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
#compact-discover .compact-category-choices label { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px; border: 1px solid color-mix(in srgb,currentColor 12%,transparent); border-radius: 9px; font-size: 13px; cursor: pointer; }
#compact-discover .compact-category-choices label:has(input:checked) { background: color-mix(in srgb,currentColor 7%,transparent); border-color: color-mix(in srgb,currentColor 40%,transparent); }
#compact-discover .compact-category-choices input { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; accent-color: var(--ink,currentColor); }
#compact-discover .compact-find { flex: 0 0 auto; width: 100%; min-height: 44px; font-size: 14px; }

#sheet-filters #filters-heading:focus { outline: 0; }
