/* JoyFit Vivo — 2026 product design system. Original design inspired by nutrition-diary usability, not copied UI. */
:root,:root[data-theme=light]{
 --bg:#f6f7f5;--card:#ffffff;--soft:#fff1e8;--t:#20262b;--t2:#6a7377;--sep:#e6e9e7;--line:#e6e9e7;--action:#b9491b;--action-hover:#9a3b16;--action-text:#b9491b;--focus-ring:#c85d2c;--soft-border:#efc7ae;--fire-bg:#1d3440;--fire-edge:#244650;--fire-text:#ffffff;--fire-accent:#ffc18f;--scroll-thumb:#aeb6b6;--scroll-thumb-hover:#7c8b8e;
 --a:#fa703a;--g:#31a78e;--b:#349bd1;--p:#8b79c9;--y:#e7a73a;--r:#ca6658;--hero:#ffe3cc;--ht:#2d2424;
 --fd:"Outfit","Manrope",system-ui,sans-serif;--fb:"DM Sans","Manrope",system-ui,sans-serif;--radius-card:25px;
}
:root[data-theme=dark]{--bg:#181d21;--card:#252b30;--soft:#41322c;--t:#f8f7f5;--t2:#c7cece;--sep:#475158;--line:#475158;--action:#b9491b;--action-hover:#9a3b16;--action-text:#f0a47c;--focus-ring:#f0a47c;--soft-border:#664638;--fire-bg:#1d3440;--fire-edge:#465f68;--fire-text:#ffffff;--fire-accent:#ffc18f;--scroll-thumb:#68767c;--scroll-thumb-hover:#87959b;--a:#ff986b;--g:#6cdcc4;--b:#86c8f5;--p:#bdaef4;--y:#fac36f;--r:#ff9d91;--hero:#51372f;--ht:#fff4ee}
html,body{background:var(--bg);color:var(--t);font-family:var(--fb)}
html{scroll-behavior:smooth}body{font-size:14px;letter-spacing:-.012em;background-image:radial-gradient(circle at 100% 0,#ffece026,transparent 35%)}
h1,h2,h3,.big,.jf-cal-number,.jf-metric strong,.jf-diet-ring strong,.jf-vivo-donut strong{font-family:var(--fd);letter-spacing:-.046em}
button{font-family:var(--fb);transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease;box-shadow:none}
button:active{transform:scale(.975)}button:focus-visible,a:focus-visible,label:has(input:focus-visible){outline:3px solid #f29a6d;outline-offset:3px}
.jf-panel,.card{border:1px solid var(--line);box-shadow:0 8px 28px #9d674a0b,0 2px 6px #9d674a05;background:var(--card);border-radius:24px}
.jf-panel{padding:27px}.jf-panel h2{font-family:var(--fd);font-weight:750;letter-spacing:-.043em}
.jf-page-header{position:relative;margin-bottom:26px;min-height:94px;gap:18px}
.jf-page-header .jf-head-text h1{font-size:clamp(33px,3.8vw,48px);font-weight:760;letter-spacing:-.067em;line-height:1.1;margin:6px 0}
.jf-head-text p{font-size:14px;color:var(--t2)}
.jf-eyebrow,.jf-tag,.jf-vivo-kicker{color:#df7446;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:850}
.jf-avatar{width:68px;height:68px;min-height:68px;background:#fff0e5;border:3px solid #f3af88;box-shadow:0 0 0 5px #ffe9d9}
.jf-avatar small{background:#fe7c42;border:3px solid #fff;min-width:29px;bottom:-5px;right:-7px;border-radius:12px;font-size:10px}
.jf-avatar .jf-initial{color:#ce5f30}
.jf-head-action{background:#fff;border:1px solid #f4ded0;color:#e87543!important;box-shadow:0 4px 20px #c58b7118}
.jf-progress{background:#e9e7e4;height:8px}.jf-progress i{background:#f77745}
.jf-primary{background:#f7743e!important;color:#fff!important;border-color:#f7743e;min-height:44px;border-radius:13px;font-size:12px;padding:11px 17px;box-shadow:0 6px 16px #f7743e24}
.jf-primary:hover{background:#e95c2e!important;box-shadow:0 9px 22px #f7743e3b}
.jf-outline{background:var(--card)!important}.jf-link{color:#e66b37!important}
.jf-section-title h2{font-size:20px;font-weight:750}.jf-section-title p{font-size:12px}
.jf-vivo-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.14em;color:#c15d31;font-weight:850}.jf-vivo-sun{font-size:17px;color:#ee8a39}
.jf-vivo-home .jf-page-header{margin-bottom:24px}
/* Full-width editorial hero — food art is original, generated for this application. */
.jf-vivo-hero{height:405px;padding:0;position:relative;overflow:hidden;isolation:isolate;border-color:#f6dbc9;background:#ffead8;box-shadow:0 12px 36px #dd9c6e22}
.jf-vivo-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#ffe9dc 0%,#ffe9dc 27%,#ffe9dced 41%,#ffe9dc28 69%,transparent 88%);z-index:-1;pointer-events:none}
.jf-vivo-hero-image{position:absolute;inset:0;z-index:-2;background-image:url('../assets/hero-food.webp');background-position:center center;background-repeat:no-repeat;background-size:cover}
.jf-vivo-hero-main{position:relative;z-index:1;padding:27px 34px 14px;max-width:60%;height:calc(100% - 104px);display:flex;flex-direction:column;align-items:flex-start}
.jf-vivo-hero h2{font-size:clamp(23px,2.3vw,36px);line-height:1.16;color:#32232a;max-width:540px;letter-spacing:-.059em;margin:9px 0 16px;font-weight:790}
.jf-vivo-hero h2 em{font-style:normal;color:#c96e43}
.jf-vivo-calorie-row{display:flex;align-items:center;gap:21px;margin-top:auto}
.jf-vivo-donut,.jf-diet-ring{--fill:0%;width:129px;height:129px;flex:none;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#fb743b var(--fill),#f7c4a3 var(--fill) 100%);position:relative}
.jf-vivo-donut:before,.jf-diet-ring:before{content:"";position:absolute;inset:13px;border-radius:50%;background:#fffaf7}
.jf-vivo-donut>div,.jf-diet-ring>div{position:relative;display:grid;justify-items:center;gap:2px;z-index:1}
.jf-vivo-donut strong,.jf-diet-ring strong{font-size:35px;font-weight:780;line-height:1;letter-spacing:-.07em;color:#32282a}
.jf-vivo-donut span,.jf-diet-ring span{font-size:10px;font-weight:650;color:#a17560}
.jf-vivo-cal-copy strong{font-family:var(--fd);font-size:22px;color:#6a3930;white-space:nowrap;line-height:1}
.jf-vivo-cal-copy small{font-size:12px;color:#9d6c58}.jf-vivo-cal-copy p{font-size:11px;color:#a07562;margin:4px 0 13px}
.jf-vivo-hero-foot{position:absolute;bottom:0;left:0;right:0;min-height:103px;z-index:2;background:#fffcf9ec;backdrop-filter:blur(12px);border-top:1px solid #eabf9f88;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:18px 32px;gap:23px}
.jf-vivo-macro{min-width:0}.jf-vivo-macro>div{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:750;color:#775e56}.jf-vivo-macro strong{margin-left:auto;color:#322b29;font-size:12px;white-space:nowrap}.jf-vivo-macro strong small{font-size:10px;font-weight:600;color:#987d6e}
.jf-macro-dot{display:inline-block;border-radius:100%;width:10px;height:10px;flex:none;background:#f8793e}.jf-macro-dot.protein{background:#ee7842}.jf-macro-dot.carbs{background:#e4ae45}.jf-macro-dot.fat{background:#a18bce}
.jf-vivo-macro .jf-progress,.jf-diet-macro .jf-progress{height:7px;margin-top:11px;background:#eae3dd}
.jf-vivo-macro:nth-child(2) .jf-progress i,.jf-diet-macro:nth-child(2) .jf-progress i{background:#e5af47}.jf-vivo-macro:nth-child(3) .jf-progress i,.jf-diet-macro:nth-child(3) .jf-progress i{background:#a38bd2}
/* Distinct dashboard cards: three art-directed surfaces */
.jf-vivo-home-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:17px}
.jf-vivo-home-grid>*{min-width:0}.jf-vivo-water-card,.jf-vivo-workout-card{grid-column:span 3;min-height:238px;text-align:left;display:flex;position:relative;isolation:isolate;overflow:hidden;align-items:stretch;cursor:pointer}
.jf-vivo-water-card{background:#e7f5fc;border-color:#d3eaf5;color:#25465e!important}
.jf-vivo-workout-card{background:#fff0e0;border-color:#f4dfce;color:#32282b!important}
.jf-vivo-water-card:hover,.jf-vivo-workout-card:hover{transform:translateY(-3px);box-shadow:0 15px 35px #b27a5222}
.jf-vivo-card-copy{position:relative;z-index:1;max-width:72%;display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.jf-vivo-card-copy h2{font-size:23px;margin:3px 0 0;line-height:1.18}.jf-vivo-card-copy p{font-size:12px;line-height:1.55;color:#7e8190;margin:2px 0}
.jf-vivo-water-card .jf-vivo-kicker{color:#2585b0}.jf-vivo-card-number{font-family:var(--fd);font-size:46px;line-height:1;font-weight:790;letter-spacing:-.07em;color:#236e9b;margin:4px 0 3px}.jf-vivo-card-number span{font-size:21px}
.jf-vivo-small-progress{width:180px;max-width:100%}.jf-vivo-small-progress .jf-progress i{background:#339dca}
.jf-vivo-water-art{position:absolute;right:-32px;bottom:-39px;width:50%;max-width:295px;max-height:265px;opacity:1;pointer-events:none}
.jf-vivo-workout-art{position:absolute;right:-63px;bottom:-18px;width:58%;max-width:310px;max-height:214px;pointer-events:none}
.jf-vivo-workout-card .jf-vivo-card-copy{max-width:62%}.jf-vivo-workout-name{font-family:var(--fd);font-weight:780;font-size:20px;line-height:1.28;max-width:220px}
.jf-vivo-pill{display:inline-flex;gap:6px;align-items:center;background:#fffefa;border:1px solid #f1d3bb;color:#d56b39!important;border-radius:99px;font-weight:800;font-size:11px;padding:8px 12px;margin-top:auto}
.jf-vivo-pill svg{width:14px;height:14px}.jf-stat-link{display:inline-flex;align-items:center;gap:6px;color:#257ba7;font-size:11px;font-weight:800;margin-top:auto}.jf-stat-link svg{height:15px;width:15px}
.jf-vivo-reward-card{grid-column:span 2;min-height:230px;background:#f7f1ff;border-color:#eae0f6;position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:stretch}
.jf-vivo-reward-card>div{z-index:1;max-width:85%}.jf-vivo-reward-card .jf-vivo-kicker{color:#8868a6}.jf-vivo-reward-card h2{font-size:22px;max-width:200px;margin:11px 0 6px}.jf-vivo-reward-card p{font-size:12px;color:#766a78;max-width:200px}.jf-vivo-reward-card .jf-progress{max-width:175px;margin-top:13px}.jf-vivo-reward-card .jf-progress i{background:#9b7bd1}.jf-vivo-reward-card .jf-link{color:#8566a2!important;margin-top:9px}
.jf-vivo-chest-art{position:absolute;right:-57px;bottom:-25px;width:68%;max-width:250px;pointer-events:none}
.jf-vivo-week-card{grid-column:span 4;min-height:230px}.jf-vivo-week-card .jf-week-bars{gap:16px;margin:13px 0}.jf-vivo-week-card .jf-week-track{height:77px;max-width:60px;border-radius:15px;background:#faf1ec;padding:5px}.jf-vivo-week-card .jf-week-track i{background:#f8b59a;border-radius:10px}.jf-vivo-week-card .jf-week-track .is-complete{background:#fb783c}
.jf-vivo-week-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;border-top:1px solid var(--line);padding-top:9px;color:var(--t2);font-size:12px}
/* Diary takes the best utility ideas from nutrition trackers without borrowing identity. */
.jf-diet-layout{display:grid;grid-template-columns:minmax(320px,.89fr) minmax(390px,1.11fr);gap:17px;align-items:start}
.jf-diet-summary{grid-column:1;grid-row:1/3;background:linear-gradient(160deg,#fff2e8 0%,#fff 52%);min-height:570px;display:flex;flex-direction:column;align-items:stretch}
.jf-diet-summary h2{font-size:27px;margin:8px 0 16px}
.jf-diet-ring{width:185px;height:185px;margin:15px auto 5px;background:conic-gradient(#fa733c var(--fill),#f8d2ba var(--fill) 100%)}.jf-diet-ring:before{inset:16px;background:var(--card)}.jf-diet-ring strong{font-size:50px}.jf-diet-ring span{font-size:12px}
.jf-diet-intake{font-size:14px;text-align:center;margin:12px 0 24px!important}.jf-diet-intake strong{font-size:20px;color:var(--t)}.jf-diet-intake span{color:var(--t2)}
.jf-diet-macros{display:grid;gap:17px}.jf-diet-macro>div{display:flex;align-items:center;gap:8px;font-size:12px}.jf-diet-macro>div>span:last-child{margin-left:auto;color:var(--t2);font-size:11px}
.jf-diet-meals{grid-column:2;grid-row:1}.jf-vivo-meal-list{display:grid;gap:10px}
.jf-vivo-meal{width:100%;display:flex;align-items:center;gap:13px;text-align:left;min-height:86px;background:#fff!important;border:1px solid #f1e6df;color:var(--t)!important;padding:11px 13px;border-radius:18px}
.jf-vivo-meal:hover{background:#fff8f4!important;border-color:#f4c8b2}.jf-vivo-meal-picture{width:59px;height:59px;flex:none;border-radius:16px;display:grid;place-items:center;background:#ffedd9;color:#e89b4c}.jf-vivo-meal-picture svg{width:27px;height:27px}.jf-vivo-meal-picture img{width:100%;height:100%;object-fit:cover;border-radius:16px}.jf-meal-lunch{background:#ffe2c9;color:#ed7741}.jf-meal-evening{background:#eee7fa;color:#9b7bd3}.jf-meal-snack{background:#e9f4e6;color:#7fb66c}.jf-meal-late{background:#e8f1fb;color:#6796c2}
.jf-vivo-meal-copy{display:grid;gap:5px;min-width:0;flex:1}.jf-vivo-meal-copy strong{font-size:14px;font-weight:780}.jf-vivo-meal-copy small{font-size:11px;line-height:1.35;color:var(--t2)}.jf-vivo-meal>b{font-size:15px;white-space:nowrap}.jf-vivo-meal>b small{font-size:10px;color:var(--t2);font-weight:550}.jf-vivo-meal-add{display:grid;place-items:center;width:28px;height:28px;background:#fff0e9;color:#e66b38;font-size:22px;border-radius:50%;flex:none}
.jf-diet-ai-banner{grid-column:2;grid-row:2;min-height:220px;background:linear-gradient(120deg,#fee1ca,#fff4e5);border-color:#efd3bc;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.jf-diet-ai-banner:after{content:"";position:absolute;right:-13%;top:-70%;width:56%;height:200%;border-radius:50%;border:29px solid #fff4e8a8;transform:rotate(-25deg);z-index:-1}
.jf-diet-ai-banner h2{font-size:25px;line-height:1.15;max-width:300px;margin:10px 0 3px}.jf-diet-ai-banner p{font-size:12px;line-height:1.6;max-width:310px;margin:4px 0 13px;color:#936d58}.jf-diet-ai-art{position:absolute;right:11%;top:27%;color:#e8a76b;transform:rotate(-14deg)}.jf-diet-ai-art svg{width:110px;height:110px;stroke-width:1}
/* Water uses its own blue identity for immediate distinction. */
.jf-water-layout{gap:17px}.jf-water-hero{background:linear-gradient(125deg,#e5f6fe,#f3fbff);border-color:#cde9f7;overflow:hidden;position:relative;isolation:isolate;min-height:386px;padding:32px;justify-content:center}
.jf-water-hero:before{content:"";width:460px;height:460px;border:2px solid #bfe8f65d;border-radius:50%;position:absolute;right:-155px;top:-205px;pointer-events:none}
.jf-water-hero h2{font-size:92px;color:#2585b7;position:relative;z-index:1}.jf-water-hero h2 small{color:#5399bb}.jf-water-hero p{color:#4b81a0;z-index:1}.jf-water-goal{color:#4789ae;border-color:#c6e4f3;z-index:1;max-width:56%}.jf-water-goal strong{color:#1477ad}.jf-water-hero .jf-progress{max-width:56%;z-index:1;background:#c8e8f6}.jf-water-hero .jf-progress i{background:#339dd1}
.jf-water-illustration{position:absolute;bottom:-42px;right:-54px;width:65%;max-width:395px;max-height:335px;pointer-events:none}
.jf-water-hero>.jf-tag{color:#2885b3;position:relative;z-index:1}.jf-water-register{background:#fff}.jf-water-actions button{background:#f3f9fc;color:#24475a!important;border:1px solid #daebf5;border-radius:17px}.jf-water-actions button:hover{background:#e7f6fc}.jf-water-actions button svg{color:#399ccb}.jf-water-actions button strong{font-family:var(--fd);color:#245c7c}
.jf-water-week{grid-column:1/-1}.jf-water-week .jf-week-track{background:#eaf6fc}.jf-water-week .jf-week-track i{background:#9cd6ed}.jf-water-week .jf-week-track i.is-complete{background:#319bcc}
/* Movement & results: distinctive visual backdrop, still functional. */
.jf-workout-level{background:linear-gradient(114deg,#ffe6d1,#fff7ed);border-color:#f4ddca;min-height:218px;position:relative;overflow:hidden}.jf-workout-level:before{content:"";position:absolute;inset:0;background-image:url('../assets/workout-illustration.svg');background-repeat:no-repeat;background-position:76% 73%;background-size:390px auto;opacity:.2;pointer-events:none}
.jf-workout-level>div{position:relative;z-index:1}.jf-workout-level h2{font-size:46px;color:#d86b37}.jf-workout-level p{font-size:13px}.jf-chest{background:#fffdf5ed;border-color:#f3d2ab;min-width:170px;position:relative;z-index:1;padding:5px 13px 13px}.jf-chest img{width:110px;height:99px;object-fit:contain;display:block;mix-blend-mode:multiply}.jf-chest span{font-size:10px}.jf-chest strong{color:#d7753b}
.jf-exercise{border-radius:16px;background:#faf9f7;padding:16px}.jf-exercise:has(input:checked){background:#fff0e8;border-color:#f1d0c0}.jf-exercise input{accent-color:#f87942}
.jf-milestone{background:#faf8f5;border-radius:15px}.jf-milestone.is-next{background:#fff3e6}.jf-milestone.is-unlocked{background:#ffedd9}.jf-peer{border-radius:16px;background:#fffdfa}
.jf-result-chart{position:relative;overflow:hidden;background:#fff;border-color:#ede5e0}.jf-result-chart:before{content:"";position:absolute;right:0;top:0;width:47%;height:180px;background-image:url('../assets/progress-sunrise.svg');background-size:contain;background-repeat:no-repeat;background-position:right top;opacity:.21;pointer-events:none}.jf-result-chart>.jf-section-title,.jf-result-chart>.jf-chart-scroll,.jf-result-chart>.jf-chart-legend,.jf-result-chart>.jf-footnote{position:relative;z-index:1}
.jf-result-chart .jf-section-title h2{font-size:24px}.jf-result-chart .jf-weight-svg{min-height:265px}.jf-metric{background:#fff;border-radius:20px;min-height:110px}.jf-metric:first-child{background:#fff1e7;border-color:#f4d8c6}.jf-metric strong{font-size:clamp(20px,2.6vw,29px)}
.jf-meal-sheet .box{box-shadow:0 30px 120px #3d2e2940}.jf-ai-photo{background:linear-gradient(130deg,#fff2e7,#fffaf6)}.jf-photo-picker{min-height:62px;background:#fff}.jf-ai-totals{background:#fff6ed}
/* Existing profile, onboarding and registration are kept accessible and visually unified. */
#login{background:#ffe9d9 url('../assets/hero-food.webp') center center/cover no-repeat!important}
#login:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff6f3c9 0%,#fff6f39a 44%,transparent 86%);pointer-events:none}
#login .box{position:relative;background:#fffdfbf7;backdrop-filter:blur(15px);box-shadow:0 24px 80px #7c433c29;border-radius:27px;border:1px solid #fff;padding:37px 31px}
#login .wm{font-family:var(--fd);font-size:43px;font-weight:850;color:#ec723c}
#intro:has(.ob-shell){background:linear-gradient(145deg,#fff0e5,#fffaf6)}
.ob-shell{border-radius:28px;box-shadow:0 18px 65px #a56d3e18}.ob-content h1{font-family:var(--fd);letter-spacing:-.05em}
.ob-content h1,.ob-finish h1{color:var(--t)}.ob-option.selected{background:#fff0e6!important;color:#a84928!important;border-color:#f47c47!important}.ob-next{background:#f7743e!important}
.card{border-radius:21px}.av.jf-profile-avatar{border-color:#f0ad83}.jf-profile-avatar{box-shadow:0 0 0 5px #ffe8d6!important}
/* Purposeful brand rail */
@media(min-width:960px){
 #nav{width:244px;padding:32px 16px;gap:6px;border-right:1px solid #f3e8df;background:linear-gradient(175deg,#fffaf6,#fff4eb)}
 #nav:before{content:"✿ joyfit";white-space:nowrap;font-family:var(--fd);font-size:30px;font-weight:850;letter-spacing:-.075em;color:#e87841;padding:0 13px 35px}
 #nav:after{content:"CADA DIA CONTA";color:#c28a6e;letter-spacing:.21em;bottom:31px;left:31px}
 #nav button{font-weight:740;font-family:var(--fb);min-height:52px;border-radius:15px;margin-bottom:2px;gap:15px;padding:12px 15px;color:#776f6c}
 #nav button.on{color:#e86f3b!important;background:#ffe3d1!important;box-shadow:inset 3px 0 0 #f27841}
 #nav button:hover:not(.on){background:#fff0e4}
 #nav button b{display:grid;place-items:center}.jf-screen{max-width:1290px}
 #app{margin-left:244px;padding:30px clamp(25px,3vw,55px) 64px}.jf-page-header{padding-left:2px}
 #sy{left:265px}
}
@media(min-width:960px) and (max-width:1200px){.jf-vivo-hero-main{max-width:63%}.jf-vivo-hero h2{font-size:28px}.jf-vivo-card-copy h2{font-size:19px}.jf-vivo-water-art{right:-40px;width:55%}.jf-diet-layout{grid-template-columns:minmax(280px,1fr) minmax(340px,1.1fr)}}
@media(max-width:959px){
 #app{padding:23px 0 calc(112px + env(safe-area-inset-bottom,0px));max-width:660px}
 .jf-screen{padding:0 13px}.jf-page-header{min-height:66px;gap:12px;margin:0 2px 23px}.jf-avatar{height:61px;width:61px;min-height:61px;border-width:2.5px}
 .jf-head-text h1,.jf-page-header .jf-head-text h1{font-size:clamp(24px,6.9vw,33px);letter-spacing:-.05em}.jf-head-text p{font-size:12px}
 .jf-panel{padding:21px;border-radius:21px}.jf-vivo-hero{padding:0;height:460px;border-radius:22px}
 .jf-vivo-hero-image{background-size:auto 84%;background-position:right top;top:81px}
 .jf-vivo-hero:before{z-index:-1;background:linear-gradient(180deg,#ffe9dc 0%,#ffe9dcf5 27%,#ffe9dc60 56%,#ffe9dc00 77%)}
 .jf-vivo-hero-main{height:calc(100% - 136px);padding:19px 20px 10px;max-width:100%;align-items:flex-start}
 .jf-vivo-hero h2{font-size:clamp(23px,5.6vw,30px);margin:7px 0 4px;max-width:320px;line-height:1.11}
 .jf-vivo-calorie-row{margin-top:14px;gap:11px;align-items:center}.jf-vivo-donut{width:110px;height:110px}.jf-vivo-donut:before{inset:11px}.jf-vivo-donut strong{font-size:29px}.jf-vivo-donut span{font-size:9px}
 .jf-vivo-cal-copy strong{font-size:17px}.jf-vivo-cal-copy small{font-size:10px}.jf-vivo-cal-copy p{font-size:10px;margin:2px 0 9px}.jf-vivo-cal-copy button{min-height:37px;font-size:10px;padding:8px 11px}
 .jf-vivo-hero-foot{grid-template-columns:repeat(3,minmax(0,1fr));padding:14px 13px;gap:11px;min-height:126px}
 .jf-vivo-macro>div{display:flex;flex-wrap:wrap;gap:4px;font-size:10px}.jf-vivo-macro strong{flex-basis:100%;margin-left:0;font-size:11px}.jf-vivo-macro strong small{font-size:9px}.jf-vivo-macro .jf-progress{height:6px;margin-top:7px}
 .jf-vivo-home-grid{grid-template-columns:1fr 1fr;gap:11px;margin-top:12px}.jf-vivo-home-grid>*{grid-column:span 2}
 .jf-vivo-water-card,.jf-vivo-workout-card{min-height:197px;padding:19px}.jf-vivo-card-copy{max-width:66%}.jf-vivo-card-copy h2{font-size:21px}.jf-vivo-card-copy p{font-size:11px}.jf-vivo-water-art{width:55%;right:-37px;bottom:-42px;max-height:235px}.jf-vivo-workout-art{width:60%;right:-59px;bottom:-5px;max-height:180px}
 .jf-vivo-reward-card{min-height:188px}.jf-vivo-reward-card>div{max-width:67%}.jf-vivo-reward-card h2{font-size:22px;margin:9px 0 4px}.jf-vivo-reward-card p{font-size:11px}.jf-vivo-chest-art{right:-32px;bottom:-25px;max-width:190px}
 .jf-vivo-week-card{min-height:220px}.jf-vivo-week-card .jf-week-track{height:65px}.jf-vivo-week-bottom{font-size:11px}
 .jf-diet-layout{grid-template-columns:1fr;gap:12px}.jf-diet-layout>*{grid-column:1!important;grid-row:auto!important}
 .jf-diet-summary{min-height:auto;padding:23px;display:grid;grid-template-columns:135px minmax(0,1fr);column-gap:15px;align-items:center}.jf-diet-summary>.jf-vivo-kicker,.jf-diet-summary>h2{grid-column:1/-1}.jf-diet-summary h2{font-size:23px;margin:4px 0 13px}.jf-diet-ring{height:130px;width:130px;margin:6px 0}.jf-diet-ring:before{inset:11px}.jf-diet-ring strong{font-size:35px}.jf-diet-ring span{font-size:9px}.jf-diet-intake{grid-column:2;grid-row:3;margin:0!important;text-align:left;font-size:11px}.jf-diet-intake strong{font-size:19px}.jf-diet-macros{grid-column:1/-1;margin-top:22px;gap:12px}.jf-diet-summary .jf-footnote{grid-column:1/-1}
 .jf-vivo-meal{padding:10px;gap:9px;min-height:74px}.jf-vivo-meal-picture{width:51px;height:51px;border-radius:14px}.jf-vivo-meal-copy strong{font-size:13px}.jf-vivo-meal-copy small{font-size:10px}.jf-vivo-meal>b{font-size:13px}.jf-vivo-meal-add{width:24px;height:24px;font-size:19px}.jf-diet-ai-banner{min-height:210px}.jf-diet-ai-art{right:1%;opacity:.6}
 .jf-water-hero{min-height:285px;padding:23px}.jf-water-hero h2{font-size:72px}.jf-water-illustration{width:72%;right:-70px;bottom:-35px;max-height:258px}.jf-water-goal{max-width:60%;font-size:13px;margin-top:14px;padding-top:13px}.jf-water-hero .jf-progress{max-width:60%}
 .jf-workout-level{min-height:175px}.jf-workout-level h2{font-size:35px}.jf-chest{min-width:107px;padding:6px}.jf-chest img{width:78px;height:73px}.jf-chest span{font-size:9px}.jf-chest strong{font-size:11px}
 .jf-result-chart:before{width:50%;opacity:.14}.jf-result-chart .jf-section-title h2{font-size:19px}.jf-result-chart .jf-weight-svg{min-height:unset}
 #nav{background:#fffdfa;border-top:1px solid #f0e2d8;padding-top:6px;box-shadow:0 -7px 30px #8f614918}
 #nav button{font-size:10px;font-weight:720}#nav button.on{background:#ffeadb!important;color:#e66f37!important}
 #login{background-position:63% center!important}#login:before{background:#fff1e4a8}#login .box{padding:29px 23px}
}
@media(max-width:390px){.jf-vivo-hero{height:445px}.jf-vivo-hero h2{font-size:23px}.jf-vivo-hero-foot{min-height:125px}.jf-vivo-meal-picture{width:45px;height:45px}.jf-vivo-meal{gap:7px}.jf-vivo-meal-add{width:23px;height:23px}.jf-water-illustration{right:-86px}.jf-vivo-water-card .jf-vivo-card-copy{max-width:66%}}
@media(prefers-reduced-motion:reduce){.jf-screen{animation:none!important}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}

/* Dark appearance is opt-in; every light-themed illustration card keeps its readable local ink. */
:root[data-theme=dark] .jf-vivo-hero,:root[data-theme=dark] .jf-vivo-water-card,:root[data-theme=dark] .jf-vivo-workout-card,:root[data-theme=dark] .jf-vivo-reward-card,:root[data-theme=dark] .jf-water-hero,:root[data-theme=dark] .jf-workout-level,:root[data-theme=dark] .jf-diet-ai-banner{color:#302b2b}
:root[data-theme=dark] .jf-vivo-hero p,:root[data-theme=dark] .jf-vivo-water-card p,:root[data-theme=dark] .jf-vivo-workout-card p,:root[data-theme=dark] .jf-vivo-reward-card p,:root[data-theme=dark] .jf-water-hero p,:root[data-theme=dark] .jf-workout-level p,:root[data-theme=dark] .jf-diet-ai-banner p{color:#6b5d5b}
:root[data-theme=dark] .jf-vivo-reward-card h2,:root[data-theme=dark] .jf-vivo-water-card h2,:root[data-theme=dark] .jf-vivo-workout-card h2,:root[data-theme=dark] .jf-workout-level h2,:root[data-theme=dark] .jf-vivo-workout-name{color:#3b3030}
:root[data-theme=dark] .jf-diet-summary{background:linear-gradient(160deg,#342b2b,#24242b 65%)}
:root[data-theme=dark] .jf-vivo-meal{background:#292830!important;color:var(--t)!important;border-color:#4a4040}
:root[data-theme=dark] .jf-vivo-meal:hover{background:#3a3131!important}
:root[data-theme=dark] .jf-vivo-meal-add{background:#553c34}
:root[data-theme=dark] .jf-vivo-macro>div{color:#634e49}
:root[data-theme=dark] .jf-vivo-hero-foot strong{color:#322929}
:root[data-theme=dark] .jf-diet-ring:before{background:var(--card)}
:root[data-theme=dark] .jf-result-chart{background:var(--card)}
:root[data-theme=dark] .jf-exercise,:root[data-theme=dark] .jf-peer,:root[data-theme=dark] .jf-milestone{background:var(--card)}
:root[data-theme=dark] .jf-workout-level .jf-progress,:root[data-theme=dark] .jf-water-hero .jf-progress{background:#f0cebb}
:root[data-theme=dark] .jf-chest{background:#fff7ec;color:#9e6a42}