/* ==================================================
   SILVER — Metallic monochrome palette
   Inspired by polished steel / brushed aluminum
   Loaded LAST. Replaces purple palette.
   ================================================== */

[data-theme="dark"] {
  --bg: #0e1014 !important;             /* gunmetal black */
  --bg-2: #15181d !important;
  --surface: rgba(200,205,211,.04) !important;
  --line: rgba(200,205,211,.10) !important;
  --line-2: rgba(200,205,211,.22) !important;
  --ink: #e8eaed !important;            /* polished silver */
  --ink-soft: #9ba3ad !important;       /* mid silver */
  --ink-faint: #5a6068 !important;
  --accent: #c8cdd3 !important;         /* light silver */
  --accent-2: #e8eaed !important;       /* almost-white silver */
  --accent-deep: #6c737d !important;    /* dark steel */
  --warn: #f59e0b !important;
  --danger: #dc2626 !important;
}
[data-theme="light"] {
  --bg: #f0f2f5 !important;             /* light silver mist */
  --bg-2: #e6e9ed !important;
  --surface: rgba(20,25,30,.025) !important;
  --line: rgba(20,25,30,.10) !important;
  --line-2: rgba(20,25,30,.22) !important;
  --ink: #1a1d22 !important;
  --ink-soft: #4a5159 !important;
  --ink-faint: #8b929b !important;
  --accent: #4a5159 !important;
  --accent-2: #6c737d !important;
  --accent-deep: #1a1d22 !important;
}

body { background: var(--bg) !important; color: var(--ink) !important; }

/* ---------- Metallic vignette backdrop ---------- */
body {
  background-image:
    radial-gradient(ellipse at 70% 30%, rgba(200,205,211,.08), transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(108,115,125,.06), transparent 60%) !important;
}
[data-theme="light"] body {
  background-image:
    radial-gradient(ellipse at 70% 30%, rgba(108,115,125,.08), transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(74,81,89,.05), transparent 60%) !important;
}

/* Matrix rain — subtle silver tone */
#matrix-rain { opacity: .05 !important; }

/* ---------- Top nav ---------- */
.top-nav-brand .brand-mark {
  background: linear-gradient(135deg, #e8eaed, #9ba3ad, #4a5159) !important;
  color: #0e1014 !important;
  font-weight: 800 !important;
  border-radius: 4px !important;
  position: relative;
  overflow: hidden;
}
[data-theme="light"] .top-nav-brand .brand-mark {
  background: linear-gradient(135deg, #1a1d22, #4a5159, #6c737d) !important;
  color: #f0f2f5 !important;
}
.top-nav-brand .brand-mark::before {
  border-color: var(--accent) !important;
}
.top-nav-brand .brand-text strong {
  color: var(--ink) !important;
  font-weight: 600;
  font-size: .95rem;
  letter-spacing: .08em;
}

.top-nav-link:hover, .top-nav-link.active { color: var(--ink) !important; }
.top-nav-link::before {
  background: var(--ink) !important;
  box-shadow: 0 0 6px rgba(200,205,211,.4) !important;
}

.top-nav-actions .nav-icon {
  color: var(--ink-soft) !important;
  border-color: var(--line) !important;
}
.top-nav-actions .nav-icon:hover {
  border-color: var(--accent) !important;
  color: var(--ink) !important;
  background: var(--surface) !important;
}
.top-nav-actions .nav-icon.theme-toggle {
  color: var(--ink) !important;
}
.top-nav-actions .nav-icon.theme-toggle::after { border-color: var(--accent) !important; }
.top-nav-actions .nav-cta {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3, #9ba3ad) !important;
  color: #0e1014 !important;
  border-color: transparent !important;
}
[data-theme="light"] .top-nav-actions .nav-cta {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}
.top-nav-actions .nav-cta:hover {
  background: linear-gradient(135deg, #ffffff, #e8eaed) !important;
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(200,205,211,.25) !important;
}

/* Hide status pill cleanly even if it appears anywhere else */
.top-nav-status, .hud-status { display: none !important; }

/* ---------- Hero text ---------- */
.hero-badge { color: var(--ink-soft) !important; }
.hero-badge::before { background: var(--accent) !important; }
.hero-status { background: var(--accent) !important; box-shadow: 0 0 12px var(--accent) !important; }

.hero-title { color: var(--ink) !important; }
.hero-title [data-i18n="hero.hi"] { color: var(--ink-faint) !important; }
.hero-title [data-i18n="hero.hi"]::before { background: var(--accent) !important; }
.hero-title .gradient-text {
  background: linear-gradient(135deg, var(--ink), var(--ink-soft)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
.hero-title .name-italic {
  font-family: 'Fraunces', serif !important;
  font-style: italic !important;
  -webkit-text-fill-color: var(--ink-soft) !important;
  background: none !important;
}

.hero-subtitle { color: var(--ink-soft) !important; }
.hero-subtitle::before { color: var(--accent) !important; }
.cursor { color: var(--ink) !important; }

.hero-actions .btn-primary {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3, #9ba3ad) !important;
  color: #0e1014 !important;
  border-color: transparent !important;
  box-shadow: 0 4px 16px rgba(200,205,211,.15) !important;
}
[data-theme="light"] .hero-actions .btn-primary {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}
.hero-actions .btn-primary:hover {
  background: linear-gradient(135deg, #ffffff, #e8eaed) !important;
  box-shadow: 0 12px 30px rgba(200,205,211,.3) !important;
}
.hero-actions .btn-ghost { color: var(--ink) !important; }
.hero-actions .btn-ghost:hover {
  background: var(--ink) !important;
  color: var(--bg) !important;
  border-color: var(--ink) !important;
}

.hero-socials a:hover { color: var(--ink) !important; }

/* ---------- Sections ---------- */
.section-tag { color: var(--ink-soft) !important; }
.section-tag::before { background: var(--accent) !important; }

.section-title .gradient-text {
  background: linear-gradient(135deg, var(--ink-soft), var(--ink-faint)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-family: 'Fraunces', serif !important;
  font-style: italic !important;
}

.section::before { color: var(--ink-faint) !important; }

#about::before        { content: '[ § 01 ] // INTEL.PROFILE'; }
#experience::before   { content: '[ § 02 ] // OPS.HISTORY'; }
#skills::before       { content: '[ § 03 ] // CAPABILITIES'; }
#projects::before     { content: '[ § 04 ] // ACTIVE.OPS'; }
#publications::before { content: '[ § 05 ] // RESEARCH.FILES'; }
#contact::before      { content: '[ § 06 ] // SECURE.CHANNEL'; }

/* Stat numbers — chrome metallic */
.stat-number, .stat-suffix {
  background: linear-gradient(180deg, var(--ink), var(--ink-soft)) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
.stat-suffix { background: linear-gradient(180deg, var(--accent), var(--accent-deep)) !important; -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important; }

/* Skills */
.skill-icon { color: var(--ink) !important; border-color: var(--line-2) !important; }
.skill-bar span {
  background: linear-gradient(90deg, var(--ink-faint), var(--ink-soft), var(--ink)) !important;
  box-shadow: none !important;
}

/* Timeline */
.timeline::before {
  background: linear-gradient(180deg, var(--accent), transparent) !important;
}
.timeline-dot {
  background: var(--accent) !important;
  box-shadow: 0 0 0 4px var(--bg), 0 0 0 5px var(--line-2) !important;
}
.timeline-card h4 { color: var(--ink-soft) !important; font-style: italic; }
.timeline-card li::before { background: var(--accent) !important; box-shadow: none !important; }

/* Education */
.edu-card h4 { color: var(--ink-soft) !important; font-style: italic; }

/* Projects */
.project-icon { color: var(--ink) !important; border-color: var(--line-2) !important; }
.project-card:hover .project-icon { color: var(--accent) !important; border-color: var(--accent) !important; }

/* Publications */
.pub-badge {
  color: var(--ink) !important;
  border-color: var(--line-2) !important;
  background: var(--surface) !important;
}
.pub-link { color: var(--ink) !important; }

/* Contact */
.contact-list li i { color: var(--ink) !important; border-color: var(--line-2) !important; }
.contact-list a:hover { color: var(--ink) !important; }
.contact-form input:focus, .contact-form textarea:focus {
  border-bottom-color: var(--ink) !important;
}
.contact-form .btn-primary {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3) !important;
  color: #0e1014 !important;
  border-color: transparent !important;
}
[data-theme="light"] .contact-form .btn-primary {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}

/* Footer */
.footer-left .logo-mark {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3, #6c737d) !important;
  color: #0e1014 !important;
}
[data-theme="light"] .footer-left .logo-mark {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}
.footer-right a:hover {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3) !important;
  border-color: transparent !important;
  color: #0e1014 !important;
}
[data-theme="light"] .footer-right a:hover {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}
.footer-legal a:hover {
  color: var(--ink) !important;
  border-color: var(--accent) !important;
  background: var(--surface) !important;
}

/* Marquee */
.marquee-track span:nth-child(odd) { color: var(--ink) !important; }
.marquee-track span:nth-child(even) {
  -webkit-text-stroke: 1px var(--ink-soft) !important;
}

/* Cursor */
.cursor-dot {
  background: var(--ink) !important;
  box-shadow: 0 0 12px rgba(200,205,211,.6) !important;
}
.cursor-ring { border-color: var(--ink) !important; }

/* Selection */
::selection { background: var(--ink) !important; color: var(--bg) !important; }

/* Scrollbar */
::-webkit-scrollbar-thumb { background: var(--line-2) !important; }
::-webkit-scrollbar-thumb:hover { background: var(--ink-soft) !important; }

/* ==================================================
   FACE SCAN — silver palette
   ================================================== */

.face-scan .reticle { border-color: var(--ink) !important; }
.face-scan .reticle::before, .face-scan .reticle::after,
.face-scan .reticle .lb, .face-scan .reticle .rb { border-color: var(--ink) !important; }
.face-scan .sweep {
  background: linear-gradient(180deg, transparent, rgba(232,234,237,.6), transparent) !important;
}

.face-scan .dot {
  background: #fff !important;
  border: 2px solid var(--ink) !important;
  box-shadow: 0 0 0 4px rgba(200,205,211,.18), 0 0 16px rgba(200,205,211,.6) !important;
}

.face-scan .link {
  background: linear-gradient(0deg, transparent, var(--ink)) !important;
}

/* Tags — Lóvi-style WHITE pills */
.face-scan .tag {
  background: #ffffff !important;
  color: #0e1014 !important;
  border: none !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.5), 0 0 0 1px rgba(200,205,211,.3) !important;
}
[data-theme="light"] .face-scan .tag {
  background: #ffffff !important;
  box-shadow: 0 8px 24px rgba(20,25,30,.18), 0 0 0 1px rgba(20,25,30,.12) !important;
}
.face-scan .tag .ok {
  background: linear-gradient(135deg, #6c737d, #1a1d22) !important;
  color: #fff !important;
}
.face-scan .tag .pct { color: #1a1d22 !important; font-weight: 700; }
.face-scan .tag .tag-label { color: #8b929b !important; }
.face-scan .tag .tag-value { color: #0e1014 !important; }
.face-scan .tag .tag-value strong { color: #1a1d22 !important; }

/* Stamp */
.face-scan .stamp {
  border-color: var(--ink) !important;
  color: var(--ink) !important;
  text-shadow: 0 0 20px rgba(200,205,211,.5) !important;
  box-shadow: 0 0 40px rgba(200,205,211,.3) !important;
  background: rgba(14,16,20,.6) !important;
}
[data-theme="light"] .face-scan .stamp {
  background: rgba(240,242,245,.6) !important;
}

/* Ribbon — chrome gradient */
.face-scan .ribbon {
  background: linear-gradient(90deg, #6c737d, #c8cdd3, #e8eaed) !important;
  color: #0e1014 !important;
}
[data-theme="light"] .face-scan .ribbon {
  background: linear-gradient(90deg, #1a1d22, #4a5159, #6c737d) !important;
  color: #f0f2f5 !important;
}

/* Fingerprint button */
.fp-auth .fp-icon {
  border-color: var(--line-2) !important;
  color: var(--ink) !important;
}
.fp-auth:hover .fp-icon {
  border-color: var(--ink) !important;
  background: var(--surface) !important;
}
.fp-auth.scanning .fp-icon, .fp-auth.verified .fp-icon {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3) !important;
  color: #0e1014 !important;
}
[data-theme="light"] .fp-auth.scanning .fp-icon, [data-theme="light"] .fp-auth.verified .fp-icon {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}
.fp-auth .fp-label .top { color: var(--ink-soft) !important; }
.fp-auth.verified .fp-label .top, .fp-auth.verified .fp-label .bot { color: var(--ink) !important; }

/* Status overlay text */
.face-scan .status-overlay { color: var(--ink) !important; }
.face-scan .status-overlay .label { color: var(--ink-faint) !important; }
.face-scan .status-overlay .v { color: var(--ink) !important; }

/* Profile frame — subtle metallic */
.profile-frame {
  background: linear-gradient(180deg, #1a1d22, #0e1014) !important;
  box-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 1px var(--line) !important;
}
.profile-card::before { border-color: var(--accent) !important; }

/* Side rail (legacy) */
.side-mark .mark-letter { color: var(--ink) !important; }
.side-mark .mark-dot { background: var(--accent) !important; }
.side-menu-link:hover, .side-menu-link.active { color: var(--ink) !important; }
.side-menu-link::before { background: var(--accent) !important; }
.side-status-dot { background: var(--accent) !important; }

/* Legal pages */
.legal-block h2::before { background: var(--accent) !important; }
.legal-block ul li::before { color: var(--ink) !important; }
.legal-block a { color: var(--ink) !important; }
.legal-block a:hover { border-bottom-color: var(--ink) !important; }
.legal-block em { color: var(--ink-soft) !important; }
.legal-back:hover {
  background: linear-gradient(135deg, #e8eaed, #c8cdd3) !important;
  color: #0e1014 !important;
  border-color: transparent !important;
}
[data-theme="light"] .legal-back:hover {
  background: linear-gradient(135deg, #1a1d22, #4a5159) !important;
  color: #f0f2f5 !important;
}