/* Perpetuum · Giraffe launch status (5 Oct 2026). Loaded last. Static: no animation. */

/* desktop nav: quiet tag after the Giraffe link (outside the link, so the section underline keeps measuring "Giraffe" only) */
.nav__beta{display:flex;align-items:center;gap:8px}
.nav__tag{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px 0 8px;border-radius:999px;background:rgba(210,241,84,.14);box-shadow:inset 0 0 0 1px rgba(210,241,84,.55);color:var(--lime);font:600 12px/1 var(--font);letter-spacing:.01em;white-space:nowrap}
.nav__tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.masthead.is-solid .nav__tag{background:var(--lime);box-shadow:none;color:var(--ink)}
@container site (max-width:1279.98px){.nav__tag{padding:0 8px}.nav__tag::before{display:none}}

/* mobile menu: same tag beside "Giraffe", number stays right */
.menu__tag{display:inline-flex;align-items:center;gap:6px;height:26px;margin:0 auto 0 12px;padding:0 10px 0 9px;border-radius:999px;background:rgba(210,241,84,.14);box-shadow:inset 0 0 0 1px rgba(210,241,84,.55);color:var(--lime);font:600 13px/1 var(--font);letter-spacing:.01em;white-space:nowrap}
.menu__tag::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}

/* Giraffe header: compact status directly under the wordmark */
.g-head{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:14px}
.g-by{display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:0 13px 0 11px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(220,214,240,.38);font-size:14px;font-weight:500;line-height:1;color:var(--ivory)}
.g-by__dot{width:7px;height:7px;border-radius:50%;background:var(--lime)}