/* CLEARLYlogic, 2026: inner pages (games, Press Blocks and its policies).
   Loaded after site.css, so the tokens, the band and the footer carry over.
   Press Blocks pages wear the game's own Gold Leaf letterpress colours
   (green-black leather, ivory ink, gold) inside the CLEARLYlogic frame. */

@font-face {
  font-family: "PB Headline";
  src: url("fonts/pb-headline-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --pb-paper: #13201a;
  --pb-paper-2: #1d3026;
  --pb-night: #0c1510;
  --pb-ink: #f2e8ce;
  --pb-ink-2: #c6bc9f;
  --pb-gold: #d4af37;
  --pb-gold-hi: #f6e4a3;
  --pb-gold-lo: #9c7a22;
  --pb-edge: #9c843f;
  --pb-red: #ed9b84;
  --pb-serif: "PB Headline", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
}

/* ---------- The band, on inner pages: name to the left, a way around to the right ---------- */
.band-sub { padding-block: calc(10px + .35rem) calc(10px + .3rem); }
.band-row {
  width: var(--max); display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.mark-sub {
  text-decoration: none; font-size: clamp(1.7rem, 1.6vw + 1.1rem, 2.4rem);
  border-radius: 8px;
}
.mark-sub:hover .wordmark { filter: brightness(1.12); }
.subnav { display: flex; gap: .25rem; }
.subnav a {
  font-family: "MK Sans Tall X", "Saira", system-ui, sans-serif;
  font-size: 1.15rem; letter-spacing: .06em; text-decoration: none; color: var(--ink);
  padding: .45rem .9rem; min-height: 44px; display: inline-flex; align-items: center;
  border: 1px solid rgba(255, 212, 121, .35); border-radius: 999px;
  transition: background .25s, border-color .25s;
}
.subnav a:hover, .subnav a[aria-current="page"] { background: rgba(255, 212, 121, .12); border-color: var(--gold-1); }

.crumbs { width: var(--max); margin: 1.25rem auto 0; font-size: .85rem; color: var(--ink-3); }
.crumbs a { color: var(--ink-2); text-underline-offset: .2em; text-decoration-color: rgba(255, 212, 121, .45); }
.crumbs a:hover { color: var(--ink); }
.crumbs span[aria-hidden] { padding: 0 .4em; color: var(--gold-3); }

main.page { padding-top: clamp(1.25rem, 3vw, 2.25rem); }

/* ---------- Games index ---------- */
.games-head { display: grid; justify-items: center; text-align: center; gap: .6rem; margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.games-head h1 {
  margin: 0; font-family: "MK Sans Tall X", "Saira", sans-serif; font-weight: 400;
  font-size: clamp(2.2rem, 3vw + 1.2rem, 3.4rem); line-height: 1.05; letter-spacing: .01em;
}
.games-head p { margin: 0; color: var(--ink-2); max-width: 36rem; text-wrap: balance; }
.game-list { list-style: none; margin: 0 auto; padding: 0; display: grid; gap: clamp(1rem, 2.5vw, 1.75rem); width: min(100%, 56rem); }
.game-card {
  position: relative; display: grid; grid-template-columns: auto 1fr; gap: clamp(1rem, 3vw, 2rem); align-items: center;
  padding: clamp(1.25rem, 3vw, 2rem); border-radius: 18px; text-decoration: none; color: var(--ink);
  border: 1px solid rgba(255, 212, 121, .22);
  box-shadow: 0 30px 60px -36px rgba(0, 0, 0, .95), inset 0 1px 0 rgba(255, 255, 255, .04);
  transition: transform .4s var(--ease-out), border-color .3s, box-shadow .4s var(--ease-out);
}
.game-card:hover { transform: translateY(-3px); border-color: rgba(255, 212, 121, .6); box-shadow: 0 36px 70px -36px rgba(0, 0, 0, 1), inset 0 1px 0 rgba(255, 255, 255, .06); }
.game-card .gc-icon { width: clamp(4.5rem, 9vw, 6.5rem); aspect-ratio: 1; border-radius: 22%; box-shadow: 0 12px 26px -12px rgba(0, 0, 0, .8); }
.gc-body { display: grid; gap: .35rem; }
.gc-kicker { font-size: .78rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-text); }
.gc-title { margin: 0; font-size: clamp(1.5rem, 1.4vw + 1rem, 2rem); line-height: 1.1; }
.gc-text { margin: 0; color: var(--ink-2); }
.gc-go { margin-top: .35rem; font-weight: 500; color: var(--ink); }
.gc-go::after { content: " \2192"; color: var(--gold-1); }
.gc-pb { background: radial-gradient(90% 140% at 0% 0%, rgba(212, 175, 55, .16), transparent 60%), linear-gradient(160deg, var(--pb-paper-2), var(--pb-night)); }
.gc-pb .gc-title { font-family: var(--pb-serif); font-weight: 700; color: var(--pb-ink); }
.gc-pb .gc-kicker { color: var(--pb-gold); }
.gc-64 { background: radial-gradient(90% 140% at 0% 0%, rgba(120, 174, 226, .16), transparent 60%), linear-gradient(160deg, #142035, #0a1020); }
.gc-64 .gc-title { font-family: "MK Sans Tall X", "Saira", sans-serif; font-weight: 400; letter-spacing: .02em; }
.games-note { margin: clamp(1.75rem, 4vw, 2.5rem) auto 0; text-align: center; color: var(--ink-3); font-size: .9rem; max-width: 34rem; text-wrap: balance; }

/* ---------- Press Blocks ---------- */
.pb { color: var(--pb-ink); }
.pb-serif, .pb h1, .pb h2, .pb h3 { font-family: var(--pb-serif); font-weight: 700; letter-spacing: 0; }
.pb-sheet {
  position: relative; isolation: isolate; border-radius: 22px; overflow: hidden;
  background:
    radial-gradient(70% 90% at 20% 0%, rgba(212, 175, 55, .14), transparent 60%),
    radial-gradient(60% 80% at 100% 100%, rgba(29, 48, 38, .9), transparent 70%),
    linear-gradient(170deg, var(--pb-paper-2) 0%, var(--pb-paper) 45%, var(--pb-night) 100%);
  box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 1), inset 0 0 0 1px rgba(212, 175, 55, .28);
}
/* the fillet: a gold hairline just inside the sheet's edge, with star ornaments at the corners */
.pb-sheet::before {
  content: ""; position: absolute; inset: 10px; z-index: -1; border-radius: 14px; pointer-events: none;
  border: 1px solid rgba(212, 175, 55, .55);
}
.orn { position: absolute; width: 14px; height: 14px; color: var(--pb-gold); opacity: .9; pointer-events: none; }
.orn svg { width: 100%; height: 100%; display: block; }
.orn-tl { top: 18px; left: 18px; } .orn-tr { top: 18px; right: 18px; }
.orn-bl { bottom: 18px; left: 18px; } .orn-br { bottom: 18px; right: 18px; }

/* hero */
.pb-hero {
  display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center;
  gap: clamp(1.5rem, 4vw, 3.5rem); padding: clamp(2.25rem, 5vw, 4.25rem) clamp(1.5rem, 5vw, 4.5rem);
}
.pb-kicker { margin: 0 0 1rem; font-size: .78rem; letter-spacing: .3em; text-transform: uppercase; color: var(--pb-ink-2); }
.pb-kicker .cl-name { letter-spacing: 0; text-transform: none; font-size: 1.25em; }
.pb-wordmark { margin: 0; line-height: 0; }
.pb-wordmark img { width: min(100%, 30rem); filter: drop-shadow(0 6px 18px rgba(0, 0, 0, .55)); }
.pb-rule { display: grid; gap: 3px; width: min(100%, 30rem); margin: 1.1rem 0 1.25rem; }
.pb-rule i { display: block; height: 3px; background: linear-gradient(90deg, var(--pb-gold-lo), var(--pb-gold), var(--pb-gold-hi), var(--pb-gold), var(--pb-gold-lo)); }
.pb-rule i + i { height: 1px; opacity: .85; }
.pb-masthead {
  display: flex; justify-content: space-between; gap: .75rem; width: min(100%, 30rem);
  margin: -.55rem 0 1.4rem; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--pb-ink-2);
}
.pb-lede { margin: 0; font-family: var(--pb-serif); font-weight: 700; font-size: clamp(1.45rem, 1.5vw + 1rem, 2.1rem); line-height: 1.18; text-wrap: balance; }
.pb-lede em { font-style: normal; color: var(--pb-gold); }
.pb-sub { margin: .9rem 0 0; color: var(--pb-ink-2); font-size: 1.02rem; max-width: 30rem; }
.pb-soon {
  margin: 1.6rem 0 0; display: inline-flex; align-items: center; gap: .75rem;
  padding: .7rem 1.15rem .7rem .8rem; border-radius: 14px;
  background: rgba(12, 21, 16, .7); border: 1px solid rgba(212, 175, 55, .5);
}
.pb-soon img { flex: none; width: 2.6rem; border-radius: 22%; }
.pb-soon p { margin: 0; }
.pb-soon b { display: block; font-weight: 600; color: var(--pb-ink); font-size: 1rem; line-height: 1.25; }
.pb-soon span { display: block; color: var(--pb-ink-2); font-size: .85rem; line-height: 1.3; }
.pb-by { margin: 1.1rem 0 0; font-size: .85rem; color: var(--pb-ink-2); }

.pb-phones { position: relative; display: grid; justify-items: center; padding-block: .5rem; }
.phone {
  margin: 0; position: relative; border-radius: 2.1rem; padding: 7px;
  background: linear-gradient(160deg, #3a3426, #12100b 55%, #2a2519);
  box-shadow: 0 0 0 1px rgba(212, 175, 55, .45), 0 34px 60px -24px rgba(0, 0, 0, .95);
}
.phone img { border-radius: 1.65rem; width: 100%; }
.pb-phones .phone-front { width: min(16.5rem, 78%); z-index: 2; transform: translateX(14%) rotate(2deg); }
.pb-phones .phone-back { position: absolute; width: min(15rem, 70%); top: 2.2rem; left: 50%; z-index: 1; transform: translateX(-88%) rotate(-5deg); filter: brightness(.82) saturate(.95); }

/* sections */
.pb-section { margin-top: clamp(3rem, 7vw, 5.5rem); }
.pb-section > h2, .pb-h2 {
  margin: 0 auto .5rem; text-align: center; color: var(--pb-ink);
  font-size: clamp(1.8rem, 2.2vw + 1rem, 2.75rem); line-height: 1.1; text-wrap: balance;
}
.pb-intro { margin: 0 auto; text-align: center; color: var(--ink-2); max-width: 38rem; text-wrap: balance; }
.pb-eyebrow { display: block; text-align: center; font-size: .74rem; letter-spacing: .3em; text-transform: uppercase; color: var(--pb-gold); margin-bottom: .6rem; }

.pb-steps { list-style: none; margin: clamp(1.75rem, 4vw, 2.5rem) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.75rem, 2vw, 1.25rem); counter-reset: step; }
.pb-steps li {
  counter-increment: step; position: relative; padding: 1.35rem 1.2rem 1.3rem; border-radius: 16px;
  background: linear-gradient(180deg, rgba(29, 48, 38, .75), rgba(12, 21, 16, .85));
  border: 1px solid rgba(212, 175, 55, .22);
}
.pb-steps li::before {
  content: counter(step); display: grid; place-items: center; width: 2rem; height: 2rem; margin-bottom: .8rem;
  font-family: var(--pb-serif); font-weight: 700; color: #1a1406; border-radius: 6px;
  background: linear-gradient(180deg, var(--pb-gold-hi), var(--pb-gold) 55%, var(--pb-gold-lo));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 4px 10px -4px rgba(0, 0, 0, .8);
}
.pb-steps h3 { margin: 0 0 .35rem; font-size: 1.2rem; line-height: 1.2; color: var(--pb-ink); }
.pb-steps p { margin: 0; color: var(--pb-ink-2); font-size: .95rem; }

/* feature rows: text beside a screenshot */
.pb-feature {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center;
  gap: clamp(1.5rem, 5vw, 4rem); padding: clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 5vw, 4rem);
}
.pb-feature + .pb-feature { margin-top: clamp(1rem, 2.5vw, 1.5rem); }
.pb-feature.flip .pb-f-text { order: 2; }
.pb-f-text h2 { margin: 0 0 .7rem; font-size: clamp(1.7rem, 1.8vw + 1rem, 2.5rem); line-height: 1.1; text-wrap: balance; }
.pb-f-text p { margin: 0 0 .8rem; color: var(--pb-ink-2); font-size: 1.02rem; }
.pb-f-text p:last-child { margin-bottom: 0; }
.pb-f-text .tag { display: inline-block; margin-bottom: .8rem; font-size: .72rem; letter-spacing: .26em; text-transform: uppercase; color: var(--pb-gold); }
.pb-f-shots { display: flex; align-items: flex-start; justify-content: center; gap: clamp(.75rem, 2vw, 1.25rem); }
.pb-f-shots .phone { width: min(14rem, 46%); }
.pb-f-shots .phone:nth-child(2) { margin-top: 2.5rem; }
.pb-f-shots.single .phone { width: min(15.5rem, 70%); }

/* gallery */
.pb-gallery {
  margin: clamp(1.75rem, 4vw, 2.5rem) 0 0; padding: 0 0 .75rem; list-style: none;
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(12.5rem, 1fr); gap: clamp(.9rem, 2vw, 1.4rem);
  overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
  scrollbar-width: thin; scrollbar-color: rgba(212, 175, 55, .5) transparent;
}
.pb-gallery li { scroll-snap-align: center; display: grid; gap: .7rem; justify-items: center; }
.pb-gallery .phone { width: 100%; max-width: 15rem; }
.pb-gallery figcaption, .pb-gallery .cap { text-align: center; font-size: .9rem; color: var(--ink-2); line-height: 1.35; }
.cap b { display: block; color: var(--pb-ink); font-weight: 500; }
.theme-chip {
  display: inline-block; margin-top: .3rem; padding: .1rem .55rem; border-radius: 999px;
  font-size: .72rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--pb-gold); border: 1px solid rgba(212, 175, 55, .5);
}

@media (min-width: 960px) {
  .pb-gallery { grid-auto-flow: row; grid-template-columns: repeat(6, minmax(0, 1fr)); overflow: visible; }
}
.pb-fair + .pb-fair { margin-top: clamp(.75rem, 2vw, 1.25rem); }

/* themes */
.themes { list-style: none; margin: clamp(1.75rem, 4vw, 2.5rem) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.75rem, 2vw, 1.25rem); }
.theme {
  --paper: #f4efe3; --ink: #1b1b1b; --soft: #5c5446; --gutter: #211d19; --edge: #655a4b;
  display: grid; justify-items: center; gap: .9rem; padding: 1.5rem 1rem 1.3rem; border-radius: 16px; text-align: center;
  background: var(--paper); color: var(--ink);
  box-shadow: 0 24px 46px -28px rgba(0, 0, 0, .95), inset 0 0 0 1px rgba(0, 0, 0, .08);
  transition: transform .4s var(--ease-out);
}
.theme:hover { transform: translateY(-3px); }
.theme h3 { margin: 0; font-family: var(--pb-serif); font-size: 1.3rem; line-height: 1.1; }
.theme .t-tag { margin: -.55rem 0 0; font-size: .88rem; color: var(--soft); font-style: italic; }
.theme .t-price { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--soft); padding: .2rem .65rem; border-radius: 999px; border: 1px solid currentColor; }
.case {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; width: 6.5rem; padding: 6px; border-radius: 9px;
  background: var(--gutter); box-shadow: 0 0 0 2px var(--edge), 0 10px 18px -10px rgba(0, 0, 0, .9);
}
.case i { display: block; aspect-ratio: 1; background: center / 100% 100% no-repeat; }
.case .e { background-image: var(--e); }
.case .c { background-image: var(--c); }
.case .g { background-image: var(--g); }
.t-classic { --e: url("img/pb/themes/classic/cell-empty.svg"); --c: url("img/pb/themes/classic/cream.svg"); --g: url("img/pb/themes/classic/gold.svg"); }
.t-sepia { --paper: #eadbc0; --ink: #2b1d12; --soft: #64482f; --gutter: #291b13; --edge: #77543a;
  --e: url("img/pb/themes/sepia/cell-empty.svg"); --c: url("img/pb/themes/sepia/cream.svg"); --g: url("img/pb/themes/sepia/gold.svg"); }
.t-broadsheet { --paper: #e9e8e3; --ink: #14191c; --soft: #46525a; --gutter: #15212a; --edge: #657c88;
  --e: url("img/pb/themes/broadsheet/cell-empty.svg"); --c: url("img/pb/themes/broadsheet/cream.svg"); --g: url("img/pb/themes/broadsheet/gold.svg"); }
.t-gold-leaf { --paper: #13201a; --ink: #f2e8ce; --soft: #c6bc9f; --gutter: #112019; --edge: #9c843f;
  --e: url("img/pb/themes/gold-leaf/cell-empty.svg"); --c: url("img/pb/themes/gold-leaf/cream.svg"); --g: url("img/pb/themes/gold-leaf/gold.svg");
  box-shadow: 0 24px 46px -28px rgba(0, 0, 0, .95), inset 0 0 0 1px rgba(212, 175, 55, .55); }
.t-gold-leaf .t-price { color: var(--pb-gold); }
.themes-note { margin: 1.25rem auto 0; text-align: center; color: var(--ink-2); max-width: 40rem; font-size: .95rem; text-wrap: balance; }

/* fair play: ads and purchases */
.pb-fair { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.75rem, 2vw, 1.25rem); margin-top: clamp(1.75rem, 4vw, 2.5rem); }
.pb-fair div { padding: 1.4rem 1.3rem; border-radius: 16px; background: rgba(12, 21, 16, .6); border: 1px solid rgba(212, 175, 55, .22); }
.pb-fair h3 { margin: 0 0 .4rem; font-size: 1.2rem; color: var(--pb-ink); }
.pb-fair p { margin: 0; color: var(--pb-ink-2); font-size: .95rem; }

.pb-close { margin-top: clamp(3rem, 7vw, 5rem); padding: clamp(2.25rem, 5vw, 3.5rem) 1.5rem; display: grid; justify-items: center; text-align: center; gap: .9rem; }
.pb-close h2 { margin: 0; font-size: clamp(1.7rem, 2vw + 1rem, 2.5rem); line-height: 1.1; text-wrap: balance; }
.pb-close p { margin: 0; color: var(--pb-ink-2); }
.pb-links { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; margin-top: .4rem; }
.pb .btn { color: #1a1406; background: linear-gradient(180deg, var(--pb-gold-hi) 0%, var(--pb-gold) 50%, var(--pb-gold-lo) 100%); }
.pb .btn-quiet { color: var(--pb-ink); background: rgba(12, 21, 16, .6); border: 1px solid rgba(212, 175, 55, .55); }
.pb .btn-quiet:hover { background: rgba(212, 175, 55, .14); }

/* ---------- Policy and support pages ---------- */
.doc { width: min(100%, 46rem); margin: 0 auto; }
.doc-head { padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.25rem, 4vw, 2.5rem); display: grid; gap: .25rem; }
.doc-head .pb-wordmark img { width: min(100%, 15rem); }
.doc-head h1 { margin: .9rem 0 0; font-size: clamp(2rem, 2.4vw + 1.1rem, 2.9rem); line-height: 1.08; color: var(--pb-ink); }
.doc-head .updated { margin: .35rem 0 0; color: var(--pb-ink-2); font-size: .92rem; }
.doc-head .pb-rule { margin: 1rem 0 0; width: 100%; }
.doc-body { padding: clamp(1.5rem, 4vw, 2.25rem) clamp(.25rem, 2vw, 1rem) 0; color: var(--ink-2); }
.doc-body h2 {
  margin: 2.4rem 0 .7rem; font-family: var(--pb-serif); font-weight: 700; color: var(--pb-ink);
  font-size: clamp(1.35rem, .8vw + 1.05rem, 1.65rem); line-height: 1.2; scroll-margin-top: 1rem;
}
.doc-body h2 .n { color: var(--pb-gold); margin-right: .45rem; }
.doc-body h3 { margin: 1.5rem 0 .4rem; color: var(--ink); font-size: 1.05rem; font-weight: 600; }
.doc-body p, .doc-body li { font-size: 1rem; line-height: 1.65; }
.doc-body p { margin: 0 0 .9rem; }
.doc-body ul { margin: 0 0 1rem; padding-left: 1.2rem; }
.doc-body li { margin: .25rem 0; }
.doc-body li::marker { color: var(--pb-gold); }
.doc-body strong { color: var(--ink); font-weight: 600; }
.doc-body a { color: var(--pb-gold-hi); text-underline-offset: .2em; text-decoration-color: rgba(212, 175, 55, .55); }
.doc-body a:hover { text-decoration-color: var(--pb-gold-hi); }
.summary { margin: 0 0 1.5rem; padding: 1.25rem 1.4rem; border-radius: 14px; background: rgba(19, 32, 26, .8); border: 1px solid rgba(212, 175, 55, .3); }
.summary h2 { margin-top: 0 !important; }
.summary ul { margin-bottom: 0; }
.toc { margin: 0 0 1rem; padding: 1.1rem 1.4rem; border-radius: 14px; border: 1px solid rgba(255, 255, 255, .08); }
.toc h2 { margin: 0 0 .5rem !important; font-size: 1.1rem !important; }
.toc ol { margin: 0; padding-left: 1.4rem; columns: 2 14rem; column-gap: 2rem; }
.toc li { margin: .15rem 0; break-inside: avoid; }
address { font-style: normal; line-height: 1.6; color: var(--ink); margin: 0 0 1rem; }
.doc-foot { margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid rgba(212, 175, 55, .2); display: flex; flex-wrap: wrap; gap: .75rem; }

.contact-card {
  display: grid; gap: .6rem; justify-items: start; margin: 0 0 2rem; padding: 1.5rem 1.5rem 1.6rem; border-radius: 16px;
  background: radial-gradient(90% 140% at 0% 0%, rgba(212, 175, 55, .14), transparent 60%), rgba(19, 32, 26, .85);
  border: 1px solid rgba(212, 175, 55, .4);
}
.contact-card h2 { margin: 0 !important; }
.contact-card p { margin: 0 !important; }
.contact-card .mail { font-size: clamp(1.15rem, 1vw + .9rem, 1.4rem); font-weight: 500; color: var(--pb-ink) !important; }
.faq details { border-top: 1px solid rgba(212, 175, 55, .18); }
.faq details:last-of-type { border-bottom: 1px solid rgba(212, 175, 55, .18); }
.faq summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: 1rem .25rem; min-height: 44px; color: var(--pb-ink); font-family: var(--pb-serif); font-weight: 700; font-size: 1.15rem; line-height: 1.3;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; flex: none; width: .6rem; height: .6rem; border-right: 2px solid var(--pb-gold); border-bottom: 2px solid var(--pb-gold);
  transform: rotate(45deg) translateY(-2px); transition: transform .3s var(--ease-out);
}
.faq details[open] summary::after { transform: rotate(-135deg) translateY(-2px); }
.faq .a { padding: 0 .25rem .9rem; }

/* ---------- Press Blocks leaderboard ---------- */
.lb { width: min(100%, 46rem); margin: 0 auto; }
.lb-head .updated { max-width: 32rem; }
.lb-tabs {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; margin: 1.5rem 0 0; padding: .35rem;
  border-radius: 14px; background: rgba(12, 21, 16, .6); border: 1px solid rgba(212, 175, 55, .3);
}
.lb-tabs button {
  min-height: 44px; padding: .5rem .4rem; border: 0; border-radius: 10px; cursor: pointer; background: transparent;
  color: var(--pb-ink-2); font: inherit; font-family: var(--pb-serif); font-weight: 700; font-size: clamp(.9rem, .5vw + .75rem, 1.05rem); line-height: 1.15;
}
.lb-tabs button:hover { color: var(--pb-ink); background: rgba(212, 175, 55, .1); }
.lb-tabs button[aria-selected="true"] { color: #1a1406; background: linear-gradient(180deg, var(--pb-gold-hi) 0%, var(--pb-gold) 55%, var(--pb-gold-lo) 100%); }
.lb-tabs button:focus-visible, .lb-step:focus-visible { outline: 2px solid var(--pb-gold-hi); outline-offset: 2px; }
.lb-panel { margin-top: 1.25rem; }
.lb-edition { display: grid; grid-template-columns: 44px 1fr 44px; align-items: center; gap: .5rem; }
.lb-edition[hidden] { display: none; }
.lb-step {
  width: 44px; height: 44px; border-radius: 12px; cursor: pointer; font-size: 1.6rem; line-height: 1;
  color: var(--pb-ink); background: rgba(12, 21, 16, .6); border: 1px solid rgba(212, 175, 55, .55);
}
.lb-step:hover:not(:disabled) { background: rgba(212, 175, 55, .14); }
.lb-step:disabled { opacity: .3; cursor: default; }
.lb-ed { margin: 0; text-align: center; display: grid; gap: .15rem; }
.lb-ed b { font-family: var(--pb-serif); font-weight: 700; font-size: clamp(1.35rem, 1vw + 1.05rem, 1.7rem); color: var(--pb-ink); line-height: 1.15; }
.lb-ed span { font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--pb-ink-2); }
.lb-sub { margin: .8rem 0 0; text-align: center; color: var(--pb-ink-2); font-size: .95rem; }
.lb-status { margin: 1.25rem 0 0; padding: 2.25rem 1rem; text-align: center; border-radius: 16px; color: var(--pb-ink-2); border: 1px dashed rgba(212, 175, 55, .3); font-family: var(--pb-serif); font-size: 1.15rem; }
.lb-status[hidden] { display: none; }
.lb-status.error { color: var(--pb-red); border-color: rgba(237, 155, 132, .45); }
.lb-list { list-style: none; margin: 1.25rem 0 0; padding: 0; border-top: 3px solid var(--pb-gold); }
.lb-list[hidden] { display: none; }
.lb-row {
  display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; align-items: center; gap: .75rem;
  min-height: 3.6rem; padding: .55rem .35rem; border-bottom: 1px solid rgba(212, 175, 55, .18);
}
.lb-rank { font-family: var(--pb-serif); font-weight: 700; font-size: 1.15rem; color: var(--pb-ink-2); text-align: center; font-variant-numeric: tabular-nums lining-nums; }
.lb-rank.top { color: #1a1406; width: 2.1rem; height: 2.1rem; line-height: 2.1rem; justify-self: center; border-radius: 6px; background: linear-gradient(180deg, var(--pb-gold-hi), var(--pb-gold) 55%, var(--pb-gold-lo)); }
.lb-who { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.lb-pic { flex: none; width: 2.5rem; height: 2.5rem; border-radius: 50%; object-fit: cover; border: 1px solid rgba(212, 175, 55, .55); background: var(--pb-paper-2); }
.lb-mark { flex: none; min-width: 1.4rem; text-align: center; font-size: 1.2rem; line-height: 1; color: var(--pb-ink-2); }
.lb-mark.gold { color: var(--pb-gold); text-shadow: 0 0 10px rgba(212, 175, 55, .45); }
.lb-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--pb-ink); font-weight: 500; font-size: 1.05rem; }
.lb-fig { display: grid; justify-items: end; text-align: right; line-height: 1.2; }
.lb-fig b { font-family: var(--pb-serif); font-weight: 700; font-size: 1.2rem; color: var(--pb-ink); font-variant-numeric: tabular-nums lining-nums; }
.lb-fig small { font-size: .78rem; color: var(--pb-ink-2); white-space: nowrap; }
.lb-note { margin: 1.75rem 0 0; color: var(--pb-ink-2); font-size: .88rem; line-height: 1.55; text-align: center; }
.lb-note a { color: var(--pb-gold-hi); text-underline-offset: .2em; text-decoration-color: rgba(212, 175, 55, .55); }
.lb .pb-links { margin-top: 1.25rem; }
@media (max-width: 420px) {
  .lb-row { grid-template-columns: 2.1rem minmax(0, 1fr) auto; gap: .5rem; padding-inline: .1rem; }
  .lb-rank.top { width: 1.9rem; height: 1.9rem; line-height: 1.9rem; }
  .lb-pic { width: 2.1rem; height: 2.1rem; }
  .lb-name { font-size: .98rem; }
  .lb-fig small { white-space: normal; }
}

/* ---------- Motion: the sheets rise once, never for reduced motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  .rise { animation: pb-rise .9s var(--ease-out) both; }
  .rise-2 { animation-delay: .12s; }
  .rise-3 { animation-delay: .24s; }
  @keyframes pb-rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
  .pb-phones .phone-front { animation: pb-front 1.1s var(--ease-out) .15s both; }
  .pb-phones .phone-back { animation: pb-back 1.1s var(--ease-out) .3s both; }
  @keyframes pb-front { from { opacity: 0; transform: translateX(14%) translateY(26px) rotate(0deg); } }
  @keyframes pb-back { from { opacity: 0; transform: translateX(-70%) translateY(30px) rotate(0deg); } }
}

/* ---------- Tablet and phone ---------- */
@media (max-width: 959px) {
  .pb-steps, .themes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-fair { grid-template-columns: 1fr; }
}
@media (max-width: 719px) {
  .band-row { justify-content: space-between; }
  .mark-sub { font-size: 1.65rem; }
  .subnav a { font-size: 1rem; padding: .35rem .8rem; }
  .pb-hero { grid-template-columns: 1fr; text-align: center; justify-items: center; padding-top: 2.5rem; }
  .pb-wordmark img { margin-inline: auto; }
  .pb-rule, .pb-masthead { margin-inline: auto; }
  .pb-masthead { font-size: .58rem; letter-spacing: .14em; }
  .pb-masthead span:nth-child(3) { display: none; }
  .pb-sub { margin-inline: auto; }
  .pb-soon { text-align: left; }
  .pb-phones { margin-top: .5rem; width: 100%; }
  .pb-phones .phone-front { width: min(14rem, 62%); }
  .pb-phones .phone-back { width: min(12.5rem, 55%); }
  .pb-feature { grid-template-columns: 1fr; padding-inline: 1.25rem; }
  .pb-feature.flip .pb-f-text { order: 0; }
  .pb-f-text { text-align: center; }
  .pb-steps { grid-template-columns: 1fr; }
  .themes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  .theme { padding: 1.2rem .6rem 1rem; }
  .case { width: 5.25rem; }
  .theme .t-price { letter-spacing: .08em; font-size: .64rem; }
  .game-card { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .toc ol { columns: 1; }
  .orn { display: none; }
}