/* Made to Move recap. Palette is local to this page.
   Tram yellow, cream, tile blue, terracotta, ink.
   Inter Tight, Geist Mono, Permanent Marker. */

body.r26-page {
  --tram: #f5c518;
  --cream: #f5ecd8;
  --tile: #1d4e9e;
  --terra: #c8613a;
  --ink: #111111;
  --r26-card-pad: 16px;
  --r26-card-gap: 14px;
  background: var(--cream);
  color: var(--ink);
  font-family: "Inter Tight", "Instrument Sans", sans-serif;
  overflow-wrap: anywhere;
  word-break: break-word;
}

body.r26-page .site-footer {
  background: var(--tram);
}

.r26-marker {
  font-family: "Permanent Marker", "Inter Tight", sans-serif;
  font-weight: 400;
}

.r26-mono,
.r26-flap,
.r26-sign__code,
.r26-board,
.r26-dest__code {
  font-family: "Geist Mono", ui-monospace, monospace;
}

.r26-main {
  position: relative;
}

.r26-route {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 28px;
  width: 4px;
  pointer-events: none;
  z-index: 2;
}

.r26-route__rail,
.r26-route__fill {
  position: absolute;
  inset: 0;
  border-radius: 4px;
}

.r26-route__rail {
  background: rgba(17, 17, 17, 0.18);
}

.r26-route__fill {
  background: var(--tile);
  box-shadow: 0 0 14px rgba(29, 78, 158, 0.55);
  transform: scaleY(1);
  transform-origin: top center;
}

.r26-route.is-live .r26-route__fill {
  transform: scaleY(var(--p, 0));
}

.r26-tram {
  position: absolute;
  left: 50%;
  top: var(--p, 0%);
  width: 28px;
  height: 16px;
  margin: -8px 0 0 -14px;
  background: var(--tram);
  border: 2px solid var(--ink);
  border-radius: 8px;
  box-shadow: -12px 0 0 rgba(29, 78, 158, 0.45), -26px 0 10px rgba(29, 78, 158, 0.28);
}

.r26-tram::before {
  content: "";
  position: absolute;
  left: 3px;
  right: 3px;
  top: 3px;
  height: 6px;
  background: repeating-linear-gradient(90deg, var(--tile) 0 5px, transparent 5px 8px);
}

.r26-tram::after {
  content: "";
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: -5px;
  height: 3px;
  background: var(--ink);
  border-radius: 2px;
}

.r26-stop,
.r26-survey {
  scroll-margin-top: 88px;
}

.r26-stop {
  position: relative;
  padding: 48px 68px 64px 88px;
}

.r26-stop__dot {
  position: absolute;
  left: 21px;
  top: 56px;
  width: 18px;
  height: 18px;
  border: 3px solid var(--ink);
  border-radius: 50%;
  background: var(--tram);
  z-index: 3;
}

.r26-stop.is-here .r26-stop__dot {
  background: var(--tile);
}

.r26-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, auto);
  gap: 32px;
  align-items: center;
  padding-top: 42px;
  padding-bottom: 36px;
  background:
    radial-gradient(circle at 12% 20%, rgba(29, 78, 158, 0.08) 0 18%, transparent 19%),
    var(--tram);
}

.r26-kicker {
  margin: 0 0 8px;
  font-size: 1.35rem;
  line-height: 1;
}

.r26-hero h1 {
  margin: 0;
  max-width: 12em;
  font-size: clamp(2.5rem, 5.4vw, 4.6rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 0.92;
}

.r26-hero h1 span {
  display: inline;
}

.r26-lede {
  margin: 16px 0 0;
  max-width: 38rem;
  font-size: 1.08rem;
  line-height: 1.5;
}

.r26-powered {
  margin: 14px 0 0;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.r26-jump {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.r26-jump a {
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.r26-stage {
  display: flex;
  justify-content: center;
}

.r26-frame {
  max-width: 100%;
  border: 8px solid var(--ink);
  background: var(--ink);
  line-height: 0;
  box-shadow: 10px 10px 0 rgba(17, 17, 17, 0.18);
}

.r26-frame video {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: min(64vh, 580px);
  aspect-ratio: 9 / 16;
  object-fit: cover;
  background: #111;
}

.r26-sign {
  display: flex;
  align-items: stretch;
  gap: 0;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 18px;
  background: var(--tram);
  border: 3px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
}

.r26-sign__code {
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: var(--ink);
  color: var(--tram);
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.r26-sign h2,
.r26-survey h2 {
  margin: 0;
  padding: 10px 16px;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1;
  text-transform: uppercase;
}

.r26-survey {
  position: relative;
  padding: 8px 68px 28px 88px;
  background: var(--cream);
}

.r26-survey__dot {
  position: absolute;
  left: 21px;
  top: 48px;
  width: 18px;
  height: 18px;
  border: 3px solid var(--ink);
  border-radius: 50%;
  background: var(--terra);
  z-index: 3;
}

.r26-ticket {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  background: var(--tram);
  color: var(--ink);
  border: 3px solid var(--ink);
  box-shadow: 8px 8px 0 var(--ink);
}

.r26-ticket--gate {
  box-shadow: 8px 8px 0 var(--ink), 0 0 28px rgba(29, 78, 158, 0.45);
}

.r26-next {
  margin: 12px 0 0;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tile);
}

.r26-hero .r26-next {
  color: var(--ink);
}

.r26-vessel {
  background:
    radial-gradient(ellipse at 75% 0%, rgba(29, 78, 158, 0.2), transparent 52%),
    var(--cream);
}

.r26-hero.r26-vessel {
  background:
    linear-gradient(105deg, transparent 40%, rgba(29, 78, 158, 0.28) 50%, transparent 60%),
    radial-gradient(circle at 100% 0%, rgba(29, 78, 158, 0.42), transparent 48%),
    var(--tram);
}

.r26-ticket__main {
  padding: 22px 24px 20px;
}

.r26-ticket__main h2 {
  padding: 0;
  font-size: clamp(2rem, 4vw, 3.2rem);
  text-transform: none;
}

.r26-hero .r26-sign {
  background: var(--ink);
  color: var(--tram);
}

.r26-hero .r26-sign__code {
  background: var(--tram);
  color: var(--ink);
}

.r26-ticket__main p {
  margin: 10px 0 0;
  max-width: 40rem;
  font-size: 1.12rem;
  line-height: 1.45;
  font-weight: 600;
}

.r26-ticket__stub {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 22px;
  border-left: 3px dashed var(--ink);
  background:
    radial-gradient(circle at 0 12px, transparent 8px, var(--tram) 9px) 0 0 / 100% 24px;
}

.r26-ticket .button--dark {
  color: var(--tram);
  background: var(--ink);
}

.r26-board {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  background: var(--ink);
  color: var(--cream);
  border: 3px solid var(--ink);
}

.r26-stat {
  margin: 0;
  padding: 18px 8px 16px;
  text-align: center;
  border-right: 1px solid rgba(245, 236, 216, 0.2);
}

.r26-stat:last-child {
  border-right: 0;
}

.r26-flap {
  display: inline-block;
  min-width: 0;
  max-width: 100%;
  padding: 4px 6px 6px;
  background: #1a1a1a;
  color: var(--tram);
  font-size: clamp(0.85rem, 2.6vw, 2rem);
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  position: relative;
}

.r26-flap::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 1px;
  background: rgba(245, 236, 216, 0.28);
}

.r26-stat span:last-child,
.r26-stat__label {
  display: block;
  margin-top: 8px;
  color: var(--cream);
  font-family: "Inter Tight", sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.r26-note {
  margin: 0 0 22px;
  max-width: 46rem;
  font-size: 1.02rem;
  line-height: 1.5;
}

.r26-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--r26-card-gap);
  margin: 18px 0 26px;
}

.r26-compare {
  min-width: 0;
  padding: var(--r26-card-pad);
  background: #fffdf6;
  border: 2px solid var(--ink);
}

.r26-compare strong,
.r26-compare .r26-flap {
  display: block;
  background: transparent;
  color: inherit;
  padding: 0;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  letter-spacing: -0.04em;
  line-height: 1;
}

.r26-compare .r26-flap::after {
  display: none;
}

.r26-compare span {
  display: block;
  margin-top: 6px;
  font-size: 0.92rem;
  line-height: 1.4;
}

.r26-compare--site {
  background: var(--tile);
  color: var(--cream);
  border-color: var(--ink);
}

.r26-chart {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.r26-chart caption {
  caption-side: bottom;
  padding-top: 12px;
  text-align: left;
  font-size: 0.95rem;
  line-height: 1.45;
}

.r26-chart th,
.r26-chart td {
  padding: 6px 0;
  text-align: left;
  vertical-align: middle;
}

.r26-chart thead th {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.r26-chart th[scope="row"] {
  width: 24%;
  min-width: 0;
  padding-right: 12px;
  font-weight: 700;
}

.r26-meter {
  display: flex;
  align-items: center;
  gap: 10px;
}

.r26-meter__bar {
  flex: 1;
  height: 12px;
  background: rgba(17, 17, 17, 0.08);
}

.r26-meter__fill {
  display: block;
  height: 100%;
  background: var(--ink);
  transform-origin: left center;
}

.r26-panel {
  background:
    linear-gradient(180deg, rgba(245, 236, 216, 0.94), rgba(245, 236, 216, 0.94)),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='48' height='48'><rect width='48' height='48' fill='%23f5ecd8'/><path d='M24 4 L44 24 L24 44 L4 24 Z' fill='none' stroke='%231d4e9e' stroke-width='1'/><circle cx='24' cy='24' r='3' fill='%23c8613a'/></svg>");
  background-size: auto, 48px 48px;
}

.r26-data {
  display: grid;
  grid-template-columns: minmax(0, 280px) minmax(0, 1fr);
  gap: 28px;
  align-items: start;
}

.r26-hours {
  min-width: 0;
  padding: var(--r26-card-pad);
  background: var(--ink);
  color: var(--cream);
}

.r26-hours .r26-flap {
  font-size: clamp(2rem, 8vw, 3.4rem);
  padding: 8px 12px;
}

.r26-hours p {
  margin: 12px 0 0;
  font-size: 0.95rem;
  line-height: 1.4;
}

.r26-depart {
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.r26-depart li + li {
  margin-top: 6px;
}

.r26-donut-wrap {
  display: grid;
  grid-template-columns: minmax(0, 160px) minmax(0, 1fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 22px;
  padding: var(--r26-card-pad);
  background: #fffdf6;
  border: 2px solid var(--ink);
}

.r26-donut {
  width: 100%;
  max-width: 150px;
  height: auto;
}

.r26-legend {
  margin: 0;
  padding: 0;
  list-style: none;
}

.r26-legend li {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0 0 8px;
  font-weight: 700;
}

.r26-swatch {
  width: 14px;
  height: 14px;
  border: 2px solid var(--ink);
  flex: none;
}

.r26-swatch--genesis { background: var(--tile); }
.r26-swatch--scale { background: var(--terra); }

.r26-share {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--r26-card-gap);
  margin-bottom: 0;
}

.r26-share article {
  min-width: 0;
  padding: var(--r26-card-pad);
  background: #fffdf6;
  border: 2px solid var(--ink);
}

.r26-share strong {
  display: block;
  max-width: 100%;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: clamp(1rem, 2.4vw, 1.6rem);
}

.r26-share p {
  margin: 4px 0 8px;
}

.r26-arrivals {
  margin-top: 36px;
  min-width: 0;
  max-width: 100%;
}

.r26-win-grid,
.r26-projects {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
  gap: var(--r26-card-gap);
}

.r26-directory {
  margin-top: 36px;
}

.r26-win-grid--scale {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.r26-win-grid--genesis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.r26-win-grid--smol {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.r26-card,
.r26-project {
  margin: 0;
  min-width: 0;
  max-width: 100%;
  padding: var(--r26-card-pad);
  background: #fffdf6;
  border: 2px solid var(--ink);
}

.r26-place,
.r26-sub {
  margin: 22px 0 10px;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.r26-card .r26-place {
  margin: 0;
}

.r26-card h3,
.r26-project h3 {
  margin: 6px 0 0;
  max-width: 100%;
  font-size: clamp(1.02rem, 1.5vw, 1.35rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

.r26-project h3 {
  font-size: 1.08rem;
}

.r26-card h3 a,
.r26-links a {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}

.r26-team,
.r26-official,
.r26-desc,
.r26-one {
  margin: 8px 0 0;
  max-width: 65ch;
  font-size: 0.95rem;
  line-height: 1.45;
}

.r26-team {
  font-weight: 800;
}

.r26-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 12px 0 0;
}

.r26-links a {
  font-size: 0.86rem;
  font-weight: 800;
}

.r26-masonry {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-flow: dense;
  align-items: start;
  gap: 10px;
}

.r26-shot {
  display: block;
  margin: 0;
  background: #fffdf6;
  border: 2px solid var(--ink);
  overflow: hidden;
}

.r26-shot img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

.r26-shot--tall {
  grid-row: span 2;
}

.r26-barrier {
  background: var(--tram);
  color: var(--ink);
  border: 3px solid var(--ink);
  box-shadow: 8px 8px 0 var(--ink);
}

.r26-barrier__arm {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  background: var(--ink);
  color: #f5c518;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: clamp(0.62rem, 2.2vw, 0.78rem);
  font-weight: 700;
  letter-spacing: 0.1em;
}

.r26-barrier__arm span {
  flex: 1 1 0;
  min-width: 0;
  padding: 12px 8px;
  text-align: center;
  border-right: 2px solid #f5c518;
}

.r26-barrier__arm span:last-child {
  border-right: 0;
}

.r26-barrier__body {
  padding: 28px 28px 26px 36px;
  background:
    radial-gradient(circle at 0 16px, transparent 8px, var(--tram) 9px) left center / 16px 28px repeat-y;
}

.r26-barrier h2 {
  margin: 8px 0 0;
  max-width: min(16ch, 100%);
  font-size: clamp(1.7rem, 5vw, 3.6rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.95;
  text-transform: none;
}

.r26-barrier__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 22px;
  margin: 22px 0;
  padding: 0;
  list-style: none;
}

.r26-barrier__list li {
  padding: 8px 0 8px 12px;
  border-left: 4px solid var(--tile);
  font-weight: 700;
  line-height: 1.35;
}

.r26-barrier .button--dark {
  background: var(--ink);
  color: #f5c518;
}

/* Right-align the pill without display:table. Table layout pinned the
   line box to the top of the 52px min-height, so TAKE THE SURVEY sat on
   the capsule curve instead of inside it. Block flex keeps the shared
   CTA centering (align-items, padding, arrow) and shrink-wraps. */
#unlock .r26-barrier__body .button--dark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  margin-left: auto;
  line-height: 1;
}

.r26-barrier .button--dark:focus {
  outline: 3px solid var(--tile);
  outline-offset: 3px;
}

.r26-depart {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  width: 100%;
  max-width: 100%;
  margin: 0 0 16px;
  padding: 14px 16px;
  background: #f5c518;
  color: var(--ink);
  border: 3px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
  text-decoration: none;
  font-weight: 800;
  line-height: 1.35;
}

.r26-depart:hover {
  background: #ffd84a;
}

.r26-depart:focus {
  outline: 3px solid var(--tile);
  outline-offset: 3px;
}

.r26-depart > * {
  min-width: 0;
  max-width: 100%;
}

.r26-depart__flap {
  flex: 0 0 auto;
  padding: 8px 10px;
  background: var(--ink);
  color: #f5c518;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.85rem;
  letter-spacing: 0.16em;
}

.r26-dests {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--r26-card-gap);
}

.r26-dest {
  display: flex;
  flex-direction: column;
  min-width: 0;
  max-width: 100%;
  min-height: 280px;
  height: auto;
  padding: var(--r26-card-pad);
  text-decoration: none;
  border: 3px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
}

.r26-dest:nth-child(1) { background: var(--tile); color: var(--cream); }
.r26-dest:nth-child(2) { background: var(--tram); color: var(--ink); }
.r26-dest:nth-child(3) { background: var(--terra); color: #fffdf6; }

.r26-dest__code {
  font-size: 0.75rem;
  letter-spacing: 0.14em;
}

.r26-dest h3 {
  margin: 10px 0 0;
  max-width: 100%;
  font-size: clamp(1rem, 1.6vw, 1.6rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
}

.r26-dest__who {
  margin: 10px 0 0;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.r26-dest__what {
  margin: 8px 0 0;
  max-width: 65ch;
  font-size: 0.95rem;
  line-height: 1.4;
}

.r26-dest__go {
  margin-top: auto;
  padding-top: 14px;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.r26-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  margin: 0 0 14px;
}

.r26-search {
  display: flex;
  flex: 1 1 220px;
  flex-direction: column;
  gap: 6px;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.r26-search input {
  font-family: inherit;
  font-size: 1rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  padding: 12px 14px;
  border: 2px solid var(--ink);
  background: #fffdf6;
  color: var(--ink);
}

.r26-paths {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.r26-paths button {
  font-family: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 12px 16px;
  border: 2px solid var(--ink);
  background: transparent;
  color: var(--ink);
  cursor: pointer;
  border-radius: 999px;
}

.r26-paths button[aria-pressed="true"] {
  background: var(--ink);
  color: var(--tram);
}

.r26-count,
.r26-empty {
  margin: 0 0 14px;
}

.r26-lightbox {
  border: 0;
  padding: 0;
  background: transparent;
  max-width: none;
  max-height: none;
}

.r26-lightbox:not([open]) { display: none; }

.r26-lightbox[open] {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: min(960px, calc(100vw - 32px));
  max-height: calc(100vh - 32px);
  padding: 16px;
  background: var(--ink);
  color: var(--cream);
}

.r26-lightbox::backdrop { background: rgba(17, 17, 17, 0.88); }

.r26-lightbox__bar {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.r26-lightbox__bar button {
  font-family: inherit;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 8px 12px;
  border: 1px solid var(--tram);
  background: transparent;
  color: var(--tram);
  cursor: pointer;
}

.r26-lightbox img {
  width: auto;
  max-width: 100%;
  max-height: calc(100vh - 160px);
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}

.r26-lightbox__caption {
  margin: 0;
  line-height: 1.4;
}

.r26-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: no-preference) {
  .r26-rise {
    animation: r26-rise 0.7s ease both;
    animation-delay: var(--d, 0s);
  }

  body.r26-page.is-motion .r26-meter__fill {
    animation: r26-bar 0.8s ease both;
  }

  .r26-flap.is-flipping {
    animation: r26-flap 0.45s ease;
  }

  .r26-route.is-live .r26-tram {
    animation: r26-trail 1.6s ease-in-out infinite;
  }
}

@keyframes r26-rise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

@keyframes r26-bar {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes r26-flap {
  0% { transform: rotateX(70deg); }
  100% { transform: rotateX(0); }
}

@keyframes r26-trail {
  50% { box-shadow: -18px 0 0 rgba(29, 78, 158, 0.6), -36px 0 14px rgba(29, 78, 158, 0.22); }
}

@media (prefers-reduced-motion: reduce) {
  .r26-tram { display: none; }
  .r26-route__fill { transform: scaleY(1) !important; }
  .r26-rise { animation: none; }
}

@media (max-width: 1023px) {
  .r26-dests { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .r26-win-grid--genesis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .r26-win-grid--smol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .r26-dest { min-height: 0; }
  .r26-data { grid-template-columns: minmax(0, 1fr); }
  .r26-hero {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
  }
  .r26-hero-copy,
  .r26-hero h1 { width: 100%; max-width: 100%; }
}

@media (max-width: 900px) {
  .r26-board { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .r26-stat:nth-child(3) { border-right: 0; }
  .r26-masonry { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 820px) {
  body.r26-page .site-header {
    background: var(--tram);
  }
}

@media (max-width: 720px) {
  .r26-route { left: 14px; }
  .r26-stop,
  .r26-survey { padding-left: 40px; padding-right: 20px; }
  .r26-stop__dot,
  .r26-survey__dot { left: 7px; }
  .r26-hero {
    grid-template-columns: 1fr;
    justify-items: center;
    padding-top: 28px;
  }
  .r26-hero-copy { width: 100%; }
  .r26-hero h1 {
    max-width: none;
    font-size: clamp(1.85rem, 8vw, 2.35rem);
  }
  .r26-hero h1 span { display: block; }
  .r26-frame video { max-height: min(42vh, 380px); height: auto; }
  .r26-ticket { grid-template-columns: 1fr; }
  .r26-ticket__stub {
    border-left: 0;
    border-top: 3px dashed var(--ink);
  }
  .r26-ticket .button { width: 100%; }
  .r26-split,
  .r26-share,
  .r26-donut-wrap,
  .r26-barrier__list { grid-template-columns: minmax(0, 1fr); }
  .r26-board { grid-template-columns: 1fr 1fr; }
  .r26-stat { border-right: 0; border-bottom: 1px solid rgba(245, 236, 216, 0.18); }
  .r26-dests { grid-template-columns: 1fr; }
  .r26-chart,
  .r26-chart tbody,
  .r26-chart tr,
  .r26-chart th[scope="row"],
  .r26-chart td { display: block; width: 100%; }
}

.r26-stat {
  min-width: 0;
}

.r26-main,
.r26-stop,
.r26-survey,
.r26-hero,
.r26-hero > *,
.r26-data,
.r26-data > *,
.r26-share > *,
.r26-split > *,
.r26-win-grid,
.r26-win-grid > *,
.r26-dests > *,
.r26-board,
.r26-board > *,
.r26-ticket,
.r26-ticket > *,
.r26-masonry,
.r26-masonry > *,
.r26-barrier,
.r26-barrier__body,
.r26-barrier__list > *,
.r26-donut-wrap,
.r26-donut-wrap > *,
.r26-sign,
.r26-chart th,
.r26-chart td,
.r26-legend li,
.r26-meter,
.r26-stat,
.r26-card h3,
.r26-card h3 a,
.r26-dest h3,
.r26-dest__who,
.r26-dest__go {
  min-width: 0;
}

/* The Vessel. Same journey, unlisted. */

.r26-vip {
  display: flex;
  flex-wrap: wrap;
  gap: 18px 28px;
  align-items: flex-end;
  justify-content: space-between;
}

.r26-pack {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 22px;
  background: var(--ink);
  color: var(--cream);
  border: 3px solid var(--ink);
  box-shadow: 8px 8px 0 var(--tile);
}

.r26-pack h3 {
  margin: 0;
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  letter-spacing: -0.03em;
}

.r26-pack p {
  margin: 8px 0 0;
  max-width: 36rem;
}

.r26-pack__soon {
  margin: 0;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tram);
}

.r26-pack .button--dark {
  background: var(--tram);
  color: var(--ink);
}

.r26-strip {
  display: flex;
  gap: 8px;
  margin-top: 16px;
  overflow-x: auto;
  padding-bottom: 8px;
}

.r26-strip a {
  flex: 0 0 auto;
  border: 2px solid var(--ink);
}

.r26-strip img {
  width: 160px;
  height: 110px;
  object-fit: cover;
}

.r26-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}

.r26-chips li {
  padding: 3px 8px;
  border: 1px solid var(--ink);
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.72rem;
}

.r26-soon {
  padding: 22px;
  background: var(--tram);
  border: 3px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
}

.r26-soon h3 {
  margin: 0;
  font-size: 1.4rem;
}

.r26-social {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.r26-social a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 16px;
  border: 2px solid var(--ink);
  background: #fffdf6;
  font-weight: 800;
  text-decoration: none;
}

.r26-social a:hover {
  background: var(--tram);
}

.r26-tweets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 8px;
}

.r26-tweet {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding: 14px 16px;
  border: 2px solid var(--ink);
  background: #fffdf6;
}

.r26-tweet__who {
  margin: 0;
  font-weight: 800;
}

.r26-tweet__who span,
.r26-tweet__when {
  color: var(--tile);
  font-weight: 600;
  font-size: 0.85rem;
}

.r26-tweet__when,
.r26-tweet__text {
  margin: 0;
}

.r26-tweet__text {
  white-space: pre-wrap;
  line-height: 1.4;
}

.r26-tweet a {
  margin-top: auto;
  font-weight: 800;
}

/* Six posts: two rows of three on desktop, then two columns, then one.
   minmax(0, 1fr) keeps long links inside the card. */
@media (max-width: 900px) {
  .r26-tweets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .r26-tweets { grid-template-columns: minmax(0, 1fr); }
}

.r26-partners {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
  margin-top: 22px;
}

.r26-partner {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 220px;
  padding: 16px;
  background: #fffdf6;
  border: 2px solid var(--ink);
  text-decoration: none;
  color: inherit;
}

.r26-partner img {
  width: auto;
  max-width: 100%;
  height: 42px;
  object-fit: contain;
  object-position: left center;
}

.r26-partner strong {
  font-size: 1.05rem;
}

.r26-partner span {
  font-size: 0.92rem;
  line-height: 1.4;
}

.r26-survey__progress {
  margin: 18px 0 10px;
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.r26-q {
  margin: 0 0 14px;
  padding: 18px;
  background: #fffdf6;
  border: 3px solid var(--ink);
  box-shadow: 6px 6px 0 var(--ink);
}

.r26-q h3 {
  margin: 0 0 12px;
  font-size: 1.35rem;
}

.r26-q__opt {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.r26-q__hint {
  margin: 0 0 10px;
  font-size: 0.95rem;
  line-height: 1.4;
}

.r26-q input[type="text"],
.r26-q input[type="email"],
.r26-q textarea {
  width: 100%;
  padding: 12px;
  border: 2px solid var(--ink);
  font: inherit;
  background: #fff;
}

.r26-choices,
.r26-grid fieldset {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.r26-grid fieldset {
  margin-top: 14px;
}

.r26-grid legend {
  font-weight: 800;
  margin-bottom: 6px;
}

.r26-choice {
  display: flex;
  gap: 8px;
  align-items: flex-start;
}

.r26-scale {
  display: flex;
  gap: 8px;
}

.r26-scale__n {
  flex: 1;
  text-align: center;
  font-weight: 800;
}

.r26-scale__n span {
  display: block;
  margin-top: 4px;
  padding: 10px 0;
  border: 2px solid var(--ink);
  background: var(--cream);
}

.r26-scale__n input:checked + span {
  background: var(--tram);
}

.r26-scale__n input {
  position: absolute;
  opacity: 0;
}

.r26-scale__labels {
  display: flex;
  justify-content: space-between;
  margin: 8px 0 0;
  font-size: 0.85rem;
}

.r26-prompt {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 2px dashed var(--ink);
}

.r26-prompt summary {
  cursor: pointer;
  font-weight: 800;
  color: var(--tile);
}

.r26-prompt summary:focus-visible,
.r26-prompt button:focus-visible {
  outline: 3px solid var(--tile);
  outline-offset: 3px;
}

.r26-prompt__note {
  margin: 10px 0;
  font-size: 0.95rem;
  line-height: 1.45;
}

.r26-prompt__box {
  margin: 0 0 12px;
  padding: 12px;
  max-height: 16rem;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--cream);
  border: 2px solid var(--ink);
  font-family: "Geist Mono", ui-monospace, monospace;
  font-size: 0.82rem;
  line-height: 1.45;
}

.r26-survey__error {
  margin: 8px 0 0;
  font-weight: 800;
}

.r26-survey__nav {
  display: flex;
  gap: 10px;
  margin-top: 16px;
}

@media (max-width: 720px) {
  .r26-pack { grid-template-columns: 1fr; }
  .r26-pack .button { width: 100%; }
  .r26-barrier__list { grid-template-columns: 1fr; }
  .r26-barrier__body { padding: 22px 18px 20px; }
  .r26-win-grid--scale,
  .r26-win-grid--genesis,
  .r26-win-grid--smol { grid-template-columns: minmax(0, 1fr); }
  .r26-prompt button { width: 100%; }
}

/* The survey reuses the recap hero, which is a two-column poster grid.
   On this page that parks the form beside the headline and, under 1024px,
   shrink-wraps the card to the longest question line. One stretched column
   keeps the step, the FrictionLog prompt, and the buttons inside the screen.
   The extra bottom padding lets those buttons scroll clear of the consent banner. */
.r26-survey-hero {
  grid-template-columns: minmax(0, 1fr);
  justify-items: stretch;
  align-items: start;
}

#r26-survey {
  width: min(100%, 42rem);
  max-width: 100%;
  min-width: 0;
}

.r26-q,
.r26-prompt,
.r26-prompt__box,
.r26-choices,
.r26-choice,
.r26-scale,
.r26-survey__nav {
  max-width: 100%;
  min-width: 0;
}

.r26-q h3,
.r26-choice span,
.r26-prompt summary,
.r26-prompt__note,
.r26-prompt__box {
  overflow-wrap: anywhere;
}

.r26-q input[type="text"],
.r26-q input[type="email"],
.r26-q textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  font-size: 1rem;
}

.r26-choice {
  align-items: center;
  min-height: 44px;
}

.r26-choice input {
  flex: 0 0 auto;
  width: 1.15rem;
  height: 1.15rem;
  margin-top: 0;
}

.r26-choice span {
  flex: 1 1 auto;
  min-width: 0;
}

.r26-scale {
  flex-wrap: wrap;
}

.r26-scale__n {
  position: relative;
  flex: 1 1 2.75rem;
  min-width: 2.75rem;
}

.r26-scale__n span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
}

.r26-scale__n input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
}

.r26-prompt summary {
  min-height: 44px;
  padding: 10px 0;
}

.r26-survey__progress,
.r26-q,
.r26-q input,
.r26-q textarea,
.r26-survey__nav {
  scroll-margin-top: 96px;
  scroll-margin-bottom: 240px;
}

.r26-survey__nav {
  flex-wrap: wrap;
}

.r26-survey__nav .button {
  min-height: 48px;
}

/* Shared .button::after is a forward arrow. Back needs the same arrow, facing left, in front of the label. */
#r26-survey-back::after {
  content: none;
}

#r26-survey-back::before {
  content: "\2190";
  font-size: 13px;
  line-height: 1;
}

@media (max-width: 900px) {
  .r26-survey-hero {
    padding-bottom: calc(48px + 220px);
  }
}

/* Insiders recap players. Same frame as the public hero, two across. */
.r26-recaps {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 22px;
  align-items: start;
}

.r26-recap,
.r26-recaps .r26-frame,
.r26-recaps .r26-frame video {
  min-width: 0;
}

.r26-recaps .r26-sub {
  margin-top: 0;
}

.r26-recaps .r26-stage {
  justify-content: center;
}

.r26-recaps .r26-frame {
  max-width: 100%;
}

.r26-recaps .r26-frame video {
  max-height: min(62vh, 540px);
}

.r26-more {
  margin: 18px 0 0;
}

@media (max-width: 900px) {
  .r26-recaps {
    grid-template-columns: minmax(0, 1fr);
  }

  .r26-recaps .r26-frame video {
    max-height: min(70vh, 560px);
  }
}

/* Insiders interviews. Same frame as the recap players, landscape 16:9. */
.r26-interviews {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  align-items: start;
}

.r26-interviews > div,
.r26-interviews .r26-frame,
.r26-interviews .r26-frame video {
  min-width: 0;
}

.r26-interviews .r26-sub {
  margin-top: 0;
}

.r26-interviews .r26-team {
  margin: -4px 0 8px;
}

.r26-interviews .r26-frame {
  max-width: 100%;
}

.r26-interviews .r26-frame video {
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: none;
  aspect-ratio: 16 / 9;
  object-fit: contain;
}

@media (max-width: 900px) {
  .r26-interviews {
    grid-template-columns: minmax(0, 1fr);
  }
}
