/* StreetHeist game sheet: one page in the landing's language (dark night
   street, neo-grotesk headlines top left, mono telemetry, gold accents,
   Bodoni numerals, chapter labels). Tokens: landing/tokens.css. Buttons and
   the base reset: landing/sh-base.css. The print block at the end turns the
   same markup into a two page A4 document on white. */
:root {
  --gs-bg: var(--sh-ink-0); --gs-panel: rgba(255, 255, 255, .025); --gs-fg: var(--sh-fg); --gs-fg-2: var(--sh-fg-2); --gs-fg-3: var(--sh-fg-3);
  --gs-line: var(--sh-line); --gs-line-2: var(--sh-line-2); --gs-gold: var(--sh-gold-hi); --gs-red: #ff8b96; --gs-teal: var(--sh-teal);
}
body.gs {
  background:
    radial-gradient(900px 520px at 88% -6%, rgba(242, 169, 59, .10), transparent 62%),
    radial-gradient(1100px 620px at 4% 0%, rgba(61, 123, 255, .07), transparent 60%),
    var(--gs-bg);
  color: var(--gs-fg);
}
.gs h1, .gs h2, .gs h3 { color: var(--gs-fg); }
.gs code { font: 500 .88em/1 var(--sh-font-mono); color: var(--gs-gold); white-space: nowrap; }

/* Nav: wordmark, chapter label, two doors. */
.gs-nav {
  position: sticky; top: 0; z-index: 60; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 16px;
  height: 64px; padding: 0 var(--sh-gutter); background: rgba(7, 8, 10, .86); border-bottom: 1px solid var(--gs-line);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.gs-mark { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; color: var(--gs-fg); font: 700 18px/1 var(--sh-font-sans); letter-spacing: -.02em; text-decoration: none; }
.gs-nav__label { display: flex; align-items: center; gap: 14px; color: var(--gs-fg); font: 500 11px/1 var(--sh-font-mono); letter-spacing: .2em; text-transform: uppercase; white-space: nowrap; }
.gs-ticks { display: block; width: 62px; height: 7px; opacity: .3; background: repeating-linear-gradient(90deg, var(--gs-fg) 0 1px, transparent 1px 7px); }
.gs-nav__actions { justify-self: end; display: flex; align-items: center; gap: 8px; }
.gs-nav .sh-btn { min-height: 40px; padding: 0 16px; font-size: 13px; }

.gs-main { max-width: var(--sh-maxw); margin: 0 auto; padding: 0 var(--sh-gutter); }
.gs-main:focus { outline: none; }
.gs-kicker { margin: 0; color: var(--gs-fg-3); font: 700 11px/1.5 var(--sh-font-mono); letter-spacing: .2em; text-transform: uppercase; }
.gs-note { max-width: 78ch; color: var(--gs-fg-3); font-size: 13px; line-height: 1.6; }
.gs-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--gs-gold); font-size: 14px; font-weight: 600; text-decoration: none; }
.gs-link::after { content: "↗"; font-size: 13px; }
.gs-link:hover { text-decoration: underline; }

/* Hero: headline top left, telemetry under it, the gameplay capture right. */
.gs-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 4vw, 64px); align-items: end; padding: clamp(40px, 6vw, 84px) 0 clamp(40px, 5vw, 72px); }
.gs-hero h1 { margin-top: 18px; font-size: clamp(40px, 5.6vw, 76px); line-height: 1; letter-spacing: -.045em; }
.gs-hero h1 span { display: block; color: var(--gs-fg-3); }
.gs-lede { max-width: 56ch; margin-top: 24px; color: var(--gs-fg-2); font-size: clamp(15px, 1.25vw, 17px); line-height: 1.6; }
.gs-hud { margin-top: 28px; padding-top: 16px; border-top: 1px solid var(--gs-line); display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); gap: 2px 40px; }
.gs-hud p { color: var(--gs-fg-3); font: 500 11px/1.9 var(--sh-font-mono); letter-spacing: .14em; text-transform: uppercase; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gs-hud b { color: var(--gs-fg); font-weight: 500; }
.gs-hud b.is-gold { color: var(--gs-gold); }
.gs-hud b.is-teal { color: var(--gs-teal); }
.gs-shot { margin: 0; }
.gs-shot img { width: 100%; border: 1px solid var(--gs-line-2); border-radius: 14px; box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .9), 0 0 0 6px rgba(255, 255, 255, .02); }
.gs-shot figcaption { margin-top: 12px; color: var(--gs-fg-3); font: 500 10px/1 var(--sh-font-mono); letter-spacing: .2em; text-transform: uppercase; text-align: right; }

/* Chapters: label and headline in the left rail, content right. */
.gs-sec { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 24px clamp(28px, 5vw, 88px); padding: clamp(40px, 5vw, 68px) 0; border-top: 1px solid var(--gs-line); }
.gs-sec__head h2 { margin-top: 14px; font-size: clamp(26px, 2.6vw, 36px); line-height: 1.08; letter-spacing: -.035em; }
.gs-sec__head > p:not(.gs-kicker) { margin-top: 14px; color: var(--gs-fg-2); font-size: 14.5px; line-height: 1.6; max-width: 34ch; }
.gs-sec__head .gs-link { margin-top: 10px; }
.gs-sec__body { min-width: 0; display: grid; gap: 28px; align-content: start; }
.gs-sec__foot { grid-column: 2; }

.gs-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; border-top: 1px solid var(--gs-line); border-left: 1px solid var(--gs-line); align-self: start; }
.gs-facts > div { padding: 18px 18px 20px; border-right: 1px solid var(--gs-line); border-bottom: 1px solid var(--gs-line); background: var(--gs-panel); }
.gs-facts dt, .gs-nums dt, .gs-spec th, .gs-odds th[scope="col"], .gs-odds caption { color: var(--gs-fg-3); font: 700 10.5px/1.4 var(--sh-font-mono); letter-spacing: .18em; text-transform: uppercase; }
.gs-facts dd { margin: 10px 0 0; font-size: 15px; font-weight: 500; line-height: 1.4; letter-spacing: -.01em; }
.gs-facts dd small { display: block; margin-top: 4px; color: var(--gs-fg-3); font-size: 12px; font-weight: 400; letter-spacing: 0; }
.gs-facts--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gs-facts--wide dd { color: var(--gs-fg-2); font-size: 14px; font-weight: 400; line-height: 1.55; letter-spacing: 0; }
.gs-facts--wide dt { color: var(--gs-gold); }

.gs-moves { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--gs-line-2); }
.gs-moves li { padding: 20px 22px 4px 0; }
.gs-moves li + li { padding-left: 22px; border-left: 1px solid var(--gs-line); }
.gs-moves__no { display: block; color: var(--gs-gold); font: 400 44px/1 var(--sh-font-num); letter-spacing: -.02em; }
.gs-moves h3 { margin-top: 16px; font-size: 19px; letter-spacing: -.025em; }
.gs-moves p { margin-top: 8px; color: var(--gs-fg-2); font-size: 14px; line-height: 1.55; }

.gs-nums { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
.gs-nums > div { padding: 2px 20px 4px; border-left: 1px solid var(--gs-line); }
.gs-nums > div:first-child { padding-left: 0; border-left: 0; }
.gs-nums dd { margin: 12px 0 0; color: var(--gs-fg); font: 400 clamp(32px, 3.3vw, 48px)/1 var(--sh-font-num); letter-spacing: -.02em; font-variant-numeric: lining-nums; white-space: nowrap; }
.gs-nums dd.is-gold { color: var(--gs-gold); }
.gs-nums dd.gs-nums__note { margin-top: 10px; color: var(--gs-fg-3); font: 400 12.5px/1.45 var(--sh-font-sans); letter-spacing: 0; white-space: normal; }

.gs-spec { width: 100%; border-collapse: collapse; border-top: 1px solid var(--gs-line-2); }
.gs-spec th, .gs-spec td { padding: 14px 0; border-bottom: 1px solid var(--gs-line); text-align: left; vertical-align: top; }
.gs-spec th { width: 190px; padding-right: 20px; padding-top: 17px; }
.gs-spec td { color: var(--gs-fg-2); font-size: 14.5px; line-height: 1.55; }
.gs-spec td span { color: var(--gs-fg); font-weight: 600; white-space: nowrap; }

.gs-odds { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px clamp(24px, 3vw, 48px); }
.gs-odds__table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.gs-odds caption { padding: 0 0 12px; color: var(--gs-gold); text-align: left; }
.gs-odds th, .gs-odds td { padding: 10px 0; border-bottom: 1px solid var(--gs-line); text-align: right; }
.gs-odds thead th { border-bottom-color: var(--gs-line-2); white-space: nowrap; }
.gs-odds th:first-child { text-align: left; }
.gs-odds tbody th { font-size: 14.5px; font-weight: 500; }
.gs-odds tbody td { width: 28%; font: 500 13px/1.4 var(--sh-font-mono); color: var(--gs-fg-2); }
.gs-odds tbody td:nth-child(2) { color: var(--gs-fg); }
.gs-odds tr.is-risky td:last-child { color: var(--gs-red); }

.gs-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 28px; margin: 0; padding: 0; list-style: none; counter-reset: gs-step; }
.gs-steps li { counter-increment: gs-step; padding-top: 16px; border-top: 1px solid var(--gs-line-2); }
.gs-steps li::before { content: counter(gs-step, decimal-leading-zero); color: var(--gs-fg-3); font: 700 10.5px/1 var(--sh-font-mono); letter-spacing: .18em; }
.gs-steps h3 { margin-top: 12px; font-size: 17px; letter-spacing: -.02em; }
.gs-steps p { margin-top: 8px; color: var(--gs-fg-2); font-size: 14px; line-height: 1.55; }

.gs-legal { max-width: 62ch; font-size: clamp(17px, 1.6vw, 21px); font-weight: 500; line-height: 1.45; letter-spacing: -.02em; }
.gs-contact__lede { max-width: 44ch; font-size: clamp(17px, 1.6vw, 21px); font-weight: 500; line-height: 1.45; letter-spacing: -.02em; }
.gs-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.gs-actions .gs-link { margin-left: 6px; }
.gs-contact__address { color: var(--gs-fg-2); font: 500 12px/1.6 var(--sh-font-mono); letter-spacing: .06em; overflow-wrap: anywhere; }
.gs-contact__warn { color: var(--gs-red); font-size: 13px; }
.gs-foot { max-width: var(--sh-maxw); margin: 0 auto; padding: 28px var(--sh-gutter) 44px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 32px; border-top: 1px solid var(--gs-line); color: var(--gs-fg-3); font: 500 10.5px/1.7 var(--sh-font-mono); letter-spacing: .12em; text-transform: uppercase; }

@media (max-width: 1099px) {
  .gs-sec { grid-template-columns: minmax(0, 1fr); }
  .gs-sec__foot { grid-column: 1; }
  .gs-sec__head > p:not(.gs-kicker) { max-width: 60ch; }
  .gs-nav__label { display: none; }
  .gs-nav { grid-template-columns: 1fr auto; }
}
@media (max-width: 899px) {
  .gs-hero { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .gs-facts, .gs-nums { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gs-moves, .gs-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 28px; }
  .gs-moves { border-top: 0; }
  .gs-moves li, .gs-moves li + li { padding: 16px 0 0; border-left: 0; border-top: 1px solid var(--gs-line-2); }
  .gs-nums { gap: 28px 0; }
  .gs-nums > div:nth-child(odd) { padding-left: 0; border-left: 0; }
}
@media (max-width: 639px) {
  .gs-nav { height: 56px; }
  .gs-nav__play { display: none; }
  .gs-hud { grid-template-columns: minmax(0, 1fr); }
  .gs-facts--wide, .gs-odds, .gs-moves, .gs-steps { grid-template-columns: minmax(0, 1fr); }
  .gs-spec th, .gs-spec td { display: block; width: auto; padding: 0; border: 0; }
  .gs-spec tr { display: block; padding: 14px 0; border-bottom: 1px solid var(--gs-line); }
  .gs-spec td { margin-top: 6px; }
  .gs-actions .sh-btn { flex: 1 1 150px; }
  .gs-actions .gs-link { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .gs .sh-btn, .gs .sh-btn::after { transition: none; }
  .gs .sh-btn:hover { transform: none; }
}

/* Print: two A4 pages on white. Page one ends after the spec table. */
@page { size: A4; margin: 11mm 13mm; }
@media print {
  :root {
    --gs-bg: #fff; --gs-panel: transparent; --gs-fg: #111317; --gs-fg-2: #2c3138; --gs-fg-3: #5d646e;
    --gs-line: #d9dce1; --gs-line-2: #9aa0a9; --gs-gold: #7a5a0c; --gs-red: #a3182a; --gs-teal: #0c6b5f; color-scheme: light;
  }
  html, body.gs { background: #fff; color: var(--gs-fg); font-size: 9pt; }
  .skip-link, .gs-nav__actions, .gs-nav__label, .gs-actions, .gs-sec__head .gs-link, #contactFallback { display: none !important; }
  .gs-nav { position: static; display: block; height: auto; padding: 0 0 5pt; background: none; border-bottom: 1.5pt solid var(--gs-fg); backdrop-filter: none; }
  .gs-mark { min-height: 0; font-size: 13pt; }
  .gs-main, .gs-foot { max-width: none; padding-left: 0; padding-right: 0; }
  .gs-hero { grid-template-columns: 1.5fr 1fr; gap: 18pt; align-items: center; padding: 9pt 0; }
  .gs-hero h1 { margin-top: 5pt; font-size: 25pt; }
  .gs-lede { margin-top: 7pt; font-size: 9pt; line-height: 1.45; }
  .gs-hud { margin-top: 8pt; padding-top: 6pt; gap: 0 22pt; }
  .gs-hud p, .gs-kicker, .gs-shot figcaption, .gs-foot { font-size: 6.5pt; }
  .gs-hud p { line-height: 1.7; }
  .gs-shot img { border-radius: 4pt; box-shadow: none; }
  .gs-shot figcaption { margin-top: 4pt; }
  .gs-sec { grid-template-columns: 34mm minmax(0, 1fr); gap: 5pt 14pt; padding: 6.5pt 0; break-inside: avoid; }
  .gs-sec__foot { grid-column: 2; }
  .gs-facts, .gs-nums, .gs-moves, .gs-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; }
  .gs-facts--wide, .gs-odds { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gs-moves { border-top: 1px solid var(--gs-line-2); }
  .gs-moves li, .gs-moves li + li { border-top: 0; }
  .gs-moves li + li { border-left: 1px solid var(--gs-line); }
  .gs-nums > div:nth-child(odd) { padding-left: 10pt; border-left: 1px solid var(--gs-line); }
  .gs-nums > div:first-child { padding-left: 0; border-left: 0; }
  .gs-spec tr { display: table-row; padding: 0; border: 0; }
  .gs-spec th, .gs-spec td { display: table-cell; border-bottom: 1px solid var(--gs-line); margin: 0; }
  .gs-sec__head h2 { margin-top: 4pt; font-size: 12.5pt; }
  .gs-sec__head > p:not(.gs-kicker) { margin-top: 5pt; font-size: 7.5pt; line-height: 1.4; }
  .gs-sec__body { gap: 7pt; }
  .gs-facts > div { padding: 5pt 7pt 5.5pt; }
  .gs-facts dt, .gs-nums dt, .gs-spec th, .gs-odds th[scope="col"], .gs-odds caption, .gs-steps li::before { font-size: 6pt; }
  .gs-facts dd { margin-top: 3pt; font-size: 8.5pt; }
  .gs-facts dd small { font-size: 7pt; margin-top: 1pt; }
  .gs-facts--wide dd, .gs-moves p, .gs-steps p, .gs-spec td, .gs-odds tbody th { font-size: 8pt; line-height: 1.4; }
  .gs-moves li { padding: 7pt 10pt 0 0; }
  .gs-moves li + li { padding-left: 10pt; }
  .gs-moves__no { font-size: 20pt; }
  .gs-moves h3, .gs-steps h3 { margin-top: 5pt; font-size: 10pt; }
  .gs-moves p, .gs-steps p { margin-top: 3pt; }
  .gs-nums > div { padding: 0 10pt; }
  .gs-nums dd { margin-top: 4pt; font-size: 20pt; }
  .gs-nums dd.gs-nums__note { margin-top: 3pt; font-size: 7pt; }
  .gs-spec th, .gs-spec td { padding: 3.2pt 0; }
  .gs-spec th { width: 30mm; padding-top: 4.4pt; }
  .gs-odds { gap: 12pt 18pt; break-before: page; }
  .gs-odds caption { padding-bottom: 4pt; }
  .gs-odds th, .gs-odds td { padding: 2.4pt 0; }
  .gs-odds tbody td { font-size: 7.5pt; }
  .gs-sec:has(.gs-odds) { break-inside: auto; }
  .gs-note { font-size: 7.5pt; line-height: 1.4; }
  .gs-steps { gap: 0 14pt; }
  .gs-hero h1 span { color: var(--gs-fg-3); }
  .gs-steps li { padding-top: 4pt; }
  .gs-legal, .gs-contact__lede { font-size: 9.5pt; line-height: 1.35; }
  .gs-contact__address { font-size: 9pt; color: var(--gs-fg); }
  .gs-foot { padding: 6pt 0 0; }
  .gs h1, .gs h2, .gs h3 { color: var(--gs-fg); }
.gs code { color: var(--gs-fg); }
}
