/* Dark mode. Active when <html data-theme="dark"> is set by theme.js.
   Every rule starts with html[data-theme="dark"] so it outranks the light rules in glass.css and
   single Tailwind utilities. Dark blue panels, the footer and photo overlays keep their own colours.
   The logo always sits on a white background, so its colours never change. */

html[data-theme="dark"] {
  --d-canvas: #0B1220;
  --d-surface: #121C2F;
  --d-raised: #182540;
  --d-sunken: #0F182A;
  --d-text: #E6ECF5;
  --d-text-soft: rgba(230, 236, 245, .78);
  --d-muted: #9AA8BC;
  --d-line: rgba(255, 255, 255, .09);
  --d-teal: #5FC4C8;
  --d-teal-soft: #7FD6D9;
  --d-cobalt: #7DB2F0;
  --d-brass: #D6AB55;

  --g-canvas: var(--d-canvas);
  --g-surface: rgba(18, 28, 47, .9);
  --g-surface-strong: #152036;
  --g-sheen: linear-gradient(180deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, 0) 42%);
  --g-border: rgba(255, 255, 255, .08);
  --g-highlight: inset 0 1px 0 rgba(255, 255, 255, .05);
  --g-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 2px 6px -2px rgba(0, 0, 0, .3), 0 16px 36px -20px rgba(0, 0, 0, .6);
  --g-shadow-hover: 0 1px 2px rgba(0, 0, 0, .25), 0 10px 22px -12px rgba(0, 0, 0, .5), 0 30px 56px -26px rgba(0, 0, 0, .7);
  --mx-ink: rgba(148, 163, 184, .13);
  color-scheme: dark;
}

/* Smooth colour change only while switching, so normal animations are untouched */
html.theme-switching body,
html.theme-switching body *,
html.theme-switching body *::before,
html.theme-switching body *::after {
  transition: background-color .3s ease, color .3s ease, border-color .3s ease, fill .3s ease !important;
}

html[data-theme="dark"] body.bg-white { background-color: var(--d-canvas); color: var(--d-text); }
html[data-theme="dark"] ::selection { background: rgba(95, 196, 200, .3); }

/* ---------- Colour utilities ---------- */
html[data-theme="dark"] .bg-white { background-color: var(--d-surface); }
html[data-theme="dark"] .bg-white\/95 { background-color: rgba(18, 28, 47, .95); }
html[data-theme="dark"] :is(.bg-mist, .bg-mist\/50, .bg-mist\/60) { background-color: var(--d-sunken); }
html[data-theme="dark"] .bg-tint { background-color: rgba(95, 196, 200, .08); }
html[data-theme="dark"] .bg-line { background-color: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .bg-teal\/10 { background-color: rgba(95, 196, 200, .12); }
html[data-theme="dark"] .bg-cobalt\/10 { background-color: rgba(125, 178, 240, .12); }
html[data-theme="dark"] .bg-brass\/10 { background-color: rgba(214, 171, 85, .12); }

html[data-theme="dark"] .text-navy { color: var(--d-text); }
html[data-theme="dark"] :is(.text-navy\/70, .text-navy\/75, .text-navy\/80) { color: var(--d-text-soft); }
html[data-theme="dark"] .text-steel { color: var(--d-muted); }
html[data-theme="dark"] .text-teal { color: var(--d-teal); }
html[data-theme="dark"] .text-cobalt { color: var(--d-cobalt); }
html[data-theme="dark"] .text-cobalt\/25 { color: rgba(125, 178, 240, .25); }
html[data-theme="dark"] .text-brass { color: var(--d-brass); }

html[data-theme="dark"] .border-line { border-color: var(--d-line); }
html[data-theme="dark"] :is(.border-navy\/10, .border-navy\/15) { border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .border-teal\/15 { border-color: rgba(95, 196, 200, .2); }
html[data-theme="dark"] .divide-line > :not([hidden]) ~ :not([hidden]) { border-color: var(--d-line); }

html[data-theme="dark"] .hover\:bg-mist:hover,
html[data-theme="dark"] .focus-visible\:bg-mist:focus-visible { background-color: var(--d-raised); }
html[data-theme="dark"] .hover\:bg-teal\/5:hover { background-color: rgba(95, 196, 200, .08); }
html[data-theme="dark"] .hover\:text-navy:hover:not(.hover\:bg-white) { color: #fff; }
html[data-theme="dark"] :is(.hover\:text-cobalt:hover, .group:hover .group-hover\:text-cobalt) { color: var(--d-cobalt); }
html[data-theme="dark"] .hover\:text-teal:hover { color: var(--d-teal-soft); }
html[data-theme="dark"] .hover\:border-line:hover { border-color: rgba(255, 255, 255, .16); }

/* Focus rings leave a canvas-coloured gap instead of a white one */
html[data-theme="dark"] [class*="ring-offset-2"] { --tw-ring-offset-color: var(--d-canvas); }

/* ---------- Keep dark blue panels, banners and the footer exactly as they are ---------- */
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white { background-color: #fff; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .text-navy,
html[data-theme="dark"] :is(.bg-aqua, .bg-brass).text-navy,
html[data-theme="dark"] .bg-aqua .text-navy { color: #1A2753; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .text-steel { color: #64748B; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .text-navy\/70 { color: rgba(26, 39, 83, .7); }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .text-navy\/75 { color: rgba(26, 39, 83, .75); }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .text-navy\/80 { color: rgba(26, 39, 83, .8); }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .bg-tint { background-color: #EEF6F6; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .bg-mist { background-color: #F1F5F9; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .text-teal { color: #06727B; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .text-cobalt { color: #1063BC; }
html[data-theme="dark"] :is(.bg-navy, [data-hero], footer) .bg-white .border-line { border-color: #E2E8F0; }

/* Dark blue panels lift slightly off the darker canvas */
html[data-theme="dark"] body main section.bg-navy:not([data-hero]),
html[data-theme="dark"] body footer.bg-navy {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .07), inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 60px -40px rgba(0, 0, 0, .8);
}

/* ---------- Page bands and cards ---------- */
html[data-theme="dark"] body main section:is(.bg-white, .bg-mist, .bg-mist\/60, .bg-tint) { background-color: transparent; }
html[data-theme="dark"] body main section.border-line { border-color: rgba(255, 255, 255, .06); }

html[data-theme="dark"] body main :is(div, article, li, figure, aside, blockquote).bg-tint:where(.rounded-lg, .rounded-xl, .rounded-2xl) {
  background-color: rgba(95, 196, 200, .07);
  border-color: rgba(95, 196, 200, .16);
}

html[data-theme="dark"] body main :is(div, article, li, aside).bg-mist:where(.rounded-lg, .rounded-xl):not(.border) {
  background-color: rgba(255, 255, 255, .035);
}

html[data-theme="dark"] body main article.pcard { border-color: rgba(255, 255, 255, .08); }

/* Outline buttons */
html[data-theme="dark"] body :is(a, button).border-line:where(.rounded-lg, .rounded-full) {
  color: var(--d-text);
  background-color: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

html[data-theme="dark"] body :is(a, button).border-line:where(.rounded-lg, .rounded-full):hover {
  background-color: rgba(255, 255, 255, .08);
  border-color: rgba(125, 178, 240, .5);
}

/* Capabilities "on this page" bar */
html[data-theme="dark"] body main nav[data-scrollspy] {
  background-color: rgba(11, 18, 32, .85);
  border-bottom-color: rgba(255, 255, 255, .07);
}

/* Forms */
html[data-theme="dark"] body :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  color: var(--d-text);
  background-color: rgba(255, 255, 255, .04);
  border-color: rgba(255, 255, 255, .13);
  box-shadow: none;
}

html[data-theme="dark"] body :is(input, textarea)::placeholder { color: rgba(154, 168, 188, .75); }

html[data-theme="dark"] body :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):hover { border-color: rgba(255, 255, 255, .2); }

html[data-theme="dark"] body :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
  background-color: rgba(255, 255, 255, .06);
  border-color: rgba(95, 196, 200, .6);
  box-shadow: 0 0 0 4px rgba(95, 196, 200, .14);
}

html[data-theme="dark"] body select option { color: var(--d-text); background-color: var(--d-surface); }

/* ---------- Header ---------- */
html[data-theme="dark"] body #site-header header[data-header]::before {
  background-color: rgba(14, 22, 40, .55);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, 0) 60%);
  border-color: rgba(255, 255, 255, .09);
}

html[data-theme="dark"] body #site-header header[data-scrolled="true"]::before {
  box-shadow:
    inset 0 -1px 0 rgba(255, 255, 255, .06),
    0 1px 0 rgba(0, 0, 0, .25),
    0 14px 34px -18px rgba(0, 0, 0, .75);
}

@media (max-width: 1023.98px) {
  html[data-theme="dark"] body #site-header header[data-header]::before { background-color: rgba(14, 22, 40, .6); }
}

/* Only the logo mark keeps a small white disc (the navy ring needs a light backing);
   the name and tagline sit straight on the dark glass */
html[data-theme="dark"] body #site-header .nav-brand > a svg {
  box-sizing: border-box;
  padding: 3px;
  border-radius: 9999px;
  background-color: #fff;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .5), 0 6px 16px -8px rgba(0, 0, 0, .7);
}

html[data-theme="dark"] body #site-header .nav-brand .brand-name { color: #F1F5F9; }
html[data-theme="dark"] body #site-header .nav-brand .brand-name + span { color: var(--d-teal-soft); }

html[data-theme="dark"] body #site-header .nav-brand-divider {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .18), rgba(255, 255, 255, 0));
}

@media (min-width: 1024px) and (max-width: 1279.98px) {
  html[data-theme="dark"] body #site-header .nav-lang-code { box-shadow: 0 0 0 2px var(--d-canvas); }
}

html[data-theme="dark"] body #site-header .nav-topline { color: rgba(230, 236, 245, .7); }
html[data-theme="dark"] body #site-header .nav-topline a:hover { color: var(--d-teal-soft); }
html[data-theme="dark"] body #site-header .nav-topline .text-aqua { color: var(--d-teal); }

html[data-theme="dark"] body #site-header .nav-track {
  background-color: rgba(255, 255, 255, .05);
  background-image: linear-gradient(180deg, rgba(0, 0, 0, .28), rgba(255, 255, 255, .04));
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, .4), inset 0 -1px 0 rgba(255, 255, 255, .06), inset 0 0 0 1px rgba(255, 255, 255, .07);
}

html[data-theme="dark"] body #site-header .nav-link { color: rgba(230, 236, 245, .75); }
html[data-theme="dark"] body #site-header .nav-link:hover { color: #fff; background-color: rgba(255, 255, 255, .08); }

html[data-theme="dark"] body #site-header nav[aria-label='Main'] > ul > li > a[aria-current],
html[data-theme="dark"] body #site-header nav[aria-label='Main'] > ul > li > a[aria-current]:hover,
html[data-theme="dark"] body #site-header #mobile-nav a[aria-current='page'],
html[data-theme="dark"] body #site-header #mobile-nav [data-nav-group][aria-current='true'] {
  background-color: rgba(95, 196, 200, .14) !important;
  color: var(--d-teal-soft) !important;
  box-shadow: inset 0 0 0 1px rgba(95, 196, 200, .35) !important;
}

html[data-theme="dark"] body #site-header .nav-glider {
  background-color: rgba(95, 196, 200, .16);
  background-image: linear-gradient(180deg, rgba(95, 196, 200, .22), rgba(95, 196, 200, .08));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .16),
    inset 0 -2px 0 rgba(0, 0, 0, .25),
    inset 0 0 0 1px rgba(95, 196, 200, .4),
    0 8px 16px -8px rgba(0, 0, 0, .55);
}

html[data-theme="dark"] body #site-header .nav-glider::before {
  background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0));
}

html[data-theme="dark"] body #site-header .nav-track.has-glider > li > a.nav-link:hover {
  color: var(--d-teal-soft);
  background-color: transparent;
}
html[data-theme="dark"] body #site-header nav[aria-label='Main'] ul ul a[aria-current='page'] { background-color: rgba(95, 196, 200, .12) !important; }
html[data-theme="dark"] body #site-header nav[aria-label='Main'] ul ul a[aria-current='page'] span span:first-child,
html[data-theme="dark"] body #site-header #mobile-nav a[aria-current='page'] svg { color: var(--d-teal-soft) !important; }

/* Company dropdown */
html[data-theme="dark"] body #site-header nav ul.bg-white {
  background-color: rgba(18, 28, 47, .94);
  border-color: rgba(255, 255, 255, .09);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 28px 60px -24px rgba(0, 0, 0, .75);
}

/* Header buttons */
html[data-theme="dark"] body #site-header .nav-lang {
  color: var(--d-teal-soft);
  background-color: rgba(95, 196, 200, .12);
  box-shadow: inset 0 0 0 1.5px rgba(95, 196, 200, .45);
}

html[data-theme="dark"] body #site-header .nav-lang:hover { color: #0B1220; background-color: var(--d-teal); box-shadow: inset 0 0 0 1.5px var(--d-teal); }

html[data-theme="dark"] body #site-header .nav-theme {
  color: #F5D78E;
  background-color: rgba(255, 255, 255, .06);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14);
}

html[data-theme="dark"] body #site-header .nav-theme:hover { background-color: rgba(255, 255, 255, .12); }

html[data-theme="dark"] body #site-header .nav-lang-m {
  color: var(--d-teal-soft);
  background-color: rgba(95, 196, 200, .14);
  box-shadow: inset 0 0 0 1.5px rgba(95, 196, 200, .4);
}

html[data-theme="dark"] body #site-header .nav-lang-badge { background-color: #06727B; box-shadow: 0 0 0 2px var(--d-canvas); }

html[data-theme="dark"] body #site-header .nav-toggle {
  color: var(--d-text);
  background-color: rgba(95, 196, 200, .12);
  box-shadow: inset 0 0 0 1px rgba(95, 196, 200, .25);
}

html[data-theme="dark"] body #site-header .nav-toggle[aria-expanded="true"] { color: #0B1220; background-color: var(--d-teal); }

/* Phone menu */
html[data-theme="dark"] body #site-header #mobile-nav.bg-white {
  background-color: rgba(15, 24, 42, .96);
  border-color: rgba(255, 255, 255, .09);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 32px 64px -28px rgba(0, 0, 0, .8);
}

html[data-theme="dark"] body #site-header #mobile-nav .m-link { color: var(--d-text); }
html[data-theme="dark"] body #site-header #mobile-nav .m-link:hover { background-color: rgba(255, 255, 255, .05); }
html[data-theme="dark"] body #site-header #mobile-nav .m-ico { color: var(--d-teal-soft); background-color: rgba(95, 196, 200, .12); }
html[data-theme="dark"] body #site-header #mobile-nav .m-link[aria-current] .m-ico { background-color: rgba(255, 255, 255, .08); box-shadow: none; }
html[data-theme="dark"] body #site-header #mobile-nav .m-sub { border-left-color: rgba(95, 196, 200, .25); }
html[data-theme="dark"] body #site-header #mobile-nav .m-sublink { color: var(--d-text-soft); }
html[data-theme="dark"] body #site-header #mobile-nav .m-sublink:hover { color: #fff; background-color: rgba(255, 255, 255, .05); }
html[data-theme="dark"] body #site-header #mobile-nav .m-chip {
  color: var(--d-text);
  background-color: rgba(255, 255, 255, .04);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09);
}
html[data-theme="dark"] body #site-header #mobile-nav .m-chip:hover { color: var(--d-teal-soft); background-color: rgba(95, 196, 200, .12); }
html[data-theme="dark"] body #site-header #mobile-nav .m-theme svg { color: #F5D78E; }

/* ---------- Product cards and lists ---------- */
html[data-theme="dark"] body main .pcard-kicker { color: var(--d-teal); }
html[data-theme="dark"] body main .pcard-tags > li {
  color: var(--d-text);
  background-color: rgba(255, 255, 255, .05);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}
html[data-theme="dark"] body main .pcard-tags > li::before { background-color: var(--d-teal); }
html[data-theme="dark"] body main .pcard-actions { border-top-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] body main .pcard-view { background-color: #26386A; }
html[data-theme="dark"] body main .pcard-view:hover { background-color: #06727B; }
html[data-theme="dark"] body main .pcard-icon {
  color: var(--d-text);
  background-color: rgba(255, 255, 255, .05);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13);
}
html[data-theme="dark"] body main .pcard-icon:hover { color: var(--d-teal-soft); box-shadow: inset 0 0 0 1px rgba(95, 196, 200, .45); }
html[data-theme="dark"] body main .pcard-wa { color: #3DDC7A; }
html[data-theme="dark"] body main .pcard-wa:hover { color: #fff; background-color: #25D366; }
html[data-theme="dark"] body main .rm-card { background-color: var(--d-surface); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
html[data-theme="dark"] body main .rm-title,
html[data-theme="dark"] body main .rm-specs dd { color: var(--d-text); }
html[data-theme="dark"] body main :is(.rm-text, .rm-uses-label) { color: var(--d-muted); }
html[data-theme="dark"] body main .rm-specs dt { color: var(--d-teal); }
html[data-theme="dark"] body main .rm-specs > div { border-top-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] body main .pcount-num { color: var(--d-text); }
html[data-theme="dark"] body main :is(.pcount-text, .pfam-label) { color: var(--d-muted); }
html[data-theme="dark"] body main .pfam-chip {
  color: var(--d-text);
  background-color: rgba(255, 255, 255, .04);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}
html[data-theme="dark"] body main .pfam-chip:hover { color: var(--d-teal-soft); background-color: rgba(95, 196, 200, .1); box-shadow: inset 0 0 0 1px rgba(95, 196, 200, .4); }

/* Back to top */
html[data-theme="dark"] body button.rounded-full[data-back-to-top] {
  color: var(--d-text);
  background-color: rgba(18, 28, 47, .88);
  border-color: rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 10px 24px -12px rgba(0, 0, 0, .7);
}

/* ---------- Page-specific pieces ---------- */
html[data-theme="dark"] .about-grid::before {
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, .045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, .045) 1px, transparent 1px);
}

html[data-theme="dark"] .ps-cap { color: var(--d-text); background: rgba(15, 24, 42, .88); border-color: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .ps-dots { background: rgba(15, 24, 42, .8); }
html[data-theme="dark"] .ps-dot { background: rgba(255, 255, 255, .3); }
html[data-theme="dark"] .ps-dot[aria-current="true"] { background: var(--d-teal); }
html[data-theme="dark"] .ps-btn { color: var(--d-text); background: rgba(15, 24, 42, .9); border-color: rgba(255, 255, 255, .14); }
html[data-theme="dark"] .ps-btn:hover { color: var(--d-teal-soft); border-color: var(--d-teal); }

html[data-theme="dark"] .mr-refresh { background: transparent; color: var(--d-teal-soft); border-color: rgba(95, 196, 200, .45); }
html[data-theme="dark"] .mr-refresh:hover { background: var(--d-teal); color: #0B1220; }
html[data-theme="dark"] .mr-refresh-note { color: var(--d-muted); }
html[data-theme="dark"] .mr-status { color: var(--d-muted); background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .mr-status:is([data-state="live"], [data-state="today"]) { color: var(--d-teal-soft); background: rgba(95, 196, 200, .1); border-color: rgba(95, 196, 200, .3); }
html[data-theme="dark"] .mr-status[data-state="latest"] { color: var(--d-text); background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .mr-symbol { background: rgba(95, 196, 200, .12); color: var(--d-teal-soft); }
html[data-theme="dark"] .mr-symbol[data-tone="brass"] { background: rgba(214, 171, 85, .14); color: var(--d-brass); }
html[data-theme="dark"] .mr-price { color: var(--d-text); }
html[data-theme="dark"] :is(.mr-unit, .mr-note, .mr-meta > div) { color: var(--d-muted); }
html[data-theme="dark"] .mr-card > h4 + .mr-note { color: var(--d-text-soft); }
html[data-theme="dark"] .mr-meta > div { border-top-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .mr-change[data-dir="up"] { color: #4ADE80; background: rgba(74, 222, 128, .12); }
html[data-theme="dark"] .mr-change[data-dir="down"] { color: #F87171; background: rgba(248, 113, 113, .12); }
html[data-theme="dark"] .mr-change[data-dir="flat"] { color: var(--d-muted); background: rgba(255, 255, 255, .06); }
html[data-theme="dark"] .mr-global-panel {
  border-color: rgba(95, 196, 200, .22);
  background: linear-gradient(180deg, rgba(95, 196, 200, .08), rgba(255, 255, 255, .02));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 12px 32px -18px rgba(0, 0, 0, .6);
}
html[data-theme="dark"] .mr-global-panel .mr-row { border-color: rgba(95, 196, 200, .28); box-shadow: inset 3px 0 0 #5FC4C8; }
html[data-theme="dark"] .mr-row { background: rgba(15, 24, 42, .55); border-color: rgba(214, 171, 85, .22); }
html[data-theme="dark"] :is(.mr-row-name, .mr-row-price) { color: var(--d-text); }
html[data-theme="dark"] .mr-row[data-state="unavailable"] .mr-row-price { color: var(--d-muted); }
html[data-theme="dark"] .mr-fineprint { color: var(--d-muted); }
html[data-theme="dark"] .home-mr { background: rgba(15, 24, 42, .72); border-color: rgba(255, 255, 255, .1); box-shadow: 0 28px 50px -36px rgba(0, 0, 0, .75); }
html[data-theme="dark"] .home-mr-global { background: radial-gradient(120% 90% at 0% 0%, rgba(95, 196, 200, .12), transparent 58%); border-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .home-mr-global .home-mr-kicker { color: var(--d-teal-soft); }
html[data-theme="dark"] .home-mr-mark { background: rgba(214, 171, 85, .14); color: var(--d-brass); }
html[data-theme="dark"] .home-mr-mark--global { background: rgba(95, 196, 200, .12); color: var(--d-teal-soft); }
html[data-theme="dark"] .home-mr-latest { background: radial-gradient(120% 90% at 100% 0%, rgba(214, 171, 85, .12), transparent 58%); }
html[data-theme="dark"] .home-mr-dates { background: rgba(255, 255, 255, .03); border-top-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .home-mr-kicker { color: var(--d-brass); }
html[data-theme="dark"] .home-mr-sub { color: var(--d-muted); }
html[data-theme="dark"] .home-mr-title { color: var(--d-text); }
html[data-theme="dark"] .home-mr .mr-row { box-shadow: inset 3px 0 0 #D6AB55, 0 10px 18px -16px rgba(0, 0, 0, .7); }
html[data-theme="dark"] .home-mr--lme .mr-row { box-shadow: inset 3px 0 0 #5FC4C8, 0 10px 18px -16px rgba(0, 0, 0, .7); }
html[data-theme="dark"] .lme-live { background: #0f172a; border-color: rgba(95, 196, 200, .28); }
html[data-theme="dark"] .lme-tape { background: rgba(95, 196, 200, .08); border-color: rgba(95, 196, 200, .28); }
html[data-theme="dark"] .lme-tape-label, html[data-theme="dark"] .lme-chip-date { color: var(--d-teal-soft); }
html[data-theme="dark"] .lme-chip { background: rgba(15, 24, 42, .72); color: var(--d-text); box-shadow: inset 0 0 0 1px rgba(95, 196, 200, .22); }
html[data-theme="dark"] .lme-chip-change[data-dir="up"] { color: #4ADE80; }
html[data-theme="dark"] .lme-chip-change[data-dir="down"] { color: #F87171; }
@keyframes mr-row-flash-dark { 0% { background: rgba(95, 196, 200, .22); } 100% { background: rgba(15, 24, 42, .55); } }
html[data-theme="dark"] .mr-row.is-updated { animation-name: mr-row-flash-dark; }
html[data-theme="dark"] .home-mr-disclaimer { background: transparent; border-top-color: rgba(255, 255, 255, .08); color: var(--d-muted); }
html[data-theme="dark"] .home-mr-disclaimer svg { color: var(--d-brass); }
html[data-theme="dark"] .mr-brass-panel {
  border-color: rgba(214, 171, 85, .25);
  background: linear-gradient(180deg, rgba(214, 171, 85, .09), rgba(255, 255, 255, .02));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 12px 32px -18px rgba(0, 0, 0, .6);
}
html[data-theme="dark"] .mr-history { border-top-color: rgba(214, 171, 85, .2); }
html[data-theme="dark"] .mr-history-title { color: var(--d-text); }
html[data-theme="dark"] .mr-history-sub { color: var(--d-muted); }
html[data-theme="dark"] :is(.mr-range, .mr-date input) { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .12); color: var(--d-text); color-scheme: dark; }
html[data-theme="dark"] .mr-range button { color: var(--d-muted); }
html[data-theme="dark"] .mr-range button:hover { color: var(--d-text); }
html[data-theme="dark"] .mr-range button[aria-pressed="true"] { background: var(--d-teal); color: #0B1220; }
html[data-theme="dark"] .mr-history-note { background: rgba(214, 171, 85, .12); color: var(--d-brass); }
html[data-theme="dark"] .mr-history-note button { color: var(--d-teal-soft); }
html[data-theme="dark"] .mr-table-wrap { background: rgba(15, 24, 42, .6); border-color: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .mr-table th { background: #182540; color: var(--d-muted); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .1); }
html[data-theme="dark"] .mr-table-wrap::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .22); }
html[data-theme="dark"] .mr-table td { border-top-color: rgba(255, 255, 255, .06); color: var(--d-text); }
html[data-theme="dark"] .mr-table tbody tr:hover td { background: rgba(255, 255, 255, .03); }
html[data-theme="dark"] .mr-table tr[data-picked] td { background: rgba(214, 171, 85, .12); }
html[data-theme="dark"] .mr-table-day { color: var(--d-muted); }
html[data-theme="dark"] .mr-table-diff[data-dir="up"] { color: #4ADE80; }
html[data-theme="dark"] .mr-table-diff[data-dir="down"] { color: #F87171; }
html[data-theme="dark"] .mr-table-diff[data-dir="flat"] { color: var(--d-muted); }
html[data-theme="dark"] .mr-table-empty { color: var(--d-muted) !important; }

/* ---------- Chat assistant and language picker ---------- */
html[data-theme="dark"] .pi-chat {
  color: var(--d-text);
  background: rgba(15, 24, 42, .97);
  border-color: rgba(255, 255, 255, .09);
  box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .8), 0 2px 8px rgba(0, 0, 0, .3);
}
html[data-theme="dark"] .pi-chat__log { background: linear-gradient(180deg, #0F182A 0%, #0B1220 100%); }
html[data-theme="dark"] .pi-msg--bot .pi-bubble { background: var(--d-raised); border-color: rgba(255, 255, 255, .08); box-shadow: none; }
html[data-theme="dark"] .pi-bubble a { color: var(--d-teal-soft); }
html[data-theme="dark"] .pi-small { color: var(--d-muted); }
html[data-theme="dark"] .pi-typing span { background: #64748B; }
html[data-theme="dark"] .pi-btn { color: var(--d-text) !important; background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .14); }
html[data-theme="dark"] .pi-btn:hover { background: rgba(95, 196, 200, .12); border-color: var(--d-teal); }
html[data-theme="dark"] .pi-btn--primary { color: #fff !important; background: #06727B; border-color: #06727B; }
html[data-theme="dark"] .pi-btn--primary:hover { background: #0A8C96; border-color: #0A8C96; }
html[data-theme="dark"] .pi-btn--wa { color: #fff !important; background: #1FA855; border-color: #1FA855; }
html[data-theme="dark"] :is(.pi-chat__chips, .pi-chat__form, .pi-chat__foot) { background: #0F182A; }
html[data-theme="dark"] .pi-chat__form { border-top-color: rgba(255, 255, 255, .08); }
html[data-theme="dark"] .pi-chip { color: var(--d-teal-soft); background: rgba(95, 196, 200, .1); border-color: rgba(95, 196, 200, .3); }
html[data-theme="dark"] .pi-chip:hover { color: #fff; background: #06727B; }
html[data-theme="dark"] .pi-chat__input { color: var(--d-text); background: #0B1220; border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .pi-chat__input:focus { background: #0B1220; border-color: var(--d-teal); box-shadow: 0 0 0 3px rgba(95, 196, 200, .18); }
html[data-theme="dark"] .pi-chat__input::placeholder { color: #7A889C; }
html[data-theme="dark"] .pi-chat__foot { color: var(--d-muted); }
html[data-theme="dark"] .pi-chat__foot a { color: var(--d-teal-soft); }

html[data-theme="dark"] .pi-lang__scrim { background: rgba(3, 7, 16, .6); }
html[data-theme="dark"] .pi-lang__card { color: var(--d-text); background: var(--d-surface); box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .85), inset 0 0 0 1px rgba(255, 255, 255, .07); }
html[data-theme="dark"] .pi-lang__head .pi-icon-btn { color: var(--d-text); }
html[data-theme="dark"] .pi-lang__head .pi-icon-btn:hover { background: rgba(255, 255, 255, .07); }
html[data-theme="dark"] .pi-lang__icon { color: var(--d-teal-soft); background: rgba(95, 196, 200, .12); }
html[data-theme="dark"] :is(.pi-lang__sub, .pi-lang__en, .pi-lang__note) { color: var(--d-muted); }
html[data-theme="dark"] .pi-lang__note { border-top-color: rgba(255, 255, 255, .07); }
html[data-theme="dark"] .pi-lang__search { color: var(--d-text); background: #0B1220; border-color: rgba(255, 255, 255, .12); }
html[data-theme="dark"] .pi-lang__search:focus { background: #0B1220; border-color: var(--d-teal); box-shadow: 0 0 0 3px rgba(95, 196, 200, .18); }
html[data-theme="dark"] .pi-lang__opt { color: var(--d-text); background: rgba(255, 255, 255, .03); border-color: rgba(255, 255, 255, .1); }
html[data-theme="dark"] .pi-lang__opt:hover { background: rgba(95, 196, 200, .08); border-color: var(--d-teal); }
html[data-theme="dark"] .pi-lang__opt[aria-current="true"] { background: rgba(95, 196, 200, .14); border-color: var(--d-teal); box-shadow: inset 0 0 0 1px var(--d-teal); }
