/* S1094 (owner 2026-10-13): the Knowledge Base joins the /app glass redesign - faceted-crystal backdrop under a violet light,
   a floating glass bar, frosted cards, a smoked reading panel, violet accent; light and dark. Linked after each page's
   inline <style> (same specificity, later wins). Rollback: remove the <link>. The long article panel carries no blur
   (a blurred tall element repaints on every move - S1087); only cards and the bar are blurred. */
:root {
  --bg: #e6e7ef; --paper: rgba(255, 255, 255, 0.64); --ink: #17142b; --ink-muted: #4b4766; --ink-faint: #6b6788;
  --accent: #7C3AED; --rule: rgba(46, 38, 110, 0.12); --off: rgba(255, 255, 255, 0.40);
  --qt-glass-bg: rgba(255, 255, 255, 0.60); --qt-glass-border: rgba(255, 255, 255, 0.90); --qt-glass-blur: 16px; --qt-glass-accent: #7C3AED;
  --qg-panel: rgba(250, 250, 255, 0.82);
  --qg-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), 0 0 0 1px rgba(46, 38, 110, 0.07), 0 18px 40px -24px rgba(46, 38, 110, 0.35);
}
[data-theme="dark"] {
  --bg: #07070b; --paper: rgba(24, 24, 36, 0.55); --ink: #F0EDF8; --ink-muted: #B9B4CF; --ink-faint: #8C87A6;
  --accent: #A78BFA; --rule: rgba(255, 255, 255, 0.10); --off: rgba(255, 255, 255, 0.04);
  --qt-glass-bg: rgba(24, 24, 36, 0.55); --qt-glass-border: rgba(255, 255, 255, 0.10); --qt-glass-accent: #8B5CF6;
  --qg-panel: rgba(10, 10, 17, 0.80);
  --qg-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.10), 0 22px 44px -26px rgba(0, 0, 0, 0.85);
}
body {
  background:
    radial-gradient(900px 600px at 12% -10%, rgba(139, 92, 246, 0.20), transparent 65%),
    radial-gradient(800px 560px at 100% 10%, rgba(99, 102, 241, 0.12), transparent 60%),
    radial-gradient(1000px 700px at 50% 120%, rgba(167, 139, 250, 0.22), transparent 60%),
    url("/assets/qt-crystal-light.svg?v=s1094-1") center / cover no-repeat fixed, #e6e7ef !important;
}
[data-theme="dark"] body {
  background:
    radial-gradient(900px 600px at 12% -10%, rgba(139, 92, 246, 0.30), transparent 65%),
    radial-gradient(800px 560px at 100% 10%, rgba(99, 102, 241, 0.16), transparent 60%),
    radial-gradient(1000px 700px at 50% 120%, rgba(76, 29, 149, 0.28), transparent 60%),
    url("/assets/qt-crystal-dark.svg?v=s1094-1") center / cover no-repeat fixed, #07070b !important;
}

/* the bar floats, pinned, as rounded glass (reel 2); links get the violet pill on hover */
.mcr-nav {
  top: 10px; margin: 10px 14px 0; border-radius: 18px; border: 1px solid var(--qt-glass-border) !important;
  background: var(--qt-glass-bg) !important; -webkit-backdrop-filter: blur(var(--qt-glass-blur)) saturate(150%); backdrop-filter: blur(var(--qt-glass-blur)) saturate(150%);
  box-shadow: var(--qg-shadow);
}
.mcr-links a:not(.mcr-cta) { border-radius: 10px; padding: 6px 10px; transition: background 200ms ease, color 200ms ease; }
.mcr-links a:not(.mcr-cta):hover { background: rgba(139, 92, 246, 0.14); color: var(--ink) !important; }
body .mcr-nav a.mcr-cta, body a.mcr-cta {
  background: linear-gradient(135deg, #8B5CF6, #6D28D9) !important; color: #fff !important; border: 1px solid rgba(196, 181, 253, 0.45);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 10px 24px -12px rgba(124, 58, 237, 0.8);
}

/* frosted cards and boxes (reel 1) */
:is(.kb-card, .kb-track-card, .kb-guide-card, .kb-kt, .kb-toc, .kb-quiz, .kb-calc, .kb-cmp-card, .kb-next, .kb-trackbar, .kb-faq, .kb-use, .kb-pitfall, .kb-formula, .kb-live, .kb-rel, .kb-xb) {
  background: var(--qt-glass-bg) !important; border: 1px solid var(--qt-glass-border) !important; border-radius: 18px !important;
  -webkit-backdrop-filter: blur(var(--qt-glass-blur)) saturate(140%); backdrop-filter: blur(var(--qt-glass-blur)) saturate(140%);
  box-shadow: var(--qg-shadow) !important;
}
:is(.kb-card, .kb-track-card, .kb-guide-card):hover { border-color: rgba(139, 92, 246, 0.45) !important; }
.kb-kt { border-left: 3px solid var(--accent) !important; }
.kb-video video { border-radius: 18px !important; border: 1px solid var(--qt-glass-border) !important; box-shadow: var(--qg-shadow); }

/* reading pages sit in one smoked glass panel (reel 1's window); index and hub sections float as cards */
main.wrap.kb-m4 {
  background: var(--qg-panel); border: 1px solid var(--qt-glass-border); border-radius: 26px;
  padding: 0 32px 32px !important; margin-top: 18px; margin-bottom: 18px; box-shadow: var(--qg-shadow);
}
main.wrap.kb-m4 .kb-bc { padding-top: 26px; }
.kb-hero { padding-top: 90px; }
.mcr-footer {
  margin: 60px 14px 14px; border-radius: 24px; border: 1px solid var(--qt-glass-border) !important; background: var(--qt-glass-bg) !important;
  -webkit-backdrop-filter: blur(var(--qt-glass-blur)); backdrop-filter: blur(var(--qt-glass-blur));
}
@media (max-width: 720px) {
  .mcr-nav { margin: 8px 8px 0; top: 8px; border-radius: 16px; }
  main.wrap.kb-m4 { padding: 0 18px 22px !important; border-radius: 20px; margin-left: 8px; margin-right: 8px; }
  .mcr-footer { margin: 40px 8px 8px; }
}
@media (prefers-reduced-transparency: reduce) {
  :is(.mcr-nav, .mcr-footer, .kb-card, .kb-track-card, .kb-guide-card, .kb-kt, .kb-toc, .kb-quiz, .kb-calc) { -webkit-backdrop-filter: none; backdrop-filter: none; }
  :root { --qt-glass-bg: #fbfbfe; --paper: #fbfbfe; } [data-theme="dark"] { --qt-glass-bg: #15151f; --paper: #15151f; }
}