/* Fysios — electric movement */
:root{--bg:#090c19;--panel:#12172b;--panel2:#1b2340;--line:#303955;--gold:#b9ff54;--white:#f5f7ff;--muted:#abb5d2;--green:#64f9ce;--red:#ff9cab;--cyan:#57e8ff;--violet:#a78aff}
body{background:radial-gradient(ellipse at 95% 5%,#6244d52b,transparent 38%),radial-gradient(ellipse at 30% 70%,#09a6a615,transparent 45%),var(--bg)}
::selection{background:#b9ff5455;color:white}.layout{background:transparent}.sidebar{background:linear-gradient(165deg,#15192d,#0c1020 70%);border-color:#303956}.topbar{background:#0c1021e8;backdrop-filter:blur(20px);border-color:#303956}.brand .brand-name{letter-spacing:1px;color:#f7faff}.brand img{box-shadow:0 0 25px #b9ff5433}.brand-sub{color:#8c9ec8}.brand-version,.mobile-brand>span{display:none!important}.brand .brand-name{font-size:38px}.nav button{border-radius:12px;font-size:12px}.nav button.active{background:linear-gradient(110deg,#b9ff5427,#57e8ff12);border-color:#b9ff5466;color:#d9ffab;box-shadow:0 4px 25px #b9ff5409}.nav button.active .nav-icon{color:var(--gold)}.nav button:hover{background:#839aff16}.nav-label{color:#8e9ac0}.nav-label.second{color:#a78aff}.nav button[data-page=nutrition] .nav-icon{color:#ffb077}.nav button[data-page=recovery] .nav-icon{color:#64f9ce}.nav button[data-page=coach] .nav-icon{color:#b39aff}.side-quote .eyebrow,.heading-overline{color:var(--cyan)}.side-quote p span{color:#a6a0ce}.side-rule{background:linear-gradient(90deg,var(--gold),var(--cyan));width:70px}.avatar{background:linear-gradient(135deg,#b9ff5425,#57e8ff20);border-color:#6f9961;color:var(--gold)}.icon-button{background:#1b2340;border-color:#354267}.breadcrumb b{color:#e2eaff}.page-heading h1{font-size:clamp(42px,4.2vw,64px);letter-spacing:-1px}.page-heading p{color:var(--muted);font-size:12px}.pill.gold{background:#b9ff5412;border-color:#b9ff5444;color:#d4ffa0;border-radius:30px}.dot{background:var(--gold);box-shadow:0 0 12px #b9ff5499}
.hero{border:1px solid #7c83ff6b;border-radius:24px;min-height:410px;box-shadow:0 16px 60px #03071966,0 0 45px #795bff15;position:relative}.hero-photo{filter:saturate(1.3);animation:photo-reveal 1.2s ease-out both}.hero-shade{background:linear-gradient(90deg,#10172aee,#17133f80 65%,#13526638),linear-gradient(0deg,#091124ed,transparent 75%)}.hero:after{content:'';position:absolute;inset:-70% -40%;z-index:-1;pointer-events:none;background:conic-gradient(from 100deg,transparent 60%,#61eaff25,transparent 78%);animation:orbit 18s linear infinite}.hero h2{font-size:clamp(54px,5.5vw,86px);text-shadow:0 5px 30px #0007}.hero h2 em{color:var(--gold);text-shadow:0 0 40px #b9ff5433}.hero-wordmark{color:#b7a4ff14;font-style:italic}.hero-kicker{background:#a78aff20;color:#ded5ff;border-color:#a78aff66;border-radius:30px;padding:9px 13px;font-size:8px}.hero-kicker>span{background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.hero-program{color:#aadeff}.hero .subtitle{color:#d6dff5;font-size:12px}.hero-bottom{border-color:#b4c6ff33}.hero .meta,.hero .meta b{color:#e4ebff}.hero .meta svg{color:var(--cyan)}.hero .meta .hero-session{color:var(--cyan);border-color:#889bd744}.btn{border-radius:12px;background:linear-gradient(110deg,#d0ff72,#9ef03d);border-color:#d4ff9a;color:#122207;font-size:12px;box-shadow:0 5px 24px #b9ff5425}.btn:hover{background:linear-gradient(110deg,#e2ffa9,#b9ff54);box-shadow:0 8px 35px #b9ff5444;transform:translateY(-3px)}.btn.secondary{border-color:#526085;background:#202c4866;color:#e3eaff}.btn.secondary:hover{background:#b9ff5415;border-color:var(--gold)}button:active{transform:scale(.97)}.card,.stat{background:linear-gradient(135deg,#1b2340d9,#10172be8);border:1px solid #3a486b80;border-radius:20px;box-shadow:0 12px 35px #02071722}.card{transition:border-color .25s,box-shadow .25s}.card:hover{border-color:#6a7ba6aa;box-shadow:0 14px 40px #02071755}.card-icon,.stat .stat-icon{border-color:#57e8ff44;background:#57e8ff12;color:var(--cyan);border-radius:9px}.card-title h3 svg{color:var(--cyan)}.card-link{border-color:#4b597c;border-radius:9px;color:#c1cdec}.stats{gap:13px}.stat{border-radius:16px;min-height:132px}.stat .value{color:var(--cyan);font-size:43px}.stat:nth-child(2) .value{color:var(--gold)}.stat:nth-child(3) .value{color:#b99dff}.stat .eyebrow{color:#bac6e5;font-size:8px}.stat .label{color:#aebcda}.stat-progress{background:#36405e}.stat-progress i{background:linear-gradient(90deg,var(--gold),var(--cyan))}.recovery-card{border-color:#64f9ce44;background:radial-gradient(ellipse at 50% 35%,#1e796d25,transparent 70%),#111c2c}.recovery-ring{background:radial-gradient(circle,#64f9ce17,transparent 68%);filter:drop-shadow(0 0 16px #64f9ce16)}.recovery-ring .score-arc{stroke:var(--green)}.ring-text strong{color:var(--green)}.ring-text .ring-eyebrow,.recovery-status{color:#b4d4d2}.recovery-line{border-color:#37536466}.day{border-radius:13px;background:#111b30;border-color:#354564;color:#adbadd}.day.today{background:linear-gradient(140deg,#b9ff5422,#57e8ff12);border-color:var(--gold);box-shadow:0 0 22px #b9ff5410}.day.today strong{color:var(--gold)}.day.done .day-icon{color:var(--cyan)}.nutrition-card{border-color:#ffb07744}.nutrition-card .card-icon{background:#ffb07716;border-color:#ffb07744}.nutrition-card .card-icon svg{color:#ffb077}.bar{background:#354262}.bar i{background:linear-gradient(90deg,var(--gold),var(--cyan))}.macro-line.protein .macro-dot,.bar.protein i{background:#a78aff}.macro-line.carbs .macro-dot,.bar.carbs i{background:#57e8ff}.macro-line.fat .macro-dot,.bar.fat i{background:#ffb077}.coach-teaser{background:radial-gradient(ellipse at 0% 0%,#8850ff44,transparent 70%),#18182f;border-color:#a78aff66}.coach-emblem{background:#a78aff22;border-color:#a78aff66;color:#bd9eff}.coach-teaser .eyebrow{color:#c5afff}.discipline-card{border-radius:18px;border-color:#7388b655;transition:transform .3s,border-color .3s,box-shadow .3s}.discipline-card:nth-child(1){--accent:#b9ff54}.discipline-card:nth-child(2){--accent:#57e8ff}.discipline-card:nth-child(3){--accent:#d1d5db}.discipline-card:nth-child(4){--accent:#bd9aff}.discipline-card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:0 15px 30px #0005}.discipline-caption strong{color:var(--accent)}.discipline-number{color:var(--accent)}.program{padding:0;overflow:hidden}.program-visual{background-color:#202e46}.program-visual:after{border-color:#57e8ff33}.program:nth-child(2) .program-body h2{color:var(--cyan)}.program:nth-child(3) .program-body h2{color:#d1d5db}.program:nth-child(4) .program-body h2{color:#bda5ff}.schedule-row,.exercise,.workout-top{background:#161f35;border-color:#354567;border-radius:16px}.history-icon{background:#57e8ff14;color:var(--cyan);border-radius:11px}.segmented{background:#111a30;border-color:#3a496b;border-radius:12px}.segmented button{border-radius:8px}.segmented button.active{background:var(--gold);color:#152509}input,select,textarea{background:#0c1428;border-color:#43547b;border-radius:10px}dialog{background:linear-gradient(145deg,#202a46,#10182a);border-color:#768ab5;border-radius:24px;box-shadow:0 30px 120px #0009}dialog::backdrop{background:#030919bb;backdrop-filter:blur(10px)}.footer{border-color:#354262;color:#95a7cb}.footer-brand b{display:none}.bottom-nav{background:#10172bf2;backdrop-filter:blur(20px);border-color:#4b5b81}.bottom-nav button.active{color:var(--gold)}.bottom-nav button.active>span{background:#b9ff541c;box-shadow:inset 0 0 0 1px #b9ff5466;border-radius:10px}.session-banner{background:linear-gradient(110deg,#a78aff22,#57e8ff15);border-color:#a78aff66}.set-check.done{background:#b9ff54;color:#122207}#toast{background:#24384b;color:#dcffb8;border:1px solid #b9ff5477;border-radius:14px}.energy-ripple{position:fixed;width:14px;height:14px;margin:-7px;pointer-events:none;border:2px solid var(--cyan);border-radius:50%;z-index:150;animation:ripple .55s ease-out forwards}.energy-toggle{width:100%;margin-bottom:10px;justify-content:center;font-size:10px}.energy-toggle[aria-pressed=false]{color:var(--cyan)}
@keyframes ripple{to{transform:scale(5);opacity:0}}@keyframes orbit{to{transform:rotate(360deg)}}@keyframes photo-reveal{from{transform:scale(1.06);opacity:.4}to{transform:scale(1);opacity:1}}
@media(min-width:761px){.hero{padding:34px 32px 0}.card-title h3{font-size:13px}.discipline-card{min-height:190px}}
@media(max-width:760px){.hero{min-height:390px;border-radius:22px}.hero h2{font-size:clamp(48px,14vw,70px)}.card{border-radius:18px}.stat{min-height:120px}.stat .value{font-size:36px}.page-heading h1{font-size:44px}.hero-content{max-width:96%}.hero-bottom .btn{border-radius:11px}.sidebar{background:#10172b}.topbar{background:#10172bf0}.mobile-brand{color:#e7ffcb}.hero .subtitle{font-size:11px}.discipline-card{min-height:165px}.energy-toggle{margin-top:8px}.stat .eyebrow{font-size:6px}.hero-shade{background:linear-gradient(90deg,#10172aee,#17133f99 70%,#13526655),linear-gradient(0deg,#091124ed,transparent 75%)}}
html[data-effects=off] *,html[data-effects=off] *:before,html[data-effects=off] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Bright Fysios wordmark across desktop and mobile. */
.brand .brand-name,.mobile-brand,.footer-brand{color:#b9ff54;text-shadow:0 0 18px #b9ff5466,0 0 36px #b9ff5426}
.hero-wordmark{color:#b9ff542b;text-shadow:0 0 36px #b9ff5433}

/* Attach the app frame to the viewport, including the phone's safe areas. */
:root {
  --topbar-content-height: 72px;
  --topbar-height: calc(var(--topbar-content-height) + env(safe-area-inset-top, 0px));
  --bottom-nav-height: 0px;
}
html {
  scroll-padding-top: calc(var(--topbar-height) + 16px);
  scroll-padding-bottom: calc(var(--bottom-nav-height) + 16px);
}
.layout {
  padding-top: var(--topbar-height);
  min-height: 100vh;
  min-height: 100dvh;
}
.topbar {
  position: fixed;
  inset: 0 0 auto var(--sidebar-width);
  width: auto;
  max-width: none;
  height: var(--topbar-height);
  min-height: var(--topbar-height);
  margin: 0;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: 0;
  border-radius: 0;
  background: #10172b;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.bottom-nav {
  position: fixed;
  inset: auto 0 0;
  width: auto;
  max-width: none;
  margin: 0;
  border-radius: 0;
  background: #10172b;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
@media (max-width: 760px) {
  :root {
    --topbar-content-height: 64px;
    --bottom-nav-height: calc(67px + env(safe-area-inset-bottom, 0px));
  }
  .topbar {
    left: 0;
    padding-left: max(20px, env(safe-area-inset-left, 0px));
    padding-right: max(20px, env(safe-area-inset-right, 0px));
  }
  .bottom-nav {
    height: var(--bottom-nav-height);
    min-height: var(--bottom-nav-height);
    padding: 7px max(6px, env(safe-area-inset-right, 0px)) calc(7px + env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-left, 0px));
  }
  main {
    padding-bottom: calc(var(--bottom-nav-height) + 33px);
  }
  .workout-actions {
    bottom: calc(var(--bottom-nav-height) + 14px);
  }
  #toast {
    bottom: calc(var(--bottom-nav-height) + 20px);
  }
}

/* Keep native iOS date controls inside their own grid track. */
.form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}
.form-grid > *, .field, dialog form {
  min-width: 0;
  max-width: 100%;
}
.field > input, .field > select, .field > textarea {
  display: block;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-inline-size: 0;
  box-sizing: border-box;
}
.field > input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  min-height: 46px;
  text-align: left;
}
input[type="date"]::-webkit-date-and-time-value {
  min-width: 0;
  text-align: left;
}
input[type="date"]::-webkit-datetime-edit {
  min-width: 0;
  padding: 0;
}
dialog {
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scroll-padding-block: 20px 90px;
}
dialog .form-actions {
  position: sticky;
  bottom: -28px;
  z-index: 5;
  flex-wrap: wrap;
  margin: 20px -28px -28px;
  padding: 16px 28px;
  border-top: 1px solid #43547b;
  background: #10172b;
  box-shadow: 0 -8px 20px #03071955;
}
@media (max-width: 760px) {
  dialog .form-actions {
    bottom: -24px;
    margin: 20px -21px -24px;
    padding: 14px 21px;
  }
  dialog .form-actions .btn {
    min-width: 0;
    flex: 1 1 120px;
  }
}
@media (max-width: 560px) {
  .form-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }
  .field > input, .field > select, .field > textarea {
    font-size: 16px;
    min-height: 46px;
  }
}