.sc-placeholder{background:color-mix(in srgb,currentColor 8%,transparent);
      border:1px solid color-mix(in srgb,currentColor 50%,transparent);
      border-radius:2px;box-sizing:border-box;overflow:hidden}
    @keyframes sc-shine{0%{background-position:100% 50%}100%{background-position:0% 50%}}
    html.sc-dc-streaming .sc-placeholder,
    html.sc-dc-streaming .sc-interp.sc-missing{position:relative;
      background:color-mix(in srgb,currentColor 5%,transparent);
      border-color:transparent}
    html.sc-dc-streaming .sc-placeholder::before,
    html.sc-dc-streaming .sc-interp.sc-missing::before{content:'';
      position:absolute;inset:0;pointer-events:none;
      background:linear-gradient(90deg,rgba(217,119,87,0) 25%,rgba(247,225,211,.95) 37%,rgba(217,119,87,0) 63%);
      background-size:400% 100%;animation:sc-shine 1.4s ease infinite}
    html.sc-dc-streaming .sc-placeholder:nth-child(n+9 of .sc-placeholder)::before,
    html.sc-dc-streaming .sc-interp.sc-missing:nth-child(n+9 of .sc-interp.sc-missing)::before{animation:none;
      background:color-mix(in srgb,currentColor 8%,transparent)}
    .sc-placeholder-error{padding:4px 8px;font:11px/1.4 ui-monospace,monospace;
      color:color-mix(in srgb,currentColor 70%,transparent);word-break:break-word}
    .sc-interp.sc-missing{display:inline-block;width:2em;height:1em;overflow:hidden;
      vertical-align:text-bottom;background:rgba(255,255,255,.3);border:1px solid rgba(0,0,0,.5);
      border-radius:2px;box-sizing:border-box;color:transparent;
      user-select:none}
    .sc-interp.sc-unresolved{font-family:ui-monospace,monospace;font-size:.85em;
      color:color-mix(in srgb,currentColor 50%,transparent);
      background:color-mix(in srgb,currentColor 10%,transparent);border-radius:3px;
      padding:0 3px}
    .sc-host.sc-has-error{position:relative}
    .sc-logic-error{position:absolute;top:8px;left:8px;z-index:2147483647;max-width:60ch;
      padding:6px 10px;background:#b00020;color:#fff;font:12px/1.4 ui-monospace,monospace;
      border-radius:4px;white-space:pre-wrap;pointer-events:none}
    /* Mirrors PRINT_BASELINE_CSS in apps/web deck-stage-export.ts — keep both
       in sync until dc-runtime regains a build step. */
    @media print {
      @page { margin: 0.5cm; }
      figure, table { break-inside: avoid; }
      #dc-root, #dc-root > .sc-host { height: auto; }
      *, *::before, *::after {
        print-color-adjust: exact; -webkit-print-color-adjust: exact;
        backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
        animation-delay: -99s !important; animation-duration: .001s !important;
        animation-iteration-count: 1 !important; animation-fill-mode: both !important;
        animation-play-state: running !important; transition-duration: 0s !important;
      }
    }
  
x-dc{display:none!important}

html,body{height:100%;margin:0}#dc-root,#dc-root>.sc-host{height:100%}
/* ============================================================
   Dreem Health — Webfonts
   ------------------------------------------------------------
   The 2026 charter names two faces: Plantin Infant MT Std for
   headers and titles, Satoshi for everything else. The Brand
   Center publishes its own Google alternatives for both, so the
   substitutes below are brand-sanctioned, not invented:
     Plantin Infant MT Std → Crimson Text
     Satoshi               → Inter
   Satoshi itself is served free from Fontshare, so it loads in
   its real form; Plantin is licensed (the .zip lives in the
   Brand Center) — drop the .woff2 into assets/fonts and add an
   @font-face rule to use the real face.
   ============================================================ */

/* Satoshi — body, UI, labels (real brand font via Fontshare) */
/* Satoshi */
@font-face {
  font-family: 'Satoshi';
  src: url("749aef57-93f9-497d-8b89-22861dfc8651.woff2") format('woff2'),
       url("d4fd4d61-96ff-4ca7-b1ae-9c139e0555ec.woff") format('woff'),
       url("8158bd96-be66-4547-aa4c-ac4ce28cb3d6.ttf") format('truetype');
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("50a30c61-cc8b-4c3f-9c7f-58fe1c59d8e3.woff2") format('woff2'),
       url("23371e14-4999-43ce-aa80-5f220818a631.woff") format('woff'),
       url("924707c5-8c0b-4f7b-ab7e-3367bca0fc86.ttf") format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("071088e7-b0d6-4c06-a0df-c73e1dbb21ce.woff2") format('woff2'),
       url("bd425921-c834-4f30-9d9b-953934da1359.woff") format('woff'),
       url("8b509ca2-d5f0-41f6-a17c-a7f2149b2c3e.ttf") format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("5fee3d69-f9bb-45db-840b-deed540e0851.woff2") format('woff2'),
       url("cd379822-5a76-4ba3-ac67-2d8f3105f289.woff") format('woff'),
       url("3c0c044f-d1c8-4100-878f-83cf96abb2b6.ttf") format('truetype');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("ba9a4536-f34f-4942-a6df-32fbb0cc15c2.woff2") format('woff2'),
       url("6c766a46-45cc-407d-9c9f-18380b55ed2e.woff") format('woff'),
       url("a66143f8-fbe7-4824-8435-cd98551e6e2a.ttf") format('truetype');
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}




/* Crimson Text ← Plantin Infant MT Std (headers & titles)
   Inter        ← Satoshi fallback
   Sacramento   → signatures; no script face is defined in the
                  2026 charter, kept for components/chat/Signature. */
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("9e8f3461-11ad-4050-9fde-ec3d9ff84cc3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("8c4e2ec3-c064-4def-b3ca-c7c81e462154.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("65cbc288-af2c-422a-aeac-9b776f62f6a0.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("aafdf55f-8ef0-4e6f-8199-6d4f2bd7bd00.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("282b6408-b19a-476e-95ea-328276b39a82.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("3eda050b-c4f1-4183-a33c-24911629f4a9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("369aa9b1-cfe0-44c0-9c7f-8afd654f367d.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("17d88948-031c-452d-a802-5d7e838f8a07.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("5805837f-bf15-422f-9af5-d075a95aa7f2.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("13b9c5df-b434-43cd-8f25-79ece45ed53b.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("bd2a3ed8-cf26-418d-a1f4-649e101c07f4.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("f6945f92-4ded-4424-b90e-2d70c89faa1a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Sacramento';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("f2e201e5-2b55-4d2e-b3f7-48eb669a10d2.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Sacramento';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("bec12e0d-030b-441e-bd3a-3d3a125b4e1b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ============================================================
   Dreem Health — Color tokens
   Source of truth: Notion "Dreem Health: Brand Center"
   (Growth / Brand Hub), 2026 brand refresh.
   Base palette + semantic aliases. Dark-mode overrides mirror
   the Figma Variables "Colors" collection (Dark mode).
   ============================================================ */

:root {
  /* — Primary ————————————————————————————— */
  --dh-blue: #2A195A;          /* Purple Blue (Reliable) — core brand ink */
  --dh-yellow: #FFDD85;        /* Sun Yellow (Energy) — signature accent */
  --dh-beige: #F0E5DD;         /* Soft Beige (Clarity) — warm surface */
  --dh-white: #FFFFFF;

  /* — Secondary ——————————————————————————— */
  --dh-sky: #95C8E9;           /* Sky Blue (Clinical) */
  --dh-mandarine: #FFB17B;     /* Mandarine (Warmth) */
  --dh-mint: #9BBCA2;          /* Mint Green (Soothing) */

  /* — Neutrals ————————————————————————————— */
  --dh-eggshell: #FBF8F6;      /* app / page background; also the white logo fill */

  /* — Shades of Blue (the neutral ramp; warm-cool violet-grey) — */
  --dh-blue-70: #54477B;
  --dh-blue-50: #746994;
  --dh-blue-40: #978FAE;
  --dh-blue-35: #B4AEC5;
  --dh-blue-20: #DDDAE5;
  --dh-blue-10: #EAE8EF;

  /* — Tints of the accents ——————————————————
     Mixed toward white at 15 / 30 / 45 / 70%; the Brand Center
     publishes the base hue only. */
  --dh-yellow-50: #FFE297;
  --dh-yellow-35: #FFE7AA;
  --dh-yellow-20: #FFECBC;
  --dh-yellow-10: #FFF5DA;

  --dh-mandarine-50: #FFBD8F;
  --dh-mandarine-35: #FFC8A3;
  --dh-mandarine-20: #FFD4B6;
  --dh-mandarine-10: #FFE8D8;

  --dh-sky-20: #C5E1F3;
  --dh-sky-10: #DFEFF8;

  --dh-mint-20: #C9DBCE;
  --dh-mint-10: #E4EDE7;

  /* — Categories / misc ————————————————————— */
  --dh-category-blue: #CEE4FF;

  /* — Status ———————————————————————————————
     Functional, outside the brand charter. */
  --dh-success: #34C69A;
  --dh-caution: #DAA300;
  --dh-warning: #FF8B57;
  --dh-critical: #CC4858;
  --dh-critical-bg: #FFE3E7;

  /* — Shades of Green (legacy illustration ramp, outside the charter) — */
  --dh-green-50: #56B380;
  --dh-green-35: #6BC79B;
  --dh-green-20: #89D2AF;
  --dh-green-10: #DCF1E7;

  /* ==========================================================
     SEMANTIC ALIASES — reference these in components
     ========================================================== */

  /* Text (the Figma "Colors" ramp: Intense / High / Medium / Low) */
  --text-intense: var(--dh-blue);   /* headlines, primary ink  (rgb 42,25,90)  */
  --text-high: var(--dh-blue-70);   /* body strong             (rgb 84,71,123) */
  --text-medium: var(--dh-blue-50); /* secondary / muted       (rgb 122,113,166) */
  --text-low: var(--dh-blue-40);    /* placeholder / disabled  */
  --text-on-dark: var(--dh-white);
  --text-link: var(--dh-blue);
  --text-danger: var(--dh-critical);

  /* Surfaces */
  --surface-page: var(--dh-eggshell);
  --surface-card: var(--dh-white);
  --surface-warm: var(--dh-beige);
  --surface-raised: var(--dh-white);
  --surface-sunken: var(--dh-blue-10);

  /* Borders / lines */
  --border-subtle: var(--dh-blue-20);   /* rgb 221,218,229 */
  --border-default: var(--dh-blue-35);
  --border-strong: var(--dh-blue-50);
  --divider: var(--dh-blue-20);

  /* Accents */
  --accent-primary: var(--dh-yellow);       /* the app icon's own accent */
  --accent-warm: var(--dh-mandarine);
  --accent-clinical: var(--dh-sky);
  --accent-calm: var(--dh-mint);
  --accent-highlight: var(--dh-yellow-20);  /* text highlighter */

  /* Interactive fills */
  --fill-primary: var(--dh-blue);
  --fill-primary-press: #1B0F44;
  --fill-secondary: var(--dh-blue-10);
  --focus-ring: var(--dh-sky);
}

/* ==========================================================
   Dark mode — from Figma Variables "Colors" (Dark)
   ========================================================== */
:root[data-theme="dark"], .dh-dark {
  --surface-page: #170A3D;
  --surface-card: #2A195A;
  --surface-raised: #2A195A;
  --surface-sunken: #3D2D6E;

  --text-intense: #FFFFFF;
  --text-high: #D0C5F0;
  --text-medium: #A199D7;
  --text-low: #8981B9;

  --border-subtle: #3D2D6E;
  --border-default: #4A3B7A;
  --divider: #3D2D6E;

  --fill-secondary: #3D2D6E;
}

/* ============================================================
   Dreem Health — Typography tokens
   Type scale transcribed from the Figma "Text styles" pages
   (Web + Mobile). Per the 2026 charter: Plantin Infant MT Std
   ("very elegant and clinical") carries headers and titles,
   Satoshi carries body, UI and labels.
   ============================================================ */

:root {
  /* — Font families ———————————————————————— */
  --font-display: "Plantin Infant MT Std", "Crimson Text", Georgia, "Times New Roman", serif;
  --font-body: "Satoshi", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-label: var(--font-body);      /* UI/button labels — Satoshi */
  --font-geometric: var(--font-body);  /* small captions — Satoshi */
  --font-signature: "Sacramento", "Segoe Script", cursive;  /* outside the charter */

  /* — Weights ——————————————————————————————— */
  --fw-light: 300;    /* @kind font */
  --fw-regular: 400;  /* @kind font */
  --fw-medium: 500;   /* @kind font */
  --fw-bold: 700;     /* @kind font */
  --fw-black: 900;    /* @kind font */

  /* — Type scale (font-size / line-height) ———
     Sizes are unchanged from the Figma scale. H1–H4 are display
     (serif); H5/H6 stay on --font-body, where the UI reads better
     at small sizes. The charter publishes no heading weights — the
     Plantin specimen sets titles at regular, so the large sizes
     drop from Satoshi's 700 to 400. */
  --text-h1-size: 56px;   --text-h1-lh: 68px;   --text-h1-weight: 400;
  --text-h2-size: 46px;   --text-h2-lh: 56px;   --text-h2-weight: 400;
  --text-h3-size: 36px;   --text-h3-lh: 43px;   --text-h3-weight: 400;
  --text-h4-size: 26px;   --text-h4-lh: 32px;   --text-h4-weight: 600;
  --text-h5-size: 20px;   --text-h5-lh: 26px;   --text-h5-weight: 600;
  --text-h6-size: 18px;   --text-h6-lh: 23px;   --text-h6-weight: 500;

  /* Body — Satoshi */
  --text-body-size: 16px;      --text-body-lh: 21px;   --text-body-weight: 500;
  --text-body-strong-weight: 600;
  --text-body-sm-size: 15px;   --text-body-sm-lh: 22px;
  --text-body-xs-size: 12px;   --text-body-xs-lh: 18px;

  /* Overline / labels */
  --text-overline-size: 14px;  --text-overline-lh: 20px;  --text-overline-weight: 500;
  --text-overline-tracking: 0.04em;

  /* Numbers / big display (Satoshi Light/Black used on stats) */
  --text-stat-size: 82px;      --text-stat-lh: 86px;
}

/* ============================================================
   Dreem Health — Spacing, radius, elevation, motion
   Radii transcribed from source: buttons pill (100) / small 25;
   cards ~27; inner tiles ~11. Spacing follows the observed
   8-based rhythm with the exact off-grid values the file uses.
   ============================================================ */

:root {
  /* — Spacing ——————————————————————————————— */
  --space-2: 2px;
  --space-4: 4px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;

  /* — Radius ———————————————————————————————— */
  --radius-sm: 8px;
  --radius-md: 11px;      /* inner tiles / small chips */
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-2xl: 27px;     /* cards (26.7 in source) */
  --radius-3xl: 32px;
  --radius-pill: 100px;   /* buttons, chips, avatars */
  --radius-pill-sm: 25px; /* small buttons */
  --radius-round: 9999px;

  /* — Elevation ————————————————————————————— */
  /* soft, warm violet-tinted shadows — never hard black */
  --shadow-sm: 0 2px 8px rgba(42, 25, 90, 0.06);
  --shadow-md: 0 8px 24px rgba(42, 25, 90, 0.08);
  --shadow-lg: 0 16px 40px rgba(42, 25, 90, 0.10);
  --shadow-pink: 0 10px 30px rgba(255, 135, 149, 0.30);

  /* — Motion ———————————————————————————————— */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);   /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms;   /* @kind other */
  --dur-base: 200ms;   /* @kind other */
  --dur-slow: 320ms;   /* @kind other */

  /* — Button metrics (from source) —————————— */
  --btn-lg-h: 60px;   --btn-lg-pad: 20px 28px;   /* @kind spacing */
  --btn-md-h: 52px;   --btn-md-pad: 16px 24px;   /* @kind spacing */
  --btn-sm-h: 44px;   --btn-sm-pad: 12px 20px;   /* @kind spacing */
}

/* Generated from Figma Variables. First mode = :root default.
   FLOAT tokens are unitless — multiply by 1px in calc() where a length is needed.
   NOTE: --accent-accent-yellow carries the 2026 Sun Yellow (#FFDD85) from the
   Brand Center, not the rgb(255,225,136) the (not yet re-exported) Figma file
   still holds. Every other value is verbatim. */

:root {
  --accent-accent-yellow: rgb(255,221,133); /* @kind color */
  --amount: 0; /* @kind other */
  --background-1-2: rgb(255,255,255); /* @kind color */
  --background-1: rgb(255,255,255); /* @kind color */
  --background: rgb(251,248,246); /* @kind color */
  --categories-blue: rgb(206,228,255); /* @kind color */
  --high-2: rgb(84,71,123); /* @kind color */
  --high: rgb(84,71,123); /* @kind color */
  --intense-2: rgb(42,25,90); /* @kind color */
  --intense: rgb(42,25,90); /* @kind color */
  --low-2: rgb(221,218,229); /* @kind color */
  --low: rgb(221,218,229); /* @kind color */
  --medium-1: rgb(150,143,171); /* @kind color */
  --medium-2: rgb(116,105,148); /* @kind color */
}

:root[data-theme="dark"], .dark {
  --accent-accent-yellow: rgb(255,221,133); /* @kind color */
  --background-1-2: rgb(42,25,90); /* @kind color */
  --background-1: rgb(42,25,90); /* @kind color */
  --background: rgb(23,10,61); /* @kind color */
  --categories-blue: rgb(206,228,255); /* @kind color */
  --high-2: rgb(208,197,240); /* @kind color */
  --high: rgb(208,197,240); /* @kind color */
  --intense-2: rgb(255,255,255); /* @kind color */
  --intense: rgb(255,255,255); /* @kind color */
  --low-2: rgb(61,45,110); /* @kind color */
  --low: rgb(61,45,110); /* @kind color */
  --medium-1: rgb(137,129,185); /* @kind color */
  --medium-2: rgb(161,153,215); /* @kind color */
}

/* ============================================================
   Dreem Health Design System — global entry point.
   Consumers link THIS file. It is an import manifest only.
   ============================================================ */

/* ============================================================
   Dreem Health — Webfonts
   ------------------------------------------------------------
   The 2026 charter names two faces: Plantin Infant MT Std for
   headers and titles, Satoshi for everything else. The Brand
   Center publishes its own Google alternatives for both, so the
   substitutes below are brand-sanctioned, not invented:
     Plantin Infant MT Std → Crimson Text
     Satoshi               → Inter
   Satoshi itself is served free from Fontshare, so it loads in
   its real form; Plantin is licensed (the .zip lives in the
   Brand Center) — drop the .woff2 into assets/fonts and add an
   @font-face rule to use the real face.
   ============================================================ */

/* Satoshi — body, UI, labels (real brand font via Fontshare) */
/* Satoshi */
@font-face {
  font-family: 'Satoshi';
  src: url("749aef57-93f9-497d-8b89-22861dfc8651.woff2") format('woff2'),
       url("d4fd4d61-96ff-4ca7-b1ae-9c139e0555ec.woff") format('woff'),
       url("8158bd96-be66-4547-aa4c-ac4ce28cb3d6.ttf") format('truetype');
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("50a30c61-cc8b-4c3f-9c7f-58fe1c59d8e3.woff2") format('woff2'),
       url("23371e14-4999-43ce-aa80-5f220818a631.woff") format('woff'),
       url("924707c5-8c0b-4f7b-ab7e-3367bca0fc86.ttf") format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("071088e7-b0d6-4c06-a0df-c73e1dbb21ce.woff2") format('woff2'),
       url("bd425921-c834-4f30-9d9b-953934da1359.woff") format('woff'),
       url("8b509ca2-d5f0-41f6-a17c-a7f2149b2c3e.ttf") format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("5fee3d69-f9bb-45db-840b-deed540e0851.woff2") format('woff2'),
       url("cd379822-5a76-4ba3-ac67-2d8f3105f289.woff") format('woff'),
       url("3c0c044f-d1c8-4100-878f-83cf96abb2b6.ttf") format('truetype');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Satoshi';
  src: url("ba9a4536-f34f-4942-a6df-32fbb0cc15c2.woff2") format('woff2'),
       url("6c766a46-45cc-407d-9c9f-18380b55ed2e.woff") format('woff'),
       url("a66143f8-fbe7-4824-8435-cd98551e6e2a.ttf") format('truetype');
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}




/* Crimson Text ← Plantin Infant MT Std (headers & titles)
   Inter        ← Satoshi fallback
   Sacramento   → signatures; no script face is defined in the
                  2026 charter, kept for components/chat/Signature. */
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("9e8f3461-11ad-4050-9fde-ec3d9ff84cc3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("8c4e2ec3-c064-4def-b3ca-c7c81e462154.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("65cbc288-af2c-422a-aeac-9b776f62f6a0.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("aafdf55f-8ef0-4e6f-8199-6d4f2bd7bd00.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("282b6408-b19a-476e-95ea-328276b39a82.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("3eda050b-c4f1-4183-a33c-24911629f4a9.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("369aa9b1-cfe0-44c0-9c7f-8afd654f367d.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("17d88948-031c-452d-a802-5d7e838f8a07.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("5805837f-bf15-422f-9af5-d075a95aa7f2.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* vietnamese */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("13b9c5df-b434-43cd-8f25-79ece45ed53b.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("bd2a3ed8-cf26-418d-a1f4-649e101c07f4.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("f6945f92-4ded-4424-b90e-2d70c89faa1a.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("d551d75c-7b06-4184-8d5a-7abf1070021f.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("4f9f71ca-8322-4050-9bb7-42efcb9824ee.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("cd248f32-51de-4970-aaf9-8f63d710ae23.woff2") format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("6b12f816-8622-44a3-ba81-f6a38d449e6e.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("991aa0b7-a2af-411e-a605-22b32e193ea3.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("05daf130-845a-4ad4-b47f-b3ca596b8959.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("77bb73f0-6791-4aa5-bf79-e694790a7c2c.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Sacramento';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("f2e201e5-2b55-4d2e-b3f7-48eb669a10d2.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Sacramento';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("bec12e0d-030b-441e-bd3a-3d3a125b4e1b.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ============================================================
   Dreem Health — Color tokens
   Source of truth: Notion "Dreem Health: Brand Center"
   (Growth / Brand Hub), 2026 brand refresh.
   Base palette + semantic aliases. Dark-mode overrides mirror
   the Figma Variables "Colors" collection (Dark mode).
   ============================================================ */

:root {
  /* — Primary ————————————————————————————— */
  --dh-blue: #2A195A;          /* Purple Blue (Reliable) — core brand ink */
  --dh-yellow: #FFDD85;        /* Sun Yellow (Energy) — signature accent */
  --dh-beige: #F0E5DD;         /* Soft Beige (Clarity) — warm surface */
  --dh-white: #FFFFFF;

  /* — Secondary ——————————————————————————— */
  --dh-sky: #95C8E9;           /* Sky Blue (Clinical) */
  --dh-mandarine: #FFB17B;     /* Mandarine (Warmth) */
  --dh-mint: #9BBCA2;          /* Mint Green (Soothing) */

  /* — Neutrals ————————————————————————————— */
  --dh-eggshell: #FBF8F6;      /* app / page background; also the white logo fill */

  /* — Shades of Blue (the neutral ramp; warm-cool violet-grey) — */
  --dh-blue-70: #54477B;
  --dh-blue-50: #746994;
  --dh-blue-40: #978FAE;
  --dh-blue-35: #B4AEC5;
  --dh-blue-20: #DDDAE5;
  --dh-blue-10: #EAE8EF;

  /* — Tints of the accents ——————————————————
     Mixed toward white at 15 / 30 / 45 / 70%; the Brand Center
     publishes the base hue only. */
  --dh-yellow-50: #FFE297;
  --dh-yellow-35: #FFE7AA;
  --dh-yellow-20: #FFECBC;
  --dh-yellow-10: #FFF5DA;

  --dh-mandarine-50: #FFBD8F;
  --dh-mandarine-35: #FFC8A3;
  --dh-mandarine-20: #FFD4B6;
  --dh-mandarine-10: #FFE8D8;

  --dh-sky-20: #C5E1F3;
  --dh-sky-10: #DFEFF8;

  --dh-mint-20: #C9DBCE;
  --dh-mint-10: #E4EDE7;

  /* — Categories / misc ————————————————————— */
  --dh-category-blue: #CEE4FF;

  /* — Status ———————————————————————————————
     Functional, outside the brand charter. */
  --dh-success: #34C69A;
  --dh-caution: #DAA300;
  --dh-warning: #FF8B57;
  --dh-critical: #CC4858;
  --dh-critical-bg: #FFE3E7;

  /* — Shades of Green (legacy illustration ramp, outside the charter) — */
  --dh-green-50: #56B380;
  --dh-green-35: #6BC79B;
  --dh-green-20: #89D2AF;
  --dh-green-10: #DCF1E7;

  /* ==========================================================
     SEMANTIC ALIASES — reference these in components
     ========================================================== */

  /* Text (the Figma "Colors" ramp: Intense / High / Medium / Low) */
  --text-intense: var(--dh-blue);   /* headlines, primary ink  (rgb 42,25,90)  */
  --text-high: var(--dh-blue-70);   /* body strong             (rgb 84,71,123) */
  --text-medium: var(--dh-blue-50); /* secondary / muted       (rgb 122,113,166) */
  --text-low: var(--dh-blue-40);    /* placeholder / disabled  */
  --text-on-dark: var(--dh-white);
  --text-link: var(--dh-blue);
  --text-danger: var(--dh-critical);

  /* Surfaces */
  --surface-page: var(--dh-eggshell);
  --surface-card: var(--dh-white);
  --surface-warm: var(--dh-beige);
  --surface-raised: var(--dh-white);
  --surface-sunken: var(--dh-blue-10);

  /* Borders / lines */
  --border-subtle: var(--dh-blue-20);   /* rgb 221,218,229 */
  --border-default: var(--dh-blue-35);
  --border-strong: var(--dh-blue-50);
  --divider: var(--dh-blue-20);

  /* Accents */
  --accent-primary: var(--dh-yellow);       /* the app icon's own accent */
  --accent-warm: var(--dh-mandarine);
  --accent-clinical: var(--dh-sky);
  --accent-calm: var(--dh-mint);
  --accent-highlight: var(--dh-yellow-20);  /* text highlighter */

  /* Interactive fills */
  --fill-primary: var(--dh-blue);
  --fill-primary-press: #1B0F44;
  --fill-secondary: var(--dh-blue-10);
  --focus-ring: var(--dh-sky);
}

/* ==========================================================
   Dark mode — from Figma Variables "Colors" (Dark)
   ========================================================== */
:root[data-theme="dark"], .dh-dark {
  --surface-page: #170A3D;
  --surface-card: #2A195A;
  --surface-raised: #2A195A;
  --surface-sunken: #3D2D6E;

  --text-intense: #FFFFFF;
  --text-high: #D0C5F0;
  --text-medium: #A199D7;
  --text-low: #8981B9;

  --border-subtle: #3D2D6E;
  --border-default: #4A3B7A;
  --divider: #3D2D6E;

  --fill-secondary: #3D2D6E;
}

/* ============================================================
   Dreem Health — Typography tokens
   Type scale transcribed from the Figma "Text styles" pages
   (Web + Mobile). Per the 2026 charter: Plantin Infant MT Std
   ("very elegant and clinical") carries headers and titles,
   Satoshi carries body, UI and labels.
   ============================================================ */

:root {
  /* — Font families ———————————————————————— */
  --font-display: "Plantin Infant MT Std", "Crimson Text", Georgia, "Times New Roman", serif;
  --font-body: "Satoshi", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-label: var(--font-body);      /* UI/button labels — Satoshi */
  --font-geometric: var(--font-body);  /* small captions — Satoshi */
  --font-signature: "Sacramento", "Segoe Script", cursive;  /* outside the charter */

  /* — Weights ——————————————————————————————— */
  --fw-light: 300;    /* @kind font */
  --fw-regular: 400;  /* @kind font */
  --fw-medium: 500;   /* @kind font */
  --fw-bold: 700;     /* @kind font */
  --fw-black: 900;    /* @kind font */

  /* — Type scale (font-size / line-height) ———
     Sizes are unchanged from the Figma scale. H1–H4 are display
     (serif); H5/H6 stay on --font-body, where the UI reads better
     at small sizes. The charter publishes no heading weights — the
     Plantin specimen sets titles at regular, so the large sizes
     drop from Satoshi's 700 to 400. */
  --text-h1-size: 56px;   --text-h1-lh: 68px;   --text-h1-weight: 400;
  --text-h2-size: 46px;   --text-h2-lh: 56px;   --text-h2-weight: 400;
  --text-h3-size: 36px;   --text-h3-lh: 43px;   --text-h3-weight: 400;
  --text-h4-size: 26px;   --text-h4-lh: 32px;   --text-h4-weight: 600;
  --text-h5-size: 20px;   --text-h5-lh: 26px;   --text-h5-weight: 600;
  --text-h6-size: 18px;   --text-h6-lh: 23px;   --text-h6-weight: 500;

  /* Body — Satoshi */
  --text-body-size: 16px;      --text-body-lh: 21px;   --text-body-weight: 500;
  --text-body-strong-weight: 600;
  --text-body-sm-size: 15px;   --text-body-sm-lh: 22px;
  --text-body-xs-size: 12px;   --text-body-xs-lh: 18px;

  /* Overline / labels */
  --text-overline-size: 14px;  --text-overline-lh: 20px;  --text-overline-weight: 500;
  --text-overline-tracking: 0.04em;

  /* Numbers / big display (Satoshi Light/Black used on stats) */
  --text-stat-size: 82px;      --text-stat-lh: 86px;
}

/* ============================================================
   Dreem Health — Spacing, radius, elevation, motion
   Radii transcribed from source: buttons pill (100) / small 25;
   cards ~27; inner tiles ~11. Spacing follows the observed
   8-based rhythm with the exact off-grid values the file uses.
   ============================================================ */

:root {
  /* — Spacing ——————————————————————————————— */
  --space-2: 2px;
  --space-4: 4px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;

  /* — Radius ———————————————————————————————— */
  --radius-sm: 8px;
  --radius-md: 11px;      /* inner tiles / small chips */
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-2xl: 27px;     /* cards (26.7 in source) */
  --radius-3xl: 32px;
  --radius-pill: 100px;   /* buttons, chips, avatars */
  --radius-pill-sm: 25px; /* small buttons */
  --radius-round: 9999px;

  /* — Elevation ————————————————————————————— */
  /* soft, warm violet-tinted shadows — never hard black */
  --shadow-sm: 0 2px 8px rgba(42, 25, 90, 0.06);
  --shadow-md: 0 8px 24px rgba(42, 25, 90, 0.08);
  --shadow-lg: 0 16px 40px rgba(42, 25, 90, 0.10);
  --shadow-pink: 0 10px 30px rgba(255, 135, 149, 0.30);

  /* — Motion ———————————————————————————————— */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);   /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast: 120ms;   /* @kind other */
  --dur-base: 200ms;   /* @kind other */
  --dur-slow: 320ms;   /* @kind other */

  /* — Button metrics (from source) —————————— */
  --btn-lg-h: 60px;   --btn-lg-pad: 20px 28px;   /* @kind spacing */
  --btn-md-h: 52px;   --btn-md-pad: 16px 24px;   /* @kind spacing */
  --btn-sm-h: 44px;   --btn-sm-pad: 12px 20px;   /* @kind spacing */
}

/* Generated from Figma Variables. First mode = :root default.
   FLOAT tokens are unitless — multiply by 1px in calc() where a length is needed.
   NOTE: --accent-accent-yellow carries the 2026 Sun Yellow (#FFDD85) from the
   Brand Center, not the rgb(255,225,136) the (not yet re-exported) Figma file
   still holds. Every other value is verbatim. */

:root {
  --accent-accent-yellow: rgb(255,221,133); /* @kind color */
  --amount: 0; /* @kind other */
  --background-1-2: rgb(255,255,255); /* @kind color */
  --background-1: rgb(255,255,255); /* @kind color */
  --background: rgb(251,248,246); /* @kind color */
  --categories-blue: rgb(206,228,255); /* @kind color */
  --high-2: rgb(84,71,123); /* @kind color */
  --high: rgb(84,71,123); /* @kind color */
  --intense-2: rgb(42,25,90); /* @kind color */
  --intense: rgb(42,25,90); /* @kind color */
  --low-2: rgb(221,218,229); /* @kind color */
  --low: rgb(221,218,229); /* @kind color */
  --medium-1: rgb(150,143,171); /* @kind color */
  --medium-2: rgb(116,105,148); /* @kind color */
}

:root[data-theme="dark"], .dark {
  --accent-accent-yellow: rgb(255,221,133); /* @kind color */
  --background-1-2: rgb(42,25,90); /* @kind color */
  --background-1: rgb(42,25,90); /* @kind color */
  --background: rgb(23,10,61); /* @kind color */
  --categories-blue: rgb(206,228,255); /* @kind color */
  --high-2: rgb(208,197,240); /* @kind color */
  --high: rgb(208,197,240); /* @kind color */
  --intense-2: rgb(255,255,255); /* @kind color */
  --intense: rgb(255,255,255); /* @kind color */
  --low-2: rgb(61,45,110); /* @kind color */
  --low: rgb(61,45,110); /* @kind color */
  --medium-1: rgb(137,129,185); /* @kind color */
  --medium-2: rgb(161,153,215); /* @kind color */
}


html{scroll-behavior:smooth}body{margin:0;background:#FBF8F6;-webkit-font-smoothing:antialiased}a{color:#2A195A}a:hover{color:#1B0F44}
.lp-style-0{font-family: var(--font-body); color: var(--dh-blue); background: var(--dh-eggshell);}
.lp-style-1{background: var(--dh-blue); color: var(--dh-eggshell); text-align: center; padding: 10px 24px; font-size: 14px; line-height: 20px; font-weight: 500;}
.lp-style-2{position: sticky; top: 0px; z-index: 10; background: var(--dh-eggshell); border-bottom: 1px solid var(--dh-blue-20);}
.lp-style-3{max-width: 1200px; margin: 0px auto; padding: 14px 32px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;}
.lp-style-4{display: flex; align-items: center; gap: 14px;}
.lp-style-5{height: 26px; display: block;}
.lp-style-6{font-size: 18px; color: var(--dh-blue-50);}
.lp-style-7{height: 20px; display: block;}
.lp-style-8{display: flex; align-items: center; gap: 28px; flex-wrap: wrap; font-size: 15px; font-weight: 500;}
.lp-style-9{text-decoration: none;}
.lp-style-10{display: contents;}
.lp-style-11{display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 12px 20px; width: auto; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 25px; background: var(--dh-blue); color: rgb(255, 255, 255); font-family: var(--font-label); font-weight: 700; font-size: 15px; letter-spacing: 0.01em; line-height: 1.2; cursor: pointer; transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); transform: scale(1); box-sizing: border-box; white-space: nowrap;}
.lp-style-12{padding: 72px 32px 56px;}
.lp-style-13{max-width: 1200px; margin: 0px auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); gap: 56px; align-items: center;}
.lp-style-14{display: flex; flex-direction: column; gap: 24px;}
.lp-style-15{font-size: 14px; line-height: 20px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--dh-blue-70);}
.lp-style-16{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: clamp(48px, 7vw, 82px); line-height: 1.02; letter-spacing: -0.01em; text-wrap: balance;}
.lp-style-17{margin: 0px; font-size: 19px; line-height: 29px; font-weight: 500; color: var(--dh-blue-70); max-width: 500px; text-wrap: pretty;}
.lp-style-18{display: flex; gap: 14px; flex-wrap: wrap;}
.lp-style-19{display: inline-flex; align-items: center; justify-content: center; gap: 20px; height: 60px; padding: 20px 28px; width: auto; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 100px; background: var(--dh-blue); color: rgb(255, 255, 255); font-family: var(--font-label); font-weight: 700; font-size: 16px; letter-spacing: 0.01em; line-height: 1.2; cursor: pointer; transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); transform: scale(1); box-sizing: border-box; white-space: nowrap;}
.lp-style-20{display: inline-flex; align-items: center; justify-content: center; gap: 20px; height: 60px; padding: 20px 28px; width: auto; border: 1.5px solid var(--dh-blue); border-radius: 100px; background: transparent; color: var(--dh-blue); font-family: var(--font-label); font-weight: 700; font-size: 16px; letter-spacing: 0.01em; line-height: 1.2; cursor: pointer; transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); transform: scale(1); box-sizing: border-box; white-space: nowrap;}
.lp-style-21{position: relative; aspect-ratio: 5 / 4; border-radius: 27px; overflow: hidden; background: var(--dh-beige); box-shadow: rgba(42, 25, 90, 0.08) 0px 8px 24px;}
.lp-style-22{padding: 24px 32px 40px; scroll-margin-top: 80px;}
.lp-style-23{max-width: 1200px; margin: 0px auto; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 16px;}
.lp-style-24{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: clamp(40px, 5.5vw, 56px); line-height: 1.2; text-wrap: balance;}
.lp-style-25{margin: 0px; max-width: 720px; font-size: 19px; line-height: 29px; font-weight: 500; color: var(--dh-blue-70); text-wrap: pretty;}
.lp-style-26{padding: 0px 32px;}
.lp-style-27{max-width: 1200px; margin: 0px auto; background: var(--dh-yellow); border-radius: 27px; padding: 22px 32px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 14px 28px;}
.lp-style-28{display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 16px;}
.lp-style-29{padding: 112px 32px 40px;}
.lp-style-30{max-width: 1200px; margin: 0px auto; display: flex; flex-direction: column; gap: 40px;}
.lp-style-31{display: flex; flex-direction: column; gap: 12px; align-items: center; text-align: center;}
.lp-style-32{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: 46px; line-height: 56px;}
.lp-style-33{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 20px;}
.lp-style-34{text-decoration: none; color: var(--dh-blue); background: var(--dh-white); border-radius: 27px; padding: 32px; display: flex; flex-direction: column; gap: 28px; box-shadow: rgba(42, 25, 90, 0.08) 0px 8px 24px; transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), box-shadow 240ms cubic-bezier(0.22, 1, 0.36, 1);}
.lp-style-35{width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--dh-yellow-35);}
.lp-style-36{font-family: var(--font-display); font-size: 32px; line-height: 38px; flex: 1 1 0%;}
.lp-style-37{display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 20px; border-top: 1px solid var(--dh-blue-20); font-weight: 700; font-size: 15px;}
.lp-style-38{width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--dh-sky-20);}
.lp-style-39{width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--dh-mint-20);}
.lp-style-40{padding: 80px 32px; scroll-margin-top: 80px;}
.lp-style-41{max-width: 1200px; margin: 0px auto; background: var(--dh-beige); border-radius: 27px; padding: clamp(32px, 5vw, 64px); display: flex; flex-direction: column; gap: 40px;}
.lp-style-42{display: flex; flex-direction: column; gap: 16px; max-width: 720px;}
.lp-style-43{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: 46px; line-height: 56px; text-wrap: balance;}
.lp-style-44{margin: 0px; font-size: 18px; line-height: 27px; font-weight: 500; color: var(--dh-blue-70); text-wrap: pretty;}
.lp-style-45{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 20px;}
.lp-style-46{background: rgba(255, 255, 255, 0.55); border-radius: 20px; padding: 28px; display: flex; flex-direction: column; gap: 18px;}
.lp-style-47{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: 30px; line-height: 36px;}
.lp-style-48{margin: 0px; padding: 18px 0px 0px; list-style: none; display: flex; flex-direction: column; gap: 14px; border-top: 1px solid var(--dh-blue-20);}
.lp-style-49{display: flex; gap: 12px; align-items: flex-start; font-size: 16px; line-height: 23px; font-weight: 500;}
.lp-style-50{flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: currentcolor; margin-top: 8px;}
.lp-style-51{background: var(--dh-white); border-radius: 20px; padding: 28px; display: flex; flex-direction: column; gap: 18px;}
.lp-style-52{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px;}
.lp-style-53{margin: 0px; font-size: 18px; line-height: 27px; font-weight: 500; max-width: 620px; text-wrap: pretty;}
.lp-style-54{padding: 40px 32px 80px; scroll-margin-top: 80px;}
.lp-style-55{max-width: 1200px; margin: 0px auto; display: flex; flex-direction: column; gap: 32px;}
.lp-style-56{display: flex; flex-direction: column; gap: 12px;}
.lp-style-57{display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 20px;}
.lp-style-58{text-decoration: none; color: var(--dh-blue); background: var(--dh-white); border-radius: 27px; overflow: hidden; display: flex; flex-direction: column; box-shadow: rgba(42, 25, 90, 0.08) 0px 8px 24px; transition: box-shadow 240ms cubic-bezier(0.22, 1, 0.36, 1);}
.lp-style-59{position: relative; aspect-ratio: 16 / 10; background: var(--dh-sky-20);}
.lp-style-60{padding: 24px; display: flex; flex-direction: column; gap: 12px;}
.lp-style-61{font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; color: var(--dh-blue-70);}
.lp-style-62{font-family: var(--font-display); font-size: 26px; line-height: 32px; text-wrap: pretty;}
.lp-style-63{padding: 96px 32px; background: var(--dh-white); scroll-margin-top: 80px;}
.lp-style-64{max-width: 1200px; margin: 0px auto; display: flex; flex-direction: column; gap: 56px;}
.lp-style-65{display: flex; flex-direction: column; gap: 12px; max-width: 820px;}
.lp-style-66{font-size: 20px; line-height: 28px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--dh-blue-70);}
.lp-style-67{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: clamp(32px, 4vw, 46px); line-height: 1.2; text-wrap: pretty;}
.lp-style-68{overflow-x: auto; margin: 0px -32px; padding: 0px 32px 8px;}
.lp-style-69{display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 32px;}
.lp-style-70{position: relative; display: flex; flex-direction: column; gap: 20px;}
.lp-style-71{position: absolute; top: 27px; left: 64px; right: -24px; height: 2px; background: var(--dh-blue-20);}
.lp-style-72{position: absolute; top: 22px; right: -26px; width: 0px; height: 0px; border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 8px solid var(--dh-blue-35);}
.lp-style-73{position: relative; width: 56px; height: 56px; border-radius: 50%; background: var(--dh-yellow); color: var(--dh-blue); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 24px; line-height: 1;}
.lp-style-74{display: flex; flex-direction: column; gap: 8px; padding-right: 8px;}
.lp-style-75{font-size: 13px; line-height: 18px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; color: var(--dh-blue-70);}
.lp-style-76{font-size: 20px; line-height: 26px; font-weight: 700; text-wrap: pretty;}
.lp-style-77{position: relative; width: 56px; height: 56px; border-radius: 50%; background: var(--dh-blue); color: var(--dh-eggshell); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 24px; line-height: 1;}
.lp-style-78{margin: -32px 0px 0px; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--dh-blue-70);}
.lp-style-79{padding: 96px 32px 0px;}
.lp-style-80{max-width: 1200px; margin: 0px auto; background: var(--dh-blue); color: var(--dh-eggshell); border-radius: 27px; padding: clamp(32px, 5vw, 56px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); align-items: center; gap: 48px;}
.lp-style-81{display: flex; flex-direction: column; gap: 24px; padding: clamp(0px, 2vw, 16px);}
.lp-style-82{display: flex; flex-direction: column; gap: 14px;}
.lp-style-83{margin: 0px; font-size: 18px; line-height: 27px; font-weight: 500;}
.lp-style-84{display: flex;}
.lp-style-85{display: inline-flex; align-items: center; justify-content: center; gap: 20px; height: 60px; padding: 20px 28px; width: auto; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 100px; background: var(--dh-yellow); color: var(--dh-blue); font-family: var(--font-label); font-weight: 700; font-size: 16px; letter-spacing: 0.01em; line-height: 1.2; cursor: pointer; transition: background var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out); transform: scale(1); box-sizing: border-box; white-space: nowrap;}
.lp-style-86{position: relative; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; background: rgba(251, 248, 246, 0.08);}
.lp-style-87{padding: 96px 32px; scroll-margin-top: 80px;}
.lp-style-88{max-width: 1200px; margin: 0px auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 48px; align-items: center;}
.lp-style-89{position: relative; aspect-ratio: 4 / 3; border-radius: 27px; overflow: hidden; background: var(--dh-mint-20);}
.lp-style-90{display: flex; flex-direction: column; gap: 20px;}
.lp-style-91{margin: 8px 0px 0px; font-size: 13px; line-height: 19px; color: var(--dh-blue-70); text-wrap: pretty;}
.lp-style-92{padding: 40px 32px 96px; scroll-margin-top: 80px;}
.lp-style-93{max-width: 1200px; margin: 0px auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 48px; align-items: start;}
.lp-style-94{display: flex; flex-direction: column; gap: 24px; min-width: 0px;}
.lp-style-95{margin: 0px; font-size: 13px; line-height: 19px; color: var(--dh-blue-70); text-wrap: pretty;}
.lp-style-96{color: var(--dh-blue); text-decoration: underline; word-break: break-word;}
.lp-style-97{padding: 0px 32px 96px;}
.lp-style-98{max-width: 1200px; margin: 0px auto; background: var(--dh-yellow); border-radius: 27px; padding: clamp(48px, 7vw, 96px) 32px; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 20px;}
.lp-style-99{margin: 0px; font-family: var(--font-display); font-weight: 400; font-size: clamp(44px, 6vw, 68px); line-height: 1.05;}
.lp-style-100{margin: 0px; font-size: 18px; line-height: 27px; font-weight: 500; max-width: 520px; text-wrap: pretty;}
.lp-style-101{background: rgb(23, 10, 61); color: rgb(255, 255, 255); padding: 56px 0px 32px;}
.lp-style-102{max-width: 1160px; margin: 0px auto; padding: 0px 32px; display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 32px;}
.lp-style-103{font-family: var(--font-body); font-size: 14px; opacity: 0.6; max-width: 240px; margin-top: 12px;}
.lp-style-104{font-family: var(--font-label); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.5; margin-bottom: 14px;}
.lp-style-105{display: flex; flex-direction: column; gap: 10px;}
.lp-style-106{font-family: var(--font-body); font-size: 14px; color: rgba(255, 255, 255, 0.8); text-decoration: none;}
.lp-style-107{max-width: 1160px; margin: 32px auto 0px; padding: 20px 32px 0px; border-top: 1px solid rgba(255, 255, 255, 0.12); font-family: var(--font-body); font-size: 13px; opacity: 0.5;}
*{box-sizing:border-box}html{scroll-padding-top:90px}body{margin:0;min-width:0}main,section,header,footer{min-width:0}img{max-width:100%}.content-image{display:block;width:100%;height:100%;object-fit:cover}.button-link{text-decoration:none;max-width:100%;text-align:center}.button-link:hover{filter:brightness(.94)}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #826bdd;outline-offset:4px}.skip-link{position:fixed;top:-80px;left:12px;z-index:100;padding:12px 20px;background:#fff;color:#2a195a;border-radius:12px}.skip-link:focus{top:12px}.menu-toggle,.mobile-book{display:none}.footer-logo{width:130px;height:auto;filter:brightness(0) invert(1)}.faq-list{display:flex;flex-direction:column;gap:12px}.faq-item{background:var(--surface-card);border-radius:16px;box-shadow:0 0 0 1px var(--border-subtle);overflow:hidden}.faq-item summary{cursor:pointer;list-style:none;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--text-intense)}.faq-item summary::-webkit-details-marker{display:none}.faq-item summary:after{content:'⌄';font:22px/1 sans-serif;flex-shrink:0;transition:transform .2s}.faq-item[open] summary:after{transform:rotate(180deg)}.faq-answer{padding:0 20px 20px;font-size:16px;line-height:1.6;color:var(--dh-blue-70)}
@media(max-width:760px){
 .header-inner{padding:12px 16px;gap:10px;flex-wrap:wrap}.brand-lockup{gap:8px}.brand-lockup img[alt="Dreem Health"]{width:82px;height:auto}.brand-lockup img[alt="Ozlo"]{width:42px;height:auto}.brand-lockup>span{font-size:14px}.mobile-book{display:inline-flex;margin-left:auto;align-items:center;justify-content:center;min-height:40px;padding:10px 13px;border-radius:100px;background:var(--dh-blue);color:#fff;font:700 13px/1.2 var(--font-body)}.js .menu-toggle{display:block;min-height:40px;border:1px solid var(--dh-blue-35);border-radius:100px;padding:8px 12px;background:transparent;color:var(--dh-blue);font:700 13px/1.2 var(--font-body)}#site-nav{width:100%;gap:8px;align-items:stretch;flex-direction:column;padding-top:10px}.js #site-nav:not(.is-open){display:none}#site-nav>a{min-height:44px;display:flex;align-items:center}#site-nav .button-link{width:100%;justify-content:center}
 main>section[class]{padding-left:20px;padding-right:20px}.hero{padding-top:36px;padding-bottom:40px}.hero-grid{gap:32px}.hero p{font-size:18px;line-height:1.55}.hero-actions{flex-direction:column;gap:12px}.hero-actions .button-link{width:100%;min-height:48px;height:auto;padding:15px 20px}main h2[class]{font-size:clamp(30px,8.5vw,38px);line-height:1.16}.responsive-grid{grid-template-columns:1fr;gap:28px}.steps-scroll{overflow:visible;margin:0;padding:0}.steps-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.step-connector{display:none}.footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;padding:0 20px}.footer-grid>div:first-child{grid-column:1/-1}.faq-item summary{min-height:60px}.faq-answer{font-size:16px}#clinic{padding-top:0}#start-here,#learn,#how,#ozlo{padding-top:54px;padding-bottom:54px}#faq{padding-top:16px;padding-bottom:54px}#provider,#closing{padding-bottom:54px}section[id]{scroll-margin-top:86px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}