:root {
  color-scheme: light;
  --background: #f5fbfa;
  --surface: rgba(255, 255, 255, 0.9);
  --surface-strong: #ffffff;
  --border: rgba(15, 118, 110, 0.12);
  --border-bright: rgba(20, 184, 166, 0.3);
  --text: #172033;
  --muted: #667085;
  --blue: #0ea5e9;
  --cyan: #14b8a6;
  --purple: #38bdf8;
  --green: #10b981;
  --shadow: 0 24px 70px rgba(15, 118, 110, 0.12);
}

body {
  color: var(--text);
  background:
    radial-gradient(circle at 12% 16%, rgba(45, 212, 191, 0.16), transparent 27rem),
    radial-gradient(circle at 88% 14%, rgba(125, 211, 252, 0.2), transparent 30rem),
    linear-gradient(180deg, #fbfefe 0%, #f4fbfa 52%, #f8fcfc 100%);
}

body::before {
  opacity: 0.62;
  background-image:
    linear-gradient(rgba(15, 118, 110, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 118, 110, 0.045) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.32) 72%, transparent);
}

.ambient { filter: blur(110px); opacity: 0.18; }
.ambient-one { background: #5eead4; }
.ambient-two { background: #7dd3fc; }

.skip-link { color: white; background: #0f766e; }

.site-header {
  min-height: 68px;
  margin-top: 16px;
  padding: 0 20px;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(15, 118, 110, 0.1);
  border-radius: 16px;
  box-shadow: 0 12px 36px rgba(15, 118, 110, 0.07);
  backdrop-filter: blur(20px);
}

.brand { color: #172033; }
.brand img { box-shadow: 0 9px 24px rgba(20, 184, 166, 0.2); }
.text-link, .footer-links a { color: #667085; }
.text-link:hover, .footer-links a:hover { color: #0f766e; }

.account-button {
  color: #0f766e;
  background: rgba(20, 184, 166, 0.08);
  border-color: rgba(20, 184, 166, 0.2);
}

.account-button:hover {
  color: #0b5f59;
  background: rgba(20, 184, 166, 0.13);
  border-color: rgba(20, 184, 166, 0.35);
}

.account-button.is-authenticated {
  color: #047857;
  background: rgba(16, 185, 129, 0.09);
  border-color: rgba(16, 185, 129, 0.22);
}

.language-switch {
  color: #667085;
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(15, 118, 110, 0.12);
}

.language-switch:hover { border-color: rgba(20, 184, 166, 0.35); }
.language-switch .language-active { color: #0f766e; }

.hero {
  grid-template-columns: minmax(0, 1.03fr) minmax(390px, 0.82fr);
  min-height: 650px;
  padding: 74px 0 62px;
}

.release-pill {
  color: #0f766e;
  background: rgba(20, 184, 166, 0.08);
  border-color: rgba(20, 184, 166, 0.18);
}

.release-pill strong { color: #0b5f59; }
.pulse { background: #10b981; box-shadow: 0 0 0 5px rgba(16, 185, 129, 0.1); }

h1 {
  color: #172033;
  font-size: clamp(46px, 5.6vw, 72px);
}

.gradient-text {
  color: transparent;
  background: linear-gradient(98deg, #0f766e 8%, #14b8a6 46%, #0ea5e9 92%);
  background-clip: text;
  -webkit-background-clip: text;
}

.hero-description { color: #667085; }

.primary-button {
  color: white;
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  border-color: rgba(13, 148, 136, 0.35);
  box-shadow: 0 16px 38px rgba(20, 184, 166, 0.22);
}

.primary-button:not(.is-disabled):hover {
  box-shadow: 0 20px 48px rgba(20, 184, 166, 0.28);
}

.primary-button small { color: rgba(240, 253, 250, 0.82); }
.secondary-link { color: #0f766e; font-weight: 650; }
.secondary-link:not(.is-disabled):hover { color: #0d9488; }
.account-note, .load-status, .platform-note { color: #718096; }
.load-status.is-error { color: #dc2626; }
.status-spinner { border-color: rgba(15, 118, 110, 0.16); border-top-color: #14b8a6; }

.release-card {
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(15, 118, 110, 0.13);
  box-shadow: 0 28px 80px rgba(15, 118, 110, 0.11);
}

.release-card::before {
  background: linear-gradient(90deg, transparent, rgba(20, 184, 166, 0.6), transparent);
}

.eyebrow { color: #718096; }
.card-topline h2 { color: #172033; }
.status-badge {
  color: #047857;
  background: rgba(16, 185, 129, 0.08);
  border-color: rgba(16, 185, 129, 0.16);
}

.release-meta { border-color: rgba(15, 118, 110, 0.1); }
.release-meta div + div { border-color: rgba(15, 118, 110, 0.1); }
.release-meta dt { color: #718096; }
.release-meta dd { color: #344054; }

.checksum-panel {
  background: #f5fbfa;
  border-color: rgba(15, 118, 110, 0.1);
}

.checksum-panel code { color: #475467; }
.copy-button {
  color: #0f766e;
  background: white;
  border-color: rgba(15, 118, 110, 0.14);
}

.release-notes h3 { color: #344054; }
.release-notes li { color: #667085; }
.release-notes li::before { background: #14b8a6; box-shadow: 0 0 10px rgba(20, 184, 166, 0.55); }

.trust-grid {
  gap: 16px;
  padding: 0 0 54px;
  border: 0;
}

.trust-grid article {
  padding: 24px;
  background: rgba(255, 255, 255, 0.76);
  border: 1px solid rgba(15, 118, 110, 0.1);
  border-radius: 16px;
  box-shadow: 0 14px 42px rgba(15, 118, 110, 0.06);
}

.trust-grid article + article { border-left: 1px solid rgba(15, 118, 110, 0.1); }
.feature-icon {
  color: #0f766e;
  background: rgba(20, 184, 166, 0.09);
  border-color: rgba(20, 184, 166, 0.16);
}

.trust-grid h2 { color: #344054; }
.trust-grid p { color: #667085; }

footer {
  min-height: 104px;
  color: #98a2b3;
  border-top: 1px solid rgba(15, 118, 110, 0.08);
}

.verification-dialog {
  color: #172033;
  background: rgba(255, 255, 255, 0.98);
  border-color: rgba(15, 118, 110, 0.16);
  box-shadow: 0 30px 100px rgba(15, 23, 42, 0.2);
}

.verification-dialog::backdrop {
  background: rgba(15, 23, 42, 0.36);
  backdrop-filter: blur(7px);
}

.dialog-close { color: #667085; }
.dialog-close:hover { color: #172033; background: rgba(15, 118, 110, 0.06); }
.dialog-icon {
  color: #0f766e;
  background: rgba(20, 184, 166, 0.1);
  border-color: rgba(20, 184, 166, 0.18);
}

.dialog-shell > p { color: #667085; }
.dialog-account {
  color: #475467;
  background: #f5fbfa;
  border-color: rgba(15, 118, 110, 0.1);
}

.captcha-slot { color: #667085; }
.verification-status { color: #dc2626 !important; }
.verification-status.is-success { color: #047857 !important; }
.verify-button {
  color: white;
  background: linear-gradient(135deg, #14b8a6, #0d9488);
  box-shadow: 0 10px 28px rgba(20, 184, 166, 0.2);
}

.dialog-shell small { color: #98a2b3; }
:focus-visible { outline-color: #14b8a6; }

@media (max-width: 900px) {
  .hero { min-height: auto; padding-top: 66px; }
  .trust-grid article + article { border-top: 1px solid rgba(15, 118, 110, 0.1); border-left: 1px solid rgba(15, 118, 110, 0.1); }
}

@media (max-width: 620px) {
  .site-header { min-height: 62px; margin-top: 10px; padding: 0 12px; border-radius: 14px; }
  .hero { padding-top: 48px; }
  .account-note { text-align: center; }
  .release-card { box-shadow: 0 20px 60px rgba(15, 118, 110, 0.1); }
}