@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Inter:wght@500;650;800;900&display=swap");

:root {
  --ink: #101010;
  --paper: #f3efe6;
  --white: #fffdf7;
  --acid: #edff45;
  --pink: #f15b98;
  --blue: #3855ef;
  --cyan: #68e4db;
  --orange: #f36c37;
  --green: #16bb5b;
  --line: 1px solid var(--ink);
  --sans: "Inter", Arial, sans-serif;
  --mono: "DM Mono", ui-monospace, monospace;
  --page-pad: clamp(24px, 4.2vw, 78px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: hidden; background: var(--paper); }
body {
  margin: 0;
  min-width: 300px;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  text-rendering: optimizeLegibility;
}
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }

.skip-link {
  position: fixed;
  z-index: 100;
  left: 16px;
  top: 10px;
  padding: 10px 14px;
  border: var(--line);
  background: var(--acid);
  color: var(--ink);
  font: 500 .72rem/1 var(--mono);
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-head {
  position: sticky;
  z-index: 40;
  top: 0;
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto;
  min-height: 65px;
  border-bottom: var(--line);
  background: rgba(243, 239, 230, .94);
  backdrop-filter: blur(16px);
}
.wordmark {
  display: inline-flex;
  align-items: center;
  width: max-content;
  padding: 0 var(--page-pad);
  color: var(--ink);
  font: 900 clamp(.92rem, 1.3vw, 1.15rem)/1 var(--sans);
  letter-spacing: -.08em;
  text-decoration: none;
  transform: rotate(-2deg);
}
.wordmark span { padding: 2px 3px; background: var(--ink); color: var(--white); }
.wordmark span:last-child { background: var(--acid); color: var(--ink); }
.site-nav { display: flex; align-items: stretch; border-left: var(--line); }
.site-nav a {
  display: grid;
  place-items: center;
  min-width: 112px;
  padding: 0 18px;
  border-right: var(--line);
  font: 500 .66rem/1.1 var(--mono);
  letter-spacing: .04em;
  text-decoration: none;
  text-transform: uppercase;
}
.site-nav a:hover, .site-nav a:focus-visible { background: var(--pink); }
.site-nav .nav-action { min-width: 174px; background: var(--ink); color: var(--white); }
.site-nav .nav-action:hover, .site-nav .nav-action:focus-visible { background: var(--blue); }

.issue-tape {
  position: relative;
  z-index: 10;
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  align-items: center;
  min-height: 36px;
  padding: 7px var(--page-pad);
  border-bottom: var(--line);
  background: var(--acid);
  font: 500 .58rem/1.3 var(--mono);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.issue-tape span:nth-child(2) { text-align: center; }
.issue-tape a { justify-self: end; text-underline-offset: 4px; }
.issue-tape a:first-child { justify-self: start; }

.eyebrow, .section-index, .project-kicker, .call-status {
  margin: 0;
  font: 500 .64rem/1.45 var(--mono);
  letter-spacing: .11em;
  text-transform: uppercase;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 50px;
  padding: 14px 18px;
  border: var(--line);
  font: 500 .7rem/1 var(--mono);
  letter-spacing: .04em;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 6px 6px 0 var(--pink);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.button:hover, .button:focus-visible { transform: translate(3px, 3px); box-shadow: 3px 3px 0 var(--pink); }
.button-dark { background: var(--ink); color: var(--white); }
.button-acid { background: var(--acid); color: var(--ink); }
.text-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  font: 500 .7rem/1.3 var(--mono);
  text-underline-offset: 6px;
  text-transform: uppercase;
}
.text-link-light { color: var(--white); }

.hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(420px, .9fr);
  min-height: calc(100svh - 101px);
  border-bottom: var(--line);
  background:
    linear-gradient(rgba(16,16,16,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,16,16,.055) 1px, transparent 1px),
    var(--cyan);
  background-size: 34px 34px;
}
.hero::before {
  content: "TIME / IS / OFFERED";
  position: absolute;
  z-index: -1;
  left: 2.5%;
  bottom: -2.2vw;
  color: rgba(16,16,16,.055);
  font: 900 clamp(7rem, 18vw, 20rem)/.7 var(--sans);
  letter-spacing: -.1em;
  white-space: nowrap;
}
.binder-holes {
  position: absolute;
  z-index: 4;
  top: 5%;
  bottom: 5%;
  left: 10px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}
.binder-holes i { width: 10px; height: 10px; border: 1px solid var(--ink); border-radius: 50%; background: var(--paper); box-shadow: inset 2px 2px 0 rgba(0,0,0,.18); }
.hero-copy {
  position: relative;
  z-index: 2;
  display: grid;
  align-content: center;
  padding: 68px 40px 64px var(--page-pad);
}
.hero-copy .eyebrow { width: max-content; padding: 7px 10px; border: var(--line); background: var(--paper); }
.hero h1 {
  max-width: 820px;
  margin: 24px 0 30px;
  font-size: clamp(4.2rem, 7.45vw, 8.7rem);
  font-weight: 900;
  line-height: .76;
  letter-spacing: -.095em;
}
.hero h1 em {
  padding: 0 .045em .02em;
  background: var(--acid);
  color: var(--ink);
  font-style: normal;
  box-shadow: .075em .075em 0 var(--pink);
}
.hero-deck { max-width: 690px; margin: 0; font: 400 clamp(.83rem, 1vw, .98rem)/1.65 var(--mono); }
.hero-actions { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; margin-top: 30px; }
.hero-index {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 760px;
  margin: 42px 0 0;
  border-top: var(--line);
  border-left: var(--line);
  background: rgba(243,239,230,.58);
}
.hero-index div { min-width: 0; padding: 11px 12px; border-right: var(--line); border-bottom: var(--line); }
.hero-index dt { margin-bottom: 5px; font: 500 .54rem/1.2 var(--mono); opacity: .58; }
.hero-index dd { margin: 0; font: 650 .72rem/1.3 var(--sans); letter-spacing: -.02em; }

.hero-stage-wrap {
  position: relative;
  z-index: 2;
  align-self: center;
  width: min(94%, 720px);
  margin: 35px auto 35px 0;
  border: var(--line);
  background: var(--paper);
  box-shadow: 17px 19px 0 var(--pink), 32px 36px 0 var(--ink);
  transform: rotate(-1.2deg);
}
.stage-window-head, .stage-window-foot {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  font: 500 .54rem/1 var(--mono);
  letter-spacing: .08em;
}
.stage-window-head { border-bottom: var(--line); }
.stage-window-foot { border-top: var(--line); }
.stage-window-foot strong { font-weight: 500; }
.sculpture-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 1.1;
  overflow: hidden;
  cursor: grab;
  background:
    repeating-conic-gradient(from 0deg at 58% 42%, var(--pink) 0 10deg, var(--blue) 10deg 20deg, var(--cyan) 20deg 31deg, var(--orange) 31deg 42deg),
    var(--blue);
  touch-action: pan-y;
}
.sculpture-wrap::after { content: ""; position: absolute; inset: 16%; z-index: 1; background: rgba(243,239,230,.64); border: var(--line); transform: rotate(7deg); }
.sculpture-wrap:active { cursor: grabbing; }
.voxel-canvas, .voxel-fallback { position: absolute; inset: 8%; width: 84%; height: 84%; }
.voxel-canvas { z-index: 4; opacity: 0; transition: opacity .4s ease; }
.sculpture-wrap.is-webgl .voxel-canvas { opacity: 1; }
.voxel-fallback { z-index: 3; object-fit: contain; image-rendering: pixelated; transform: rotate(-3deg); transition: opacity .3s ease; }
.sculpture-wrap.is-webgl .voxel-fallback { opacity: 0; }
.orbit { position: absolute; z-index: 2; left: 50%; top: 50%; width: 82%; aspect-ratio: 1; translate: -50% -50%; border: 2px solid rgba(16,16,16,.32); border-radius: 50%; transform: rotateX(68deg) rotateZ(19deg); }
.orbit-b { width: 61%; border-style: dashed; transform: rotateX(72deg) rotateZ(-38deg); }
.time-marker {
  position: absolute;
  z-index: 5;
  display: grid;
  gap: 2px;
  min-width: 70px;
  padding: 8px 9px;
  border: var(--line);
  background: var(--paper);
  font: 500 .5rem/1.1 var(--mono);
  letter-spacing: .05em;
  text-align: center;
  box-shadow: 4px 4px 0 var(--ink);
  pointer-events: none;
}
.time-marker b { font: 900 1.45rem/.85 var(--sans); letter-spacing: -.08em; }
.time-marker-15 { left: 18px; top: 18px; background: var(--acid); transform: rotate(-5deg); }
.time-marker-30 { right: 18px; top: 18px; background: var(--pink); transform: rotate(4deg); }
.time-marker-60 { right: 18px; top: 46%; background: var(--orange); transform: rotate(-3deg); }
.time-marker-rest { left: 18px; bottom: 18px; background: var(--paper); transform: rotate(3deg); }
.remix-button {
  position: absolute;
  z-index: 6;
  right: 16px;
  bottom: 15px;
  display: flex;
  gap: 18px;
  padding: 10px 12px;
  border: var(--line);
  border-radius: 0;
  background: var(--paper);
  color: var(--ink);
  font: 500 .58rem/1 var(--mono);
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: 4px 4px 0 var(--ink);
}
.remix-button:hover, .remix-button:focus-visible { background: var(--acid); }

.current-files {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 100px var(--page-pad) 120px;
  border-bottom: var(--line);
  background: var(--paper);
}
.current-files::after {
  content: "NOW";
  position: absolute;
  z-index: -1;
  right: -3vw;
  top: 3vw;
  color: rgba(16,16,16,.045);
  font: 900 clamp(10rem, 25vw, 29rem)/.7 var(--sans);
  letter-spacing: -.12em;
}
.current-head { color: var(--ink); }
.current-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 2.5vw, 38px);
}
.current-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 570px;
  padding: clamp(25px, 3vw, 40px);
  border: var(--line);
  color: var(--ink);
  text-decoration: none;
  box-shadow: 10px 12px 0 var(--ink);
  transition: transform .2s ease, box-shadow .2s ease;
}
.current-card:hover, .current-card:focus-visible { transform: translate(5px, 6px) rotate(0); box-shadow: 5px 6px 0 var(--ink); }
.current-card::after {
  position: absolute;
  right: 14px;
  bottom: 46px;
  color: rgba(16,16,16,.1);
  font: 900 clamp(5rem, 9vw, 10rem)/.7 var(--sans);
  letter-spacing: -.1em;
}
.current-issue { background: var(--cyan); transform: rotate(-1.2deg); }
.current-issue::after { content: "02"; }
.current-start { background: var(--orange); transform: rotate(1deg); }
.current-start::after { content: "01"; }
.current-market { background: var(--acid); transform: rotate(-.5deg); }
.current-market::after { content: "06"; }
.current-tab {
  position: absolute;
  left: 22px;
  top: -28px;
  padding: 9px 11px;
  border: var(--line);
  border-bottom: 0;
  background: inherit;
  font: 500 .54rem/1 var(--mono);
  letter-spacing: .07em;
}
.current-meta { display: flex; justify-content: space-between; gap: 14px; padding-bottom: 12px; border-bottom: var(--line); font: 500 .52rem/1.3 var(--mono); }
.current-card > p { margin: 34px 0 14px; font: 500 .58rem/1.35 var(--mono); letter-spacing: .08em; }
.current-card h3 { max-width: 9ch; margin: 0; font-size: clamp(3rem, 4.6vw, 5.5rem); font-weight: 900; line-height: .78; letter-spacing: -.085em; overflow-wrap: anywhere; }
.current-card blockquote { max-width: 37ch; margin: 32px 0; font: 400 .76rem/1.6 var(--mono); }
.current-card > b { position: relative; z-index: 2; margin-top: auto; padding-top: 16px; border-top: var(--line); font: 500 .6rem/1.3 var(--mono); letter-spacing: .06em; }

.proof { padding: 94px var(--page-pad) 110px; border-bottom: var(--line); background: var(--ink); color: var(--white); }
.section-head { display: grid; grid-template-columns: 1.25fr .75fr; column-gap: 50px; align-items: end; margin-bottom: 50px; }
.section-head .section-index { grid-column: 1 / -1; margin-bottom: 14px; }
.section-head h2 { margin: 0; font-size: clamp(4rem, 8vw, 9rem); font-weight: 900; line-height: .76; letter-spacing: -.09em; }
.section-head > p:last-child { align-self: end; max-width: 470px; margin: 0 0 4px; font: 400 .82rem/1.65 var(--mono); }
.proof-ledger { display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(330px, .84fr); gap: 26px; }
.project { position: relative; overflow: hidden; min-width: 0; border: 1px solid var(--white); }
.project-number { position: absolute; right: 18px; top: 14px; font: 900 clamp(2.4rem, 5vw, 5.5rem)/.85 var(--sans); letter-spacing: -.08em; opacity: .18; }
.project h3 { margin: 0; font-size: clamp(3.4rem, 6.5vw, 7.3rem); font-weight: 900; line-height: .78; letter-spacing: -.09em; }
.project p:not(.project-kicker) { margin: 0; font: 400 .77rem/1.6 var(--mono); }
.project a { width: max-content; font: 500 .66rem/1.3 var(--mono); text-underline-offset: 5px; text-transform: uppercase; }
.project-tone {
  grid-row: span 2;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .75fr);
  min-height: 700px;
  padding: clamp(26px, 4vw, 58px);
  background: var(--paper);
  color: var(--ink);
  box-shadow: 10px 12px 0 var(--pink);
}
.project-copy { position: relative; z-index: 2; display: grid; align-content: start; gap: 24px; }
.project-tone h3 { max-width: 6ch; }
.project-tone dl { display: grid; gap: 0; margin: 8px 0; border-top: var(--line); }
.project-tone dl div { display: grid; grid-template-columns: 90px 1fr; gap: 16px; padding: 12px 0; border-bottom: var(--line); }
.project-tone dt { font: 500 .56rem/1.4 var(--mono); opacity: .58; }
.project-tone dd { margin: 0; font: 650 .74rem/1.4 var(--sans); }
.tone-object { position: relative; align-self: center; aspect-ratio: 1; transform: rotate(7deg); }
.tone-object i { position: absolute; inset: 8%; border: var(--line); background: var(--pink); }
.tone-object i:nth-child(2) { inset: 17%; background: var(--cyan); transform: rotate(19deg); }
.tone-object i:nth-child(3) { inset: 27%; background: var(--blue); transform: rotate(-18deg); }
.tone-object i:nth-child(4) { inset: 38%; background: var(--acid); transform: rotate(5deg); }
.tone-object span { position: absolute; z-index: 2; inset: 0; display: grid; place-items: center; font: 900 clamp(4rem, 8vw, 8rem)/1 var(--sans); letter-spacing: -.1em; }
.project-pointcast, .project-rally { display: grid; align-content: start; gap: 18px; min-height: 337px; padding: 30px; }
.project-pointcast { background: var(--blue); color: var(--white); }
.project-rally { background: var(--acid); color: var(--ink); }
.project-pointcast h3, .project-rally h3 { font-size: clamp(3.5rem, 5vw, 6rem); }
.pointcast-signal { position: absolute; right: -4%; bottom: -18%; width: 47%; aspect-ratio: 1; border: 1px solid currentColor; transform: rotate(15deg); opacity: .22; }
.pointcast-signal span { position: absolute; inset: 0; display: grid; place-items: center; font: 900 6rem/1 var(--sans); }
.pointcast-signal i { position: absolute; inset: 14%; border: 1px solid currentColor; }
.pointcast-signal i:nth-child(3) { inset: 28%; }
.pointcast-signal i:nth-child(4) { inset: 42%; }
.rally-rings { position: absolute; right: -5%; bottom: -26%; width: 54%; aspect-ratio: 1; display: grid; place-items: center; }
.rally-rings i { position: absolute; inset: 0; border: 1px solid var(--ink); border-radius: 50%; opacity: .24; }
.rally-rings i:nth-child(2) { inset: 16%; }
.rally-rings i:nth-child(3) { inset: 32%; }
.rally-rings span { font: 900 1.3rem/1 var(--sans); }

.tone-review-band {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  min-height: 690px;
  border-bottom: var(--line);
  background: var(--paper);
  color: var(--ink);
}
.tone-review-image {
  position: relative;
  display: block;
  overflow: hidden;
  min-height: 100%;
  border-right: var(--line);
  background: var(--yellow);
}
.tone-review-image img { width: 100%; height: 100%; object-fit: cover; transition: transform 220ms ease; }
.tone-review-image:hover img, .tone-review-image:focus-visible img { transform: scale(1.018); }
.tone-review-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(45px, 7vw, 100px); }
.tone-review-copy h2 { margin: 18px 0 30px; font-size: clamp(4rem, 7.5vw, 8.8rem); font-weight: 900; line-height: .76; letter-spacing: -.095em; }
.tone-review-copy h2 em { color: var(--blue); font-style: normal; }
.tone-review-copy > p:last-of-type { max-width: 520px; margin: 0; font: 400 .8rem/1.65 var(--mono); }
.tone-review-actions { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 34px; }
.tone-review-actions > a:last-child { font: 500 .62rem/1.35 var(--mono); text-transform: uppercase; }

.signals-window {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(430px, 1.18fr);
  gap: clamp(54px, 8vw, 130px);
  align-items: center;
  overflow: hidden;
  padding: 104px var(--page-pad) 122px;
  border-bottom: var(--line);
  background:
    linear-gradient(rgba(16,16,16,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,16,16,.055) 1px, transparent 1px),
    var(--orange);
  background-size: 31px 31px;
}
.signals-window::after {
  content: "LOCAL";
  position: absolute;
  z-index: -1;
  left: -2vw;
  bottom: -3.2vw;
  color: rgba(16,16,16,.07);
  font: 900 clamp(9rem, 24vw, 28rem)/.7 var(--sans);
  letter-spacing: -.11em;
}
.signals-copy { position: relative; z-index: 2; }
.signals-copy h2 {
  margin: 18px 0 32px;
  font-size: clamp(4.6rem, 8vw, 9rem);
  font-weight: 900;
  line-height: .75;
  letter-spacing: -.095em;
}
.signals-copy h2 em { color: var(--blue); font-style: normal; }
.signals-copy > p:last-of-type {
  max-width: 520px;
  margin: 0;
  font: 400 .8rem/1.65 var(--mono);
}
.signals-actions { display: grid; gap: 22px; justify-items: start; margin-top: 32px; }
.signals-actions > span { font: 500 .54rem/1.5 var(--mono); letter-spacing: .08em; }
.signals-object {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  min-height: 610px;
  padding: 24px;
  border: var(--line);
  background: var(--ink);
  color: var(--white);
  text-decoration: none;
  box-shadow: 14px 16px 0 var(--cyan), 27px 31px 0 var(--blue);
  transform: rotate(1deg);
  transition: transform .2s ease, box-shadow .2s ease;
}
.signals-object:hover, .signals-object:focus-visible {
  transform: translate(5px, 6px) rotate(0);
  box-shadow: 8px 9px 0 var(--cyan), 16px 19px 0 var(--blue);
}
.signals-object-label {
  position: absolute;
  left: 20px;
  top: -30px;
  padding: 9px 12px;
  border: var(--line);
  border-bottom: 0;
  background: var(--cyan);
  color: var(--ink);
  font: 500 .55rem/1 var(--mono);
  letter-spacing: .08em;
}
.signals-object svg { grid-column: 1 / -1; width: min(100%, 560px); margin: 0 auto -8px; overflow: visible; }
.signals-object strong { max-width: 28ch; font: 800 clamp(1.15rem, 2vw, 2rem)/1 var(--sans); letter-spacing: -.05em; }
.signals-object > b { font: 500 .55rem/1.4 var(--mono); text-align: right; }
.signal-ring { fill: none; stroke-linecap: square; stroke-width: 10; }
.ring-one { stroke: var(--pink); }
.ring-two { stroke: var(--cyan); }
.ring-three { stroke: var(--acid); }
.signal-dish { fill: var(--acid); stroke: var(--white); stroke-width: 3; }
.signal-arm, .signal-mast, .signal-ground { fill: none; stroke: var(--white); stroke-width: 10; }
.signal-feed { fill: var(--pink); stroke: var(--white); stroke-width: 4; }
.signal-node { stroke: var(--white); stroke-width: 3; }
.node-a { fill: var(--pink); }
.node-b { fill: var(--cyan); }
.node-c { fill: var(--acid); }

.market-window {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(480px, 1.18fr);
  align-items: center;
  gap: clamp(55px, 8vw, 125px);
  min-height: 780px;
  padding: 105px var(--page-pad) 120px;
  border-bottom: var(--line);
  background:
    linear-gradient(rgba(16,16,16,.065) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,16,16,.065) 1px, transparent 1px),
    var(--cyan);
  background-size: 34px 34px;
}
.market-window::before {
  content: "MARKET";
  position: absolute;
  z-index: -1;
  right: -3vw;
  bottom: -5vw;
  color: rgba(16,16,16,.06);
  font: 900 clamp(9rem, 23vw, 27rem)/.7 var(--sans);
  letter-spacing: -.11em;
}
.market-copy { display: grid; align-content: center; justify-items: start; }
.market-copy h2 { margin: 22px 0 30px; font-size: clamp(4.2rem, 7.3vw, 8.2rem); font-weight: 900; line-height: .75; letter-spacing: -.1em; }
.market-copy h2 em { color: var(--blue); font-style: normal; }
.market-copy > p:not(.section-index) { max-width: 610px; margin: 0 0 32px; font: 400 .8rem/1.65 var(--mono); }
.market-board {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 540px;
  border: var(--line);
  background: var(--paper);
  color: var(--ink);
  text-decoration: none;
  box-shadow: 14px 16px 0 var(--blue), 27px 31px 0 var(--ink);
  transform: rotate(1.2deg);
  transition: transform .2s ease, box-shadow .2s ease;
}
.market-board:hover, .market-board:focus-visible { transform: translate(7px, 8px) rotate(0); box-shadow: 7px 8px 0 var(--blue), 14px 16px 0 var(--ink); }
.market-board > span { display: flex; flex-direction: column; justify-content: space-between; min-height: 220px; padding: clamp(20px, 2.4vw, 32px); border-right: var(--line); border-bottom: var(--line); }
.market-board > span:nth-child(2n) { border-right: 0; }
.market-board small { font: 500 .58rem/1 var(--mono); letter-spacing: .1em; }
.market-board strong { font: 900 clamp(1.55rem, 2.7vw, 3.1rem)/.9 var(--sans); letter-spacing: -.065em; }
.market-job { background: var(--pink); }
.market-task { background: var(--blue); color: var(--white); }
.market-org { background: var(--orange); }
.market-token { background: var(--ink); color: var(--acid); }
.market-board > b { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; min-height: 68px; padding: 0 22px; font: 500 .61rem/1 var(--mono); letter-spacing: .06em; }

.services-window {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(450px, 1.1fr);
  gap: clamp(50px, 8vw, 120px);
  padding: 110px var(--page-pad) 125px;
  border-bottom: var(--line);
  background: var(--orange);
}
.services-window::before { content: "SERVICES"; position: absolute; z-index: -1; left: -1%; bottom: -4%; color: rgba(16,16,16,.075); font: 900 clamp(9rem, 24vw, 27rem)/.7 var(--sans); letter-spacing: -.11em; }
.services-copy { display: grid; align-content: center; justify-items: start; }
.services-copy h2 { margin: 22px 0 30px; font-size: clamp(4rem, 7.2vw, 8rem); font-weight: 900; line-height: .76; letter-spacing: -.095em; }
.services-copy h2 em { color: var(--blue); font-style: normal; }
.services-copy > p:not(.section-index) { max-width: 650px; margin: 0 0 32px; font: 400 .82rem/1.65 var(--mono); }
.starter-file {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 650px;
  padding: clamp(31px, 4vw, 56px);
  border: var(--line);
  background:
    linear-gradient(rgba(16,16,16,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,16,16,.045) 1px, transparent 1px),
    var(--paper);
  background-size: 25px 25px;
  color: var(--ink);
  text-decoration: none;
  box-shadow: 14px 16px 0 var(--pink), 27px 31px 0 var(--ink);
  transform: rotate(1.5deg);
  transition: transform .2s ease, box-shadow .2s ease;
}
.starter-file:hover, .starter-file:focus-visible { transform: translate(7px, 8px) rotate(0); box-shadow: 7px 8px 0 var(--pink), 14px 16px 0 var(--ink); }
.starter-tab { position: absolute; left: 25px; top: -30px; padding: 10px 13px; border: var(--line); border-bottom: 0; background: var(--acid); font: 500 .58rem/1 var(--mono); letter-spacing: .08em; }
.starter-meta { display: grid; grid-template-columns: repeat(3, 1fr); border-top: var(--line); border-left: var(--line); }
.starter-meta span { padding: 10px; border-right: var(--line); border-bottom: var(--line); font: 500 .52rem/1.2 var(--mono); }
.starter-file > strong { margin: 55px 0 26px; font-size: clamp(4.2rem, 7vw, 8rem); font-weight: 900; line-height: .73; letter-spacing: -.1em; }
.starter-file > strong span { font-size: .42em; letter-spacing: -.05em; }
.starter-file > p { max-width: 620px; margin: 0; font: 400 .78rem/1.65 var(--mono); }
.starter-file ul { display: grid; gap: 10px; margin: 30px 0; padding: 0; list-style: none; font: 500 .67rem/1.35 var(--mono); text-transform: uppercase; }
.starter-file li::before { content: "✓"; display: inline-grid; place-items: center; width: 18px; height: 18px; margin-right: 8px; border: var(--line); background: var(--cyan); font-weight: 700; }
.starter-file b { margin-top: auto; padding-top: 20px; border-top: var(--line); font: 500 .65rem/1.3 var(--mono); letter-spacing: .08em; }

.open-calls { padding: 100px var(--page-pad) 120px; border-bottom: var(--line); background: var(--ink); color: var(--white); }
.section-head-light h2 { max-width: 1000px; }
.top-coder-call { position: relative; isolation: isolate; display: grid; grid-template-columns: 1fr auto; gap: 14px 30px; overflow: hidden; margin: 0 0 26px; padding: clamp(27px, 4vw, 52px); border: 1px solid var(--white); background: var(--acid); color: var(--ink); text-decoration: none; box-shadow: 10px 10px 0 var(--blue); }
.top-coder-call::after { content: "{ }"; position: absolute; z-index: -1; right: 3%; bottom: -24%; color: var(--pink); font: 900 clamp(10rem, 23vw, 25rem)/1 var(--sans); letter-spacing: -.13em; transform: rotate(-7deg); }
.top-coder-call > span { grid-column: 1 / -1; font: 700 .58rem/1 var(--mono); letter-spacing: .09em; }
.top-coder-call strong { font-size: clamp(4.6rem, 10vw, 11rem); font-weight: 900; line-height: .72; letter-spacing: -.1em; }
.top-coder-call p { align-self: end; max-width: 470px; margin: 0; font: 600 .67rem/1.55 var(--mono); }
.top-coder-call b { grid-column: 1 / -1; margin-top: 20px; font: 700 .62rem/1 var(--mono); }
.top-coder-call:hover, .top-coder-call:focus-visible { background: var(--pink); box-shadow: 10px 10px 0 var(--acid); }
.call-grid { display: grid; grid-template-columns: 1.14fr .86fr; gap: 26px; }
.call-card { position: relative; overflow: hidden; min-height: 500px; padding: clamp(28px, 4vw, 54px); border: 1px solid var(--white); }
.call-card h3 { max-width: 820px; margin: 30px 0 25px; font-size: clamp(3.2rem, 5.7vw, 6.5rem); font-weight: 900; line-height: .79; letter-spacing: -.085em; }
.call-card > p:not(.call-status) { max-width: 610px; margin: 0; font: 400 .78rem/1.6 var(--mono); }
.call-status { display: flex; align-items: center; gap: 9px; }
.call-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 6px rgba(22,187,91,.13); }
.call-halation { background: var(--acid); color: var(--ink); }
.call-halation::after { content: "H"; position: absolute; right: -4%; bottom: -18%; color: rgba(56,85,239,.12); font: 900 26rem/1 var(--sans); }
.call-actions { position: relative; z-index: 2; display: flex; align-items: center; gap: 26px; flex-wrap: wrap; margin-top: 34px; }
.call-playlist { display: flex; flex-direction: column; background: var(--paper); color: var(--ink); text-decoration: none; box-shadow: 10px 12px 0 var(--pink); }
.call-playlist h3 { margin-top: auto; font-size: clamp(3rem, 4.6vw, 5.3rem); }
.call-playlist small { margin: 25px 0 20px; padding: 11px; border: var(--line); background: var(--pink); font: 500 .55rem/1.35 var(--mono); }
.call-playlist b { padding-top: 17px; border-top: var(--line); font: 500 .63rem/1.35 var(--mono); }
.record { position: absolute; right: 28px; top: 28px; width: 115px; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: var(--ink); transition: transform .6s ease; }
.call-playlist:hover .record, .call-playlist:focus-visible .record { transform: rotate(60deg); }
.record::before { content: ""; width: 38%; aspect-ratio: 1; border-radius: 50%; background: var(--cyan); }
.record i { position: absolute; inset: 17%; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; }
.record span { position: absolute; width: 26%; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: var(--acid); font: 500 .42rem/1 var(--mono); text-align: center; }

.entrances { padding: 95px var(--page-pad) 110px; border-bottom: var(--line); background: var(--paper); }
.entrances-head { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 18px 45px; margin-bottom: 36px; }
.entrances-head .section-index { grid-column: 1 / -1; }
.entrances-head h2 { margin: 0; font-size: clamp(3.4rem, 6vw, 7rem); line-height: .8; letter-spacing: -.085em; }
.entrances-head > p:last-child { max-width: 360px; margin: 0; font: 400 .72rem/1.55 var(--mono); }
.entrance-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: var(--line); border-left: var(--line); }
.entrance { position: relative; display: flex; flex-direction: column; min-height: 430px; padding: 22px; border-right: var(--line); border-bottom: var(--line); color: var(--ink); text-decoration: none; transition: background .18s ease, color .18s ease; }
.entrance > span { font: 500 .58rem/1 var(--mono); }
.entrance strong { margin-top: auto; font-size: clamp(4rem, 6.5vw, 7.5rem); line-height: .72; letter-spacing: -.1em; }
.entrance p { max-width: 260px; margin: 17px 0 0; font: 400 .68rem/1.45 var(--mono); }
.entrance b { position: absolute; right: 20px; top: 14px; font-size: 1.7rem; }
.entrance::before, .entrance::after { content: ""; position: absolute; left: 50%; top: 36%; width: 40%; aspect-ratio: 1; translate: -50% -50%; border: var(--line); background: var(--pink); transform: rotate(11deg); }
.entrance::after { width: 30%; background: var(--acid); transform: rotate(-7deg); }
.entrance-made::before { background: var(--orange); transform: translate(-18px, 8px) rotate(-10deg); }
.entrance-made::after { background: var(--blue); transform: translate(15px, -10px) rotate(8deg); }
.entrance-play::before { border-radius: 50%; background: transparent; transform: none; }
.entrance-play::after { width: 18%; border-radius: 50%; background: var(--blue); transform: none; box-shadow: 0 0 0 30px var(--acid); }
.entrance:hover, .entrance:focus-visible { background: var(--ink); color: var(--white); }

.worktable { padding: 100px var(--page-pad) 120px; border-bottom: var(--line); background: var(--pink); }
.worktable-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; margin-bottom: 44px; }
.worktable-head h2 { margin: 13px 0 0; font-size: clamp(3.5rem, 6.3vw, 7.2rem); line-height: .8; letter-spacing: -.085em; }
.home-made-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 2vw, 28px); }
.home-made-card, .made-placeholder { min-width: 0; }
.home-made-poster, .made-placeholder {
  display: grid;
  align-content: space-between;
  min-height: 480px;
  padding: clamp(18px, 2.2vw, 30px);
  border: var(--line);
  background: var(--acid);
  color: var(--ink);
  box-shadow: 8px 9px 0 var(--ink);
}
.home-made-card:nth-child(2) .home-made-poster { background: var(--blue); color: var(--white); }
.home-made-card:nth-child(3) .home-made-poster { background: var(--ink); color: var(--white); }
.home-made-poster img { width: 64%; align-self: center; justify-self: center; border: var(--line); image-rendering: pixelated; }
.home-made-poster strong, .made-placeholder strong { max-width: 95%; font-size: clamp(2rem, 3.4vw, 4rem); font-weight: 900; line-height: .82; letter-spacing: -.075em; text-transform: uppercase; overflow-wrap: anywhere; }
.home-made-poster span, .made-placeholder span { font: 500 .58rem/1 var(--mono); letter-spacing: .09em; }
.home-made-meta { display: flex; justify-content: space-between; padding: 17px 2px 0; font: 500 .6rem/1.35 var(--mono); text-transform: uppercase; }
.home-made-action { display: flex; justify-content: space-between; gap: 12px; margin-top: 12px; padding: 10px 2px 0; border-top: var(--line); font: 500 .58rem/1.3 var(--mono); text-transform: uppercase; }
.home-made-action a { text-underline-offset: 3px; }
.made-placeholder-alt { background: var(--blue); color: var(--white); transform: rotate(1.4deg); }
.made-placeholder-dark { background: var(--ink); color: var(--white); transform: rotate(-1deg); }

.closing {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 700px;
  padding: 105px var(--page-pad) 125px;
  border-bottom: var(--line);
  background: var(--blue);
  color: var(--white);
}
.closing::after { content: ""; position: absolute; z-index: -1; right: -8%; bottom: -45%; width: 58vw; aspect-ratio: 1; border: 2px solid rgba(255,255,255,.2); border-radius: 50%; box-shadow: 0 0 0 70px rgba(255,255,255,.04), 0 0 0 140px rgba(255,255,255,.035), 0 0 0 210px rgba(255,255,255,.03); }
.closing > p { margin: 0 0 30px; font: 500 .62rem/1 var(--mono); letter-spacing: .12em; }
.closing h2 { margin: 0 0 48px; font-size: clamp(5rem, 10vw, 11.5rem); line-height: .75; letter-spacing: -.1em; }
.closing h2 em { color: var(--acid); font-style: normal; }
.closing-actions { display: flex; align-items: center; gap: 30px; flex-wrap: wrap; }

.site-footer { display: grid; grid-template-columns: 1.4fr .55fr .55fr; gap: 45px; padding: 72px var(--page-pad) 40px; background: var(--ink); color: var(--white); }
.footer-intro { display: grid; align-content: start; gap: 24px; }
.footer-mark { padding: 0; color: var(--white); }
.footer-intro p { max-width: 460px; margin: 0; font: 400 .72rem/1.6 var(--mono); }
.site-footer nav { display: flex; flex-direction: column; gap: 11px; font: 400 .65rem/1.3 var(--mono); text-transform: uppercase; }
.site-footer nav strong { margin-bottom: 5px; color: var(--acid); font-weight: 500; letter-spacing: .09em; }
.site-footer a { text-underline-offset: 4px; }
.footer-note { grid-column: 1 / -1; margin: 20px 0 0; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.22); font: 400 .58rem/1 var(--mono); letter-spacing: .1em; }
.site-footer > [data-pointcast-network] { grid-column: 1 / -1; min-width: 0; margin-top: 35px; }

@media (max-width: 1120px) {
  .site-nav a { min-width: 96px; }
  .site-nav .nav-action { min-width: 150px; }
  .hero { grid-template-columns: minmax(0, 1fr) minmax(380px, .85fr); }
  .hero h1 { font-size: clamp(4.5rem, 8.8vw, 8rem); }
  .project-tone { grid-template-columns: 1fr; }
  .tone-object { position: absolute; right: -3%; bottom: -8%; width: 47%; opacity: .36; }
  .project-copy { max-width: 82%; }
}

@media (max-width: 900px) {
  .site-head { grid-template-columns: 1fr; }
  .wordmark { min-height: 58px; }
  .site-nav { overflow-x: auto; border-top: var(--line); border-left: 0; }
  .site-nav a { flex: 1 0 auto; min-height: 44px; }
  .issue-tape { grid-template-columns: 1fr auto; }
  .issue-tape span:nth-child(2) { display: none; }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero-copy { padding: 64px var(--page-pad) 35px; }
  .hero-stage-wrap { width: min(82%, 700px); margin: 10px auto 70px; }
  .hero-index { max-width: none; }
  .current-grid { grid-template-columns: 1fr; gap: 52px; }
  .current-card { min-height: 500px; transform: none; }
  .current-card h3 { font-size: clamp(3.8rem, 10vw, 6.8rem); }
  .section-head { grid-template-columns: 1fr; }
  .section-head > p:last-child { margin-top: 25px; }
  .proof-ledger { grid-template-columns: 1fr; }
  .tone-review-band { grid-template-columns: 1fr; }
  .tone-review-image { min-height: 58vw; border-right: 0; border-bottom: var(--line); }
  .signals-window { grid-template-columns: 1fr; }
  .signals-object { width: min(88%, 760px); justify-self: center; }
  .project-tone { grid-row: auto; min-height: 590px; }
  .project-pointcast, .project-rally { min-height: 380px; }
  .market-window { grid-template-columns: 1fr; }
  .market-board { width: min(88%, 760px); justify-self: center; }
  .services-window { grid-template-columns: 1fr; }
  .starter-file { min-height: 610px; }
  .call-grid { grid-template-columns: 1fr; }
  .call-card { min-height: 470px; }
  .entrances-head { grid-template-columns: 1fr; }
  .entrance-grid { grid-template-columns: 1fr; }
  .entrance { min-height: 360px; }
  .home-made-grid { grid-template-columns: 1fr; }
  .home-made-poster, .made-placeholder { min-height: 520px; }
}

@media (max-width: 700px) {
  :root { --page-pad: 18px; }
  .site-head { position: relative; }
  .wordmark { justify-content: flex-start; min-height: 54px; }
  .site-nav a { min-width: 84px; padding: 0 12px; font-size: .58rem; }
  .site-nav .nav-action { min-width: 132px; }
  .issue-tape { min-height: 32px; padding: 6px 12px; font-size: .5rem; }
  .issue-tape a { max-width: 145px; text-align: right; }
  .issue-tape a:first-child { text-align: left; }
  .hero { min-height: auto; }
  .binder-holes { left: 4px; }
  .binder-holes i { width: 7px; height: 7px; }
  .hero-copy { padding-top: 44px; padding-bottom: 28px; }
  .hero h1 { margin: 20px 0 25px; font-size: clamp(3.65rem, 18vw, 5.6rem); line-height: .76; }
  .hero-deck { font-size: .75rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 19px; margin-top: 26px; }
  .hero-index { grid-template-columns: 1fr; margin-top: 32px; }
  .hero-stage-wrap { width: calc(100% - 45px); margin: 8px 18px 55px 16px; box-shadow: 9px 11px 0 var(--pink), 17px 21px 0 var(--ink); }
  .stage-window-head span:last-child, .stage-window-foot span { display: none; }
  .sculpture-wrap { aspect-ratio: 1; }
  .remix-button { right: 10px; bottom: 10px; }
  .time-marker { min-width: 58px; padding: 6px; font-size: .42rem; box-shadow: 3px 3px 0 var(--ink); }
  .time-marker b { font-size: 1.08rem; }
  .time-marker-15, .time-marker-rest { left: 10px; }
  .time-marker-30, .time-marker-60 { right: 10px; }
  .time-marker-15, .time-marker-30 { top: 10px; }
  .time-marker-rest { bottom: 10px; }
  .current-files, .proof, .signals-window, .market-window, .open-calls, .entrances, .worktable { padding-top: 70px; padding-bottom: 80px; }
  .current-grid { gap: 44px; }
  .current-card { min-height: 450px; padding: 24px 21px; }
  .current-card h3 { font-size: clamp(3.4rem, 16vw, 5.3rem); overflow-wrap: anywhere; }
  .current-card blockquote { margin: 25px 0; font-size: .7rem; }
  .section-head { margin-bottom: 34px; }
  .section-head h2 { font-size: clamp(4rem, 18vw, 6.2rem); }
  .project-tone { min-height: 560px; padding: 25px; }
  .project-copy { max-width: 100%; gap: 19px; }
  .project h3 { font-size: clamp(4rem, 17vw, 6rem); }
  .tone-object { right: -12%; bottom: -6%; width: 60%; opacity: .28; }
  .project-pointcast, .project-rally { min-height: 340px; padding: 24px; }
  .tone-review-image { min-height: 72vw; }
  .tone-review-copy { padding: 64px var(--page-pad) 72px; }
  .tone-review-copy h2 { font-size: clamp(4rem, 18vw, 6.3rem); }
  .tone-review-actions { align-items: flex-start; flex-direction: column; }
  .signals-window { gap: 58px; }
  .signals-copy h2 { font-size: clamp(4rem, 18vw, 6.3rem); }
  .signals-object { width: calc(100% - 22px); min-height: 490px; padding: 18px; box-shadow: 8px 10px 0 var(--cyan), 16px 20px 0 var(--blue); }
  .signals-object strong { max-width: 19ch; }
  .signals-object > b { max-width: 120px; }
  .market-window { gap: 64px; }
  .market-copy h2 { font-size: clamp(4rem, 18vw, 6.3rem); }
  .market-board { width: calc(100% - 22px); min-height: 510px; box-shadow: 8px 10px 0 var(--blue), 16px 20px 0 var(--ink); }
  .market-board > span { min-height: 190px; padding: 18px; }
  .market-board strong { font-size: clamp(1.38rem, 7vw, 2.1rem); }
  .services-window { gap: 70px; padding-top: 75px; padding-bottom: 95px; }
  .services-copy h2 { font-size: clamp(4rem, 18vw, 6.3rem); }
  .starter-file { min-height: 590px; padding: 27px 23px; box-shadow: 8px 10px 0 var(--pink), 16px 20px 0 var(--ink); }
  .starter-meta { grid-template-columns: 1fr; }
  .starter-file > strong { margin-top: 38px; font-size: clamp(4rem, 18vw, 6rem); }
  .call-card { min-height: 440px; padding: 25px; }
  .top-coder-call { grid-template-columns: 1fr; margin-bottom: 24px; padding: 28px 24px; box-shadow: 7px 8px 0 var(--blue); }
  .top-coder-call strong { font-size: clamp(4.2rem, 21vw, 7rem); }
  .top-coder-call p { max-width: 85%; }
  .call-card h3 { margin-top: 50px; font-size: clamp(2.8rem, 12.5vw, 5.4rem); overflow-wrap: anywhere; }
  .record { width: 85px; right: 18px; top: 50px; opacity: .88; }
  .call-playlist h3 { margin-top: auto; }
  .entrances-head h2, .worktable-head h2 { font-size: clamp(3.6rem, 15vw, 5.4rem); }
  .entrance { min-height: 310px; }
  .entrance strong { font-size: clamp(4.5rem, 21vw, 7rem); }
  .worktable-head { align-items: flex-start; flex-direction: column; }
  .home-made-poster, .made-placeholder { min-height: 440px; }
  .closing { min-height: 620px; padding-top: 80px; padding-bottom: 90px; }
  .closing h2 { font-size: clamp(4.5rem, 19vw, 7rem); }
  .closing-actions { align-items: flex-start; flex-direction: column; }
  .site-footer { grid-template-columns: 1fr 1fr; gap: 40px 24px; padding-top: 55px; }
  .footer-intro { grid-column: 1 / -1; }
}

@media (max-width: 360px) {
  .hero h1 { font-size: 3.35rem; }
  .button { width: 100%; }
  .call-actions .text-link { width: auto; }
  .site-footer { grid-template-columns: 1fr; }
  .footer-intro, .footer-note, .site-footer > [data-pointcast-network] { grid-column: 1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (prefers-contrast: more) {
  :root { --line: 2px solid var(--ink); }
  .proof, .open-calls, .site-footer, .closing { --line: 2px solid var(--white); }
}

/* Public development studio homepage — August 2026 */
.homeflow .issue-tape span { justify-self: start; }
.homeflow .issue-tape a:nth-child(2) { justify-self: center; }
.homeflow .issue-tape a:last-child { justify-self: end; }

.flow-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(430px, .97fr);
  align-items: center;
  min-height: calc(100svh - 101px);
  overflow: hidden;
  border-bottom: var(--line);
  background:
    linear-gradient(rgba(16,16,16,.052) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16,16,16,.052) 1px, transparent 1px),
    var(--orange);
  background-size: 34px 34px;
}
.flow-hero::after {
  content: "GOOD / WORK";
  position: absolute;
  z-index: -1;
  left: -2vw;
  bottom: -3vw;
  color: rgba(16,16,16,.065);
  font: 900 clamp(8rem, 20vw, 23rem)/.68 var(--sans);
  letter-spacing: -.11em;
  white-space: nowrap;
}
.flow-hero-copy { position: relative; z-index: 2; padding: 75px 40px 78px var(--page-pad); }
.flow-hero-copy .eyebrow { display: inline-block; padding: 8px 10px; border: var(--line); background: var(--paper); }
.flow-hero h1 { max-width: 850px; margin: 26px 0 31px; font-size: clamp(5rem, 8.4vw, 9.7rem); font-weight: 900; line-height: .72; letter-spacing: -.105em; }
.flow-hero h1 em { display: inline-block; padding: 0 .06em .04em; background: var(--acid); color: var(--blue); font-style: normal; text-shadow: .045em .045em 0 var(--pink); transform: rotate(-1.5deg); }
.flow-hero-deck { max-width: 720px; margin: 0; font: 400 clamp(.84rem, 1.05vw, 1.02rem)/1.66 var(--mono); }
.flow-index { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 770px; margin: 43px 0 0; border-top: var(--line); border-left: var(--line); background: rgba(243,239,230,.66); }
.flow-index div { padding: 11px 12px; border-right: var(--line); border-bottom: var(--line); }
.flow-index dt { margin-bottom: 5px; font: 500 .53rem/1.2 var(--mono); letter-spacing: .08em; }
.flow-index dd { margin: 0; font: 650 .72rem/1.3 var(--sans); letter-spacing: -.02em; }
.flow-stage { margin-left: auto; margin-right: clamp(28px, 4.6vw, 84px); }
.flow-stage .sculpture-wrap { background: repeating-conic-gradient(from 18deg at 56% 46%, var(--blue) 0 12deg, var(--cyan) 12deg 23deg, var(--acid) 23deg 35deg, var(--pink) 35deg 46deg); }

.flow-section-head { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(280px, .48fr); gap: 18px 60px; align-items: end; margin-bottom: 52px; }
.flow-section-head .section-index { grid-column: 1 / -1; }
.flow-section-head h2 { margin: 0; font-size: clamp(4.5rem, 8.2vw, 9.5rem); font-weight: 900; line-height: .73; letter-spacing: -.1em; }
.flow-section-head h2 em { color: var(--blue); font-style: normal; }
.flow-section-head > p:last-child { max-width: 520px; margin: 0 0 5px; font: 400 .78rem/1.65 var(--mono); }

.alive-now { padding: 100px var(--page-pad) 124px; border-bottom: var(--line); background: var(--paper); }
.signal-deck { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(18px, 2.2vw, 34px); }
.signal-card { position: relative; display: flex; flex-direction: column; min-height: 520px; padding: clamp(24px, 3vw, 40px); border: var(--line); color: var(--ink); text-decoration: none; box-shadow: 10px 11px 0 var(--ink); transition: transform .2s ease, box-shadow .2s ease; }
.signal-card:hover, .signal-card:focus-visible { transform: translate(5px, 6px); box-shadow: 5px 5px 0 var(--ink); }
.signal-card small { margin-top: 26px; font: 500 .54rem/1.35 var(--mono); letter-spacing: .09em; }
.signal-card h3 { max-width: 11ch; margin: auto 0 21px; font-size: clamp(3.5rem, 5.8vw, 7rem); line-height: .75; letter-spacing: -.09em; }
.signal-card p { max-width: 700px; margin: 0 0 25px; font: 400 .7rem/1.58 var(--mono); }
.signal-card b { margin-top: auto; padding-top: 17px; border-top: var(--line); font: 500 .58rem/1.35 var(--mono); letter-spacing: .06em; }
.signal-card dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0 0 24px; border-top: var(--line); border-left: var(--line); }
.signal-card dl div { padding: 9px; border-right: var(--line); border-bottom: var(--line); }
.signal-card dt { margin-bottom: 4px; font: 500 .48rem/1 var(--mono); }
.signal-card dd { margin: 0; font: 650 .65rem/1.35 var(--sans); }
.signal-status { display: flex; align-items: center; gap: 8px; font: 500 .54rem/1 var(--mono); letter-spacing: .07em; }
.signal-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 6px rgba(22,187,91,.14); }
.signal-sky { grid-column: span 7; min-height: 650px; background: var(--blue); color: var(--white); transform: rotate(-.55deg); }
.signal-sky::after { content: "⌁"; position: absolute; right: 5%; top: 6%; color: var(--acid); font: 900 clamp(9rem, 18vw, 20rem)/1 var(--sans); opacity: .18; transform: rotate(-18deg); }
.signal-sky h3 { max-width: 8ch; color: var(--acid); }
.signal-sky b, .signal-sky dl, .signal-sky dl div { border-color: var(--white); }
.signal-tone { grid-column: span 5; min-height: 650px; background: var(--acid); transform: rotate(.7deg); }
.signal-tone::after { content: "◉"; position: absolute; right: 4%; top: 5%; color: var(--pink); font-size: clamp(9rem, 16vw, 18rem); opacity: .7; }
.signal-tone h3 { position: relative; z-index: 1; }
.signal-ai { grid-column: span 5; background: var(--cyan); transform: rotate(-.35deg); }
.signal-ai h3 { color: var(--blue); }
.signal-issue { grid-column: span 7; background: var(--pink); transform: rotate(.45deg); }
.signal-issue h3 { max-width: 9ch; }

.position { display: grid; grid-template-columns: minmax(340px, .7fr) minmax(600px, 1.3fr); gap: clamp(60px, 8vw, 130px); padding: 110px var(--page-pad) 130px; border-bottom: var(--line); background: var(--acid); }
.position-statement { align-self: start; position: sticky; top: 100px; }
.position-statement h2 { margin: 20px 0 32px; font-size: clamp(4.7rem, 7.6vw, 8.6rem); line-height: .73; letter-spacing: -.1em; }
.position-statement h2 em { color: var(--blue); font-style: normal; }
.position-statement > p:last-child { max-width: 620px; margin: 0; font: 400 .78rem/1.67 var(--mono); }
.position-ledger { border-top: var(--line); }
.position-ledger article { display: grid; grid-template-columns: 115px 1.25fr .85fr; gap: 26px; padding: 34px 0; border-bottom: var(--line); }
.position-ledger article > span { font: 500 .53rem/1.4 var(--mono); letter-spacing: .08em; }
.position-ledger h3 { margin: 0; font-size: clamp(2.3rem, 3.6vw, 4.3rem); line-height: .84; letter-spacing: -.07em; }
.position-ledger p { margin: 0 0 20px; font: 400 .67rem/1.58 var(--mono); }
.position-ledger nav { display: flex; flex-direction: column; gap: 8px; font: 500 .55rem/1.35 var(--mono); text-transform: uppercase; }
.position-ledger nav a { text-underline-offset: 4px; }

.ways-in { padding: 106px var(--page-pad) 126px; border-bottom: var(--line); background: var(--cyan); }
.compact-head h2 { max-width: 950px; }
.tempo-line { display: grid; grid-template-columns: repeat(5, 1fr); border-top: var(--line); border-left: var(--line); }
.tempo-line a { display: flex; flex-direction: column; min-height: 410px; padding: 22px; border-right: var(--line); border-bottom: var(--line); color: var(--ink); text-decoration: none; transition: background .18s ease, color .18s ease; }
.tempo-line a:nth-child(1) { background: var(--acid); }
.tempo-line a:nth-child(2) { background: var(--orange); }
.tempo-line a:nth-child(3) { background: var(--pink); }
.tempo-line a:nth-child(4) { background: var(--blue); color: var(--white); }
.tempo-line a:nth-child(5) { background: var(--paper); }
.tempo-line a:hover, .tempo-line a:focus-visible { background: var(--ink); color: var(--white); }
.tempo-line span { font: 900 2.1rem/.9 var(--sans); letter-spacing: -.06em; }
.tempo-line strong { margin: auto 0 14px; font-size: clamp(2.4rem, 3.6vw, 4.2rem); line-height: .78; letter-spacing: -.075em; }
.tempo-line p { margin: 0 0 25px; font: 400 .62rem/1.55 var(--mono); }
.tempo-line b { padding-top: 13px; border-top: 1px solid currentColor; font: 500 .49rem/1.4 var(--mono); letter-spacing: .05em; }

.field-atlas { padding: 108px var(--page-pad) 130px; border-bottom: var(--line); background: var(--paper); }
.field-head h2 { max-width: 1050px; }
.atlas-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 24px; }
.atlas-card { position: relative; display: flex; flex-direction: column; min-height: 550px; padding: clamp(25px, 3vw, 42px); border: var(--line); box-shadow: 10px 11px 0 var(--ink); }
.atlas-card > span { font: 500 .57rem/1.3 var(--mono); letter-spacing: .09em; }
.atlas-card h3 { max-width: 12ch; margin: auto 0 22px; font-size: clamp(3rem, 4.8vw, 5.8rem); line-height: .79; letter-spacing: -.085em; }
.atlas-card p { max-width: 650px; margin: 0 0 28px; font: 400 .69rem/1.58 var(--mono); }
.atlas-card nav { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; padding-top: 16px; border-top: var(--line); font: 500 .54rem/1.4 var(--mono); text-transform: uppercase; }
.atlas-card nav a { text-underline-offset: 4px; }
.atlas-play { grid-column: span 7; background: var(--pink); transform: rotate(-.45deg); }
.atlas-local { grid-column: span 5; background: var(--blue); color: var(--white); transform: rotate(.6deg); }
.atlas-local nav { border-color: var(--white); }
.atlas-start { grid-column: span 5; background: var(--acid); transform: rotate(.35deg); }
.atlas-exchange { grid-column: span 7; background: var(--orange); transform: rotate(-.35deg); }

.two-doors { padding: 105px var(--page-pad) 125px; border-bottom: var(--line); background: var(--ink); color: var(--white); }
.two-doors-head { display: grid; grid-template-columns: 1fr auto; gap: 20px 50px; align-items: end; margin-bottom: 46px; }
.two-doors-head .section-index { grid-column: 1 / -1; }
.two-doors-head h2 { max-width: 1100px; margin: 0; font-size: clamp(4.5rem, 8vw, 9rem); line-height: .74; letter-spacing: -.1em; }
.two-doors-head h2 em { color: var(--acid); font-style: normal; }
.door-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: 26px; }
.door-card { position: relative; display: flex; flex-direction: column; min-height: 650px; padding: clamp(28px, 4vw, 55px); border: 1px solid var(--white); }
.door-card > span { font: 500 .58rem/1.3 var(--mono); letter-spacing: .09em; }
.door-card h3 { max-width: 10ch; margin: auto 0 24px; font-size: clamp(3.8rem, 6.3vw, 7.2rem); line-height: .76; letter-spacing: -.09em; }
.door-card > p { max-width: 660px; margin: 0 0 28px; font: 400 .75rem/1.62 var(--mono); }
.door-actions { display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.door-public { background: var(--acid); color: var(--ink); box-shadow: 11px 12px 0 var(--blue); }
.door-public ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 34px 0 0; padding: 1px; background: var(--ink); list-style: none; }
.door-public li { padding: 12px; background: var(--paper); font: 500 .52rem/1.4 var(--mono); text-transform: uppercase; }
.door-client { background: var(--blue); box-shadow: 11px 12px 0 var(--pink); }
.service-stamp { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 20px; width: max-content; max-width: 100%; margin: 0 0 30px; padding: 15px; border: 1px solid var(--white); background: var(--ink); }
.service-stamp strong { color: var(--acid); font: 900 clamp(3rem, 5vw, 5.8rem)/.78 var(--sans); letter-spacing: -.09em; }
.service-stamp span { font: 500 .52rem/1.45 var(--mono); }

.editorial-shelf { padding: 108px var(--page-pad) 128px; border-bottom: var(--line); background: var(--acid); }
.editorial-grid { display: grid; grid-template-columns: 1.18fr .82fr; gap: 24px; }
.editorial-lead { grid-row: span 3; position: relative; display: flex; flex-direction: column; min-height: 760px; overflow: hidden; border: var(--line); background: var(--blue); color: var(--white); text-decoration: none; box-shadow: 10px 11px 0 var(--pink); }
.editorial-lead img { width: 100%; height: auto; aspect-ratio: 1200/630; object-fit: cover; border-bottom: var(--line); }
.editorial-lead > span { margin: 26px 28px 14px; font: 500 .56rem/1 var(--mono); letter-spacing: .09em; }
.editorial-lead > strong { max-width: 12ch; margin: auto 28px 25px; font-size: clamp(3.7rem, 6vw, 7rem); line-height: .76; letter-spacing: -.09em; }
.editorial-lead > b { margin: 0 28px 28px; padding-top: 16px; border-top: 1px solid var(--white); font: 500 .56rem/1.35 var(--mono); }
.editorial-card { display: grid; grid-template-columns: 1fr auto; gap: 12px 22px; min-height: 235px; padding: 26px; border: var(--line); color: var(--ink); text-decoration: none; box-shadow: 7px 8px 0 var(--ink); }
.editorial-card span { grid-column: 1 / -1; font: 500 .54rem/1 var(--mono); letter-spacing: .08em; }
.editorial-card strong { max-width: 12ch; align-self: end; font-size: clamp(2.1rem, 3.3vw, 3.8rem); line-height: .81; letter-spacing: -.075em; }
.editorial-card p { align-self: end; margin: 0; font: 400 .62rem/1.5 var(--mono); }
.editorial-card b { grid-column: 1 / -1; padding-top: 12px; border-top: var(--line); font: 500 .52rem/1 var(--mono); }
.editorial-collective { background: var(--pink); }
.editorial-credit { background: var(--orange); }
.editorial-ai { background: var(--cyan); }

.worktable-actions { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.flow-closing { position: relative; isolation: isolate; overflow: hidden; min-height: 720px; padding: 108px var(--page-pad) 128px; border-bottom: 1px solid var(--white); background: var(--blue); color: var(--white); }
.flow-closing::after { content: ""; position: absolute; z-index: -1; right: -7%; bottom: -48%; width: 60vw; aspect-ratio: 1; border: 2px solid rgba(255,255,255,.22); border-radius: 50%; box-shadow: 0 0 0 70px rgba(237,255,69,.07), 0 0 0 140px rgba(241,91,152,.055), 0 0 0 210px rgba(104,228,219,.045); }
.flow-closing > p { margin: 0 0 30px; font: 500 .62rem/1 var(--mono); letter-spacing: .12em; }
.flow-closing h2 { max-width: 1350px; margin: 0 0 50px; font-size: clamp(5rem, 9.6vw, 11rem); line-height: .74; letter-spacing: -.1em; }
.flow-closing h2 em { color: var(--acid); font-style: normal; }

@media (max-width: 1120px) {
  .flow-hero { grid-template-columns: minmax(0, 1fr) minmax(390px, .82fr); }
  .position { grid-template-columns: 1fr; }
  .position-statement { position: static; }
  .tempo-line { grid-template-columns: repeat(3, 1fr); }
  .position-ledger article { grid-template-columns: 105px 1fr .75fr; }
}

@media (max-width: 900px) {
  .homeflow .issue-tape { grid-template-columns: 1fr 1fr; }
  .homeflow .issue-tape a:nth-child(2) { display: none; }
  .flow-hero { grid-template-columns: 1fr; min-height: auto; }
  .flow-hero-copy { padding-top: 65px; padding-bottom: 35px; }
  .flow-stage { width: min(82%, 700px); margin: 10px auto 75px; }
  .flow-section-head { grid-template-columns: 1fr; }
  .flow-section-head > p:last-child { margin-top: 20px; }
  .signal-sky, .signal-tone, .signal-ai, .signal-issue { grid-column: span 6; min-height: 560px; }
  .position-ledger article { grid-template-columns: 90px 1fr; }
  .position-ledger article > div, .position-ledger article nav { grid-column: 2; }
  .tempo-line { grid-template-columns: 1fr 1fr; }
  .atlas-play, .atlas-local, .atlas-start, .atlas-exchange { grid-column: span 6; min-height: 520px; }
  .door-grid, .editorial-grid { grid-template-columns: 1fr; }
  .editorial-lead { grid-row: auto; min-height: 700px; }
  .two-doors-head { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .homeflow .site-nav a { min-width: 92px; }
  .homeflow .issue-tape { min-height: 36px; }
  .homeflow .issue-tape span { max-width: 175px; }
  .homeflow .issue-tape a:last-child { max-width: 155px; text-align: right; }
  .flow-hero-copy { padding: 52px var(--page-pad) 28px; }
  .flow-hero h1 { font-size: clamp(4.4rem, 21vw, 6.5rem); }
  .flow-hero-deck { font-size: .74rem; }
  .flow-index { grid-template-columns: 1fr 1fr; margin-top: 32px; }
  .flow-stage { width: calc(100% - 45px); margin: 8px 18px 62px 16px; }
  .flow-stage .time-marker b { font-size: .85rem; }
  .alive-now, .position, .ways-in, .field-atlas, .two-doors, .editorial-shelf, .worktable { padding-top: 72px; padding-bottom: 84px; }
  .flow-section-head { margin-bottom: 35px; }
  .flow-section-head h2, .position-statement h2, .two-doors-head h2 { font-size: clamp(4.2rem, 19vw, 6.4rem); }
  .signal-deck, .atlas-grid { grid-template-columns: 1fr; gap: 34px; }
  .signal-sky, .signal-tone, .signal-ai, .signal-issue, .atlas-play, .atlas-local, .atlas-start, .atlas-exchange { grid-column: 1; min-height: 500px; transform: none; }
  .signal-card h3 { font-size: clamp(3.7rem, 17vw, 5.7rem); }
  .position { gap: 55px; }
  .position-ledger article { grid-template-columns: 1fr; gap: 14px; }
  .position-ledger article > div, .position-ledger article nav { grid-column: 1; }
  .position-ledger h3 { font-size: clamp(2.8rem, 12vw, 4rem); }
  .tempo-line { grid-template-columns: 1fr; }
  .tempo-line a { min-height: 340px; }
  .tempo-line strong { font-size: clamp(3.4rem, 16vw, 5rem); }
  .atlas-card h3 { font-size: clamp(3.4rem, 15vw, 5.2rem); }
  .atlas-card nav { grid-template-columns: 1fr; }
  .door-card { min-height: 610px; padding: 28px 23px; }
  .door-card h3 { font-size: clamp(3.8rem, 17vw, 5.8rem); }
  .door-public ul { grid-template-columns: 1fr; }
  .door-actions { align-items: flex-start; flex-direction: column; }
  .service-stamp { width: 100%; }
  .editorial-lead { min-height: 610px; }
  .editorial-lead > strong { font-size: clamp(3.4rem, 15vw, 5.5rem); }
  .editorial-card { grid-template-columns: 1fr; min-height: 280px; }
  .editorial-card span, .editorial-card b { grid-column: 1; }
  .editorial-card strong { font-size: clamp(2.7rem, 12vw, 4rem); }
  .worktable-actions { align-items: flex-start; flex-direction: column; gap: 13px; }
  .flow-closing { min-height: 650px; padding-top: 82px; padding-bottom: 92px; }
  .flow-closing h2 { font-size: clamp(4.5rem, 19vw, 7rem); }
  .flow-closing .closing-actions { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 360px) {
  .flow-hero h1 { font-size: 4rem; }
  .flow-index { grid-template-columns: 1fr; }
  .door-card h3 { font-size: 3.65rem; }
}

@media (prefers-contrast: more) {
  .two-doors, .flow-closing { --line: 2px solid var(--white); }
}