/* Impeccable polish for restored four-board shell.
   Visual-only refinement: no DOM, content, routing, data, or training logic changes. */
:root{
  --polish-red:#ff2846;
  --polish-muted:rgba(255,255,255,.68);
  --polish-edge:rgba(255,255,255,.15);
}

html[data-ui="liquid-glass-v2"] body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Display','Helvetica Neue',Arial,sans-serif!important;
}

/* Keep the material quiet and dimensional instead of milky/opaque. */
.next-card,.week-card,.phase-card,.card,.day-exercise,.rest-detail,.training-flow-step,
.training-actuals-card,.stopwatch-card,.an-card,.prompt,.flow-switch,.subnav,.bottom,
.streak,.refresh-plan,.mini-back,.hero.test,.text-link{
  border-top-color:var(--polish-edge)!important;
  box-shadow:0 14px 38px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.11),inset 0 -1px 0 rgba(0,0,0,.08)!important;
}

/* Header controls remain compact but regain usable touch targets. */
.mockup-topbar{
  height:calc(48px + env(safe-area-inset-top))!important;
  padding:calc(5px + env(safe-area-inset-top)) 13px 3px!important;
}
.streak,.refresh-plan{height:40px!important;min-height:40px!important;border-radius:20px!important}
.streak{padding:6px 12px!important;font-size:11px!important;gap:5px!important}.streak b{font-size:13px!important}
.refresh-plan{width:40px!important;min-width:40px!important;font-size:18px!important}

/* Save vertical space through rhythm, not 6px typography. */
.mockup-home{
  height:calc(100dvh - 116px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
  padding:0 12px 4px!important;
  gap:7px!important;
}
.greeting{padding:3px 2px 2px!important}
.greeting h1{font-size:clamp(25px,7vw,30px)!important;line-height:1.02!important;letter-spacing:-.045em!important;text-shadow:0 2px 14px rgba(0,0,0,.22)}
.greeting p{margin-top:4px!important;font-size:12px!important;color:var(--polish-muted)!important}
.mockup-main-card{flex-basis:220px!important;min-height:200px!important}

/* Hero: stronger hierarchy, restrained glow, player remains a separate depth layer. */
.next-card{padding:13px 14px 54px!important;border-radius:24px!important;isolation:isolate}
.next-card::after{
  top:-11px!important;bottom:-9px!important;left:53%!important;right:-12px!important;width:auto!important;
  background-size:auto 105%!important;background-position:right center!important;opacity:.97!important;
  filter:drop-shadow(-8px 10px 16px rgba(0,0,0,.20))!important;
}
.next-label{font-size:10px!important;letter-spacing:.09em!important;color:rgba(255,255,255,.72)!important}
.next-date-nav{margin-top:6px!important;gap:3px!important;width:min(66%,252px)!important}
.next-date-button{font-size:14px!important;color:#fff!important}
.next-arrow{width:30px!important;height:30px!important;font-size:19px!important;color:#fff!important;background:rgba(255,255,255,.035)!important;border-color:rgba(255,255,255,.13)!important}
.session-title{margin-top:3px!important;width:min(67%,254px)!important;font-size:clamp(19px,5.2vw,23px)!important;line-height:1.04!important;color:#fff!important}
.next-meta{margin-top:7px!important;padding-top:6px!important;width:min(67%,254px)!important;font-size:10px!important;line-height:1.2!important;gap:5px!important;color:rgba(255,255,255,.68)!important;border-top-color:rgba(255,255,255,.10)!important}
.hero-start,.hero-view,.hero-complete{width:min(70%,262px)!important}
.hero-start{height:46px!important;min-height:46px!important;margin-top:8px!important;border-radius:23px!important;font-size:14px!important;background:linear-gradient(145deg,#f52d45 0%,#d9112d 62%,#ad071d 100%)!important;box-shadow:0 10px 26px rgba(218,14,45,.34),inset 0 1px 0 rgba(255,255,255,.34)!important}
.hero-start::before{width:32px!important;height:32px!important}.hero-view,.hero-complete{min-height:42px!important}.hero-view{margin-top:6px!important;padding:7px 11px!important;border-radius:21px!important}.hero-view span{font-size:11px!important}.hero-view small{font-size:9px!important}

/* Calendar and progress stay complete but readable. */
.mockup-section-head{min-height:18px!important;margin:0 2px 4px!important}
.mockup-section-head .section-kicker{font-size:9px!important;letter-spacing:.09em!important}
.mockup-section-head .text-link{min-height:26px!important;height:26px!important;padding:4px 9px!important;border-radius:13px!important;font-size:9px!important}
.week-card{padding:8px 9px 9px!important;border-radius:20px!important}
.week-strip{padding:0!important;background:transparent!important}
.week-day{min-height:41px!important;padding:4px 1px 3px!important;border-radius:11px!important;color:rgba(255,255,255,.76)!important}
.week-day strong{font-size:9px!important}.week-day span{font-size:12px!important;width:24px!important;height:24px!important;margin:2px auto 1px!important}.week-day i{width:5px!important;height:5px!important}
.week-day.done i{background:#35ce80!important;box-shadow:0 0 7px rgba(53,206,128,.62)!important}
.week-day.open i,.week-day.planned i{background:#f5a623!important;box-shadow:0 0 7px rgba(245,166,35,.58)!important}
.week-day.alert i{background:#ff4a5f!important;box-shadow:0 0 8px rgba(255,74,95,.66)!important}
.week-day.today,.week-day.selected{background:rgba(255,255,255,.055)!important}.week-day.today span,.week-day.selected span{background:var(--polish-red)!important;color:#fff!important;box-shadow:0 5px 14px rgba(255,40,70,.28)!important}
.week-legend{font-size:7.5px!important;margin-top:4px!important;color:rgba(255,255,255,.55)!important}.legend-dot{width:5px!important;height:5px!important;margin-right:2px!important}
#week-progress:not(:empty){margin-top:6px!important;padding-top:6px!important;border-top-color:rgba(255,255,255,.09)!important}
.progress-head{margin-bottom:5px!important}.progress-head strong{font-size:9px!important}.progress-head span{font-size:8px!important}.progress-track{margin-bottom:6px!important}.progress-track span{background:var(--polish-red)!important;box-shadow:0 0 8px rgba(255,40,70,.28)}
.metrics small{font-size:7.5px!important;line-height:1.1!important}.metrics b{font-size:14px!important;margin-top:3px!important}

.phase-card{min-height:62px!important;padding:9px 11px!important;border-radius:20px!important;gap:10px!important}
.phase-card .section-kicker{font-size:8px!important}.phase-card h3{font-size:14px!important;margin:3px 0 2px!important}.phase-card p{font-size:8px!important}
.phase-pill,.phase-ring{width:38px!important;height:38px!important;min-width:38px!important;flex-basis:38px!important;background:rgba(255,255,255,.035)!important;border-color:rgba(255,255,255,.10)!important;color:var(--polish-red)!important}.phase-pill svg{width:20px!important;height:20px!important}

/* Four-board dock: stable touch geometry and one clear active accent. */
.bottom{height:58px!important;min-height:58px!important;padding:4px 6px!important;border-radius:22px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
.bottom .nav{min-height:48px!important;padding:3px 2px!important;font-size:10px!important;color:rgba(255,255,255,.62)!important}
.bottom .nav svg{width:19px!important;height:19px!important}.bottom .nav.active{color:var(--polish-red)!important;text-shadow:0 0 12px rgba(255,40,70,.24)!important}

/* Sub-pages: preserve structure, improve dark-glass contrast and focus visibility. */
.page-head p,.day-detail-head p,.muted{color:rgba(255,255,255,.64)!important}
.flow-tab,.subnav-tab{color:rgba(255,255,255,.62)!important}.flow-tab.active,.subnav-tab.active{color:#fff!important;background:rgba(255,255,255,.08)!important}
.input,.training-actuals-card select,.training-actuals-card textarea,.choice2 button,.choice3 button,.choice4 button,.grid5 button,.rpe button,.stopwatch-controls button{color:#fff!important;background:rgba(255,255,255,.055)!important;border-color:rgba(255,255,255,.10)!important}
.input::placeholder,.training-actuals-card textarea::placeholder{color:rgba(255,255,255,.46)!important}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid rgba(255,255,255,.92)!important;outline-offset:2px!important}

@media(max-height:780px){
  .mockup-topbar{height:calc(42px + env(safe-area-inset-top))!important}.streak,.refresh-plan{height:36px!important;min-height:36px!important}.refresh-plan{width:36px!important;min-width:36px!important}
  .mockup-home{height:calc(100dvh - 103px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;gap:4px!important;padding-inline:10px!important}
  .greeting h1{font-size:23px!important}.greeting p{font-size:10px!important;margin-top:2px!important}.mockup-main-card{min-height:174px!important}
  .next-card{padding:9px 11px 45px!important}.session-title{font-size:18px!important}.next-meta{font-size:9px!important;margin-top:4px!important;padding-top:4px!important}.hero-start{height:40px!important;min-height:40px!important;margin-top:5px!important}.hero-view{min-height:36px!important;margin-top:4px!important}
  .week-card{padding:5px 7px 6px!important}.week-day{min-height:34px!important}.week-day span{width:21px!important;height:21px!important}.week-legend{font-size:6.5px!important;margin-top:2px!important}
  #week-progress:not(:empty){margin-top:3px!important;padding-top:3px!important}.progress-head{margin-bottom:2px!important}.progress-head strong{font-size:8px!important}.progress-head span{font-size:7px!important}.progress-track{margin-bottom:3px!important}.metrics b{font-size:11px!important}.metrics small{font-size:6.5px!important}
  .phase-card{min-height:50px!important;padding:6px 8px!important}.phase-card h3{font-size:12px!important}.phase-card p{font-size:7px!important}.phase-pill,.phase-ring{width:31px!important;height:31px!important;min-width:31px!important;flex-basis:31px!important}
  .bottom{height:52px!important;min-height:52px!important}.bottom .nav{min-height:44px!important;font-size:9px!important}
}

@media(max-height:690px){
  .mockup-main-card{min-height:154px!important}.session-title{font-size:16px!important}.next-meta{font-size:8px!important}.hero-start{height:36px!important;min-height:36px!important;font-size:12px!important}.hero-view{min-height:32px!important}.week-day{min-height:30px!important}.week-day span{font-size:10px!important;width:18px!important;height:18px!important}.week-legend{font-size:5.8px!important}.phase-card{min-height:44px!important}.phase-card h3{font-size:10px!important}.phase-card p{font-size:6px!important}
}
