.sky,
.fx {
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
}

.fx {
  z-index: -1;
  overflow: hidden;
  will-change: transform;
}

.sky__layer {
  will-change: opacity;
}
.sky__layer,
.fx__layer {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1.4s ease, visibility 0s linear 1.4s;
}
.sky__layer.is-on,
.fx__layer.is-on {
  opacity: 1;
  visibility: visible;
  transition: opacity 1.4s ease;
}
.fx__layer {
  transition-duration: 0.8s;
}
.fx__layer:not(.is-on) {
  transition-delay: 0s, 0.8s;
}

.fx__layer.is-warming:not(.is-on) {
  opacity: 0.01;
  visibility: visible;
  transition: none;
}
.fx__layer:not(.is-on) * {
  animation-play-state: paused !important;
}
[data-sky="dawn"].sky__layer {
  background: linear-gradient(180deg, #ffe7c8 0%, #fff5e6 55%, #fff1e0 100%);
}
[data-sky="mon"].sky__layer {
  background: linear-gradient(180deg, #ffefc6 0%, #fff8ec 60%);
}
[data-sky="tue"].sky__layer {
  background: linear-gradient(180deg, #dfe4ec 0%, #eff0f1 55%, #f7f2ec 100%);
}
[data-sky="wed"].sky__layer {
  background: linear-gradient(180deg, #def0ea 0%, #f5f9f2 60%);
}
[data-sky="thu"].sky__layer {
  background: linear-gradient(180deg, #e8e3df 0%, #f4efea 60%);
}
[data-sky="fri"].sky__layer {
  background: linear-gradient(180deg, #d3cbdc 0%, #e9e3ea 55%, #f4eef0 100%);
}
[data-sky="fri-clear"].sky__layer {
  background: linear-gradient(180deg, #ffe2c4 0%, #fff2e6 60%);
}
[data-sky="sat"].sky__layer {
  background: linear-gradient(180deg, #ffe6a8 0%, #fff6dc 60%);
}
[data-sky="sun"].sky__layer {
  background: linear-gradient(180deg, #c9b9ea 0%, #e4daf4 55%, #f2ecf8 100%);
}

.sunball {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, #fff3c4, #ffd27a 45%, rgba(255, 185, 56, 0) 70%);
}
.fx--dawn .sunball {
  width: 17.5rem;
  height: 17.5rem;
  right: -6.875rem;
  bottom: -8.125rem;
  opacity: 0.6;
}
.fx--mon .sunball {
  width: 13.75rem;
  height: 13.75rem;
  right: 9vw;
  top: 14vh;
}
.fx--sat .sunball {
  width: 18.75rem;
  height: 18.75rem;
  right: 6vw;
  top: 10vh;
}
.fx--next .sunball {
  width: 22.5rem;
  height: 22.5rem;
  left: 50%;
  bottom: -13.125rem;
  margin-left: -11.25rem;
  transform: translateY(10rem);
  transition: transform 2.4s var(--ease);
}
.fx--next.is-on .sunball {
  transform: none;
}
.rays {
  position: absolute;
  right: calc(6vw - 6.875rem);
  top: calc(10vh - 6.875rem);
  width: 32.5rem;
  height: 32.5rem;
  border-radius: 50%;
  background: repeating-conic-gradient(rgba(255, 200, 90, 0.16) 0 6deg, rgba(255, 200, 90, 0) 6deg 18deg);
  -webkit-mask-image: radial-gradient(closest-side, #000 40%, transparent 100%);
  mask-image: radial-gradient(closest-side, #000 40%, transparent 100%);
  animation: spin 90s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.cloud {
  position: absolute;
  left: 0;
  border-radius: var(--pill);
  background: radial-gradient(closest-side, rgba(255, 255, 255, 0.95), rgba(255, 255, 255, 0));
  animation: cross 60s linear infinite;
}
.cloud--1 {
  width: 18.75rem;
  height: 6.875rem;
  top: 30vh;
}
.cloud--2 {
  width: 13.75rem;
  height: 5rem;
  top: 62vh;
  animation-delay: -25s;
}
@keyframes cross {
  from {
    transform: translateX(-30vw);
  }
  to {
    transform: translateX(110vw);
  }
}

.rain {
  position: absolute;
  inset: 0;
}
.rain span {
  position: absolute;
  inset: -11.25rem 0 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='180'%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23506996' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23506996' stop-opacity='.45'/%3E%3C/linearGradient%3E%3Cg fill='url(%23g)' transform='skewX(-10)'%3E%3Crect x='12' y='8' width='2' height='22' rx='1'/%3E%3Crect x='58' y='70' width='2' height='22' rx='1'/%3E%3Crect x='104' y='24' width='2' height='22' rx='1'/%3E%3Crect x='36' y='128' width='2' height='22' rx='1'/%3E%3Crect x='86' y='150' width='2' height='22' rx='1'/%3E%3Crect x='126' y='104' width='2' height='22' rx='1'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 8.75rem 11.25rem;
  animation: fall-near 0.2s linear infinite;
}
.rain .rain__far {
  display: none;
}
@keyframes fall-near {
  to {
    transform: translateY(11.25rem);
  }
}
@keyframes fall-far {
  to {
    transform: translateY(7.5rem);
  }
}

.gusts i {
  position: absolute;
  left: -30vw;
  top: var(--y);
  width: 22vw;
  height: 2px;
  border-radius: var(--pill);
  background: linear-gradient(90deg, rgba(60, 140, 110, 0), rgba(60, 140, 110, 0.3), rgba(60, 140, 110, 0));
  animation: gust var(--dur) linear var(--delay) infinite;
}
.gusts b {
  position: absolute;
  left: -5vw;
  top: var(--y);
  width: 0.75rem;
  height: 0.4375rem;
  border-radius: 50% 0;
  background: #9bd0a8;
  opacity: 0.7;
  animation: leaf var(--dur) linear var(--delay) infinite;
}
@keyframes gust {
  to {
    transform: translateX(150vw);
  }
}
@keyframes leaf {
  50% {
    transform: translate(55vw, 8vh) rotate(200deg);
  }
  to {
    transform: translate(115vw, -4vh) rotate(420deg);
  }
}
.fog {
  position: absolute;
  width: 90vw;
  height: 50vh;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0));
  transition: opacity 1.6s ease, transform 2.4s var(--ease);
}
.fog--1 {
  left: -20vw;
  top: 10vh;
  animation: fogmove 26s ease-in-out infinite alternate;
}
.fog--2 {
  right: -25vw;
  top: 40vh;
  animation: fogmove 32s ease-in-out infinite alternate-reverse;
}
.fog--3 {
  left: 10vw;
  top: 65vh;
  animation: fogmove 38s ease-in-out infinite alternate;
}
@keyframes fogmove {
  to {
    translate: 14vw 0;
  }
}
.fx--thu.is-lifted .fog {
  opacity: 0.12;
  transform: translateY(-25vh);
}
.storm {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(92, 78, 112, 0.5), rgba(92, 78, 112, 0));
  transition: transform 2.2s var(--ease), opacity 1.6s;
}
.storm--1 {
  width: 70vw;
  height: 45vh;
  left: -10vw;
  top: -12vh;
}
.storm--2 {
  width: 70vw;
  height: 45vh;
  right: -15vw;
  top: -8vh;
}
.storm--3 {
  width: 50vw;
  height: 35vh;
  left: 25vw;
  top: -15vh;
}

.fx--fri.is-cleared .storm--1,
.fx--fri.is-cleared .storm--3 {
  transform: translateX(-60vw);
  opacity: 0;
}
.fx--fri.is-cleared .storm--2 {
  transform: translateX(60vw);
  opacity: 0;
}
.beam {
  position: absolute;
  right: 12vw;
  top: -10vh;
  width: 30vw;
  height: 90vh;
  background: linear-gradient(180deg, rgba(255, 214, 140, 0.55), rgba(255, 214, 140, 0));
  transform: skewX(-14deg);
  opacity: 0;
  transition: opacity 1.8s;
}
.fx--fri.is-cleared .beam {
  opacity: 1;
}
.moon {
  position: absolute;
  right: 12vw;
  top: 14vh;
  width: 6.875rem;
  height: 6.875rem;
  border-radius: 50%;
  background: radial-gradient(circle at 70% 40%, transparent 3.25rem, #fff8e6 3.3125rem);
  box-shadow: 0 0 60px 10px rgba(255, 248, 230, 0.35);
}

.stars span {
  position: absolute;
  inset: 0 0 45vh;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='260' fill='%23fff'%3E%3Ccircle cx='24' cy='30' r='1.6'/%3E%3Ccircle cx='140' cy='90' r='1.2'/%3E%3Ccircle cx='250' cy='20' r='1.5'/%3E%3Ccircle cx='310' cy='150' r='1.1'/%3E%3Ccircle cx='80' cy='200' r='1.4'/%3E%3Ccircle cx='200' cy='230' r='1'/%3E%3C/svg%3E");
  background-size: 22.5rem 16.25rem;
  animation: twinkle 3s ease-in-out infinite;
}
.stars span + span {
  background-position: 10.625rem 7.5rem;
  opacity: 0.6;
  animation-delay: -1.5s;
}
@keyframes twinkle {
  50% {
    opacity: 0.25;
  }
}
@media (max-width: 1000px) {
  .fx--dawn .sunball,
  .fx--mon .sunball,
  .fx--sat .sunball,
  .rays,
  .moon {
    opacity: 0.5;
  }
}

.daystrip {
  align-items: center;
  gap: var(--s3);
  min-width: 0;
}
.daystrip__days {
  display: flex;
  gap: var(--s1);
  list-style: none;
}
.daystrip__day {
  gap: 0.375rem;
  padding: 0 0.8rem;
  font-size: var(--fs-label);
  letter-spacing: 0.03em;
}
.daystrip__day .ic {
  width: 1.125rem;
  height: 1.125rem;
}
.daystrip__day.is-seen:not([aria-current]) {
  color: var(--plum);
}
.daystrip__sections .topbar__burger {
  display: none;
}
@media (max-width: 1100px) {
  .daystrip__day {
    padding: 0 0.55rem;
  }
}
@media (max-width: 900px) {
  .daystrip__mark {
    display: none;
  }
  .daystrip {
    gap: var(--s2);
  }
  .daystrip__days {
    gap: 2px;
  }
  .daystrip__day {
    padding: 0 0.3rem;
  }
  .daystrip__day .ic,
  .daystrip__long {
    display: none;
  }
  .daystrip__skip,
  .daystrip__sections {
    min-height: 2.5rem;
    min-width: 2.5rem;
    padding: 0;
  }
  .daystrip__sections .topbar__burger {
    display: block;
  }
}

@media (max-width: 599px) {
  .topbar[data-fold][data-show="week"] .topbar__row {
    width: 100%;
    padding-left: 0.5rem;
  }
  .daystrip {
    flex: 1;
  }
  .daystrip__days {
    flex: 1;
    min-width: 0;
  }
  .daystrip__days > li {
    flex: 1;
    min-width: 0;
  }
  .daystrip__day {
    width: 100%;
    padding: 0;
  }
  .daystrip__skip,
  .daystrip__sections {
    min-height: 2.75rem;
    min-width: 2.75rem;
  }
}

@media (max-width: 399px) {
  .daystrip__skip {
    display: none;
  }
}

.hero__stage {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: clamp(2.5rem, 5vw, 4.5rem);
  align-items: center;
  
  min-height: min(calc(100svh - var(--bar-h)), 56rem);
  padding-block: var(--s9) var(--s11);
}
.hero__copy h1 {
  margin-bottom: 1.375rem;
}
.hero__line {
  font-family: var(--font-display);
  font-size: var(--fs-title);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: var(--lh-title);
  margin-bottom: var(--s2);
}
.hero__byline {
  margin: 0 0 1.625rem;
}
.hero__lead {
  font-size: var(--fs-lead);
  line-height: 1.55;
  max-width: 28em;
  margin: 0 0 1.875rem;
  color: var(--plum-body);
}
.hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3);
  margin-bottom: 1.375rem;
}
.hero__trust {
  font-size: var(--fs-micro);
  color: var(--ink-soft);
}

.give {
  display: grid;
  gap: var(--s4);
  justify-items: start;
}
.give__card,
.give__chat {
  width: 100%;
  max-width: 30rem;
}
.give__card {
  justify-self: start;
  transform-origin: 80% 100%;
}
.give__card .ccard {
  transform: rotate(-1.5deg);
  box-shadow: var(--shadow-lift);
}
.give__chat {
  display: grid;
  gap: var(--s3);
  padding: var(--s5);
}
.give__chat .msg {
  max-width: 92%;
}
.give__head {
  display: flex;
  align-items: center;
  gap: var(--s2);
  padding-bottom: var(--s3);
  border-bottom: 1px solid var(--hairline);
}
.give__head > .mark {
  width: 1.625rem;
  height: 1.625rem;
}
.give__head > .mark::after {
  right: 0.375rem;
  top: 0.375rem;
  width: 0.4375rem;
  height: 0.4375rem;
}
.give__who {
  font-weight: 700;
  font-size: var(--fs-small);
}
.give__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin-left: auto;
  padding: 3px 0.625rem 3px 0.3125rem;
  border-radius: var(--pill);
  background: var(--honey-tint);
  color: var(--honey-ink);
  font-size: var(--fs-label);
  font-weight: 700;
  opacity: 0;
  transform: scale(0.85);
}
.give__chip .mark {
  width: 1rem;
  height: 1rem;
}
.give__chip .mark::after {
  right: 3px;
  top: 3px;
  width: 0.3125rem;
  height: 0.3125rem;
}
.give__answers,
.give__answer {
  display: grid;
  gap: var(--s2);
}
.give__answers {
  gap: var(--s3);
}
.give__label {
  color: var(--ink-soft);
}

.give.is-live .give__label {
  display: none;
}
.give.is-live:not(.is-in) .is-with,
.give.is-in .is-today {
  display: none;
}
.give.is-in .is-with {
  animation: rise 0.6s 0.25s var(--ease) both;
}
.give__card,
.give__btn,
.give__chat,
.give__chip {
  transition: transform 0.7s var(--ease), opacity 0.5s var(--ease);
}
.give.is-in .give__card {
  opacity: 0;
  transform: translateY(var(--drop, 7.5rem)) scale(0.4);
  pointer-events: none;
}
.give.is-in .give__btn,
.give.is-in .give__chat {
  transform: translateY(var(--lift, 0));
}
.give.is-in .give__chip {
  opacity: 1;
  transform: none;
  transition-delay: 0.35s;
}

.hero__copy > *,
.give {
  animation: enter 0.7s var(--ease) both;
}
.hero__copy > :nth-child(2) {
  animation-delay: 0.08s;
}
.hero__copy > :nth-child(3) {
  animation-delay: 0.16s;
}
.hero__copy > :nth-child(4) {
  animation-delay: 0.24s;
}
.hero__copy > :nth-child(5) {
  animation-delay: 0.32s;
}
.hero__copy > :nth-child(6) {
  animation-delay: 0.4s;
}
.give {
  animation-duration: 0.9s;
  animation-delay: 0.45s;
}
@keyframes enter {
  from {
    opacity: 0;
    transform: translateY(1.125rem);
  }
}

@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(0.5rem);
  }
}

.problem {
  overflow-x: clip;
}
.sightings {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s5);
  list-style: none;
}

.sighting {
  display: grid;
  grid-row: span 4;
  grid-template-rows: subgrid;
  align-content: start;
  row-gap: var(--s4);
  padding: var(--s6);
}
.sighting .msg {
  max-width: 100%;
}
.sighting__where {
  font-family: var(--font-display);
  font-size: var(--fs-title);
  font-weight: 600;
  line-height: var(--lh-title);
  letter-spacing: -0.01em;
}
.sighting__what {
  font-size: var(--fs-small);
  color: var(--ink-soft);
}

.sighting__cost {
  padding-top: var(--s4);
  border-top: 1px solid var(--hairline);
  font-family: var(--font-display);
  font-size: var(--fs-title);
  font-weight: 600;
  line-height: var(--lh-title);
  letter-spacing: -0.01em;
}
.sighting__cost span {
  display: table;
  margin-bottom: var(--s2);
  padding: 0.2em 0.7em 0.24em;
  border-radius: var(--pill);
  background: var(--rose-tint);
  color: var(--rose-ink);
  font-family: var(--font-sans);
  font-size: var(--fs-micro);
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.3;
  text-transform: uppercase;
}

.problem__bridge {
  max-width: 62ch;
  margin-top: var(--beat-gap);
  font-size: var(--fs-lead);
  line-height: 1.55;
  color: var(--plum-body);
}
.problem__bridge .textlink {
  white-space: nowrap;
}

.week__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 30rem);
  gap: clamp(2.5rem, 5vw, 4.5rem);
}
.week:not(.is-live) .week__body,
.week.is-narrow .week__body {
  grid-template-columns: minmax(0, 1fr);
}
.day {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--s4);
  max-width: 36rem;
  padding-block: var(--s10);
}
.week.is-live:not(.is-narrow) .day {
  min-height: 72vh;
  min-height: 72svh;
}
.day__when {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s2);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--ink-soft);
}
.day__name {
  padding: 2px 0.625rem;
  border-radius: var(--pill);
  background: var(--plum);
  color: var(--on-plum);
}
.day__text {
  font-size: var(--fs-lead);
  line-height: 1.55;
  color: var(--plum-body);
}

.day__promise {
  align-self: flex-start;
  padding: 0.3em 0.9em 0.34em;
  border-radius: var(--pill);
  background: var(--card);
  box-shadow: 0 0 0 1px var(--hairline);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--plum);
}
.day__aside {
  color: var(--ink-soft);
}
.day__aside a {
  color: var(--plum);
  font-weight: 600;
}

.scene {
  display: flex;
  flex-direction: column;
  gap: var(--s3);
}
.day > .scene {
  margin-top: var(--s2);
  padding: var(--s5);
  border-radius: var(--r-card);
  background: var(--card);
  box-shadow: var(--shadow-lift);
}
.scene__picks {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2);
  align-self: flex-start;
}
.pill--mono {
  font-family: var(--font-mono);
  font-weight: 400;
}
.scene__picks.is-done .pill:not([aria-pressed="true"]) {
  opacity: 0.45;
}

.scene.is-waiting > :is(.msg, .scene__picks, .findings, .scene__empty):not([data-reply]) {
  opacity: 0;
}
.scene.is-playing > :is(.msg, .scene__picks, .findings, .scene__empty):not([data-reply]) {
  animation: turn 0.5s calc(0.2s + var(--turn, 0) * 0.6s) var(--ease) both;
}
@keyframes turn {
  from {
    opacity: 0;
    transform: translateY(0.625rem);
  }
}
.scene.is-live [data-reply] {
  display: none;
}
.scene.is-live [data-reply].is-shown {
  display: block;
  animation: rise 0.4s var(--ease) both;
}
.scene.is-live [data-reply].is-shown + [data-reply].is-shown {
  animation-delay: 0.2s;
}
.scene__file {
  align-self: flex-start;
  max-width: 100%;
  padding: 0.375rem 0.75rem;
  border-radius: var(--r-inner);
  background: var(--on-tint);
  color: var(--on-ink);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  animation: rise 0.4s var(--ease) both;
}
.scene__file code {
  margin-right: 0.4em;
  padding: 0;
  background: none;
  font-weight: 700;
}
.scene__empty {
  margin: auto;
  padding: var(--s8) 0;
  text-align: center;
  color: var(--ink-soft);
}
.findings {
  display: grid;
  gap: var(--s2);
  list-style: none;
}
.finding {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s2) var(--s3);
  padding: var(--s3) var(--s4);
  border-radius: var(--r-inner);
  background: var(--ground-shade);
  font-size: var(--fs-micro);
  transition: background-color var(--t-turn) var(--ease);
}
.finding p {
  flex: 1 1 16rem;
}
.finding.is-fixed {
  background: var(--on-tint);
}
.finding.is-fixed p {
  color: var(--on-ink);
}
.finding.is-fixed b {
  text-decoration: line-through;
}

.week__stage {
  position: relative;
}
.screen {
  position: sticky;
  top: calc(var(--bar-h) + var(--s6));
  display: flex;
  flex-direction: column;
  height: calc(100vh - var(--bar-h) - var(--s12));
  max-height: 43.75rem;
  overflow: hidden;
}
.screen__head {
  display: flex;
  align-items: center;
  gap: var(--s3);
  padding: var(--s4) var(--s5);
  border-bottom: 1px solid var(--hairline);
}
.screen__who {
  font-weight: 600;
  line-height: 1.3;
}
.screen__who small {
  display: block;
  font-size: var(--fs-micro);
  font-weight: 400;
  color: var(--ink-soft);
}
.screen__kw {
  margin-left: auto;
}
.screen__kw:empty {
  visibility: hidden;
}
.screen__chat {
  position: relative;
  flex: 1;
  min-height: 0;
}
.screen__chat .scene {
  position: absolute;
  inset: 0;
  padding: var(--s5);
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.875rem);
  transition: opacity 0.5s var(--ease), transform 0.5s var(--ease), visibility 0s linear 0.5s;
}
.screen__chat .scene.is-current {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition: opacity 0.5s var(--ease), transform 0.5s var(--ease);
}
.screen__chat .scene__file {
  display: none;
}
.screen__files {
  border-top: 1px solid var(--hairline);
  background: var(--ground-shade);
}
.screen__tabs {
  display: flex;
  gap: 0;
  padding: var(--s2) var(--s2) 0;
  overflow-x: auto;
  scrollbar-width: none;
  list-style: none;
}
.screen__tabs::-webkit-scrollbar {
  display: none;
}
.screen__tabs li {
  padding: 0.3125rem 0.25rem;
  border-radius: var(--r-code) var(--r-code) 0 0;
  color: var(--ink-soft);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  white-space: nowrap;
}
.screen__tabs li[aria-current="true"] {
  background: var(--card);
  color: var(--plum);
}
.screen__file {
  min-height: 7rem;
  margin: 0 var(--s3) var(--s3);
  padding: var(--s3) var(--s4);
  border-radius: 0 var(--r-code) var(--r-code) var(--r-code);
  background: var(--card);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  line-height: 1.65;
}
.screen__file p {
  margin: 0;
  padding: 0 0.375rem;
  border-radius: var(--r-code);
}
.screen__file .is-new {
  background: var(--on-tint);
  color: var(--on-ink);
}
.screen__file .is-new::before {
  content: "+ ";
}
.screen__file .is-muted {
  color: var(--ink-faint);
}

.gate {
  scroll-margin-top: 5rem;
}
.gate__body {
  display: grid;
  gap: var(--s7);
  max-width: 52rem;
}
.gate__step {
  display: grid;
  gap: var(--s3);
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.gate__label {
  display: flex;
  align-items: center;
  gap: var(--s3);
  padding: 0;
  font-family: var(--font-display);
  font-size: var(--fs-title);
  font-weight: 600;
  line-height: var(--lh-title);
  letter-spacing: -0.01em;
  color: var(--plum);
}
.gate__step--who > .gate__label {
  float: left;
  width: 100%;
  margin-bottom: var(--s3);
}
.gate__step--who > .gate__label + * {
  clear: left;
}
.gate__num {
  display: inline-grid;
  flex: none;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--plum);
  color: var(--on-plum);
  font-family: var(--font-sans);
  font-size: var(--fs-micro);
  font-weight: 700;
  letter-spacing: 0;
}
.gate__who {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2);
}
.gate__pick {
  position: relative;
  color: var(--plum);
}
.gate__pick input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.gate__pick:has(input:checked) {
  
  color: var(--plum);
  background: var(--honey-tint);
  box-shadow: 0 0 0 2px var(--honey);
}
.gate__pick:has(input:focus-visible) {
  outline: 3px solid var(--honey);
  outline-offset: 3px;
}
.gate__count {
  margin-left: 0.3em;
  font-weight: 500;
  color: var(--ink-soft);
}
.gate__hint,
.gate__levels {
  font-size: var(--fs-small);
  color: var(--plum-body);
}
.gate__levels {
  color: var(--ink-soft);
}

.gate__report {
  overflow: hidden;
  padding: 0;
  border-radius: var(--r-inner);
  font-size: var(--fs-small);
  line-height: 1.55;
}
.gate__file {
  padding: var(--s3) var(--s5);
  border-bottom: 1px solid var(--hairline);
  font-size: var(--fs-label);
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--ink-soft);
}
.gate__list {
  list-style: none;
}
.gate__finding {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--s3) var(--s5);
  align-items: start;
  padding: var(--s5);
  transition: background-color var(--t-quick) var(--ease);
}
.gate__finding + .gate__finding {
  border-top: 1px solid var(--hairline);
}
.gate__what {
  font-weight: 700;
  color: var(--plum);
}
.gate__why,
.gate__how {
  margin-top: var(--s1);
  color: var(--plum-body);
}
.gate__main {
  transition: opacity var(--t-quick) var(--ease);
}
.gate__side {
  display: grid;
  justify-items: end;
  gap: var(--s3);
}
.gate__state,
.gate__verdict {
  padding: 0.2em 0.75em 0.24em;
  border-radius: var(--pill);
  font-size: var(--fs-label);
  font-weight: 700;
  white-space: nowrap;
  transition: background-color var(--t-quick) var(--ease), color var(--t-quick) var(--ease);
}
.gate__state {
  background: var(--ground-shade);
  color: var(--ink-soft);
}
.gate__fix {
  min-height: 2.5rem;
  padding: 0 1.1rem;
  font-size: var(--fs-micro);
}
.gate__finding.is-blocking {
  background: color-mix(in srgb, var(--rose-tint) 45%, transparent);
}
.gate__finding.is-blocking .gate__state {
  background: var(--rose-tint);
  color: var(--rose-ink);
}
.gate__finding[data-severity="warn"]:not(.is-fixed) .gate__state {
  background: var(--honey-tint);
  color: var(--honey-ink);
}
.gate__finding.is-noted .gate__main {
  opacity: 0.6;
}
.gate__finding.is-fixed .gate__state {
  background: var(--on-tint);
  color: var(--on-ink);
}
.gate__finding.is-fixed .gate__what > :first-child {
  text-decoration: line-through;
  text-decoration-color: var(--on);
}
.gate__finding.is-fixed .gate__fix {
  --btn-bg: transparent;
  --btn-shadow: 0 0 0 1px var(--hairline-strong);
}

.gate__end {
  display: grid;
  gap: var(--s2);
  padding: var(--s5);
  border-top: 1px solid var(--hairline-strong);
  background: color-mix(in srgb, var(--rose-tint) 60%, transparent);
  transition: background-color var(--t-quick) var(--ease);
}
.gate__verdict {
  padding: 0;
  font-size: inherit;
  white-space: normal;
  color: var(--rose-ink);
}
.gate.is-ready .gate__end {
  background: var(--on-tint);
}
.gate.is-ready .gate__verdict {
  color: var(--on-ink);
}
.gate.is-ready .gate__end .gate__num {
  background: var(--on);
}
.gate__next {
  padding-left: calc(2rem + var(--s3));
  color: var(--on-ink);
}
.gate__limit {
  padding: var(--s3) var(--s5);
  border-top: 1px solid var(--hairline);
  font-size: var(--fs-micro);
  color: var(--ink-soft);
}
.gate__more .textlink {
  font-weight: 600;
}
@media (max-width: 560px) {
  .gate__finding {
    grid-template-columns: minmax(0, 1fr);
    padding: var(--s4);
  }
  .gate__side {
    grid-auto-flow: column;
    justify-content: space-between;
    align-items: center;
  }
  .gate__file,
  .gate__end,
  .gate__limit {
    padding-inline: var(--s4);
  }
  .gate__next {
    padding-left: 0;
  }
}

.end {
  padding-bottom: var(--s11);
  text-align: center;
}
.end__head {
  margin-inline: auto;
  justify-items: center;
}
.end__head .section__kicker {
  display: inline-flex;
  align-items: center;
  gap: var(--s2);
}
.end__body {
  display: grid;
  justify-items: center;
  gap: var(--s6);
}
.end__doors {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s3);
}
.end__guide {
  color: var(--plum-body);
}
.end__guide .textlink {
  margin-right: var(--s2);
  font-weight: 600;
}
.end__quiet {
  margin-top: var(--s6);
  font-size: var(--fs-small);
  color: var(--ink-soft);
}

.landing .site-footer {
  background: transparent;
}

@media (max-width: 1000px) {
  .hero__stage {
    grid-template-columns: minmax(0, 1fr);
  }
  .hero__stage {
    min-height: 0;
    padding-block: var(--s8) var(--s9);
  }
  .sightings {
    grid-template-columns: minmax(0, 1fr);
  }
  .day {
    padding-block: var(--s9);
  }
}
@media (max-width: 560px) {
  .hero__actions {
    flex-direction: column;
    align-items: stretch;
  }
  .end__doors .btn {
    width: 100%;
    white-space: normal;
    text-align: center;
  }
  .day > .scene {
    padding: var(--s4);
  }
}

@media (prefers-reduced-motion: reduce) {
  .sky__layer,
  .fx__layer,
  .fx--next .sunball {
    transition: none !important;
  }
}