/* V04: shared dimensions follow the 300 px content area of the supplied reference. */
body.app-view{background:radial-gradient(ellipse at 50% 30%,#08222c,#020a10 65%)}
.app-view main{max-width:390px;padding:0 10px 22px}.app-view .phone{border:2px solid #4b738b;box-shadow:inset 0 0 0 3px #0d1b24,0 0 25px #00b6ca0c;border-radius:34px;padding:27px 16px 82px;background:radial-gradient(ellipse at 50% 13%,#06161c,#000708 58%);min-height:700px}.app-view #bottom{width:344px;max-width:calc(100% - 44px);border-color:#19404c;background:#010a0df5;border-radius:14px;bottom:12px}.app-view #bottom button{font-size:9px;min-height:48px;color:#b7c9d6}.app-view #bottom button[aria-pressed=true]{color:#00efd5}.app-view #bottom svg{width:20px;height:20px}.app-header{max-width:390px}.demo-label{margin:0 0 8px;font-size:8px}
.v4{color:#f4f7fa;font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.35}.v4 *{box-sizing:border-box}.app-view #screen .v4 h2{font-size:23px;letter-spacing:-.55px;line-height:1.13;font-weight:600;margin:0 0 4px}.app-view #screen .v4 h3{font-size:14px;line-height:1.2;font-weight:500;margin:0}.v4 p{color:#b6c9d8;line-height:1.35;margin:0}.v4 small{color:#abc0d0;font-size:10px;font-weight:400}.v4 button{font-family:inherit;font-size:11px;line-height:1.2;color:#eaf6fc;background:linear-gradient(120deg,#07202a,#031118);border:1px solid #143945;border-radius:9px;padding:8px;min-height:30px;margin:0;overflow-wrap:normal}.v4 button:hover{border-color:#00efce}.v4 svg{display:block;width:23px;height:23px;flex-shrink:0}.v4 .v4-photo{width:100%;height:100%;border-radius:7px;overflow:hidden}.v4-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:7px;margin-bottom:12px}.v4-heading p{font-size:12px}.v4 .v4-round{width:29px;height:29px;min-height:29px;padding:5px;border-radius:50%;background:#0a1e28}.v4-round svg{width:17px;height:17px}.v4-row{display:flex;justify-content:space-between;align-items:center;gap:6px}.v4-row>small{text-align:right;font-size:9px;line-height:1.2}.v4-row>small b{color:#fff}.v4-card{border:1px solid #173c48;border-radius:10px;background:linear-gradient(125deg,#051a23,#011015);padding:10px;margin:9px 0}.v4-greeting{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;padding:0 12px}.v4-greeting p{font-size:16px;color:white;margin-bottom:1px}.app-view #screen .v4-greeting h2{font-size:28px;font-weight:600;line-height:1.1}.v4-greeting small{font-size:12px}.v4-greeting h2 span{font-size:24px}.v4-profile{display:flex;align-items:center;gap:6px}.v4-profile>span{width:35px;height:35px;border:1px solid #73d5c8;border-radius:50%;overflow:hidden}.v4-profile .v4-photo{border-radius:50%}
.v4-hero{padding:10px 11px 8px;background:linear-gradient(140deg,#21383f,#07171e 45%,#061519);position:relative;overflow:hidden}.v4-hero .v4-row{position:relative;z-index:2}.v4 .v4-confidence{border-radius:14px;white-space:nowrap;padding:5px 7px;font-size:9px;min-height:24px;background:#48687677;border-color:#629dad}.v4-confidence b{color:#05f4c8}.v4-scene{height:151px;position:relative;margin:0 -10px}.v4-mountain{position:absolute;inset:-25px 0 0;opacity:.55;mask-image:linear-gradient(transparent,#000 30%,#000 60%,transparent)}.v4-mountain .v4-photo{border-radius:0}.v4-person{position:absolute;left:42%;bottom:0;width:101px;height:148px;mask-image:linear-gradient(transparent,#000 14%,#000 80%,transparent)}.v4-scene>p{position:absolute;right:8px;bottom:12px;width:76px;font-size:11px;line-height:1.25;color:#e7f1f6;text-shadow:0 2px 4px black}.v4-dial{width:132px;height:132px;position:relative;flex-shrink:0}.v4-dial svg{width:100%;height:100%;transform:rotate(-90deg)}.v4-dial circle{fill:none;stroke:#10454b;stroke-width:10}.v4-dial circle.meter{stroke-width:10;stroke-linecap:round;stroke:revert-layer}.v4-dial>span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.v4-dial b{font-size:33px;font-weight:600;letter-spacing:-1px}.v4-dial small{font-size:12px;color:#cee2ea}.v4-scene>.v4-dial{position:absolute;left:8px;top:4px;width:127px;height:127px}.v4 .v4-outline{width:100%;border:1px solid #00f2d0;background:linear-gradient(90deg,#003337,#004340);border-radius:9px;color:#d9ffff;padding:7px;min-height:32px;font-weight:600;box-shadow:inset 0 0 10px #00d7ba16}.v4 .v4-primary{display:block;width:100%;min-height:38px;margin:8px 0;background:linear-gradient(100deg,#04edcc,#16f8db);border-color:#00f9d3;color:#002421;font-weight:600;border-radius:8px;font-size:12px}.v4-chart{padding:9px 10px 5px}.v4-chart>svg{width:100%;height:auto;margin-top:5px}.app-view #screen .v4-chart h3{font-size:13px}.v4-chart h3 small{font-size:11px}.v4 .v4-pill{border-radius:15px;padding:4px 7px;min-height:23px;font-size:9px;white-space:nowrap;color:#16f1da;background:#03252a}.app-view #screen .v4-section-title{font-size:14px;margin:14px 0 8px}.v4-quick{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.v4-quick button{min-height:69px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:7px 2px;font-size:10px}.v4-quick svg{color:#00e8e3;width:22px;height:22px}.v4-tabs{display:flex;align-items:stretch;border:1px solid #17414c;border-radius:9px;overflow:hidden;background:#04131a;margin:8px 0 11px}.v4-tabs button{flex:1;min-width:0;background:transparent;border:0;border-right:1px solid #102d38;border-radius:0;font-size:10px;color:#adc2d3;min-height:28px;padding:5px}.v4-tabs button:last-child{border:0}.v4-tabs .selected{border:1px solid #02efce;border-radius:9px;background:radial-gradient(ellipse at bottom,#00645e,#00282c);color:white;box-shadow:inset 0 0 9px #00f4d02a}.v4-overview{display:flex;gap:10px;align-items:center;margin:12px 0}.v4-overview>.v4-dial{width:146px;height:146px}.v4-overview>div:last-child{flex:1}.v4-overview p{display:flex;align-items:center;gap:8px;margin:9px 0;font-size:12px}.v4-overview p b{color:white}.v4-overview p small{display:block;font-size:11px}.v4-icon{display:grid;place-items:center;width:35px;height:35px;background:#00272b;border:1px solid #084346;border-radius:10px;color:#00e5cf;flex-shrink:0}.v4-icon svg{width:22px;height:22px}.v4-overview .v4-icon{border-radius:50%;width:33px;height:33px}.v4-overview .v4-icon svg{width:18px;height:18px}.v4-habits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.v4-habits .v4-card{padding:7px 3px 9px;text-align:center;margin:0}.v4-dial.mini{width:72px;height:65px;margin:0 auto}.v4-dial.mini b{font-size:17px;letter-spacing:-.5px}.v4-habits p{font-size:10px;line-height:1.25;color:#e0f0f6}.v4-habits small{font-size:9px}.v4-banner{display:flex;align-items:center;gap:10px;padding:9px;margin:9px 0}.v4-banner>div{min-width:0}.v4-banner b{font-size:12px;font-weight:500}.v4-banner p{font-size:10px;margin-top:3px}.v4-textlinks{display:flex;gap:7px}.v4-textlinks button{flex:1;font-size:10px;min-height:30px}.v4-journey{display:flex;gap:4px;overflow-x:auto;margin:15px -7px 0;padding-bottom:5px;scroll-snap-type:x mandatory}.v4-journey figure{flex:0 0 57px;margin:0;scroll-snap-align:start}.v4-journey figure>.v4-photo{height:153px;border:1px solid #354a56;border-radius:7px}.v4-journey figure:nth-child(5)>.v4-photo{border-color:#00ecd0;box-shadow:0 0 7px #00dcc933}.v4-journey figcaption{text-align:center;font-size:10px;color:#b2c8d7;line-height:1.4;padding-top:4px}.v4-journey figcaption b{display:block;color:#fff;font-size:11px}.v4-journey figure:nth-child(5) figcaption,.v4-journey figure:nth-child(5) figcaption b{color:#00f7d5}.v4-allphotos{flex:0 0 62px;font-size:10px!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin-bottom:31px!important}.v4-allphotos>span{border:1px solid #33515e;border-radius:50%;padding:6px 10px}.v4-swipe{text-align:center;margin:10px 0!important;font-size:11px}.v4-dots{text-align:center;color:#fff;font-size:11px;letter-spacing:3px;margin-bottom:10px}.v4-dots span{color:#334753}.v4 blockquote{display:flex;align-items:center;gap:12px;margin:0;padding:11px 12px}.v4 blockquote b{font-size:47px;color:#00eed2;line-height:1;height:37px}.v4 blockquote i{font-size:13px;color:#c0d3df}.v4 .v4-explore{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:8px;margin:5px 0;min-height:56px}.v4-explore>span:nth-child(2){flex:1}.v4-explore b{display:block;font-size:12px;font-weight:400}.v4-explore small{display:block;font-size:10px;margin-top:3px}.v4-plans{display:grid;grid-template-columns:1fr 1.12fr;gap:6px}.v4-plans .v4-card{padding:9px 8px;display:flex;flex-direction:column;min-height:245px}.v4-plans h3{display:flex;align-items:center;gap:6px;font-size:12px!important}.v4-plans h3 svg{width:24px;height:24px;color:#89dded;padding:4px;background:#153540;border-radius:50%}.v4-plans h3 small{font-size:7px;color:#00ebce;border:1px solid #00bfae;border-radius:7px;padding:2px;margin-left:auto}.v4-plans ul{padding:0;list-style:none;flex:1;margin:12px 0}.v4-plans li{display:flex;align-items:start;gap:7px;font-size:10px;line-height:1.4;color:#c1d5e0;margin-bottom:16px}.v4-plans li svg{width:18px;height:18px;color:#a8d3e4}.v4-plans .premium{border-color:#00edcd;box-shadow:inset 0 0 30px #00574d28}.v4-plans .premium li svg{color:#00ecd0}.v4-plans .v4-primary,.v4-plans .v4-outline{font-size:10px;min-height:30px;padding:5px;margin:0}.v4-tips{padding:12px}.v4-tips p{display:flex;align-items:center;gap:13px;margin-top:11px;font-size:11px}.v4-tips svg{width:23px;height:23px;color:#c0e2f2}.v4-back{order:-1;width:26px;padding:0!important;font-size:25px!important;background:transparent!important;border:0!important}.v4-nutrition-tabs{display:flex;gap:8px;align-items:center}.v4-nutrition-tabs .v4-tabs{flex:1}.v4 .v4-kit{display:flex;gap:6px;align-items:center;font-size:9px;border-radius:15px;min-height:25px;color:#8ff9e7;padding:4px 6px}.v4-toggle{width:23px;height:14px;border-radius:12px;background:#02eac8;display:block;position:relative}.v4-toggle:after{content:'';position:absolute;right:2px;top:2px;width:10px;height:10px;background:#fff;border-radius:50%}.v4 .v4-search{display:flex;align-items:center;gap:12px;width:100%;border-radius:13px;padding:5px 9px;min-height:30px;font-size:10px;margin-bottom:10px;color:#a6bfce}.v4-search svg{width:17px;height:17px}.v4-quick.five{grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.v4-quick.five button{min-height:62px;font-size:9px}.v4-quick.five svg{color:#99e1ef}.v4-meals{display:grid;gap:3px;margin-bottom:7px}.v4-meals button{display:flex;width:100%;align-items:center;gap:12px;padding:3px 6px;min-height:45px;text-align:left}.v4-meals .v4-photo{width:72px;height:37px;border-radius:7px;flex-shrink:0}.v4-meals button>span{flex:1}.v4-meals b{font-size:10px;font-weight:400}.v4-meals small{display:block;font-size:9px;margin-top:3px}.v4 .yesterday{margin-top:12px}.v4-exercises{display:grid;gap:4px;margin:8px 0}.v4-exercises>div{display:flex;align-items:center;gap:7px;padding:3px;background:#051720;border:1px solid #123642;border-radius:9px;min-height:47px}.v4-exercises .v4-photo{width:57px;height:40px;flex-shrink:0}.v4-exercises>div>span{flex:1;min-width:0}.v4-exercises b{display:block;font-size:10px;font-weight:400}.v4-exercises small{display:block;font-size:9px;margin-top:3px}.v4-exercises button{padding:5px;min-height:28px;font-size:8px;background:#0b2632}.v4-exercises button:last-child{font-size:15px;min-width:23px;padding:2px}.v4-exercises+button{margin-top:12px!important}
#v4-dialog{max-width:340px;width:calc(100% - 40px);background:#071c24;color:#f1fbff;border:1px solid #00d7c5;border-radius:16px;padding:22px;font:14px Arial,sans-serif}#v4-dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}#v4-dialog h2{font-size:18px}#v4-dialog p{font-size:13px;line-height:1.5;color:#b7d0dd}#v4-dialog button{background:#00eccd;color:#00251f;width:100%;border:0;margin-top:10px}
.app-view #message:not(:empty){position:fixed;z-index:5;bottom:86px;left:50%;transform:translateX(-50%);width:min(340px,calc(100% - 30px));box-shadow:0 5px 25px #0009;background:#072d2e}
@media(max-width:420px){.app-view main{padding:0 9px 20px}.app-view .phone{border:1px solid #34566b;border-radius:29px;padding:25px 15px 88px;min-height:700px}.app-view #bottom{max-width:calc(100% - 42px)}.app-header{padding:8px 20px}.v4-greeting{padding:0 8px}}
@media(max-width:350px){.app-view .phone{padding-left:10px;padding-right:10px}.v4-overview>.v4-dial{width:126px;height:126px}.v4-exercises{gap:3px}.v4-exercises>div{gap:4px}.v4-exercises .v4-photo{width:46px}.v4-exercises button{font-size:7px}.v4-row h3{font-size:12px!important}.v4-confidence{font-size:8px!important}}
.v4-heading>div{flex:1}.v4-person{mask-image:radial-gradient(ellipse at 50% 50%,#000 45%,transparent 75%)}.v4-journey{scrollbar-width:thin;scrollbar-color:#22505a #031217}.v4-dots{line-height:1.4;min-height:16px}
.v4-profile .v4-avatar{padding:0;width:35px;height:35px;border-radius:50%;overflow:hidden;min-height:35px;border:1px solid #73d5c8;flex-shrink:0}.v4-profile .v4-avatar .v4-photo{width:100%;height:100%}.v4-greeting>div:first-child{min-width:0}.v4-greeting small{display:block;line-height:1.4}.v4-scene{height:166px;display:grid;grid-template-columns:43% 24% 33%;align-items:center}.v4-scene>.v4-dial{position:relative;left:0;top:0;width:100%;max-width:132px;aspect-ratio:1;height:auto;grid-column:1;z-index:1}.v4-person{left:37%;width:34%;height:155px;bottom:0}.v4-scene>p{position:relative;right:auto;bottom:auto;grid-column:3;width:auto;max-width:100%;font-size:clamp(10px,2.7vw,12px);line-height:1.5;margin:0;padding:8px 7px 8px 2px;align-self:center;overflow-wrap:normal;text-wrap:pretty;z-index:1}.v4-hero .v4-row{gap:5px;align-items:flex-start}.app-view #screen .v4-hero .v4-row h3{font-size:clamp(12px,3.4vw,14px);line-height:1.3;min-width:0;flex:1}.v4 .v4-confidence{flex-shrink:0;white-space:nowrap;font-size:9px;padding:5px 6px}.v4[data-layout=home] .v4-quick{grid-template-columns:repeat(5,minmax(0,1fr))}.v4[data-layout=home] .v4-quick button{font-size:9px;padding:7px 3px;min-width:0;min-height:76px;line-height:1.3}.v4-quick button span{max-width:100%;overflow-wrap:normal}.app-view #bottom .more-dots{font-size:25px;line-height:20px;height:20px;letter-spacing:2px}.v4-exercises>div>span,.v4-explore>span,.v4-banner>div{min-width:0}.v4-exercises b,.v4-explore b,.v4-banner b{line-height:1.35;overflow-wrap:normal}.v4-plans h3{flex-wrap:wrap}.v4-plans h3 small{margin-left:0}.v4-journey figcaption{min-height:34px}
#app-menu{width:min(400px,calc(100% - 30px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid #138f86;border-radius:20px;background:linear-gradient(145deg,#0a202a,#020e14);color:#eafbff;padding:20px;font-family:Arial,Helvetica,sans-serif;box-shadow:0 15px 80px #000b}#app-menu::backdrop{background:#000a;backdrop-filter:blur(5px)}.menu-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.menu-heading h2{font-size:19px;margin:0;line-height:1.3}.menu-heading button{font-size:25px;width:40px;min-height:40px;padding:0;background:#0b2730}.menu-heading form{margin:0}#app-menu p{font-size:13px;line-height:1.6;color:#b7cfda}#app-menu label{font-size:13px}#app-menu select{font-size:15px;min-height:48px}#app-menu button{min-height:44px}.confidence-number{font-size:54px;color:#00edcb;font-weight:600;text-align:center;padding:15px}.menu-primary{width:100%;background:#00eacb;color:#00231e;border:0}.menu-plans{display:grid;grid-template-columns:1fr 1fr;gap:10px}.menu-plans section{padding:13px;border:1px solid #23424e;border-radius:12px}.menu-plans section:last-child{border-color:#00e0bf;background:#04332f}.menu-plans h3{font-size:17px;margin:0}.menu-plans small{color:#a6c5d0;font-size:11px}.menu-note{font-size:11px!important}.menu-links{display:grid;gap:8px}.menu-links button{display:flex;justify-content:space-between;text-align:left;width:100%;background:#09212b;font-size:15px}
@media(max-width:350px){.v4-scene{grid-template-columns:42% 23% 35%;height:166px}.v4-scene>p{font-size:10px;line-height:1.4}.v4 .v4-confidence{font-size:8px;padding:5px}.v4[data-layout=home] .v4-quick button{font-size:8px}.v4-greeting p{font-size:14px}.v4-greeting small{font-size:10px}.menu-plans{grid-template-columns:1fr}}
.v4-dial small{font-size:clamp(8px,2.6vw,11px);max-width:78%;text-align:center;line-height:1.25}.v4-dial b{font-size:clamp(26px,8vw,33px)}.v4-dial.mini b{font-size:17px}.v4-overview p{min-width:0}.v4-overview p small{font-size:10px}
.v4 .body-confidence{display:block;margin:2px 0 10px auto;color:#bfdde3}.body-confidence b{color:#00e7c9}.v4 .progress-primary{margin-bottom:10px}.v4 .body-sections{margin:8px 0;background:#061e25;border-color:#23515a}.v4 .angle-tabs{margin:8px 0 12px;border:0;background:#06141a;gap:5px}.v4 .angle-tabs button{border:1px solid #24404b;border-radius:7px;min-height:31px;font-size:10px;background:#081c25}.v4 .angle-tabs .selected{border-color:#00cfbb;background:#06463e}.v4-journey figure{position:relative}.angle-badge{display:inline-block;background:#04161dda;color:#b9e4e7;border:1px solid #28545d;border-radius:5px;padding:3px 5px;font-size:8px}.v4-journey figure .angle-badge{position:absolute;top:5px;left:3px;right:3px;text-align:center;z-index:1;font-size:7px;padding:2px 1px}.body-measurements dl{margin:15px 0}.body-measurements dl>div{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #173640}.body-measurements dt{color:#b6cbd8;font-size:12px}.body-measurements dd{margin:0;font-size:16px;color:#4bf1d3;white-space:nowrap}.body-measurements p,.body-insights p{font-size:11px;margin:10px 0}.angle-empty{text-align:center;padding:20px}.angle-empty>svg{width:90px;height:140px;margin:15px auto;fill:#234853;stroke:#5b929c;stroke-width:1}.angle-empty h3{font-size:13px!important}.angle-empty p{font-size:11px;margin:12px 0}.angle-empty .v4-outline{margin-top:12px}#app-menu h3{font-size:15px;line-height:1.4}#app-menu ul{padding-left:17px;color:#b8d2da;font-size:12px;line-height:1.5}#app-menu li{margin:6px 0}
