/* Mazhi root portal: neutral command index, not an investment terminal. */
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600;700&display=swap");

:root {
  --bg: #f4f7fb;
  --card: #ffffff;
  --card-hover: #f7fbff;
  --panel: #ffffff;
  --panel2: #eef4fb;
  --border: #d8e2ee;
  --line: #d8e2ee;
  --text: #162033;
  --text-dim: #68788c;
  --muted: #68788c;
  --accent: #2563eb;
  --accent-2: #06b6d4;
  --green: #059669;
  --yellow: #d97706;
  --red: #dc2626;
  --terminal-shadow: 0 18px 42px rgba(22, 32, 51, .1);
  --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

html,
body {
  background:
    radial-gradient(circle at 12% 8%, rgba(37, 99, 235, .12), transparent 26%),
    radial-gradient(circle at 86% 4%, rgba(6, 182, 212, .12), transparent 22%),
    linear-gradient(90deg, rgba(22, 32, 51, .035) 1px, transparent 1px),
    linear-gradient(rgba(22, 32, 51, .035) 1px, transparent 1px),
    var(--bg) !important;
  background-size: auto, auto, 34px 34px, 34px 34px, auto !important;
  color: var(--text) !important;
}

.hub-top {
  border-bottom-color: var(--border) !important;
}

.wordmark span,
.eyebrow,
.site-code {
  color: var(--accent) !important;
}

.live-dot {
  background: var(--accent-2) !important;
  box-shadow: 0 0 16px rgba(6, 182, 212, .35) !important;
}

.hero-copy,
.status-card,
.site-card {
  background: rgba(255, 255, 255, .88) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: var(--terminal-shadow) !important;
}

.hero-copy {
  background:
    linear-gradient(135deg, rgba(37, 99, 235, .08), transparent 42%),
    rgba(255, 255, 255, .9) !important;
}

h1,
.site-title,
.status-card b,
.wordmark {
  color: var(--text) !important;
}

.lead,
.clock,
.section-head h2,
.section-head p,
.site-desc,
.site-url,
.site-tag,
.status-card span {
  color: var(--text-dim) !important;
}

.site-card:hover,
.site-card:focus-visible {
  border-color: var(--accent) !important;
  background:
    linear-gradient(135deg, rgba(37, 99, 235, .08), transparent 46%),
    #ffffff !important;
}

.site-code,
.site-tag {
  border-color: var(--border) !important;
  background: var(--panel2) !important;
}