/* base.css — shared resets, palette, type. Fonts are system-only. */
:root {
  --ink: #eafff5;
  --ink-dim: #8fb8ac;
  --night: #070b16;
  --panel: rgba(9, 22, 30, 0.82);
  --spore: #36e0b0;
  --spore-soft: #1c7d66;
  --crystal: #f058b0;
  --dew: #59e6ff;
  --amber: #ffc86a;
  --edge: rgba(54, 224, 176, 0.35);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  background: var(--night);
  color: var(--ink);
  font-family: "Avenir Next", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none; user-select: none;
}
a { color: var(--dew); text-decoration: none; }
b { color: #fff; font-weight: 700; }
.cta {
  display: inline-block; padding: 0.85em 2.2em; border-radius: 999px;
  background: linear-gradient(135deg, var(--spore), #27c9a2);
  color: #04231a; font-weight: 800; letter-spacing: 0.06em; font-size: 1.05rem;
  box-shadow: 0 0 28px rgba(54, 224, 176, 0.45);
  cursor: pointer; border: none;
}
.cta:hover { transform: translateY(-2px); filter: brightness(1.12); }
.overlay {
  position: fixed; inset: 0; z-index: 30; display: flex;
  align-items: center; justify-content: center;
  background: radial-gradient(ellipse at 50% 40%, rgba(10, 30, 34, 0.86), rgba(4, 6, 14, 0.95));
  backdrop-filter: blur(3px);
}
.overlay .panel {
  max-width: min(620px, 92vw); padding: clamp(18px, 4vw, 40px);
  border: 1px solid var(--edge); border-radius: 18px;
  background: var(--panel); text-align: center;
  box-shadow: 0 0 60px rgba(54, 224, 176, 0.2);
}
.overlay h1 {
  font-size: clamp(1.8rem, 6vw, 3rem); letter-spacing: 0.12em;
  color: var(--spore); text-shadow: 0 0 24px rgba(54, 224, 176, 0.6);
}
.overlay .tag { color: var(--ink-dim); margin: 0.6em 0 1.2em; letter-spacing: 0.06em; }
.overlay .cta { display: inline-block; }
.tiny-link { display: block; margin-top: 1.1em; font-size: 0.85rem; opacity: 0.75; }