:root {
  --zy-bg: #06111f;
  --zy-bg-2: #0a1728;
  --zy-panel: rgba(10, 25, 44, 0.88);
  --zy-panel-strong: rgba(9, 22, 39, 0.96);
  --zy-border: rgba(125, 211, 252, 0.18);
  --zy-border-strong: rgba(56, 189, 248, 0.45);
  --zy-text: #eaf6ff;
  --zy-muted: #9fb3c8;
  --zy-soft: #cfe8f8;
  --zy-accent: #38bdf8;
  --zy-accent-2: #22d3ee;
  --zy-accent-dark: #075985;
  --zy-danger: #fbbf24;
  --zy-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

html {
  background: var(--zy-bg);
}

body {
  min-height: 100vh;
  color: var(--zy-text);
  background:
    radial-gradient(circle at 18% 16%, rgba(56, 189, 248, 0.18), transparent 28rem),
    radial-gradient(circle at 84% 8%, rgba(34, 211, 238, 0.11), transparent 26rem),
    linear-gradient(135deg, var(--zy-bg) 0%, var(--zy-bg-2) 54%, #0d2038 100%) !important;
}

.top-nav {
  height: 68px !important;
  padding: 0 46px !important;
  background: rgba(7, 17, 31, 0.96) !important;
  border-bottom: 1px solid var(--zy-border) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(18px);
}

.nav-brand,
.nav-links a,
.nav-trigger,
.nav-back {
  color: var(--zy-text) !important;
}

.nav-brand {
  gap: 12px;
  font-weight: 900 !important;
  letter-spacing: 0.03em;
}

.nav-logo {
  filter: drop-shadow(0 0 10px rgba(56, 189, 248, 0.25));
}

.nav-links a,
.nav-trigger {
  font-weight: 700 !important;
}

.nav-links a:hover,
.nav-links a.active,
.nav-trigger:hover {
  color: #8de8ff !important;
}

.nav-login,
.nav-back {
  border: 1px solid rgba(56, 189, 248, 0.55) !important;
  border-radius: 10px !important;
  background: rgba(14, 116, 144, 0.2) !important;
  color: #c7f5ff !important;
  box-shadow: inset 0 0 18px rgba(56, 189, 248, 0.08);
}

.nav-login:hover,
.nav-back:hover {
  background: rgba(14, 165, 233, 0.28) !important;
  border-color: rgba(103, 232, 249, 0.75) !important;
}

.nav-dropdown-menu {
  background: rgba(7, 17, 31, 0.98) !important;
  border: 1px solid var(--zy-border) !important;
  box-shadow: var(--zy-shadow) !important;
}

.nav-dropdown-menu a {
  color: var(--zy-soft) !important;
}

.nav-dropdown-menu a:hover {
  background: rgba(56, 189, 248, 0.12) !important;
  color: #ffffff !important;
}

.hero-slider {
  min-height: calc(100vh - 68px) !important;
  background:
    radial-gradient(circle at 72% 48%, rgba(56, 189, 248, 0.14), transparent 30rem),
    linear-gradient(135deg, #07111f 0%, #0a192d 55%, #0d2038 100%) !important;
  color: var(--zy-text) !important;
}

.slide,
.slide-bg {
  background: transparent !important;
}

.slide-orb {
  filter: blur(8px);
}

.slide-label,
.section-label,
.hero-badge,
.block-title {
  color: #7dd3fc !important;
}

.slide-char {
  opacity: 1 !important;
  background: linear-gradient(180deg, #f8fdff 0%, #b9e8ff 46%, #5aa7cf 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  text-shadow: 0 28px 80px rgba(56, 189, 248, 0.2);
}

.slide-sep,
.slider-dots button.active,
.slider-dots button:hover {
  background: var(--zy-accent) !important;
}

.slide-claim,
.reveal-line,
.philosophy-desc,
.product-desc,
.page-header p,
.hero-section p,
.product-head p {
  color: var(--zy-soft) !important;
}

.slide-claim em,
.text-blue-glow,
.section-header strong,
.product-cta h2 strong {
  color: #7dd3fc !important;
  text-shadow: 0 0 24px rgba(56, 189, 248, 0.38);
}

.philosophy,
.product-cta,
.products-page,
.download-page,
.store-page,
.page {
  color: var(--zy-text) !important;
  background: transparent !important;
}

.page-header,
.hero-section,
.product-head {
  padding-top: 72px !important;
  padding-bottom: 46px !important;
  color: var(--zy-text) !important;
}

.page-header h1,
.hero-section h1,
.product-head h1,
.section-header h2,
.product-hero h1,
.bottom-cta h2 {
  color: #f8fdff !important;
}

.products-grid,
.version-list,
.purchase-grid,
.features,
.compare-inner,
.stats-grid {
  color: var(--zy-text) !important;
}

.concept-card,
.product-card,
.version-card,
.purchase-card,
.feature-row,
.compare-inner,
.result-card,
.empty,
.empty-state,
.pricing-box,
.stats-band,
.stat-item {
  border: 1px solid var(--zy-border) !important;
  background: var(--zy-panel) !important;
  color: var(--zy-text) !important;
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.24) !important;
}

.empty-state,
.empty {
  max-width: 760px;
  margin: 48px auto 96px !important;
  padding: 34px 28px !important;
  border-radius: 14px !important;
  text-align: center;
}

.empty-state p,
.empty,
.version-meta,
.changelog,
.feature-text p,
.feature-text li,
.product-card p,
.send-title span,
.muted,
.price-meta {
  color: var(--zy-muted) !important;
}

.product-icon,
.disabled-icon {
  background: rgba(56, 189, 248, 0.13) !important;
  color: #7dd3fc !important;
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.16) !important;
}

.product-btn,
.hero-btn,
.cta-btn,
.download-button,
.pay-option,
.software-tab,
.disabled-btn,
.login-btn,
.captcha-refresh {
  border-radius: 12px !important;
  border: 1px solid var(--zy-border-strong) !important;
  color: var(--zy-text) !important;
  background: rgba(8, 47, 73, 0.72) !important;
  box-shadow: inset 0 0 18px rgba(56, 189, 248, 0.08);
}

.product-btn.primary,
.hero-btn.primary,
.cta-btn.primary,
.download-button.recommended,
.disabled-btn-primary,
.login-btn {
  background: linear-gradient(135deg, #0284c7, #0e7490) !important;
  color: #ffffff !important;
  border-color: rgba(103, 232, 249, 0.78) !important;
}

.product-btn:hover,
.hero-btn:hover,
.cta-btn:hover,
.download-button:hover,
.pay-option:hover,
.software-tab:hover,
.disabled-btn:hover,
.captcha-refresh:hover,
.login-btn:hover {
  transform: translateY(-1px);
  background: rgba(14, 116, 144, 0.86) !important;
  border-color: rgba(165, 243, 252, 0.9) !important;
}

.product-hero {
  background:
    radial-gradient(circle at 68% 30%, rgba(56, 189, 248, 0.18), transparent 30rem),
    linear-gradient(135deg, rgba(7, 17, 31, 0.98), rgba(10, 25, 44, 0.95)) !important;
}

.stats-band,
.bottom-cta {
  background: rgba(7, 17, 31, 0.5) !important;
}

.compare-table,
.compare-table th,
.compare-table td {
  color: var(--zy-text) !important;
  border-color: rgba(125, 211, 252, 0.12) !important;
}

input,
textarea,
select {
  background: rgba(3, 11, 22, 0.78) !important;
  border: 1px solid rgba(125, 211, 252, 0.2) !important;
  color: var(--zy-text) !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(207, 232, 248, 0.48) !important;
}

.login-page {
  min-height: calc(100vh - 68px) !important;
  background:
    radial-gradient(circle at 26% 52%, rgba(14, 165, 233, 0.13), transparent 26rem),
    linear-gradient(135deg, #07111f 0%, #0a1728 100%) !important;
}

.form-section {
  background: transparent !important;
}

.form-header h1 {
  color: #f8fdff !important;
}

.form-header p,
.field label {
  color: var(--zy-soft) !important;
}

.form-inner {
  border: 1px solid var(--zy-border) !important;
  background: var(--zy-panel-strong) !important;
  box-shadow: var(--zy-shadow) !important;
}

.captcha-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 10px;
}

.captcha-question {
  min-height: 44px;
  display: flex;
  align-items: center;
  padding: 0 14px;
  border: 1px solid rgba(125, 211, 252, 0.2);
  border-radius: 12px;
  background: rgba(3, 11, 22, 0.72);
  color: #e0f7ff;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.captcha-refresh {
  height: 44px;
  padding: 0 14px;
  cursor: pointer;
  font-weight: 700;
}

#message {
  min-height: 24px;
  color: var(--zy-danger) !important;
}

#message[data-type="info"] {
  color: #7dd3fc !important;
}

.disabled-overlay {
  min-height: 100vh !important;
  background:
    radial-gradient(circle at 25% 24%, rgba(56, 189, 248, 0.16), transparent 28rem),
    linear-gradient(135deg, #07111f 0%, #0a1728 100%) !important;
}

.disabled-box {
  border-radius: 18px !important;
  border: 1px solid var(--zy-border) !important;
  background: var(--zy-panel-strong) !important;
  color: var(--zy-text) !important;
  box-shadow: var(--zy-shadow) !important;
}

.disabled-title {
  color: #ffffff !important;
}

.disabled-message {
  color: var(--zy-soft) !important;
}

.site-footer {
  color: var(--record-footer-color, #030712) !important;
  background: var(--record-footer-bg, #030712) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.site-footer p,
.site-footer .record-links {
  color: var(--record-footer-color, #030712) !important;
}

.site-footer a {
  color: inherit !important;
  text-decoration: none;
}

.site-footer a:hover {
  color: inherit !important;
  opacity: 0.8;
}

.site-footer .gongan-record img {
  opacity: 1;
}

.site-footer .gongan-record .gongan-badge {
  width: 14px;
  height: 14px;
  display: inline-block;
  flex: 0 0 auto;
  vertical-align: -2px;
  background-color: var(--badge-color, currentColor);
  -webkit-mask: url("/static/gongan.png") no-repeat center / contain;
  mask: url("/static/gongan.png") no-repeat center / contain;
}

@media (max-width: 760px) {
  .top-nav {
    height: auto !important;
    min-height: 62px;
    padding: 12px 18px !important;
  }

  .nav-links {
    gap: 8px !important;
  }

  .hero-slider,
  .login-page {
    min-height: auto !important;
  }

  .captcha-row {
    grid-template-columns: 1fr;
  }

  .captcha-refresh {
    width: 100%;
  }
}

body.product-detail-page {
  --zy-bg: #020617;
  --zy-bg-2: #020617;
  --zy-compare-dim: rgba(86, 106, 130, 0.68);
  background: #020617 !important;
}

body.product-detail-page .product-hero,
body.product-detail-page .stats-band,
body.product-detail-page .features,
body.product-detail-page .compare-section,
body.product-detail-page .bottom-cta {
  background: #020617 !important;
}

body.product-detail-page .product-hero::before {
  background: #020617 !important;
}

body.product-detail-page .feature-row,
body.product-detail-page .compare-inner,
body.product-detail-page .stats-band {
  border: 0 !important;
  box-shadow: none !important;
}

body.product-detail-page .feature-row,
body.product-detail-page .compare-inner,
body.product-detail-page .stats-band {
  background: transparent !important;
}

body.product-detail-page .stat-item,
body.product-detail-page .feature-visual {
  background: #020617 !important;
}

body.product-detail-page .stat-item {
  border: 1px solid rgba(56, 189, 248, 0.55) !important;
  box-shadow: inset 0 0 0 1px rgba(125, 211, 252, 0.1), 0 0 12px rgba(14, 165, 233, 0.06) !important;
  cursor: pointer;
}

body.product-detail-page .stat-item:hover,
body.product-detail-page .stat-item:focus-visible {
  border-color: #38bdf8 !important;
  background: rgba(14, 165, 233, 0.1) !important;
  box-shadow: 0 16px 40px rgba(14, 165, 233, 0.2), 0 0 0 3px rgba(56, 189, 248, 0.25), inset 0 0 0 1px rgba(125, 211, 252, 0.35) !important;
}

body.product-detail-page .stat-item.is-active {
  border-color: #38bdf8 !important;
  background: rgba(14, 165, 233, 0.12) !important;
  box-shadow: 0 18px 48px rgba(14, 165, 233, 0.22), 0 0 0 3px rgba(14, 165, 233, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
}

body.product-detail-page .compare-table th:first-child,
body.product-detail-page .compare-table th:nth-child(3),
body.product-detail-page .compare-table td:first-child,
body.product-detail-page .compare-table td:nth-child(3) {
  color: var(--zy-compare-dim) !important;
}

body.product-detail-page .compare-table td:nth-child(3) .cross {
  color: rgba(86, 106, 130, 0.6) !important;
  background: rgba(86, 106, 130, 0.08) !important;
}

body.home-page,
body.subscribe-page,
body.download-detail-page {
  --zy-bg: #020617;
  --zy-bg-2: #020617;
  background: #020617 !important;
}

body.home-page .hero-slider,
body.home-page .philosophy,
body.home-page .product-cta,
body.subscribe-page .store-page,
body.subscribe-page .product-head,
body.download-detail-page .download-page,
body.download-detail-page .hero-section {
  background: #020617 !important;
}

body.subscribe-page .store-page {
  padding-top: 82px !important;
  padding-bottom: 42px !important;
}

body.subscribe-page .product-head {
  padding-top: 16px !important;
  padding-bottom: 18px !important;
  margin-bottom: 14px !important;
}

body.subscribe-page .product-head h1 {
  margin-bottom: 8px !important;
}

body.subscribe-page .product-head p {
  line-height: 1.6 !important;
}

body.subscribe-page .purchase-grid {
  gap: 20px !important;
}

body.subscribe-page .purchase-card {
  padding: 28px !important;
}

body.subscribe-page .plan-option.selected,
body.subscribe-page .plan-option.featured.selected,
body.subscribe-page .pay-option.selected {
  border-color: rgba(125, 211, 252, 0.95) !important;
  background: linear-gradient(135deg, #0284c7, #0ea5e9) !important;
  color: #ffffff !important;
  box-shadow: 0 10px 28px rgba(14, 165, 233, 0.22), inset 0 1px 0 rgba(255,255,255,0.16) !important;
}

body.subscribe-page .pay-option.selected::before {
  background: #7dd3fc !important;
}

body.subscribe-page .pay-option.selected .pay-icon {
  background: rgba(125, 211, 252, 0.24) !important;
}

body.admin-login-page {
  --zy-bg: #020617;
  --zy-bg-2: #020617;
  background: #020617 !important;
  overflow-x: hidden;
}

body.admin-login-page .login-page {
  min-height: calc(100vh - 68px) !important;
  display: grid;
  grid-template-columns: minmax(360px, 0.92fr) minmax(440px, 1.08fr);
  gap: 0;
  padding-top: 68px;
  background: #020617 !important;
}

body.admin-login-page .form-section {
  background: #020617 !important;
}

body.admin-login-page .warm-section {
  justify-content: center;
  padding: 40px 48px 48px;
}

body.admin-login-page .warm-content {
  max-width: 430px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.admin-login-page .warm-subtitle {
  color: #cbd5e1;
  font-size: 15px;
  line-height: 1.8;
  margin: 0 0 40px;
}

body.admin-login-page .warm-line {
  display: flex;
  align-items: baseline;
  gap: 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--text-muted) !important;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: .5px;
  text-align: left;
}

body.admin-login-page .warm-line::before {
  content: "";
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: radial-gradient(circle at 35% 35%, #fde68a, #f97316);
  box-shadow: 0 0 10px rgba(249, 115, 22, 0.7);
  flex: 0 0 auto;
  transform: translateY(-1px);
}

body.admin-login-page .warm-line strong {
  color: #fdba74;
  font-weight: 700;
  white-space: nowrap;
  margin-right: 10px;
}

body.admin-login-page .form-section {
  align-items: center;
  justify-content: center;
  padding: 72px 72px 96px;
  border-left: 1px solid rgba(125, 211, 252, 0.08);
  backdrop-filter: none;
}

body.admin-login-page .form-section::before {
  display: none;
}

body.admin-login-page .form-inner {
  width: min(100%, 440px);
  margin: 0;
  padding: 36px;
  border: 1px solid rgba(125, 211, 252, 0.16) !important;
  border-radius: 18px;
  background: rgba(5, 12, 24, 0.92) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.04) !important;
}

body.admin-login-page .form-header {
  text-align: center;
  margin-bottom: 28px;
}

body.admin-login-page .form-header h1 {
  font-size: 26px !important;
  line-height: 1.25;
  letter-spacing: 0.08em;
  color: #f8fdff !important;
}

body.admin-login-page .field {
  display: block;
  margin-bottom: 18px;
}

body.admin-login-page .field label {
  display: block;
  width: 100%;
  flex: none;
  flex-basis: auto;
  margin-bottom: 8px;
  text-align: left;
  color: rgba(207, 232, 248, 0.78) !important;
  font-size: 13px;
  letter-spacing: 0.06em;
}

body.admin-login-page .field input,
body.admin-login-page #captchaAnswer {
  width: 100%;
  height: 46px;
  border-radius: 12px;
  border: 1px solid rgba(125, 211, 252, 0.18) !important;
  background: rgba(3, 11, 22, 0.88) !important;
  color: #eaf6ff !important;
  padding: 0 14px;
}

body.admin-login-page .field input:focus,
body.admin-login-page #captchaAnswer:focus {
  border-color: rgba(125, 211, 252, 0.46) !important;
  box-shadow: 0 0 0 4px rgba(56, 189, 248, 0.1);
}

body.admin-login-page .captcha-wrap {
  width: 100%;
  display: grid;
  grid-template-columns: 202px minmax(0, 1fr);
  gap: 10px;
}

body.admin-login-page .captcha-row {
  display: grid;
  grid-template-columns: 118px 74px;
  gap: 8px;
  margin: 0;
}

body.admin-login-page .captcha-question,
body.admin-login-page .captcha-refresh {
  min-height: 46px;
  height: 46px;
  border-radius: 12px;
}

body.admin-login-page .captcha-question {
  background: rgba(3, 11, 22, 0.88);
  border-color: rgba(125, 211, 252, 0.18);
  color: #dff7ff;
  justify-content: center;
  padding: 0 10px;
  white-space: nowrap;
}

body.admin-login-page .captcha-refresh {
  padding: 0;
}

body.admin-login-page .login-btn {
  width: 100%;
  height: 48px;
  margin-top: 22px;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #0284c7, #0e7490) !important;
  border-color: rgba(103, 232, 249, 0.72) !important;
  font-size: 15px;
  letter-spacing: 0.16em;
  box-shadow: 0 14px 34px rgba(14, 165, 233, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

body.admin-login-page #message {
  min-height: 24px;
  margin-top: 16px;
  text-align: left;
}

body.admin-login-page .site-footer {
  background: #020617 !important;
}

@media (max-width: 1024px) {
  body.admin-login-page .login-page {
    grid-template-columns: 1fr;
  }

  body.admin-login-page .warm-section {
    padding: 48px 32px 24px;
    text-align: center;
    align-items: center;
  }

  body.admin-login-page .warm-content {
    width: 100%;
  }

  body.admin-login-page .warm-line {
    justify-content: center;
    width: 100%;
    flex-wrap: wrap;
    row-gap: 4px;
  }

  body.admin-login-page .form-section {
    padding: 24px 32px 80px;
    border-left: 0;
  }
}

@media (max-width: 640px) {
  body.admin-login-page .form-inner {
    padding: 26px 20px;
  }

  body.admin-login-page .captcha-wrap {
    grid-template-columns: 1fr;
  }
}
