/* A separate mobile product surface. The desktop DOM is not rendered on phones. */
body > main#top, body > footer { display:none; }
.mobile-app { display:block; padding-bottom:86px; overflow:hidden; }
.m-hero,.m-section { padding:32px 20px; }
.m-hero { min-height:100svh; display:flex; flex-direction:column; justify-content:center; background:var(--cream); }
.m-status { align-self:flex-start; display:flex; align-items:center; gap:7px; padding:7px 10px; border-radius:999px; background:var(--ink); color:var(--cream); font:11px 'DM Mono'; }
.m-status i { width:7px; height:7px; border-radius:50%; background:var(--lime); }.m-brand { margin:20px 0 0; font:500 12px 'DM Mono'; }.m-brand b { color:var(--coral); }
.m-hero h1,.m-section h2 { margin:14px 0; font:700 clamp(42px,13vw,66px)/.9 'Fraunces'; letter-spacing:-.07em; }.m-hero h1 em { color:var(--coral); font-style:normal; }.m-hero > p:not(.m-brand) { max-width:340px; margin-bottom:24px; color:#46504a; font-size:17px; line-height:1.48; }
.m-primary { display:flex; align-items:center; justify-content:space-between; min-height:58px; padding:15px 17px; border:1px solid var(--ink); border-radius:11px; background:var(--coral); color:#fff; box-shadow:5px 5px 0 var(--ink); font-weight:700; text-decoration:none; }.m-primary span { font:27px/1 'DM Mono'; }
.m-scan { position:relative; display:grid; gap:9px; margin:40px 8px 0; padding:21px; border:2px solid var(--ink); border-radius:18px; background:var(--paper); box-shadow:8px 8px 0 var(--blue); transform:rotate(-2deg); }.m-scan small { color:var(--muted); font:10px 'DM Mono'; }.m-scan strong { font-size:20px; }.m-scan mark { justify-self:start; background:#f8db64; font-weight:700; }.m-scan b { justify-self:start; padding:5px 8px; border-radius:99px; background:var(--coral); color:#fff; font:10px 'DM Mono'; }
.m-section { scroll-margin-top:10px; }.m-kicker { margin:0 0 11px; color:var(--coral); font:12px 'DM Mono'; }.m-copy { color:#46504a; line-height:1.5; }.m-dark { background:var(--ink); color:var(--cream); }.m-dark .m-kicker { color:var(--lime); }.m-steps { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:25px; }.m-steps article { min-height:122px; display:flex; flex-direction:column; justify-content:space-between; padding:15px; border:1px solid #f4eddd66; border-radius:10px; }.m-steps span { color:var(--lime); font:12px 'DM Mono'; }.m-steps b { font:600 20px/1.05 'Fraunces'; }
.m-tag-cards { display:grid; gap:12px; margin-top:24px; }.m-tag-cards article { padding:18px; border:1.5px solid var(--ink); border-radius:12px; background:var(--paper); }.m-tag-cards h3 { margin:0 0 7px; font:600 25px 'Fraunces'; }.m-tag-cards p { margin:0; font:13px/1.55 'DM Mono'; }.m-negative { box-shadow:5px 5px 0 var(--coral); }.m-positive { box-shadow:5px 5px 0 var(--lime); }.m-neutral { box-shadow:5px 5px 0 var(--blue); }
.m-output { background:var(--paper); }.m-desktop-note { display:flex; gap:14px; margin:25px 0 16px; padding:18px; border-radius:12px; background:#e8dfcb; }.m-desktop-note span { font:25px 'DM Mono'; color:var(--blue); }.m-desktop-note b { display:block; margin-bottom:5px; }.m-desktop-note p { margin:0; color:#46504a; line-height:1.45; }.m-rules { display:grid; gap:7px; padding:18px; border:1.5px solid var(--ink); border-radius:12px; }.m-rules span { padding-top:7px; border-top:1px solid var(--line); font:12px 'DM Mono'; }
.m-download { background:var(--blue); color:#fff; }.m-download .m-kicker { color:var(--lime); }.m-download > p { color:#e2f2fc; }.m-download article { margin-top:24px; padding:20px; border:1.5px solid var(--ink); border-radius:14px; background:var(--paper); color:var(--ink); box-shadow:6px 6px 0 var(--lime); }.m-download h3 { margin:0 0 8px; font:600 27px 'Fraunces'; }.m-download article p { line-height:1.5; }.m-download .m-primary { margin-top:18px; }
.m-faq details { border-top:1px solid var(--line); }.m-faq details:last-child { border-bottom:1px solid var(--line); }.m-faq summary { position:relative; padding:18px 30px 18px 0; list-style:none; font-weight:700; }.m-faq summary:after { content:'+'; position:absolute; right:3px; color:var(--coral); font:24px 'DM Mono'; }.m-faq details[open] summary:after { content:'−'; }.m-faq details p { margin:0; padding-bottom:18px; color:#46504a; line-height:1.5; }
.mobile-dock { border-color:var(--ink); }.mobile-dock a { min-height:51px; }
