/* Loaded first: scoped important text rules precede the legacy reference layers. */
@layer sleep-health-mobile;
@font-face { font-family:"Sleep Health Diagram"; src:url("../fonts/roboto-condensed/RobotoCondensed-Variable.ttf") format("truetype"); font-weight:100 900; font-display:swap; }
.shm-mobile-diagram { display:none; }
@media (width < 1200px) {
  body.sleep-health-page #main :is(#neurobiology,#biological-burden,#restorative-conditions) > :not(.shm-mobile-diagram) { display:none!important; }
  body.sleep-health-page #main :is(#neurobiology,#biological-burden,#restorative-conditions) { padding:0 0 24px; }
  body.sleep-health-page #main .shm-mobile-diagram { display:block; width:100%; max-width:none; margin:0; background:#fff; color:#173654; }
  .shm-mobile-diagram-actions { padding:14px 24px 0; }
  .shm-mobile-diagram-open, .shm-mobile-diagram-transcript > summary { color:#173654; font:500 14px/1.4 var(--site-font,sans-serif); text-transform:none; letter-spacing:normal; cursor:pointer; min-height:44px; }
  .shm-mobile-diagram-open { background:#fff; border:1px solid #b8c9d9; border-radius:4px; padding:10px 16px; }
  .shm-mobile-diagram-open i { margin-left:12px; }
  .shm-mobile-diagram-transcript { margin-top:8px; }
  .shm-mobile-diagram-transcript > summary { padding-block:12px; }
  .shm-mobile-diagram-text { max-width:1000px; padding-block:12px; }
  .shm-mobile-diagram-text ul, .shm-mobile-diagram-text ol { padding-left:1.25em; margin-block:16px; list-style:disc; }
  .shm-mobile-diagram-text > div > ol { list-style:none; padding-left:0; }
  .shm-mobile-diagram-text br { display:none; }
  .shm-mobile-diagram-text dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
  .shm-burden-text header { margin-bottom:24px; }
  .shm-burden-text .shm-burden-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; list-style:none; padding:0; }
  .shm-burden-grid img { display:block; width:80px; height:80px; object-fit:contain; margin:0 0 12px; }
  .shm-mobile-diagram-open:focus-visible, .shm-mobile-diagram-transcript summary:focus-visible,
  .shm-diagram-dialog button:focus-visible, .shm-diagram-dialog-viewport:focus-visible { outline:3px solid #527eaa; outline-offset:3px; }
  @layer sleep-health-mobile {
    html body.sleep-health-page #main .shm-mobile-diagram-text :is(h2,h3,p,li,a,strong,span,dt,dd) {
      position:static!important; font-family:var(--site-font,sans-serif)!important; font-size:16px!important;
      line-height:1.6!important; letter-spacing:normal!important; color:#173654!important;
      text-transform:none!important; margin:0 0 12px!important; padding:0!important; white-space:normal!important; font-weight:400!important;
    }
    html body.sleep-health-page #main .shm-mobile-diagram-text h2 { font-size:clamp(28px,4vw,44px)!important; line-height:1.15!important; font-weight:600!important; }
    html body.sleep-health-page #main .shm-mobile-diagram-text h3 { font-size:20px!important; line-height:1.3!important; margin-top:24px!important; font-weight:600!important; }
    html body.sleep-health-page #main .shm-mobile-diagram-text :is(dt,strong) { font-weight:600!important; }
    html body.sleep-health-page #main .shm-burden-grid h3 { margin-top:0!important; }
  }
}
@media (width < 600px) {
  .shm-mobile-diagram-text dl, .shm-burden-text .shm-burden-grid { grid-template-columns:1fr; }
}
.shm-mobile-diagram-canvas { position:relative; container-type:inline-size; isolation:isolate; width:100%; aspect-ratio:1672/941; background:#fff; text-align:left; }
.shm-mobile-diagram-canvas > picture, .shm-mobile-diagram-canvas > picture > img { display:block; width:100%; height:100%; margin:0; }
.shm-mobile-diagram-canvas > picture > img { object-fit:contain; }
.shm-mobile-diagram-canvas .shm-map-label { position:absolute; z-index:1; text-align:var(--label-align,left); }
@layer sleep-health-mobile {
  .shm-mobile-diagram-canvas .shm-map-label > :is(h2,h3,p) {
    position:static!important; font-family:"Sleep Health Diagram","Arial Narrow",sans-serif!important;
    font-size:calc(var(--fs)/20.48*1cqw)!important; font-weight:var(--label-weight)!important;
    line-height:1.02!important; letter-spacing:-.02em!important; color:var(--label-color)!important;
    text-transform:none!important; white-space:nowrap!important; text-align:var(--label-align,left)!important;
    margin:0!important; padding:0!important; width:var(--label-width)!important; max-width:none!important; min-height:0!important;
    transform:scaleX(var(--label-scale)); transform-origin:left top; text-wrap:nowrap!important;
  }
  .shm-mobile-diagram-canvas .shm-map-label br { display:initial!important; }
  .shm-mobile-diagram-canvas .shm-map-title > h2 { line-height:.94!important; }
}
body.shm-diagram-is-open { overflow:hidden; }
.shm-diagram-dialog { width:min(1240px,calc(100vw - 24px)); max-width:none; max-height:calc(100dvh - 24px); margin:auto; padding:0; border:1px solid #c7d6e3; border-radius:8px; color:#173654; background:#fff; }
.shm-diagram-dialog::backdrop { background:rgb(7 27 70 / .7); }
.shm-diagram-dialog-toolbar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:12px; border-bottom:1px solid #dce5ed; }
body.sleep-health-page #shm-mobile-diagram-dialog h2.shm-diagram-dialog-title { flex:1 0 100%; font:600 17px/1.35 var(--site-font,sans-serif)!important; letter-spacing:normal!important; margin:0 0 4px!important; }
.shm-diagram-dialog-toolbar button { background:#fff; color:#173654; border:1px solid #b8c9d9; border-radius:4px; padding:10px 12px; min-height:44px; font:500 14px/1.3 var(--site-font,sans-serif); cursor:pointer; }
.shm-diagram-dialog-toolbar button[aria-pressed="true"] { color:#fff; background:#173654; border-color:#173654; }
.shm-diagram-dialog-toolbar button:last-child { margin-left:auto; }
.shm-diagram-dialog-viewport { overflow:auto; max-height:calc(100dvh - 164px); overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.shm-diagram-dialog-canvas { box-sizing:border-box; }
@media (min-width:1200px) { .shm-diagram-dialog { display:none; } }

/* This authored right-hand rail is identified by its unchanged source scene
   and coordinates, so the same correction survives the readable/Fit clone.
   Complete longer orexin labels wrap inside the edge, with small vertical
   reservations before and after; diagram scale and every font remain intact. */
@media (width < 1200px) {
  .shm-mobile-diagram-canvas:has(source[srcset*="neurobiology-800.webp"]) .shm-map-body[style*="left:84.5703125%"] { translate: 0 .6cqw; }
  .shm-mobile-diagram-canvas:has(source[srcset*="neurobiology-800.webp"]) .shm-map-body[style*="left:84.5703125%"][style*="top:28.125%"] { translate: 0 -.4cqw; }
  @layer sleep-health-mobile {
    .shm-mobile-diagram-canvas:has(source[srcset*="neurobiology-800.webp"]) .shm-map-body[style*="left:84.5703125%"][style*="top:28.125%"] > p { white-space: normal !important; text-wrap: wrap !important; overflow-wrap: break-word; width: 100% !important; }
  }
}

/* Keep every locale's glyph proportions. The diagram still scales as a whole;
   labels wrap inside their authored boxes instead of compressing the letters. */
@layer sleep-health-mobile {
  body.sleep-health-page .shm-mobile-diagram-canvas .shm-map-label > :is(h2,h3,p) {
    transform:none!important;
    width:100%!important;
    white-space:normal!important;
    text-wrap:wrap!important;
    overflow-wrap:break-word;
  }
  body.sleep-health-page .shm-mobile-diagram-canvas .shm-map-number > p {
    width:max-content!important; white-space:nowrap!important; text-wrap:nowrap!important;
  }
  /* Expand toward the free side while preserving the leader-line anchor. */
  body.sleep-health-page .shm-mobile-diagram-canvas:has(source[srcset*="neurobiology-800.webp"]) .shm-map-body[style*="left:13.916015625%"] {
    left:5.685546875%!important; width:22%!important;
  }
  body.sleep-health-page .shm-mobile-diagram-canvas:has(source[srcset*="neurobiology-800.webp"]) .shm-map-body[style*="left:31.591796875%"] {
    left:22.806640625%!important; width:16.5%!important;
  }
  body.sleep-health-page .shm-mobile-diagram-canvas .shm-map-heading[style*="left:46.2890625%"][style*="top:65.625%"] {
    left:44.4150390625%!important; width:12%!important;
  }
  body.sleep-health-page .shm-mobile-diagram-canvas .shm-map-heading[style*="left:35.64453125%"][style*="top:82.63888888888889%"] {
    left:25.5%!important; width:50%!important; --label-align:center!important;
    box-sizing:border-box; padding:.18cqw .4cqw; background:rgb(255 255 255 / .94);
  }
  @media (min-width:1200px) {
    body.sleep-health-page #sleep-health :is(.sh-eyebrow,.sh-subtitle),
    body.sleep-health-page #neurobiology :is(.sh-restorative,.sh-arousal) :is(h3,li),
    body.sleep-health-page #neurobiology .sh-network :is(dt,dd),
    body.sleep-health-page #biological-restoration .sh-intro > p,
    body.sleep-health-page #biological-restoration :is(h3,.sh-repair-list p),
    body.sleep-health-page #disrupted-sleep :is(.sh-intro > p,h3,.sh-disruption-list p),
    body.sleep-health-page #biological-burden :is(.sh-intro p,.sh-load-intro h3,.sh-load-intro p,.sh-load-copy h3,.sh-load-copy p,.sh-risk-heading,.sh-risks h3,.sh-risks p),
    body.sleep-health-page #restorative-conditions :is(.sh-intro .sh-subtitle,.sh-intro > p:not(.sh-subtitle),.sh-condition-list h3,.sh-condition-list p,.sh-condition-list strong),
    body.sleep-health-page #multisystem-health :is(#health-title,.sh-intro p) {
      transform:none!important;
    }
    body.sleep-health-page #biological-burden .sh-load-caption {
      transform:rotate(-11deg)!important;
    }
    body.sleep-health-page #biological-burden .sh-systems :is(h3,p),
    body.sleep-health-page #restorative-conditions :is(.sh-regulation,.sh-conditions-outcomes > p) {
      transform:translateX(-50%)!important;
    }
    /* Keep translated copy within the original anchored text groups. */
    body.sleep-health-page #neurobiology :is(.sh-neuro-label,.sh-network) :is(h3,li,dt,dd),
    body.sleep-health-page #biological-restoration .sh-repair-list :is(h3,p),
    body.sleep-health-page #disrupted-sleep .sh-disruption-list :is(h3,p),
    body.sleep-health-page #biological-burden :is(.sh-load-intro,.sh-load-copy,.sh-systems,.sh-risks) :is(h3,p),
    body.sleep-health-page #biological-burden .sh-risk-heading,
    body.sleep-health-page #restorative-conditions .sh-condition-list :is(h3,p,strong),
    body.sleep-health-page #multisystem-health :is(#health-title,.sh-intro p) {
      width:auto!important; max-width:100%!important;
      white-space:normal!important; text-wrap:wrap!important; overflow-wrap:break-word;
    }
    body.sleep-health-page #neurobiology .sh-restorative { width:29cqw!important; }
    body.sleep-health-page #neurobiology .sh-arousal { width:15cqw!important; }
    body.sleep-health-page #neurobiology .sh-arousal ul { width:100%!important; top:4cqw!important; }
    body.sleep-health-page #neurobiology .sh-node-scn { width:17cqw!important; }
    body.sleep-health-page #neurobiology .sh-node-limbic { width:24cqw!important; }
    body.sleep-health-page #neurobiology .sh-node-hypothalamus { width:25cqw!important; }
    body.sleep-health-page #neurobiology .sh-node-autonomic { width:27cqw!important; }
    body.sleep-health-page #neurobiology .sh-node-hpa { width:34cqw!important; }
    body.sleep-health-page #biological-restoration .sh-repair-neural { width:32%!important; }
    body.sleep-health-page #biological-restoration .sh-repair-glymphatic { width:24%!important; }
    body.sleep-health-page #biological-restoration .sh-repair-autonomic { width:34%!important; }
    body.sleep-health-page #biological-restoration .sh-repair-metabolic { width:33%!important; }
    body.sleep-health-page #biological-restoration .sh-repair-immune { width:40%!important; }
    body.sleep-health-page #biological-restoration .sh-repair-heading {
      display:flex!important; align-items:baseline; gap:1cqw; height:auto!important; margin-bottom:1cqw!important;
    }
    body.sleep-health-page #biological-restoration .sh-repair-heading :is(.sh-number,h3) { position:static!important; }
    body.sleep-health-page #biological-restoration .sh-number { flex:none; }
    body.sleep-health-page #disrupted-sleep .sh-disruption-list > li { display:grid!important; gap:.55cqw; }
    body.sleep-health-page #disrupted-sleep .sh-disruption-list :is(.sh-number,h3,p) { position:static!important; }
    body.sleep-health-page #disrupted-sleep .sh-disruption-list .sh-disruption-break { display:none!important; }
    body.sleep-health-page #biological-burden .sh-load-intro { width:13%!important; }
    body.sleep-health-page #biological-burden .sh-load-copy { top:29.2%!important; }
    body.sleep-health-page #biological-burden :is(.sh-load-intro,.sh-load-copy) { display:grid!important; gap:.5cqw; }
    body.sleep-health-page #biological-burden :is(.sh-load-intro,.sh-load-copy) > :is(h3,p) { position:static!important; }
    body.sleep-health-page #biological-burden .sh-load-copy .sh-equation {
      position:absolute!important; top:32.2cqw!important; left:-11.45cqw!important; width:47cqw!important; max-width:none!important;
      box-sizing:border-box; padding:.15cqw .3cqw!important; background:rgb(255 255 255 / .94);
    }
    body.sleep-health-page #biological-burden .sh-systems :is(h3,p) { width:100%!important; }
    body.sleep-health-page #biological-burden .sh-systems p { width:6.3cqw!important; max-width:none!important; }
    body.sleep-health-page #biological-burden .sh-risk-heading { width:22%!important; }
    body.sleep-health-page #biological-burden .sh-risks > li { display:grid!important; grid-template-columns:6.2cqw minmax(0,1fr); column-gap:.9cqw; row-gap:.35cqw; }
    body.sleep-health-page #biological-burden .sh-risks > li { isolation:isolate; }
    body.sleep-health-page #biological-burden .sh-risks > li::before {
      content:""; position:absolute; inset:-.25cqw -.3cqw -.25cqw 6.9cqw;
      background:rgb(255 255 255 / .94); z-index:-1;
    }
    body.sleep-health-page #biological-burden .sh-risks img { grid-column:1; grid-row:1 / 3; }
    body.sleep-health-page #biological-burden .sh-risks :is(h3,p) { position:static!important; grid-column:2; }
    body.sleep-health-page #biological-burden .sh-risk-aging { top:80%!important; }
    body.sleep-health-page #restorative-conditions .sh-condition-list > li { width:29%!important; padding-left:4.7cqw!important; box-sizing:border-box; display:grid!important; gap:.3cqw; }
    body.sleep-health-page #restorative-conditions .sh-condition-list :is(h3,p,strong) { position:static!important; }
    body.sleep-health-page #restorative-conditions .sh-condition-arousal { width:28%!important; }
    body.sleep-health-page #restorative-conditions .sh-condition-context { width:29%!important; }
    body.sleep-health-page #restorative-conditions .sh-condition-timing { top:23%!important; }
    body.sleep-health-page #restorative-conditions .sh-condition-arousal { top:21%!important; }
    body.sleep-health-page #restorative-conditions .sh-condition-context { top:22%!important; }
    /* Uncompressed copy outgrows the bare wall in longer locales. Keep its
       wall anchor and give only the live copy a light reading surface. */
    body.sleep-health-page #multisystem-health .sh-intro {
      width:30%!important; display:grid!important; gap:1.5cqw;
      box-sizing:border-box; padding:.7cqw!important; background:rgb(255 255 255 / .94);
    }
    /* This source-image clip contains only the short decorative divider. */
    body.sleep-health-page #multisystem-health .sh-health-divider { display:none!important; }
    body.sleep-health-page #multisystem-health .sh-intro p { position:static!important; }
    body.sleep-health-page :is(#biological-burden,#restorative-conditions,#multisystem-health) :is(.sh-burden-break,.sh-conditions-break,.sh-health-break) { display:none; }
    body.sleep-health-page #biological-burden .sh-intro { width:65%!important; }
    body.sleep-health-page #biological-burden .sh-intro p { width:100%!important; white-space:normal!important; text-wrap:wrap!important; }
    body.sleep-health-page #restorative-conditions .sh-intro { width:90%!important; display:grid!important; gap:1.1cqw; }
    body.sleep-health-page #restorative-conditions .sh-intro :is(h2,p) { position:static!important; width:auto!important; max-width:100%!important; white-space:normal!important; text-wrap:wrap!important; }
    body.sleep-health-page #sleep-health .sh-hero-copy { top:39%!important; }
    body.sleep-health-page #sleep-architecture :is(.sh-chart-times,.sh-rem-labels) > span {
      box-sizing:border-box; padding:.12em .25em; background:rgb(6 24 49 / .9);
    }
    body.sleep-health-page #sleep-health .sh-subtitle,
    body.sleep-health-page #disrupted-sleep .sh-intro > p,
    body.sleep-health-page #restorative-conditions .sh-conditions-outcomes > p {
      box-sizing:border-box; padding:.15cqw .3cqw!important; background:rgb(255 255 255 / .94);
    }
  }
}