:root {
  --hhy-bg: #07111f;
  --hhy-bg-soft: #0d1f36;
  --hhy-surface: rgba(15, 32, 54, 0.78);
  --hhy-surface-solid: #0f2036;
  --hhy-surface-strong: rgba(18, 42, 71, 0.92);
  --hhy-card-light: #f6faff;
  --hhy-border: rgba(255, 255, 255, 0.15);
  --hhy-border-soft: rgba(255, 255, 255, 0.09);
  --hhy-text: #eff6ff;
  --hhy-muted: #9fb4cc;
  --hhy-primary: #35a7ff;
  --hhy-secondary: #62ddff;
  --hhy-gold: #f0b43c;
  --hhy-green: #19c77a;
  --hhy-red: #ff5d66;
  --hhy-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
}

html {
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  color: var(--hhy-text);
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 92px),
    linear-gradient(160deg, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 120px),
    linear-gradient(180deg, #07111f 0, #0b1b31 320px, #07111f 100%) !important;
  background-attachment: fixed !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto;
  height: 360px;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(4, 14, 28, 0.96) 0%, rgba(4, 14, 28, 0.78) 38%, rgba(7, 36, 74, 0.68) 100%),
    linear-gradient(135deg, rgba(53, 167, 255, 0.22), transparent 42%),
    linear-gradient(225deg, rgba(240, 180, 60, 0.16), transparent 44%);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(120deg, transparent 0 44%, rgba(255, 255, 255, 0.055) 44% 45%, transparent 45% 100%),
    linear-gradient(160deg, transparent 0 72%, rgba(255, 255, 255, 0.045) 72% 73%, transparent 73% 100%);
}

a {
  color: var(--hhy-secondary);
}

.shell,
main {
  position: relative;
  z-index: 1;
}

.shell {
  width: min(1200px, calc(100% - 32px)) !important;
}

body > main.shell > header,
.shell > header {
  position: relative;
  z-index: 2;
  margin-bottom: 20px;
  padding: 18px 18px;
  border: 1px solid var(--hhy-border);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.075);
  box-shadow: var(--hhy-shadow);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  overflow: hidden;
}

body > main.shell > header::before,
.shell > header::before,
.module-panel::before,
.panel::before,
.auth-panel::before,
.search::before,
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(circle at top right, rgba(98, 221, 255, 0.14), transparent 34%);
}

body > main.shell > header > *,
.shell > header > *,
.module-panel > *,
.panel > *,
.auth-panel > *,
.search > *,
.hero > * {
  position: relative;
  z-index: 1;
}

.brand-logo,
.brand-logo-image,
.brand img,
.admin-title img {
  border-radius: 14px !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.25) !important;
}

h1,
.brand-title h1 {
  color: transparent !important;
  background: linear-gradient(100deg, #ffffff 0%, #dff4ff 34%, #ffd978 66%, #ffffff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: 0 18px 46px rgba(0, 0, 0, 0.22);
}

.brand-title strong,
.title-red,
.stat-number {
  color: #ffe08a !important;
  -webkit-text-fill-color: currentColor;
}

.brand-title h1 .brand-name {
  display: inline-block !important;
  font-family: "STXingkai", "Hannotate SC", "Kaiti SC", "KaiTi", "DFKai-SB", "FZShuTi", "PingFang SC", "Microsoft YaHei", serif !important;
  font-weight: 900 !important;
  background: linear-gradient(15deg, #ffffff 0%, #ffffff 37.5%, #ff3b00 37.5%, #ff3b00 62.5%, #ffffff 62.5%, #ffffff 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.22), 0 0 8px rgba(255, 59, 0, 0.08) !important;
}

.source,
.tag,
.pill,
.eyebrow,
.heat,
.vip-link,
.side-message-count-box,
.referral-code-banner {
  border-radius: 999px !important;
}

.user-status,
.admin-status {
  color: rgba(239, 246, 255, 0.78) !important;
}

.module-panel,
.panel,
.auth-panel,
.auth-card,
.search,
.status,
.grid > section,
.analysis-box,
.chart-wrap,
.close-table-wrap,
.site-messages,
.pay-dialog,
.profile-dialog,
.ledger-stock-list,
.ledger-detail,
.ledger-section,
.member-message-item,
.hero,
article {
  position: relative;
  border: 1px solid var(--hhy-border) !important;
  border-radius: 18px !important;
  background: var(--hhy-surface) !important;
  color: var(--hhy-text) !important;
  box-shadow: var(--hhy-shadow) !important;
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  overflow: hidden;
}

.auth-card,
.grid > section,
.analysis-box,
.ledger-section,
.member-message-item {
  background: linear-gradient(180deg, rgba(15, 32, 54, 0.9), rgba(18, 42, 71, 0.76)) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18) !important;
}

.section-title,
.auth-title,
.auth-card-title,
.ledger-stock-list-title,
.ledger-block-title,
.member-message-title,
h2,
h3 {
  color: var(--hhy-text) !important;
}

.section-title::before,
.auth-card-title::before,
.bonus-manage-title::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--hhy-secondary), var(--hhy-gold));
  box-shadow: 0 0 16px rgba(98, 221, 255, 0.55);
  vertical-align: 0.08em;
}

.label,
.hint,
.muted,
.module-empty,
.ledger-empty,
.member-message-time,
.site-message-time,
p,
li,
.meta,
.hero-note,
.auth-message,
#authLimitText,
#authUserText,
.message,
.profile-row-label,
.ledger-stock-meta,
.ledger-summary-label {
  color: var(--hhy-muted) !important;
}

.value,
.price,
.ledger-summary-value,
.member-message-content,
.site-message-content,
.suggestion-content,
td,
th {
  color: var(--hhy-text);
}

input,
select,
textarea {
  border: 1px solid var(--hhy-border) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--hhy-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

input::placeholder,
textarea::placeholder {
  color: rgba(239, 246, 255, 0.48) !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(98, 221, 255, 0.72) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 0 0 4px rgba(53, 167, 255, 0.16) !important;
}

button,
.btn,
.auth-button,
.small-action,
.top-login-btn,
.logout-btn,
.logout,
.profile-link,
.vip-link {
  border-radius: 999px !important;
  background: linear-gradient(135deg, var(--hhy-secondary), var(--hhy-primary)) !important;
  color: #ffffff !important;
  border: 0 !important;
  box-shadow: 0 16px 32px rgba(15, 103, 214, 0.3) !important;
}

button:hover,
.btn:hover,
.auth-button:hover,
.small-action:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

button.secondary,
.secondary,
.auth-switch,
.small-action.secondary,
.btn.ghost,
.logout,
.logout-btn,
.profile-link {
  border: 1px solid var(--hhy-border) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--hhy-text) !important;
  box-shadow: none !important;
}

.danger,
.small-action.danger {
  background: linear-gradient(135deg, #ff6b6b, #d70015) !important;
}

.search {
  grid-template-columns: minmax(160px, 0.55fr) minmax(260px, 1fr) auto;
  padding: 18px !important;
}

.status {
  background: rgba(98, 221, 255, 0.09) !important;
}

.spinner,
.ai-spinner {
  border-color: rgba(98, 221, 255, 0.22) !important;
  border-top-color: var(--hhy-secondary) !important;
}

.future-card,
.calc-card,
.emblem-card,
.summary-card,
.ledger-stock-button,
.profile-row,
.site-message-list li,
.pay-qr,
.push-recipient-check {
  border: 1px solid var(--hhy-border-soft) !important;
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.075) !important;
  color: var(--hhy-text) !important;
}

.future-price,
.ai-prediction-line,
.current-price,
.price-change.up,
.ledger-positive,
.message.ok {
  color: #7be7ff !important;
}

.price-change.down,
.ledger-negative,
.message.error,
.auth-message.error {
  color: #ff8a91 !important;
}

.auth-message.ok,
.vip-ok {
  color: #8dffbe !important;
}

.close-table,
.ledger-table,
table {
  border-collapse: collapse;
  color: var(--hhy-text);
}

.close-table th,
.close-table td,
.ledger-table th,
.ledger-table td,
table th,
table td {
  border-color: var(--hhy-border-soft) !important;
}

.close-table th,
.ledger-table th,
table th {
  background: rgba(98, 221, 255, 0.08) !important;
  color: #d8ebff !important;
}

.table-wrap,
.close-table-wrap {
  border-color: var(--hhy-border) !important;
  background: rgba(255, 255, 255, 0.055) !important;
}

.main-nav {
  border: 1px solid var(--hhy-border) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, 0.075) !important;
  box-shadow: var(--hhy-shadow) !important;
}

.main-nav button {
  background: transparent !important;
  color: rgba(239, 246, 255, 0.76) !important;
  box-shadow: none !important;
}

.main-nav button.active {
  background: linear-gradient(135deg, var(--hhy-secondary), var(--hhy-primary)) !important;
  color: #ffffff !important;
}

.user-stats,
.visitor-toolbar,
.panel-toolbar,
.pager,
.form-actions,
.push-recipient-head,
.hero-actions {
  color: var(--hhy-muted) !important;
}

.site-messages {
  margin-top: 18px;
}

.icp-record {
  color: rgba(239, 246, 255, 0.52) !important;
}

.pay-mask,
.profile-mask {
  background: rgba(3, 10, 20, 0.7) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.pay-price {
  color: #ffe08a !important;
}

.referral-code-banner {
  background: linear-gradient(135deg, var(--hhy-gold), #ff7a00) !important;
}

.video-mask {
  background: rgba(3, 10, 20, 0.76) !important;
}

@media print {
  body {
    background: #fff !important;
    color: #000 !important;
  }

  body::before,
  body::after {
    display: none !important;
  }
}

@media (max-width: 760px) {
  body::before {
    height: 420px;
  }

  .shell {
    width: min(100% - 24px, 1200px) !important;
  }

  .search {
    grid-template-columns: 1fr !important;
  }

  body > main.shell > header,
  .shell > header {
    padding: 16px !important;
  }

  .main-nav {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* Keep selected controls in the original stock-radar visual language. */
.side-menu {
  position: fixed !important;
  left: 51px !important;
  top: 50% !important;
  z-index: 80 !important;
  width: 65px !important;
  padding: 16px 0 !important;
  transform: translateY(-50%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 22px !important;
  background: rgba(18, 20, 25, 0.50) !important;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
  -webkit-backdrop-filter: blur(22px) !important;
  backdrop-filter: blur(22px) !important;
  overflow: hidden !important;
}

.side-menu-btn {
  position: relative !important;
  width: 20px !important;
  min-height: 70px !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  place-items: center !important;
  align-content: center !important;
  justify-content: center !important;
  gap: 4px !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: 0 !important;
  background: transparent !important;
  color: rgba(245, 245, 247, 0.72) !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  text-align: center !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  overflow: visible !important;
  transition: color 0.16s ease, background 0.16s ease, transform 0.16s ease !important;
}

.side-menu-btn:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #f5f5f7 !important;
  box-shadow: none !important;
  transform: none !important;
}

.side-menu-btn.active {
  background: rgba(10, 132, 255, 0.22) !important;
  color: #f5f5f7 !important;
  box-shadow: none !important;
  transform: none !important;
}

.side-menu-btn .side-menu-label {
  writing-mode: vertical-rl !important;
  text-orientation: upright !important;
  letter-spacing: 2px !important;
  line-height: 1 !important;
  max-width: 23px !important;
  width: 23px !important;
  overflow: hidden !important;
  justify-self: center !important;
  transform: translateX(-28px) !important;
}

.side-menu-btn svg {
  width: 20px !important;
  height: 20px !important;
  justify-self: center !important;
  transform: translateX(-25px) !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  fill: none !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  opacity: 0.92 !important;
}

#queryBtn {
  position: relative !important;
  isolation: isolate !important;
  width: 92px !important;
  height: 92px !important;
  min-width: 92px !important;
  min-height: 92px !important;
  padding: 0 12px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(10, 132, 255, 0.52) !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(10, 132, 255, 0.96) 0 23%, transparent 24%),
    conic-gradient(from 0deg, rgba(48, 209, 88, 0.10), rgba(48, 209, 88, 0.78), rgba(10, 132, 255, 0.16), rgba(48, 209, 88, 0.10)),
    radial-gradient(circle, rgba(10, 132, 255, 0.24) 0 30%, transparent 31% 42%, rgba(10, 132, 255, 0.22) 43% 44%, transparent 45% 58%, rgba(10, 132, 255, 0.22) 59% 60%, transparent 61%),
    rgba(10, 16, 22, 0.92) !important;
  color: #ffffff !important;
  font-size: 14px !important;
  font-weight: 860 !important;
  line-height: 1.15 !important;
  text-align: center !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.72) !important;
  box-shadow: 0 0 0 5px rgba(10, 132, 255, 0.08), 0 14px 32px rgba(10, 132, 255, 0.28), inset 0 0 24px rgba(48, 209, 88, 0.16) !important;
  overflow: hidden !important;
}

#queryBtn:hover {
  filter: brightness(1.05) !important;
  box-shadow: 0 0 0 6px rgba(10, 132, 255, 0.10), 0 18px 38px rgba(10, 132, 255, 0.34), inset 0 0 28px rgba(48, 209, 88, 0.20) !important;
}

#queryBtn:active {
  transform: translateY(1px) scale(0.98) !important;
}

.top-reward-link {
  display: none !important;
  min-height: 32px !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  background: linear-gradient(90deg, #ff2d55, #ff9500, #34c759, #007aff, #af52de, #ff2d55) !important;
  background-size: 320% 100% !important;
  box-shadow: 0 8px 18px rgba(255, 45, 85, 0.24) !important;
  animation: rewardFlash 1.1s linear infinite !important;
}

.top-reward-link.show {
  display: inline-flex !important;
}

.top-reward-link:hover {
  color: #ffffff !important;
  text-decoration: none !important;
  filter: brightness(1.04) !important;
}

.profile-module-reward-btn {
  min-width: 118px !important;
  min-height: 44px !important;
  border: 0 !important;
  border-radius: 8px !important;
  padding: 0 18px !important;
  background: linear-gradient(90deg, #ff2d55, #ff9500, #34c759, #007aff, #af52de, #ff2d55) !important;
  background-size: 320% 100% !important;
  color: #ffffff !important;
  font-weight: 900 !important;
  box-shadow: 0 8px 18px rgba(255, 45, 85, 0.24) !important;
  animation: rewardFlash 1.1s linear infinite !important;
}

.profile-module-reward-btn:hover {
  color: #ffffff !important;
  filter: brightness(1.04) !important;
  transform: translateY(-1px) !important;
}

body:has(#copyImageBtn) #imageCopyStatus.hero-note {
  color: #111111 !important;
}

#profileModule .bonus-panel {
  margin-top: 10px !important;
  border-radius: 12px !important;
}

#profileModule .bonus-panel-title {
  min-height: 34px !important;
  padding: 8px 10px !important;
  font-size: 15px !important;
  font-weight: 720 !important;
  letter-spacing: 0 !important;
}

#profileModule .bonus-panel-title-text {
  color: rgba(239, 246, 255, 0.86) !important;
}

#profileModule .bonus-table {
  min-width: 680px !important;
  font-size: 12px !important;
}

#profileModule .bonus-table th,
#profileModule .bonus-table td {
  padding: 7px 8px !important;
  line-height: 1.45 !important;
}

#profileModule .bonus-table th {
  font-size: 11px !important;
  font-weight: 650 !important;
}

#profileModule .bonus-status {
  font-size: 11px !important;
  font-weight: 650 !important;
}

#profileModule .bonus-table-wrap .module-empty {
  min-height: 96px !important;
  padding: 16px 12px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
}

#profileModule .profile-module-actions {
  gap: 8px !important;
  margin-top: 10px !important;
}

#profileModule .profile-module-actions button {
  min-width: 92px !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  font-weight: 760 !important;
}

#profileModule .profile-module-reward-btn {
  min-width: 96px !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  box-shadow: 0 6px 14px rgba(255, 45, 85, 0.18) !important;
}

@media (max-width: 760px) {
  .side-menu {
    left: 10px !important;
    right: 10px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    padding: 8px !important;
    transform: none !important;
    border-radius: 18px !important;
  }

  .side-menu-list {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
  }

  .side-menu-btn {
    min-height: 58px !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 5px !important;
    padding: 5px 3px !important;
    font-size: 10px !important;
    text-align: center !important;
  }

  .side-menu-btn .side-menu-label {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    letter-spacing: 0 !important;
    transform: none !important;
  }

  .side-menu-btn svg {
    width: 23px !important;
    height: 23px !important;
    transform: none !important;
  }

  #queryBtn {
    width: 92px !important;
    min-width: 92px !important;
    justify-self: center !important;
  }
}