/* ==========================================================================
   Dimau UI - shared design tokens and primitives
   One file, loaded by every Dimau app. Change a value here and every app
   moves together. No framework, no build step, no font downloads.

   Fonts: set --dui-font-display and --dui-font-body per app.
   Theme: automatic from the OS. Force with <html data-theme="dark"> or "light".
   ========================================================================== */

:root {
  --dui-font-display: var(--dui-font-body);
  --dui-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --dui-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --dui-text-xs: 0.75rem;
  --dui-text-sm: 0.875rem;
  --dui-text-md: 1rem;
  --dui-text-lg: 1.125rem;
  --dui-text-xl: 1.375rem;
  --dui-text-2xl: 1.75rem;
  --dui-text-3xl: 2.125rem;
  --dui-text-4xl: 2.75rem;

  --dui-leading-tight: 1.15;
  --dui-leading-snug: 1.35;
  --dui-leading-normal: 1.6;

  --dui-track-tight: -0.02em;
  --dui-track-snug: -0.01em;
  --dui-track-normal: 0;
  --dui-track-wide: 0.02em;

  --dui-weight-normal: 400;
  --dui-weight-medium: 500;
  --dui-weight-semibold: 600;

  /* Space - everything sits on a 4px grid, with no exceptions */
  --dui-s1: 4px;  --dui-s2: 8px;  --dui-s3: 12px; --dui-s4: 16px;
  --dui-s5: 24px; --dui-s6: 32px; --dui-s7: 48px; --dui-s8: 64px;

  --dui-r-sm: 8px; --dui-r-md: 12px; --dui-r-lg: 16px;
  --dui-r-xl: 24px; --dui-r-full: 999px;

  /* Motion - ONE curve and three durations for the whole portfolio.
     Consistency here is what reads as expensive. Do not add new curves. */
  --dui-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dui-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --dui-t-fast: 140ms; --dui-t-base: 240ms; --dui-t-slow: 400ms;

  --dui-lift: -4px;
  --dui-hover-scale: 1.015;
  --dui-press-scale: 0.985;

  /* Light theme (the default) */
  --dui-bg: #f6f7f9;
  --dui-surface: #ffffff;
  --dui-surface-2: #f1f3f6;
  --dui-surface-hover: #ffffff;
  --dui-border: rgba(16, 24, 40, 0.09);
  --dui-border-strong: rgba(16, 24, 40, 0.16);

  --dui-text: #101828;
  --dui-text-2: #51607a;
  --dui-text-3: #8a95a8;

  --dui-accent: #5b46d6;
  --dui-accent-hover: #4a37bd;
  --dui-accent-on: #ffffff;
  --dui-accent-soft: rgba(91, 70, 214, 0.08);

  --dui-danger: #b42318;
  --dui-success: #067647;

  --dui-ring: rgba(91, 70, 214, 0.45);
  --dui-glow: radial-gradient(120% 120% at 80% 0%, rgba(91,70,214,0.10) 0%, rgba(91,70,214,0) 60%);

  --dui-e1: 0 1px 2px rgba(16,24,40,0.05), 0 1px 3px rgba(16,24,40,0.06);
  --dui-e2: 0 4px 8px -2px rgba(16,24,40,0.07), 0 12px 24px -6px rgba(16,24,40,0.08);
  --dui-e3: 0 12px 20px -6px rgba(16,24,40,0.09), 0 28px 48px -12px rgba(16,24,40,0.14);

  /* Light cards are solid. Glass over a light page looks washed out, not
     premium, so the frosted treatment is reserved for the dark theme. */
  --dui-card-bg: var(--dui-surface);
  --dui-card-blur: none;

  color-scheme: light dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --dui-bg: #0a0b0f;
    --dui-surface: rgba(255,255,255,0.045);
    --dui-surface-2: rgba(255,255,255,0.025);
    --dui-surface-hover: rgba(255,255,255,0.07);
    --dui-border: rgba(255,255,255,0.09);
    --dui-border-strong: rgba(255,255,255,0.16);
    --dui-text: rgba(255,255,255,0.92);
    --dui-text-2: rgba(255,255,255,0.58);
    --dui-text-3: rgba(255,255,255,0.40);
    --dui-accent: #9b8cff;
    --dui-accent-hover: #aea2ff;
    --dui-accent-on: #14102b;
    --dui-accent-soft: rgba(155,140,255,0.14);
    --dui-danger: #ff9b92;
    --dui-success: #6fd6a3;
    --dui-ring: rgba(155,140,255,0.55);
    --dui-glow: radial-gradient(120% 120% at 80% 0%, rgba(155,140,255,0.16) 0%, rgba(155,140,255,0) 60%);
    --dui-e1: 0 1px 2px rgba(0,0,0,0.4);
    --dui-e2: 0 12px 28px -10px rgba(0,0,0,0.55);
    --dui-e3: 0 24px 50px -12px rgba(0,0,0,0.65);
    --dui-card-bg: linear-gradient(to bottom, rgba(255,255,255,0.07), rgba(255,255,255,0.02));
    --dui-card-blur: blur(24px);
  }
}

:root[data-theme="dark"] {
  --dui-bg: #0a0b0f;
  --dui-surface: rgba(255,255,255,0.045);
  --dui-surface-2: rgba(255,255,255,0.025);
  --dui-surface-hover: rgba(255,255,255,0.07);
  --dui-border: rgba(255,255,255,0.09);
  --dui-border-strong: rgba(255,255,255,0.16);
  --dui-text: rgba(255,255,255,0.92);
  --dui-text-2: rgba(255,255,255,0.58);
  --dui-text-3: rgba(255,255,255,0.40);
  --dui-accent: #9b8cff;
  --dui-accent-hover: #aea2ff;
  --dui-accent-on: #14102b;
  --dui-accent-soft: rgba(155,140,255,0.14);
  --dui-danger: #ff9b92;
  --dui-success: #6fd6a3;
  --dui-ring: rgba(155,140,255,0.55);
  --dui-glow: radial-gradient(120% 120% at 80% 0%, rgba(155,140,255,0.16) 0%, rgba(155,140,255,0) 60%);
  --dui-e1: 0 1px 2px rgba(0,0,0,0.4);
  --dui-e2: 0 12px 28px -10px rgba(0,0,0,0.55);
  --dui-e3: 0 24px 50px -12px rgba(0,0,0,0.65);
  --dui-card-bg: linear-gradient(to bottom, rgba(255,255,255,0.07), rgba(255,255,255,0.02));
  --dui-card-blur: blur(24px);
}

/* Border-box on these components only, never a global reset. Dropping this
   file into an app that already has its own layout must not move anything
   it did not create. Without this, padding is ADDED to width:100% and every
   card overflows a phone screen by the width of its padding. */
.dui-grid, .dui-stack, .dui-row, .dui-card, .dui-card *,
.dui-btn, .dui-stat, .dui-skeleton, .dui-empty, .dui-empty * {
  box-sizing: border-box;
}

.dui {
  margin: 0;
  background: var(--dui-bg);
  color: var(--dui-text);
  font-family: var(--dui-font-body);
  font-size: var(--dui-text-md);
  line-height: var(--dui-leading-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.dui h1, .dui h2, .dui h3, .dui h4 {
  font-family: var(--dui-font-display);
  font-weight: var(--dui-weight-semibold);
  letter-spacing: var(--dui-track-tight);
  line-height: var(--dui-leading-tight);
  margin: 0;
  text-wrap: balance;
}
.dui h1 { font-size: var(--dui-text-4xl); }
.dui h2 { font-size: var(--dui-text-3xl); }
.dui h3 { font-size: var(--dui-text-2xl); }
.dui h4 { font-size: var(--dui-text-xl); }
.dui p { margin: 0; max-width: 68ch; }

/* Tabular figures everywhere a number can change. Digits that shift width
   make a live figure jitter, which instantly reads as unfinished. */
.dui-num, .dui-stat__value {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

.dui-grid {
  display: grid;
  gap: var(--dui-s4);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 264px), 1fr));
}
@media (min-width: 720px) {
  .dui-grid > .dui-span-2 { grid-column: span 2; }
  .dui-grid > .dui-span-3 { grid-column: span 3; }
  .dui-grid > .dui-tall   { grid-row: span 2; }
}
.dui-stack { display: flex; flex-direction: column; gap: var(--dui-s3); }
.dui-row { display: flex; align-items: center; gap: var(--dui-s3); flex-wrap: wrap; }

.dui-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: var(--dui-s5);
  border-radius: var(--dui-r-xl);
  border: 1px solid var(--dui-border);
  background: var(--dui-card-bg);
  -webkit-backdrop-filter: var(--dui-card-blur);
  backdrop-filter: var(--dui-card-blur);
  box-shadow: var(--dui-e2);
  color: var(--dui-text-2);
  transition: box-shadow var(--dui-t-base) var(--dui-ease),
              border-color var(--dui-t-base) var(--dui-ease),
              transform var(--dui-t-base) var(--dui-ease);
}

/* The ambient glow sits at z-index 0 - ABOVE the card background and BELOW
   the content at z-index 1. A negative z-index here would paint it behind
   the card background and it would never be visible at all. */
.dui-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--dui-glow);
  opacity: 0;
  transition: opacity var(--dui-t-slow) var(--dui-ease);
}
.dui-card > * { position: relative; z-index: 1; }

.dui-card__head { display: flex; flex-direction: column; gap: var(--dui-s1); margin-bottom: var(--dui-s4); }
.dui-card__title {
  font-family: var(--dui-font-display);
  font-size: var(--dui-text-lg);
  font-weight: var(--dui-weight-medium);
  letter-spacing: var(--dui-track-tight);
  line-height: var(--dui-leading-snug);
  color: var(--dui-text);
  margin: 0;
}
.dui-card__subtitle {
  font-size: var(--dui-text-sm);
  letter-spacing: var(--dui-track-wide);
  color: var(--dui-text-3);
  margin: 0;
}
.dui-card__body { flex: 1 1 auto; min-width: 0; }
.dui-card__foot {
  margin-top: var(--dui-s4);
  padding-top: var(--dui-s3);
  border-top: 1px solid var(--dui-border);
  font-size: var(--dui-text-sm);
  color: var(--dui-text-3);
}

.dui-card.is-interactive {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  text-align: left;
  text-decoration: none;
  width: 100%;
  font: inherit;
  color: var(--dui-text-2);
}
@media (hover: hover) {
  .dui-card.is-interactive:hover {
    transform: translateY(var(--dui-lift)) scale(var(--dui-hover-scale));
    box-shadow: var(--dui-e3);
    border-color: var(--dui-border-strong);
  }
  .dui-card.is-interactive:hover::before { opacity: 1; }
}
.dui-card.is-interactive:active {
  transform: scale(var(--dui-press-scale));
  transition-duration: var(--dui-t-fast);
}
.dui-card.is-interactive:focus-visible {
  outline: none;
  box-shadow: var(--dui-e3), 0 0 0 2px var(--dui-bg), 0 0 0 4px var(--dui-ring);
}
.dui-card.is-interactive:focus-visible::before { opacity: 1; }
.dui-card.is-pressed { transform: scale(var(--dui-press-scale)); }

.dui-stat { display: flex; flex-direction: column; gap: var(--dui-s1); }
.dui-stat__label {
  font-size: var(--dui-text-xs);
  letter-spacing: var(--dui-track-wide);
  text-transform: uppercase;
  color: var(--dui-text-3);
}
.dui-stat__value {
  font-family: var(--dui-font-display);
  font-size: var(--dui-text-3xl);
  font-weight: var(--dui-weight-semibold);
  letter-spacing: var(--dui-track-tight);
  line-height: var(--dui-leading-tight);
  color: var(--dui-text);
}
.dui-stat__delta { font-size: var(--dui-text-sm); color: var(--dui-text-2); }
.dui-stat__delta[data-dir="up"] { color: var(--dui-success); }
.dui-stat__delta[data-dir="down"] { color: var(--dui-danger); }

.dui-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--dui-s2);
  min-height: 44px;
  padding: 0 var(--dui-s4);
  border: 1px solid transparent;
  border-radius: var(--dui-r-md);
  background: var(--dui-accent);
  color: var(--dui-accent-on);
  font-family: var(--dui-font-body);
  font-size: var(--dui-text-sm);
  font-weight: var(--dui-weight-medium);
  letter-spacing: var(--dui-track-snug);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color var(--dui-t-fast) var(--dui-ease),
              transform var(--dui-t-fast) var(--dui-ease),
              box-shadow var(--dui-t-fast) var(--dui-ease);
}
.dui-btn:hover { background: var(--dui-accent-hover); }
.dui-btn:active { transform: scale(var(--dui-press-scale)); }
.dui-btn:focus-visible { outline: none; box-shadow: 0 0 0 2px var(--dui-bg), 0 0 0 4px var(--dui-ring); }
.dui-btn[disabled], .dui-btn[aria-disabled="true"] { opacity: .5; cursor: not-allowed; transform: none; }
.dui-btn--quiet { background: transparent; border-color: var(--dui-border); color: var(--dui-text); }
.dui-btn--quiet:hover { background: var(--dui-accent-soft); border-color: var(--dui-border-strong); }

/* Loading, empty and error are where an app stops feeling finished.
   Every app gets the same three, so none can ship a blank screen. */
.dui-skeleton {
  position: relative;
  overflow: hidden;
  border-radius: var(--dui-r-sm);
  background: var(--dui-surface-2);
  min-height: 1em;
}
.dui-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, var(--dui-surface-hover), transparent);
  animation: dui-shimmer 1.4s var(--dui-ease) infinite;
}
.dui-skeleton--text { height: .8em; margin: .2em 0; }
.dui-skeleton--title { height: 1.4em; width: 55%; }
.dui-skeleton--line { height: .8em; width: 100%; }
.dui-skeleton--line-short { height: .8em; width: 70%; }
.dui-skeleton--block { height: 96px; border-radius: var(--dui-r-md); }
@keyframes dui-shimmer { to { transform: translateX(100%); } }

.dui-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--dui-s2);
  padding: var(--dui-s6) var(--dui-s4);
  text-align: center;
}
.dui-empty__icon { width: 40px; height: 40px; margin-bottom: var(--dui-s1); color: var(--dui-text-3); }
.dui-empty__title {
  font-family: var(--dui-font-display);
  font-size: var(--dui-text-md);
  font-weight: var(--dui-weight-medium);
  letter-spacing: var(--dui-track-snug);
  color: var(--dui-text);
}
.dui-empty__hint { font-size: var(--dui-text-sm); color: var(--dui-text-3); max-width: 42ch; }
.dui-empty__action { margin-top: var(--dui-s3); }
.dui-error { color: var(--dui-danger); }

.dui-spinner {
  width: 1em; height: 1em; flex: none;
  border-radius: var(--dui-r-full);
  border: 2px solid currentColor;
  border-top-color: transparent;
  animation: dui-spin 600ms linear infinite;
}
@keyframes dui-spin { to { transform: rotate(360deg); } }

.dui-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

@media (prefers-reduced-motion: reduce) {
  .dui-card, .dui-card.is-interactive:hover, .dui-card.is-interactive:active,
  .dui-card.is-pressed, .dui-btn, .dui-btn:active { transform: none !important; }
  .dui-skeleton::after, .dui-spinner { animation: none; }
  .dui-skeleton::after { transform: none; opacity: .6; background: var(--dui-surface-hover); }
  .dui * { transition-duration: 1ms !important; }
}

@media print {
  .dui { background: #fff; color: #000; }
  .dui-card {
    box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none;
    background: #fff; border: 1px solid #ccc; break-inside: avoid;
  }
  .dui-card::before { display: none; }
}

/* Dimau header lighting — 18 October 2026. History's original artwork stays intact. */
@layer dimau-history-lighting {
 :root {
  --dimau-header-rest:0 0 0 1px rgba(135,206,235,.35),0 0 12px rgba(30,144,255,.45),inset 0 0 14px rgba(30,144,255,.18);
  --dimau-header-lit:0 0 0 2px rgba(255,255,255,.98),0 0 14px 4px rgba(56,189,248,.95),0 0 32px 8px rgba(30,144,255,.72),inset 0 0 18px 3px rgba(240,249,255,.65);
 }
 /* A decorative tile around the existing mark preserves its size and header position. */
 html:root body .dimau-owner-logo-frame {position:relative!important;isolation:isolate;overflow:visible!important;background:transparent!important;}
 html:root body .dimau-owner-logo-frame::before {
  content:""!important;position:absolute!important;left:50%!important;top:50%!important;inset:auto auto auto auto;
  width:48px!important;height:48px!important;transform:translate(-50%,-50%)!important;box-sizing:border-box!important;
  border:1.5px solid #1e90ff!important;border-radius:14px!important;background:#fff!important;
  box-shadow:var(--dimau-header-rest)!important;pointer-events:none;z-index:-1;
 }
 html:root body .dimau-owner-logo-frame img {position:relative!important;z-index:1;}
 html:root body .dimau-owner-logo-frame:is(:hover,:focus-within)::before,
 html:root body a:focus-visible .dimau-owner-logo-frame::before {box-shadow:var(--dimau-header-lit)!important;}
 /* Some native headers place the original image directly in the brand link. */
 html:root body :is(img.dimau-owner-logo,img[src*="dimau-owner-logo"],img[src$="/dimau-fintech-logo.png"]):not(.dimau-owner-logo-frame img) {
  border-color:#1e90ff!important;border-radius:8px!important;outline:1.5px solid #1e90ff!important;outline-offset:4.5px!important;
  box-shadow:0 0 0 4.5px #fff,0 0 0 6px rgba(135,206,235,.35),0 0 12px 6px rgba(30,144,255,.45),inset 0 0 14px rgba(30,144,255,.18)!important;
 }
 html:root body :is(img.dimau-owner-logo,img[src*="dimau-owner-logo"],img[src$="/dimau-fintech-logo.png"]):not(.dimau-owner-logo-frame img):hover,
 html:root body a:focus-visible :is(img.dimau-owner-logo,img[src*="dimau-owner-logo"],img[src$="/dimau-fintech-logo.png"]):not(.dimau-owner-logo-frame img) {box-shadow:var(--dimau-header-lit)!important;}
 /* History already has this native48px tile; keep one border and one glow. */
 html:root body a[class*="visitor-experience_dialogLogo"] .dimau-owner-logo-frame::before {content:none!important;}
 html:root body a[class*="visitor-experience_dialogLogo"] {border-color:#1e90ff!important;box-shadow:var(--dimau-header-rest)!important;}
 html:root body a[class*="visitor-experience_dialogLogo"]:is(:hover,:focus-visible) {box-shadow:var(--dimau-header-lit)!important;}
 html:root body #root#root :is(button.music-mini__play,button.nav-music__play),
 html:root body #app#app button#sk-hero-play,
 html:root body button[data-music-toggle][data-music-toggle] {box-shadow:var(--dimau-header-rest)!important;overflow:visible!important;}
 html:root body #root#root :is(button.music-mini__play,button.nav-music__play):is(:hover,:focus-visible,:active),
 html:root body #app#app button#sk-hero-play:is(:hover,:focus-visible,:active),
 html:root body button[data-music-toggle][data-music-toggle]:is(:hover,:focus-visible,:active) {box-shadow:var(--dimau-header-lit)!important;}
 @media(max-width:720px){
  html:root body .dimau-owner-logo-frame::before {border-radius:10px!important;}
  html:root body :is(img.dimau-owner-logo,img[src*="dimau-owner-logo"],img[src$="/dimau-fintech-logo.png"]):not(.dimau-owner-logo-frame img) {border-radius:4px!important;}
 }
 @media(prefers-reduced-motion:reduce){html:root body .dimau-owner-logo-frame::before {transition:none!important;}}
 @media(forced-colors:active){
  html:root body .dimau-owner-logo-frame::before {background:Canvas!important;border-color:CanvasText!important;box-shadow:none!important;}
  html:root body :is(img.dimau-owner-logo,img[src*="dimau-owner-logo"],img[src$="/dimau-fintech-logo.png"]) {outline-color:CanvasText!important;box-shadow:none!important;}
  html:root body #root#root :is(button.music-mini__play,button.nav-music__play),html:root body #app#app button#sk-hero-play,html:root body button[data-music-toggle][data-music-toggle] {box-shadow:none!important;}
 }
 @media print{html:root body .dimau-owner-logo-frame::before,html:root body img.dimau-owner-logo {box-shadow:none!important;}}
}

/* History pill rows v2 — 18 October 2026. Native actions and artwork retained. */
@layer dimau-history-lighting{
html:root body:not(#dimau-pill-unused) :is(.hdr :is(button,summary,a.btn,a.button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled),.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled),.bw-line button,.bula-btn,button[data-bula-open]){box-sizing:border-box!important;min-height:44px!important;border:1px solid #1e90ff!important;border-radius:4px 16px!important;background:rgba(240,248,255,.86)!important;color:#000080!important;box-shadow:0 0 0 1px rgba(135,206,235,.35),0 0 12px rgba(30,144,255,.45),inset 0 0 14px rgba(30,144,255,.18)!important;outline:0;font-family:var(--dimau-font,Manrope),system-ui,sans-serif!important;font-weight:700!important;font-size:14px!important;line-height:1.2!important;letter-spacing:normal!important;text-transform:none!important;padding:10px 16px!important;white-space:nowrap!important;text-decoration:none!important;}
html:root body:not(#dimau-pill-unused) :is(.hdr :is(button,summary,a.btn,a.button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled):is([aria-current="page"],[aria-selected="true"],.active,.on),.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled):is([aria-current="page"],[aria-selected="true"],.active,.on),.bw-line button:is([aria-current="page"],[aria-selected="true"],.active,.on),.bula-btn:is([aria-current="page"],[aria-selected="true"],.active,.on),button[data-bula-open]:is([aria-current="page"],[aria-selected="true"],.active,.on)){background:rgba(218,239,255,.98)!important;box-shadow:inset 0 0 0 1px #1e90ff,0 0 0 1px rgba(135,206,235,.35),0 0 12px rgba(30,144,255,.45),inset 0 0 14px rgba(30,144,255,.18)!important;}
html:root body:not(#dimau-pill-unused) :is(.hdr :is(button,summary,a.btn,a.button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled):focus-visible,.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled):focus-visible,.bw-line button:focus-visible,.bula-btn:focus-visible,button[data-bula-open]:focus-visible){outline:2px solid #1e90ff!important;outline-offset:-3px!important;box-shadow:0 0 0 2px rgba(255,255,255,.98),0 0 14px 4px rgba(56,189,248,.95),0 0 32px 8px rgba(30,144,255,.72),inset 0 0 18px 3px rgba(240,249,255,.65)!important;}
@media(hover:hover) and (pointer:fine){html:root body:not(#dimau-pill-unused) :is(.hdr :is(button,summary,a.btn,a.button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled):hover,.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled):hover,.bw-line button:hover,.bula-btn:hover,button[data-bula-open]:hover){background:rgba(240,248,255,.98)!important;box-shadow:0 0 0 2px rgba(255,255,255,.98),0 0 14px 4px rgba(56,189,248,.95),0 0 32px 8px rgba(30,144,255,.72),inset 0 0 18px 3px rgba(240,249,255,.65)!important;}
}
html:root body:not(#dimau-pill-unused):not(#dimau-pill-row-size) :is(.hdr .nav){display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-start!important;gap:6px!important;min-width:0!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin!important;scrollbar-color:#1e90ff rgba(30,144,255,.18)!important;overscroll-behavior-x:contain;scroll-padding-inline:8px;padding-bottom:10px!important;-webkit-overflow-scrolling:touch;}
html:root body:not(#dimau-pill-unused):not(#dimau-pill-row-size) :is(.hdr .nav>*){flex:0 0 auto!important;}
html:root body:not(#dimau-pill-unused):not(#dimau-pill-row-size) :is(.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled)){display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;flex:0 0 auto!important;height:40px!important;min-height:40px!important;padding:7px 12px!important;white-space:nowrap!important;}
html:root body:not(#dimau-pill-unused):not(#dimau-pill-row-size) :is(.hdr .nav)::-webkit-scrollbar{height:6px!important;width:6px!important}html:root body:not(#dimau-pill-unused):not(#dimau-pill-row-size) :is(.hdr .nav)::-webkit-scrollbar-track{background:rgba(30,144,255,.18)!important;border-radius:999px!important}html:root body:not(#dimau-pill-unused):not(#dimau-pill-row-size) :is(.hdr .nav)::-webkit-scrollbar-thumb{background:#1e90ff!important;border-radius:999px!important;box-shadow:0 0 6px rgba(30,144,255,.5)!important}html:root body:not(#dimau-pill-unused) :is(.hdr .brand,.hdr .brand>span:last-child){font-family:var(--dimau-font,Manrope),system-ui,sans-serif!important;font-size:18px!important;font-weight:800!important;line-height:1.2!important;letter-spacing:normal!important;}
.hdr>.wrap{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;align-items:center!important;gap:8px 20px!important;min-height:64px!important;padding-block:8px!important}.hdr .brand{gap:10px!important}.hdr .menu-btn{display:none!important}.hdr .nav{position:static!important;inset:auto!important;width:100%!important;max-height:none!important;transform:none!important;visibility:visible!important;opacity:1!important;margin:0!important}.hdr .nav a{display:inline-flex!important}.hdr .nav a:not(.cta){background:linear-gradient(180deg,#ffffffed,#d9efffc2)!important;color:#0b2540!important;border:1px solid #68b6f1!important;box-shadow:var(--dimau-history-rest-shadow)!important}@media(max-width:900px){.hdr>.wrap{grid-template-columns:minmax(0,1fr)!important;padding-inline:12px!important}.hdr .nav{grid-column:1!important;grid-row:2!important}} .hdr .nav a{margin:0!important}
html:root body:not(#dimau-pill-unused) :is(.hdr input[type="search"]){box-sizing:border-box!important;min-width:0!important;min-height:44px!important;border:1px solid #1e90ff!important;border-radius:4px 16px!important;background:rgba(240,248,255,.86)!important;color:#000080!important;box-shadow:0 0 0 1px rgba(135,206,235,.35),0 0 12px rgba(30,144,255,.45),inset 0 0 14px rgba(30,144,255,.18)!important;font-size:16px!important;}
@media(forced-colors:active){html:root body:not(#dimau-pill-unused) :is(.hdr :is(button,summary,a.btn,a.button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled),.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled),.bw-line button,.bula-btn,button[data-bula-open]){background:ButtonFace!important;color:ButtonText!important;border-color:ButtonText!important;box-shadow:none!important;}
html:root body:not(#dimau-pill-unused) :is(.hdr .nav){scrollbar-color:auto!important;}
}
@media print{html:root body:not(#dimau-pill-unused) :is(.hdr :is(button,summary,a.btn,a.button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled),.hdr .nav :is(a,button):not(.brand):not(.brand-symbol):not(.logo-tile):not(.logotile):not(.sk-site-brand):not([class*="music"]):not([class*="flagBadge"]):not([data-music-toggle]):not(#sk-hero-play):not(:has(img.dimau-owner-logo)):not(.danger):not([aria-disabled="true"]):not(:disabled),.bw-line button,.bula-btn,button[data-bula-open]){box-shadow:none!important;}
}
}

/* Dimau consistent native header v1 — 18 October 2026. */
@layer dimau-history-lighting{
html:root body:not(#dimau-consistency-a):not(#dimau-consistency-b):not(#dimau-consistency-c) :is(.hdr .brand,.hdr .brand>span:last-child){font-size:18px!important;font-weight:800!important;line-height:21.6px!important;letter-spacing:normal!important;}
html:root body:not(#dimau-consistency-a):not(#dimau-consistency-b):not(#dimau-consistency-c) :is(.hdr .brand){min-height:48px!important;display:flex!important;align-items:center!important;gap:14px!important;padding-left:6px!important;box-sizing:border-box!important;margin:0!important;}
}