/* BBS-style ANSI-colored ASCII (exported from o.html) — pre markup unchanged */
.bbs-hero-fullbleed {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(45, 215, 245, 0.09), transparent 55%),
    radial-gradient(ellipse 60% 40% at 80% 30%, rgba(230, 86, 245, 0.06), transparent 50%),
    linear-gradient(180deg, #050508 0%, #0a0a12 45%, #060609 100%);
  padding: 1.75rem 0.5rem 2.25rem;
  margin-bottom: calc(1.5rem + var(--spacing-unit, 1rem));
  border-bottom: 1px solid rgba(30, 30, 50, 0.9);
  box-shadow:
    inset 0 0 0 1px rgba(45, 215, 245, 0.1),
    inset 0 -2px 24px rgba(45, 215, 245, 0.04),
    0 12px 40px rgba(0, 0, 0, 0.55);
  position: relative;
}

.bbs-hero-fullbleed::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    rgba(45, 215, 245, 0.06) 0%,
    transparent 15%,
    transparent 85%,
    rgba(230, 86, 245, 0.05) 100%
  );
}

.bbs-hero-inner {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  position: relative;
  z-index: 1;
  /* Lets the ASCII pre scale from the actual content width (container queries) */
  container-type: inline-size;
  container-name: bbs-hero;
}

.bbs-hero-inner pre {
  margin: 0;
  padding: 0;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
  font-size: clamp(5px, 1.15vw, 10px);
  line-height: 1.15;
  letter-spacing: 0;
  white-space: pre;
  background: transparent;
  border: none;
  color: #6b7280;
}

@media (max-width: 767px) {
  .bbs-hero-fullbleed {
    /* Top / bottom / gap to body: match horizontal gutters (was 2.25rem bottom + ~2.5rem margin) */
    padding-top: var(--spacing-unit, 1rem);
    padding-bottom: var(--spacing-unit, 1rem);
    margin-bottom: var(--spacing-unit, 1rem);
    padding-left: max(var(--spacing-unit, 1rem), env(safe-area-inset-left, 0px));
    padding-right: max(var(--spacing-unit, 1rem), env(safe-area-inset-right, 0px));
  }

  .bbs-hero-inner {
    overflow-x: visible;
  }

  /*
   * Longest ASCII line = 149 chars. Monospace advance ≈ 0.62–0.7em; divisor ~104
   * keeps the full art within the hero width without horizontal scroll.
   */
  .bbs-hero-inner pre {
    font-size: clamp(2.5px, calc(100dvw / 112), 6.25px);
    margin-inline: auto;
  }
}

@supports (container-type: inline-size) {
  @media (max-width: 767px) {
    .bbs-hero-inner pre {
      font-size: clamp(2.5px, calc(100cqi / 108), 6.25px);
    }
  }
}

/* Wider viewports: true full-bleed from centered main column */
@media (min-width: 768px) {
  .bbs-hero-fullbleed {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
}

.c2dd7f5 { color: rgb(45,215,245); }
.c19cdf5 { color: rgb(25,205,245); }
.c23c3f5 { color: rgb(35,195,245); }
.c19739b { color: rgb(25,115,155); }
.ca523ff { color: rgb(165,35,255); }
.cc319f5 { color: rgb(195,25,245); }
.ce123eb { color: rgb(225,35,235); }
.c2df5f5 { color: rgb(45,245,245); }
.c0f9bb9 { color: rgb(15,155,185); }
.c2de1f5 { color: rgb(45,225,245); }
.c2de1eb { color: rgb(45,225,235); }
.c0faff5 { color: rgb(15,175,245); }
.c5f1991 { color: rgb(95,25,145); }
.cc30fd7 { color: rgb(195,15,215); }
.cff7355 { color: rgb(255,115,85); }
.cf59b37 { color: rgb(245,155,55); }
.c37f5ff { color: rgb(55,245,255); }
.c19cde1 { color: rgb(25,205,225); }
.c0f91f5 { color: rgb(15,145,245); }
.c195f69 { color: rgb(25,95,105); }
.c8719f5 { color: rgb(135,25,245); }
.ca505af { color: rgb(165,5,175); }
.cc34b05 { color: rgb(195,75,5); }
.c19e1f5 { color: rgb(25,225,245); }
.c23b9d7 { color: rgb(35,185,215); }
.c690ff5 { color: rgb(105,15,245); }
.c6905c3 { color: rgb(105,5,195); }
.c910fd7 { color: rgb(145,15,215); }
.cff6905 { color: rgb(255,105,5); }
.cff552d { color: rgb(255,85,45); }
.c737373 { color: rgb(115,115,115); }
.c7d554b { color: rgb(125,85,75); }
.c737d7d { color: rgb(115,125,125); }
.c878787 { color: rgb(135,135,135); }
.c919191 { color: rgb(145,145,145); }
.c7d7d7d { color: rgb(125,125,125); }
.c9b9ba5 { color: rgb(155,155,165); }
.c4b87a5 { color: rgb(75,135,165); }
.c37afff { color: rgb(55,175,255); }
.c696969 { color: rgb(105,105,105); }
.ca50feb { color: rgb(165,15,235); }
.c7d419b { color: rgb(125,65,155); }
.c876991 { color: rgb(135,105,145); }
.c736973 { color: rgb(115,105,115); }
.ceb19b9 { color: rgb(235,25,185); }
.c5f555f { color: rgb(95,85,95); }
.c4b4b4b { color: rgb(75,75,75); }
.c55c3ff { color: rgb(85,195,255); }
.c2387eb { color: rgb(35,135,235); }
.c4bafeb { color: rgb(75,175,235); }
.c190569 { color: rgb(25,5,105); }
.c695f7d { color: rgb(105,95,125); }
.c9b230f { color: rgb(155,35,15); }
.ce1870f { color: rgb(225,135,15); }
.cffc305 { color: rgb(255,195,5); }
.cfff519 { color: rgb(255,245,25); }
.cfff54b { color: rgb(255,245,75); }
.cfff5f5 { color: rgb(255,245,245); }
.c9b7337 { color: rgb(155,115,55); }
.c87f5ff { color: rgb(135,245,255); }
.c0f4bf5 { color: rgb(15,75,245); }
.cf54169 { color: rgb(245,65,105); }
.c373741 { color: rgb(55,55,65); }
.cffe105 { color: rgb(255,225,5); }
.cfff59b { color: rgb(255,245,155); }
.c55f5ff { color: rgb(85,245,255); }
.c41e1f5 { color: rgb(65,225,245); }
.c69f5ff { color: rgb(105,245,255); }
.ca5ffff { color: rgb(165,255,255); }
.cf59bf5 { color: rgb(245,155,245); }
.cf569f5 { color: rgb(245,105,245); }
.cf541f5 { color: rgb(245,65,245); }
.c9b1941 { color: rgb(155,25,65); }
.cff5f91 { color: rgb(255,95,145); }
.cff87a5 { color: rgb(255,135,165); }
.cffcdeb { color: rgb(255,205,235); }
.cff9105 { color: rgb(255,145,5); }
.cffa505 { color: rgb(255,165,5); }
.cd7ffff { color: rgb(215,255,255); }
.ca5cdff { color: rgb(165,205,255); }
.c697dff { color: rgb(105,125,255); }
.cc39bff { color: rgb(195,155,255); }
.ceb1987 { color: rgb(235,25,135); }
.ceb0f41 { color: rgb(235,15,65); }
.cff7d05 { color: rgb(255,125,5); }
.cffaf23 { color: rgb(255,175,35); }
.cc3ffff { color: rgb(195,255,255); }
.c3755ff { color: rgb(55,85,255); }
.c412df5 { color: rgb(65,45,245); }
.c8755ff { color: rgb(135,85,255); }
.ccd41f5 { color: rgb(205,65,245); }
.c190faf { color: rgb(25,15,175); }
.c0573f5 { color: rgb(5,115,245); }
.cf53705 { color: rgb(245,55,5); }
.cf55505 { color: rgb(245,85,5); }
.c0f2de1 { color: rgb(15,45,225); }
.c37cde1 { color: rgb(55,205,225); }
.c69190f { color: rgb(105,25,15); }
.ceb1905 { color: rgb(235,25,5); }