
.mx-home {--mx-image-icon:url("/assets/7beca69c840c8df437a6.webp");}
.mx-home {
  --mx-ink:#123342; --mx-muted:#516773; --mx-teal:#087971; --mx-line:#d4e5e5;
  --mx-paper:#fff; --mx-mint:#edf8f5; --mx-blue:#edf7fb; --mx-lilac:#f4f0fc;
  color:var(--mx-ink); background:var(--mx-paper); max-width:1440px; margin:0 auto;
  font:400 16px/1.65 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  text-align:left; overflow-wrap:anywhere; isolation:isolate; -webkit-text-size-adjust:100%;
}
.mx-home *, .mx-home *::before, .mx-home *::after { box-sizing:border-box; }
.mx-home :is(h1,h2,h3,p,figure,ul,fieldset) { margin:0; }
.mx-home :is(h1,h2,h3) { font-family:inherit; text-transform:none; color:var(--mx-ink); font-weight:650; letter-spacing:-.045em; }
.mx-home h1 { font-size:clamp(48px,6.45vw,88px); line-height:1.02; }
.mx-home h2 { font-size:clamp(33px,4.2vw,54px); line-height:1.1; }
.mx-home h3 { font-size:clamp(26px,3vw,38px); line-height:1.15; }
.mx-home a { color:var(--mx-teal); text-underline-offset:.23em; text-decoration-thickness:1px; }
.mx-home a:hover { text-decoration-thickness:2px; }
.mx-home :is(a,summary,button):focus-visible, .mx-home input:focus-visible + label { outline:3px solid #096bb0; outline-offset:5px; }
.mx-home .mx-wrap { width:calc(100% - clamp(36px,8vw,112px)); max-width:1220px; margin:0 auto; }
.mx-home .mx-nav { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; border-bottom:1px solid var(--mx-line); }
.mx-home .mx-brand { display:flex; gap:11px; align-items:center; color:var(--mx-ink); text-decoration:none; }
.mx-home .mx-app-icon { background-image:var(--mx-image-icon); background-size:cover; border-radius:22%; width:46px; aspect-ratio:1; flex:0 0 46px; }
.mx-home .mx-brand strong { display:block; font-size:21px; font-weight:700; line-height:1.25; letter-spacing:-.035em; }
.mx-home .mx-brand small { display:block; font-size:11px; color:var(--mx-muted); line-height:1.6; letter-spacing:.02em; }
.mx-home .mx-nav-links { display:flex; flex-wrap:wrap; align-items:center; gap:28px; font-size:13px; font-weight:600; }
.mx-home .mx-nav-links a { min-height:44px; display:inline-flex; align-items:center; text-decoration:none; }
.mx-home .mx-nav-download { display:inline-flex; align-items:center; min-height:44px; color:var(--mx-ink); padding:9px 17px; border:1px solid #a9c8c5; border-radius:100px; font-size:13px; font-weight:600; text-decoration:none; white-space:nowrap; }
.mx-home .mx-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.02fr); gap:20px; align-items:center; padding:52px 0 34px; }
.mx-home .mx-hero-copy { padding:0 0 26px; position:relative; z-index:2; }
.mx-home .mx-eyebrow { font-size:11px; font-weight:750; letter-spacing:.13em; text-transform:uppercase; color:var(--mx-teal); margin-bottom:20px; }
.mx-home .mx-available { display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:600; color:#315e5a; padding:6px 11px; background:#edf8f5; border:1px solid #d6e9e4; border-radius:100px; margin-bottom:26px; }
.mx-home .mx-available::before { content:''; width:6px; height:6px; border-radius:50%; background:#117d68; }
.mx-home .mx-hero h1 span { color:var(--mx-teal); }
.mx-home .mx-lead { font-size:clamp(17px,1.6vw,20px); color:var(--mx-muted); max-width:510px; line-height:1.65; margin-top:24px; }
.mx-home .mx-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; margin-top:26px; }
.mx-home .mx-store-link { display:inline-block; padding:15px 0; line-height:0; flex:0 0 auto; }
.mx-home .mx-store-link img { display:block; width:174px; height:auto; }
.mx-home .mx-text-link { font-size:14px; font-weight:600; min-height:44px; display:inline-flex; align-items:center; gap:10px; }
.mx-home .mx-free-note { font-size:12px; color:var(--mx-muted); max-width:400px; margin-top:8px; line-height:1.7; }
.mx-home .mx-hero-art { --mx-art-height:660px; position:relative; min-width:0; height:var(--mx-art-height); }
.mx-home .mx-art-glow { position:absolute; inset:2% 0 5%; overflow:hidden; background:radial-gradient(ellipse at 35% 44%,#aee9e46b 0,transparent 62%),radial-gradient(ellipse at 80% 66%,#f3d5bf5e 0,transparent 58%); border-radius:50%; }
.mx-home .mx-art-glow::after { content:''; position:absolute; inset:16% 2% 13% 5%; border:1px solid #bbdcd359; border-radius:50%; transform:rotate(-22deg); }
.mx-home .mx-screen { position:relative; aspect-ratio:1284/2778; border-radius:24px; box-shadow:0 25px 60px -20px #163f5352,0 3px 10px #163f5310; }
.mx-home .mx-screenshot { position:absolute; inset:0; display:block; width:100%; height:100%; max-width:none; margin:0; padding:0; border:0; border-radius:inherit; object-fit:contain; object-position:center; }
.mx-home .mx-hero-art .mx-dashboard-screen { position:absolute; width:52%; max-width:min(280px,calc((var(--mx-art-height) - 50px)/2.25)); left:6%; top:2%; z-index:2; transform:rotate(-5deg); animation:mx-front-enter .8s cubic-bezier(.2,.7,.3,1) both; }
.mx-home .mx-hero-art .mx-sleep-screen { position:absolute; width:42%; max-width:min(230px,calc((var(--mx-art-height)*.83 - 45px)/2.25)); right:3%; top:17%; transform:rotate(5deg); animation:mx-back-enter 1s cubic-bezier(.2,.7,.3,1) both; }
.mx-home .mx-hero-art figcaption { position:absolute; bottom:0; left:4%; right:0; text-align:center; font-size:10px; line-height:1.6; color:var(--mx-muted); }
.mx-home .mx-intro-line { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 20px; padding:24px 0; margin-bottom:20px; border-top:1px solid var(--mx-line); border-bottom:1px solid var(--mx-line); color:var(--mx-muted); font-size:13px; }
.mx-home .mx-intro-line strong { color:var(--mx-ink); font-weight:600; }
.mx-home .mx-section { padding:76px 0; scroll-margin-top:110px; }
.mx-home .mx-section-head { max-width:750px; margin-bottom:34px; }
.mx-home .mx-section-head p:not(.mx-eyebrow) { color:var(--mx-muted); font-size:18px; margin-top:20px; max-width:650px; }
.mx-home .mx-tour { border:0; padding:0; min-width:0; }
.mx-home .mx-radio { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.mx-home .mx-tour > label { display:inline-flex; align-items:center; gap:10px; min-height:48px; padding:11px 20px; margin:0 8px 18px 0; border:1px solid var(--mx-line); border-radius:100px; font-size:14px; color:var(--mx-muted); cursor:pointer; }
.mx-home .mx-tour > label:hover { border-color:#87b8b0; background:#f4faf8; }
.mx-home .mx-tour > input:checked + label { background:var(--mx-ink); color:white; border-color:var(--mx-ink); }
.mx-home .mx-tour > label span { font-size:10px; opacity:.85; font-variant-numeric:tabular-nums; }
.mx-home .mx-tour-panels { margin-top:6px; }
.mx-home .mx-tour-panel { display:none; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:36px; padding:48px clamp(26px,4vw,64px); min-height:690px; border-radius:28px; background:var(--mx-blue); overflow:hidden; }
.mx-home #mx-show-dashboard:checked ~ .mx-tour-panels .mx-panel-dashboard { display:grid; }
.mx-home #mx-show-sleep:checked ~ .mx-tour-panels .mx-panel-sleep { display:grid; background:var(--mx-lilac); }
.mx-home #mx-show-trends:checked ~ .mx-tour-panels .mx-panel-trends { display:grid; background:var(--mx-mint); }
.mx-home .mx-panel-copy { max-width:450px; }
.mx-home .mx-panel-copy .mx-kicker { font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:var(--mx-muted); font-weight:600; margin-bottom:18px; }
.mx-home .mx-panel-copy h3 { font-size:clamp(31px,3.5vw,46px); max-width:420px; }
.mx-home .mx-panel-copy > p:not(.mx-kicker) { color:#455f6d; font-size:17px; margin-top:22px; }
.mx-home .mx-panel-copy ul { padding:0; list-style:none; margin-top:26px; }
.mx-home .mx-panel-copy li { border-top:1px solid #b9d4d577; padding:12px 0; color:#3d5866; font-size:14px; }
.mx-home .mx-panel-copy li::before { content:'✓'; margin-right:10px; color:#08746c; font-weight:650; }
.mx-home .mx-panel-copy .mx-panel-note { font-size:12px !important; line-height:1.7; }
.mx-home .mx-panel-image { width:min(100%,285px); margin:0 auto; transform:rotate(2deg); }
.mx-home .mx-panel-sleep .mx-panel-image { transform:rotate(-2deg); }
.mx-home .mx-panel-trends .mx-panel-image { transform:rotate(0); }
.mx-home .mx-tour-caption { font-size:11px; color:var(--mx-muted); text-align:center; margin-top:16px; }
.mx-home .mx-pro-chip { display:inline-block; border-radius:5px; padding:2px 7px; font-size:10px; font-weight:750; color:#5d4493; background:#e8dff7; letter-spacing:.06em; }
.mx-home .mx-sources { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(28px,5vw,72px); align-items:center; }
.mx-home .mx-sources h2 { max-width:520px; }
.mx-home .mx-sources p:not(.mx-eyebrow) { color:var(--mx-muted); font-size:17px; margin-top:22px; }
.mx-home .mx-sources figure { position:relative; padding:30px 0; }
.mx-home .mx-source-glow { position:absolute; inset:0 -15px; background:radial-gradient(ellipse,#f4dae782,transparent 68%); z-index:-1; }
.mx-home .mx-source-image { position:relative; aspect-ratio:1194/1010; border-radius:24px; box-shadow:0 20px 50px -20px #40557544; transform:rotate(-2deg); }
.mx-home .mx-source-image .mx-screenshot { object-position:left top; }
.mx-home .mx-sources figcaption { color:var(--mx-muted); font-size:11px; margin-top:22px; text-align:center; }
.mx-home .mx-private { background:#f0f7f5; border-radius:28px; padding:clamp(30px,5vw,64px); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:50px; align-items:start; }
.mx-home .mx-private h2 { max-width:420px; }
.mx-home .mx-private p { color:var(--mx-muted); font-size:17px; margin-top:22px; }
.mx-home .mx-private p.mx-eyebrow { color:var(--mx-teal); margin-top:0; font-size:11px; }
.mx-home .mx-private-points { display:grid; gap:22px; padding-top:4px; }
.mx-home .mx-private-points h3 { font-size:19px; letter-spacing:-.02em; }
.mx-home .mx-private-points p { font-size:14px; margin-top:7px; }
.mx-home .mx-private-points article + article { border-top:1px solid #cfe2dc; padding-top:22px; }
.mx-home .mx-plans { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.mx-home .mx-plan { border:1px solid var(--mx-line); border-radius:22px; padding:34px; position:relative; }
.mx-home .mx-plan h3 { font-size:30px; }
.mx-home .mx-plan-pro { background:linear-gradient(125deg,#f0f9f6,#f0f7fc); border-color:#a4cbc2; }
.mx-home .mx-plan-lead { color:var(--mx-muted); font-size:15px; margin-top:10px; }
.mx-home .mx-plan ul { padding:0; list-style:none; margin:24px 0 0; }
.mx-home .mx-plan li { padding:9px 0; font-size:14px; display:flex; gap:10px; align-items:baseline; }
.mx-home .mx-plan li::before { content:'✓'; color:var(--mx-teal); font-weight:700; }
.mx-home .mx-plan .mx-text-link { margin-top:22px; }
.mx-home .mx-plan-note { font-size:12px; color:var(--mx-muted); margin-top:20px; max-width:800px; }
.mx-home .mx-a11y { display:flex; justify-content:space-between; align-items:center; gap:30px; border-top:1px solid var(--mx-line); border-bottom:1px solid var(--mx-line); padding:28px 0; }
.mx-home .mx-a11y h2 { font-size:22px; }
.mx-home .mx-a11y p { color:var(--mx-muted); font-size:14px; margin-top:8px; max-width:740px; }
.mx-home .mx-a11y a { flex-shrink:0; }
.mx-home .mx-download { position:relative; overflow:hidden; background:linear-gradient(115deg,#e1f4f1,#eef6fb 60%,#fcf1e8); border:1px solid #d3e9e4; border-radius:28px; padding:clamp(34px,6vw,78px); text-align:center; margin:64px 0 40px; scroll-margin-top:110px; }
.mx-home .mx-download .mx-app-icon { display:block; width:72px; margin:0 auto 24px; box-shadow:0 8px 24px #2d536a26; }
.mx-home .mx-download h2 { max-width:650px; margin:0 auto; }
.mx-home .mx-download > p { max-width:650px; color:var(--mx-muted); margin:20px auto 0; font-size:17px; }
.mx-home .mx-button { display:inline-flex; justify-content:center; align-items:center; gap:16px; background:var(--mx-teal); color:white; border-radius:100px; min-height:52px; padding:14px 26px; text-decoration:none; font-weight:650; font-size:15px; border:1px solid var(--mx-teal); }
.mx-home .mx-button:hover { background:#075e59; border-color:#075e59; color:white; }
.mx-home .mx-download .mx-button { margin-top:26px; }
.mx-home .mx-download small { display:block; margin-top:16px; color:var(--mx-muted); font-size:12px; }
.mx-home .mx-bottom-links { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:16px; padding:16px 0; font-size:13px; }
.mx-home .mx-bottom-links nav { display:flex; flex-wrap:wrap; gap:14px 22px; }
.mx-home .mx-bottom-links a { min-height:44px; display:inline-flex; align-items:center; }
.mx-home .mx-legal { font-size:10px; line-height:1.8; color:var(--mx-muted); padding:20px 0 30px; border-top:1px solid var(--mx-line); }
.mx-home .mx-legal p + p { margin-top:8px; }
.mx-home .mx-sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes mx-front-enter { from { opacity:0; transform:translateY(20px) rotate(-3deg); } to { opacity:1; transform:translateY(0) rotate(-5deg); } }
@keyframes mx-back-enter { from { opacity:0; transform:translateY(28px) rotate(3deg); } to { opacity:1; transform:translateY(0) rotate(5deg); } }
@media (max-width:1100px) {
  .mx-home .mx-hero-art { --mx-art-height:570px; }
  .mx-home .mx-tour-panel { padding:38px; gap:28px; min-height:620px; }
  .mx-home .mx-panel-image { width:245px; }
}
@media (max-width:800px) {
  .mx-home .mx-brand { order:1; }
  .mx-home .mx-nav-download { order:2; }
  .mx-home .mx-nav-links { order:3; gap:8px 16px; flex-basis:100%; }
  .mx-home .mx-nav-links a:not(.site-page-link) { display:none; }
  .mx-home .mx-hero { grid-template-columns:1fr; gap:12px; padding-top:36px; }
  .mx-home h1 { font-size:clamp(48px,9vw,72px); max-width:640px; }
  .mx-home .mx-lead { max-width:620px; }
  .mx-home .mx-hero-art { --mx-art-height:640px; width:100%; max-width:560px; margin:0 auto; }
  .mx-home .mx-hero-art .mx-dashboard-screen { width:51%; left:7%; }
  .mx-home .mx-hero-art .mx-sleep-screen { width:42%; right:3%; }
  .mx-home .mx-intro-line { justify-content:flex-start; gap:10px 28px; }
  .mx-home .mx-section { padding:52px 0; }
  .mx-home .mx-tour-panel { grid-template-columns:1fr; gap:32px; padding:30px; }
  .mx-home .mx-panel-copy { max-width:none; }
  .mx-home .mx-panel-copy h3 { max-width:550px; }
  .mx-home .mx-panel-image { width:270px; }
  .mx-home .mx-sources { grid-template-columns:1fr; gap:20px; }
  .mx-home .mx-sources figure { max-width:560px; margin:auto; width:100%; }
  .mx-home .mx-private { grid-template-columns:1fr; gap:32px; }
  .mx-home .mx-private h2 { max-width:620px; }
  .mx-home .mx-plans { grid-template-columns:1fr; }
  .mx-home .mx-plan { padding:30px; }
  .mx-home .mx-a11y { align-items:flex-start; flex-direction:column; gap:10px; }
}
@media (max-width:480px) {
  .mx-home .mx-wrap { width:calc(100% - 36px); }
  .mx-home .mx-nav { padding:18px 0; gap:10px; }
  .mx-home .mx-app-icon { width:36px; flex-basis:36px; }
  .mx-home .mx-brand { gap:8px; }
  .mx-home .mx-brand strong { font-size:18px; }
  .mx-home .mx-nav-download { font-size:11px; padding:8px 12px; }
  .mx-home .mx-available { font-size:10px; margin-bottom:22px; }
  .mx-home h1 { font-size:clamp(46px,12vw,59px); }
  .mx-home .mx-hero-actions { gap:16px; margin-top:16px; }
  .mx-home .mx-store-link img { width:155px; }
  .mx-home .mx-text-link { font-size:12px; }
  .mx-home .mx-hero-art { --mx-art-height:clamp(395px,120vw,560px); }
  .mx-home .mx-hero-art .mx-dashboard-screen { left:2%; width:56%; }
  .mx-home .mx-hero-art .mx-sleep-screen { right:0; top:16%; width:45%; }
  .mx-home .mx-hero-art figcaption { font-size:9px; left:0; }
  .mx-home .mx-intro-line { font-size:12px; padding:18px 0; }
  .mx-home .mx-section { padding:42px 0; }
  .mx-home .mx-section-head { margin-bottom:24px; }
  .mx-home .mx-section-head p:not(.mx-eyebrow) { font-size:16px; }
  .mx-home .mx-tour > label { padding:10px 13px; margin-right:3px; gap:6px; font-size:12px; }
  .mx-home .mx-tour-panel { border-radius:18px; padding:26px 22px; }
  .mx-home .mx-panel-copy > p:not(.mx-kicker) { font-size:16px; }
  .mx-home .mx-panel-image { width:min(100%,245px); }
  .mx-home .mx-source-image { transform:none; border-radius:16px; }
  .mx-home .mx-private { border-radius:18px; padding:28px 24px; }
  .mx-home .mx-plan { padding:28px 24px; }
  .mx-home .mx-download { border-radius:18px; padding:38px 24px; margin-top:42px; }
}
@media (prefers-reduced-motion:reduce) {
  .mx-home *, .mx-home *::before, .mx-home *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
@media (forced-colors:active) {
  .mx-home { background:Canvas; color:CanvasText; }
  .mx-home :is(h1,h2,h3,p) { color:CanvasText; }
  .mx-home .mx-button, .mx-home .mx-tour > label { border:1px solid ButtonText; }
  .mx-home .mx-tour > input:checked + label { outline:2px solid Highlight; }
  .mx-home .mx-tour > input:focus-visible + label { outline:3px dashed CanvasText; outline-offset:5px; }
  .mx-home .mx-screen, .mx-home .mx-source-image, .mx-home .mx-app-icon { forced-color-adjust:none; }
}
@media print {
  .mx-home .mx-hero-art .mx-screen { animation:none; }
  .mx-home .mx-tour-panel { display:grid !important; break-inside:avoid; margin-top:24px; }
  .mx-home .mx-tour > label, .mx-home .mx-nav-links, .mx-home .mx-nav-download { display:none; }
  .mx-home .mx-screen, .mx-home .mx-source-image { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}


/* Feature navigation stays a native radio group, including without JavaScript. */
.mx-home .mx-tour { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.mx-home .mx-tour > label { margin:0; min-width:0; min-height:76px; padding:14px 16px; border-radius:18px; gap:12px; }
.mx-home .mx-tour > label .mx-choice-number { flex:0 0 auto; font-size:10px; opacity:.8; }
.mx-home .mx-tour > label .mx-choice-text { display:flex; flex-direction:column; align-items:flex-start; gap:5px; font-size:14px; line-height:1.3; opacity:1; }
.mx-home .mx-coming { display:inline-flex; align-items:center; width:fit-content; border:1px solid #ccbee8; background:#eee8f9; color:#5d3e89; padding:3px 7px; border-radius:6px; font-size:10px; font-weight:650; line-height:1.3; letter-spacing:0; text-transform:none; white-space:nowrap; }
.mx-home .mx-tour > input:checked + label .mx-coming { background:#e9e2f6; border-color:#e9e2f6; color:#4d3472; }
.mx-home .mx-tour-panels { grid-column:1 / -1; margin-top:12px; }
.mx-home .mx-panel-copy .mx-kicker { display:flex; align-items:center; flex-wrap:wrap; gap:9px; }
.mx-home #mx-show-sources:checked ~ .mx-tour-panels .mx-panel-sources { display:grid; background:#f9f1ed; }
.mx-home #mx-show-explain:checked ~ .mx-tour-panels .mx-panel-explain { display:grid; background:#f1eef9; }
.mx-home #mx-show-compare:checked ~ .mx-tour-panels .mx-panel-compare { display:grid; background:#eaf5f7; }
.mx-home #mx-show-events:checked ~ .mx-tour-panels .mx-panel-events { display:grid; background:#faf0e7; }
.mx-home #mx-show-reports:checked ~ .mx-tour-panels .mx-panel-reports { display:grid; background:#edf6ef; }
.mx-home .mx-tour-source { position:relative; width:100%; aspect-ratio:900 / 761; border-radius:20px; box-shadow:0 20px 50px -25px #12334255; }
.mx-home .mx-preview-figure { width:100%; max-width:420px; margin:0 auto; min-width:0; }
.mx-home .mx-preview-figure figcaption { margin-top:18px; text-align:center; font-size:11px; color:var(--mx-muted); }
.mx-home .mx-illustration { position:relative; display:flex; flex-direction:column; gap:20px; min-height:380px; padding:28px; border:1px solid #ffffff; border-radius:24px; background:#ffffffb8; box-shadow:0 24px 50px -30px #25495d55; }
.mx-home .mx-illustration .mx-art-label { font-size:10px; line-height:1.5; letter-spacing:.12em; text-transform:uppercase; color:#55707b; font-weight:700; }
.mx-home .mx-illustration .mx-art-heading { display:block; font-size:25px; font-weight:650; line-height:1.25; letter-spacing:-.035em; color:var(--mx-ink); }
.mx-home .mx-art-chart { display:block; width:100%; height:auto; overflow:visible; }
.mx-home .mx-art-card { padding:17px 19px; background:white; border:1px solid #dce6e7; border-radius:16px; }
.mx-home .mx-art-question { margin-left:15px; padding:18px; border-radius:18px 18px 4px 18px; background:#e7e0f5; color:#4b3674; font-size:17px; line-height:1.45; }
.mx-home .mx-art-ai { display:flex; align-items:center; gap:13px; margin-top:auto; padding-top:8px; }
.mx-home .mx-art-ai-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:linear-gradient(135deg,#a99dce,#387c98); color:white; font-size:28px; }
.mx-home .mx-art-ai strong { display:block; font-size:16px; font-weight:650; }
.mx-home .mx-art-ai small { display:block; color:#55707b; font-size:11px; }
.mx-home .mx-art-legend { display:flex; flex-wrap:wrap; gap:12px 20px; font-size:12px; color:#476471; }
.mx-home .mx-art-legend span { display:flex; align-items:center; gap:7px; }
.mx-home .mx-art-legend i { display:inline-block; width:8px; height:8px; border-radius:50%; background:#087971; }
.mx-home .mx-art-scale { display:flex; justify-content:space-between; font-size:10px; color:#637783; }
.mx-home .mx-art-compare .mx-art-card { margin-top:auto; font-size:14px; color:#496772; }
.mx-home .mx-art-timeline { display:grid; gap:0; margin-left:8px; }
.mx-home .mx-art-event { position:relative; margin-left:6px; padding:0 0 26px 25px; border-left:1px solid #bfcfca; }
.mx-home .mx-art-event:last-child { padding-bottom:0; border-left-color:transparent; }
.mx-home .mx-art-event::before { content:''; position:absolute; top:3px; left:-6px; width:11px; height:11px; border-radius:50%; background:#087971; box-shadow:0 0 0 5px #f6f5ec; }
.mx-home .mx-art-event time { display:block; font-size:10px; font-weight:650; color:#7e6956; margin-bottom:5px; text-transform:uppercase; letter-spacing:.07em; }
.mx-home .mx-art-event strong { font-size:17px; font-weight:600; }
.mx-home .mx-art-event small { display:block; color:#637783; font-size:12px; margin-top:3px; }
.mx-home .mx-art-report { padding:30px; border-radius:4px 4px 22px 4px; background:white; transform:rotate(2deg); }
.mx-home .mx-art-report-top { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #dce6e7; padding-bottom:16px; }
.mx-home .mx-art-report-top b { font-size:12px; color:var(--mx-teal); }
.mx-home .mx-art-report-top span { font-size:9px; color:#57716a; border:1px solid #c8ddd1; padding:2px 7px; border-radius:4px; }
.mx-home .mx-art-report-rule { height:6px; border-radius:3px; background:#e5ece8; margin-top:8px; }
.mx-home .mx-art-report-rule:last-child { width:70%; }
.mx-home .mx-art-readings { display:grid; grid-template-columns:1fr 1fr; gap:10px 24px; }
.mx-home .mx-art-readings span { height:5px; border-radius:3px; background:#e3ebe6; }
@media (max-width:800px) {
  .mx-home .mx-tour { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mx-home .mx-tour > label { padding:13px 16px; }
  .mx-home .mx-tour-source { max-width:420px; margin:0 auto; }
}
@media (max-width:480px) {
  .mx-home .mx-tour { gap:9px; }
  .mx-home .mx-tour > label { padding:12px 10px; gap:8px; min-height:72px; border-radius:14px; }
  .mx-home .mx-tour > label .mx-choice-text { font-size:12px; }
  .mx-home .mx-tour-panels { margin-top:10px; }
  .mx-home .mx-illustration { padding:20px; gap:18px; min-height:330px; border-radius:18px; }
  .mx-home .mx-illustration .mx-art-heading { font-size:23px; }
  .mx-home .mx-art-question { margin-left:0; padding:15px; font-size:15px; }
  .mx-home .mx-art-report { padding:22px; }
}
@media (forced-colors:active) {
  .mx-home .mx-coming, .mx-home .mx-illustration, .mx-home .mx-art-card, .mx-home .mx-art-question { border:1px solid CanvasText; }
  .mx-home .mx-coming { color:CanvasText; }
  .mx-home .mx-art-chart, .mx-home .mx-art-legend i { forced-color-adjust:none; }
}

/* Permanent product sections. Release labels are presentation-only and removable at launch. */
.mx-home .mx-product-nav { display:flex; flex-wrap:wrap; gap:8px 28px; padding:6px 0 12px; }
.mx-home .mx-product-nav a { display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:600; }
.mx-home .mx-real-shot { margin:0 auto; width:100%; max-width:280px; min-width:0; }
.mx-home .mx-real-shot > a { display:block; border-radius:22px; }
.mx-home .mx-real-shot img { display:block; width:100%; height:auto; border-radius:22px; box-shadow:0 18px 40px -20px #12334255; }
.mx-home .mx-real-shot figcaption { font-size:11px; line-height:1.6; color:var(--mx-muted); text-align:center; margin-top:14px; }
.mx-home .mx-personal-grid, .mx-pattern-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.mx-home .mx-personal-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(130px,.65fr); gap:24px; align-items:center; padding:32px; background:#eff7f7; border:1px solid #d5e8e6; border-radius:24px; }
.mx-home .mx-personal-card:nth-child(2) { background:#f5f1fa; border-color:#e6dfef; }
.mx-home .mx-personal-card h3 { font-size:29px; }
.mx-home .mx-personal-card p:not(.mx-feature-label), .mx-home .mx-pattern-card p:not(.mx-feature-label) { color:var(--mx-muted); margin-top:16px; font-size:15px; }
.mx-home .mx-feature-label { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:18px; color:var(--mx-teal); font-size:12px; font-weight:650; }
.mx-home .mx-personal-card .mx-real-shot, .mx-home .mx-pattern-card .mx-real-shot { max-width:200px; }
.mx-home .mx-personal-card .mx-text-link, .mx-home .mx-pattern-card .mx-text-link { margin-top:12px; font-size:13px; }
.mx-home .mx-small-note { font-size:12px !important; line-height:1.65; }
.mx-home .mx-pattern-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(130px,.62fr); gap:24px; padding:32px; align-items:center; border:1px solid var(--mx-line); border-radius:24px; background:#fcfdfd; }
.mx-home .mx-pattern-card h3 { font-size:29px; line-height:1.18; }
.mx-home .mx-pattern-card:nth-child(2) { background:#f6f8fc; }
.mx-home .mx-pattern-card:nth-child(3) { background:#f8f5fc; }
.mx-home .mx-pattern-card:nth-child(4) { background:#faf6ef; }
.mx-home .mx-walkthrough { margin-top:24px; border:1px solid var(--mx-line); border-radius:18px; overflow:hidden; }
.mx-home .mx-walkthrough > summary { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:20px 24px; cursor:pointer; list-style:none; font-weight:600; }
.mx-home .mx-walkthrough > summary::-webkit-details-marker { display:none; }
.mx-home .mx-walkthrough > summary small { display:block; color:var(--mx-muted); font-size:12px; font-weight:400; }
.mx-home .mx-play-mark { margin-left:auto; border:1px solid #b2d3cc; width:38px; height:38px; border-radius:50%; display:grid; place-items:center; color:var(--mx-teal); font-size:14px; }
.mx-home .mx-video-layout { display:grid; grid-template-columns:1fr minmax(0,300px); align-items:center; gap:40px; padding:24px clamp(24px,5vw,64px); border-top:1px solid var(--mx-line); background:#f4f9f8; }
.mx-home .mx-video-layout p { margin-top:20px; color:var(--mx-muted); }
.mx-home .mx-video-layout video { display:block; width:100%; aspect-ratio:886/1920; border-radius:18px; background:#102e3a; }
.mx-home .mx-video-transcript { padding:0 24px 24px; color:var(--mx-muted); font-size:12px; background:#f4f9f8; }
.mx-home .mx-plan li .mx-coming { margin-top:5px; }
@media (max-width:1100px) and (min-width:801px) {
 .mx-home .mx-personal-card, .mx-home .mx-pattern-card { grid-template-columns:1fr; }
 .mx-home .mx-personal-card .mx-real-shot, .mx-home .mx-pattern-card .mx-real-shot { max-width:180px; }
}
@media (max-width:800px) {
 .mx-home .mx-personal-grid, .mx-home .mx-pattern-grid { grid-template-columns:1fr; }
 .mx-home .mx-personal-card, .mx-home .mx-pattern-card { grid-template-columns:minmax(0,1fr) minmax(160px,.6fr); }
 .mx-home .mx-video-layout { grid-template-columns:1fr; gap:28px; }
 .mx-home .mx-video-layout video { width:min(100%,300px); margin:auto; }
}
@media (max-width:480px) {
 .mx-home .mx-personal-card, .mx-home .mx-pattern-card { grid-template-columns:1fr; padding:26px 22px; border-radius:18px; }
 .mx-home .mx-personal-card .mx-real-shot, .mx-home .mx-pattern-card .mx-real-shot { max-width:220px; }
 .mx-home .mx-product-nav { gap:4px 22px; }
 .mx-home .mx-product-nav a { font-size:13px; }
 .mx-home .mx-tour > label .mx-choice-number { display:none; }
 .mx-home .mx-tour > label .mx-coming { font-size:9px; padding:3px 5px; }
 .mx-home .mx-walkthrough > summary { padding:18px; }
 .mx-home .mx-walkthrough > summary > .mx-coming { order:3; }
}
@media print {
 .mx-home .mx-product-nav, .mx-home .mx-walkthrough { display:none; }
 .mx-home .mx-personal-card, .mx-home .mx-pattern-card { break-inside:avoid; }
}
