/* Helium Blue V2.1 | Upsense Studio
   Blue brand surfaces + exact signature orange > burgundy accent.
   Loads LAST after every versioned source stylesheet. Existing motion/geometry remains intact.
*/
:root {
 --he-blue:var(--he-p-0062CB);--he-midnight:var(--he-p-123A5C);--he-sky:var(--he-p-44A3DA);
 --he-ice:var(--he-p-D8E6F0);--he-header:var(--he-p-EEF4F8);--he-ink:var(--he-p-1F3342);
 --he-accent-start:var(--he-p-FF8000);--he-accent-end:var(--he-p-990003);
 --he-accent:linear-gradient(90deg, var(--he-p-FF8000) 0%, var(--he-p-990003) 102.92%);
 --he-v193-accent:var(--he-blue);--he-v193-canvas:var(--he-ice);
 --he-v193-header:var(--he-header);--he-v193-ink:var(--he-ink);
 --he-header-bg:var(--he-header);--he-page-bg:var(--he-ice);
 --sa-canvas:var(--he-ice);--sa-canvas-health:var(--he-ice);
 --sa-primary:var(--he-blue);--sa-lime:var(--he-blue);--sa-current:var(--he-blue);
 --sa-green:var(--he-p-348BD3);--sa-tide:var(--he-p-348BD3);--sa-ocean:var(--he-midnight);
 --sa-forest:var(--he-midnight);--sa-ink:var(--he-ink);
 --sa-foam:var(--he-p-E7F2FA);--sa-wave:var(--he-p-44A3DA);--sa-muted:var(--he-p-6A7D8F);
 --sa-primary-hover:var(--he-p-2B7FD3);--sa-primary-ink:white;
 --he-load-lime:var(--he-blue);--he-load-green:var(--he-blue);
 --he-load-ink:var(--he-p-125A97);--he-avatar-brand:var(--he-blue);
 --he-highlight:var(--he-blue);--he-stage:var(--he-p-E5EEF6);
 --lime:var(--he-blue);--green:var(--he-p-348BD3);
}
body.finance-page .finance-main,html body.finance-page .finance-main {
 background:var(--he-p-D8E6F0)!important;background-color:var(--he-p-D8E6F0)!important;background-image:none!important;
}
body.finance-page .finance-main>.topbar,
body.health-page .health-topbar,.health-topbar {
 background-color:var(--he-p-EEF4F8)!important;
}
:is(.he-stage,.he-main,.he-gallery,.hm-main,.screen,.desktop-page,.mobile-stage,.lab,.portal-main) {
 --sa-ink:var(--he-p-1F3342);--sa-muted:var(--he-p-6A7D8F);
}
/* A single deliberately chosen accent treatment reused wherever a primary/highlight action is expected. */
:is(.v2-shell .h2-button.h2-accent,
 .he-btn-primary,.he-btn.he-btn-primary,
 .btn.lime,.btn.primary,.primary-button,.header-cta,
 .new-challenge,.btn--lime,.send-chat,.modal-submit,
 .he-button-primary,.lab-btn.primary,
 .hm-primary,.ha-send,
 .ha-submit,.ha-composer button[type="submit"],
 .he-action-primary,.he-demo-primary,
 .ru-action.primary,.ru-btn.primary,
 .action:not(.plain),.sa-button--primary) {
 background:var(--he-accent)!important;
 background-image:var(--he-accent)!important;
 color:var(--helium-accent-ink)!important;border-color:transparent!important;
 box-shadow:none!important;
}
:is(.he-btn-primary,.btn.lime,.btn.primary,.primary-button,.header-cta,
 .new-challenge,.send-chat,.modal-submit,.he-button-primary,.lab-btn.primary,
 .hm-primary,.ha-send,.he-action-primary,.he-demo-primary,
 .action:not(.plain),.sa-button--primary):hover:not(:disabled) {
 background:var(--he-accent)!important;
 background-image:var(--he-accent)!important;
 filter:brightness(1.06);
 transform:none!important;
}
:is(.he-btn-primary,.btn.lime,.btn.primary,.primary-button,.header-cta,
 .send-chat,.modal-submit,.he-button-primary,.lab-btn.primary,.hm-primary,.ha-send,
 .he-action-primary,.action:not(.plain)) :is(svg,path) {color:inherit;stroke:currentColor}
/* Accent also drives editorial accent tile, but do not turn every card into a wash. */
.v2-shell .h2-material.accent {background:var(--he-accent)!important;color:var(--helium-accent-ink)!important}
/* True blue interactive signals, not leftover lime success fills. */
:is(.he-accent-dot,.he-light-dot,.hm-status-dot,.live-dot,.status-dot,.brand-spark,
 .he-bot-avatar .he-avatar-pulse) {background-color:var(--he-blue)}
/* Cobalt-only internally clipped studio materials. No exterior glow, lift or generic multi-hue washes. */
.v2-shell :is(.h2-hero-art,.h2-material.aurora,.h2-screen-cover.h2-contained-light) {isolation:isolate;overflow:hidden}
/* Existing colored experience surfaces retain their structure; hue values come from the recolored CSS. */
:is(.he-btn-primary,.he-btn-secondary,.he-pill,.he-demo-btn,.hm-primary,.lab-btn,.btn,.sa-button,.h2-button){corner-shape:squircle}
:where(button,a,input,textarea,select,[tabindex]):focus-visible {outline-color:var(--he-p-2B7FD3)}
@media (prefers-reduced-motion:reduce){
 :is(.he-btn-primary,.btn.lime,.btn.primary,.hm-primary,.ha-send):hover {filter:none!important}
}

/* Premium editorial accent matches the same governed ramp. */
.health-page .yellow-pill {background:var(--he-accent)!important;color:var(--helium-accent-ink)!important;border:0!important}

/* V2.5.1 · targeted control-legibility fixes; no palette/surface changes. */
html body.health-page .health-summary-metrics {
  grid-template-columns:repeat(4,minmax(0,max-content))!important;
  max-width:none!important;
  column-gap:clamp(12px,1.3vw,20px)!important;
  justify-content:start;
}
html body.health-page .health-summary-metrics>div {
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  min-width:max-content!important;
  gap:7px!important;
}
html body.health-page .health-summary-metrics>div>span {
  max-width:none!important;
  min-width:max-content;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
}
@media(max-width:900px){
  html body.health-page .health-summary-metrics {
    grid-template-columns:repeat(2,max-content)!important;
    row-gap:8px!important;
  }
}
@media(max-width:390px){
  html body.health-page .health-summary-metrics {
    column-gap:8px!important;
  }
  html body.health-page .health-summary-metrics strong {font-size:22px!important}
}
/* Use one custom search border, not a second native border inside it. */
html body.health-page .he-health-search input {
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  -webkit-appearance:none;
}
html body.health-page .he-health-search:focus-within {
  outline:2px solid var(--helium-color-focus);
  outline-offset:2px;
}
/* Opaque, legible text on cobalt status badges. */
html body.health-page :is(.yellow-pill,.yellow-tag,.bestseller) {
  color:#fff!important;
}
/* Specificity must exceed legacy body/element overrides for these three badges. */
html body.health-page .subscription-card span.yellow-pill,
html body.health-page .health-summary-metrics span.yellow-tag,
html body.health-page .product-card span.bestseller {
  color:#fff!important;
}
html body.health-page label.he-health-search input#heBiomarkerSearch {
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

/* V2.5.2: health subscription CTA uses the active accent recipe. Status tags
   retain the original brand-green meaning instead of becoming purple. */
html body.health-page .subscription-card span.yellow-pill {
  background:var(--helium-accent-gradient)!important;
  background-image:var(--helium-accent-gradient)!important;
  color:var(--helium-accent-ink)!important;
  border-color:transparent!important;
}
html[data-he-theme="green"] body.health-page :is(.health-summary-metrics span.yellow-tag,.product-card span.bestseller),
html[data-he-theme="green-purple"] body.health-page :is(.health-summary-metrics span.yellow-tag,.product-card span.bestseller) {
  color:var(--helium-color-text)!important;
}
/* The Green+Purple preset visibly uses its accent on the primary workspace CTA;
   the Blue and historically faithful Green layouts remain unchanged. */
html[data-he-theme="green-purple"] .v2-shell .h2-hero .h2-button.h2-primary {
  background:var(--helium-accent-gradient)!important;
  background-image:var(--helium-accent-gradient)!important;
  border-color:transparent!important;
  color:var(--helium-accent-ink)!important;
}
