/* ═══════════════════════════════════════════════════════════════════
   SYNTH-REPORT SKIN  ·  GRAY-OS v2 (ECLIPSE)
   Bridges the GrayPatreon report fleet's legacy neon-gradient tokens +
   hardcoded structural rules onto GRAY-OS v2: pitch black + ONE glowing
   orange accent (used as an OUTLIER = orange OUTLINE + glow on active
   states, never a filled accent field) + LIQUID GLASS surfaces + corona
   body bloom + a steel counter-accent.
   Load order (in every <head>, after the inline <style>):
     /_assets/phosphor/phosphor.css  →  /_assets/gray-os.css  →  this file
   Restyle is LOCAL ONLY. Revert = remove the three <link>s / restore .bak.
   Touches zero markup logic, zero audio/JS logic.
   ───────────────────────────────────────────────────────────────────
   The report fleet uses several legacy token namespaces; we remap each
   onto --gc-*. The accent ramp for multi-series viz (NO neon):
     #ff7300 accent · #6e8ca8 steel · #8bb38a sage · #cbab6a brass ·
     #c08274 clay · #ff9742 accent-hi.
   ─────────────────────────────────────────────────────────────────── */

:root {
  /* ── namespace A: index.html / ctz-method hub (--bg/--pan/--ink/--mag…) ── */
  --bg:        var(--gc-bg);
  --pan:       var(--gc-surface);
  --pan2:      var(--gc-surface-2);
  --ink:       var(--gc-text);
  --dim:       var(--gc-text-2);
  --faint:     var(--gc-text-3);
  --line:      var(--gc-line);

  /* ── namespace B: synth-kombinationen (--panel/--tx/--mut…) ── */
  --panel:     var(--gc-surface);
  --panel2:    var(--gc-surface-2);
  --tx:        var(--gc-text);
  --mut:       var(--gc-text-2);

  /* ── namespace C: synth-report / stereo-power-synths (--base/--ink-dim…) ── */
  --base:      var(--gc-bg);
  --base2:     var(--gc-bg-2);
  --ink-dim:   var(--gc-text-2);
  --ink-faint: var(--gc-text-3);

  /* ── namespace D: kristof (--bg2/--dim/--faint already covered) ── */
  --bg2:       var(--gc-bg-2);

  /* ── collapse the legacy neon palette → one orange accent + steel counter.
     Multi-series legacy hues spread across the gc ramp so anything still
     keyed to a var stays distinguishable without going neon. */
  --mag:       var(--gc-accent);
  --cy:        var(--gc-cool);
  --cyan:      var(--gc-cool);
  --vio:       var(--gc-accent-hi);
  --viol:      var(--gc-accent-hi);
  --violet:    var(--gc-accent-hi);
  --gold:      var(--gc-accent-hi);
  --orange:    var(--gc-accent);
  --amber:     var(--gc-warn);
  --green:     var(--gc-pos);
  --red:       var(--gc-neg);

  /* gradients → corona / accent (kills rainbow fills, keeps cinematic warmth) */
  --grad:      var(--gc-grad-accent);
  --grad-r:    var(--gc-grad-accent);
  --grad-soft: var(--gc-grad-corona);

  /* glows → orange bloom (v2: glow is back, tasteful + orange only) */
  --glow-m:    var(--gc-glow-soft);
  --glow-c:    var(--gc-cool-glow);
  --shadow:    var(--gc-shadow);

  /* tier swatches (synth-report) → accent + steel + desaturated status */
  --tier-s:     var(--gc-accent-hi);
  --tier-a:     var(--gc-cool);
  --tier-watch: var(--gc-warn);
  --tier-other: var(--gc-text-2);

  /* ── GP brand block (--gp-*) ── */
  --gp-bg:    var(--gc-bg);
  --gp-pan:   var(--gc-surface);
  --gp-ink:   var(--gc-text);
  --gp-dim:   var(--gc-text-2);
  --gp-faint: var(--gc-text-3);
  --gp-mag:   var(--gc-accent);
  --gp-cy:    var(--gc-cool);
  --gp-vio:   var(--gc-accent-hi);
  --gp-gold:  var(--gc-accent-hi);
  --gp-line:  var(--gc-line);

  /* ── workbench namespace (--bg-base #111 gray = the generic tell) ── */
  --bg-base:    var(--gc-bg);
  --bg-surface: var(--gc-glass-bg);
  --bg-raised:  var(--gc-glass-bg-2);
  --bg-inset:   var(--gc-bg-2);
  --bg-node:    var(--gc-glass-bg);
  --bg-node-sel:var(--gc-glass-bg-2);
  --border-subtle:  var(--gc-line);
  --border-default: var(--gc-glass-border);
  --border-active:  var(--gc-accent-line);
  --text-primary:   var(--gc-text);
  --text-secondary: var(--gc-text-2);
  --text-muted:     var(--gc-text-3);
  --accent-primary: var(--gc-accent);
  --accent-route:   var(--gc-accent);

  color-scheme: dark;
}

/* ── canvas: PITCH BLACK + a fixed corona bloom (orange bottom, steel top,
   white sheen) so the glass surfaces refract something. v2 depth = glow,
   not grey panels. ── */
body {
  background: var(--gc-bg) !important;
  color: var(--gc-text);
  font-family: var(--gc-font);
  position: relative;
}
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(120% 130% at 50% 118%, rgba(255,115,0,0.16) 0%, rgba(148,67,0,0.07) 32%, transparent 60%),
    radial-gradient(100% 80% at 50% -12%, rgba(110,140,168,0.10) 0%, transparent 52%),
    radial-gradient(120% 70% at 50% -8%, rgba(255,255,255,0.045) 0%, transparent 55%);
}
/* keep real content above the corona layer */
body > * { position: relative; z-index: 1; }

/* ════════════════ KILL GRADIENT TEXT (clip-to-text → solid) ════════════════
   Wordmarks / heroes / section accents that painted text with a rainbow
   gradient → solid (accent-hi for marks, near-white for big heroes). */
.wordmark, .wm, .gp-wordmark, .gp-mini-wordmark,
.brand .t, .footer .g, .finalverdict h3,
.ktoc-head .ktoc-title b, .ktoc-mobilebar .ktoc-mtitle b {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: var(--gc-accent-hi) !important;
  color: var(--gc-accent-hi) !important;
}
h1.hero, .hero h1, .hero, .about h2, .khero-h1, .ksec h2,
.hero h1 .g, .sec-head h2 .accent {
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: var(--gc-text) !important;
  color: var(--gc-text) !important;
  letter-spacing: var(--gc-track-tight);
}
/* the one accented word inside a hero/section head: orange WITH glow */
.hero h1 .g, .sec-head h2 .accent {
  -webkit-text-fill-color: var(--gc-accent-hi) !important;
  color: var(--gc-accent-hi) !important;
  text-shadow: var(--gc-text-glow);
}

/* ════════════════ LIQUID GLASS surfaces (the v2 default) ════════════════
   blur(18px) saturate(150%) brightness(1.06) + ~4-7% white fill + 1px
   translucent border + inner top highlight + soft radius. */
.combocard, .budgetbox, .principle .p, .panel, .card,
.about, .workbench-card, .devcard, .combobox, .finalverdict, .useridea {
  background: var(--gc-glass-bg) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border: 1px solid var(--gc-glass-border) !important;
  box-shadow: var(--gc-glass-hi), var(--gc-shadow) !important;
  border-radius: var(--gc-r-glass) !important;
}
.combocard:hover, .panel:hover, .card:hover, .devcard:hover, .workbench-card:hover {
  background: var(--gc-glass-bg-2) !important;
  border-color: var(--gc-line-2) !important;
  box-shadow: var(--gc-glass-hi), var(--gc-shadow-hi) !important;
}

/* brand mark chip: orange outline + soft glow */
.brand .mark, .brand .dot {
  background: transparent !important;
  border: 1px solid var(--gc-accent-line) !important;
  box-shadow: var(--gc-glow-soft) !important;
}
.brand .mark::before { background: var(--gc-accent) !important; }
.brand .mark::after  { background: var(--gc-bg) !important; }

/* index landing-card top accent bar: orange hairline w/ bloom */
.card::before, .workbench-card::before {
  background: var(--gc-accent) !important;
  box-shadow: var(--gc-glow-soft) !important;
  opacity: 1 !important;
}
.card .depth span, .card.big .depth span {
  background: transparent !important;
  color: var(--gc-accent-hi) !important;
  border-color: var(--gc-accent-line) !important;
  box-shadow: var(--gc-glow-soft) !important;
}
.card .arrow, .card.big .arrow, .card .tag, .card.big .tag { color: var(--gc-accent) !important; }
.card .teaser, .card.big .teaser { color: var(--gc-text-2) !important; }

/* about / hero radial blooms → faint corona instead of flat */
.about::before { background: var(--gc-grad-corona) !important; opacity: 1 !important; }
.about p b { color: var(--gc-accent-hi) !important; }
.about .label, .card .tag, .section-head .num { color: var(--gc-accent) !important; }

/* ctz-method hub workbench CTA badge: orange outline + glow, not filled */
.workbench-card .tag, .workbench-card .arrow { color: var(--gc-accent) !important; }
.workbench-card p { color: var(--gc-text-2) !important; }
.workbench-card .badge {
  color: var(--gc-accent-hi) !important;
  background: transparent !important;
  border: 1px solid var(--gc-accent-line) !important;
  box-shadow: var(--gc-glow-soft) !important;
}

/* ════════════════ GP brand header / footer ════════════════ */
.gp-header {
  background: color-mix(in srgb, var(--gc-bg) 70%, transparent) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border-bottom: 1px solid var(--gc-glass-border) !important;
}
/* active nav = transparent + orange OUTLINE + glow (NOT a filled bar) */
.gp-nav-active, .gp-nav-link.gp-nav-active {
  color: var(--gc-accent-hi) !important;
  background: transparent !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
  text-shadow: var(--gc-text-glow) !important;
  border-radius: var(--gc-r) !important;
}
.gp-nav-link:hover { background: var(--gc-glass-bg) !important; color: var(--gc-text) !important; }
/* CTA = primary glass button, orange outline + glow; hover = accent grad fill */
.gp-cta {
  background: var(--gc-glass-bg) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  color: var(--gc-accent-hi) !important;
  border: 1px solid var(--gc-accent-line) !important;
  box-shadow: var(--gc-glow-soft) !important;
}
.gp-cta:hover {
  background: var(--gc-grad-accent) !important;
  color: var(--gc-on-accent) !important;
  border-color: var(--gc-accent) !important;
  filter: none !important;
  transform: none !important;
  box-shadow: var(--gc-glow) !important;
}
.gp-cta-icon { background: transparent !important; color: var(--gc-accent-hi) !important; }
.gp-footer {
  background: var(--gc-bg) !important;
  border-top: 1px solid var(--gc-line) !important;
}
.gp-footer-strip { background: var(--gc-bg-2) !important; }
.gp-footer-h { color: var(--gc-accent) !important; letter-spacing: var(--gc-track-wide); }
.gp-footer-link:hover { color: var(--gc-accent-hi) !important; border-bottom-color: var(--gc-accent-line) !important; }
.gp-by, .gp-meta-k { color: var(--gc-text-3) !important; letter-spacing: var(--gc-track-wide); }
/* language toggle = glass; active option = orange outline + glow, not filled */
.gp-lang, .gp-mini-lang {
  background: var(--gc-glass-bg) !important;
  border: 1px solid var(--gc-glass-border) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  box-shadow: var(--gc-glass-hi) !important;
}
.gp-lang-opt { color: var(--gc-text-2) !important; }
.gp-lang-opt:hover { color: var(--gc-text) !important; }
.gp-lang-opt.gp-lang-on {
  color: var(--gc-accent-hi) !important;
  background: transparent !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
  text-shadow: var(--gc-text-glow) !important;
}
:focus-visible { outline: 1px solid var(--gc-accent-line) !important; outline-offset: 2px; box-shadow: var(--gc-glow-soft); }

/* ════════════════ KRISTOF sticky nav (.knav) → glass pills, active=outline+glow ════════════════ */
.knav {
  background: color-mix(in srgb, var(--gc-bg) 72%, transparent) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border-bottom: 1px solid var(--gc-glass-border) !important;
}
.knav a { border: 1px solid var(--gc-glass-border) !important; background: var(--gc-glass-bg) !important; color: var(--gc-text-2) !important; }
.knav a:hover { border-color: var(--gc-line-2) !important; color: var(--gc-text) !important; }
.knav a.on {
  background: transparent !important;
  color: var(--gc-accent-hi) !important;
  border-color: var(--gc-accent-line) !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
  text-shadow: var(--gc-text-glow) !important;
}
.knav a.on .n { color: var(--gc-accent) !important; }
.knav a .n { color: var(--gc-text-3) !important; }
.ktoc-head .ktoc-title b, .ktoc-mobilebar .ktoc-mtitle b { color: var(--gc-accent-hi) !important; }

/* ════════════════ HERO / NAV / SECTION (synth-report, stereo) ════════════════ */
.kick, .hero .kick { color: var(--gc-accent) !important; letter-spacing: var(--gc-track-wide); }
.meta-row b { color: var(--gc-accent-hi) !important; }
.meta-row .dot { background: var(--gc-accent) !important; box-shadow: var(--gc-glow-soft) !important; }
.section-head, .sec-head { border-color: var(--gc-line) !important; }
.section-head h2 { letter-spacing: var(--gc-track-tight); }

/* sticky tab nav (synth-report / stereo) = glass; active tab = outline+glow */
.nav, .builder {
  background: color-mix(in srgb, var(--gc-bg) 72%, transparent) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border-bottom: 1px solid var(--gc-glass-border) !important;
}
.tab { color: var(--gc-text-2) !important; }
.tab:hover { color: var(--gc-text) !important; background: var(--gc-glass-bg) !important; }
.tab.active {
  color: var(--gc-accent-hi) !important;
  background: transparent !important;
  border-color: var(--gc-accent-line) !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
  text-shadow: var(--gc-text-glow) !important;
}

/* hero radial bloom → faint corona */
.hero { background: transparent !important; }

/* ════════════════ CHIPS → glass; active = orange outline + glow ════════════════ */
.chip { border: 1px solid var(--gc-glass-border) !important; background: var(--gc-glass-bg) !important; color: var(--gc-text-2) !important; }
.chip:hover { border-color: var(--gc-line-2) !important; color: var(--gc-text) !important; }
.chip.active {
  background: transparent !important;
  color: var(--gc-accent-hi) !important;
  border-color: var(--gc-accent-line) !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
  text-shadow: var(--gc-text-glow) !important;
}
/* rank badge = a single tiny key emphasis → solid accent OK here (rare/small) */
.rankbadge {
  background: var(--gc-accent) !important;
  color: var(--gc-on-accent) !important;
  box-shadow: var(--gc-glow-soft) !important;
}
.bg b { color: var(--gc-accent-hi) !important; }
.principle .p b, .budgetbox h3 { color: var(--gc-accent-hi) !important; }

/* ════════════════ DENSE: tables + spec grids → ledger register ════════════════
   Keep compact layout; only realign color + hairlines so density stays at
   parity (calm + scannable, not scroll-hell). */
table { border-collapse: collapse; }
th {
  color: var(--gc-text-3) !important;
  letter-spacing: var(--gc-track-wide);
  text-transform: uppercase;
  border-bottom: 1px solid var(--gc-line-2) !important;
  font-weight: 500 !important;
}
td { border-bottom: 1px solid var(--gc-line) !important; color: var(--gc-text) !important; }
tr:hover td { background: rgba(255,255,255,0.03) !important; }
.score, .scoreval, .num, .val, .bignum, td.num, .ledger-val {
  font-family: var(--gc-mono);
  font-variant-numeric: tabular-nums;
}

/* ════════════════ INTERACTIVE STATES (synth-report) → orange outline + glow ════════════════ */
.fchip.on, .branch.sel {
  background: transparent !important;
  border-color: var(--gc-accent-line) !important;
  color: var(--gc-accent-hi) !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
  text-shadow: var(--gc-text-glow) !important;
}
.fchip { border: 1px solid var(--gc-glass-border) !important; background: var(--gc-glass-bg) !important; color: var(--gc-text-2) !important; }

/* ════════════════ TIER / STATUS BADGES → accent-hi + glow ════════════════ */
.tier-s, .badge-s { color: var(--gc-accent-hi) !important; }
.bar, .scorebar > i, .scorebar span {
  background: var(--gc-accent) !important;
  box-shadow: var(--gc-glow-soft) !important;
}

/* ════════════════ FINAL VERDICT / CALLOUT cards = glass w/ orange edge + glow ════════════════ */
.finalverdict {
  border: 1px solid var(--gc-accent-line) !important;
  box-shadow: var(--gc-glass-hi), var(--gc-glow-soft), var(--gc-shadow) !important;
}

/* ════════════════ FROZEN-SNAPSHOT banner ════════════════ */
.gc-frozen-banner {
  background: var(--gc-glass-bg) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border-bottom: 1px solid var(--gc-accent-line) !important;
  padding: 10px 18px;
  font: 600 13px/1.5 var(--gc-font);
  color: var(--gc-warn) !important;
  text-align: center;
}
.gc-frozen-banner b { color: var(--gc-accent-hi) !important; }
.gc-frozen-banner a { color: var(--gc-accent-hi) !important; }
.gc-frozen-banner i[class^="ph-"] { color: var(--gc-warn) !important; }

/* ════════════════ synth landing (synth/index.html) ════════════════ */
.ico { color: var(--gc-accent) !important; }
.ico i[class^="ph-"] { color: var(--gc-accent) !important; margin-right: 0; }
.tag {
  background: transparent !important;
  color: var(--gc-accent-hi) !important;
  border: 1px solid var(--gc-accent-line) !important;
  box-shadow: var(--gc-glow-soft) !important;
}
.card .d, a.card .d { color: var(--gc-text-2) !important; }

/* ════════════════ LITERAL SWEEP - inline-styled neon hex/rgba that bypass
   the var remap. Map every leftover neon to accent / steel / status. ════════ */
/* gold/amber verdict text → accent-hi */
[style*="#ff9742"], [style*="#cbab6a"], [style*="#ff9742"], [style*="#cbab6a"],
[style*="#cbab6a"], [style*="#cbab6a"] {
  color: var(--gc-accent-hi) !important;
}
/* cyan inline text/links → steel ; magenta/violet inline → accent-hi */
[style*="#6e8ca8"], [style*="color:#8bb38a"], [style*="color:#8bb38a"] {
  color: var(--gc-cool) !important;
}
[style*="#c08274"], [style*="#6e8ca8"], [style*="#8aa0b4"],
[style*="#6e8ca8"], [style*="#6e8ca8"] {
  color: var(--gc-accent-hi) !important;
}
/* inline gradient pills/swatches → accent grad fill */
[style*="linear-gradient(90deg,#8bb38a"], [style*="linear-gradient(90deg,#c08274"],
[style*="linear-gradient(90deg,#cbab6a"], [style*="linear-gradient(90deg,var(--mag)"],
[style*="background:linear-gradient(90deg,#8bb38a,#6e8ca8)"] {
  background: var(--gc-grad-accent) !important;
  color: var(--gc-on-accent) !important;
}
/* inline soft-gradient panel backgrounds (verdict boxes, kristof cards) →
   liquid glass. Catches every 120/135/160 tinted-panel gradient. */
[style*="linear-gradient(120deg"],
[style*="linear-gradient(135deg"],
[style*="linear-gradient(160deg"],
[style*="linear-gradient(180deg"] {
  background: var(--gc-glass-bg) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
}
/* diagram <pre> wants the slightly-sunk inset, not glass */
pre.diagram[style*="linear-gradient"] { background: var(--gc-bg-2) !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
/* inline neon borders → orange hairline */
[style*="border-color:rgba(55,224,139"], [style*="border:1px solid rgba(255,207,77"] {
  border-color: var(--gc-accent-line) !important;
}

/* ════════════════ generic anchors ════════════════ */
a { color: var(--gc-accent-hi); }
a:hover { color: var(--gc-accent); }
footer a { color: var(--gc-accent-hi) !important; }
footer a:hover { color: var(--gc-accent) !important; }

/* ════════════════ PHOSPHOR ICONS in chrome: baseline + accent ════════════════ */
i[class^="ph-"], i[class*=" ph-"] {
  font-style: normal;
  vertical-align: -0.125em;
  color: var(--gc-accent);
  margin-right: 0.18em;
}
.gp-nav-link i[class^="ph-"], .gp-footer-link i[class^="ph-"] { margin-right: 0.3em; }
.gp-cta i[class^="ph-"] { color: inherit; }
.warn i[class^="ph-"], .frozen i[class^="ph-"] { color: var(--gc-warn); }

/* ════════════════ WORKBENCH alignment (interactive audio sub-app) ════════════════
   Same pitch-black canvas + glass surfaces; selected tiles get the orange
   outline + glow (the v2 active-state language), not a neon halo. */
.board-icon, .empty-state-icon, .manual-link-icon, .gami-level-icon,
.recent-item-icon, .card-link-icon { filter: none; }
.tile.sel-multi {
  border-color: var(--gc-accent-line) !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
}
.tile.casc {
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
}
/* workbench tab icons / phosphor inside it inherit accent */
.hl-tab-icon i[class^="ph-"] { color: var(--gc-accent) !important; }

/* ════════════════ SOURCE-PASS RESIDUALS (gray-os v2) ════════════════
   The remaining tells the inline <style> blocks bypass via hardcoded neon
   inside class rules (not inline style= attrs, so the literal sweep can't
   reach them). Skin loads last → wins. DE + EN are byte-identical here. */

/* flagship podium ranking bars: neon rainbow gradients → orange ramp glass.
   #1 accent · #2 steel · #3 brass - distinguishable, no neon, with bloom. */
.pod-1 .pod-bar { background: var(--gc-grad-accent) !important; box-shadow: var(--gc-glow-soft) !important; }
.pod-2 .pod-bar { background: var(--gc-cool) !important; }
.pod-3 .pod-bar { background: var(--gc-accent-dim) !important; border: 1px solid var(--gc-accent-line) !important; }
.pod-bar-wrap { background: var(--gc-bg-2) !important; }
.pod-1 .medal { background: transparent !important; color: var(--gc-accent-hi) !important; border: 1px solid var(--gc-accent-line) !important; box-shadow: var(--gc-glow-soft) !important; }
.pod-2 .medal { background: transparent !important; color: var(--gc-cool) !important; border: 1px solid var(--gc-line-2) !important; }
.pod-3 .medal { background: transparent !important; color: var(--gc-text-2) !important; border: 1px solid var(--gc-line) !important; }
.pod-1 { border-color: var(--gc-accent-line) !important; box-shadow: var(--gc-glow-soft), var(--gc-shadow) !important; }
.pod-1 .score .n { color: var(--gc-accent-hi) !important; text-shadow: var(--gc-text-glow) !important; }
.pod-2 .score .n, .pod-3 .score .n { color: var(--gc-text) !important; }

/* kristof hero: radial pink+cyan bloom → corona */
.khero::before { background: var(--gc-grad-corona) !important; }

/* synth-kombinationen user-idea card already lands on glass via the surface
   block above; pin its border to a hairline (gradient bg killed there). */
.useridea { border-color: var(--gc-glass-border) !important; }

/* signal-flow nodes: purple/cyan/violet tints → glass surfaces, hairline borders */
.node.master, .node.l6, .node.loopy {
  background: var(--gc-glass-bg) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border-color: var(--gc-glass-border) !important;
}

/* combo-table winner column: amber glow ring → orange outline + glow */
.ccol.win {
  border-color: var(--gc-accent-line) !important;
  box-shadow: inset 0 0 0 1px var(--gc-accent-line), var(--gc-glow-soft) !important;
}
.ccol.win .ch { background: transparent !important; }

/* ── KRISTOF .ksec inline-style block colors (defined in each page's <style>,
   so they need overriding here, not via the literal sweep) ── */
.ksec .pill, .ksec .chip {
  background: var(--gc-glass-bg) !important;
  color: var(--gc-accent-hi) !important;
  border: 1px solid var(--gc-accent-line) !important;
}
.ksec .card, .ksec .rc, .ksec .kbox, .ksec .panel, .ksec .mb-block {
  background: var(--gc-glass-bg) !important;
  -webkit-backdrop-filter: var(--gc-glass-filter) !important;
  backdrop-filter: var(--gc-glass-filter) !important;
  border: 1px solid var(--gc-glass-border) !important;
  border-radius: var(--gc-r-glass) !important;
}
.ksec table, .ksec table.kt, .ksec table.kr-table { background: transparent !important; }
.ksec th { color: var(--gc-text-3) !important; background: transparent !important; }
.ksec tr:hover td { background: rgba(255,255,255,0.03) !important; }
.ksec blockquote, .ksec .quote, .ksec .quote-card {
  border-left: 3px solid var(--gc-accent-line) !important;
  background: var(--gc-glass-bg) !important;
  color: var(--gc-text) !important;
}
.ksec pre, .ksec .diagram { color: var(--gc-cool) !important; background: var(--gc-bg-2) !important; border: 1px solid var(--gc-line) !important; }
.ksec code { background: var(--gc-glass-bg) !important; color: var(--gc-accent-hi) !important; }