/* ==========================================================================
   editorial.css — 4th theme: fully monochrome, spacious editorial style
   Inspired by ahmedramadan.me — zero accent color, proportional sans, huge
   bold titles, generous whitespace, flat near-black bg.
   All rules scoped under html[data-skin="editorial"].  Inert when off.
   ========================================================================== */

/* ---------- Tokens ---------- */
html[data-skin="editorial"] {
  --bg: #111111;
  --bg-surface: #161616;
  --bg-card: #1a1a1a;
  --border: rgba(255,255,255,.08);
  --border-glow: rgba(255,255,255,.1);
  --text: #e5e5e5;
  --text-muted: #777777;
  --cyan: #e5e5e5;
  --cyan-rgb: 229,229,229;
  --magenta: #999999;
  --magenta-rgb: 153,153,153;
  --purple: #999999;
  --purple-rgb: 153,153,153;
  --blue: #aaaaaa;
  --blue-rgb: 170,170,170;
  --gradient: none;
  --gradient-text: none;
  --glow-magenta: transparent;
  --glow-cyan: transparent;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
  --ed-gray-1: #e5e5e5;
  --ed-gray-2: #aaaaaa;
  --ed-gray-3: #777777;
  --ed-gray-4: #444444;
  --ed-gray-5: #2a2a2a;
  --ed-bg: #111111;

  /* Tokens the base (blue) palette also defines. Without these the blue
     leaks through any rule that references them — e.g. the cursor spotlight
     used rgba(var(--sky-rgb)) and rendered bright blue on this skin. */
  --sky: #aaaaaa;            --sky-rgb: 170,170,170;
  --pink: #999999;
  --accent-strong: #e5e5e5;
  --border-glow-rgb: 255,255,255;
  --muted-rgb: 119,119,119;
  --surface-rgb: 17,17,17;
  --shadow-rgb: 0,0,0;
  --tint-rgb: 255,255,255;
  /* Severity stays readable without colour by varying lightness instead. */
  --danger: #e5e5e5;         --danger-rgb: 229,229,229;
  --warn: #aaaaaa;           --warn-rgb: 170,170,170;
}

/* ---------- Decorative motion OFF ----------------------------------------
   The base theme layers neon-era motion on top of the markup: a rotating
   conic-gradient border, a flowing gradient bar, breathing halos, pulsing
   dots and sweeping dividers. None of it belongs in a flat editorial skin,
   and because this file previously declared no animation rules at all, every
   one of them still played. Kill the decoration; keep functional motion
   (typewriter caret, terminal caret, toggle spin).                        */
html[data-skin="editorial"] .experience-card-wrapper::before,
html[data-skin="editorial"] .experience-card-wrapper::after,
html[data-skin="editorial"] .experience-card::before,
html[data-skin="editorial"] .hero-photo-wrapper::before,
html[data-skin="editorial"] .cve-badge-corner,
html[data-skin="editorial"] .section ~ .section.divider-in::before,
html[data-skin="editorial"] .section ~ .section.divider-in::after,
html[data-skin="editorial"] .reading-progress::after,
html[data-skin="editorial"] .has-spotlight::after {
  display: none !important;
  animation: none !important;
}
html[data-skin="editorial"] .experience-card-wrapper {
  padding: 0 !important;
  background: transparent !important;
  border-radius: 8px !important;
  overflow: visible !important;
}
html[data-skin="editorial"] .exp-timeline-dot,
html[data-skin="editorial"] .hero-name .gradient-text,
html[data-skin="editorial"] .scroll-line,
html[data-skin="editorial"] .opening {
  animation: none !important;
}

/* Terminal / CVE window chrome: the macOS traffic-light dots are the last
   colour on the page. Keep the three-dot rhythm, drop the hue. */
html[data-skin="editorial"] .terminal-dot,
html[data-skin="editorial"] .cve-dots .terminal-dot {
  background: var(--ed-gray-4) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .terminal-dot.green,
html[data-skin="editorial"] .cve-dots .terminal-dot.green {
  background: var(--ed-gray-3) !important;
}

/* Progress bar. The base theme draws a "fire line": a 6-stop blue gradient
   with a glowing ember on the leading edge and a blurred heat haze above it,
   all hardcoded hexes that no token override can reach. Editorial wants a
   plain hairline. */
html[data-skin="editorial"] .scroll-progress,
html[data-skin="editorial"] .reading-progress span {
  background: var(--ed-gray-2) !important;
  background-image: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
html[data-skin="editorial"] .scroll-progress::before,
html[data-skin="editorial"] .scroll-progress::after,
html[data-skin="editorial"] .reading-progress::before,
html[data-skin="editorial"] .reading-progress::after {
  display: none !important;
  animation: none !important;
}

/* ---------- Resume (/resume) ----------------------------------------------
   The resume had no editorial rules at all. Most of it inherits the tokens
   fine, but the skills grid assigns a different hue per category through a
   --sk variable set on :nth-child(1..6), which no token override reaches. */
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group,
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group:nth-child(1),
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group:nth-child(2),
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group:nth-child(3),
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group:nth-child(4),
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group:nth-child(5),
html[data-skin="editorial"] .rv-skills-grid .rv-skill-group:nth-child(6) {
  --sk: 170,170,170;
}
html[data-skin="editorial"] .rv-skills-grid .rv-skill-cat {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .rv-skills-grid .skill-tag {
  background: var(--ed-gray-5) !important;
  border: 1px solid var(--border) !important;
  color: var(--ed-gray-2) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .rv-skills-grid .skill-tag:hover {
  transform: none !important;
  box-shadow: none !important;
  background: var(--ed-gray-5) !important;
  border-color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .rv-title {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .rv-exp-card,
html[data-skin="editorial"] .rv-section {
  background: transparent !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .rv-exp-card {
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
}
html[data-skin="editorial"] .rv-exp-role { color: var(--ed-gray-1) !important; }
html[data-skin="editorial"] .rv-exp-company,
html[data-skin="editorial"] .rv-exp-period,
html[data-skin="editorial"] .rv-exp-location,
html[data-skin="editorial"] .rv-exp-list li,
html[data-skin="editorial"] .rv-about { color: var(--ed-gray-3) !important; }

/* ---------- Global resets ---------- */
html[data-skin="editorial"] body {
  background: var(--ed-bg) !important;
  color: var(--text) !important;
  font-family: var(--font-body) !important;
}

/* Kill all glows, gradients, neon effects */
html[data-skin="editorial"] .gradient-text {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: var(--ed-gray-1) !important;
  color: var(--ed-gray-1) !important;
}

html[data-skin="editorial"] a {
  color: var(--ed-gray-1) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--ed-gray-4) !important;
  text-underline-offset: 3px !important;
  transition: text-decoration-color .15s !important;
}
html[data-skin="editorial"] a:hover {
  text-decoration-color: var(--ed-gray-1) !important;
  color: #ffffff !important;
}

/* No cursor glow */
html[data-skin="editorial"] .cursor-glow { display: none !important; }

/* ---------- Navbar ---------- */
html[data-skin="editorial"] .navbar,
html[data-skin="editorial"] .navbar.scrolled {
  background: var(--ed-bg) !important;
  backdrop-filter: none !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .nav-logo-text {
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
  color: var(--ed-gray-1) !important;
  letter-spacing: 0 !important;
}
html[data-skin="editorial"] .nav-logo-icon {
  display: none !important;
}
html[data-skin="editorial"] .logo-highlight {
  color: var(--ed-gray-1) !important;
  -webkit-text-fill-color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .nav-link {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  letter-spacing: 0.3px !important;
}
html[data-skin="editorial"] .nav-link:hover,
html[data-skin="editorial"] .nav-link[aria-current="page"] {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .nav-cta {
  background: transparent !important;
  border: 1px solid var(--ed-gray-4) !important;
  color: var(--ed-gray-2) !important;
  text-decoration: none !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .nav-cta:hover {
  border-color: var(--ed-gray-2) !important;
  color: var(--ed-gray-1) !important;
  background: transparent !important;
}
html[data-skin="editorial"] .nav-cta::before,
html[data-skin="editorial"] .nav-cta::after {
  display: none !important;
}

/* ---------- Hero section ---------- */
html[data-skin="editorial"] .hero {
  min-height: auto !important;
  height: auto !important;
  padding: 10rem 0 5rem !important;
  background: var(--ed-bg) !important;
}
html[data-skin="editorial"] .hero::before,
html[data-skin="editorial"] .hero::after,
html[data-skin="editorial"] .hero-particles,
html[data-skin="editorial"] .hero-bg-grid {
  display: none !important;
}
html[data-skin="editorial"] .hero-photo-wrapper {
  width: 150px !important;
  height: 150px !important;
}
html[data-skin="editorial"] .hero-photo {
  border-radius: 50% !important;
  border: none !important;
  filter: grayscale(0.3) !important;
}
html[data-skin="editorial"] .hero-photo-ring {
  display: none !important;
}
html[data-skin="editorial"] .hero-name {
  font-size: clamp(2.2rem, 5vw, 3.6rem) !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.03em !important;
}
html[data-skin="editorial"] .hero-typed-wrapper {
  font-family: var(--font-body) !important;
  color: var(--ed-gray-3) !important;
  font-size: 1.1rem !important;
}
html[data-skin="editorial"] .hero-prompt {
  display: none !important;
}
html[data-skin="editorial"] .hero-tagline {
  color: var(--ed-gray-3) !important;
  font-size: 1.05rem !important;
  max-width: 540px !important;
}
/* Hero buttons — flat, monochrome */
html[data-skin="editorial"] .btn {
  background: transparent !important;
  border: 1px solid var(--ed-gray-4) !important;
  color: var(--ed-gray-2) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}
html[data-skin="editorial"] .btn:hover {
  border-color: var(--ed-gray-2) !important;
  color: var(--ed-gray-1) !important;
  background: rgba(255,255,255,.03) !important;
}
html[data-skin="editorial"] .btn::before,
html[data-skin="editorial"] .btn::after {
  display: none !important;
}
html[data-skin="editorial"] .btn-primary,
html[data-skin="editorial"] .btn-glow {
  background: transparent !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .hero-socials a {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .hero-socials a:hover {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .scroll-indicator { opacity: 0.3 !important; }
html[data-skin="editorial"] .scroll-line { background: var(--ed-gray-4) !important; }

/* ---------- Section titles ---------- */
html[data-skin="editorial"] .section-title {
  font-size: clamp(1.6rem, 3.5vw, 2.4rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}
html[data-skin="editorial"] .section-title::after,
html[data-skin="editorial"] .section-title::before {
  display: none !important;
}

/* ---------- Publications / Blog cards (homepage) ---------- */
html[data-skin="editorial"] .pub-card-v2 {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  overflow: hidden;
}
html[data-skin="editorial"] .pub-card-v2:hover {
  border-color: var(--ed-gray-4) !important;
  transform: none !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .pub-title-v2 {
  color: var(--ed-gray-1) !important;
  font-weight: 700 !important;
}
html[data-skin="editorial"] .pub-excerpt {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .pub-meta-v2 {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .pub-meta-v2 .icon {
  color: var(--ed-gray-4) !important;
}
/* Tags */
html[data-skin="editorial"] .blog-tag-cat,
html[data-skin="editorial"] .blog-tag,
html[data-skin="editorial"] .skill-tag {
  background: var(--ed-gray-5) !important;
  color: var(--ed-gray-3) !important;
  border: none !important;
  border-radius: 4px !important;
  text-decoration: none !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .skill-tag.muted {
  background: var(--ed-gray-5) !important;
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .section-cta a {
  color: var(--ed-gray-2) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .section-cta a:hover {
  color: var(--ed-gray-1) !important;
  border-bottom-color: var(--ed-gray-2) !important;
}

/* ---------- Whoami / About ---------- */
html[data-skin="editorial"] .about-text-v2 {
  color: var(--ed-gray-2) !important;
  font-size: 1.05rem !important;
  line-height: 1.75 !important;
}
html[data-skin="editorial"] .ai-badge {
  background: var(--ed-gray-5) !important;
  border: none !important;
  color: var(--ed-gray-3) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .ai-label {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .ai-value {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .about-stat-number {
  color: var(--ed-gray-1) !important;
  -webkit-text-fill-color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .about-stat-plus {
  color: var(--ed-gray-3) !important;
  -webkit-text-fill-color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .about-stat-label {
  color: var(--ed-gray-3) !important;
}

/* ---------- Activity (tweets) ---------- */
html[data-skin="editorial"] .activity-sub {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .activity-sub a {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .tip-card {
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ---------- Experience ---------- */
html[data-skin="editorial"] .experience-card {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .exp-timeline-dot {
  background: var(--ed-gray-4) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .exp-role {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .exp-years {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .platform-badge {
  background: var(--ed-gray-5) !important;
  border: 1px solid var(--border) !important;
  color: var(--ed-gray-2) !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .platform-badge:hover {
  border-color: var(--ed-gray-4) !important;
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .exp-highlight {
  color: var(--ed-gray-2) !important;
}
html[data-skin="editorial"] .highlight-icon {
  color: var(--ed-gray-3) !important;
}

/* ---------- Hall of Fame ---------- */
html[data-skin="editorial"] .hof-item {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 1.15rem 0 !important;
}
html[data-skin="editorial"] .hof-item:hover {
  border: 0 !important;
  transform: none !important;
  background: transparent !important;
}
html[data-skin="editorial"] .hof-company {
  color: var(--ed-gray-1) !important;
  font-weight: 700 !important;
}
html[data-skin="editorial"] .hof-text {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .hof-link-icon {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .hof-sub-list li {
  color: var(--ed-gray-3) !important;
}

/* ---------- CVE Discoveries ---------- */
html[data-skin="editorial"] .cve-card-item {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .cve-card-item:hover {
  transform: none !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .cve-card-header {
  background: var(--ed-bg) !important;
  border-bottom: 1px solid var(--border) !important;
}
html[data-skin="editorial"] .cve-type {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .cve-id-text {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .cve-title-line {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .severity-bar.filled {
  background: var(--ed-gray-2) !important;
}
html[data-skin="editorial"] .severity-bar {
  background: var(--ed-gray-5) !important;
}
html[data-skin="editorial"] .severity-label {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .cve-status-badge {
  background: var(--ed-gray-5) !important;
  border: none !important;
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .cve-subtitle {
  color: var(--ed-gray-3) !important;
}

/* ---------- Projects ---------- */
html[data-skin="editorial"] .project-card {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .project-card:hover {
  border-color: var(--ed-gray-4) !important;
  transform: none !important;
}
html[data-skin="editorial"] .project-name {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .project-desc {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .project-folder-icon,
html[data-skin="editorial"] .project-gh-icon {
  color: var(--ed-gray-3) !important;
}

/* ---------- Certifications ---------- */
html[data-skin="editorial"] .cert-card-v2 {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .cert-card-v2:hover {
  border-color: var(--ed-gray-4) !important;
  transform: none !important;
}
html[data-skin="editorial"] .cert-name-v2 {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .cert-full-v2 {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .cert-issuer-v2 {
  color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .cert-soon-badge {
  background: var(--ed-gray-5) !important;
  color: var(--ed-gray-3) !important;
  border: none !important;
}

/* ---------- Contact ---------- */
html[data-skin="editorial"] .terminal-window {
  background: var(--ed-bg) !important;
  border: 1px solid var(--border) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .terminal-header {
  background: rgba(255,255,255,.02) !important;
  border-bottom: 1px solid var(--border) !important;
}
html[data-skin="editorial"] .terminal-title {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .terminal-line {
  color: var(--ed-gray-2) !important;
}
html[data-skin="editorial"] .terminal-line .prompt {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .contact-form input,
html[data-skin="editorial"] .contact-form textarea {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--ed-gray-1) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .contact-form input:focus,
html[data-skin="editorial"] .contact-form textarea:focus {
  border-color: var(--ed-gray-3) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .contact-form label {
  color: var(--ed-gray-3) !important;
}

/* ---------- Footer ---------- */
html[data-skin="editorial"] .footer {
  background: var(--ed-bg) !important;
  border-top: 1px solid var(--border) !important;
}
html[data-skin="editorial"] .footer-logo .logo-bracket {
  color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .footer-logo .logo-text {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .footer-tagline {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .footer-heading {
  color: var(--ed-gray-3) !important;
  letter-spacing: 1px !important;
}
html[data-skin="editorial"] .footer-heading .gradient-text {
  color: var(--ed-gray-3) !important;
  -webkit-text-fill-color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .footer-quick a {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .footer-quick a:hover {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .footer-icons a {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .footer-icons a:hover {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .footer-bottom {
  border-top: 1px solid var(--border) !important;
  color: var(--ed-gray-4) !important;
}

/* ---------- Blog index / listing ---------- */
html[data-skin="editorial"] .page-subtitle {
  color: var(--ed-gray-3) !important;
}
/* Filter pills */
html[data-skin="editorial"] .pill {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--ed-gray-3) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .pill:hover,
html[data-skin="editorial"] .pill.active {
  background: rgba(255,255,255,.05) !important;
  border-color: var(--ed-gray-4) !important;
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .pill-count {
  color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .pill-link {
  text-decoration: none !important;
}
/* Search */
html[data-skin="editorial"] .search-bar {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .search-bar input {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .search-bar .icon {
  color: var(--ed-gray-4) !important;
}
/* Blog cards */
html[data-skin="editorial"] .blog-card-v2 {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .blog-card-v2:hover {
  border-color: var(--ed-gray-4) !important;
  transform: none !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .blog-card-title-v2 {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .blog-meta {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .blog-meta .icon {
  color: var(--ed-gray-4) !important;
}

/* ---------- Post page ---------- */
/* Header */
html[data-skin="editorial"] .post-back {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .post-back:hover {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .post-title {
  font-size: clamp(2rem, 4.5vw, 3rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.03em !important;
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .blog-date,
html[data-skin="editorial"] .blog-read-time {
  color: var(--ed-gray-3) !important;
}

/* Body content */
html[data-skin="editorial"] .post-content {
  color: var(--ed-gray-2) !important;
  font-size: 1.08rem !important;
  line-height: 1.85 !important;
}
html[data-skin="editorial"] .post-content a {
  color: var(--ed-gray-1) !important;
  text-decoration: underline !important;
  text-decoration-color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .post-content a:hover {
  text-decoration-color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .post-content h2 {
  color: var(--ed-gray-1) !important;
  font-weight: 700 !important;
  font-size: 1.55rem !important;
  margin: 2.5rem 0 1rem !important;
  border-left: 3px solid var(--ed-gray-4) !important;
  padding-left: 0.9rem !important;
}
html[data-skin="editorial"] .post-content h2::before,
html[data-skin="editorial"] .post-content h2::after {
  display: none !important;
}
html[data-skin="editorial"] .post-content h3 {
  color: var(--ed-gray-1) !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
  margin: 1.8rem 0 0.8rem !important;
}
html[data-skin="editorial"] .post-content strong {
  color: var(--ed-gray-1) !important;
  font-weight: 700 !important;
}
html[data-skin="editorial"] .post-content em {
  color: var(--ed-gray-2) !important;
}
html[data-skin="editorial"] .post-content ul,
html[data-skin="editorial"] .post-content ol {
  color: var(--ed-gray-2) !important;
}

/* Code blocks — flat, no accent */
html[data-skin="editorial"] .post-content :not(pre) > code {
  background: rgba(255,255,255,.06) !important;
  color: var(--ed-gray-1) !important;
  border: none !important;
  border-radius: 3px !important;
  padding: 2px 6px !important;
  font-size: 0.88em !important;
}
html[data-skin="editorial"] .post-content pre {
  background: rgba(255,255,255,.03) !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .post-content pre::before,
html[data-skin="editorial"] .post-content pre::after {
  display: none !important;
}
html[data-skin="editorial"] .post-content pre code {
  color: var(--ed-gray-2) !important;
  font-size: 0.85rem !important;
}
html[data-skin="editorial"] .code-head {
  background: rgba(255,255,255,.02) !important;
  border-bottom: 1px solid var(--border) !important;
}
html[data-skin="editorial"] .code-lang {
  color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .code-copy {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .code-copy:hover {
  color: var(--ed-gray-1) !important;
}

/* Blockquote */
html[data-skin="editorial"] .post-content blockquote {
  border-left: 3px solid var(--ed-gray-4) !important;
  background: transparent !important;
  color: var(--ed-gray-3) !important;
  padding: 0.5rem 0 0.5rem 1.2rem !important;
  margin: 1.5rem 0 !important;
}

/* Images */
html[data-skin="editorial"] .post-content img {
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
}

/* Tables */
html[data-skin="editorial"] .post-content table {
  border-collapse: collapse !important;
}
html[data-skin="editorial"] .post-content th,
html[data-skin="editorial"] .post-content td {
  border: 1px solid var(--border) !important;
}
html[data-skin="editorial"] .post-content th {
  background: rgba(255,255,255,.03) !important;
  color: var(--ed-gray-1) !important;
}

/* TOC sidebar */
html[data-skin="editorial"] .toc-sidebar h4 {
  color: var(--ed-gray-1) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
}
html[data-skin="editorial"] .toc-sidebar a {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
  border-left-color: var(--border) !important;
}
html[data-skin="editorial"] .toc-sidebar a:hover,
html[data-skin="editorial"] .toc-sidebar a.is-active {
  color: var(--ed-gray-1) !important;
  border-left-color: var(--ed-gray-2) !important;
}

/* Share */
html[data-skin="editorial"] .post-share {
  border: 1px solid var(--border) !important;
  background: transparent !important;
}
html[data-skin="editorial"] .post-share span {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .share-btn {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .share-btn:hover {
  color: var(--ed-gray-1) !important;
  border-color: var(--ed-gray-4) !important;
}

/* Related writeups (in-column) */
html[data-skin="editorial"] .post-related {
  border-top: 1px solid var(--border) !important;
}
html[data-skin="editorial"] .post-related-title {
  color: var(--ed-gray-1) !important;
  font-weight: 700 !important;
}
html[data-skin="editorial"] .post-related-card {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .post-related-card:hover {
  border-color: var(--ed-gray-4) !important;
  transform: none !important;
  background: transparent !important;
}
html[data-skin="editorial"] .post-related-cat {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .post-related-name {
  color: var(--ed-gray-1) !important;
}

/* Prev / Next */
html[data-skin="editorial"] .post-nav-link {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .post-nav-link:hover {
  border-color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .post-nav-label {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .post-nav-title {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .post-nav-link:hover .post-nav-title {
  color: #ffffff !important;
}

/* Comments */
html[data-skin="editorial"] .comments-title {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .comments-count {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .comment-input {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--ed-gray-1) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .comment-input:focus {
  border-color: var(--ed-gray-3) !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .comment-submit {
  background: transparent !important;
  border: 1px solid var(--ed-gray-4) !important;
  color: var(--ed-gray-2) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
html[data-skin="editorial"] .comment-submit:hover {
  border-color: var(--ed-gray-2) !important;
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .comment-card {
  background: transparent !important;
  border: 1px solid var(--border) !important;
  border-radius: 6px !important;
}
html[data-skin="editorial"] .comment-author {
  color: var(--ed-gray-1) !important;
}
html[data-skin="editorial"] .comment-date {
  color: var(--ed-gray-4) !important;
}
html[data-skin="editorial"] .comment-body {
  color: var(--ed-gray-2) !important;
}
html[data-skin="editorial"] .comment-like-btn,
html[data-skin="editorial"] .reply-toggle {
  color: var(--ed-gray-3) !important;
  text-decoration: none !important;
}
html[data-skin="editorial"] .comment-like-btn:hover,
html[data-skin="editorial"] .reply-toggle:hover,
html[data-skin="editorial"] .comment-like-btn.liked {
  color: var(--ed-gray-1) !important;
}

/* Reading progress bar */
html[data-skin="editorial"] .reading-progress span {
  background: linear-gradient(90deg, var(--ed-gray-3), var(--ed-gray-1)) !important;
  box-shadow: none !important;
}

/* ---------- Resume page ---------- */
html[data-skin="editorial"] .resume-photo img {
  filter: grayscale(0.3) !important;
  border: none !important;
}
html[data-skin="editorial"] .resume-hero {
  border-bottom: 1px solid var(--border) !important;
}

/* ---------- Loader ---------- */
html[data-skin="editorial"] .loader {
  background: var(--ed-bg) !important;
}
html[data-skin="editorial"] .loader-prompt {
  color: var(--ed-gray-3) !important;
}

/* ---------- Misc overrides ---------- */
html[data-skin="editorial"] .section {
  overflow: clip !important;
}

html[data-skin="editorial"] .no-posts {
  color: var(--ed-gray-3) !important;
}
html[data-skin="editorial"] .comment-empty {
  color: var(--ed-gray-3) !important;
}


/* ---- Gradient-clipped text: keep it visible --------------------------------
   Base CSS paints .gradient-text, .about-stat-number, .cert-name(-v2) and
   .rv-cert-abbr with `background: var(--gradient-text)` +
   `-webkit-text-fill-color: transparent`, i.e. the text is a window onto a
   gradient. This skin sets --gradient-text:none, so that window shows nothing
   and the text vanishes. Overriding `color` alone does NOT fix it - the
   transparent fill wins. Reset the whole clip mechanism. */
html[data-skin="editorial"] .about-stat-number,
html[data-skin="editorial"] .cert-name,
html[data-skin="editorial"] .cert-name-v2,
html[data-skin="editorial"] .rv-cert-abbr {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--ed-gray-1) !important;
}