/* P19 R5.5 — entry screens only. Real content; no screenshot-based UI.
   The two approved PNGs are byte-identical originals. CSS selects their
   photographic panels and excludes gutters/labels; no recoloring or zoom crop.
   Base geometry is mobile 390px, with natural vertical scroll on short screens. */
:root { --r55-width:min(100vw,430px); --r55-bg:#03121e; --r55-line:#195273; --r55-muted:#a9cee5; }
#app .app-frame { padding-bottom:0!important; }
#app .app-frame>.screen { padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))!important; }
#app .gts-primary {
  background:var(--r55-bg)!important;
  margin:0 auto!important;
  border-radius:0!important;
  overflow:clip!important;
  min-height:100dvh!important;
}
#app .gts-primary::before { display:none!important; }
#app .gts-primary-backdrop {
  position:absolute; top:0; left:0; width:100%; height:calc(var(--r55-width) * 0.708);
  overflow:hidden; pointer-events:none; z-index:0;
  background:var(--r55-bg);
}
#app .gts-primary-backdrop img {
  position:absolute; display:block; max-width:none!important;
  width:301.666667%; height:auto!important; left:0; top:calc(var(--r55-width) * -0.12083333);
  opacity:1!important; filter:none!important; transform:none!important;
}
#app .gts-backdrop-treino { height:calc(var(--r55-width) * 0.7390000000000001); }
#app .gts-backdrop-treino img { width:314.782609%; left:calc(var(--r55-width) * -1.07246377); top:calc(var(--r55-width) * -0.12608696); }
#app .gts-backdrop-cardio { height:calc(var(--r55-width) * 0.716); }
#app .gts-backdrop-cardio img { width:305.05618%; left:calc(var(--r55-width) * -2.0505618); top:calc(var(--r55-width) * -0.12219101); }
#app .gts-primary>.app-header {
  min-height:72px!important; padding:calc(12px + env(safe-area-inset-top,0px)) 18px 10px!important;
  background:transparent!important; border:0!important; box-shadow:none!important;
  position:relative!important; z-index:2!important; gap:8px!important;
}
#app .gts-primary .brand-lockup { padding:0!important; gap:9px!important; min-width:0; flex:1; text-align:left; }
#app .gts-primary .brand-mark { width:38px!important; height:38px!important; flex:0 0 38px; }
#app .gts-primary .brand-copy { min-width:0; }
#app .gts-primary .brand-copy h1 { font-size:16px!important; line-height:1.2!important; white-space:nowrap; }
#app .gts-primary .brand-copy p { font-size:9px!important; line-height:1.4!important; white-space:normal; }
#app .gts-primary .sync-pill {
  max-width:122px; flex:0 1 auto; text-align:center; justify-content:center;
  font-size:9px!important; line-height:1.3; padding:5px 8px!important;
  color:#b8d9ec!important; border-color:#315775!important; background:#092033!important;
}
#app .gts-primary .sync-pill i { background:currentColor!important; box-shadow:none!important; flex-shrink:0; }
#app .gts-primary .sync-pill.ok { color:#00e4a4!important; border-color:#008864!important; background:#04251e!important; }
#app .gts-primary .sync-pill.warning,#app .gts-primary .sync-pill.pending { color:#ffc364!important; border-color:#996b2c!important; background:#322412!important; }
#app .gts-primary>.screen {
  position:relative!important; z-index:1!important;
  flex:0 0 auto!important; align-content:start!important;
  width:100%!important; min-height:0!important; height:auto!important;
  padding:0 16px calc(82px + env(safe-area-inset-bottom,0px))!important;
  margin:0!important; background:transparent!important;
}
#app .gts-primary h2 { letter-spacing:-.025em!important; }
#app .gts-primary .r4-home { display:grid!important; gap:14px!important; }
#app .gts-primary .r4-home-hero {
  min-height:182px!important; padding:10px 3px 0!important;
  background:transparent!important; margin:0!important;
}
#app .gts-primary .r4-hero-copy h2 { font-size:28px!important; line-height:1.15!important; margin:0 0 4px!important; }
#app .gts-primary .r4-hero-copy p { font-size:12px!important; line-height:1.4!important; margin:0 0 24px!important; }
#app .gts-primary .r4-hero-metrics {
  display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important; margin:0 0 10px!important;
}
#app .gts-primary .r4-hero-metrics>span {
  min-width:0!important; min-height:70px!important; padding:10px 3px!important;
  align-items:center!important; justify-content:center!important;
  border:1px solid #246387!important; border-radius:11px!important;
  background:linear-gradient(130deg,rgba(1,18,30,.93),rgba(3,26,43,.88))!important;
  backdrop-filter:none!important; box-shadow:inset 0 1px #17415a!important;
}
#app .gts-primary .r4-hero-metrics b { font-size:19px!important; line-height:1.2!important; white-space:nowrap!important; font-weight:750!important; }
#app .gts-primary .r4-hero-metrics small { font-size:11px!important; margin-top:5px!important; }
#app .gts-primary .r4-hero-meta { display:block; font-size:10px!important; line-height:1.4!important; color:#a9daef!important; }
#app .gts-primary .r4-next-card {
  width:100%!important; display:grid!important; grid-template-columns:53px minmax(0,1fr) 18px!important;
  grid-template-rows:auto auto!important; column-gap:12px!important; row-gap:8px!important;
  padding:11px 12px!important; margin:0!important; min-height:99px!important;
  align-items:center!important; border-radius:9px!important; border:1px solid #008cff!important;
  background:linear-gradient(110deg,#032a5a 0%,#063c84 60%,#0755ba 100%)!important;
  box-shadow:inset 0 1px 0 #1c77c1,0 0 10px #006dff12!important; text-align:left!important;
}
#app .gts-primary .r54-next-title { position:static!important; grid-column:1/-1; grid-row:1; font-size:10px!important; letter-spacing:.09em!important; color:#00caff!important; }
#app .gts-primary .r4-next-day { grid-column:1; grid-row:2; width:53px!important; height:49px!important; font-size:23px!important; border-radius:9px!important; background:linear-gradient(140deg,#00aaff,#0068ee)!important; }
#app .gts-primary .r54-next-copy { grid-column:2; grid-row:2; min-width:0; padding:0!important; }
#app .gts-primary .r54-next-copy b { display:block!important; font-size:16px!important; line-height:1.2!important; }
#app .gts-primary .r54-next-copy em { display:block!important; font-size:11px!important; line-height:1.4!important; margin-top:4px; font-style:normal!important; color:#d9ecff!important; }
#app .gts-primary .r4-next-card>i { grid-column:3; grid-row:2; position:static!important; font-size:30px!important; font-style:normal!important; color:#e9f8ff!important; }
#app .gts-primary .r4-week-card { padding:0 3px!important; margin:0!important; background:transparent!important; border:0!important; box-shadow:none!important; }
#app .gts-primary .r4-week-card>.eyebrow { margin:0 0 9px!important; color:#00caff!important; font-size:10px!important; letter-spacing:.07em; }
#app .gts-primary .week-strip { display:grid!important; grid-template-columns:repeat(7,minmax(0,1fr))!important; gap:6px!important; padding:0!important; margin:0!important; background:none!important; }
#app .gts-primary .week-day {
  min-width:0!important; min-height:73px!important; padding:7px 1px 5px!important;
  display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:flex-start!important; gap:2px!important;
  border:1px solid #163f57!important; border-radius:8px!important; background:linear-gradient(140deg,#062134,#011019)!important;
}
#app .gts-primary .week-day small { font-size:9px!important; line-height:1.2!important; text-transform:uppercase; color:#b4d9ef!important; }
#app .gts-primary .week-day b { font-size:18px!important; line-height:1.4!important; color:white!important; }
#app .gts-primary .week-day span,#app .gts-primary .week-day i { font-size:8px!important; line-height:1.1!important; color:#00e9a0!important; font-style:normal!important; overflow-wrap:anywhere; }
#app .gts-primary .week-day.today { border-color:#00b8ff!important; box-shadow:0 0 12px #008eff65,inset 0 0 8px #007aff25!important; }
#app .gts-primary .r4-quick-kpis { display:grid!important; grid-template-columns:1fr 1fr 1.2fr!important; gap:7px!important; margin:0!important; }
#app .gts-primary .r4-quick-kpis>span {
  display:grid!important; grid-template-columns:29px minmax(0,1fr)!important; grid-template-rows:auto auto!important;
  column-gap:5px!important; row-gap:2px!important; min-width:0!important; min-height:61px!important; padding:8px 6px!important;
  align-content:center!important; align-items:center!important; text-align:left!important;
  border:1px solid #1a5270!important; border-radius:10px!important; background:linear-gradient(120deg,#052435,#01131e)!important;
}
#app .gts-primary .r4-quick-kpis .kpi-icon { grid-column:1; grid-row:1/3; display:grid!important; place-items:center; width:28px!important; height:32px!important; }
#app .gts-primary .r4-quick-kpis .kpi-icon svg { width:28px!important; height:28px!important; fill:currentColor!important; filter:drop-shadow(0 0 5px currentColor)!important; }
#app .gts-primary .r4-quick-kpis>span>b { grid-column:2; grid-row:1; display:block!important; font-size:16px!important; line-height:1.2!important; color:#f7fbff!important; white-space:nowrap; }
#app .gts-primary .r4-quick-kpis>span>small { grid-column:2; grid-row:2; font-size:9px!important; line-height:1.3!important; color:#b3d6eb!important; }
#app .gts-primary .r4-quick-kpis .strength { color:#058fff!important; }
#app .gts-primary .r4-quick-kpis .cardio { color:#00df91!important; }
#app .gts-primary .r4-quick-kpis .energy { color:#ffa018!important; }
#app .gts-primary .r4-quick-kpis .energy>b { font-size:14px!important; }
#app .gts-primary .r4-recovery {
  display:grid!important; grid-template-columns:38px minmax(0,1fr) 14px!important; align-items:center!important; gap:10px!important;
  min-height:80px!important; padding:9px 10px!important; margin:0!important; text-align:left!important;
  background:linear-gradient(110deg,#321600,#613200 65%,#855000)!important;
  border:1px solid #df8909!important; border-radius:11px!important;
}
#app .gts-primary .r55-recovery-icon { width:36px; height:38px; border-radius:11px; background:linear-gradient(145deg,#ff7640,#ad250d); display:grid; place-items:center; box-shadow:0 0 14px #e94b2630; }
#app .gts-primary .r55-recovery-icon svg { width:23px; height:23px; fill:#fff; }
#app .gts-primary .r4-recovery small { display:block; color:#ffd02c!important; font-size:9px!important; line-height:1.4!important; }
#app .gts-primary .r4-recovery b { display:block; font-size:13px!important; line-height:1.3!important; margin:4px 0 2px; }
#app .gts-primary .r4-recovery span>span { font-size:11px!important; line-height:1.3; }
#app .gts-primary .r4-home-foot { margin:0!important; padding:0 3px!important; }
#app .gts-primary .r4-home-foot small { font-size:10px!important; line-height:1.4; }

/* Selection screens share the same visual language, not the session layout. */
#app .gts-primary .training-hero,#app .gts-primary .r52-cardio-home>.app-hero {
  min-height:96px!important; padding:16px 3px 14px!important; margin:0!important;
  background:transparent!important; border:0!important; box-shadow:none!important;
}
#app .gts-primary .training-hero h2,#app .gts-primary .r52-cardio-home>.app-hero h2 { font-size:28px!important; line-height:1.15!important; margin:0 0 5px!important; }
#app .gts-primary .training-hero p,#app .gts-primary .r52-cardio-home>.app-hero p { font-size:12px!important; line-height:1.4!important; }
#app .gts-primary .r52-cardio-home>.app-hero { min-height:138px!important; }
#app .gts-primary .r52-cardio-home { display:block!important; }
#app .gts-primary .r52-cardio-home>.app-hero small { display:block; margin-top:7px; font-size:10px!important; color:#a8d6ee!important; }
#app .gts-primary .training-day-list { gap:9px!important; margin:0!important; }
#app .gts-primary .training-day-card {
  grid-template-columns:50px minmax(0,1fr) 16px!important; gap:12px!important;
  min-height:72px!important; height:auto!important; padding:9px 12px!important;
  border:1px solid #225879!important; border-radius:12px!important;
  background:linear-gradient(115deg,#041a2a,#082b40)!important; box-shadow:inset 0 1px #1c4052!important;
}
#app .gts-primary .training-day-card .day-badge { width:49px!important; min-width:49px!important; height:49px!important; font-size:21px!important; background:linear-gradient(130deg,#235985,#123350)!important; box-shadow:none!important; }
#app .gts-primary .training-day-card b { font-size:16px!important; line-height:1.25!important; }
#app .gts-primary .training-day-card small { font-size:10px!important; line-height:1.4!important; margin-top:3px; }
#app .gts-primary .training-day-card.suggested { border-color:#00b9ff!important; background:linear-gradient(105deg,#034887,#031d3b 80%,#024e7a)!important; box-shadow:0 0 13px #008eff66,inset 0 0 12px #008cff30!important; }
#app .gts-primary .training-day-card.suggested .day-badge { background:linear-gradient(140deg,#00b9ff,#0067e9)!important; color:white!important; box-shadow:0 0 10px #008dff66!important; }
#app .gts-primary .retrospective-cta {
  min-height:70px!important; margin:22px 0 0!important; padding:12px!important; font-size:16px!important;
  background:linear-gradient(115deg,#043350,#031728)!important; border-color:#00b5f4!important; box-shadow:inset 0 1px #165677!important;
}
#app .gts-primary .retrospective-icon { width:28px!important; height:28px!important; }
#app .gts-primary .r52-cardio-days { gap:7px!important; margin:0!important; padding:0!important; }
#app .gts-primary .r52-cardio-days button {
  min-height:50px!important; height:auto!important; grid-template-columns:39px minmax(0,1fr) 15px!important;
  align-items:center!important; column-gap:12px!important; padding:6px 11px!important;
  background:linear-gradient(110deg,rgba(4,24,39,.92),rgba(4,32,48,.95))!important;
  border:1px solid #205978!important; border-radius:10px!important;
}
#app .gts-primary .r52-cardio-days .day-badge { min-width:37px!important; width:37px!important; height:37px!important; font-size:17px!important; background:linear-gradient(135deg,#25618d,#123655)!important; }
#app .gts-primary .r52-cardio-days .day-copy { min-width:0; text-align:left; }
#app .gts-primary .r52-cardio-days .day-copy b { font-size:13px!important; line-height:1.25!important; }
#app .gts-primary .r52-cardio-days button.selected { border-color:#00b8ff!important; box-shadow:0 0 9px #00aaff30,inset 0 0 12px #0087ed30!important; }
#app .gts-primary .r52-cardio-days button.selected .day-badge { background:linear-gradient(130deg,#00b8ff,#0071eb)!important; }
#app .gts-primary .r52-cardio-kpis { margin:20px 0 0!important; background:linear-gradient(120deg,#031f30,#02121e)!important; border-color:#216484!important; }
#app .gts-primary .r52-cardio-kpis span { min-height:100px!important; padding:9px 4px!important; gap:7px!important; }
#app .gts-primary .r52-cardio-kpis b { font-size:19px!important; line-height:1.2!important; white-space:nowrap; }
#app .gts-primary .r52-cardio-kpis small { font-size:11px!important; line-height:1.2!important; }
#app .gts-primary .r52-cardio-kpis span:nth-child(1) { color:#00df9a; }
#app .gts-primary .r52-cardio-kpis span:nth-child(2) { color:#00b6ff; }
#app .gts-primary .r52-cardio-kpis span:nth-child(3) { color:#ffc900; }
#app .gts-primary .r52-cardio-start { width:100%!important; min-height:56px!important; margin-top:12px!important; font-size:17px!important; border:1px solid #00b6ff!important; background:linear-gradient(180deg,#00a9ff,#007af8 55%,#005ed6)!important; box-shadow:inset 0 1px #39caff,0 3px 12px #007aff22!important; }

/* Keep the footer under dialogs, with room for the device's safe area. */
#app .app-frame>.bottom-nav {
  position:fixed!important; left:50%!important; right:auto!important; bottom:0!important;
  transform:translateX(-50%)!important; width:min(100%,430px)!important;
  height:calc(64px + env(safe-area-inset-bottom,0px))!important;
  padding:0 0 env(safe-area-inset-bottom,0px)!important; z-index:40!important;
  background:linear-gradient(180deg,#041725,#010b13)!important;
  border-top:1px solid #1b4058!important; backdrop-filter:none!important;
}
#app .app-frame>.bottom-nav button { min-width:0; min-height:44px; gap:5px!important; color:#749fbe!important; }
#app .app-frame>.bottom-nav button.active { color:#00c1ff!important; }
#app .app-frame>.bottom-nav svg { width:22px!important; height:22px!important; }
#app .app-frame>.bottom-nav span { font-size:10px!important; line-height:1.2!important; }
#app .gts-primary button:focus:not(:focus-visible) { outline:none!important; }
#app .gts-primary button:focus-visible { outline:2px solid #83dfff!important; outline-offset:3px!important; }
@media(max-width:360px) {
  #app .gts-primary>.app-header { padding-left:12px!important; padding-right:12px!important; }
  #app .gts-primary .brand-copy h1 { font-size:14px!important; }
  #app .gts-primary .brand-mark { width:32px!important; height:32px!important; flex-basis:32px; }
  #app .gts-primary .sync-pill { max-width:98px; font-size:8px!important; }
  #app .gts-primary>.screen { padding-left:12px!important; padding-right:12px!important; }
  #app .gts-primary .r4-hero-metrics b { font-size:17px!important; }
  #app .gts-primary .r4-quick-kpis>span { grid-template-columns:23px minmax(0,1fr)!important; padding:7px 4px!important; column-gap:4px!important; }
  #app .gts-primary .r4-quick-kpis .kpi-icon,#app .gts-primary .r4-quick-kpis .kpi-icon svg { width:23px!important; }
  #app .gts-primary .r4-quick-kpis .energy>b { font-size:12px!important; }
  #app .gts-primary .r4-quick-kpis>span>small { font-size:8px!important; }
  #app .gts-primary .training-day-card b { font-size:14px!important; }
  #app .gts-primary .training-day-card { column-gap:9px!important; min-height:66px!important; }
  #app .gts-primary .r52-cardio-kpis b { font-size:16px!important; }
  #app .gts-primary .r52-cardio-days .day-copy b { font-size:12px!important; }
}

/* R5.6 — only the three Home KPI drawings and weekly information card. */
#app .gts-primary .r4-quick-kpis .kpi-icon { width:30px!important; height:38px!important; overflow:visible!important; }
#app .gts-primary .r4-quick-kpis .kpi-icon svg.home-kpi-art { width:30px!important; height:38px!important; overflow:visible!important; filter:drop-shadow(0 0 3px currentColor)!important; }
#app .gts-primary .r56-week-summary {
  margin:2px 0 0!important; padding:13px 11px 14px!important;
  border:1px solid #206183; border-radius:12px;
  background:linear-gradient(115deg,#06283c,#041b2b); box-shadow:inset 0 1px #28618340;
}
#app .gts-primary .r56-week-summary h3 { margin:0 0 12px; color:#38c8ff; font-size:11px; line-height:1.3; letter-spacing:.07em; }
#app .gts-primary .r56-week-values { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
#app .gts-primary .r56-week-values>span { min-width:0; padding-right:5px; border-right:1px solid #20516b; }
#app .gts-primary .r56-week-values>span:last-child { border:0; padding-right:0; }
#app .gts-primary .r56-week-values b { display:block; color:#f0faff; font-size:21px; line-height:1.2; white-space:nowrap; }
#app .gts-primary .r56-week-values b small { font-size:11px!important; color:#9eddf5; }
#app .gts-primary .r56-week-values em { display:block; margin-top:5px; color:#b8d9e9; font-size:10px; line-height:1.35; font-style:normal; }
#app .gts-primary .r56-week-summary p { font-size:10px; color:#ffc56d; margin:10px 0 0; }
@media(max-width:360px) {
  #app .gts-primary .r4-quick-kpis .kpi-icon,#app .gts-primary .r4-quick-kpis .kpi-icon svg.home-kpi-art { width:25px!important; height:33px!important; }
  #app .gts-primary .r56-week-values b { font-size:18px; }
  #app .gts-primary .r56-week-values b small { font-size:9px!important; }
}
