/* Extend the established HealthOS CI; never scale an entire page down. */
#root main{font-size:16px;line-height:1.55}
#root main :is(p,small,.fine,.capture-hint,.module-empty p,.dashboard-note p,.dashboard-next p,.empty-chart,.chart-heading,.table-wrap,td,th){font-size:14px;line-height:1.55}
#root main :is(h2,.module-card h2,.dashboard-daily h2){font-size:18px;line-height:1.35}
#root main :is(h3,.dashboard-goal h3,.dashboard-macro h3,.body-metrics h3){font-size:16px;line-height:1.4}
#root main :is(.headline-card span,.headline-card small,.dashboard-macro strong,.dashboard-empty-summary dt,.dashboard-empty-summary dd,.module-values dt,.module-values dd,.goal-line,.metric>p,.ring small){font-size:14px}
#root main :is(.headline-card strong,.body-metrics strong){font-size:20px;white-space:normal;overflow-wrap:anywhere}
#root main :is(button,input,textarea,select){font-size:16px;min-height:44px}
#root main :is(.panel-heading,.module-heading,.test-strip,.personal-banner){flex-wrap:wrap;gap:12px}
#root :is(.panel,.headline-card,.metric,.module-card,.charts,.meals,.snacks,.welcome,.module-summary)>*{min-width:0}
#root main :is(.panel,.headline-card,.meal-card,.empty-meal,.draft-row){overflow-wrap:anywhere}
#root .topbar{flex-wrap:wrap;gap:14px;padding:14px 20px}
#root .topbar nav{flex:1;display:flex;min-width:0;overflow:auto;scrollbar-width:thin}
#root .topbar nav button{font-size:16px;min-width:105px;min-height:68px;flex:1;padding:10px}
#root .topbar .date-nav{margin-left:auto}
#root .welcome{grid-template-columns:minmax(260px,1.7fr) repeat(3,minmax(170px,1fr))}
#root .dashboard-welcome{grid-template-columns:minmax(280px,2fr) repeat(3,minmax(165px,1fr))}
#root .rings{display:grid;grid-template-columns:repeat(6,minmax(0,1fr))}
#root .metric{min-width:0}.metric h2{overflow-wrap:normal;hyphens:auto}
#root .ring{max-width:160px;margin:auto}#root .ring strong{font-size:24px}
#root .dashboard-daily{grid-template-columns:repeat(4,minmax(0,1fr))}
#root .dashboard-nutrients{flex-wrap:wrap}
#root .dashboard-empty-summary{flex-wrap:wrap}
#root .timeline{min-height:170px}#root .timeline text{font-size:12px}
#root :is(.quick-grid,.two-buttons){gap:10px}#root .quick-grid button{font-size:15px}
#root .table-wrap{max-width:100%;overflow:auto}#root table{width:100%;table-layout:auto}#root th,#root td{padding:10px 6px;overflow-wrap:normal}
#root .adaptive-tile{position:relative}
#root [data-adaptive-expandable]{touch-action:pinch-zoom;padding-top:46px!important;-webkit-touch-callout:none}
#root .adaptive-open{position:absolute;right:6px;top:5px;width:36px;min-height:36px;height:36px;padding:2px;border:1px solid #23546a;border-radius:8px;background:#062638;color:#80d8ff;font-size:23px}
#root .adaptive-open:hover{background:#114663;border-color:#53c8fa}
#root .adaptive-active .adaptive-open{visibility:hidden}
#root.adaptive-active{position:relative;z-index:5000}
#root .adaptive-backdrop{position:fixed;inset:0;background:#00121ed9;z-index:100}
#root .adaptive-ancestor{position:relative;z-index:101;overflow:visible!important}
#root .adaptive-expanded{position:fixed!important;z-index:102!important;box-sizing:border-box;display:block!important;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;margin:0!important;padding:16px 24px 132px!important;overflow:auto!important;overscroll-behavior:contain;touch-action:pan-y pinch-zoom;background:linear-gradient(130deg,#03283f,#022136)!important;border:1px solid #4c8bab!important;border-radius:12px!important;box-shadow:0 20px 70px #0008;transition:left .5s ease,top .5s ease,width .5s ease,height .5s ease;user-select:text}
#root .adaptive-expanded>.adaptive-open{display:none}
#root .adaptive-placeholder{pointer-events:none;min-width:0;box-sizing:border-box;opacity:.2}
#root .adaptive-toolbar{position:sticky;top:-16px;z-index:5;display:flex;align-items:center;flex-wrap:wrap;gap:10px;background:#032238;padding:12px 0;border-bottom:1px solid #2c5267;margin-bottom:20px}
#root .adaptive-toolbar>strong{flex:1;font-size:22px;line-height:1.3}
#root .adaptive-status{flex-basis:100%;font-size:14px;color:#a5c9dd}
#root .adaptive-close{width:44px;min-height:44px;font-size:27px;padding:0}
#root .adaptive-expanded>h2{font-size:23px}#root .adaptive-expanded>h3{font-size:21px}
#root .adaptive-expanded :is(p,td,th,small,.fine){font-size:16px}
#root .adaptive-expanded.metric .ring{width:220px;max-width:60%;margin:24px auto}#root .adaptive-expanded.metric .ring strong{font-size:32px}
#root .adaptive-expanded.rings{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))}#root .adaptive-expanded.rings>.adaptive-toolbar{grid-column:1/-1}
#root .adaptive-expanded :is(.meal-list,.body-metrics,.module-values){width:100%}
#root .adaptive-expanded :is(.headline-card strong,.module-number){font-size:30px}
#root .adaptive-expanded .timeline{max-height:360px}
#root :is(.adaptive-pin,.adaptive-lock,.adaptive-shrink){position:fixed;z-index:110;touch-action:none;box-shadow:0 5px 24px #00101dbb;border:1px solid #70cfff;background:#07577d;color:#edf4ff}
#root .adaptive-pin{bottom:calc(24px + env(safe-area-inset-bottom));right:24px;width:190px;min-height:80px;padding:12px;white-space:normal;border-radius:14px;font-size:17px}
#root .adaptive-lock{width:48px;height:48px;min-height:48px;padding:0;border-radius:14px;font-size:23px;transition:background .2s}
#root .adaptive-lock.is-locked{background:#0d4560}
#root .adaptive-shrink{width:172px;min-height:64px;padding:10px;border-radius:12px;white-space:normal;font-size:16px}
#root .is-hit:is(.adaptive-pin,.adaptive-shrink){background:#176a55;box-shadow:0 0 0 4px #58d8b977}
#root [data-adaptive][hidden]{display:none!important}
@media(min-width:1400px){#root .topbar nav{order:0}#root .topbar .brand{flex-shrink:0}}
@media(max-width:1399px){#root .topbar nav{order:3;flex-basis:100%}#root .overview{grid-template-columns:minmax(0,1fr) 220px}#root .rings{grid-template-columns:repeat(3,minmax(0,1fr))}#root .dashboard-daily{grid-template-columns:repeat(2,minmax(0,1fr))}#root .welcome,#root .dashboard-welcome{grid-template-columns:repeat(3,minmax(0,1fr))}#root .greeting,#root .dashboard-greeting{grid-column:1/-1}}
@media(max-width:1000px){#root .main-grid,#root .bottom-grid{grid-template-columns:1fr}#root .charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#root .overview{grid-template-columns:1fr}#root .goals{display:block}#root .module-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){
 #root main{padding-left:12px;padding-right:12px}#root .topbar{padding:12px}.brand-name{font-size:26px}#root .topbar .date-nav{max-width:100%;margin-left:0}#root .date-control{min-width:0}#root .date-control span{font-size:14px}
 #root .welcome,#root .dashboard-welcome,#root .module-summary{gap:8px}#root .headline-card{padding:12px;display:block}#root .headline-card>.icon{margin-bottom:8px}#root .headline-card small{display:none}#root .headline-card strong{font-size:17px}#root .headline-card span{font-size:14px}
 #root .rings{grid-template-columns:repeat(2,minmax(0,1fr))}#root .metric h2{font-size:16px}#root .metric>p{display:none}#root .metric .ring small{font-size:13px}#root .ring strong{font-size:22px}
 #root .dashboard-daily,#root .dashboard-bottom,#root .charts,#root .module-grid.three,#root .module-grid.two,#root .module-grid.body-grid{grid-template-columns:1fr}
 #root .meal-card,#root .empty-meal{display:flex;flex-wrap:wrap;gap:14px}#root .meal-image{width:64px;height:64px;min-width:64px}#root .meal-nutrients{width:100%;min-width:0}#root .empty-meal>button{margin-left:auto}
 #root .panel-heading{align-items:flex-start}#root .panel-heading>button{max-width:100%}#root .panel-heading h2{flex-basis:100%}#root .two-buttons{flex-wrap:wrap}#root .two-buttons button{width:100%}
 #root .adaptive-expanded{padding:12px 16px 126px!important;border-radius:10px!important}#root .adaptive-toolbar{top:-12px}#root .adaptive-toolbar>strong{font-size:20px}#root .adaptive-expanded.rings{grid-template-columns:repeat(2,minmax(0,1fr))}
 #root .adaptive-pin{right:16px;bottom:20px;width:170px}#root .adaptive-expanded .headline-card small{display:block}
 #root .module-week{grid-template-columns:repeat(4,minmax(0,1fr))}#root .body-metrics,#root .module-values{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:370px){#root .welcome,#root .dashboard-welcome,#root .module-summary{grid-template-columns:1fr}#root .headline-card{display:flex}#root .headline-card>.icon{margin:0 10px 0 0}#root .rings,#root .adaptive-expanded.rings{grid-template-columns:1fr}#root .ring{width:170px}#root .body-metrics,#root .module-values{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){#root .adaptive-expanded{transition:none!important}}

/* Once expanded, normal scrolling and complete contextual details return. */
#root .adaptive-expanded,#root .adaptive-expanded .adaptive-tile{touch-action:auto}
#root .headline-card.adaptive-expanded small,#root .metric.adaptive-expanded>p{display:block}

/* Compact meal sections share the existing accessible hover/touch detail view. */
#root .meal-sections{display:grid;gap:7px}
#root .meal-section.panel{padding:10px 12px!important;min-width:0;background:linear-gradient(110deg,#0b416f,#082f55)}
#root .meal-section>h3{display:flex;gap:7px;align-items:center;padding-right:38px;margin:0;font-size:15px;line-height:1.35}
#root .meal-section>h3>.icon{width:19px;height:19px;flex:none}
#root .meal-section-count{margin-left:auto;border-radius:12px;background:#075083;color:#c4eaff;padding:1px 8px;font-size:12px}
#root .meal-section-preview{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin:4px 0 0;color:#b3cce4}
#root .meal-section :is(.meal-section-preview,.meal-section-total){font-size:12px;line-height:1.45}
#root .meal-section-total{margin:3px 0 0;color:#9ce9d5}
#root .meal-section:not(.adaptive-expanded)>.meal-section-details{display:none}
#root .meal-section.adaptive-expanded{padding:16px 24px 132px!important;background:linear-gradient(130deg,#083967,#05294c)!important}
#root .meal-section.adaptive-expanded>.meal-section-preview{display:none}
#root .meal-section.adaptive-expanded>.meal-section-total{font-size:18px;margin:10px 0}
#root .meal-section.adaptive-expanded .meal-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(290px,100%),1fr));gap:10px;align-items:start}
#root .meal-section.adaptive-expanded .meal-card{min-width:0}

/* Reference overview density. Expanded details keep their reading size. */
#root main.ref-page{max-width:1700px;width:100%;padding:10px 18px 100px;font-size:14px;line-height:1.4}
#root .ref-page :is(p,small,.fine,td,th){font-size:13px;line-height:1.45}
#root .ref-page h2{font-size:16px;line-height:1.3}
#root .ref-page h3{font-size:14px;line-height:1.35}
#root .ref-page .ref-panel{padding:11px}
#root .ref-page .ref-panel>h2{margin-bottom:9px}
#root .ref-page .metric h2{font-size:13px;gap:5px;min-height:32px;justify-content:center}
#root .ref-page .ring strong{font-size:22px}
#root .ref-page .ring small,#root .ref-page .metric>p{font-size:11px;line-height:1.3}
#root .ref-page .ref-rings>.metric:not(.adaptive-expanded)>.ring{max-width:126px}
#root .ref-page :is(button,input,select,textarea){font-size:14px;min-height:44px}
#root .ref-page .ref-training-rings{grid-template-columns:repeat(4,minmax(0,1fr))}
#root .ref-page .ref-facts{gap:4px 12px;margin:8px 0}
#root .ref-page :is(td,th){padding:7px 5px}
#root .ref-page .ref-event-list article{padding:8px}
#root .ref-page .test-strip{margin-bottom:3px;min-height:28px}
#root .ref-page .ref-heading,#root .ref-page .module-heading{margin:8px 0 12px}
#root .ref-page .workout-estimate{border-top:1px solid #17598a;margin-top:10px;padding-top:7px}
#root .ref-page .workout-estimate p{margin:6px 0}
#root .ref-page .workout-estimate summary{cursor:pointer;color:#74d4ff;min-height:44px;display:flex;align-items:center}
#root .ref-page .workout-estimate a{color:#82d7ff}
#root .ref-page .meal-section>h3{font-size:14px}
#root .ref-page .meal-section :is(.meal-section-preview,.meal-section-total){font-size:12px}
#root .ref-page .adaptive-expanded :is(p,small,td,th,.fine){font-size:16px;line-height:1.55}
#root .ref-page .adaptive-expanded h2{font-size:23px}
#root .ref-page .adaptive-expanded h3{font-size:20px}
#root .ref-page .adaptive-expanded :is(button,input,select,textarea){font-size:16px}
#root .ref-page .adaptive-expanded.metric .ring{max-width:220px}
#root .ref-page .adaptive-expanded.metric .ring strong{font-size:32px}
@media(min-width:1251px){
 #root .topbar{flex-wrap:nowrap;gap:8px;padding:5px 18px;min-height:66px}
 #root .topbar nav{order:0;flex-basis:auto;gap:4px}
 #root .topbar nav button{font-size:12px;min-width:83px;min-height:54px;padding:6px}
 #root .topbar .brand{min-width:145px}
}
@media(max-width:760px){
 #root main.ref-page{padding:8px 12px 100px}
 #root .ref-page :is(p,small,.fine,td,th){font-size:14px}
 #root .ref-page .ref-training-rings{grid-template-columns:repeat(2,minmax(0,1fr))}
 #root .ref-page .metric h2{font-size:12px}
 #root .ref-page .ring strong{font-size:20px}
 #root .ref-page .ref-heading h1,#root .ref-page .module-heading h1{font-size:25px}
 #root .topbar nav button{min-width:84px;font-size:12px;min-height:54px;padding:6px}
 #root .ref-page .adaptive-expanded :is(p,small,td,th,.fine){font-size:16px}
}

/* Image-reference composition: shared overview, original detail controls retained. */
#root main.ref-page{max-width:1760px;padding-top:5px;background:radial-gradient(ellipse at 35% 0,#06335d50,transparent 75%)}
#root .ref-page .panel{border-color:#12578b;border-radius:6px;box-shadow:inset 0 1px 3px #3bafff12,0 0 7px #00173020;background:linear-gradient(115deg,#07345e,#06294e)}
#root .ref-page .ref-panel{padding:10px}
#root .ref-page .ref-panel>h2{font-size:15px;margin-bottom:8px;gap:7px}
#root .ref-page .ref-panel>h2>.icon{width:20px;height:20px}
#root .ref-page .test-strip{font-size:10px;min-height:26px;margin:0;opacity:.85}
#root .ref-page .test-strip button{font-size:12px;min-height:30px}
#root .ref-page .ref-heading,#root .ref-page .module-heading{margin:7px 0 10px}
#root .ref-page .ref-heading h1,#root .ref-page .module-heading h1{font-size:28px;line-height:1.2;letter-spacing:-.4px}
#root .ref-page .metric{padding:7px 5px;background:linear-gradient(125deg,#07345f,#05284e);border-color:#145585;box-shadow:inset 0 0 9px #18a6ed0c}
#root .ref-page .metric h2{font-size:12px;min-height:25px}
#root .ref-page .ref-rings>.metric:not(.adaptive-expanded)>.ring{max-width:112px}
#root .ref-page .metric>p{margin-top:3px}
#root .ref-page .metric.green h2>.icon{color:#00dda8}#root .ref-page .metric.blue h2>.icon{color:#06a6ff}#root .ref-page .metric.yellow h2>.icon{color:#ffd140}#root .ref-page .metric.red h2>.icon{color:#ff5d80}
#root .ref-page .ref-dashboard-top{grid-template-columns:minmax(0,6fr) minmax(180px,1.25fr);gap:8px;margin-bottom:8px}
#root .ref-page .ref-rings{gap:6px}
#root .ref-page .ref-checklist li{padding:6px 0;font-size:12px}
#root .ref-dashboard-layout{display:grid;grid-template-columns:1fr 1.04fr 1.1fr;grid-template-areas:'meals body goals' 'meals training assist';gap:8px;align-items:start}
#root .ref-dashboard-meals{grid-area:meals}#root .ref-dashboard-body{grid-area:body}#root .ref-dashboard-goals{grid-area:goals}#root .ref-dashboard-training{grid-area:training}
#root .ref-dashboard-assist{grid-area:assist;display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:stretch}
#root .ref-dashboard-assist .ref-coach-copy{flex-direction:column;align-items:flex-start;padding:5px;margin:5px 0}
#root .ref-dashboard-assist .coach-avatar{height:58px;width:48px;min-width:48px;align-self:center}
#root .ref-dashboard-assist .ref-coach-copy p{font-size:12px}
#root .ref-dashboard-assist .quick-grid{gap:5px;margin:0}
#root .ref-dashboard-assist .quick-grid button{font-size:11px;min-height:56px;padding:5px 3px;line-height:1.3}
#root .ref-dashboard-assist .quick-grid button>.icon{height:20px;width:20px}
#root .ref-dashboard-layout .ref-goal{margin:7px 0;gap:4px;font-size:12px}
#root .ref-dashboard-layout .ref-goal small{font-size:10px;grid-column:1/-1}
#root .ref-weight-summary{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:center}
#root .ref-weight-summary .ref-weight{margin:6px 0;gap:5px}#root .ref-weight-summary .ref-weight>strong{font-size:30px}
#root .ref-weight-summary .ref-weight>span{font-size:12px;color:#9fc6e7}
#root .ref-weight-summary .ref-facts{grid-template-columns:1fr;margin:0;gap:0}
#root .ref-weight-summary .ref-facts>div{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:5px 0}
#root .ref-weight-summary .ref-facts dd{font-size:12px;margin:0}#root .ref-weight-summary .ref-facts dt{font-size:12px}
#root .ref-panel-footer,#root .ref-inline-actions{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap;margin-top:8px}
#root .ref-inline-detail{flex:1;min-width:140px}#root .ref-inline-detail summary{cursor:pointer;color:#65caff;font-size:12px;padding:8px;text-align:right}
#root .ref-inline-detail[open]{flex-basis:100%}
#root .ref-training-title{display:flex;gap:10px;align-items:center;margin:5px 0 10px}#root .ref-training-title>.icon{width:40px;height:40px;padding:6px;background:#094779;border-radius:50%}
#root .ref-stat-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:8px 0}
#root .ref-stat-chips>div{display:flex;align-items:center;gap:5px;min-width:0;padding:7px;border:1px solid #135480;border-radius:5px;background:#063054}
#root .ref-stat-chips span{font-size:10px;color:#a6c7e4}#root .ref-stat-chips strong{display:block;color:#e7f5ff;font-size:13px}
#root .ref-stat-chips .icon{width:20px;height:20px}
#root .ref-utility{margin:10px 0;border:1px solid #145080;border-radius:6px;background:#062a4d}
#root .ref-utility>summary{cursor:pointer;padding:12px;color:#c4e5fc;font-size:13px;min-height:44px}
#root .ref-utility>summary>span{float:right;color:#82afd1;font-size:12px}
#root .ref-utility>.panel{margin:6px;padding:12px}
#root .ref-utility:not([open])>*:not(summary){display:none}
#root .ref-page footer{margin-top:12px;padding-top:10px}
#root .ref-page .adaptive-expanded{box-shadow:0 20px 70px #0008}
@media(min-width:1100px){
 #root .topbar{flex-wrap:nowrap;gap:8px;padding:4px 18px;min-height:56px}
 #root .topbar nav{order:0;flex-basis:auto;gap:4px}
 #root .topbar nav button{font-size:11px;min-width:74px;min-height:47px;padding:4px;gap:3px}
 #root .topbar nav button>.icon{width:19px;height:19px}
 #root .topbar .brand{min-width:145px}#root .topbar .brand-name{font-size:24px}
}
@media(max-width:1099px){
 #root .ref-page .ref-dashboard-top{grid-template-columns:1fr}
 #root .ref-dashboard-layout{grid-template-columns:1fr 1fr;grid-template-areas:'meals body' 'meals training' 'goals assist'}
}
@media(max-width:760px){
 #root .ref-dashboard-layout{grid-template-columns:1fr;grid-template-areas:'meals' 'goals' 'body' 'training' 'assist'}
 #root .ref-page .ref-dashboard-top .ref-rings{grid-template-columns:repeat(3,minmax(0,1fr))}
 #root .ref-utility>summary>span{float:none;display:block;margin-left:16px;margin-top:3px}
 #root .ref-page .metric h2{font-size:12px;min-height:25px}
 #root .ref-page .adaptive-expanded :is(p,small,td,th,.fine){font-size:16px}
}

/* Training: two overview panels and three supporting panels as in the reference. */
#root .ref-training-overview{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:start;margin-bottom:8px}
#root .ref-training-bottom{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px;align-items:start}
#root .ref-composition{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:10px}
#root .ref-composition .ref-facts{grid-template-columns:1fr;margin:0 0 6px}
#root .ref-composition .ref-facts>div{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0}
#root .ref-composition .ref-facts dd{font-size:12px;text-align:right;flex-shrink:0}
#root .ref-composition .ref-facts dt{font-size:11px}
#root .ref-composition .ref-rings .metric h2{font-size:11px}
#root .ref-composition .ref-rings .ring strong{font-size:18px}
#root .ref-composition .ref-rings .ring{max-width:92px}
#root .ref-composition .ref-trend{margin:8px 0}
#root .ref-training-overview .panel-heading{gap:5px;margin-bottom:8px}
#root .ref-training-bottom .ref-event-list article{padding:6px;gap:6px}
#root .ref-training-bottom .ref-event-list h3{font-size:12px}
#root .ref-training-bottom .ref-event-list :is(p,small){font-size:11px}
#root .ref-training-bottom .ref-tip{border-top:1px solid #145080;margin-top:10px;padding-top:8px}
#root .ref-training-bottom .ref-coach-copy{padding:6px;gap:6px}
#root .ref-training-bottom .ref-coach-copy .coach-avatar{width:45px;min-width:45px;height:58px}
#root .ref-utility>.ref-two-columns{padding:8px}
@media(max-width:1150px){#root .ref-composition{grid-template-columns:1fr}#root .ref-composition .ref-facts{grid-template-columns:1fr 1fr}}
@media(max-width:760px){#root .ref-training-overview,#root .ref-training-bottom{grid-template-columns:1fr}#root .ref-composition .ref-facts{grid-template-columns:1fr}}

/* Coach: narrow personal column, daily overview, meal and recovery guidance. */
#root .ref-coach-layout{display:grid;grid-template-columns:.8fr 1.25fr 1.15fr;gap:8px;align-items:start}
#root .ref-page .ref-column{gap:8px}
#root .ref-page .ref-coach-top{grid-template-columns:2fr 1.1fr;gap:8px;margin-bottom:8px;align-items:stretch}
#root .ref-coach-top>.ref-panel .ref-coach-copy{margin:0 0 6px;padding:6px}
#root .ref-coach-top>.ref-panel .coach-avatar{width:50px;min-width:50px;height:70px}
#root .ref-status-tiles,#root .ref-action-tiles,#root .ref-focus-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
#root .ref-status-tiles article,#root .ref-action-tiles article{border:1px solid #125583;background:#062d51;border-radius:5px;padding:8px 5px;text-align:center;min-width:0}
#root .ref-status-tiles article>.icon,#root .ref-action-tiles article>.icon{width:30px;height:30px;margin-bottom:6px}
#root .ref-status-tiles h3,#root .ref-action-tiles h3{font-size:12px;margin-bottom:7px;hyphens:auto}
#root .ref-status-tiles strong{font-size:13px;display:block}
#root .ref-status-tiles p,#root .ref-action-tiles p{font-size:11px;line-height:1.4;margin:4px 0;color:#a9c7e3}
#root .ref-action-tiles article{display:flex;flex-direction:column;align-items:center;gap:4px}
#root .ref-action-tiles p{flex:1}
#root .ref-action-tiles button{font-size:10px;padding:4px;gap:3px;white-space:normal;line-height:1.3;width:100%}
#root .ref-action-tiles button>.icon{display:none}
#root .ref-focus-tiles button{display:flex;flex-direction:column;align-items:center;padding:8px 4px;font-size:11px;gap:7px;min-height:78px}
#root .ref-focus-tiles button>.icon{width:28px;height:28px}
#root .ref-focus-tiles button:nth-child(1){color:#b09eff}#root .ref-focus-tiles button:nth-child(2){color:#74cfff}#root .ref-focus-tiles button:nth-child(3){color:#78d9ff}#root .ref-focus-tiles button:nth-child(4){color:#ff92b4}
#root .ref-coach-data .ref-facts{grid-template-columns:1fr}
#root .ref-meal-suggestion{display:flex;gap:12px;align-items:center;padding:10px 0}
#root .ref-meal-suggestion>.icon{width:50px;height:50px;flex-shrink:0;padding:9px;background:#084672;border-radius:8px}
#root .ref-coach-layout .module-tabs{display:flex;gap:6px;margin:8px 0}
#root .ref-coach-layout .module-tabs button{flex:1;font-size:12px}
@media(max-width:1150px){#root .ref-coach-layout{grid-template-columns:.8fr 1.3fr}#root .ref-coach-layout>.ref-column:last-child{grid-column:1/-1;grid-template-columns:1fr 1fr}#root .ref-coach-layout>.ref-column:last-child>.panel:first-child{grid-row:span 2}#root .ref-page .ref-coach-top{grid-template-columns:1fr}}
@media(max-width:760px){#root .ref-coach-layout,#root .ref-coach-layout>.ref-column:last-child{grid-template-columns:1fr}#root .ref-coach-layout>.ref-column:last-child{grid-column:1}#root .ref-status-tiles,#root .ref-action-tiles{grid-template-columns:1fr 1fr}#root .ref-action-tiles p,#root .ref-status-tiles p{font-size:12px}#root .ref-action-tiles button{font-size:12px}}

/* Recovery keeps measurements above the activity, body and hydration panels. */
#root .ref-recovery-layout{display:grid;grid-template-columns:1.7fr 1fr;grid-template-rows:auto 1fr;grid-template-areas:'metrics aside' 'content aside';gap:8px;align-items:start}
#root .ref-recovery-metrics{grid-area:metrics}#root .ref-recovery-content{grid-area:content}#root .ref-recovery-aside{grid-area:aside}
#root .ref-recovery-content>.ref-two-columns{gap:8px;align-items:stretch}
#root .ref-recovery-body{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-items:center}
#root .ref-recovery-body .ref-body-figure{max-height:170px;margin:0}
#root .ref-page .ref-recovery-body p{font-size:12px;line-height:1.4}
#root .ref-recovery-content .ref-facts{grid-template-columns:1fr}
#root .ref-hydration{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;align-items:center}
#root .ref-page .ref-hydration .metric{background:transparent;border:0;box-shadow:none;padding:4px}
#root .ref-page .ref-hydration .metric h2{display:none}#root .ref-page .ref-hydration .ring{max-width:120px}
#root .ref-page .ref-hydration .ref-facts>div{display:flex;justify-content:space-between;gap:6px;font-size:12px}
#root .ref-page .ref-hydration :is(dt,dd){font-size:12px}
#root .ref-page .ref-hydration button{font-size:12px;padding:6px}
#root .ref-recovery-checks{display:grid;gap:4px}
#root .ref-page .ref-recovery-checks button{justify-content:flex-start;text-align:left;background:#062d52;font-size:12px;padding:6px 10px}
#root .ref-recovery-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
#root .ref-recovery-options article{display:flex;flex-direction:column;gap:5px;align-items:flex-start;min-width:0;border:1px solid #125380;border-radius:5px;padding:8px 6px;background:#062d51}
#root .ref-recovery-options article>.icon{align-self:center;width:40px;height:40px;margin:4px}
#root .ref-page .ref-recovery-options h3{font-size:12px}#root .ref-page .ref-recovery-options p{font-size:11px;flex:1;margin:3px 0}
#root .ref-page .ref-recovery-options button{font-size:11px;padding:5px;white-space:normal;line-height:1.3;width:100%}
#root .ref-page .ref-recovery-options button>.icon{display:none}
#root .ref-next-steps{padding-left:24px;color:#b7d6ee;margin:5px 0}#root .ref-next-steps li{padding:4px;font-size:12px}
#root .ref-recovery-aside .ref-coach-copy{padding:6px;gap:6px;margin:4px 0}
#root .ref-recovery-aside .coach-avatar{width:48px;min-width:48px;height:64px}
@media(max-width:1100px){#root .ref-recovery-layout{grid-template-columns:1fr;grid-template-areas:'metrics' 'content' 'aside'}#root .ref-recovery-aside{grid-template-columns:1fr 1fr}}
@media(max-width:760px){#root .ref-recovery-aside{grid-template-columns:1fr}#root .ref-page .ref-recovery-options p{font-size:12px}#root .ref-page .ref-recovery-options button{font-size:12px}}

/* Settings: profile / wide goals / units, four compact preference groups. */
#root .ref-settings-layout{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;align-items:start}
#root .ref-settings-profile,#root .ref-settings-units,#root .ref-settings-small{grid-column:span 3}
#root .ref-settings-targets{grid-column:span 6}
#root .ref-settings-layout>.ref-settings-integrations{grid-column:span 9}
#root .ref-settings-data{grid-column:span 3}
#root .ref-profile-head{display:flex;gap:10px;align-items:center}
#root .ref-profile-head .ref-profile-avatar{flex-shrink:0;margin:4px 0}
#root .ref-page .ref-profile-head p{font-size:11px;margin:4px 0}
#root .ref-goal-settings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
#root .ref-goal-settings article{background:#062c50;border:1px solid #11517f;border-radius:5px;padding:10px 6px;display:flex;flex-direction:column;gap:8px;min-width:0;align-items:center;text-align:center}
#root .ref-goal-settings article>.icon{width:26px;height:26px}
#root .ref-page .ref-goal-settings h3{font-size:12px}
#root .ref-goal-settings strong{font-size:20px;line-height:1.25;flex:1}
#root .ref-goal-settings span{font-size:10px;color:#a7c8e2}
#root .ref-setting-rows{display:grid;gap:0;margin:5px 0}
#root .ref-setting-rows>div{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #164c75}
#root .ref-page .ref-setting-rows :is(dt,dd){font-size:12px;margin:0}
#root .ref-setting-rows dd{color:#a8cae4;text-align:right}
#root .ref-setting-rows dt{color:#d0e7f8}
#root .ref-page .ref-settings-small p{font-size:12px}
#root .ref-visible-nutrients{list-style:none;padding:0;margin:0 0 8px}
#root .ref-visible-nutrients li{display:flex;align-items:center;gap:6px;border-bottom:1px solid #164c75;padding:4px;font-size:12px}
#root .ref-visible-nutrients li>.icon{height:17px;width:17px}
#root .ref-visible-nutrients li>.icon:last-child{margin-left:auto}
#root .ref-settings-small .ref-theme-swatch{height:35px;margin:8px 0}
#root .ref-color-dot{display:inline-block;width:19px;height:19px;background:#00a7ef;border-radius:50%;border:2px solid #67cfff;vertical-align:middle}
#root .ref-page .ref-settings-layout .ref-panel>button,#root .ref-settings-data button{font-size:12px;padding:7px 9px}
#root .ref-settings-data .module-card{padding:10px;gap:6px;display:flex;flex-direction:column}
#root .ref-page .ref-settings-data .module-card p{font-size:11px;margin:0}
#root .ref-settings-data .module-card button{justify-content:flex-start;text-align:left}
#root .ref-settings-advanced{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:8px;align-items:start}
#root .ref-settings-advanced>.module-card:last-child{grid-column:1/-1}
#root .ref-settings-layout .ref-integrations{grid-template-columns:1.4fr 1fr;align-items:start}
@media(max-width:1150px){#root .ref-settings-profile,#root .ref-settings-units{grid-column:span 4}#root .ref-settings-targets{grid-column:span 8}#root .ref-settings-small{grid-column:span 4}#root .ref-settings-layout>.ref-settings-integrations{grid-column:span 8}#root .ref-settings-data{grid-column:span 4}#root .ref-settings-layout .ref-integrations{grid-template-columns:1fr}}
@media(max-width:760px){#root .ref-settings-layout{grid-template-columns:1fr}#root .ref-settings-layout>*{grid-column:1!important}#root .ref-goal-settings{grid-template-columns:1fr 1fr}#root .ref-settings-advanced{grid-template-columns:1fr}#root .ref-page .ref-setting-rows :is(dt,dd){font-size:14px}#root .ref-page .ref-settings-layout .ref-panel>button,#root .ref-settings-data button{font-size:14px}}

/* Compact connection management and account controls. */
#root .ref-settings-data .module-card>button{margin:0;width:100%;padding:6px 9px}
#root .ref-page .ref-settings-data .module-card>h2{font-size:15px;margin-bottom:3px}
#root .ref-page .ref-export-info summary{font-size:12px;color:#a7cbe8;cursor:pointer;min-height:30px;padding:4px 0}
#root .ref-access-detail{border:1px solid #145383;border-radius:5px;background:#062e53}
#root .ref-access-detail>summary{cursor:pointer;padding:12px;font-size:13px}
#root .ref-access-detail>.module-card{margin:5px;border:0}
#root .ref-integrations .google-auto-overview{padding:8px;background:#062a4a;border:1px solid #125585;border-radius:5px;margin:8px 0}
#root .ref-page .google-auto-overview h4{font-size:13px;color:#65dfbf;margin:0}
#root .ref-page .ref-integrations article p{margin:6px 0;font-size:12px}
#root .ref-page .ref-integrations article button{font-size:12px;padding:6px 8px;min-height:36px}
#root .ref-page .ref-integrations article details{font-size:12px;margin:7px 0}
#root .ref-page .ref-integrations article summary{cursor:pointer;padding:6px 0}
#root .ref-page .ref-integrations .dialog-actions{margin:6px 0;gap:6px;justify-content:flex-start;flex-wrap:wrap}
#root .ref-page .ref-coach-data .ref-facts>div{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0}
#root .ref-page .ref-coach-data .ref-facts dd{font-size:12px;text-align:right}
#root .ref-coach-layout>.ref-column:nth-child(2)>.panel:last-child .ref-coach-copy{margin:5px 0;padding:5px;gap:6px}
#root .ref-coach-layout>.ref-column:nth-child(2)>.panel:last-child .coach-avatar{height:55px;width:42px;min-width:42px}
#root .ref-page .ref-coach-layout>.ref-column:nth-child(2)>.panel:last-child .ref-coach-copy p{font-size:12px}
@media(max-width:760px){#root .ref-page .ref-integrations article button{min-height:44px;font-size:14px}}
