:root {
  --lb-ink: #2c2622;
  --lb-ink-soft: #463d33;
  --lb-ink-muted: #6b5f52;
  --lb-paper: #f0eee6;
  --lb-desktop: #d9ccb2;

  /* Wordmark rule + favicon use the cool half of Apple's original six (below).
     The mini header logo keeps the full six, same as the favicon. */
  --lb-green: #6aa84f;
  --lb-gold: #e0a92e;
  --lb-orange: #d97a2b;
  --lb-crimson: #c0453f;
  --lb-purple: #7d5296;
  --lb-blue: #3a6ea5;
  --lb-yellow: #e8c877; /* kept only for the button */

  /* Links take the blue stripe, deepened to 5.9:1 on paper (WCAG AA). */
  --lb-link: #2f5f8f;
  --lb-link-hover: #24486d;

  --lb-error: #b3261e;
}

html, body { margin: 0; }

body {
  background: var(--lb-desktop);
  background-image: radial-gradient(#2c262233 1px, transparent 1px);
  background-size: 3px 3px;
  font-family: 'Pixelify Sans', system-ui, sans-serif;
  color: var(--lb-ink);
}

* { box-sizing: border-box; }

a { color: var(--lb-link); text-decoration: none; }
a:hover { color: var(--lb-link-hover); }

.lb-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ---------- menu bar ---------- */

.lb-menubar {
  height: 30px;
  background: var(--lb-paper);
  border-bottom: 2px solid var(--lb-ink);
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 0 16px;
  font: 400 15px 'Pixelify Sans';
  color: var(--lb-ink);
  flex: none;
}

.lb-brand { display: flex; align-items: center; gap: 9px; }
.lb-brand-name { font-weight: 600; }

.lb-logo {
  width: 14px;
  height: 14px;
  background: linear-gradient(
    var(--lb-green) 0 16.66%,
    var(--lb-gold) 16.66% 33.33%,
    var(--lb-orange) 33.33% 50%,
    var(--lb-crimson) 50% 66.66%,
    var(--lb-purple) 66.66% 83.33%,
    var(--lb-blue) 83.33% 100%
  );
}

.lb-menubar-right {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 12px;
}

.lb-llms {
  font: 400 10px 'Silkscreen';
  color: var(--lb-link);
  border: 1px solid var(--lb-link);
  padding: 3px 7px;
}

.lb-llms:hover { color: var(--lb-link-hover); border-color: var(--lb-link-hover); }

.lb-clock { font: 400 12px 'Silkscreen'; color: var(--lb-ink); }

/* ---------- hero window ---------- */

.lb-stage {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
}

.lb-window {
  width: 640px;
  max-width: 100%;
  background: var(--lb-paper);
  border: 2px solid var(--lb-ink);
  box-shadow: 7px 7px 0 #2c262233;
}

.lb-titlebar {
  position: relative;
  height: 24px;
  border-bottom: 2px solid var(--lb-ink);
  background: repeating-linear-gradient(var(--lb-ink) 0 1px, transparent 1px 3px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.lb-titlebar-close {
  position: absolute;
  left: 7px;
  top: 4px;
  width: 13px;
  height: 13px;
  background: var(--lb-paper);
  border: 2px solid var(--lb-ink);
}

.lb-titlebar-label {
  background: var(--lb-paper);
  padding: 0 12px;
  font: 400 13px 'Silkscreen';
  color: var(--lb-ink);
}

.lb-window-body { padding: 40px 44px 38px; }

/* ---------- wordmark ---------- */

.lb-wordmark { margin: 0; display: inline-block; }

.lb-wordmark-text {
  display: block;
  font: 600 60px/0.9 'Pixelify Sans';
  color: var(--lb-ink);
  letter-spacing: -0.01em;
}

.lb-wordmark-box { color: var(--lb-blue); }

.lb-wordmark-rule {
  display: block;
  margin-top: 8px;
  height: 7px;
  background: linear-gradient(90deg,
    var(--lb-green) 0 33.33%,
    var(--lb-blue) 33.33% 66.66%,
    var(--lb-purple) 66.66% 100%
  );
}

.lb-tagline {
  margin: 20px 0 0;
  font: 400 22px/1.32 'Pixelify Sans';
  color: var(--lb-ink-soft);
  max-width: 520px;
}

/* ---------- waitlist form ---------- */

.lb-form { margin-top: 30px; }

.lb-form label {
  display: block;
  font: 400 11px 'Silkscreen';
  color: var(--lb-ink-muted);
  margin-bottom: 9px;
}

.lb-form-row {
  display: flex;
  gap: 11px;
  align-items: stretch;
  max-width: 480px;
}

.lb-form input {
  flex: 1;
  min-width: 0;
  border: 2px solid var(--lb-ink);
  background: #fff;
  padding: 11px 13px;
  font: 400 20px 'VT323';
  color: var(--lb-ink);
  outline: none;
}

.lb-form button {
  border: 2px solid var(--lb-ink);
  background: var(--lb-yellow);
  padding: 0 22px;
  font: 600 16px 'Pixelify Sans';
  color: var(--lb-ink);
  cursor: pointer;
  box-shadow: 3px 3px 0 var(--lb-ink);
}

.lb-form button:active {
  transform: translate(3px, 3px);
  box-shadow: 0 0 0 var(--lb-ink);
}

.lb-form button:disabled {
  cursor: wait;
  opacity: 0.65;
  transform: translate(3px, 3px);
  box-shadow: 0 0 0 var(--lb-ink);
}

.lb-done,
.lb-error {
  margin-top: 30px;
  border: 2px solid var(--lb-ink);
  padding: 13px 15px;
  font: 400 20px 'VT323';
  color: var(--lb-ink);
  max-width: 480px;
}

.lb-done { background: #e9f0e0; }

.lb-error {
  margin-top: 16px;
  background: #f3e1de;
  color: var(--lb-error);
  border-color: var(--lb-error);
}

/* ---------- small screens ---------- */

@media (max-width: 560px) {
  .lb-window-body { padding: 28px 22px 26px; }
  .lb-wordmark-text { font-size: 44px; }
  .lb-tagline { font-size: 19px; }
  .lb-form-row { flex-direction: column; }
  .lb-form button { padding: 12px 22px; }
}