/**
 * 全站色系统一覆盖 — 对齐 Ink Signal 墨青精工
 * 在 style.css 之后加载
 */

body {
  font-family: var(--font-sans, "Outfit", "DM Sans", system-ui, sans-serif);
  font-weight: 400;
  letter-spacing: -0.012em;
  -webkit-font-smoothing: antialiased;
}

.glass-card,
.glass-card.page-main-card {
  border-radius: var(--page-card-radius, 30px 20px 26px 18px) !important;
  padding: var(--page-card-padding-y) var(--page-card-padding-x) !important;
  backdrop-filter: blur(var(--glass-blur-heavy, 56px)) saturate(var(--glass-saturate, 1.75)) !important;
  -webkit-backdrop-filter: blur(var(--glass-blur-heavy, 56px)) saturate(var(--glass-saturate, 1.75)) !important;
}

.glass-card.page-main-card {
  box-shadow:
    0 1px 0 var(--glass-highlight) inset,
    0 0 0 1px color-mix(in srgb, var(--brand-live-teal, #5B6CFF) 12%, transparent),
    0 20px 50px var(--shadow-2),
    0 8px 24px var(--shadow-3);
}

@media (max-width: 768px) {
  .glass-card,
  .glass-card.page-main-card {
    border-radius: 24px 16px 20px 14px !important;
  }
}

.glass-card:hover,
.glass-card.page-main-card:hover,
.index-hero-card.page-main-card:hover {
  transform: none !important;
}

.page-main-card > .app-header,
.page-main-card > .ip-hub-header {
  margin-bottom: 16px !important;
  padding-bottom: 12px !important;
}

h1, h2, .app-header h1, .page-title {
  font-weight: 500;
  letter-spacing: -0.03em;
}

h3, h4 {
  font-weight: 500;
  letter-spacing: -0.02em;
}

/* 区块 / 标题 / 边框 */
.app-header {
  border-bottom-color: var(--border-primary) !important;
}

.logo {
  background: var(--brand-gradient-soft) !important;
  border-color: var(--border-primary) !important;
  box-shadow: 0 4px 16px var(--shadow-3) !important;
}

/* 导航药丸与工具页 */
.nav-pill:not(.nav-pill-toolbox),
.nav-pill:not(.nav-pill-toolbox):hover,
.nav-pill:not(.nav-pill-toolbox).active {
  box-shadow: none !important;
  transform: none !important;
}

.nav-pill.active:not(.nav-pill-toolbox) {
  box-shadow: none !important;
}

.tools-index-tag,
.tools-index-badge,
.tool-hub-badge {
  background: color-mix(in srgb, var(--brand-indigo) 10%, transparent) !important;
  color: var(--accent-primary) !important;
  border-color: color-mix(in srgb, var(--brand-indigo) 18%, transparent) !important;
}

/* 子页面卡片：不做入场动画，避免整页像大按钮弹出 */
.ip-hub-card,
.tool-hub-card,
.tool-page-card,
.glass-card.page-main-card:not(.index-hero-card) {
  animation: none !important;
}

/* 管理后台接入同一令牌 */
.admin-login-body,
.admin-body {
  background: var(--bg-base) !important;
  color: var(--text-primary);
}

.admin-login-wrap .login-card,
.admin-wrap .admin-card {
  background: var(--card-bg-1) !important;
  border: 1px solid var(--glass-border-bright) !important;
  box-shadow: 0 16px 40px var(--shadow-2) !important;
}

.admin-login-wrap .login-card-top-line,
.admin-wrap .admin-card-top-line {
  background: var(--brand-gradient-nav) !important;
}

.admin-login-wrap .login-btn,
.admin-wrap .admin-btn-primary {
  background: var(--brand-gradient) !important;
  border: none !important;
  box-shadow: 0 4px 14px var(--shadow-3) !important;
}

.admin-login-wrap input:focus,
.admin-wrap input:focus,
.admin-wrap select:focus,
.admin-wrap textarea:focus {
  border-color: var(--accent-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-indigo) 15%, transparent) !important;
}

/* —— 白天模式：墨青精工 —— */
[data-theme="light"] .glass-card,
.theme-light .glass-card {
  background: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.78) 0%,
    color-mix(in srgb, var(--brand-live-cyan) 6%, rgba(255, 255, 255, 0.7)) 42%,
    color-mix(in srgb, var(--brand-live-teal) 5%, rgba(255, 255, 255, 0.66)) 100%
  ) !important;
  border-color: color-mix(in srgb, var(--brand-live-teal) 14%, rgba(15, 23, 42, 0.06)) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.7) inset,
    0 0 0 1px rgba(255, 255, 255, 0.35),
    0 18px 40px var(--shadow-2),
    0 6px 16px var(--shadow-4) !important;
}

[data-theme="light"] .index-hero-card,
.theme-light .index-hero-card {
  background: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.86) 0%,
    color-mix(in srgb, var(--brand-live-cyan) 5%, rgba(255, 255, 255, 0.78)) 48%,
    color-mix(in srgb, var(--brand-live-teal) 4%, rgba(255, 255, 255, 0.72)) 100%
  ) !important;
}

[data-theme="light"] .main-nav,
.theme-light .main-nav {
  background: var(--nav-bg-1) !important;
  border-bottom-color: var(--border-primary) !important;
  box-shadow:
    0 1px 0 var(--glass-highlight) inset,
    0 10px 32px var(--shadow-2),
    0 0 0 1px color-mix(in srgb, var(--brand-live-cyan) 8%, transparent) !important;
}

[data-theme="light"] .nav-links.nav-links-v2,
.theme-light .nav-links.nav-links-v2 {
  background: var(--nav-bg-2) !important;
  border-color: var(--border-primary) !important;
  box-shadow:
    0 1px 0 var(--glass-highlight) inset,
    0 4px 16px var(--shadow-1) !important;
}

[data-theme="light"] .nav-pill:hover:not(.nav-pill-toolbox),
.theme-light .nav-pill:hover:not(.nav-pill-toolbox) {
  background: color-mix(in srgb, var(--brand-live-teal) 10%, transparent) !important;
  color: var(--accent-primary) !important;
  box-shadow: none !important;
  transform: none !important;
}

[data-theme="light"] .nav-pill.active:not(.nav-pill-toolbox),
.theme-light .nav-pill.active:not(.nav-pill-toolbox) {
  background: color-mix(in srgb, var(--brand-indigo) 12%, transparent) !important;
  color: var(--accent-primary) !important;
  border-color: color-mix(in srgb, var(--brand-indigo) 16%, transparent) !important;
  box-shadow: none !important;
  transform: none !important;
}

[data-theme="light"] .primary-btn,
.theme-light .primary-btn,
[data-theme="light"] .index-hero-card .primary-btn,
.theme-light .index-hero-card .primary-btn {
  background: var(--btn-gradient) !important;
  border-color: color-mix(in srgb, var(--btn-teal-deep) 40%, transparent) !important;
  box-shadow: var(--btn-shadow) !important;
}

[data-theme="light"] .index-hero-card .code-digits span,
.theme-light .index-hero-card .code-digits span,
[data-theme="light"] .code-digits span,
.theme-light .code-digits span {
  color: var(--brand-live-teal) !important;
  -webkit-text-fill-color: var(--brand-live-teal) !important;
}

[data-theme="light"] .index-hero-eyebrow,
.theme-light .index-hero-eyebrow {
  color: var(--brand-live-teal) !important;
  background: color-mix(in srgb, var(--brand-live-cyan) 8%, #fff) !important;
  border: 1px solid color-mix(in srgb, var(--brand-live-teal) 16%, transparent) !important;
}

[data-theme="light"] .progress-fill,
.theme-light .progress-fill,
[data-theme="light"] .index-hero-card .progress-fill,
.theme-light .index-hero-card .progress-fill {
  background: var(--brand-gradient-nav) !important;
}

[data-theme="light"] .global-footer,
.theme-light .global-footer {
  background: transparent !important;
  border: none !important;
}

[data-theme="light"] .site-brand-name,
.theme-light .site-brand-name {
  background: linear-gradient(135deg, var(--text-primary) 0%, var(--brand-live-teal) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

[data-theme="light"] .site-brand-tld,
.theme-light .site-brand-tld {
  background: linear-gradient(135deg, var(--brand-live-teal) 0%, var(--brand-live-cyan) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

[data-theme="light"] .tools-index-badge,
.theme-light .tools-index-badge,
[data-theme="light"] .tools-index-stat strong,
.theme-light .tools-index-stat strong {
  color: var(--brand-live-teal) !important;
}

[data-theme="light"] .tools-index-view-btn.is-active,
.theme-light .tools-index-view-btn.is-active {
  color: var(--brand-live-teal) !important;
  background: color-mix(in srgb, var(--brand-live-cyan) 10%, var(--glass-surface)) !important;
}

[data-theme="light"] input:focus,
.theme-light input:focus,
[data-theme="light"] textarea:focus,
.theme-light textarea:focus,
[data-theme="light"] select:focus,
.theme-light select:focus,
[data-theme="light"] .input-wrapper input:focus,
.theme-light .input-wrapper input:focus {
  border-color: var(--brand-live-teal) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-live-cyan) 16%, transparent) !important;
}

.telegram-bot-button {
  font-weight: 500 !important;
  letter-spacing: 0.02em !important;
  text-shadow: none !important;
}

.telegram-bot-pulse {
  opacity: 0.55;
}

.telegram-bot-qr-image:not([src]) {
  background: color-mix(in srgb, var(--text-primary) 6%, transparent);
  border-radius: 8px;
}


/* Ink Signal polish */
body {
  background:
    radial-gradient(720px 320px at 12% -8%, color-mix(in srgb, var(--brand-live-cyan) 14%, transparent), transparent 60%),
    radial-gradient(640px 280px at 88% 0%, color-mix(in srgb, var(--brand-live-teal) 12%, transparent), transparent 58%),
    linear-gradient(180deg, var(--bg-base) 0%, var(--bg-primary) 48%, var(--bg-secondary) 100%) !important;
}
.glass-card,
.glass-card.page-main-card {
  border-radius: var(--page-card-radius, 22px) !important;
}
.site-brand-tld {
  color: var(--brand-live-teal) !important;
}