.resistance-page {
  background: #dfefff;
  color: var(--ocean);
  overflow: hidden;
}
.lake-sky {
  position: fixed;
  inset: 0;
  z-index: -3;
  background: radial-gradient(ellipse at 50% 25%, #fafdff 0%, #eaf3ff 43%, #c9e1f7 100%);
}
.lake-experience {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
}
#lake {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  touch-action: none;
  cursor: crosshair;
}
.lake-copy {
  position: relative;
  z-index: 2;
  width: min(90vw, 600px);
  text-align: center;
  pointer-events: none;
  transform: translateY(-7vh);
}
.lake-copy h1 {
  font-size: clamp(4rem, 10vw, 8rem);
  color: rgba(27,58,87,.88);
}
.instruction {
  margin: 25px auto 0;
  color: rgba(27,58,87,.62);
  font-size: .86rem;
  line-height: 1.8;
}
.reveal-line {
  margin: 0 auto;
  padding-top: 40px;
  max-width: 430px;
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 1400ms var(--ease), transform 1400ms var(--ease);
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: clamp(1.5rem, 3vw, 2.1rem);
  color: rgba(27,58,87,.86);
}
.reveal-line.visible { opacity: 1; transform: translateY(0); }
.lake-hint {
  position: absolute;
  z-index: 3;
  bottom: 30px;
  margin: 0;
  font-size: .62rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(27,58,87,.45);
  pointer-events: none;
}

@media (max-width: 600px) {
  .lake-copy { transform: translateY(-4vh); }
  .instruction { font-size: .8rem; }
}
