html {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='32' shape-rendering='crispEdges'%3E%3Cpath d='M0 0h2v2h-2zM0 2h2v2h-2zM2 2h2v2h-2zM0 4h2v2h-2zM4 4h2v2h-2zM0 6h2v2h-2zM6 6h2v2h-2zM0 8h2v2h-2zM8 8h2v2h-2zM0 10h2v2h-2zM10 10h2v2h-2zM0 12h2v2h-2zM12 12h2v2h-2zM0 14h2v2h-2zM14 14h2v2h-2zM0 16h2v2h-2zM16 16h2v2h-2zM0 18h2v2h-2zM18 18h2v2h-2zM0 20h2v2h-2zM12 20h2v2h-2zM14 20h2v2h-2zM16 20h2v2h-2zM18 20h2v2h-2zM20 20h2v2h-2zM0 22h2v2h-2zM6 22h2v2h-2zM12 22h2v2h-2zM0 24h2v2h-2zM4 24h2v2h-2zM6 24h2v2h-2zM8 24h2v2h-2zM14 24h2v2h-2zM0 26h2v2h-2zM2 26h2v2h-2zM8 26h2v2h-2zM14 26h2v2h-2zM10 28h2v2h-2zM16 28h2v2h-2zM10 30h2v2h-2zM12 30h2v2h-2zM14 30h2v2h-2z' fill='%2305060c'/%3E%3Cpath d='M2 4h2v2h-2zM2 6h2v2h-2zM2 8h2v2h-2zM2 10h2v2h-2zM2 12h2v2h-2zM2 14h2v2h-2zM2 16h2v2h-2zM2 18h2v2h-2zM2 20h2v2h-2zM2 22h2v2h-2z' fill='%23e6f6f1'/%3E%3Cpath d='M4 6h2v2h-2zM4 8h2v2h-2zM6 8h2v2h-2zM4 10h2v2h-2zM6 10h2v2h-2zM8 10h2v2h-2zM4 12h2v2h-2zM6 12h2v2h-2zM8 12h2v2h-2zM10 12h2v2h-2zM4 14h2v2h-2zM6 14h2v2h-2zM8 14h2v2h-2zM10 14h2v2h-2zM12 14h2v2h-2zM4 16h2v2h-2zM6 16h2v2h-2zM8 16h2v2h-2zM10 16h2v2h-2zM12 16h2v2h-2zM14 16h2v2h-2zM4 18h2v2h-2zM6 18h2v2h-2zM8 18h2v2h-2zM10 18h2v2h-2zM12 18h2v2h-2zM14 18h2v2h-2zM16 18h2v2h-2zM4 20h2v2h-2zM6 20h2v2h-2zM8 20h2v2h-2zM10 20h2v2h-2zM4 22h2v2h-2zM8 22h2v2h-2zM10 22h2v2h-2zM2 24h2v2h-2zM10 24h2v2h-2zM12 24h2v2h-2zM10 26h2v2h-2zM12 26h2v2h-2zM12 28h2v2h-2zM14 28h2v2h-2z' fill='%238fe3cf'/%3E%3C/svg%3E") 1 1, auto;
}

a,
button,
summary,
[role="tab"],
label {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='32' shape-rendering='crispEdges'%3E%3Cpath d='M10 0h2v2h-2zM12 0h2v2h-2zM8 2h2v2h-2zM14 2h2v2h-2zM8 4h2v2h-2zM14 4h2v2h-2zM8 6h2v2h-2zM14 6h2v2h-2zM8 8h2v2h-2zM14 8h2v2h-2zM16 8h2v2h-2zM18 8h2v2h-2zM8 10h2v2h-2zM14 10h2v2h-2zM20 10h2v2h-2zM22 10h2v2h-2zM4 12h2v2h-2zM6 12h2v2h-2zM8 12h2v2h-2zM14 12h2v2h-2zM20 12h2v2h-2zM26 12h2v2h-2zM2 14h2v2h-2zM8 14h2v2h-2zM14 14h2v2h-2zM20 14h2v2h-2zM26 14h2v2h-2zM2 16h2v2h-2zM26 16h2v2h-2zM4 18h2v2h-2zM26 18h2v2h-2zM4 20h2v2h-2zM26 20h2v2h-2zM6 22h2v2h-2zM24 22h2v2h-2zM6 24h2v2h-2zM24 24h2v2h-2zM8 26h2v2h-2zM22 26h2v2h-2zM8 28h2v2h-2zM22 28h2v2h-2zM8 30h2v2h-2zM10 30h2v2h-2zM12 30h2v2h-2zM14 30h2v2h-2zM16 30h2v2h-2zM18 30h2v2h-2zM20 30h2v2h-2zM22 30h2v2h-2z' fill='%2305060c'/%3E%3Cpath d='M10 2h2v2h-2zM10 4h2v2h-2zM10 6h2v2h-2zM10 8h2v2h-2zM10 10h2v2h-2zM16 10h2v2h-2zM10 12h2v2h-2zM16 12h2v2h-2zM22 12h2v2h-2zM4 14h2v2h-2zM10 14h2v2h-2zM16 14h2v2h-2zM22 14h2v2h-2zM4 16h2v2h-2z' fill='%23ffb0b7'/%3E%3Cpath d='M12 2h2v2h-2zM12 4h2v2h-2zM12 6h2v2h-2zM12 8h2v2h-2zM12 10h2v2h-2zM18 10h2v2h-2zM12 12h2v2h-2zM18 12h2v2h-2zM24 12h2v2h-2zM6 14h2v2h-2zM12 14h2v2h-2zM18 14h2v2h-2zM24 14h2v2h-2zM6 16h2v2h-2zM8 16h2v2h-2zM10 16h2v2h-2zM12 16h2v2h-2zM14 16h2v2h-2zM16 16h2v2h-2zM18 16h2v2h-2zM20 16h2v2h-2zM22 16h2v2h-2zM24 16h2v2h-2zM6 18h2v2h-2zM8 18h2v2h-2zM10 18h2v2h-2zM12 18h2v2h-2zM14 18h2v2h-2zM16 18h2v2h-2zM18 18h2v2h-2zM20 18h2v2h-2zM22 18h2v2h-2zM24 18h2v2h-2zM6 20h2v2h-2zM8 20h2v2h-2zM10 20h2v2h-2zM12 20h2v2h-2zM14 20h2v2h-2zM16 20h2v2h-2zM18 20h2v2h-2zM20 20h2v2h-2zM22 20h2v2h-2zM24 20h2v2h-2zM8 22h2v2h-2zM10 22h2v2h-2zM12 22h2v2h-2zM14 22h2v2h-2zM16 22h2v2h-2zM18 22h2v2h-2zM20 22h2v2h-2zM22 22h2v2h-2zM8 24h2v2h-2zM10 24h2v2h-2zM12 24h2v2h-2zM14 24h2v2h-2zM16 24h2v2h-2zM18 24h2v2h-2zM20 24h2v2h-2zM22 24h2v2h-2zM10 26h2v2h-2zM12 26h2v2h-2zM14 26h2v2h-2zM16 26h2v2h-2zM18 26h2v2h-2zM20 26h2v2h-2z' fill='%23ff3b4e'/%3E%3Cpath d='M10 28h2v2h-2zM12 28h2v2h-2zM14 28h2v2h-2zM16 28h2v2h-2zM18 28h2v2h-2zM20 28h2v2h-2z' fill='%238fe3cf'/%3E%3C/svg%3E") 11 1, pointer;
}

button:disabled {
  cursor: not-allowed;
}

.lfs-fx {
  position: fixed;
  z-index: 96;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  image-rendering: pixelated;
}

.lfs-boot {
  position: fixed;
  z-index: 99;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.25) 0 1px, transparent 1px 3px),
    var(--void);
  color: var(--mint);
  font-family: var(--font-pixel);
  text-shadow: 0 0 8px rgba(143, 227, 207, 0.6);
}

.lfs-boot.is-off {
  animation: lfs-off-screen 0.4s steps(5) forwards;
}

.lfs-boot__inner {
  display: grid;
  gap: 10px;
  width: min(560px, 100%);
  font-size: 1.05rem;
}

.lfs-boot__inner p {
  margin: 0;
}

.lfs-boot__inner > p:first-child {
  color: var(--muted);
}

.lfs-boot__line,
.lfs-boot__bar,
.lfs-boot__ready,
.lfs-boot__skip {
  animation: lfs-appear 0.01s steps(1) both;
}

.lfs-boot__line { animation-delay: 0.15s; }
.lfs-boot__bar { animation-delay: 0.3s; }
.lfs-boot__ready { animation-delay: 1.15s; }
.lfs-boot__skip { animation-delay: 0.4s; }

.lfs-boot__dots::after {
  content: "";
  animation: lfs-dots 0.9s steps(4) infinite;
}

.lfs-boot__bar {
  height: 18px;
  padding: 3px;
  box-shadow: inset 0 0 0 2px var(--mint-deep);
}

.lfs-boot__bar span {
  display: block;
  width: 0;
  height: 100%;
  background: repeating-linear-gradient(90deg, var(--mint) 0 10px, transparent 10px 13px);
  animation: lfs-load 0.85s steps(12) 0.3s forwards;
}

.lfs-boot__ok {
  color: var(--red);
  text-shadow: var(--glow-red);
}

.lfs-boot__skip {
  margin-top: 18px !important;
  color: var(--muted);
  font-size: 0.85rem;
  animation-name: lfs-appear, lfs-blink;
  animation-duration: 0.01s, 1.1s;
  animation-timing-function: steps(1), steps(1);
  animation-iteration-count: 1, infinite;
  animation-fill-mode: both, none;
  animation-delay: 0.4s, 0.4s;
}

@keyframes lfs-appear {
  from { visibility: hidden; }
  to { visibility: visible; }
}

@keyframes lfs-dots {
  0% { content: ""; }
  25% { content: "."; }
  50% { content: ".."; }
  75% { content: "..."; }
}

@keyframes lfs-load {
  to { width: 100%; }
}

@keyframes lfs-off-screen {
  0% { clip-path: inset(0); filter: brightness(1); }
  50% { clip-path: inset(49% 0 49% 0); filter: brightness(3); }
  100% { clip-path: inset(50% 50% 50% 50%); filter: brightness(3); }
}

.lfs-flash {
  position: fixed;
  z-index: 98;
  top: 50%;
  left: 50%;
  color: var(--amber);
  font-family: var(--font-pixel);
  font-size: clamp(1.6rem, 5vw, 3.4rem);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-align: center;
  text-shadow: 4px 4px 0 var(--red-deep), 0 0 24px rgba(244, 207, 93, 0.6);
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%);
}

.lfs-flash.is-on {
  animation: lfs-flash 1.4s steps(8) forwards;
}

@keyframes lfs-flash {
  0% { opacity: 0; transform: translate(-50%, -50%) scale(2.2); }
  15% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
  25% { opacity: 0.4; }
  35% { opacity: 1; }
  80% { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(1); }
}

.lfs-sound,
.lfs-effects {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 6px;
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  background: var(--surface-dark);
  color: var(--muted);
  font-family: var(--font-pixel);
  font-size: 0.82rem;
  clip-path: var(--notch);
  box-shadow: inset 0 0 0 2px var(--line);
}

.lfs-sound,
.lfs-effects {
  position: relative;
  justify-content: center;
  width: 40px;
  padding: 0;
  font-size: 1.05rem;
}

.lfs-effects[aria-pressed="true"] {
  color: var(--amber);
  box-shadow: inset 0 0 0 2px rgba(244, 207, 93, 0.45);
}

.lfs-effects[aria-pressed="false"]::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 22px;
  height: 3px;
  background: var(--red);
  content: "";
  transform: translate(-50%, -50%) rotate(-45deg);
}

.lfs-sound__state {
  display: none;
}

.lfs-sound[aria-pressed="false"]::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 22px;
  height: 3px;
  background: var(--red);
  content: "";
  transform: translate(-50%, -50%) rotate(-45deg);
}

.lfs-sound:hover {
  color: var(--ink);
}

.lfs-sound[aria-pressed="true"] {
  color: var(--mint);
  box-shadow: inset 0 0 0 2px var(--mint-deep);
}

.lfs-sound[aria-pressed="true"] .lfs-sound__waves {
  animation: lfs-blink 0.8s steps(1) infinite;
}

.lfs-sound[aria-pressed="false"] .lfs-sound__waves {
  display: none;
}

@keyframes lfs-bob-note {
  50% { transform: translateY(-2px); }
}

.lfs-dust {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  image-rendering: pixelated;
  pointer-events: none;
}

.lfs-attract {
  position: absolute;
  z-index: 2;
  top: clamp(14px, 3vh, 28px);
  right: var(--gutter);
  left: var(--gutter);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: start;
  font-family: var(--font-pixel);
  font-size: clamp(0.9rem, 1.4vw, 1.2rem);
  letter-spacing: 0.08em;
  pointer-events: none;
}

.lfs-attract__cell {
  display: grid;
  gap: 2px;
  color: var(--ink);
  text-shadow: 2px 2px 0 var(--void);
}

.lfs-attract__cell b {
  color: var(--red);
  font-weight: 600;
  text-transform: uppercase;
  text-shadow: 2px 2px 0 var(--void), 0 0 10px rgba(255, 59, 78, 0.6);
}

.lfs-attract__cell:first-child b {
  animation: lfs-blink 1s steps(1) infinite;
}

.lfs-attract__cell--center {
  text-align: center;
}

.lfs-attract__cell--center b {
  color: var(--amber);
  text-shadow: 2px 2px 0 var(--void), 0 0 10px rgba(244, 207, 93, 0.6);
}

.lfs-attract__cell--right {
  text-align: right;
}

.lfs-attract__cell--right b {
  color: var(--mint);
  text-shadow: 2px 2px 0 var(--void), 0 0 10px rgba(143, 227, 207, 0.6);
}

.lfs-press-enter {
  position: relative;
  z-index: 1;
  margin: -10px 0 0;
  color: var(--ink);
  font-family: var(--font-pixel);
  font-size: 1.05rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-shadow: 0 0 10px rgba(143, 227, 207, 0.6);
  animation: lfs-blink 1.2s steps(1) infinite;
}

.lfs-press-enter span:first-child {
  color: var(--red);
}

.site-banner__media {
  will-change: opacity;
}


.site-banner__actions {
  gap: clamp(16px, 2.4vw, 28px);
}

.site-banner__actions .button--large {
  min-width: clamp(210px, 18vw, 250px);
  min-height: clamp(50px, 6vh, 58px);
  padding: 0 clamp(20px, 2.2vw, 30px) 4px;
  font-size: clamp(0.98rem, 1.15vw, 1.1rem);
  letter-spacing: 0.06em;
  --px: 5px;
}

.site-banner__actions .button--primary {
  box-shadow: inset 0 -6px 0 var(--red-deep), inset 0 4px 0 rgba(255, 255, 255, 0.28);
  animation: lfs-idle-glow 1.6s steps(2) infinite;
}

.site-banner__actions .button--primary:hover {
  animation: none;
}

.site-banner__actions .button--secondary {
  box-shadow: inset 0 0 0 3px var(--mint), inset 0 -6px 0 rgba(143, 227, 207, 0.15);
}

@keyframes lfs-idle-glow {
  50% { background: var(--red-bright); }
}

.section-heading h2 {
  display: inline-block;
  max-width: 100%;
}

.section-heading .eyebrow {
  display: flex;
  width: fit-content;
}

html.js .reveal-pending.is-revealed .section-heading h2 {
  animation: lfs-type 0.9s steps(22) both;
}

@keyframes lfs-type {
  from { clip-path: inset(0 100% 0 0); }
  to { clip-path: inset(0 0 0 0); }
}

.section-heading h2:hover {
  animation: lfs-glitch-text 0.35s steps(3) 1;
}

@keyframes lfs-glitch-text {
  0%, 100% { transform: none; text-shadow: 3px 3px 0 var(--red-deep); }
  33% { transform: translate(-3px, 1px); text-shadow: -3px 0 0 var(--red), 3px 0 0 var(--cyan); clip-path: inset(10% 0 45% 0); }
  66% { transform: translate(3px, -1px); text-shadow: 3px 0 0 var(--red), -3px 0 0 var(--cyan); clip-path: inset(50% 0 5% 0); }
}

:root.lfs-overclock {
  --mint: #ff3b4e;
  --mint-bright: #ff6b78;
  --mint-deep: #a3162a;
  --red: #8fe3cf;
  --red-bright: #b6fbe9;
  --red-deep: #3a7b78;
  --red-night: #07302e;
  --amber: #45d6ff;
}

:root.lfs-overclock .site-banner__frame,
:root.lfs-overclock .closing-cta,
:root.lfs-overclock body[data-page="universe"] .hero-section {
  filter: hue-rotate(165deg) saturate(1.2);
}

:root.lfs-overclock .site-main,
:root.lfs-overclock .site-header__inner {
  animation: lfs-quake 0.5s steps(5) 1;
}

@keyframes lfs-quake {
  20% { transform: translate(-4px, 2px); }
  40% { transform: translate(4px, -2px); }
  60% { transform: translate(-3px, 1px); }
  80% { transform: translate(2px, 0); }
}

.lfs-rain {
  position: fixed;
  z-index: 94;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

@media (max-width: 760px) {
  .lfs-sound,
  .lfs-effects {
    min-height: 34px;
    width: 36px;
  }

  .lfs-attract {
    font-size: 0.78rem;
  }

  .site-banner__actions .button--large {
    min-width: 0;
    min-height: 50px;
    font-size: 0.95rem;
  }

  .lfs-press-enter {
    font-size: 0.9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js .reveal-pending.is-revealed .section-heading h2,
  .section-heading h2:hover,
  .lfs-press-enter,
  .site-banner__media,
  .site-banner__actions .button--primary,
  .lfs-attract__cell:first-child b {
    animation: none;
  }
}

html.lfs-lite body::after,
html.lfs-lite .lfs-fx,
html.lfs-lite .lfs-dust,
html.lfs-lite .lfs-rain,
html.lfs-lite .site-banner__frame::before {
  display: none;
}

html.lfs-lite .site-header {
  background: rgba(7, 9, 18, 0.97);
  backdrop-filter: none;
}

html.lfs-lite *,
html.lfs-lite *::before,
html.lfs-lite *::after {
  animation: none !important;
  transition-duration: 0s !important;
}

html.lfs-lite .site-banner__media {
  filter: drop-shadow(0 6px 0 rgba(5, 6, 12, 0.85));
}
