@font-face { font-family: Inter; src: url('../assets/inter-variable.woff2') format('woff2'); font-style: normal; font-weight: 100 900; font-display: swap; }
:root {
  color-scheme:dark;
  --ground:#0b0b0c;
  --surface:#151516;
  --raised:#202022;
  --ink:#f5f5f5;
  --muted:#b8b7b5;
  --accent:#ff0000;
  --link:#ff0000;
  --accent-ink:#fff;
  --gutter:clamp(20px,4vw,64px);
  --max:1440px;
  --ease:cubic-bezier(.16,1,.3,1);
  --radius-control:14px;
  --radius-panel:14px;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:112px;
  zoom:.9;
}
body {
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font:400 17px/1.6 Inter,sans-serif;
  -webkit-font-smoothing:antialiased;
}
::selection {
  background:var(--accent);
  color:var(--accent-ink);
}
a {
  color:inherit;
  text-decoration:none;
  text-underline-offset:.25em;
}
button,input {
  font:inherit;
}
button,a,input,summary {
  -webkit-tap-highlight-color:transparent;
}
button {
  cursor:pointer;
}
button,a,summary {
  touch-action:manipulation;
}
:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:6px;
}
img {
  max-width:100%;
  height:auto;
  display:block;
}
h1,h2,h3,p {
  margin:0;
}
h1,h2,h3 {
  font-family:Inter,sans-serif;
  font-weight:700;
  line-height:1.03;
  letter-spacing:-.025em;
  text-wrap:balance;
}
p {
  max-width:65ch;
  text-wrap:pretty;
}
h1 {
  font-size:clamp(64px,10.5vw,152px);
}
h2 {
  font-size:clamp(40px,5vw,72px);
}
h3 {
  font-size:clamp(28px,3vw,40px);
}
.frame {
  max-width:var(--max);
  margin-inline:auto;
  padding-inline:var(--gutter);
}
.skip {
  position:absolute;
  top:12px;
  left:16px;
  padding:12px 20px;
  background:var(--ink);
  color:var(--ground);
  z-index:10;
  transform:translateY(-180%);
}
.skip:focus {
  transform:none;
}
.skip:not(:focus) {
  width:1px;
  height:1px; /* taste-skill-ignore: visually clipped keyboard skip link, not decoration. */
  overflow:hidden;
  clip-path:inset(50%);
  padding:0;
}
.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:104px;
  gap:24px;
}
.brand {
  display:flex;
  align-items:center;
  gap:12px;
  font-family:Inter,sans-serif;
  font-size:28px;
  letter-spacing:-.02em;
}
.brand img {
  width:38px;
  height:38px;
}
.nav {
  display:flex;
  align-items:center;
  gap:32px;
}
.nav a {
  padding-block:10px;
}
.nav a:hover,.text-link:hover {
  color:var(--link);
}
.nav .button:hover {
  color:var(--ink);
}
.button {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  min-height:52px;
  padding:13px 24px;
  background:var(--accent);
  color:var(--accent-ink);
  border:0;
  border-radius:var(--radius-control);
  font-weight:400;
  transition:background-color .2s,transform .2s var(--ease);
}
.button:hover {
  background:#ff0000;
  transform:translateY(-2px);
}
.button:active {
  transform:translateY(1px);
}
.button.secondary {
  background:var(--raised);
  color:var(--ink);
}
.button.secondary:hover {
  background:#303032;
}
.button svg,.external-icon {
  width:18px;
  height:18px;
  flex:none;
}
.hero {
  position:relative;
  padding-top:35px;
  padding-bottom:68px;
}
.hero h1 {
  position:relative;
  z-index:1;
}
.hero-bottom {
  display:grid;
  grid-template-columns:1fr 1.1fr;
  align-items:center;
  gap:7%;
  margin-top:24px;
}
.hero-copy {
  max-width:490px;
  align-self:center;
}
.hero-copy .lead {
  font-size:clamp(26px,3vw,40px);
  line-height:1.2;
  letter-spacing:-.02em;
  margin-bottom:24px;
}
.hero-copy .description {
  color:var(--muted);
}
.actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:20px;
  margin-top:30px;
}
.text-link {
  display:inline-flex;
  gap:10px;
  align-items:center;
  min-height:44px;
  padding-block:8px;
  transition:color .2s;
}
.hero-art {
  margin:0;
  position:relative;
  max-width:560px;
  justify-self:end;
  width:100%;
  overflow:hidden;
  aspect-ratio:1.15;
}
.hero-art img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  animation:art-arrive 1.3s var(--ease) both;
}
.hero-foot {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  margin-top:24px;
  color:var(--muted);
  font-size:15px;
}
.hero-foot a {
  color:var(--ink);
}
.section {
  padding-block:80px;
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:36px;
}
.section-heading p {
  max-width:430px;
  color:var(--muted);
}
.catalogue-tools {
  display:none;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  margin-bottom:28px;
}
.js .catalogue-tools {
  display:flex;
}
.filters {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.filter {
  border:0;
  background:transparent;
  color:var(--muted);
  min-height:46px;
  padding:10px 16px;
  border-radius:var(--radius-control);
  transition:background-color .2s,color .2s;
}
.filter[aria-pressed=true] {
  background:var(--raised);
  color:var(--ink);
}
.filter:hover {
  color:var(--ink);
  background:var(--surface);
}
.search {
  position:relative;
  min-width:230px;
}
.search input {
  width:100%;
  height:48px;
  border:1px solid #505052;
  border-radius:var(--radius-control);
  background:transparent;
  color:var(--ink);
  padding:10px 16px;
  caret-color:var(--accent);
}
.search input::placeholder {
  color:var(--muted);
}
.search label {
  position:absolute;
  width:1px;
  height:1px; /* taste-skill-ignore: clipped accessible search label, not a decorative line. */
  overflow:hidden;
  clip-path:inset(50%);
}
.game-list {
  display:grid;
  gap:20px;
}
.game-entry {
  display:grid;
  grid-template-columns:minmax(180px,30%) 1fr auto;
  gap:32px;
  align-items:center;
  padding:24px;
  background:var(--surface);
  border-radius:var(--radius-control);
  position:relative;
}
.game-entry[hidden],.game-entry.game-tile[hidden] {
  display:none;
}
.game-picture {
  overflow:hidden;
  aspect-ratio:16/9;
  background:var(--raised);
}
.game-picture img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.game-info h3 {
  margin-bottom:12px;
}
.game-info p {
  color:var(--muted);
  max-width:58ch;
}
.game-status {
  display:block;
  color:var(--muted);
  font-size:15px;
  margin-top:14px;
}
.feature-preview {
  margin-top:18px;
  font-size:15px;
  color:var(--ink);
}
.game-action {
  align-self:center;
  white-space:nowrap;
}
.game-action .text-link {
  padding:10px 16px;
  background:var(--raised);
  border-radius:var(--radius-control);
}
.game-action .text-link:hover {
  background:var(--ink);
  color:var(--ground);
}
.results {
  font-size:15px;
  color:var(--muted);
  margin-top:20px;
}
.empty {
  padding:32px;
  background:var(--surface);
}
.empty p {
  margin-block:12px 22px;
}
.loader-section {
  background:var(--surface);
  padding-block:76px;
  margin-block:60px;
}
.loader-grid {
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:7%;
  align-items:start;
}
.loader-grid .intro {
  margin-top:24px;
  color:var(--muted);
}
.code-wrap {
  position:relative;
  background:var(--ground);
  padding:24px;
  border-radius:var(--radius-control);
}
.code-header {
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:center;
  margin-bottom:22px;
}
.code-header p {
  color:var(--muted);
  font-size:15px;
}
.copy-button {
  background:var(--raised);
  color:var(--ink);
  border:0;
  min-height:44px;
  padding:8px 16px;
}
.copy-button:hover {
  background:#363638;
}
pre {
  margin:0;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  font:14px/1.8 ui-monospace,monospace;
}
code {
  font-family:ui-monospace,monospace;
}
.copy-feedback {
  font-size:15px;
  min-height:24px;
  color:var(--muted);
  margin-top:12px;
}
.instructions {
  margin:22px 0 0;
  padding-left:24px;
  color:var(--muted);
}
.instructions li {
  padding:5px 0;
}
.source-note {
  margin-top:20px;
  font-size:15px;
  color:var(--muted);
}
.source-note a {
  color:var(--link);
  font-weight:700;
  text-decoration:none;
}
.faq-layout {
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:7%;
}
.faq-list details {
  background:var(--surface);
  margin-bottom:12px;
  padding:0 24px;
  border-radius:var(--radius-control);
}
.faq-list summary {
  cursor:pointer;
  min-height:72px;
  padding:21px 30px 21px 0;
  position:relative;
  list-style:none;
}
.faq-list summary::-webkit-details-marker {
  display:none;
}
.faq-list summary::after {
  content:'+';
  position:absolute;
  right:0;
  top:20px;
  font-size:24px;
  line-height:1;
}
.faq-list details[open] summary::after {
  content:'×';
}
.faq-list details p {
  padding-bottom:24px;
  color:var(--muted);
}
.faq-list a {
  color:var(--link);
  font-weight:700;
  text-decoration:none;
}
.community {
  display:block;
  background:var(--accent);
  color:var(--accent-ink);
  padding-block:48px;
  margin-top:72px;
  transition:background-color .25s;
}
.community:hover {
  background:#ff0000;
}
.community .frame {
  display:flex;
  flex-direction:column;
  gap:28px;
}
.community-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
}
.community h2 {
  font-size:clamp(70px,13vw,176px);
  line-height:1;
}
.community-top h2 {
  font-size:clamp(70px,13vw,176px);
  line-height:1;
}
.community svg {
  width:48px;
  height:48px;
}
.site-footer {
  padding-top:52px;
  padding-bottom:36px;
}
.footer-top {
  display:flex;
  justify-content:space-between;
  gap:32px;
  align-items:start;
}
.footer-links {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
}
.footer-links a {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  font-size:15px;
}
.footer-bottom {
  display:flex;
  justify-content:space-between;
  gap:32px;
  margin-top:36px;
  font-size:14px;
  color:var(--muted);
}
.footer-bottom p {
  max-width:620px;
}
.page-intro {
  padding-block:56px 60px;
}
.page-intro h1 {
  font-size:clamp(52px,7vw,96px);
  max-width:1100px;
}
.page-intro p {
  color:var(--muted);
  margin-top:24px;
}
.game-intro {
  max-width:70ch;
  margin:-24px 0 40px;
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
}
.back {
  display:inline-flex;
  min-height:44px;
  align-items:center;
  margin-bottom:28px;
  color:var(--muted);
}
.back:hover {
  color:var(--ink);
}
.detail-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  padding-bottom:70px;
}
.detail-grid h2 {
  font-size:clamp(30px,3.2vw,44px);
  margin:0 0 8px;
}
.detail-grid>img,.detail-side>img {
  aspect-ratio:16/9;
  width:100%;
  object-fit:cover;
}
.detail-side {
  display:flex;
  flex-direction:column;
  gap:22px;
}
.detail-side .actions {
  margin:0;
}
.detail-side .source-note {
  margin:0;
  margin-top:auto;
}
.detail-grid section {
  display:flex;
  flex-direction:column;
  min-height:0;
}
.detail-grid .detail-status {
  margin-top:auto;
}
.feature-list {
  list-style:none;
  padding:0;
  margin:24px 0 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.feature-list li {
  padding:14px 16px;
  background:var(--surface);
  font-size:16px;
}
.detail-status {
  margin-top:24px;
  color:var(--muted);
}
.prose {
  max-width:850px;
  margin-bottom:100px;
}
.prose h2 {
  font-size:32px;
  margin:44px 0 18px;
}
.prose p,.prose ul,.prose dl {
  margin-bottom:20px;
  color:var(--muted);
}
.prose a {
  font-weight:700;
  text-decoration:none;
  color:var(--link);
}
.prose dt {
  color:var(--ink);
  margin-top:16px;
}
.prose dd {
  margin-left:0;
  white-space:pre-line;
}
.notice {
  padding:24px;
  background:var(--surface);
  margin-block:24px;
}
.notice p {
  margin:0;
}
.reveal {
  animation:arrive .8s var(--ease) both;
}
.reveal:nth-child(2) {
  animation-delay:.08s;
}
.reveal:nth-child(3) {
  animation-delay:.16s;
}
.reveal:nth-child(4) {
  animation-delay:.24s;
}
body {
  scrollbar-color:var(--muted) var(--ground);
}
@keyframes arrive {
  from {
    transform:translateY(18px);
    opacity:.65;
  }
  to {
    transform:translateY(0);
    opacity:1;
  }
}
@keyframes art-arrive {
  from {
    transform:translateY(24px);
    opacity:.7;
  }
  to {
    transform:translateY(0);
    opacity:1;
  }
}
@media(min-width:1600px) {
  .hero {
    padding-top:56px;
  }
  .hero-art {
    max-width:590px;
  }
}
@media(max-width:1000px) {
  .nav {
    gap:20px;
  }
  .game-entry {
    grid-template-columns:29% 1fr;
    gap:24px;
  }
  .game-action {
    grid-column:2;
    justify-self:start;
    margin-top:-12px;
  }
  .game-picture {
    grid-row:span 2;
    align-self:start;
  }
  .game-info h3 {
    font-size:32px;
  }
  .hero-art {
    aspect-ratio:1;
  }
  .hero h1 {
    font-size:12vw;
  }
  .section-heading {
    align-items:start;
  }
  .loader-grid,.faq-layout {
    gap:40px;
  }
  .feature-list {
    grid-template-columns:1fr;
  }
}
@media(max-width:650px) {
  body {
    font-size:16px;
  }
  .site-header {
    min-height:88px;
    gap:12px;
  }
  .brand {
    font-size:25px;
    gap:8px;
  }
  .brand img {
    width:30px;
    height:30px;
  }
  .nav {
    gap:16px;
    font-size:15px;
  }
  .nav .nav-source {
    display:none;
  }
  .nav .button {
    padding:9px 13px;
    min-height:44px;
  }
  .hero {
    padding-top:25px;
    padding-bottom:38px;
  }
  .hero h1 {
    font-size:18vw;
    line-height:1;
  }
  .hero-bottom {
    grid-template-columns:1fr;
    gap:24px;
    margin-top:30px;
  }
  .hero-copy {
    max-width:none;
  }
  .hero-copy .lead {
    font-size:28px;
    max-width:20ch;
    margin-bottom:16px;
  }
  .hero-art {
    max-width:100%;
    width:100%;
    aspect-ratio:1.6;
    justify-self:stretch;
    grid-row:2;
  }
  .hero-art img {
    object-position:center 47%;
  }
  .hero-foot {
    align-items:start;
    font-size:13px;
    gap:20px;
    margin-top:20px;
  }
  .hero-foot p {
    max-width:24ch;
  }
  .actions {
    gap:16px;
    margin-top:24px;
  }
  .section {
    padding-block:48px;
  }
  .section-heading {
    display:block;
    margin-bottom:28px;
  }
  .section-heading p {
    margin-top:18px;
  }
  .catalogue-tools {
    flex-direction:column;
    align-items:stretch;
    gap:16px;
  }
  .filter {
    padding-inline:12px;
    font-size:15px;
  }
  .search {
    width:100%;
  }
  .game-list {
    gap:20px;
  }
  .game-entry {
    grid-template-columns:1fr;
    gap:20px;
    padding:16px;
  }
  .game-picture {
    grid-row:auto;
    aspect-ratio:16/9;
  }
  .game-info h3 {
    font-size:32px;
  }
  .game-info p {
    font-size:16px;
  }
  .game-action {
    grid-column:auto;
    margin-top:0;
    justify-self:stretch;
  }
  .game-action .text-link {
    width:100%;
    justify-content:space-between;
  }
  .game-status {
    margin-top:12px;
  }
  .loader-section {
    padding-block:48px;
    margin-block:32px;
  }
  .loader-grid,.faq-layout,.detail-grid {
    grid-template-columns:1fr;
    gap:30px;
  }
  .loader-grid .intro {
    margin-top:18px;
  }
  .code-wrap {
    padding:20px;
  }
  .code-header {
    gap:12px;
  }
  .faq-list details {
    padding-inline:20px;
  }
  .faq-list summary {
    padding-block:18px;
  }
  .community {
    margin-top:44px;
    padding-block:36px;
  }
  .community-top {
    font-size:16px;
    align-items:start;
  }
  .community-top p {
    max-width:25ch;
  }
  .community h2 {
    font-size:18vw;
  }
  .community svg {
    width:32px;
    height:32px;
    flex:none;
  }
  .footer-top,.footer-bottom {
    flex-direction:column;
    gap:20px;
  }
  .footer-links {
    gap:12px 22px;
  }
  .site-footer {
    padding-top:36px;
  }
  .footer-bottom {
    margin-top:24px;
  }
  .page-intro {
    padding-block:32px 36px;
  }
  .page-intro h1 {
    font-size:52px;
  }
  .detail-grid {
    padding-bottom:40px;
  }
  .feature-list {
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .feature-list li {
    font-size:15px;
    padding:12px;
  }
  .prose {
    margin-bottom:60px;
  }
  .prose h2 {
    font-size:30px;
  }
  .prose a {
    overflow-wrap:anywhere;
  }
  .notice {
    padding:20px;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  .reveal,.hero-art img {
    animation:none;
  }
  .button,.text-link,.filter,.community {
    transition:none;
  }
  .button:hover,.button:active {
    transform:none;
  }
}
/* Keep linked icons at text size and reserve the red field for readable actions. */
:root {
  --ink:#f5f5f5;
  --accent:#ff0000;
}
.text-link svg {
  width:18px;
  height:18px;
  flex:none;
}
.hero-copy .description {
  font-size:18px;
}
.hero-copy .lead {
  font-size:36px;
}
.enter {
  animation:arrive .65s var(--ease) both;
}
@media(max-width:650px) {
  .hero-copy .lead {
    font-size:28px;
  }
  .hero-art {
    aspect-ratio:1.4;
  }
  .hero-art img {
    object-fit:contain;
  }
  .hero-foot p {
    max-width:none;
  }
  .hero-foot .text-link {
    max-width:52%;
    justify-content:end;
    text-align:right;
  }
  .hero-foot {
    align-items:center;
  }
}
@media(prefers-reduced-motion:reduce) {
  .enter {
    animation:none;
  }
}

.game-info .game-status{margin:0 0 12px;font-size:16px;color:var(--ink)}
.game-info .status-outdated{color:var(--link)}
/* Five reading sizes keep the catalogue, controls and prose on one scale. */
body{font-size:18px}
.brand,.hero-copy .lead,.game-info h3{font-size:36px}
.hero-foot,.game-status,.feature-preview,.results,.code-header p,.copy-feedback,.source-note,.footer-links a,.footer-bottom{font-size:16px}
pre{font-size:16px}
.community h2{font-size:clamp(64px,10.5vw,152px)}
@media(max-width:650px){body,.nav,.filter,.hero-foot,.hero-copy .description,.feature-list li,.game-info p,.community-top,.footer-bottom{font-size:16px}.brand,.hero-copy .lead,.game-info h3{font-size:28px}.community h2{font-size:18vw}}
@media(max-width:380px){
  .site-header{gap:8px}
  .site-header .brand{font-size:24px}
  .nav{gap:10px}
  .nav .button{white-space:nowrap;padding-inline:10px}
}

/* The shared navigation is rendered from the adapted 21st NavBar. */
.studio-header{--slop-allow:redundant-border;position:sticky;top:16px;z-index:40;width:calc(100% - 32px);max-width:1280px;min-height:88px;margin-block:16px;padding-inline:28px;background:transparent;border:1px solid transparent;border-radius:28px;gap:30px;box-shadow:none}
@supports (backdrop-filter:blur(20px)){.studio-header{background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}}
.studio-header .brand img{border-radius:10px}
.studio-header .brand{font-size:32px}
.studio-desktop-nav{display:flex;gap:28px;align-items:center;margin-left:auto}
.studio-desktop-nav a{min-height:52px;display:inline-flex;align-items:center;font-size:18px;color:var(--muted);transition:color .2s}
.studio-desktop-nav a:hover{color:var(--ink)}
.studio-cta{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:14px 26px;background:#8a0000;color:#fff;border-radius:var(--radius-control);font-size:18px;white-space:nowrap;transition:background-color .2s}
.studio-cta:hover{background:#ff0000}
.studio-mobile-menu{display:none}
.game-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.game-entry.game-tile{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;border-radius:var(--radius-panel)}
.game-tile .game-tile-picture{display:block;aspect-ratio:16/9;grid-row:auto}
.game-tile .game-tile-content{display:flex;flex-direction:column;flex:1;padding:28px}
.game-tile .game-status{margin:0 0 18px}
.game-tile .game-tile-description{margin:0;flex:1;max-width:60ch}
.game-tile .game-tile-features{font-size:15px;color:var(--muted);margin-top:22px}
.game-tile .game-action{align-self:stretch;justify-self:stretch;grid-column:auto;margin-top:24px}
.game-tile .game-action .text-link{display:flex;justify-content:space-between;min-height:50px;background:var(--raised);width:100%;padding-inline:18px}
.game-tile .game-action .text-link:hover{background:#8a0000;color:#fff}
@media(max-width:960px){
  .studio-header{min-height:68px;gap:20px;padding-inline:20px;top:12px;margin-block:12px;border-radius:24px}
  .studio-desktop-nav,.studio-cta{display:none}
  .studio-mobile-menu{display:block;margin-left:auto}
  .studio-mobile-menu summary{display:flex;align-items:center;gap:12px;min-height:44px;padding:10px 0 10px 16px;cursor:pointer;list-style:none;font-size:16px}
  .studio-mobile-menu summary::-webkit-details-marker{display:none}
  .studio-mobile-menu summary svg{width:24px;height:24px}
  .studio-mobile-menu nav{--slop-allow:redundant-border;position:absolute;top:calc(100% + 8px);left:0;right:0;background:rgba(10,10,12,.94);border:1px solid rgba(255,255,255,.14);padding:12px;display:grid;gap:4px;z-index:50;border-radius:24px;box-shadow:0 16px 36px #00000040;transform-origin:top center}
  .studio-mobile-menu:not([open]) nav{display:none}
  .studio-mobile-menu[open] nav{animation:studio-menu-in .3s cubic-bezier(.22,.61,.36,1) both}
  .studio-mobile-menu.menu-closing nav{display:grid;animation:studio-menu-out .3s cubic-bezier(.22,.61,.36,1) both}
  .studio-mobile-menu[open] nav a{animation:studio-menu-item .3s cubic-bezier(.22,.61,.36,1) both}
  .studio-mobile-menu[open] nav a:nth-child(1){animation-delay:.03s}
  .studio-mobile-menu[open] nav a:nth-child(2){animation-delay:.06s}
  .studio-mobile-menu[open] nav a:nth-child(3){animation-delay:.09s}
  .studio-mobile-menu[open] nav a:nth-child(4){animation-delay:.12s}
  .studio-mobile-menu[open] nav a:nth-child(5){animation-delay:.15s}
  .studio-mobile-menu[open] nav a:nth-child(6){animation-delay:.18s}
  .studio-mobile-menu[open] nav a:nth-child(7){animation-delay:.21s}
  .studio-mobile-menu nav a{padding:12px 16px;min-height:48px;border-radius:14px}
  .studio-mobile-menu nav a:hover{background:#202022}
  .studio-mobile-menu nav .studio-menu-cta{background:#8a0000;color:white;margin-top:8px}
  .studio-mobile-menu summary svg{transition:transform .3s cubic-bezier(.22,.61,.36,1)}
  .studio-mobile-menu[open] summary svg{transform:rotate(90deg)}
  .studio-mobile-menu.menu-closing summary svg{transform:rotate(0deg)}
  @keyframes studio-menu-in{from{opacity:0;transform:translateY(-10px) scale(.97)}to{opacity:1;transform:none}}
  @keyframes studio-menu-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-8px) scale(.98)}}
  @keyframes studio-menu-item{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
  .game-list{gap:20px}
  .game-tile .game-tile-content{padding:22px}
}
@media(max-width:650px){.game-list{grid-template-columns:1fr}.studio-header .brand{font-size:28px}.studio-header{gap:16px}}
@media(prefers-reduced-motion:reduce){.studio-desktop-nav a,.studio-cta{transition:none}.studio-mobile-menu[open] nav,.studio-mobile-menu.menu-closing nav,.studio-mobile-menu[open] nav a,.studio-mobile-menu summary svg{animation:none;transition:none;transform:none}}

.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: start; }
.about-grid h2 { margin-bottom: 24px; }
.about-grid .actions { margin-top: 28px; }
.community-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin: 0; }
.community-stat { padding: 28px 20px; border: 0; background: var(--surface); text-align: center; display: flex; flex-direction: column; }
.community-stat dt { order: 1; color: var(--muted); font-size: 16px; }
.community-stat dd { margin: 0 0 12px; font-size: clamp(30px, 3vw, 44px); line-height: 1; font-family: Inter, sans-serif; font-weight: 700; font-variant-numeric: tabular-nums; color: #ff0000; }
@media (max-width: 900px) { .about-grid { grid-template-columns: 1fr; gap: 40px; } }
@media (max-width: 400px) { .community-stats { gap: 12px; } .community-stat { padding: 24px 10px; } .community-stat dt { font-size: 14px; } }

html:not(.js) [data-copy] { display: none; }

.code-wrap,.notice,.detail-grid > img,.detail-side > img,.community-stat { border-radius: var(--radius-panel); }
.game-tile .game-action .text-link { border-radius: var(--radius-control); }
.skip { z-index: 60; border-radius: var(--radius-control); }

/* A single fixed red shader provides continuity across every page. */
body { isolation: isolate; }
.site-backdrop { position: fixed; inset: 0; z-index: 0; pointer-events: none; background: #000; }
.site-backdrop::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at center, transparent 0%, transparent 40%, rgba(10,0,0,.55) 75%, rgba(10,0,0,.92) 100%); }
.site-background-canvas { width: 100%; height: 100%; display: block; }
.site-background-canvas[hidden] { display: none; }
.background-motion-control { position: fixed; right: 20px; bottom: 20px; z-index: 35; min-height: 44px; padding: 10px 16px; color: #f5f5f5; background: #151516; border: 0; border-radius: var(--radius-control); font-size: 14px; }
.background-motion-control[hidden] { display: none; }
.background-motion-control:hover { background: #303032; }
.loader-section { background: #141416b8; }
.game-entry.game-tile,.faq-list details,.community-stat { background: #151516ed; }
.site-footer { padding-bottom: 100px; }
@media (prefers-reduced-transparency: reduce) { .studio-header { background: #141416; backdrop-filter: none; -webkit-backdrop-filter: none; } }

.studio-header { top: 0; width: 100%; max-width: 100%; margin-block: 0; border-radius: 0; border-width: 0 0 1px; padding-inline: max(24px, calc((100vw - 1232px) / 2)); transition: border-radius .25s var(--ease), background-color .25s var(--ease); }
html[data-scrolled='true'] .studio-header { top: 16px; width: calc(100% - 32px); max-width: 1280px; padding-inline: 24px; border-width: 1px; border-radius: 28px; }
@media(max-width:960px) { .studio-header { padding-inline: 20px; } html[data-scrolled='true'] .studio-header { top: 12px; padding-inline: 20px; border-radius: 24px; } }
@media(prefers-reduced-motion:reduce) { .studio-header { transition: none; } }

.action-host { position: relative; display: inline-flex; max-width: 100%; }
.action-external-icon { position: absolute; right: 14px; top: 50%; translate: 0 -50%; width: 18px; height: 18px; pointer-events: none; }
html:not(.js) .action-host { display: none; }
.studio-primary-action { margin-left: 0; }
@media(max-width:960px) { .studio-primary-action { display: none; } }
@media(max-width:650px) { .liquid-actions .action-host,.liquid-actions .action-host button { width: 100%; } }
:is(a.button,a.liquid-secondary,a.studio-menu-cta)[href^='https:']::after { content: ''; display: inline-block; flex-shrink: 0; width: 18px; height: 18px; background: #fff; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17 17 7M7 7h10v10' fill='none' stroke='white' stroke-width='1.7'/%3E%3C/svg%3E") center / contain no-repeat; }
.liquid-secondary { display: inline-flex; gap: 12px; }
.copy-button,.filter,.game-tile .game-action .text-link,.button.secondary { background: #ffffff0a; border-radius: var(--radius-control); box-shadow: inset 0 1px 0 #ffffff12; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }

.studio-menu-action,.studio-menu-action button { width: 100%; }

.reference-loader { position: relative; margin-block: 0; padding-block: 104px 100px; background: transparent; border-block: 0; }
.reference-loader::before,.reference-loader::after { content: ''; position: absolute; left: 0; right: 0; height: 1px; background: linear-gradient(90deg,#ffffff12,#8a000080 50%,#ffffff12); }
.reference-loader::before { top: 0; }
.reference-loader::after { bottom: 0; }
.loader-centered { text-align: center; }
.reference-loader h2 { font-family: Inter,sans-serif; font-size:clamp(40px,5vw,72px); font-weight:700; line-height:1.15; letter-spacing:-.025em; margin:0; }
.reference-loader h2 span { color: inherit; }
.loader-description { max-width:430px; margin:22px auto 62px; color:var(--muted); }
.loader-window { --slop-allow: redundant-border; width: min(100%,750px); margin-inline: auto; text-align: left; border: 1px solid #ffffff1a; border-radius: 16px; background: #08090ec9; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); overflow: hidden; box-shadow: 0 12px 32px #00000033; }
.loader-window-bar { display: flex; justify-content: space-between; align-items: center; height: 50px; padding-inline: 20px; border-bottom: 1px solid #ffffff1a; color: #98989e; font: 12px/1.5 ui-monospace,monospace; }
.window-controls { display: flex; gap: 6px; }
.window-controls i { width: 10px; height: 10px; border-radius: 50%; background: #ff5f57; }
.window-controls i:nth-child(2) { background: #febc2e; }
.window-controls i:nth-child(3) { background: #28c840; }
.loader-window-body { position: relative; padding: 24px; }
.loader-window-body .copy-button { --slop-allow: redundant-border; position: absolute; top: 16px; right: 16px; padding: 7px 14px; min-height: 34px; background: #07090d99; border: 1px solid #ffffff1a; border-radius: 8px; color: #b9b9bf; font: 12px/1.5 ui-monospace,monospace; }
.loader-window pre { font: 14px/1.85 ui-monospace,monospace; }
.loader-comments { margin: 0 76px 30px 0; color: #85858e; font-style: italic; }
.loader-source { color: #bfc0c9; }
.lua-function { color: #ff0000; }
.lua-method,.lua-keyword { color: #ffe044; }
.lua-string { color: #69ff75; }
.loader-window .copy-feedback { margin: 0; min-height: 0; font-size: 13px; color: #c4c4cc; }
.loader-window .copy-feedback:not(:empty) { margin-top: 16px; }
@media(max-width:650px) { .reference-loader { padding-block: 72px; } .reference-loader h2 { font-size: 32px; } .loader-description { font-size: 16px; margin: 20px auto 40px; max-width: 36ch; } .loader-window-body { padding: 22px 18px; } .loader-window pre { font-size: 12px; line-height: 1.9; } .loader-comments { margin-right: 64px; margin-bottom: 28px; } }

main,.site-footer { position: relative; z-index: 10; }

/* Shared corner and glass treatment follows the operator's button reference. */
:root { --radius-control: 14px; --radius-panel: 14px; }
.brand-icon { display: inline-block; flex-shrink: 0; width: 18px; height: 18px; color: #fff; vertical-align: middle; }
.studio-header .brand { font-size: 32px; font-weight: 760; letter-spacing: -.04em; }
.studio-header { min-height: 88px; background: transparent; border: 1px solid transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; transition: background-color .55s cubic-bezier(.65,.05,.36,1), border-color .55s cubic-bezier(.65,.05,.36,1), border-radius .55s cubic-bezier(.65,.05,.36,1), box-shadow .55s cubic-bezier(.65,.05,.36,1), padding-inline .4s cubic-bezier(.65,.05,.36,1); }
html[data-scrolled='true'] .studio-header { background: rgba(10,10,12,.55); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-control); backdrop-filter: blur(20px) saturate(120%) brightness(.62); -webkit-backdrop-filter: blur(20px) saturate(120%) brightness(.62); box-shadow: 0 10px 30px #00000055; }
.studio-primary-action { align-items: center; }
.brand img,.liquid-logo,.studio-mobile-menu nav,.studio-mobile-menu nav a,.loader-window,.loader-window-body .copy-button,.search input,.filter,.notice,.game-entry.game-tile,.detail-grid>img,.detail-side>img,.community-stat { border-radius: var(--radius-control); }
:is(.button.secondary,.copy-button,.filter,.background-motion-control,.game-tile .game-action .text-link) { --slop-allow: redundant-border; border: 1.5px solid rgba(255,255,255,.14); background: rgba(10,10,12,.42); box-shadow: inset 0 1px 0 #ffffff0d; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
:is(.button.secondary,.copy-button,.filter,.background-motion-control,.game-tile .game-action .text-link):hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.26); color: #fff; }
.filter[aria-pressed='true'] { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.32); color: #fff; }
.loader-window-body .copy-button { --slop-allow: redundant-border; border: 1.5px solid rgba(255,255,255,.14); background: rgba(10,10,12,.42); }
.site-backdrop { isolation: isolate; }
.site-background-canvas { position: absolute; inset: 0; z-index: 0; opacity: 1; visibility: visible; }
.site-backdrop::after { z-index: 1; }
@media(prefers-reduced-transparency:reduce) { html[data-scrolled='true'] .studio-header { background: #141416; backdrop-filter: none; -webkit-backdrop-filter: none; } }

:root {
  --glass-neutral: rgba(9,9,11,.46);
  --glass-neutral-border: rgba(255,255,255,.12);
  --glass-neutral-blur: 20px;
}
.game-entry.game-tile,.community-stat,.faq-list details,.notice,.empty,.code-wrap,.loader-window {
  --slop-allow: redundant-border;
  background: var(--glass-neutral);
  border: 1px solid var(--glass-neutral-border);
  box-shadow: inset 0 1px 0 #ffffff0d;
  backdrop-filter: blur(var(--glass-neutral-blur)) saturate(120%) brightness(.62);
  -webkit-backdrop-filter: blur(var(--glass-neutral-blur)) saturate(120%) brightness(.62);
}
.game-tile .game-tile-content { background: transparent; }
.background-status { position: fixed; right: 20px; bottom: 74px; z-index: 36; max-width: min(460px,calc(100vw - 40px)); max-height: 160px; overflow: auto; padding: 10px 14px; border-radius: var(--radius-control); background: #202024e6; color: #f5f5f5; font-size: 13px; overflow-wrap: anywhere; }
.background-status[hidden] { display: none; }
@supports not (backdrop-filter:blur(1px)) { .game-entry.game-tile,.community-stat,.faq-list details,.notice,.empty,.code-wrap,.loader-window { background: #101012eb; } }
@media(prefers-reduced-transparency:reduce) { .game-entry.game-tile,.community-stat,.faq-list details,.notice,.empty,.code-wrap,.loader-window { background: #101012; backdrop-filter: none; -webkit-backdrop-filter: none; } }

/* One shared accordion surface replaces the stack of outlined FAQ boxes. */
.faq-list { --slop-allow: redundant-border; background: var(--glass-neutral); border: 1px solid var(--glass-neutral-border); border-radius: var(--radius-panel); overflow: hidden; backdrop-filter: blur(20px) saturate(120%) brightness(.62); -webkit-backdrop-filter: blur(20px) saturate(120%) brightness(.62); }
.faq-list details { background: transparent; border: 0; border-radius: 0; box-shadow: none; margin: 0; padding: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
.faq-list details + details { border-top: 1px solid rgba(255,255,255,.08); }
.faq-list summary { min-height: 66px; padding: 21px 58px 21px 24px; font-size: 16px; line-height: 1.5; font-weight: 550; }
.faq-list summary::after { content: ''; position: absolute; right: 26px; top: 26px; width: 8px; height: 8px; border-right: 1.5px solid #fff; border-bottom: 1.5px solid #fff; rotate: 45deg; font-size: 0; }
.faq-list details[open] summary::after { content: ''; rotate: 225deg; top: 30px; }
.faq-list summary:hover { background: #ffffff05; }
.faq-list summary:focus-visible { outline-offset: -4px; }
.faq-list details p { padding: 0 24px 24px; margin: 0; color: #c8c8c8; font-size: 16px; line-height: 1.75; max-width: 68ch; }
.feature-list li { border-radius: var(--radius-control); }
.markdown-window { --slop-allow: redundant-border; margin-top: 24px; padding: 28px; border-radius: var(--radius-panel); border: 1px solid var(--glass-neutral-border); background: var(--glass-neutral); backdrop-filter: blur(20px) saturate(120%) brightness(.62); -webkit-backdrop-filter: blur(20px) saturate(120%) brightness(.62); overflow-wrap: anywhere; max-height: 420px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #8a0000 transparent; }
.markdown-window::-webkit-scrollbar { width: 8px; }
.markdown-window::-webkit-scrollbar-track { background: transparent; margin: 8px 0; border-radius: 8px; }
.markdown-window::-webkit-scrollbar-thumb { background: #8a0000; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
.markdown-window::-webkit-scrollbar-thumb:hover { background: #ff0000; background-clip: content-box; border-color: transparent; }
.markdown-content { font-size: 16px; line-height: 1.8; }
.markdown-content > :first-child { margin-top: 0; }
.markdown-content > :last-child { margin-bottom: 0; }
.markdown-content :is(h2,h3,h4,h5,h6) { font-family: Inter,sans-serif; font-size: 21px; line-height: 1.4; letter-spacing: -.02em; margin: 28px 0 14px; }
.markdown-content p { margin: 14px 0; max-width: 72ch; }
.markdown-content :is(ul,ol) { display: block; padding-left: 22px; margin: 14px 0; }
.markdown-content li { padding: 3px 0; background: transparent; }
.markdown-content a { color: #ff0000; text-decoration: underline; text-underline-offset: .2em; }
.markdown-content blockquote { margin: 18px 0; padding: 12px 18px; background: #ffffff06; border: 1px solid #ffffff14; border-radius: var(--radius-control); color: #c8c8c8; }
.markdown-content :not(pre)>code { background: #ffffff0a; border-radius: 5px; padding: 2px 5px; }
.markdown-content pre { padding: 18px; margin: 18px 0; background: #00000066; border-radius: var(--radius-control); overflow-x: auto; white-space: pre; }
.markdown-content img { max-width: 100%; height: auto; border-radius: var(--radius-control); margin-block: 18px; }
.markdown-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; margin-block: 18px; }
.markdown-content :is(th,td) { padding: 10px 14px; border: 1px solid #ffffff1a; text-align: left; }
@media(max-width:650px) { .markdown-window { padding: 22px; } .faq-list summary { padding-left: 20px; padding-right: 48px; } .faq-list details p { padding-inline: 20px; } }
@media(prefers-reduced-transparency:reduce) { .faq-list,.markdown-window { background: #101012; backdrop-filter: none; -webkit-backdrop-filter: none; } }

/* Theme-matched scrollbars (Firefox + WebKit/Blink). */
html { scrollbar-color: var(--accent-deep, #8a0000) rgba(255,0,0,.08); scrollbar-width: thin; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: rgba(255,0,0,.08); border-radius: 8px; }
::-webkit-scrollbar-thumb { background: #8a0000; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: #ff0000; }
::-webkit-scrollbar-corner { background: transparent; }

/* Native-feel micro interactions. */
:is(.button.secondary,.copy-button,.filter,.studio-cta,.studio-menu-cta,.game-tile .game-action .text-link,.text-link) {
  transition: translate .18s cubic-bezier(.2,.7,.3,1), scale .18s cubic-bezier(.2,.7,.3,1), color .2s, background-color .2s, border-color .2s, box-shadow .2s;
}
:is(.button.secondary,.copy-button,.filter,.studio-cta,.studio-menu-cta,.game-tile .game-action .text-link,.text-link):active {
  scale:.965;
}
.button:not(.secondary):active,.liquid-action:active { scale:.975; }
.button,.liquid-action { transition-property: color,background-color,border-color,box-shadow,scale; transition-duration:.2s,.2s,.2s,.2s,.18s; transition-timing-function:ease,ease,ease,ease,cubic-bezier(.2,.7,.3,1); }

@media(hover:hover) {
  .game-entry.game-tile { transition: translate .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s cubic-bezier(.2,.7,.3,1); }
  .game-entry.game-tile:hover { translate:0 -4px; box-shadow:0 18px 40px #00000059; }
  .game-tile .game-tile-picture img { transition: scale .45s cubic-bezier(.2,.7,.3,1); }
  .game-entry.game-tile:hover .game-tile-picture img { scale:1.04; }
}

.studio-desktop-nav a { position:relative; transition:color .4s cubic-bezier(.25,.1,.25,1); }
.studio-desktop-nav a::after {
  content:'';
  position:absolute;
  left:10px; right:10px; bottom:6px;
  height:2px;
  border-radius:2px;
  background:#ff0000;
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .5s cubic-bezier(.65,.05,.36,1);
  will-change:transform;
}
.studio-desktop-nav a:hover::after,.studio-desktop-nav a[aria-current='true']::after { transform:scaleX(1); transform-origin:left; }
.studio-desktop-nav a { transition:color .4s cubic-bezier(.25,.1,.25,1); }

.faq-list summary { transition:background-color .25s cubic-bezier(.2,.7,.3,1); }
.faq-list summary::after { transition:rotate .38s cubic-bezier(.2,.7,.3,1), top .38s cubic-bezier(.2,.7,.3,1); }
.faq-list details { interpolate-size:allow-keywords; }
@supports (selector(::details-content)) {
  .faq-list details::details-content {
    block-size:0;
    overflow:clip;
    transition:block-size .38s cubic-bezier(.2,.7,.3,1), content-visibility .38s allow-discrete;
    transition-behavior:allow-discrete;
  }
  .faq-list details[open]::details-content { block-size:auto; }
}
@media(prefers-reduced-motion:reduce) {
  .studio-desktop-nav a::after,.faq-list details::details-content { transition:none; }
  :is(.button,.button.secondary,.copy-button,.filter,.studio-cta,.studio-menu-cta,.game-tile .game-action .text-link,.text-link,.game-entry.game-tile,.game-tile .game-tile-picture img) { transition:none; }
  :is(.button,.button.secondary,.copy-button,.filter,.studio-cta,.studio-menu-cta,.game-tile .game-action .text-link,.text-link,.liquid-action):active { scale:1; }
  .game-entry.game-tile:hover { translate:none; }
}
@media(prefers-reduced-motion:reduce) {
  .studio-header { transition:none; }
}
.view-all { margin-top: 34px; }
.section-heading-action { align-items:center; }
.view-all-link {
  align-self:end;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  color:#ff0000;
  font-size:19px;
  font-weight:550;
  transition:color .3s cubic-bezier(.2,.7,.3,1), text-underline-offset .3s cubic-bezier(.2,.7,.3,1);
  text-decoration:underline transparent;
  text-underline-offset:6px;
}
.view-all-link:hover { text-decoration-color:#ff0000; text-underline-offset:9px; }
.text-link::after,.view-all-link::after,.source-note a::after,.markdown-content a::after,.back::after {
  content:'';
  display:inline-block;
  flex-shrink:0;
  width:14px;
  height:14px;
  margin-left:7px;
  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 12h14M12 6l6 6-6 6' fill='none' stroke='black' stroke-width='1.7'/%3E%3C/svg%3E") center / contain no-repeat;
  transition:translate .3s cubic-bezier(.2,.7,.3,1);
}
.text-link svg { display:none; }
.game-tile .game-action .text-link svg { display:inline-block; }
.game-tile .game-action .text-link::after { content:none; }
:is(.text-link,.view-all-link,.source-note a,.markdown-content a,.back)[href^='https:']::after {
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 17 17 7M7 7h10v10' fill='none' stroke='black' stroke-width='1.7'/%3E%3C/svg%3E") center / contain no-repeat;
  width:13px;
  height:13px;
  translate:2px -2px;
}
:is(.text-link,.view-all-link,.source-note a,.markdown-content a,.back)[href^='https:']:hover::after { translate:3px -3px; }
.text-link:hover::after,.view-all-link:hover::after,.source-note a:hover::after,.markdown-content a:hover::after,.back:hover::after { translate:3px 0; }
@media(prefers-reduced-motion:reduce) {
  .text-link::after,.view-all-link::after,.source-note a::after,.markdown-content a::after,.back::after { transition:none; }
}



/* Readable text on the shader: only free-standing text rendered directly over the shader
   gets a soft radial blur patch that fades out toward the edges. Text living inside a glass
   surface (cards, FAQ list, loader window, markdown window, community stats) is left untouched
   so nothing gets blurred twice. */
:is(.liquid-title,.liquid-subtitle,.reference-loader h2,.loader-description,.section-heading h2,.section-heading p,.view-all-link,.page-intro h1,.page-intro p,.page-intro .back,.game-intro,.faq-layout>h2,.about-grid>div>h2,.about-copy>p,.about-grid .text-link,.detail-side .text-link,.source-note,.empty h3,.empty p,.results,.detail-grid section>h2,.detail-grid section>p,.detail-status,.notice p) {
  position: relative;
  isolation: isolate;
}
:is(.liquid-title,.liquid-subtitle,.reference-loader h2,.loader-description,.section-heading h2,.section-heading p,.view-all-link,.page-intro h1,.page-intro p,.page-intro .back,.game-intro,.faq-layout>h2,.about-grid>div>h2,.about-copy>p,.about-grid .text-link,.detail-side .text-link,.source-note,.empty h3,.empty p,.results,.detail-grid section>h2,.detail-grid section>p,.detail-status,.notice p)::before {
  content: '';
  position: absolute;
  inset: -70% 0;
  z-index: -1;
  border-radius: 50%;
  backdrop-filter: blur(14px) brightness(.55);
  -webkit-backdrop-filter: blur(14px) brightness(.55);
  -webkit-mask-image: radial-gradient(closest-side, #000 30%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 30%, transparent 100%);
  pointer-events: none;
}
:is(.faq-list,.loader-window,.markdown-window,.community-stat,.game-entry.game-tile) :is(h2,h3,p,.source-note,.detail-status) { position: static; }
:is(.faq-list,.loader-window,.markdown-window,.community-stat,.game-entry.game-tile) :is(h2,h3,p,.source-note,.detail-status)::before { content: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
@media(prefers-reduced-transparency:reduce){
  :is(.liquid-title,.liquid-subtitle,.reference-loader h2,.loader-description,.section-heading h2,.section-heading p,.view-all-link,.page-intro h1,.page-intro p,.page-intro .back,.game-intro,.faq-layout>h2,.about-grid>div>h2,.about-copy>p,.about-grid .text-link,.detail-side .text-link,.source-note,.empty h3,.empty p,.results,.detail-grid section>h2,.detail-grid section>p,.detail-status,.notice p)::before {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}