/* BUFF OS v133 — "Apple" appearance: Progress, Train and the 4-tab bar. Only under html.skin-apple. */
.ap-scr .ap-seg { display: flex; padding: 3px; border-radius: 12px; background: rgba(118,118,128,.24); margin-top: 16px; }
.ap-scr .ap-seg button { flex: 1; border: 0; background: none; color: #fff; font: inherit; font-size: 14px; font-weight: 600; padding: 8px 0; border-radius: 9px; cursor: pointer; }
.ap-scr .ap-seg button.on { background: #636366; box-shadow: 0 2px 6px rgba(0,0,0,.35); }
.ap-scr .ap-goalhero { display: flex; align-items: center; gap: 16px; padding: 18px 16px; cursor: pointer; }
.ap-scr .ap-gring { position: relative; width: 132px; height: 132px; flex: none; } .ap-scr .ap-gring svg { position: absolute; inset: 0; }
.ap-scr .ap-gring .in { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } .ap-scr .ap-gring .in b { font-size: 30px; font-weight: 700; letter-spacing: -.04em; } .ap-scr .ap-gring .in small { font-size: 12px; color: #ff6b6f; font-weight: 600; }
.ap-scr .ap-gtx { min-width: 0; } .ap-scr .ap-gtx small { display: block; color: #ff6b6f; font-size: 14px; font-weight: 600; } .ap-scr .ap-gtx b { display: block; font-size: 22px; font-weight: 700; letter-spacing: -.025em; line-height: 1.15; margin: 6px 0; } .ap-scr .ap-gtx span { color: #8e8e93; font-size: 14px; line-height: 1.3; }
.ap-scr .ap-row1 { display: flex; align-items: center; gap: 14px; margin-top: 12px; padding: 14px 16px; border-radius: 24px; background: #1c1c1e; cursor: pointer; }
.ap-scr .ap-row1 .ap-ti { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; flex: none; color: #fff; }
.ap-scr .ap-row1 .tx { flex: 1; min-width: 0; } .ap-scr .ap-row1 .n { font-size: 16px; font-weight: 600; } .ap-scr .ap-row1 .d { font-size: 13px; color: #8e8e93; margin-top: 2px; } .ap-scr .ap-row1 .v { color: #8e8e93; font-size: 14px; white-space: nowrap; } .ap-scr .ap-row1 .v b { color: #fff; font-size: 20px; }
/* the old big titles on these screens are replaced by the Apple header */
html.skin-apple #s-cal > .large-title, html.skin-apple #s-cal > .subtitle, html.skin-apple #s-goal > .large-title, html.skin-apple #s-goal > .subtitle,
html.skin-apple #s-coach > .large-title, html.skin-apple #s-coach > #coachSub, html.skin-apple #s-stretch > .large-title, html.skin-apple #s-stretch > .subtitle,
html.skin-apple #s-gym > .large-title, html.skin-apple #s-gym > .subtitle { display: none !important; }
html.skin-apple #s-cal, html.skin-apple #s-goal, html.skin-apple #s-coach, html.skin-apple #s-gym, html.skin-apple #s-stretch { overflow-x: clip; }
/* four tabs + Andrew */
html.skin-apple #tabbar .tab[data-s="goal"], html.skin-apple #tabbar .tab[data-s="stretch"], html.skin-apple #tabbar .tab[data-s="gym"], html.skin-apple #tabbar .tab[data-s="speech"] { display: none !important; }
html.skin-apple #tabbar { right: 88px !important; max-width: calc(100% - 100px) !important; }
html.skin-apple #tabbar .tab.ap-on { color: var(--ap-gold, #ffd166) !important; background: rgba(255,255,255,.15); border-radius: 26px; }
#apAsk { position: fixed; z-index: 51; right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; color: #ffd166; cursor: pointer;
  background: rgba(52,52,56,.6); border: .5px solid rgba(255,255,255,.16); box-shadow: 0 1px 0 rgba(255,255,255,.18) inset, 0 20px 44px rgba(0,0,0,.65), 0 0 0 2.5px rgba(255,209,102,.22); -webkit-backdrop-filter: blur(40px) saturate(200%); backdrop-filter: blur(40px) saturate(200%); }
#apAsk .ic { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
html:not(.skin-apple) #apAsk { display: none !important; }
html.skin-apple #tabbar .tab[data-s="home"] { order: 1; } html.skin-apple #tabbar .tab[data-s="food"] { order: 2; } html.skin-apple #tabbar .tab[data-s="coach"] { order: 3; } html.skin-apple #tabbar .tab[data-s="cal"] { order: 4; }