:root {
  color-scheme: light;
  --green: #0f6b53;
  --green-dark: #0a4f3e;
  --sage: #a8d5c2;
  --ink: #18231f;
  --muted: #65706b;
  --paper: #f7f5ef;
  --white: #fff;
  --line: #dfe6e2;
  --danger: #9b2f2f;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; width: 100%; min-height: 100%; background: var(--paper); color: var(--ink); }
body { min-height: 100dvh; }
button, input { font: inherit; }
a { color: var(--green); font-weight: 700; }

#beta-shell {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: max(24px, env(safe-area-inset-top)) 18px max(24px, env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 20% 10%, rgba(168,213,194,.28), transparent 34rem),
    var(--paper);
}

.beta-card {
  width: min(100%, 520px);
  background: rgba(255,255,255,.96);
  border: 1px solid rgba(15,107,83,.10);
  border-radius: 28px;
  box-shadow: 0 24px 70px rgba(24,35,31,.12);
  padding: clamp(24px, 6vw, 42px);
}

.beta-logo { display: block; width: min(240px, 72%); height: auto; margin: 0 auto 24px; }
.beta-loading { text-align: center; }
.beta-loading p { color: var(--muted); margin: 14px 0 0; }
.beta-spinner {
  width: 32px; height: 32px; margin: 0 auto;
  border: 3px solid var(--line); border-top-color: var(--green); border-radius: 50%;
  animation: beta-spin .8s linear infinite;
}
@keyframes beta-spin { to { transform: rotate(360deg); } }

.beta-eyebrow { margin: 0 0 8px; color: var(--green); font-weight: 800; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.beta-title { margin: 0; font-size: clamp(1.65rem, 6vw, 2.25rem); line-height: 1.08; letter-spacing: -.035em; }
.beta-intro { margin: 14px 0 24px; color: var(--muted); line-height: 1.55; }
.beta-form { display: grid; gap: 16px; }
.beta-field { display: grid; gap: 7px; }
.beta-field label { font-weight: 750; font-size: .93rem; }
.beta-field input {
  width: 100%; min-height: 50px; border: 1px solid var(--line); border-radius: 14px;
  background: var(--white); color: var(--ink); padding: 0 14px; outline: none;
}
.beta-field input:focus { border-color: var(--green); box-shadow: 0 0 0 4px rgba(15,107,83,.11); }
.beta-hint { color: var(--muted); font-size: .82rem; line-height: 1.4; }
.beta-check { display: grid; grid-template-columns: 22px 1fr; align-items: start; gap: 10px; color: #3b4742; font-size: .88rem; line-height: 1.45; }
.beta-check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--green); }
.beta-actions { display: grid; gap: 10px; margin-top: 4px; }
.beta-button {
  min-height: 52px; border: 0; border-radius: 15px; padding: 0 18px;
  background: var(--green); color: white; font-weight: 800; cursor: pointer;
}
.beta-button:hover { background: var(--green-dark); }
.beta-button:disabled { opacity: .58; cursor: wait; }
.beta-button-secondary { background: #eaf2ee; color: var(--green-dark); }
.beta-button-secondary:hover { background: #dcebe4; }
.beta-message { display: none; border-radius: 13px; padding: 11px 13px; font-size: .88rem; line-height: 1.42; }
.beta-message.visible { display: block; }
.beta-message.error { color: var(--danger); background: #fff0f0; border: 1px solid #f4cccc; }
.beta-message.success { color: var(--green-dark); background: #edf8f3; border: 1px solid #cbe9dc; }
.beta-small { margin: 18px 0 0; color: var(--muted); text-align: center; font-size: .78rem; line-height: 1.45; }
.beta-offline { text-align: center; }
.beta-offline-symbol { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; margin: 0 auto 18px; background: #eaf2ee; color: var(--green); font-size: 1.6rem; }
.beta-admin-link { display: block; margin-top: 18px; text-align: center; font-size: .78rem; opacity: .66; }
.cf-turnstile { min-height: 65px; }

@media (max-width: 480px) {
  #beta-shell { padding-left: 12px; padding-right: 12px; }
  .beta-card { border-radius: 22px; padding: 24px 20px; }
}