@font-face{
  font-family:"Druk Wide Web";
  src:url("../DrukWide-Medium-Web.woff2") format("woff2");
  font-weight:500;
  font-style:normal;
  font-stretch:normal;
}
@font-face{
  font-family:"Druk Wide Web";
  src:url("../DrukWide-Super-Web.woff2") format("woff2");
  font-weight:900;
  font-style:normal;
  font-stretch:normal;
}
:root{
  --violet:#4801ff;
  --paper:#f2f2f2;
  --ink:#050009;
  --muted:rgba(5,0,9,.58);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{
  min-width:1120px;
  background:var(--paper);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  overflow-x:hidden;
}
body.work-page.loading{overflow:hidden}
a{color:inherit}
.topbar{
  position:fixed;
  top:0;
  left:0;
  z-index:10;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  width:100%;
  padding:5vh 60px 0;
  pointer-events:none;
}
.logo,
.back{
  pointer-events:auto;
  text-decoration:none;
}
.logo{
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-weight:500;
  font-size:40px;
  line-height:.85;
  text-transform:uppercase;
  color:var(--ink);
}
.back{
  position:relative;
  width:50px;
  height:50px;
  border:1px solid rgba(5,0,9,.35);
  border-radius:50%;
  transition:transform .25s,border-color .25s;
}
.back::before,
.back::after{
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  width:25px;
  height:2px;
  background:var(--ink);
  border-radius:1px;
}
.back::before{transform:translate(-50%,-50%) rotate(-45deg)}
.back::after{transform:translate(-50%,-50%) rotate(45deg)}
.back:hover{
  border-color:var(--ink);
  transform:scale(1.04);
}
.project{
  padding:22vh 5vw 12vh;
}
.hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,28vw);
  gap:5vw;
  align-items:end;
  min-height:62vh;
  overflow:hidden;
}
body.work-page .hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:var(--paper);
  transform:scaleY(1);
  transform-origin:center top;
  pointer-events:none;
}
body.work-page.loading .hero::after{
  transform:scaleY(1);
  animation:none;
}
body.work-page:not(.loading) .hero::after{
  animation:heroCoverOut .7s cubic-bezier(.755,.05,.855,.06) .3s forwards;
}
.hero > *{
  position:relative;
  z-index:1;
}
.kicker{
  margin:0 0 1.1rem;
  color:var(--muted);
  font-size:12px;
  letter-spacing:0;
}
h1{
  margin:0;
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:9.2vw;
  font-weight:900;
  line-height:.9;
  letter-spacing:.02em;
  text-transform:uppercase;
}
body.work-page h1{
  opacity:0;
}
body.work-page.loading h1{
  opacity:0;
  animation:none;
}
body.work-page:not(.loading) h1{
  animation:heroTitleIn 1s forwards;
}
@keyframes heroCoverIn{
  0%{transform:scaleY(0)}
  100%{transform:scaleY(1)}
}
@keyframes heroCoverOut{
  0%{transform:scaleY(1)}
  100%{transform:scaleY(0)}
}
@keyframes heroTitleOut{
  0%{opacity:1}
  100%{opacity:0}
}
@keyframes heroTitleIn{
  0%{opacity:0}
  100%{opacity:1}
}
.summary{
  max-width:30rem;
  margin:0 0 .4rem;
  font-size:20px;
  line-height:1.35;
}
.radio-project .hero{
  grid-template-columns:minmax(0,1fr);
  align-content:end;
  gap:30px;
  overflow:visible;
}
.radio-project h1{
  max-width:100%;
  font-size:clamp(74px,7.2vw,112px);
}
.radio-project .summary{
  max-width:760px;
  margin:0 0 .15rem;
  padding:18px 0 0;
  border-top:1px solid rgba(5,0,9,.22);
  border-left:0;
  color:rgba(5,0,9,.72);
  font-size:18px;
  line-height:1.78;
  text-wrap:pretty;
}
.codex-project .hero{
  grid-template-columns:minmax(0,1fr);
  align-content:end;
  gap:30px;
  overflow:visible;
}
.codex-project h1{
  max-width:100%;
  font-size:clamp(78px,7.6vw,132px);
}
.codex-project .summary{
  max-width:780px;
  margin:0 0 .2rem;
  padding:18px 0 0;
  border-top:1px solid rgba(5,0,9,.22);
  border-left:0;
  color:rgba(5,0,9,.72);
  font-size:18px;
  line-height:1.72;
  text-wrap:pretty;
}
.codex-gallery{
  display:grid;
  gap:28px;
  margin:8vh 0 10vh;
  perspective:1800px;
}
.codex-feature,
.codex-card{
  position:relative;
  margin:0;
  overflow:hidden;
  background:#09090d;
  color:#f3efe7;
  border:1px solid rgba(5,0,9,.2);
}
.codex-feature img,
.codex-card img{
  display:block;
  width:100%;
  height:auto;
  background:#09090d;
}
.codex-feature img{
  aspect-ratio:1916/821;
  object-fit:cover;
}
.codex-caption{
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  gap:26px;
  align-items:start;
  padding:22px 24px 24px;
  background:#f2f2f2;
  color:var(--ink);
}
.codex-caption span,
.codex-heading span{
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
}
.codex-caption b{
  display:block;
  margin-bottom:8px;
  font-size:18px;
}
.codex-caption p{
  max-width:56rem;
  margin:0;
  color:rgba(5,0,9,.72);
  font-size:17px;
  line-height:1.7;
}
.codex-section{
  margin:10vh 0;
  content-visibility:auto;
  contain-intrinsic-size:900px;
}
.codex-heading{
  display:grid;
  grid-template-columns:72px minmax(340px,.48fr) minmax(420px,1fr);
  gap:clamp(24px,3vw,46px);
  align-items:start;
  margin-bottom:28px;
  padding-top:20px;
  border-top:1px solid rgba(5,0,9,.18);
}
.codex-heading span{
  padding-top:4px;
}
.codex-heading h2{
  margin:0;
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:36px;
  line-height:1;
  text-transform:uppercase;
}
.codex-heading p{
  max-width:48rem;
  margin:2px 0 0;
  color:rgba(5,0,9,.7);
  font-size:17px;
  line-height:1.7;
}
.codex-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
  perspective:1800px;
}
.codex-grid-three{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.character-factions{
  display:grid;
  gap:44px;
}
.character-faction{
  display:grid;
  gap:18px;
}
.faction-label{
  display:flex;
  align-items:baseline;
  gap:18px;
  padding-top:18px;
  border-top:1px solid rgba(5,0,9,.16);
}
.faction-label span{
  min-width:130px;
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
}
.faction-label b{
  font-size:21px;
  line-height:1.2;
}
.codex-card img{
  aspect-ratio:1916/821;
  object-fit:cover;
}
.codex-card figcaption{
  display:grid;
  grid-template-rows:auto auto;
  gap:6px;
  align-content:start;
  min-height:76px;
  padding:16px 18px 18px;
  background:#0d0d12;
}
.codex-card b{
  display:block;
  font-size:16px;
  line-height:1.2;
}
.codex-card small{
  display:block;
  color:rgba(243,239,231,.62);
  font-size:12px;
  line-height:1.45;
}
.codex-card-wide{
  grid-column:1 / span 2;
}
.codex-card-featured{
  grid-column:1 / -1;
}
.prompt-card{
  cursor:pointer;
  perspective:1600px;
  transition:box-shadow .35s ease;
}
.prompt-card:hover{
  box-shadow:0 24px 70px rgba(5,0,9,.2);
}
.prompt-front,
.prompt-back{
  transform-style:preserve-3d;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  transition:transform .7s cubic-bezier(.16,1,.3,1);
  will-change:transform;
}
.prompt-front{
  position:relative;
  z-index:2;
  background:inherit;
  pointer-events:auto;
}
.prompt-back{
  position:absolute;
  inset:0;
  z-index:3;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:14px;
  padding:32px;
  background:#050009;
  color:#f2f2f2;
  transform:rotateY(180deg);
  overflow:auto;
  pointer-events:none;
}
.prompt-card.is-flipped .prompt-front{
  transform:rotateY(-180deg);
  pointer-events:none;
}
.prompt-card.is-flipped .prompt-back{
  transform:rotateY(0);
  pointer-events:auto;
}
.prompt-back span{
  color:rgba(242,242,242,.48);
  font-size:11px;
  text-transform:uppercase;
}
.prompt-back p{
  margin:0;
  max-width:62rem;
  font-family:Arial,Helvetica,sans-serif;
  font-size:clamp(12px,1vw,16px);
  line-height:1.55;
  white-space:pre-line;
}
.codex-grid-three .prompt-back{
  padding:18px;
}
.codex-grid-three .prompt-back p{
  font-size:12px;
  line-height:1.42;
}
.codex-card-featured .prompt-back p,
.codex-feature .prompt-back p{
  font-size:clamp(15px,1.18vw,18px);
  line-height:1.58;
}
.error-project .hero{
  grid-template-columns:minmax(0,1fr) minmax(360px,31vw);
  min-height:58vh;
}
.error-project h1{
  font-size:clamp(86px,8.4vw,150px);
}
.error-project .summary{
  max-width:34rem;
  padding-top:18px;
  border-top:1px solid rgba(5,0,9,.22);
  color:rgba(5,0,9,.72);
  font-size:19px;
  line-height:1.62;
}
body.work-page .logo{
  transition:opacity .25s ease,transform .25s ease;
}
body.work-page.is-scrolled .logo{
  opacity:0;
  transform:translateY(-12px);
  pointer-events:none;
}
.error-showcase{
  margin:8vh 0 9vh;
}
.error-section{
  margin:11vh 0;
  content-visibility:auto;
  contain-intrinsic-size:900px;
}
.error-statement{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.62fr);
  gap:5vw;
  margin:9vh 0 10vh;
  padding:34px 0;
  border-top:1px solid rgba(5,0,9,.2);
  border-bottom:1px solid rgba(5,0,9,.2);
}
.error-statement span,
.error-heading span,
.error-plate figcaption span{
  color:rgba(5,0,9,.5);
  font-size:11px;
  line-height:1.2;
  text-transform:uppercase;
}
.error-statement b{
  display:block;
  max-width:58rem;
  font-size:34px;
  line-height:1.24;
}
.error-statement p{
  margin:0;
  color:rgba(5,0,9,.74);
  font-size:18px;
  line-height:1.72;
}
.error-heading{
  display:grid;
  grid-template-columns:84px 340px minmax(0,1fr);
  gap:32px;
  align-items:end;
  margin-bottom:26px;
  padding-top:18px;
  border-top:1px solid rgba(5,0,9,.18);
}
.error-heading h2{
  margin:0;
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:38px;
  line-height:.96;
  text-transform:uppercase;
}
.error-heading p{
  max-width:50rem;
  margin:0;
  color:rgba(5,0,9,.72);
  font-size:17px;
  line-height:1.68;
}
.error-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
}
.error-grid-four{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.error-plate{
  margin:0;
  overflow:hidden;
  border:1px solid rgba(5,0,9,.18);
  background:#f5f1ea;
}
.error-plate-full,
.error-grid:not(.error-grid-four) .error-plate-wide{
  grid-column:1 / -1;
}
.error-grid-four .error-plate-wide{
  grid-column:span 3;
}
.error-plate img{
  display:block;
  width:100%;
  height:auto;
  background:#ebe8e1;
}
.error-plate-portrait img{
  aspect-ratio:1086/1448;
  object-fit:cover;
}
.error-plate-square img{
  aspect-ratio:1;
  object-fit:cover;
}
.error-plate figcaption{
  display:grid;
  grid-template-columns:150px minmax(0,1fr);
  gap:18px;
  align-items:start;
  min-height:116px;
  padding:18px 20px 20px;
  border-top:1px solid rgba(5,0,9,.13);
}
.error-plate figcaption b{
  grid-column:2;
  display:block;
  margin-bottom:7px;
  font-size:18px;
  line-height:1.25;
}
.error-plate figcaption p{
  grid-column:2;
  margin:0;
  color:rgba(5,0,9,.7);
  font-size:15px;
  line-height:1.55;
}
.error-plate figcaption span{
  grid-row:1 / span 2;
}
.error-grid-four .error-plate figcaption{
  display:block;
  min-height:132px;
  padding:15px 16px 17px;
}
.error-grid-four .error-plate figcaption b{
  font-size:16px;
}
.error-grid-four .error-plate figcaption p{
  font-size:13px;
  line-height:1.45;
}
.meta{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2rem;
  margin:7vh 0 6vh;
  padding-top:1.2rem;
  border-top:1px solid rgba(5,0,9,.18);
}
.meta span{
  display:block;
  margin-bottom:.5rem;
  color:var(--muted);
  font-size:11px;
}
.meta b{
  font-size:15px;
  font-weight:700;
}
.media-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2vw;
}
.placeholder{
  position:relative;
  min-height:50vh;
  border:2px dashed rgba(5,0,9,.28);
  background:
    linear-gradient(135deg,rgba(72,1,255,.16),transparent 36%),
    repeating-linear-gradient(-45deg,rgba(5,0,9,.045) 0 1px,transparent 1px 18px);
  overflow:hidden;
}
.placeholder.large{
  grid-column:1/-1;
  min-height:70vh;
}
.placeholder::before{
  content:attr(data-label);
  position:absolute;
  left:24px;
  bottom:22px;
  color:rgba(5,0,9,.48);
  font-size:12px;
  letter-spacing:0;
  text-transform:uppercase;
}
.radio-showcase{
  display:grid;
  grid-template-columns:minmax(360px,34vw) minmax(0,1fr);
  gap:5vw;
  align-items:center;
  margin:8vh 0 10vh;
  padding:5vw;
  background:#10192a;
  color:#f4f8fb;
  overflow:hidden;
}
.radio-device{
  position:relative;
  width:375px;
  min-height:640px;
  padding:28px 24px 24px;
  border:1px solid rgba(228,239,255,.16);
  border-radius:28px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 18%),
    radial-gradient(circle at 20% 8%,rgba(206,225,255,.12),transparent 26%),
    linear-gradient(180deg,rgba(18,25,40,.9),rgba(12,18,30,.74));
  box-shadow:0 28px 80px rgba(2,7,16,.42),inset 0 1px 0 rgba(255,255,255,.08);
}
.radio-device::before{
  content:"";
  position:absolute;
  inset:14px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  opacity:.7;
  box-shadow:0 0 28px rgba(255,255,255,.08);
}
.radio-icon{
  position:absolute;
  top:24px;
  right:24px;
  width:38px;
  height:38px;
}
.radio-vinyl{
  position:relative;
  width:190px;
  height:190px;
  margin:38px auto 26px;
  border-radius:50%;
  background:
    radial-gradient(circle at 32% 30%,rgba(220,236,255,.14),transparent 18%),
    repeating-radial-gradient(circle at center,rgba(4,8,14,.36) 0,rgba(15,22,34,.78) 3px,rgba(6,11,18,.38) 6px);
  box-shadow:0 18px 32px rgba(0,0,0,.24),inset 0 1px 0 rgba(220,236,255,.12);
}
.radio-vinyl::after{
  content:"伴舟";
  position:absolute;
  inset:58px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:radial-gradient(circle at 38% 32%,rgba(214,231,255,.92),rgba(124,156,210,.56));
  color:#10192a;
  font-weight:700;
}
.radio-ui-title{
  text-align:center;
}
.radio-ui-title strong{
  display:block;
  font-size:20px;
}
.radio-ui-title span{
  display:block;
  margin-top:6px;
  color:rgba(205,220,238,.62);
  font-size:13px;
}
.radio-bars{
  display:flex;
  align-items:end;
  justify-content:center;
  gap:4px;
  height:54px;
  margin:26px 0 18px;
}
.radio-bars i{
  display:block;
  width:4px;
  border-radius:999px;
  background:linear-gradient(180deg,#f4f8fb,rgba(124,156,210,.5));
}
.radio-bars i:nth-child(1){height:18px}
.radio-bars i:nth-child(2){height:36px}
.radio-bars i:nth-child(3){height:26px}
.radio-bars i:nth-child(4){height:45px}
.radio-bars i:nth-child(5){height:30px}
.radio-bars i:nth-child(6){height:20px}
.radio-queue{
  margin-top:24px;
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.05);
}
.radio-queue span{
  display:block;
  color:rgba(205,220,238,.62);
  font-size:12px;
}
.radio-queue b{
  display:block;
  margin-top:8px;
  font-size:14px;
  line-height:1.6;
}
.radio-panel h2{
  margin:0;
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:40px;
  line-height:1;
  text-transform:uppercase;
}
.radio-panel p{
  max-width:48rem;
  margin:22px 0 0;
  color:rgba(244,248,251,.78);
  font-size:18px;
  line-height:1.65;
}
.feature-list{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:32px;
}
.feature-list div{
  min-height:112px;
  padding:18px;
  border:1px solid rgba(228,239,255,.14);
  background:rgba(255,255,255,.05);
}
.feature-list span{
  display:block;
  color:rgba(205,220,238,.62);
  font-size:12px;
}
.feature-list b{
  display:block;
  margin-top:8px;
  font-size:15px;
  line-height:1.35;
}
.radio-audio{
  width:100%;
  margin-top:28px;
}
.radio-context,
.radio-flow,
.radio-desktop{
  margin:10vh 0;
}
.radio-section-head{
  display:grid;
  grid-template-columns:160px minmax(0,1fr);
  gap:36px;
  align-items:start;
  margin-bottom:28px;
  padding-top:20px;
  border-top:1px solid rgba(5,0,9,.18);
}
.radio-section-head > span,
.radio-context-grid article span,
.radio-flow-steps span,
.radio-desktop-copy > span{
  color:var(--muted);
  font-size:11px;
  line-height:1.2;
  text-transform:uppercase;
}
.radio-section-head h2,
.radio-desktop-copy h2{
  margin:0;
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:38px;
  line-height:1;
  text-transform:uppercase;
}
.radio-section-head p,
.radio-desktop-copy p{
  max-width:58rem;
  margin:16px 0 0;
  color:rgba(5,0,9,.72);
  font-size:17px;
  line-height:1.7;
}
.radio-context-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:26px;
}
.radio-context-grid article{
  min-height:260px;
  padding:22px 0 0;
  border-top:1px solid rgba(5,0,9,.2);
}
.radio-context-grid h3{
  margin:18px 0 0;
  font-size:28px;
  line-height:1.1;
}
.radio-context-grid p{
  margin:20px 0 0;
  color:rgba(5,0,9,.74);
  font-size:17px;
  line-height:1.72;
}
.radio-flow{
  padding:5vw;
  background:#e8edf5;
}
.radio-flow .radio-section-head{
  margin-bottom:34px;
  border-color:rgba(5,0,9,.2);
}
.radio-flow-steps{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1px;
  margin:0;
  padding:0;
  list-style:none;
  background:rgba(5,0,9,.16);
}
.radio-flow-steps li{
  min-height:232px;
  padding:24px;
  background:#e8edf5;
}
.radio-flow-steps b{
  display:block;
  margin-top:34px;
  font-size:22px;
  line-height:1.2;
}
.radio-flow-steps p{
  margin:14px 0 0;
  color:rgba(5,0,9,.72);
  font-size:15px;
  line-height:1.62;
}
.radio-desktop{
  display:grid;
  grid-template-columns:minmax(360px,430px) minmax(0,1fr);
  gap:6vw;
  align-items:center;
}
.radio-window{
  position:relative;
  min-height:620px;
  padding:22px;
  border:1px solid rgba(5,0,9,.18);
  border-radius:8px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 22%),
    linear-gradient(180deg,#10192a,#07101f);
  color:#f4f8fb;
  box-shadow:0 28px 80px rgba(5,0,9,.22);
}
.radio-window-top{
  display:grid;
  grid-template-columns:20px 1fr 20px;
  align-items:center;
  color:rgba(244,248,251,.68);
  font-size:12px;
}
.radio-window-top span,
.radio-window-top i{
  width:10px;
  height:10px;
  border-radius:50%;
  background:rgba(244,248,251,.44);
}
.radio-window-top i{
  justify-self:end;
  background:rgba(244,248,251,.16);
}
.radio-window-top b{
  justify-self:center;
  font-weight:700;
}
.radio-window-disc{
  position:relative;
  width:220px;
  height:220px;
  margin:48px auto 30px;
}
.radio-window-record{
  position:absolute;
  inset:0;
  border-radius:50%;
  background:
    radial-gradient(circle at center,#cfe2ff 0 16%,#17243a 17% 21%,transparent 22%),
    repeating-radial-gradient(circle at center,rgba(255,255,255,.11) 0 2px,rgba(6,10,18,.9) 3px 7px);
  box-shadow:0 24px 48px rgba(0,0,0,.28);
}
.radio-window-arm{
  position:absolute;
  top:14px;
  right:34px;
  width:5px;
  height:112px;
  border-radius:999px;
  background:linear-gradient(180deg,#e9f0fb,#7e90aa);
  transform:rotate(22deg);
  transform-origin:top center;
}
.radio-window-song{
  text-align:center;
}
.radio-window-song strong{
  display:block;
  font-size:21px;
}
.radio-window-song span{
  display:block;
  margin-top:8px;
  color:rgba(205,220,238,.7);
  font-size:13px;
}
.radio-window-lyrics{
  display:grid;
  gap:9px;
  margin:34px 0 28px;
  padding:18px 20px;
  border-top:1px solid rgba(244,248,251,.1);
  border-bottom:1px solid rgba(244,248,251,.1);
}
.radio-window-lyrics p{
  margin:0;
  color:rgba(244,248,251,.62);
  font-size:13px;
  text-align:center;
}
.radio-window-lyrics p:first-child{
  color:#f4f8fb;
  font-size:15px;
}
.radio-window-controls{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.radio-window-controls button{
  position:relative;
  height:44px;
  border:0;
  border-radius:8px;
  background:rgba(255,255,255,.05);
}
.radio-window-controls button::before{
  content:"";
  position:absolute;
  inset:14px;
  border-radius:999px;
  background:rgba(244,248,251,.86);
}
.radio-window-controls button:nth-child(2)::before{
  inset:12px 16px;
  clip-path:polygon(20% 0,100% 50%,20% 100%);
  border-radius:0;
}
.radio-window-controls button:nth-child(3)::before{
  inset:13px;
  clip-path:polygon(10% 0,50% 40%,90% 0,100% 10%,60% 50%,100% 90%,90% 100%,50% 60%,10% 100%,0 90%,40% 50%,0 10%);
  border-radius:0;
}
.radio-desktop-copy ul{
  display:grid;
  gap:12px;
  margin:28px 0 0;
  padding:0;
  list-style:none;
}
.radio-desktop-copy li{
  padding-top:12px;
  border-top:1px solid rgba(5,0,9,.14);
  color:rgba(5,0,9,.74);
  font-size:16px;
  line-height:1.6;
}
.journal-page .hero{
  grid-template-columns:minmax(0,1fr) minmax(420px,34vw);
  min-height:56vh;
}
.journal-page h1{
  font-size:clamp(76px,8vw,148px);
}
.journal-page .summary{
  max-width:38rem;
  font-size:19px;
  line-height:1.52;
}
.journal-intro{
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  gap:4vw;
  margin:4vh 0 8vh;
  padding-top:1.4rem;
  border-top:1px solid rgba(5,0,9,.2);
}
.journal-intro span{
  color:var(--muted);
  font-family:"Space Mono",monospace;
  font-size:12px;
}
.journal-intro p{
  margin:0;
  max-width:58rem;
  color:rgba(5,0,9,.78);
  font-size:20px;
  line-height:1.65;
}
.journal-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2vw;
  margin-top:6vh;
}
.journal-entry{
  display:flex;
  flex-direction:column;
  min-height:320px;
  content-visibility:auto;
  contain-intrinsic-size:520px;
  padding:28px;
  border-top:2px solid var(--ink);
  background:rgba(72,1,255,.05);
}
.journal-entry-featured{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(380px,.58fr);
  column-gap:4vw;
  min-height:560px;
}
.journal-entry-wide{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(420px,.42fr);
  column-gap:3vw;
  min-height:360px;
}
.journal-entry-wide > span,
.journal-entry-wide > h2,
.journal-entry-wide > p{
  grid-column:1;
}
.journal-entry-wide .journal-media{
  grid-column:2;
  grid-row:1 / span 4;
  min-height:100%;
  margin:0;
}
.journal-entry span{
  display:block;
  margin-bottom:1.2rem;
  color:var(--muted);
  font-family:"Space Mono",monospace;
  font-size:12px;
  line-height:1.4;
}
.journal-entry h2{
  margin:0 0 1.2rem;
  font-family:"Druk Wide Web",Arial,Helvetica,sans-serif;
  font-size:clamp(26px,2.45vw,48px);
  line-height:1.08;
  letter-spacing:0;
  text-transform:uppercase;
}
.journal-entry p{
  margin:0;
  max-width:50rem;
  color:rgba(5,0,9,.76);
  font-size:16px;
  line-height:1.72;
}
.journal-entry p + p{
  margin-top:1rem;
}
.journal-media{
  position:relative;
  min-height:176px;
  margin:24px 0 0;
  overflow:hidden;
  background:var(--ink);
  color:#fff;
}
.journal-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(5,0,9,0) 35%,rgba(5,0,9,.82) 100%),
    linear-gradient(90deg,rgba(5,0,9,.26),rgba(5,0,9,0) 54%);
  pointer-events:none;
}
.journal-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(.92) contrast(1.04);
}
.journal-media figcaption{
  position:absolute;
  left:18px;
  right:18px;
  bottom:16px;
  z-index:1;
  margin:0;
  color:rgba(255,255,255,.88);
  font-size:13px;
  line-height:1.45;
}
.journal-featured-media{
  display:grid;
  grid-template-rows:minmax(300px,1.15fr) minmax(220px,.85fr);
  gap:16px;
  min-height:100%;
}
.journal-featured-media .journal-media{
  min-height:0;
  margin:0;
}
.journal-media-large figcaption{
  font-size:14px;
}
.journal-media-symbol{
  display:grid;
  place-items:center;
  background:
    radial-gradient(circle at center,rgba(255,255,255,.22),rgba(255,255,255,0) 46%),
    linear-gradient(135deg,#111827,#050009);
}
.journal-media-symbol img{
  width:152px;
  height:152px;
  object-fit:contain;
  filter:drop-shadow(0 24px 38px rgba(0,0,0,.42));
}
.journal-entry ul{
  display:grid;
  gap:.32rem;
  margin:1.2rem 0 0;
  padding:0;
  list-style:none;
  color:rgba(5,0,9,.78);
  font-size:15px;
  line-height:1.75;
}
.journal-entry li{
  position:relative;
  padding-left:1.2rem;
}
.journal-entry li::before{
  content:"/";
  position:absolute;
  left:0;
  color:var(--violet);
}
.copy-block{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5vw;
  margin:10vh 0;
}
.copy-block h2{
  margin:0;
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:32px;
  line-height:1;
  text-transform:uppercase;
}
.copy-block p{
  margin:0;
  max-width:44rem;
  color:rgba(5,0,9,.78);
  font-size:18px;
  line-height:1.6;
}
.project-nav{
  display:flex;
  justify-content:space-between;
  gap:2rem;
  margin-top:10vh;
  padding-top:1.4rem;
  border-top:1px solid rgba(5,0,9,.18);
}
.project-nav a{
  font-family:"Druk Wide Web",Arial,sans-serif;
  font-size:28px;
  line-height:1;
  text-decoration:none;
  text-transform:uppercase;
  transition:transform .25s;
}
.project-nav a:hover{transform:translateX(6px)}
.project-nav a:first-child:hover{transform:translateX(-6px)}