/* anaphase.ai · v11 "the organism"
   The letterhead reduced to its name, floating over a live wireframe
   fractal. Same paper, same ink, same one green accent. Light only. */

/* Bitstream Charter, (c) 1989-1992 Bitstream Inc., freely licensed --
   the wordmark's seven letters ride along (~3 KB) for platforms
   without the family installed; notice kept in the font's name table */
@font-face {
  font-family: Charter;
  src: local("Charter"),
    url("data:font/woff2;base64,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") format("woff2");
}

:root {
  --paper: #f6f3ec;
  --ink: #211f19;
  --accent: #155d3e;
  --serif: Charter, "Bitstream Charter", "Iowan Old Style", Georgia, "Times New Roman", serif;
  color-scheme: light;
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  overflow: hidden;
  overscroll-behavior: none;
}

#scene {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  cursor: grab;
  touch-action: none;
}

#scene:active { cursor: grabbing; }

#scene:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

.wordmark {
  position: fixed;
  top: clamp(28px, 7vh, 64px);
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  font-size: clamp(30px, 5.2vw, 44px);
  font-weight: 400;
  letter-spacing: -0.01em;
  line-height: 1.1;
  color: var(--ink);
  pointer-events: none;
  user-select: none;
  text-shadow: 0 0 16px var(--paper), 0 0 5px var(--paper);
  animation: wordmark-in 1.6s cubic-bezier(0.22, 0.61, 0.21, 1) 0.55s both;
}

/* the name arrives as the sphere resolves */
@keyframes wordmark-in {
  from { opacity: 0; transform: translateX(-50%) translateY(7px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

/* no WebGL2 (or no scripts): the letterhead alone, centered */

.flat #scene { display: none; }

.flat .wordmark {
  top: 50%;
  transform: translate(-50%, -50%);
  animation: none;
}

/* scripts off entirely: same letterhead, no class to lean on */
@media (scripting: none) {
  #scene { display: none; }
  .wordmark {
    top: 50%;
    transform: translate(-50%, -50%);
    animation: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
  .wordmark { animation: none; }
}
