:root{--ink:#172a26;--muted:#6f7d78;--paper:#f5f3ec;--card:#fffef9;--green:#397e72;--green-dark:#285e56;--green-soft:#dcece6;--line:#dedfd7;--warm:#df8e65;--yellow:#e9c96c}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at 90% 0%, #dbe9df99, transparent 28rem), var(--paper);color:var(--ink);min-height:100vh;margin:0;font-family:Avenir Next,Avenir,Segoe UI,Helvetica,Arial,sans-serif}button,a{font:inherit}button{color:inherit}.app-frame{min-height:100vh;padding-bottom:94px}.topbar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:10;background:#f5f3ecc7;border-bottom:1px solid #172a261a;justify-content:space-between;align-items:center;height:70px;padding:0 clamp(20px,5vw,72px);display:flex;position:sticky;top:0}.brand{color:var(--ink);letter-spacing:-.03em;align-items:center;gap:10px;font-family:Avenir Next,Avenir,Segoe UI,Helvetica,Arial,sans-serif;font-size:19px;font-weight:750;text-decoration:none;display:inline-flex}.brand-mark{background:var(--green);color:#fff;border-radius:11px;place-items:center;width:34px;height:34px;display:grid;box-shadow:0 6px 18px #397e7233}.profile-switcher{position:relative}.profile-button{border:1px solid var(--line);cursor:pointer;background:#fffef9b8;border-radius:12px;place-items:center;width:40px;height:40px;display:grid}.profile-menu{z-index:20;background:var(--card);border:1px solid #172a261f;border-radius:16px;width:220px;padding:8px;position:absolute;top:calc(100% + 10px);right:0;box-shadow:0 16px 42px #172a2629}.profile-menu>p{color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin:4px 8px 7px;font-size:10px;font-weight:800}.profile-option{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:11px;align-items:center;gap:10px;width:100%;padding:8px;display:flex}.profile-option.active{background:#edf1ed}.profile-option-copy{flex-direction:column;gap:1px;display:flex}.profile-option-copy strong{font-size:13px}.profile-option-copy small{color:var(--muted);font-size:10px}.page-shell{width:min(700px,100% - 40px);margin:0 auto;padding:24px 0}h2{letter-spacing:-.045em;margin:0;font-family:Avenir Next,Avenir,Segoe UI,Helvetica,Arial,sans-serif}.avatar{color:#fff;border-radius:9px;place-items:center;width:27px;height:27px;font-size:11px;display:grid}.avatar-current{background:#477a71}.profile-menu-divider{background:var(--line);height:1px;margin:6px 4px}.profile-sign-out{color:#805348}.profile-sign-out-icon{background:#f4e4df;border-radius:9px;place-items:center;width:27px;height:27px;display:grid}.card{background:#fffef9eb;border:1px solid #172a261a;border-radius:22px;box-shadow:0 13px 36px #2a3c360e}.overview-card{width:min(100%,700px);margin-inline:auto;padding:clamp(24px,4vw,42px)}.overview-status{border-bottom:1px solid var(--line);grid-template-columns:46px 1fr 46px;align-items:center;gap:14px;padding-bottom:27px;display:grid}.overview-status h2{text-align:center;font-size:clamp(21px,2.3vw,28px);font-weight:680}.overview-status-spacer{width:46px;height:1px}.overview-status-icon{border-radius:15px;flex:none;place-items:center;width:46px;height:46px;display:grid}.overview-status-icon.on-track{background:var(--green-soft);color:var(--green-dark)}.overview-status-icon.steady{color:#756323;background:#f1ead1}.overview-status-icon.off-track{color:#8a4936;background:#f4ded7}.overview-status-icon.calories{color:#9a672d;background:#f5ead9}.overview-status-icon.sports{color:#4f7188;background:#e1e9ef}.snapshot-tabs{background:#eeeee7;border-radius:14px;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:20px;padding:5px;display:grid}.snapshot-tab{min-height:39px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:10px;justify-content:center;align-items:center;gap:7px;font-size:12px;font-weight:800;display:flex}.snapshot-tab.active{background:var(--card);color:var(--ink);box-shadow:0 2px 9px #172a2614}.overview-content{flex-direction:column-reverse;justify-content:center;align-items:center;gap:32px;min-height:390px;padding:30px clamp(6px,3vw,34px) 0;display:flex}.overview-measurements{grid-template-columns:1fr 1fr;width:min(100%,420px);display:grid}.overview-measurement{padding:14px clamp(12px,3vw,33px) 14px 0}.overview-measurement+.overview-measurement{border-left:1px solid var(--line);padding-left:clamp(20px,4vw,42px)}.overview-measurement p{color:var(--muted);margin:0 0 5px;font-size:12px;font-weight:700}.overview-measurement strong{letter-spacing:-.06em;font-family:Avenir Next,Avenir,Segoe UI,Helvetica,Arial,sans-serif;font-size:clamp(38px,5vw,54px)}.overview-measurement>span{font-size:14px;font-weight:800}.progress-ring{--progress:0deg;--progress-color:var(--green);--progress-transition-color:#8eada3;--ring-gap:14deg;--main-progress-length:0;--transition-length:0;aspect-ratio:1;border-radius:50%;place-items:center;width:clamp(160px,18vw,205px);display:grid;position:relative}.progress-ring.on-track{--progress-color:#397e72;--progress-transition-color:#8eada3}.progress-ring.steady{--progress-color:#a8814d;--progress-transition-color:#c5b79f}.progress-ring.off-track{--progress-color:#bf6258;--progress-transition-color:#d1a39e}.progress-ring.calories{--progress-color:#c98743;--progress-transition-color:#d6b58d}.progress-ring.sports{--progress-color:#557e92;--progress-transition-color:#9bb1bb}.progress-ring-svg{width:100%;height:100%;position:absolute;inset:0;overflow:visible;transform:rotate(-76deg)}.progress-ring-track,.progress-ring-value,.progress-ring-transition{fill:none;stroke-width:7px;stroke-linecap:round}.progress-ring-track{stroke:#e5e8e2;stroke-dasharray:92.222 7.778}.progress-ring-value{stroke:var(--progress-color);stroke-dasharray:var(--main-progress-length) 100;transition:stroke-dasharray .5s}.progress-ring-transition{stroke:url(#progress-end-gradient);stroke-dasharray:var(--transition-length) calc(100 - var(--transition-length));stroke-dashoffset:calc(-1 * var(--main-progress-length))}.progress-ring:before{content:"";background:var(--card);border-radius:50%;position:absolute;inset:13px}.progress-flow{z-index:2;pointer-events:none;-webkit-mask-image:radial-gradient(farthest-side, transparent calc(100% - 14px), #000 calc(100% - 13px)), conic-gradient(transparent 0deg calc(var(--ring-gap) + 12deg), #000 calc(var(--ring-gap) + 12deg) calc(var(--progress) - 12deg), transparent calc(var(--progress) - 12deg) 360deg);-webkit-mask-composite:source-in;-webkit-mask-image:radial-gradient(farthest-side, transparent calc(100% - 14px), #000 calc(100% - 13px)), conic-gradient(transparent 0deg calc(var(--ring-gap) + 12deg), #000 calc(var(--ring-gap) + 12deg) calc(var(--progress) - 12deg), transparent calc(var(--progress) - 12deg) 360deg);mask-image:radial-gradient(farthest-side, transparent calc(100% - 14px), #000 calc(100% - 13px)), conic-gradient(transparent 0deg calc(var(--ring-gap) + 12deg), #000 calc(var(--ring-gap) + 12deg) calc(var(--progress) - 12deg), transparent calc(var(--progress) - 12deg) 360deg);border-radius:50%;position:absolute;inset:0;overflow:hidden;-webkit-mask-composite:source-in;mask-composite:intersect}.flow-arrows{border-radius:50%;position:absolute;inset:0}.flow-arrows i{color:#ffffff8f;offset-path:circle(43% at 50% 50%);offset-rotate:auto;width:12px;height:12px;position:absolute}.flow-arrows i:before{content:"";border:1.5px solid;border-width:0 1.5px 1.5px 0;width:5px;height:5px;margin:3px;display:block;transform:rotate(-45deg)}.flow-arrows i:first-child{offset-distance:0%}.flow-arrows i:nth-child(2){offset-distance:16.666%}.flow-arrows i:nth-child(3){offset-distance:33.333%}.flow-arrows i:nth-child(4){offset-distance:50%}.flow-arrows i:nth-child(5){offset-distance:66.666%}.flow-arrows i:nth-child(6){offset-distance:83.333%}.progress-ring.on-track .flow-arrows{animation:14s linear infinite flow-clockwise}.progress-ring.off-track .flow-arrows{animation:14s linear infinite flow-counterclockwise}.progress-ring.off-track .flow-arrows i{offset-rotate:auto 180deg}.progress-ring.steady{animation:5s ease-in-out infinite steady-ring}.progress-ring.steady .flow-arrows{display:none}.progress-ring-center{z-index:1;flex-direction:column;align-items:center;display:flex;position:relative}.progress-ring-center strong{letter-spacing:-.055em;font-family:Avenir Next,Avenir,Segoe UI,Helvetica,Arial,sans-serif;font-size:37px;line-height:1}.progress-ring-center span{color:var(--muted);margin-top:5px;font-size:11px;font-weight:700}.section-placeholder{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:420px;padding:42px;display:flex}.section-placeholder-icon{background:var(--green-soft);width:52px;height:52px;color:var(--green-dark);border-radius:16px;place-items:center;margin-bottom:15px;display:grid}.section-placeholder h2{font-size:28px}.section-placeholder p{color:var(--muted);margin:8px 0 0;font-size:13px}.log-card{min-height:520px;padding:clamp(24px,4vw,38px)}.log-heading p,.quick-log-heading p{color:var(--green-dark);letter-spacing:.1em;text-transform:uppercase;margin:0 0 5px;font-size:10px;font-weight:800}.log-heading h2{font-size:clamp(24px,4vw,32px)}.log-type-grid{grid-template-columns:repeat(2,1fr);gap:12px;margin-top:28px;display:grid}.log-type-button{border:1px solid var(--line);text-align:left;cursor:pointer;background:#faf9f3;border-radius:17px;flex-direction:column;align-items:flex-start;min-height:148px;padding:18px;display:flex}.log-type-button strong{margin-top:13px;font-size:15px}.log-type-button small{color:var(--muted);margin-top:4px;font-size:10px;line-height:1.35}.log-type-icon{background:var(--green-soft);width:40px;height:40px;color:var(--green-dark);border-radius:13px;place-items:center;display:grid}.log-type-icon.measurement{color:#806937;background:#eee7d7}.log-type-icon.meal{color:#9a672d;background:#f5ead9}.log-type-icon.workout{color:#4f7188;background:#e1e9ef}.quick-log-heading{border-bottom:1px solid var(--line);grid-template-columns:40px 40px 1fr;align-items:center;gap:11px;padding-bottom:20px;display:grid}.quick-log-heading h2{font-size:24px}.quick-log-back{border:1px solid var(--line);cursor:pointer;background:#faf9f3;border-radius:12px;place-items:center;width:40px;height:40px;padding:0;display:grid}.quick-log-form{margin-top:26px}.quick-log-fields{gap:15px;display:grid}.log-field{gap:7px;display:grid}.log-field>span:first-child{color:var(--muted);font-size:11px;font-weight:750}.log-field input,.log-field select,.measurement-row input{border:1px solid var(--line);width:100%;height:48px;color:var(--ink);font:inherit;background:#faf9f3;border-radius:12px;outline:0;padding:0 13px;font-size:15px}.log-field input:focus,.log-field select:focus,.measurement-row input:focus{border-color:var(--green);box-shadow:0 0 0 3px #397e721f}.measurement-list{gap:6px;display:grid}.measurement-row{border-bottom:1px solid #dedfd7bf;grid-template-columns:1fr minmax(105px,.75fr);align-items:center;gap:12px;min-height:42px;padding-bottom:6px;display:grid}.measurement-row:last-child{border-bottom:0;padding-bottom:0}.measurement-row>span:first-child{color:var(--ink);font-size:12px;font-weight:700}.measurement-row input{height:38px}.input-with-unit{display:block;position:relative}.input-with-unit input{padding-right:54px}.input-with-unit small{color:var(--muted);font-size:11px;font-weight:750;position:absolute;top:50%;right:13px;transform:translateY(-50%)}.save-log-button{background:var(--ink);color:#fff;cursor:pointer;border:0;border-radius:13px;width:100%;height:48px;margin-top:22px;font-weight:750}.log-save-note{min-height:15px;color:var(--muted);text-align:center;margin:10px 0 0;font-size:10px}.log-save-note.saved{color:var(--green-dark);font-weight:750}.log-save-note.error{color:#9a4e3d;font-weight:750}.app-navigation{z-index:15;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fffef9f0;border:1px solid #172a261c;border-radius:19px;grid-template-columns:repeat(5,1fr);width:min(620px,100% - 32px);height:64px;padding:6px;display:grid;position:fixed;bottom:18px;left:50%;transform:translate(-50%);box-shadow:0 14px 38px #172a2624}.app-navigation-item{min-width:0;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:13px;flex-direction:column;justify-content:center;align-items:center;gap:3px;display:flex}.app-navigation-item span{font-size:10px;font-weight:750}.app-navigation-item.active{background:var(--green-soft);color:var(--green-dark)}@keyframes flow-clockwise{to{transform:rotate(360deg)}}@keyframes flow-counterclockwise{to{transform:rotate(-360deg)}}@keyframes steady-ring{0%,to{filter:drop-shadow(0 0 #a8814d00)}50%{filter:drop-shadow(0 0 5px #a8814d2e)}}button,.snapshot-tab{transition:transform .16s,box-shadow .16s,background .16s}button:hover{transform:translateY(-1px)}button:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #397e7259}@media (max-width:800px){.page-shell{width:min(100% - 26px,620px);padding:18px 0}.overview-content{gap:28px}.progress-ring{width:160px}}@media (max-width:560px){html,body{overscroll-behavior:none;height:100%;overflow:hidden}.app-frame{grid-template-rows:62px minmax(0, 1fr) calc(68px + env(safe-area-inset-bottom));width:100%;height:100dvh;min-height:0;padding:0;display:grid;overflow:hidden}.topbar{height:62px;padding:0 14px}.brand{font-size:17px}.page-shell{width:calc(100% - 20px);height:100%;min-height:0;padding:8px 0;overflow:hidden}.overview-card{border-radius:20px;flex-direction:column;height:100%;min-height:0;padding:18px;display:flex}.overview-status{grid-template-columns:40px 1fr 40px}.overview-status-icon{border-radius:13px;width:40px;height:40px}.overview-status-spacer{width:40px}.snapshot-tabs{margin-top:14px}.overview-status{padding-bottom:16px}.overview-content{flex:1;gap:18px;min-height:0;padding-top:18px}.overview-measurements{width:100%}.overview-measurement{text-align:center;padding:8px 12px}.overview-measurement+.overview-measurement{padding-left:12px}.overview-measurement strong{font-size:clamp(32px,10vw,40px)}.progress-ring{width:clamp(150px,43vw,175px)}.section-placeholder{height:100%;min-height:0;padding:24px}.log-card{height:100%;min-height:0;padding:20px;overflow:hidden}.quick-log-card{overscroll-behavior:contain;scrollbar-width:none;overflow-y:auto}.quick-log-card::-webkit-scrollbar{display:none}.log-heading h2{font-size:clamp(22px,6.5vw,28px)}.log-type-grid{gap:10px;height:calc(100% - 72px);margin-top:20px}.log-type-button{text-align:center;justify-content:center;align-items:center;min-height:0;padding:14px}.log-type-button strong{margin-top:9px}.quick-log-form{margin-top:20px}.app-navigation{width:100%;height:calc(68px + env(safe-area-inset-bottom));padding:5px 5px env(safe-area-inset-bottom);border-width:1px 0 0;border-radius:0;position:relative;bottom:auto;left:auto;transform:none;box-shadow:0 -8px 24px #172a2612}.app-navigation-item{border-radius:11px}.app-navigation-item span{font-size:clamp(8px,2.5vw,10px)}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.auth-page,.onboarding-page{background:radial-gradient(circle at 15% 12%, #dcece6e6, transparent 22rem), radial-gradient(circle at 92% 88%, #e7dbc373, transparent 25rem), var(--paper);place-items:center;width:100%;min-height:100dvh;padding:30px 20px;display:grid;overflow-y:auto}.auth-panel,.onboarding-panel{background:#fffef9f0;border:1px solid #172a261a;border-radius:28px;width:min(100%,440px);padding:34px;box-shadow:0 26px 70px #2137301a}.auth-brand{letter-spacing:-.035em;justify-content:center;align-items:center;gap:11px;font-size:20px;font-weight:800;display:flex}.auth-brand-mark,.onboarding-icon{background:var(--green);color:#fff;border-radius:15px;place-items:center;width:45px;height:45px;display:grid;box-shadow:0 9px 24px #397e723d}.auth-heading,.onboarding-heading{text-align:center;margin-top:30px}.auth-heading p,.onboarding-heading p{color:var(--green-dark);letter-spacing:.12em;text-transform:uppercase;margin:0 0 8px;font-size:11px;font-weight:850}.auth-heading h1,.onboarding-heading h1{letter-spacing:-.055em;margin:0;font-size:clamp(29px,7vw,36px);line-height:1.04}.auth-heading>span,.onboarding-heading>span{max-width:320px;color:var(--muted);margin:12px auto 0;font-size:14px;line-height:1.5;display:block}.auth-mode-switch{background:#eeeee7;border-radius:14px;grid-template-columns:1fr 1fr;gap:5px;margin-top:28px;padding:5px;display:grid}.auth-mode-switch button{min-height:41px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:10px;font-size:13px;font-weight:800}.auth-mode-switch button.active{color:var(--ink);background:var(--card);box-shadow:0 3px 12px #172a2614}.auth-form{gap:17px;margin-top:24px;display:grid}.auth-field{gap:7px;display:grid}.auth-field>span:first-child{font-size:12px;font-weight:800}.auth-input-wrap{border:1px solid var(--line);min-height:50px;color:var(--muted);background:#fbfaf5;border-radius:14px;align-items:center;gap:10px;padding:0 14px;transition:border-color .16s,box-shadow .16s,background .16s;display:flex}.auth-input-wrap:focus-within{background:var(--card);border-color:#397e72b8;box-shadow:0 0 0 4px #397e721a}.auth-input-wrap input{width:100%;min-width:0;color:var(--ink);font:inherit;background:0 0;border:0;outline:0;font-size:15px}.auth-input-wrap input::placeholder{color:#a6aeaa}.password-toggle{width:32px;height:32px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:9px;flex:none;place-items:center;display:grid}.auth-feedback,.onboarding-feedback{border-radius:12px;margin:0;padding:11px 13px;font-size:12px;font-weight:700;line-height:1.4}.auth-feedback.error,.onboarding-feedback{color:#87483c;background:#f5e4df}.auth-feedback.success{color:var(--green-dark);background:var(--green-soft)}.auth-submit,.onboarding-submit{background:var(--green);color:#fff;cursor:pointer;border:0;border-radius:15px;min-height:52px;font-size:14px;font-weight:850;box-shadow:0 10px 24px #397e723b}.auth-submit:disabled,.onboarding-submit:disabled{cursor:wait;opacity:.68}.auth-privacy,.onboarding-note{color:var(--muted);text-align:center;margin:22px 0 0;font-size:11px;line-height:1.45}.onboarding-panel{padding-top:24px}.onboarding-progress{justify-content:center;gap:7px;display:flex}.onboarding-progress span{background:#e2e4de;border-radius:999px;width:30px;height:4px}.onboarding-progress span.complete,.onboarding-progress span.current{background:var(--green)}.onboarding-progress span.current{opacity:.55}.onboarding-icon{border-radius:17px;width:51px;height:51px;margin:28px auto 0}.onboarding-heading{margin-top:23px}.onboarding-form{gap:12px;margin-top:28px;display:grid}.metric-field{border:1px solid var(--line);background:#fbfaf5;border-radius:17px;grid-template-columns:42px minmax(0,1fr) 105px;align-items:center;gap:11px;min-height:76px;padding:12px 13px;display:grid}.metric-field:focus-within{border-color:#397e72ad;box-shadow:0 0 0 4px #397e7217}.metric-field-icon{width:42px;height:42px;color:var(--green-dark);background:var(--green-soft);border-radius:13px;place-items:center;display:grid}.metric-field-icon.goal{color:#8a632d;background:#f3ead9}.metric-field-copy{flex-direction:column;gap:3px;min-width:0;display:flex}.metric-field-copy strong{font-size:13px}.metric-field-copy small{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.metric-input{background:var(--card);border:1px solid #d9dcd5;border-radius:12px;align-items:center;height:45px;padding:0 10px;display:flex}.metric-input input{width:100%;min-width:0;color:var(--ink);font:inherit;text-align:right;background:0 0;border:0;outline:0;font-size:16px;font-weight:800}.metric-input input::placeholder{color:#aab1ad}.metric-input small{color:var(--muted);margin-left:5px;font-size:11px;font-weight:800}.onboarding-submit{justify-content:center;align-items:center;gap:9px;margin-top:8px;padding:0 18px;display:flex}@media (max-width:560px){.auth-page,.onboarding-page{align-items:center;height:100dvh;min-height:0;padding:12px}.auth-panel,.onboarding-panel{border-radius:22px;padding:24px 20px;box-shadow:0 18px 50px #21373014}.auth-heading{margin-top:22px}.auth-heading h1,.onboarding-heading h1{font-size:clamp(27px,8vw,33px)}.auth-mode-switch{margin-top:22px}.auth-form{gap:14px;margin-top:20px}.auth-input-wrap{min-height:48px}.auth-submit{min-height:49px}.auth-privacy{margin-top:16px}.onboarding-panel{padding-top:19px}.onboarding-icon{margin-top:19px}.onboarding-heading{margin-top:18px}.onboarding-form{margin-top:22px}.metric-field{grid-template-columns:40px minmax(0,1fr) 96px;gap:9px;min-height:69px;padding:9px 10px}.metric-field-icon{width:40px;height:40px}.metric-field-copy small{display:none}.metric-input{padding:0 8px}.onboarding-note{margin-top:15px}}
