/* S1094 (owner 2026-10-13, "apply this to IMS"): ims.quintarthai.com joins the Quintarthai glass redesign - the faceted-crystal
   backdrop under a violet light, a floating glass bar, frosted cards, violet accent in place of the amber brand colour.
   Severity colours (--sev-*, --warn, --bad, --good) are data and stay as they are. Dark only (the IMS site has no light theme).
   Linked after styles.css on every page. Rollback: remove the <link>. Blur only on cards and the bar, never on a section. */
:root {
  --accent: #A78BFA; --accent-2: #C4B5FD;
  --bg-2: rgba(22, 20, 38, 0.55); --bg-3: rgba(30, 28, 50, 0.60);
  --line: rgba(255, 255, 255, 0.09); --line-2: rgba(196, 181, 253, 0.28);
  --qt-glass-bg: rgba(24, 24, 36, 0.55); --qt-glass-border: rgba(255, 255, 255, 0.10); --qt-glass-blur: 16px; --qt-glass-accent: #8B5CF6;
  --qg-card: rgba(18, 17, 30, 0.58);
  --qg-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 22px 44px -26px rgba(0, 0, 0, 0.85), 0 40px 90px -60px rgba(109, 40, 217, 0.45);
}

/* the backdrop: crystal under violet light (replaces the G52 indigo/cyan/amber mesh) */
html 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("qt-crystal-dark.svg?v=s1094-1") center / cover no-repeat fixed, #07070b !important;
}
body::before { background: none !important; }
.hero-bg {
  background:
    radial-gradient(900px 460px at 12% 0%, rgba(139, 92, 246, 0.16), transparent 60%),
    radial-gradient(700px 380px at 88% 30%, rgba(99, 102, 241, 0.10), transparent 65%) !important;
}
.signal-section, .closing { background: radial-gradient(700px 280px at 50% 0%, rgba(139, 92, 246, 0.14), transparent 60%) !important; }
.section-alt, .partners, .counterpos { background: rgba(255, 255, 255, 0.025) !important; border-color: rgba(255, 255, 255, 0.06) !important; }

/* the bar floats as rounded glass (reel 2) */
.topbar {
  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: inset 0 1px 0 rgba(255, 255, 255, 0.10), 0 18px 40px -22px rgba(0, 0, 0, 0.6);
}
.topnav { gap: 2px !important; }
.topnav a { border-radius: 10px; padding: 6px 10px; white-space: nowrap; transition: background 200ms ease, color 200ms ease; }
.topnav a:hover { background: rgba(139, 92, 246, 0.16); color: var(--ink); }

/* frosted cards (reel 1) */
:is(.ims-mod, .sec-cell, .res-card, .step, .ver-card, .aud-card, .price-card, .feed-card, .anatomy-card, .aside-block, .compare-wrap, .firehose-callout, details.rv) {
  background: var(--qg-card) !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);
}
details.rv { border-radius: 12px !important; }
:is(.ims-mod, .res-card, .ver-card, .aud-card, .price-card):hover { border-color: rgba(167, 139, 250, 0.40) !important; }
:is(.aud-card-featured, .price-card-featured) {
  background: linear-gradient(160deg, rgba(139, 92, 246, 0.26), rgba(76, 29, 149, 0.20) 55%, rgba(18, 17, 30, 0.58)) !important;
  border-color: rgba(196, 181, 253, 0.45) !important; box-shadow: var(--qg-shadow), 0 14px 40px rgba(139, 92, 246, 0.18);
}
/* the screens inside cards stay near-solid, so the mock UIs read */
:is(.tour, .tour-svg-wrap, .step-mock, .tour-screen, .tour-nav) { background: rgba(12, 11, 22, 0.86) !important; border-color: var(--qt-glass-border) !important; }
.footer {
  margin: 40px 14px 14px; border-radius: 26px; 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));
}

/* violet in place of amber */
.btn-primary, .tour-tab.is-active, .skip-link {
  background: linear-gradient(135deg, #8B5CF6, #6D28D9) !important; color: #fff !important; border-color: rgba(196, 181, 253, 0.45) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 10px 24px -12px rgba(124, 58, 237, 0.8);
}
.btn-primary:hover { background: linear-gradient(135deg, #9F7AFA, #7C3AED) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), 0 12px 28px -10px rgba(124, 58, 237, 0.9) !important; }
.btn-ghost { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.16) !important; }
.eyebrow { background: var(--qt-glass-bg) !important; border-color: var(--qt-glass-border) !important; }
.eyebrow .dot { box-shadow: 0 0 0 4px rgba(167, 139, 250, 0.22); }
.ts-chip.is-on { background: rgba(139, 92, 246, 0.16) !important; }
.ts-result.is-selected { background: rgba(139, 92, 246, 0.10) !important; }
:is(.aud-icon, .ver-num) { background: rgba(139, 92, 246, 0.16) !important; }
.ims-mod .m-ic { color: var(--accent) !important; }
.feed-item:hover { background: rgba(139, 92, 246, 0.08) !important; }
:is(.contact-form input, .contact-form textarea):focus { box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.25) !important; }
/* the cookie notice is styled inline (S68-B); attribute-free overrides by id */
#ims-cookie-banner { background: rgba(18, 17, 30, 0.92) !important; border-color: rgba(167, 139, 250, 0.40) !important; border-radius: 16px !important; }
#ims-cookie-banner strong, #ims-cookie-banner div > a[href="/ims/privacy"] { color: #C4B5FD !important; }
#ims-cookie-accept { background: linear-gradient(135deg, #8B5CF6, #6D28D9) !important; color: #fff !important; border-radius: 10px !important; }
#ims-cookie-reject { border-radius: 10px !important; }
@media (prefers-reduced-motion: no-preference) {
  @keyframes imsIngest { 0%, 42%, 100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); border-color: var(--line); } 54% { box-shadow: 0 0 13px 1px rgba(139, 92, 246, 0.35); border-color: rgba(167, 139, 250, 0.5); } }
}
@media (max-width: 720px) {
  .topbar { margin: 8px 8px 0; top: 8px; border-radius: 16px; }
  .footer { margin: 30px 8px 8px; }
}
@media (prefers-reduced-transparency: reduce) {
  :is(.topbar, .footer, .ims-mod, .sec-cell, .res-card, .step, .ver-card, .aud-card, .price-card, .feed-card) { -webkit-backdrop-filter: none; backdrop-filter: none; background: #15141f !important; }
}
