/* ==================================================
   CIA — Classified Intelligence Aesthetic
   Royal Purple · Deep Navy · Bone White · Mysterious
   Loaded LAST. Replaces lime-green palette.
   ================================================== */

[data-theme="dark"] {
  --bg: #07060d !important;             /* deep ink with violet tint */
  --bg-2: #0d0c17 !important;
  --surface: rgba(167,139,250,.04) !important;
  --line: rgba(167,139,250,.10) !important;
  --line-2: rgba(167,139,250,.22) !important;
  --ink: #e8e6f0 !important;            /* warm bone */
  --ink-soft: #8a87a3 !important;       /* muted lavender-grey */
  --ink-faint: #4d4a66 !important;
  --accent: #8b5cf6 !important;         /* royal violet */
  --accent-2: #c4b5fd !important;       /* soft lavender */
  --accent-deep: #5b21b6 !important;    /* deep purple */
  --warn: #f59e0b !important;
  --danger: #dc2626 !important;
}
[data-theme="light"] {
  --bg: #f4f3f8 !important;
  --bg-2: #e9e7ef !important;
  --surface: rgba(91,33,182,.025) !important;
  --line: rgba(15,15,30,.10) !important;
  --line-2: rgba(91,33,182,.22) !important;
  --ink: #0a0815 !important;
  --ink-soft: #4d4a66 !important;
  --ink-faint: #8a87a3 !important;
  --accent: #5b21b6 !important;
  --accent-2: #7c3aed !important;
  --accent-deep: #4c1d95 !important;
}

/* ---------- Remove broken HUD widget completely ---------- */
.cyber-hud { display: none !important; }

/* ---------- Override Matrix rain to match palette ---------- */
#matrix-rain { opacity: .07 !important; }   /* even more subtle */

/* ---------- Body backdrop refined ---------- */
body::after {
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px) !important;
  opacity: .25 !important;
}

/* ---------- Subtle vignette ---------- */
body {
  background-image:
    radial-gradient(ellipse at 70% 30%, rgba(139,92,246,.10), transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(91,33,182,.08), transparent 60%);
}
[data-theme="light"] body {
  background-image:
    radial-gradient(ellipse at 70% 30%, rgba(139,92,246,.05), transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(91,33,182,.04), transparent 60%);
}

/* ---------- Top nav refinement ---------- */
.top-nav-brand .brand-mark {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  color: #fff !important;
  border-radius: 4px !important;
  letter-spacing: -.04em;
  font-family: 'JetBrains Mono', monospace !important;
  font-weight: 700;
}
.top-nav-brand .brand-mark::before { border-color: var(--accent) !important; }
.top-nav-brand .brand-text strong { color: var(--ink) !important; }
.top-nav-brand .brand-text small { color: var(--accent-2) !important; }

.top-nav-link:hover, .top-nav-link.active { color: var(--accent-2) !important; }
.top-nav-link::before { background: var(--accent) !important; box-shadow: 0 0 8px var(--accent) !important; }

.top-nav-status {
  background: rgba(139,92,246,.08) !important;
  border-color: var(--line-2) !important;
}
.top-nav-status .dot {
  background: var(--accent-2) !important;
  box-shadow: 0 0 10px var(--accent-2) !important;
}

.top-nav-actions .nav-icon { color: var(--ink-soft) !important; }
.top-nav-actions .nav-icon:hover {
  border-color: var(--accent) !important;
  color: var(--accent-2) !important;
  background: rgba(139,92,246,.06) !important;
}
.top-nav-actions .nav-icon.theme-toggle {
  color: var(--accent-2) !important;
}
.top-nav-actions .nav-icon.theme-toggle::after { border-color: var(--accent) !important; }
.top-nav-actions .nav-cta {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}
.top-nav-actions .nav-cta:hover {
  background: linear-gradient(135deg, var(--accent-2), var(--accent)) !important;
  border-color: var(--accent-2) !important;
  color: #fff !important;
}

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

.hero-title { color: var(--ink) !important; }
.hero-title [data-i18n="hero.hi"] { color: var(--ink-soft) !important; }
.hero-title [data-i18n="hero.hi"]::before { background: var(--accent) !important; }
.hero-title .gradient-text {
  -webkit-text-fill-color: var(--ink) !important;
  color: var(--ink) !important;
}
.hero-title .name-italic {
  color: var(--accent-2) !important;
}

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

.hero-actions .btn-primary {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}
.hero-actions .btn-primary:hover {
  background: linear-gradient(135deg, var(--accent-2), var(--accent)) !important;
  box-shadow: 0 8px 24px rgba(139,92,246,.4) !important;
}
.hero-actions .btn-ghost { color: var(--ink) !important; }
.hero-actions .btn-ghost:hover {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}

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

/* ---------- Sections ---------- */
.section-tag { color: var(--accent-2) !important; }
.section-tag::before { background: var(--accent) !important; box-shadow: 0 0 8px var(--accent); }

.section-title .gradient-text { color: var(--accent-2) !important; }
.section::before { color: var(--ink-faint) !important; }

/* CIA-style classified labels */
#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 */
.stat-suffix { color: var(--accent-2) !important; -webkit-text-fill-color: var(--accent-2) !important; }

/* Skills */
.skill-icon { color: var(--accent-2) !important; }
.skill-bar span {
  background: linear-gradient(90deg, var(--accent-deep), var(--accent), var(--accent-2)) !important;
  box-shadow: 0 0 8px var(--accent) !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), 0 0 12px var(--accent) !important;
}
.timeline-card h4 { color: var(--accent-2) !important; }
.timeline-card li::before { background: var(--accent) !important; }

/* Education */
.edu-card h4 { color: var(--accent-2) !important; }

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

/* Publications */
.pub-badge {
  color: var(--accent-2) !important;
  border-color: var(--accent) !important;
  background: rgba(139,92,246,.05) !important;
}
.pub-link { color: var(--accent-2) !important; }

/* Contact */
.contact-list li i { color: var(--accent-2) !important; }
.contact-list a:hover { color: var(--accent-2) !important; }
.contact-form input:focus, .contact-form textarea:focus {
  border-bottom-color: var(--accent) !important;
}
.contact-form .btn-primary {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}

/* Footer */
.footer-left .logo-mark {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  color: #fff !important;
}
.footer-right a:hover {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  border-color: var(--accent) !important;
  color: #fff !important;
}
.footer-legal a:hover {
  color: var(--accent-2) !important;
  border-color: var(--accent) !important;
  background: rgba(139,92,246,.05) !important;
}

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

/* Cursor */
.cursor-dot { background: var(--accent-2) !important; box-shadow: 0 0 12px var(--accent-2) !important; }
.cursor-ring { border-color: var(--accent-2) !important; }

/* Selection */
::selection { background: var(--accent) !important; color: #fff !important; }

/* Scrollbar */
::-webkit-scrollbar-thumb:hover { background: var(--accent) !important; }

/* ==================================================
   LÓVI-STYLE FACE SCAN — clean white pills + curved leaders
   ================================================== */

.face-scan .reticle { border-color: var(--accent-2) !important; }
.face-scan .reticle::before, .face-scan .reticle::after,
.face-scan .reticle .lb, .face-scan .reticle .rb { border-color: var(--accent-2) !important; }
.face-scan .sweep {
  background: linear-gradient(180deg, transparent, rgba(196,181,253,.55), transparent) !important;
}

.face-scan .dot {
  width: 10px !important; height: 10px !important;
  background: #fff !important;
  border: 2px solid var(--accent) !important;
  box-shadow: 0 0 0 4px rgba(139,92,246,.18), 0 0 16px var(--accent) !important;
}

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

/* Tags — Lóvi-style WHITE rounded pills with avatar dot */
.face-scan .tag {
  background: #fff !important;
  color: #0a0815 !important;
  border: none !important;
  border-radius: 14px !important;
  padding: .5rem .8rem !important;
  font-family: 'Inter Tight', sans-serif !important;
  font-size: .68rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.4), 0 0 0 1px rgba(139,92,246,.2) !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: .55rem !important;
  align-items: center !important;
}
[data-theme="light"] .face-scan .tag {
  background: #fff !important;
  box-shadow: 0 8px 24px rgba(91,33,182,.2), 0 0 0 1px rgba(91,33,182,.12) !important;
}
.face-scan .tag .ok {
  background: var(--accent) !important;
  color: #fff !important;
  width: 18px !important; height: 18px !important;
  font-size: 9px !important;
}
.face-scan .tag .pct { color: var(--accent) !important; font-weight: 600; }

/* Tag layout: small label on top, value below */
.face-scan .tag .tag-body { display: grid; gap: 2px; line-height: 1.1; }
.face-scan .tag .tag-label { font-size: .58rem; color: #6b6481; text-transform: uppercase; letter-spacing: .12em; font-weight: 500; }
.face-scan .tag .tag-value { font-size: .82rem; color: #0a0815; font-weight: 600; letter-spacing: -.01em; }
.face-scan .tag .tag-value strong { color: var(--accent); }

/* Adjust position offsets so tags don't crash into edges */
.face-scan .tag.t1 { top: 4%;  left: -22%; }
.face-scan .tag.t2 { top: 4%;  right: -28%; }
.face-scan .tag.t3 { top: 36%; right: -34%; }
.face-scan .tag.t4 { bottom: 14%; right: -28%; }
.face-scan .tag.t5 { bottom: -2%; left: -22%; }

@media (max-width: 1024px) {
  .face-scan .tag.t1 { top: 4%;  left: 0; }
  .face-scan .tag.t2 { top: 4%;  right: 0; }
  .face-scan .tag.t3 { top: 38%; right: 0; }
  .face-scan .tag.t4 { bottom: 14%; right: 0; }
  .face-scan .tag.t5 { bottom: 2%; left: 0; }
}

/* Stamp */
.face-scan .stamp {
  border-color: var(--accent-2) !important;
  color: var(--accent-2) !important;
  text-shadow: 0 0 20px var(--accent) !important;
  box-shadow: 0 0 40px rgba(139,92,246,.4) !important;
  background: rgba(7,6,13,.6) !important;
}

/* Ribbon — purple gradient */
.face-scan .ribbon {
  background: linear-gradient(90deg, var(--accent-deep), var(--accent), var(--accent-2)) !important;
  color: #fff !important;
}

/* Fingerprint button — purple */
.fp-auth .fp-icon {
  border-color: var(--line-2) !important;
  color: var(--accent-2) !important;
}
.fp-auth:hover .fp-icon {
  border-color: var(--accent) !important;
  background: rgba(139,92,246,.1) !important;
  color: var(--accent-2) !important;
}
.fp-auth .fp-icon::before { border-color: var(--accent) !important; }
.fp-auth.scanning .fp-icon { background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important; color: #fff !important; }
.fp-auth.verified .fp-icon { background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important; color: #fff !important; }
.fp-auth .fp-label .top { color: var(--accent-2) !important; }
.fp-auth.verified .fp-label .top, .fp-auth.verified .fp-label .bot { color: var(--accent-2) !important; }

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

/* Profile frame — slight dark navy tint */
.profile-frame {
  background: linear-gradient(180deg, #0d0c17, #07060d) !important;
}

/* Profile card accent stripe */
.profile-card::before { border-color: var(--accent) !important; }

/* ---------- Side rail (legacy) accent ---------- */
.side-mark .mark-letter { color: var(--accent-2) !important; }
.side-mark .mark-dot { background: var(--accent) !important; box-shadow: 0 0 10px var(--accent) !important; }
.side-menu-link:hover, .side-menu-link.active { color: var(--accent-2) !important; }
.side-menu-link::before { background: var(--accent) !important; }
.side-status-dot { background: var(--accent-2) !important; box-shadow: 0 0 12px var(--accent-2) !important; }

/* ---------- Legal page accent ---------- */
.legal-block h2::before { background: var(--accent) !important; }
.legal-block ul li::before { color: var(--accent-2) !important; }
.legal-block a { color: var(--accent-2) !important; }
.legal-block a:hover { border-bottom-color: var(--accent) !important; }
.legal-block em { color: var(--accent-2) !important; }
.legal-back:hover {
  background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
  color: #fff !important;
  border-color: var(--accent) !important;
}