/* Melacor reference composition. All copy remains HTML; original artwork is
   shown in individual clipped image viewports without rasterized page text. */
@layer melacor-detail {
  html body.ml-page { background: #e7f9fe !important; }
  html body.ml-page main#main#main.ml-main { display:block!important; width:100%!important; max-width:none!important; margin:0!important; padding:var(--detail-header-space,0px) 0 0!important; font-family:var(--site-font,"DM Sans",sans-serif)!important; color:#071a58 !important; }
  html body.ml-page main#main#main * { box-sizing:border-box !important; }
  html body.ml-page main#main#main :is(h1,h2,h3,h4,p,figure,ul,ol) { margin:0!important; }
  html body.ml-page main#main#main :is(h1,h2,h3,h4,p,li,strong,span) { font-family:var(--site-font,"DM Sans",sans-serif)!important; font-style:normal!important; text-transform:none!important; letter-spacing:normal!important; }
  html body.ml-page main#main#main :is(h1,h2,h3,h4) { color:inherit!important; line-height:1.12!important; overflow-wrap:normal!important; text-wrap:initial!important; }
  html body.ml-page main#main#main :is(ul,ol) { padding:0!important; list-style:none !important; }
  html body.ml-page main#main#main sup { font-size:.4em!important; font-weight:700!important; line-height:0!important; vertical-align:super !important; letter-spacing:0!important; }
  html body.ml-page main#main#main .ml-sheet { position:relative !important; container-type:inline-size !important; width:100%!important; max-width:1800px!important; aspect-ratio:1536/1024 !important; margin:0 auto!important; padding:0!important; overflow:hidden !important; background-color:#e9faff !important; background-image:linear-gradient(90deg,#85cfeb30 1px,transparent 1px),linear-gradient(#85cfeb24 1px,transparent 1px),radial-gradient(ellipse at 65% 45%,#d1f5ff,transparent 68%) !important; background-size:8cqw 10.5cqw,8cqw 10.5cqw,100% 100% !important; }
  html body.ml-page main#main#main .ml-sheet + .ml-sheet { border-top:1px solid #b4e4ee !important; }
  html body.ml-page main#main#main .ml-crop { display:block !important; position:relative !important; aspect-ratio:var(--crop-ratio) !important; overflow:hidden !important; }
  html body.ml-page main#main#main .ml-crop > img { position:absolute !important; display:block !important; left:var(--crop-left) !important; top:var(--crop-top) !important; width:var(--crop-width)!important; max-width:none!important; height:auto!important; margin:0!important; border-radius:0!important; }
  html body.ml-page main#main#main .ml-sidebar { position:absolute !important; overflow:hidden !important; border-radius:1.7cqw !important; color:#fff !important; background:linear-gradient(120deg,#002638,#00334e 62%,#035472) !important; box-shadow:0 .45cqw 1.2cqw #4689a21a !important; }
  html body.ml-page main#main#main .ml-pathway-sidebar { left:1.693% !important; top:2.148% !important; width:25.326% !important; height:95.605% !important; padding:2.1cqw 1.3cqw 2.1cqw 2.28cqw !important; }
  html body.ml-page main#main#main .ml-kicker { display:flex !important; align-items:center !important; gap:.65cqw !important; white-space:nowrap !important; font-size:1.3cqw!important; font-weight:400 !important; letter-spacing:.2em!important; }
  html body.ml-page main#main#main .ml-kicker > span { display:block !important; flex:1 !important; height:1px !important; background:#62e2e9 !important; }
  html body.ml-page main#main#main .ml-brand { margin-top:3.2cqw!important; white-space:nowrap !important; font-size:3.51cqw!important; line-height:1!important; font-weight:900!important; letter-spacing:-.055em!important; }
  html body.ml-page main#main#main .ml-accent-rule { width:6.3cqw !important; height:.45cqw !important; margin:1.25cqw 0 1.4cqw !important; border-radius:1cqw !important; background:#69e5ed !important; }
  html body.ml-page main#main#main .ml-sidebar-heading { font-size:2.65cqw!important; line-height:1.03!important; font-weight:700!important; letter-spacing:-.055em!important; }
  html body.ml-page main#main#main .ml-sidebar-subtitle { margin-top:1.05cqw!important; font-size:1.82cqw!important; line-height:1.09!important; font-weight:500!important; color:#73e7f3 !important; letter-spacing:-.035em!important; }
  html body.ml-page main#main#main .ml-sidebar-subtitle + .ml-accent-rule { margin:1.2cqw 0 1.3cqw !important; width:7.2cqw !important; }
  html body.ml-page main#main#main .ml-sidebar-description { font-size:1.25cqw!important; font-weight:400!important; line-height:1.28!important; letter-spacing:-.02em!important; color:#f2f6fc !important; }
  html body.ml-page main#main#main .ml-pathway-label { margin-top:1.75cqw!important; font-size:1.06cqw!important; letter-spacing:.24em!important; line-height:1.4!important; color:#fff !important; }
  html body.ml-page main#main#main .ml-step-list { margin-top:.7cqw!important; }
  html body.ml-page main#main#main .ml-step-list li { display:flex !important; position:relative !important; gap:1.1cqw !important; min-height:6.9cqw !important; padding-left:.2cqw !important; }
  html body.ml-page main#main#main .ml-step-list li::before { content:"" !important; position:absolute !important; left:1.6cqw !important; top:2.7cqw !important; bottom:0 !important; border-left:1px solid #d5e7f4 !important; }
  html body.ml-page main#main#main .ml-step-number { display:grid !important; place-items:center !important; flex:none !important; width:2.85cqw !important; height:2.85cqw !important; border-radius:50% !important; background:#6cf0fc !important; color:#051a43 !important; font-size:1.55cqw!important; font-weight:700 !important; }
  html body.ml-page main#main#main .ml-step-list h3 { padding-top:.35cqw !important; font-size:1.44cqw!important; line-height:1.2!important; font-weight:700!important; white-space:nowrap !important; letter-spacing:-.035em!important; }
  html body.ml-page main#main#main .ml-step-list p { margin-top:.35cqw!important; color:#f1f7fa !important; font-size:1.2cqw!important; line-height:1.27!important; }
  html body.ml-page main#main#main .ml-sidebar-callout { position:absolute !important; left:2.15cqw !important; right:1.85cqw !important; bottom:2.08cqw !important; padding:1.15cqw 1.85cqw !important; border-radius:1.1cqw !important; background:#005c81 !important; }
  html body.ml-page main#main#main .ml-sidebar-callout p { color:#fff !important; font-size:.79cqw!important; letter-spacing:.19em!important; line-height:1.2!important; }
  html body.ml-page main#main#main .ml-sidebar-callout strong { display:block !important; margin-top:.5cqw !important; font-size:1.7cqw!important; line-height:1.1!important; letter-spacing:-.035em!important; white-space:nowrap !important; }
  html body.ml-page main#main#main .ml-section-label { position:absolute !important; left:29.75% !important; right:2.5% !important; display:flex !important; align-items:center !important; gap:.8cqw !important; }
  html body.ml-page main#main#main .ml-label-one { top:2.44% !important; }
  html body.ml-page main#main#main .ml-label-two { top:44.92% !important; }
  html body.ml-page main#main#main .ml-section-label h2 { flex:none !important; color:#004189!important; font-size:1.09cqw!important; font-weight:600!important; letter-spacing:.16em!important; line-height:1.15!important; }
  html body.ml-page main#main#main .ml-section-label > span { height:1px !important; flex:1 !important; background:#46b8c6 !important; }
  html body.ml-page main#main#main .ml-panel { position:absolute !important; left:29.037% !important; width:69.076% !important; background:#ffffffed !important; border:1px solid #d0effa !important; border-radius:1.05cqw !important; box-shadow:0 .4cqw .9cqw #2b91ba26 !important; }
  html body.ml-page main#main#main .ml-trigger-panel { top:5.371% !important; height:37.89% !important; }
  html body.ml-page main#main#main .ml-panel-heading { position:absolute !important; left:1.5cqw !important; top:.62cqw !important; font-size:2.24cqw!important; font-weight:900!important; line-height:1.05!important; letter-spacing:-.045em!important; color:#080c50!important; white-space:nowrap !important; }
  html body.ml-page main#main#main .ml-panel-heading > span { font-weight:500!important; }
  html body.ml-page main#main#main .ml-triggers { position:absolute !important; top:3.45cqw !important; left:1.6cqw !important; right:1.35cqw !important; display:grid !important; grid-template-columns:repeat(8,minmax(0,1fr)) !important; gap:1.05cqw !important; }
  html body.ml-page main#main#main .ml-trigger-icon { width:100% !important; border-radius:50% !important; }
  html body.ml-page main#main#main .ml-triggers p { margin-top:.27cqw!important; color:#080c50 !important; font-size:1.27cqw!important; font-weight:700!important; line-height:1.04!important; text-align:center !important; letter-spacing:-.065em!important; }
  html body.ml-page main#main#main .ml-trigger-bracket { position:absolute !important; top:12.13cqw !important; left:5.05cqw !important; right:5.45cqw !important; height:1.43cqw !important; border:1px solid #111e65 !important; border-top:0 !important; border-radius:0 0 .45cqw .45cqw !important; }
  html body.ml-page main#main#main .ml-trigger-bracket > i { position:absolute !important; top:1.05cqw !important; left:50% !important; transform:translateX(-50%) !important; font-size:2cqw !important; color:#111e65 !important; }
  html body.ml-page main#main#main .ml-epidermis { position:absolute !important; left:.72cqw !important; right:.72cqw !important; top:14.5cqw !important; bottom:.55cqw !important; background:#ebddf0 !important; border-radius:1.2cqw !important; overflow:hidden !important; }
  html body.ml-page main#main#main .ml-tissue { position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; aspect-ratio:auto !important; opacity:.65 !important; }
  html body.ml-page main#main#main .ml-tissue > img { height:678.146%!important; }
  html body.ml-page main#main#main .ml-epidermis h4, html body.ml-page main#main#main .ml-epidermis-label { position:absolute !important; top:1.6cqw !important; left:1.1cqw !important; font-size:1.85cqw!important; line-height:1.03!important; font-weight:700!important; color:#0a1155!important; letter-spacing:-.045em!important; }
  html body.ml-page main#main#main .ml-epidermis h4 span, html body.ml-page main#main#main .ml-epidermis-label span { display:block !important; font-size:1.48cqw!important; line-height:1.12!important; }
  html body.ml-page main#main#main .ml-cell-one { position:absolute !important; left:12.2cqw !important; top:.8cqw !important; width:11.33cqw !important; mix-blend-mode:multiply !important; }
  html body.ml-page main#main#main .ml-activation { position:absolute !important; left:27.67cqw !important; top:1.02cqw !important; width:10.95cqw !important; display:grid !important; gap:2.25cqw !important; }
  html body.ml-page main#main#main .ml-activation li, html body.ml-page main#main#main .ml-cascade li { display:flex !important; align-items:center !important; justify-content:center !important; gap:.45cqw !important; position:relative !important; border:1px solid #787180 !important; border-radius:.38cqw !important; background:#fffffff2 !important; color:#0a1155 !important; font-size:1.64cqw!important; line-height:1.1!important; font-weight:700!important; min-height:2.55cqw !important; }
  html body.ml-page main#main#main .ml-activation li + li::before { content:"" !important; position:absolute !important; bottom:100% !important; left:46% !important; width:0 !important; height:2.2cqw !important; border-left:.2cqw solid #0c185c !important; }
  html body.ml-page main#main#main .ml-activation li + li::after { content:"" !important; position:absolute !important; bottom:calc(100% + .05cqw) !important; left:calc(46% - .42cqw) !important; border:.5cqw solid transparent !important; border-top-color:#0c185c !important; border-bottom:0 !important; }
  html body.ml-page main#main#main :is(.ml-up,.ml-down) { display:inline-flex !important; color:#0060e6 !important; font-size:1.47cqw!important; line-height:1!important; vertical-align:middle !important; }
  html body.ml-page main#main#main .ml-panel-connection { position:absolute !important; left:62.5% !important; top:42.45% !important; height:1.5cqw !important; width:.2cqw !important; background:#008798 !important; }
  html body.ml-page main#main#main .ml-panel-connection::after { content:"" !important; position:absolute !important; bottom:0 !important; left:-.28cqw !important; width:.8cqw !important; height:.8cqw !important; border-radius:50% !important; background:#008798 !important; }
  html body.ml-page main#main#main .ml-modulation-panel { top:47.657% !important; height:49.61% !important; }
  html body.ml-page main#main#main .ml-modulation-body { position:absolute !important; left:.72cqw !important; right:.72cqw !important; top:3.25cqw !important; height:21.7cqw !important; border-radius:1.1cqw !important; background:linear-gradient(115deg,#f0ebfb,#f8f5fc) !important; }
  html body.ml-page main#main#main .ml-epidermis-label { top:1.1cqw !important; }
  html body.ml-page main#main#main .ml-cell-two { position:absolute !important; left:5.35cqw !important; top:.85cqw !important; width:15.24cqw !important; mix-blend-mode:multiply !important; clip-path:polygon(0 0,100% 0,100% 100%,39% 100%,39% 60%,0 60%) !important; }
  html body.ml-page main#main#main .ml-signaling { position:absolute !important; left:1.22cqw !important; top:8.3cqw !important; width:9.8cqw !important; padding:.5cqw .3cqw !important; text-align:center !important; border:1px solid #62aabc !important; border-radius:.65cqw !important; background:#d4f0faf2 !important; font-size:1.29cqw!important; line-height:1.15!important; color:#0c145c !important; letter-spacing:-.04em!important; }
  html body.ml-page main#main#main .ml-cascade { position:absolute !important; left:27.97cqw !important; top:-.14cqw !important; width:10.08cqw !important; display:grid !important; gap:.73cqw !important; }
  html body.ml-page main#main#main .ml-cascade li { min-height:2.03cqw !important; font-size:1.37cqw!important; border-radius:.3cqw !important; letter-spacing:-.06em!important; }
  html body.ml-page main#main#main .ml-cascade li + li::before { content:"" !important; position:absolute !important; bottom:100% !important; left:49% !important; height:.73cqw !important; border-left:.16cqw solid #0c185c !important; }
  html body.ml-page main#main#main .ml-cascade li + li::after { content:"" !important; position:absolute !important; bottom:100% !important; left:calc(49% - .3cqw) !important; border:.39cqw solid transparent !important; border-top-color:#0c185c !important; border-bottom:0 !important; }
  html body.ml-page main#main#main .ml-inhibition { position:absolute !important; left:39.8cqw !important; display:flex !important; gap:.9cqw !important; align-items:center !important; }
  html body.ml-page main#main#main .ml-inhibition-one { top:5.6cqw !important; }
  html body.ml-page main#main#main .ml-inhibition-two { top:10.1cqw !important; }
  html body.ml-page main#main#main .ml-inhibition p { width:9.65cqw !important; padding:.35cqw .3cqw !important; border:1px solid #db8c91 !important; border-radius:.4cqw !important; background:#fff4f5 !important; color:#0b1657 !important; text-align:center !important; font-size:1.37cqw!important; font-weight:700!important; line-height:1.15!important; letter-spacing:-.06em!important; }
  html body.ml-page main#main#main .ml-inhibition .ml-up { color:#d5101b !important; }
  html body.ml-page main#main#main .ml-inhibits { position:relative !important; display:block !important; width:5.55cqw !important; margin-top:-1.05cqw !important; color:#c61d26 !important; font-size:1.16cqw!important; font-weight:600 !important; letter-spacing:-.075em!important; }
  html body.ml-page main#main#main .ml-inhibits > span { position:absolute !important; top:1.95cqw !important; left:0 !important; width:5.8cqw !important; border-top:.28cqw solid #d51522 !important; }
  html body.ml-page main#main#main .ml-inhibits > span::before { content:"" !important; position:absolute !important; left:0 !important; top:-.85cqw !important; height:1.65cqw !important; border-left:.35cqw solid #d51522 !important; }
  html body.ml-page main#main#main .ml-melacor-action { position:absolute !important; left:55.75cqw !important; top:3.7cqw !important; width:10.95cqw !important; min-height:10.25cqw !important; padding:1.1cqw .3cqw !important; border:1px solid #558988 !important; border-radius:.6cqw !important; background:#effbfc !important; text-align:center !important; }
  html body.ml-page main#main#main .ml-melacor-action strong { display:block !important; font-size:2.25cqw!important; line-height:1.12!important; font-weight:900!important; letter-spacing:-.055em!important; color:#03453f !important; }
  html body.ml-page main#main#main .ml-melacor-action p { margin-top:.1cqw!important; font-size:1.42cqw!important; color:#111747 !important; line-height:1.17!important; letter-spacing:-.06em!important; }
  html body.ml-page main#main#main .ml-branches { position:absolute !important; left:17.8cqw !important; top:12.75cqw !important; width:31.25cqw !important; display:flex !important; justify-content:space-between !important; }
  html body.ml-page main#main#main .ml-branches > div { width:13.2cqw !important; position:relative !important; text-align:center !important; }
  html body.ml-page main#main#main .ml-branches p { font-size:1.15cqw!important; line-height:1.05!important; color:#151739 !important; }
  html body.ml-page main#main#main .ml-branch-arrow { position:absolute !important; top:.1cqw !important; left:10.2cqw !important; font-size:2.8cqw!important; line-height:.7!important; color:#131854 !important; }
  html body.ml-page main#main#main .ml-branches > div + div .ml-branch-arrow { left:.3cqw !important; }
  html body.ml-page main#main#main .ml-branches strong { display:block !important; margin-top:.65cqw !important; padding:.23cqw !important; border:1px solid #86808c !important; border-radius:.4cqw !important; background:#fff !important; color:#0c1452 !important; font-size:1.36cqw!important; line-height:1.2!important; letter-spacing:-.065em!important; }
  html body.ml-page main#main#main .ml-merge { position:absolute !important; left:27.2cqw !important; top:16.8cqw !important; width:13cqw !important; height:.48cqw !important; border:1px solid #161b61 !important; border-top:0 !important; }
  html body.ml-page main#main#main .ml-merge i { position:absolute !important; left:44% !important; top:.05cqw !important; font-size:1.8cqw !important; }
  html body.ml-page main#main#main .ml-outcome { position:absolute !important; left:15cqw !important; right:14.8cqw !important; bottom:.45cqw !important; display:flex !important; align-items:center !important; justify-content:space-between !important; gap:1.3cqw !important; padding:.4cqw 1.7cqw !important; border:1px solid #bd916b !important; border-radius:.6cqw !important; background:#ffebdb !important; }
  html body.ml-page main#main#main .ml-outcome p { flex:1 !important; padding:.16cqw .7cqw !important; border:1px solid #96928c !important; border-radius:.5cqw !important; background:#fff !important; text-align:center !important; white-space:nowrap !important; font-size:1.42cqw!important; font-weight:700!important; line-height:1.15!important; color:#0a1556 !important; letter-spacing:-.06em!important; }
  html body.ml-page main#main#main .ml-outcome > i { font-size:2.25cqw !important; color:#0e1456 !important; }
  html body.ml-page main#main#main .ml-efficacy { position:absolute !important; left:.78cqw !important; right:.8cqw !important; bottom:.78cqw !important; height:6.5cqw !important; display:flex !important; align-items:center !important; border-radius:.9cqw !important; background:linear-gradient(105deg,#00423f,#00564f 65%,#033e3d) !important; color:#fff !important; overflow:hidden !important; }
  html body.ml-page main#main#main .ml-efficacy h4 { width:39.3% !important; flex:none !important; padding-left:1.3cqw !important; font-size:1.82cqw!important; line-height:1.06!important; font-weight:700!important; letter-spacing:-.065em!important; white-space:nowrap !important; }
  html body.ml-page main#main#main .ml-efficacy ul { border-inline:1px solid #50a29f !important; width:43.2% !important; padding-left:2.1cqw!important; }
  html body.ml-page main#main#main .ml-efficacy li { display:flex !important; align-items:center !important; gap:.8cqw !important; font-size:1.02cqw!important; line-height:1.77!important; letter-spacing:-.025em!important; white-space:nowrap !important; }
  html body.ml-page main#main#main .ml-efficacy li i { font-size:1.65cqw !important; }
  html body.ml-page main#main#main .ml-efficacy-art { position:absolute !important; right:1.2cqw !important; width:9cqw !important; }
  html body.ml-page main#main#main .ml-return { display:flex !important; justify-content:center !important; padding:30px 20px !important; background:#edf8fc !important; border-top:1px solid #c9e8ee !important; }
  html body.ml-page main#main#main .ml-return a { display:inline-flex !important; align-items:center !important; gap:12px !important; color:#10496a !important; font-size:16px !important; font-weight:600 !important; padding:12px 18px !important; border-radius:8px !important; }
  html body.ml-page main#main#main .ml-return a:hover { background:#d8eef6 !important; }
  html body.ml-page main#main#main a:focus-visible { outline:3px solid #007d9d !important; outline-offset:4px !important; }
}

/* Shared foreground gutters; the section backgrounds remain full width. */
@layer melacor-detail {
  html body.ml-page main#main#main.ml-main > .ml-sheet {
    container-type: normal !important;
    max-width: none !important;
    aspect-ratio: auto !important;
    padding-inline: 0 !important;
  }
  html body.ml-page main#main#main .ml-frame {
    --ml-gutter-left: max(24px, var(--arotec-content-left, 0px));
    --ml-gutter-right: max(24px, var(--arotec-content-right, 0px));
    position: relative !important;
    container-type: inline-size !important;
    width: calc(100% - var(--ml-gutter-left) - var(--ml-gutter-right)) !important;
    max-width: 1800px !important;
    aspect-ratio: 1536 / 1024 !important;
    margin-inline: auto !important;
  }
  @media (max-width: 1000px) {
    html body.ml-page main#main#main .ml-frame { aspect-ratio: auto !important; }
  }
  @media (max-width: 700px) {
    html body.ml-page main#main#main .ml-frame {
      --ml-gutter-left: 20px;
      --ml-gutter-right: 20px;
    }
  }
}
/* Native 7.3 content; only the six illustrations are clipped from the supplied artwork. */
@layer melacor-detail {
  html body.ml-page main#main#main .ml-benefits {
    position: relative !important;
    container-type: inline-size !important;
    aspect-ratio: 1536 / 1024 !important;
    overflow: hidden !important;
    isolation: isolate !important;
    background-color: #e8faff !important;
    background-image: linear-gradient(90deg, #8bd9f133 1px, transparent 1px), linear-gradient(#8bd9f133 1px, transparent 1px), radial-gradient(ellipse at 73% 64%, #c9f4ff77, transparent 64%) !important;
    background-size: 7.8% 100%, 100% 15.65%, auto !important;
    color: #063b57 !important;
  }
  html body.ml-page main#main#main .ml-benefits::before {
    content: "" !important;
    position: absolute !important;
    top: 2.93% !important;
    right: 3.58% !important;
    width: 8.99% !important;
    aspect-ratio: 1 !important;
    border: 1px solid #83d6fe !important;
    border-radius: 50% !important;
    z-index: -1 !important;
  }
  html body.ml-page main#main#main .ml-benefits :is(h2,h3,p) {
    margin: 0 !important;
    padding: 0 !important;
    font-family: var(--site-font, "DM Sans", sans-serif) !important;
    text-transform: none !important;
  }
  html body.ml-page main#main#main .ml-benefits-sidebar {
    position: absolute !important;
    left: 2.213542% !important;
    top: 1.269531% !important;
    width: 28.580729% !important;
    height: 95.507813% !important;
    overflow: hidden !important;
    isolation: isolate !important;
    border-radius: 2.408854cqw !important;
    background: linear-gradient(123deg, #002433 4%, #002e42 56%, #00534f 112%) !important;
    box-shadow: 0 .45cqw 1.2cqw #5dd4ee20 !important;
    color: #fff !important;
  }
  html body.ml-page main#main#main .ml-benefits-sidebar::before {
    content: "" !important;
    position: absolute !important;
    top: 3.255208cqw !important;
    right: .585938cqw !important;
    width: 8.463542cqw !important;
    aspect-ratio: 1 !important;
    border: 1px solid #006582 !important;
    border-radius: 50% !important;
    z-index: -1 !important;
  }
  html body.ml-page main#main#main .ml-benefits-sidebar::after {
    content: "" !important;
    position: absolute !important;
    top: 12.5cqw !important;
    right: 6.9cqw !important;
    width: 2.35cqw !important;
    aspect-ratio: 1 !important;
    border: 1px solid #006582 !important;
    border-radius: 50% !important;
    z-index: -1 !important;
  }
  html body.ml-page main#main#main .ml-benefits .ml-benefits-kicker {
    position: absolute !important;
    left: 2.278646cqw !important;
    right: 2.539063cqw !important;
    top: 3.90625cqw !important;
    display: flex !important;
    align-items: center !important;
    gap: .911458cqw !important;
    color: #fff !important;
    font-size: 1.302083cqw !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: .260417cqw !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  html body.ml-page main#main#main .ml-benefits-kicker > span {
    display: block !important;
    flex: 1 !important;
    height: 1px !important;
    background: #4fe7de !important;
  }
  html body.ml-page main#main#main .ml-benefits .ml-benefits-brand {
    position: absolute !important;
    left: 2.278646cqw !important;
    top: 9.244792cqw !important;
    color: #fff !important;
    font-size: 3.90625cqw !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    letter-spacing: -.182292cqw !important;
    white-space: nowrap !important;
  }
  html body.ml-page main#main#main .ml-benefits-brand > sup {
    position: relative !important;
    top: -.18em !important;
    font-size: .35em !important;
    line-height: 0 !important;
    letter-spacing: -.03em !important;
    vertical-align: super !important;
  }
  html body.ml-page main#main#main .ml-benefits-accent {
    position: absolute !important;
    left: 2.408854cqw !important;
    height: .455729cqw !important;
    background: #50e5d1 !important;
    border-radius: .3cqw !important;
  }
  html body.ml-page main#main#main .ml-benefits-accent-first { top: 14.713542cqw !important; width: 7.161458cqw !important; }
  html body.ml-page main#main#main .ml-benefits-accent-second { top: 24.674479cqw !important; width: 8.59375cqw !important; }
  html body.ml-page main#main#main .ml-benefits h2 {
    position: absolute !important;
    left: 2.34375cqw !important;
    top: 16.666667cqw !important;
    color: #fff !important;
    font-size: 2.604167cqw !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    letter-spacing: -.052083cqw !important;
  }
  html body.ml-page main#main#main .ml-benefits .ml-benefits-description {
    position: absolute !important;
    left: 2.34375cqw !important;
    top: 26.5625cqw !important;
    color: #fff !important;
    font-size: 1.5625cqw !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: -.025em !important;
  }
  html body.ml-page main#main#main .ml-benefits-support {
    position: absolute !important;
    top: 40.494792cqw !important;
    left: 2.278646cqw !important;
    width: 24.088542cqw !important;
    height: 7.161458cqw !important;
    border-radius: 1.171875cqw !important;
    padding: 1.497396cqw 1.627604cqw !important;
    background: linear-gradient(110deg, #00735e, #00765cdd) !important;
  }
  html body.ml-page main#main#main .ml-benefits-support p {
    color: #fff !important;
    font-size: .976563cqw !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: .182292cqw !important;
    text-transform: uppercase !important;
  }
  html body.ml-page main#main#main .ml-benefits-support strong {
    display: block !important;
    margin-top: .585938cqw !important;
    color: #fff !important;
    font-size: 2.148438cqw !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -.097656cqw !important;
    white-space: nowrap !important;
  }
  html body.ml-page main#main#main .ml-benefits .ml-benefits-credit {
    position: absolute !important;
    left: 2.408854cqw !important;
    bottom: 2.734375cqw !important;
    color: #fff !important;
    font-size: .911458cqw !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    letter-spacing: .16276cqw !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  html body.ml-page main#main#main .ml-benefits-orbit {
    position: absolute !important;
    z-index: -1 !important;
    left: -4.8cqw !important;
    bottom: -19cqw !important;
    width: 44cqw !important;
    height: 34cqw !important;
    border: 1px solid #11687e !important;
    border-radius: 50% !important;
    transform: rotate(26deg) !important;
  }
  html body.ml-page main#main#main .ml-benefits-orbit::before {
    content: "" !important;
    position: absolute !important;
    inset: -6cqw -2cqw 4.7cqw -2cqw !important;
    border: 1px solid #11687e !important;
    border-radius: 50% !important;
  }
  html body.ml-page main#main#main .ml-benefits-header {
    position: absolute !important;
    left: 33.59375% !important;
    top: 7.421875% !important;
    right: 2.669271% !important;
  }
  html body.ml-page main#main#main .ml-benefits-header p:first-child {
    display: flex !important;
    align-items: center !important;
    gap: 1.171875cqw !important;
    color: #06437c !important;
    font-size: 1.432292cqw !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: .130208cqw !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  html body.ml-page main#main#main .ml-benefits-header p:first-child > span {
    flex: 1 !important;
    height: 1px !important;
    background: #30c4d8 !important;
  }
  html body.ml-page main#main#main .ml-benefits-header p + p {
    margin-top: .716146cqw !important;
    color: #087ca1 !important;
    font-size: 1.302083cqw !important;
    font-weight: 400 !important;
    line-height: 1.25 !important;
    letter-spacing: -.012em !important;
  }
  html body.ml-page main#main#main .ml-benefits-grid {
    position: absolute !important;
    left: 32.291667% !important;
    top: 17.578125% !important;
    width: 65.494792% !important;
    display: grid !important;
    grid-template-columns: 320fr 323fr 337fr !important;
    grid-template-rows: repeat(2, 20.3125cqw) !important;
    gap: 1.302083cqw .846354cqw !important;
  }
  html body.ml-page main#main#main .ml-benefit-card {
    position: relative !important;
    min-width: 0 !important;
    overflow: hidden !important;
    border: 1px solid #a5e6ff !important;
    border-radius: 1.367188cqw !important;
    background: #ffffffed !important;
    box-shadow: 0 .325521cqw .716146cqw #64cae733 !important;
  }
  html body.ml-page main#main#main .ml-benefit-body {
    position: absolute !important;
    inset: 2.473958cqw .78125cqw auto !important;
    height: 12.760417cqw !important;
    border-inline: 1px solid #679da2 !important;
  }
  html body.ml-page main#main#main .ml-benefit-body::before {
    content: "" !important;
    position: absolute !important;
    inset: .520833cqw .585938cqw 0 !important;
    border-top: 1px dotted #55777a !important;
    border-bottom: 1px dotted #55777a !important;
    pointer-events: none !important;
  }
  html body.ml-page main#main#main .ml-benefit-icon {
    position: absolute !important;
    left: .455729cqw !important;
    top: 2.083333cqw !important;
    width: 7.942708cqw !important;
    mix-blend-mode: multiply !important;
  }
  html body.ml-page main#main#main .ml-benefit-radiance .ml-benefit-icon {
    left: .585938cqw !important;
    top: 2.213542cqw !important;
    width: 7.096354cqw !important;
  }
  html body.ml-page main#main#main .ml-benefit-even .ml-benefit-icon { width: 7.682292cqw !important; }
  html body.ml-page main#main#main .ml-benefit-pigmentation .ml-benefit-icon { width: 8.072917cqw !important; }
  html body.ml-page main#main#main .ml-benefit-tyrosinase .ml-benefit-icon { left: .390625cqw !important; top: 1.692708cqw !important; width: 7.747396cqw !important; }
  html body.ml-page main#main#main .ml-benefit-clarity .ml-benefit-icon { left: .390625cqw !important; top: 1.822917cqw !important; }
  html body.ml-page main#main#main .ml-benefit-refinement .ml-benefit-icon { left: .390625cqw !important; top: 1.627604cqw !important; width: 8.138021cqw !important; }
  html body.ml-page main#main#main .ml-benefit-copy {
    position: absolute !important;
    left: 8.463542cqw !important;
    right: .065104cqw !important;
    top: 2.34375cqw !important;
  }
  html body.ml-page main#main#main .ml-benefit-tyrosinase .ml-benefit-copy,
  html body.ml-page main#main#main .ml-benefit-clarity .ml-benefit-copy,
  html body.ml-page main#main#main .ml-benefit-refinement .ml-benefit-copy { top: 2.148438cqw !important; }
  html body.ml-page main#main#main .ml-benefit-copy h3 {
    color: #03452f !important;
    font-size: 1.432292cqw !important;
    font-weight: 700 !important;
    line-height: 1.22 !important;
    letter-spacing: -.058594cqw !important;
  }
  html body.ml-page main#main#main .ml-benefit-copy p {
    margin-top: .651042cqw !important;
    color: #111 !important;
    font-size: 1.171875cqw !important;
    font-weight: 400 !important;
    line-height: 1.24 !important;
    letter-spacing: -.042318cqw !important;
  }
  html body.ml-page main#main#main .ml-benefits .ml-benefit-label {
    position: absolute !important;
    left: 1.432292cqw !important;
    bottom: 1.367188cqw !important;
    color: #00735c !important;
    font-size: 1.171875cqw !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: .104167cqw !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  html body.ml-page main#main#main .ml-benefit-clarity .ml-benefit-label { letter-spacing: .078125cqw !important; }
  html body.ml-page main#main#main .ml-benefits .ml-benefits-summary {
    position: absolute !important;
    left: 32.486979% !important;
    top: 85.9375% !important;
    width: 64.908854% !important;
    height: 6.445313% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .585938cqw !important;
    border: 1px solid #72b9bf !important;
    border-radius: 1.171875cqw !important;
    background: #d3f1eeab !important;
    color: #00735c !important;
    font-size: 1.041667cqw !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    letter-spacing: .097656cqw !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
  @media (max-width: 1000px) {
    html body.ml-page main#main#main .ml-benefits {
      aspect-ratio: auto !important;
      padding: 20px 16px 28px !important;
      background-size: 75px 100%, 100% 120px, auto !important;
    }
    html body.ml-page main#main#main .ml-benefits-sidebar {
      position: relative !important;
      inset: auto !important;
      width: 100% !important;
      height: auto !important;
      padding: 28px 24px 30px !important;
      border-radius: 25px !important;
    }
    html body.ml-page main#main#main .ml-benefits-sidebar::before { width: 125px !important; top: 35px !important; right: 12px !important; }
    html body.ml-page main#main#main .ml-benefits-sidebar::after { width: 38px !important; top: 175px !important; right: 90px !important; }
    html body.ml-page main#main#main .ml-benefits-sidebar :is(.ml-benefits-kicker,.ml-benefits-brand,h2,.ml-benefits-description,.ml-benefits-support,.ml-benefits-credit) {
      position: relative !important;
      inset: auto !important;
    }
    html body.ml-page main#main#main .ml-benefits .ml-benefits-kicker {
      font-size: 14px !important;
      letter-spacing: 3px !important;
      gap: 15px !important;
    }
    html body.ml-page main#main#main .ml-benefits .ml-benefits-brand {
      margin-top: 34px !important;
      font-size: clamp(32px, 8.6vw, 56px) !important;
      letter-spacing: -1.8px !important;
    }
    html body.ml-page main#main#main .ml-benefits-accent { position: relative !important; inset: auto !important; height: 5px !important; border-radius: 5px !important; margin: 22px 0 !important; }
    html body.ml-page main#main#main .ml-benefits-accent-first { width: 88px !important; }
    html body.ml-page main#main#main .ml-benefits-accent-second { width: 108px !important; }
    html body.ml-page main#main#main .ml-benefits h2 { font-size: 32px !important; line-height: 1.15 !important; letter-spacing: -.7px !important; }
    html body.ml-page main#main#main .ml-benefits .ml-benefits-description {
      font-size: 18px !important;
      line-height: 1.5 !important;
      letter-spacing: -.2px !important;
    }
    html body.ml-page main#main#main .ml-benefits-description br { display: none !important; }
    html body.ml-page main#main#main .ml-benefits-support { width: 100% !important; height: auto !important; padding: 18px !important; margin-top: 28px !important; border-radius: 16px !important; }
    html body.ml-page main#main#main .ml-benefits-support p { font-size: 11px !important; letter-spacing: 2px !important; }
    html body.ml-page main#main#main .ml-benefits-support strong { font-size: clamp(20px, 5.5vw, 30px) !important; margin-top: 8px !important; letter-spacing: -.8px !important; }
    html body.ml-page main#main#main .ml-benefits .ml-benefits-credit { font-size: 10px !important; margin-top: 38px !important; letter-spacing: 1.5px !important; }
    html body.ml-page main#main#main .ml-benefits-header { position: relative !important; inset: auto !important; margin: 30px 5px 24px !important; }
    html body.ml-page main#main#main .ml-benefits-header p:first-child { display: block !important; font-size: 17px !important; line-height: 1.45 !important; letter-spacing: 1px !important; white-space: normal !important; }
    html body.ml-page main#main#main .ml-benefits-header p:first-child > span { display: none !important; }
    html body.ml-page main#main#main .ml-benefits-header p + p { margin-top: 10px !important; font-size: 15px !important; line-height: 1.5 !important; letter-spacing: 0 !important; }
    html body.ml-page main#main#main .ml-benefits-grid { position: relative !important; inset: auto !important; width: 100% !important; grid-template-columns: 1fr !important; grid-template-rows: none !important; gap: 16px !important; }
    html body.ml-page main#main#main .ml-benefit-card { min-height: 235px !important; padding: 22px 13px 18px !important; border-radius: 18px !important; }
    html body.ml-page main#main#main .ml-benefit-body { position: relative !important; inset: auto !important; display: flex !important; align-items: center !important; gap: 14px !important; height: auto !important; min-height: 165px !important; padding: 22px 8px !important; }
    html body.ml-page main#main#main .ml-benefit-body::before { inset: 0 8px !important; }
    html body.ml-page main#main#main .ml-benefit-body .ml-benefit-icon { position: relative !important; inset: auto !important; flex: 0 0 36% !important; width: 36% !important; max-width: 125px !important; }
    html body.ml-page main#main#main .ml-benefit-body .ml-benefit-copy { position: relative !important; inset: auto !important; flex: 1 !important; min-width: 0 !important; }
    html body.ml-page main#main#main .ml-benefit-copy h3 { font-size: 20px !important; line-height: 1.22 !important; letter-spacing: -.7px !important; }
    html body.ml-page main#main#main .ml-benefit-copy p { font-size: 15px !important; line-height: 1.4 !important; letter-spacing: -.35px !important; margin-top: 9px !important; }
    html body.ml-page main#main#main .ml-benefit-copy p br { display: none !important; }
    html body.ml-page main#main#main .ml-benefits .ml-benefit-label { position: relative !important; inset: auto !important; margin: 22px 8px 0 !important; font-size: 14px !important; letter-spacing: 1.2px !important; }
    html body.ml-page main#main#main .ml-benefits .ml-benefits-summary { position: relative !important; inset: auto !important; display: block !important; width: 100% !important; height: auto !important; margin-top: 24px !important; padding: 18px 14px !important; border-radius: 15px !important; font-size: 12px !important; letter-spacing: .8px !important; line-height: 1.8 !important; white-space: normal !important; text-align: center !important; }
    html body.ml-page main#main#main .ml-benefits-summary span { margin-inline: 5px !important; }
  }
}


@layer melacor-detail {
  html body.ml-page main#main#main .ml-pathway .ml-sidebar-heading { font-size:2.23cqw!important; letter-spacing:-.055em!important; white-space:nowrap!important; }
  html body.ml-page main#main#main .ml-pathway .ml-brand { font-size:3.5cqw!important; white-space:nowrap!important; }
  @media(min-width:1001px) {
    html body.ml-page main#main#main .ml-benefit-pigmentation .ml-benefit-copy p { font-size:1.07cqw!important; letter-spacing:-.05em!important; }
    html body.ml-page main#main#main .ml-benefit-pigmentation .ml-benefit-copy p br { display:none!important; }
  }
  @media(min-width:600px) and (max-width:1000px) {
    html body.ml-page main#main#main .ml-benefits-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
    html body.ml-page main#main#main .ml-benefits .ml-benefits-sidebar { padding:32px!important; }
  }
  html body.ml-page main#main#main .ml-cell-one { mask-image:radial-gradient(ellipse at 50% 50%,#000 48%,transparent 73%) !important; }
  /* Reuse the filled signal arrows from the supplied scientific artwork. */
  html body.ml-page main#main#main .ml-pathway :is(.ml-up,.ml-down) { width:1.17cqw!important; height:1.66cqw!important; flex:none!important; background-image:url('../images/bio-responsive-melacor/pathway-reference.png')!important; background-size:8084.210526% 3792.592593%!important; background-position:65.985498% 30.391174%!important; mix-blend-mode:multiply!important; }
  html body.ml-page main#main#main .ml-pathway :is(.ml-up,.ml-down) > i { display:none!important; }
  html body.ml-page main#main#main .ml-pathway .ml-down { transform:rotate(180deg)!important; }
  html body.ml-page main#main#main .ml-pathway .ml-inhibition .ml-up { background-position:78.18062% 63.289869%!important; }
  html body.ml-page main#main#main .ml-cell-two { clip-path:polygon(45% 0,100% 0,100% 100%,39% 100%,39% 60%,0 60%,0 29%,43% 29%) !important; mask-image:radial-gradient(ellipse at 53% 50%,#000 46%,transparent 76%) !important; }
  @media (max-width:1000px) {
    html body.ml-page main#main#main .ml-pathway { aspect-ratio:auto !important; overflow:visible !important; padding:24px 20px!important; }
    html body.ml-page main#main#main .ml-pathway-sidebar { position:relative !important; left:auto !important; top:auto !important; width:100% !important; height:auto !important; min-height:0 !important; padding:28px !important; border-radius:24px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-kicker { font-size:15px!important; gap:20px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-brand { font-size:clamp(30px,6.3vw,58px)!important; margin-top:28px!important; letter-spacing:-.045em!important; }
    html body.ml-page main#main#main .ml-pathway .ml-accent-rule { width:96px !important; height:5px !important; margin:20px 0 !important; }
    html body.ml-page main#main#main .ml-pathway .ml-sidebar-heading { font-size:clamp(28px,4.5vw,44px)!important; line-height:1.13!important; letter-spacing:-.035em!important; white-space:normal!important; }
    html body.ml-page main#main#main .ml-pathway .ml-sidebar-subtitle { font-size:24px!important; line-height:1.2!important; margin-top:16px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-sidebar-description { font-size:18px!important; line-height:1.5!important; max-width:660px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-pathway-label { font-size:13px!important; margin-top:24px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:20px !important; margin-top:20px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list li { min-height:95px !important; gap:14px !important; padding-left:0 !important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list li::before { display:none !important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-number { width:38px !important; height:38px !important; font-size:20px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list h3 { font-size:18px!important; white-space:normal !important; padding-top:5px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list p { font-size:16px!important; line-height:1.4!important; margin-top:6px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-sidebar-callout { position:relative !important; left:auto !important; right:auto !important; bottom:auto !important; padding:20px !important; margin-top:20px !important; border-radius:14px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-sidebar-callout p { font-size:12px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-sidebar-callout strong { font-size:26px!important; margin-top:8px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-section-label { position:relative !important; left:auto !important; right:auto !important; top:auto !important; margin:26px 0 14px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-section-label h2 { font-size:13px!important; letter-spacing:.12em!important; line-height:1.5!important; flex:1 !important; }
    html body.ml-page main#main#main .ml-pathway .ml-section-label > span { display:none !important; }
    html body.ml-page main#main#main .ml-pathway .ml-panel { position:relative !important; left:auto !important; top:auto !important; width:100% !important; height:auto !important; border-radius:18px !important; padding:20px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-panel-heading { position:relative !important; left:auto !important; top:auto !important; font-size:clamp(23px,3.5vw,34px)!important; white-space:normal !important; line-height:1.13!important; letter-spacing:-.04em!important; }
    html body.ml-page main#main#main .ml-pathway .ml-triggers { position:relative !important; top:auto !important; left:auto !important; right:auto !important; margin-top:20px!important; gap:20px 16px !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; }
    html body.ml-page main#main#main .ml-pathway .ml-trigger-icon { width:100% !important; max-width:112px !important; margin:auto !important; }
    html body.ml-page main#main#main .ml-pathway .ml-triggers p { font-size:16px!important; margin-top:7px!important; letter-spacing:-.04em!important; line-height:1.1!important; }
    html body.ml-page main#main#main .ml-pathway .ml-trigger-bracket { position:relative !important; top:auto !important; left:auto !important; right:auto !important; margin:16px 20px 22px !important; height:15px !important; border-radius:0 0 8px 8px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-trigger-bracket > i { top:9px !important; font-size:28px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-epidermis { position:relative !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important; height:180px !important; margin-top:10px !important; border-radius:14px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-epidermis h4 { top:15px !important; left:15px !important; font-size:22px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-epidermis h4 span { font-size:17px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-cell-one { top:63px !important; left:10px !important; width:125px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-activation { left:auto !important; right:20px !important; top:24px !important; width:40% !important; max-width:210px !important; gap:32px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-activation li { min-height:42px !important; border-radius:5px !important; font-size:22px!important; gap:6px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-activation li + li::before { height:32px !important; border-left-width:2px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-activation li + li::after { left:calc(46% - 5px) !important; border-width:6px !important; }
    html body.ml-page main#main#main .ml-pathway :is(.ml-up,.ml-down) { font-size:20px!important; }
    html body.ml-page main#main#main .ml-pathway :is(.ml-up,.ml-down) { width:15px!important; height:21px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-panel-connection { display:none !important; }
    html body.ml-page main#main#main .ml-pathway .ml-modulation-body { position:relative !important; left:auto !important; right:auto !important; top:auto !important; height:630px !important; margin-top:20px !important; border-radius:14px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-epidermis-label { top:18px !important; left:18px !important; font-size:22px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-epidermis-label span { font-size:17px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-cell-two { width:180px !important; left:12% !important; top:5px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-signaling { left:auto !important; right:18px !important; top:20px !important; width:145px !important; padding:10px !important; border-radius:8px !important; font-size:17px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-cascade { top:180px !important; left:18px !important; width:36% !important; gap:16px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-cascade li { min-height:34px !important; font-size:18px!important; border-radius:5px !important; gap:2px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-cascade li + li::before { height:16px !important; border-left-width:2px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-cascade li + li::after { left:calc(49% - 4px) !important; border-width:5px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-melacor-action { top:173px !important; left:auto !important; right:16px !important; width:43% !important; min-height:90px !important; padding:10px !important; border-radius:8px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-melacor-action strong { font-size:28px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-melacor-action p { font-size:16px!important; line-height:1.2!important; }
    html body.ml-page main#main#main .ml-pathway .ml-melacor-action p br { display:none !important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibition { left:auto !important; right:16px !important; width:43% !important; display:block !important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibition-one { top:299px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibition-two { top:365px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibition p { width:100% !important; padding:7px 3px !important; font-size:17px!important; border-radius:6px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibits { width:auto !important; position:absolute !important; top:-18px !important; left:0 !important; font-size:12px!important; line-height:1!important; margin:0 !important; letter-spacing:0!important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibits > span { left:-18px !important; top:34px !important; width:15px !important; border-top-width:3px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-inhibits > span::before { top:-9px !important; height:15px !important; border-left-width:3px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-branches { top:450px !important; left:12px !important; right:12px !important; width:auto !important; gap:16px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-branches > div { flex:1 !important; width:auto !important; }
    html body.ml-page main#main#main .ml-pathway .ml-branches p { font-size:14px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-branches strong { padding:7px 3px !important; margin-top:22px !important; font-size:16px!important; border-radius:5px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-branch-arrow { top:20px !important; left:55% !important; font-size:24px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-branches > div + div .ml-branch-arrow { left:28% !important; }
    html body.ml-page main#main#main .ml-pathway .ml-merge { top:522px !important; left:25% !important; width:50% !important; height:10px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-merge i { top:5px !important; font-size:24px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-outcome { bottom:20px !important; left:12px !important; right:12px !important; gap:7px !important; padding:10px 7px !important; border-radius:8px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-outcome p { font-size:15px!important; line-height:1.2!important; white-space:normal !important; padding:5px 1px !important; border-radius:5px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-outcome > i { font-size:22px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-efficacy { position:relative !important; left:auto !important; right:auto !important; bottom:auto !important; height:auto !important; margin-top:14px !important; display:block !important; border-radius:12px !important; padding:20px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-efficacy h4 { width:100% !important; padding:0 !important; font-size:24px!important; white-space:normal !important; }
    html body.ml-page main#main#main .ml-pathway .ml-efficacy ul { margin-top:16px!important; padding:0!important; width:100% !important; border:0 !important; }
    html body.ml-page main#main#main .ml-pathway .ml-efficacy li { font-size:16px!important; line-height:1.4!important; white-space:normal !important; gap:10px !important; margin:10px 0 !important; }
    html body.ml-page main#main#main .ml-pathway .ml-efficacy li i { font-size:22px !important; flex:none !important; }
    html body.ml-page main#main#main .ml-pathway .ml-efficacy-art { display:none !important; }
  }
  @media(max-width:560px) {
    html body.ml-page main#main#main .ml-pathway { padding:16px 12px!important; }
    html body.ml-page main#main#main .ml-pathway .ml-pathway-sidebar { padding:25px 22px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list { grid-template-columns:1fr !important; gap:12px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-step-list li { min-height:88px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-panel { padding:16px 10px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-triggers { grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:18px 7px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-triggers p { font-size:12px!important; letter-spacing:-.03em!important; }
    html body.ml-page main#main#main .ml-pathway .ml-signaling { width:125px !important; font-size:15px!important; right:10px !important; top:73px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-cell-two { width:140px !important; left:0 !important; top:55px !important; }
    html body.ml-page main#main#main .ml-pathway .ml-cascade { left:10px !important; width:39% !important; }
    html body.ml-page main#main#main .ml-pathway .ml-cascade li { font-size:16px!important; letter-spacing:-.06em!important; }
    html body.ml-page main#main#main .ml-pathway .ml-branches strong { font-size:14px!important; white-space:nowrap !important; }
    html body.ml-page main#main#main .ml-pathway .ml-outcome p { font-size:14px!important; }
  }
}


/* Let translated captions wrap within their own diagram panels. */
@layer melacor-detail {
  html body.ml-page main#main#main .ml-pathway .ml-efficacy h4,
  html body.ml-page main#main#main .ml-pathway .ml-sidebar-callout strong {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    min-width: 0 !important;
  }
}