/* Text-weight gray with enough contrast on the dark surfaces (brand gray #777B80 stays for lines/marks). */
:root{--gray-text:#A0A4A9}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* JDXcel app layout. Colors, type and form styles come from ../assets/app.css. */
body{display:block}
#app{min-height:100vh}
main{padding-block:0}
.block{display:block}
.mono{font-family:var(--mono);font-size:12px;word-break:break-all}
.small{font-size:14px}
.center{text-align:center}
.wide{width:100%}
.ic{flex:none}

/* loading */
.loading{display:flex;align-items:center;gap:12px;justify-content:center;padding:80px 20px;color:var(--soft)}
.spin{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--lime);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* auth screens */
.auth{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:32px max(16px,env(safe-area-inset-right,0px)) 32px max(16px,env(safe-area-inset-left,0px))}
.auth-logo{display:flex;align-items:center;gap:10px;color:var(--lime);text-decoration:none}
.auth-logo svg{width:46px;height:46px}
.auth-logo b{display:block;font:800 italic 30px/.9 var(--display);color:var(--white)}
.auth-logo b i{color:var(--lime);font-style:italic}
.auth-logo small{display:block;font:500 9px var(--mono);letter-spacing:.28em;text-transform:uppercase;color:var(--gray-text);margin-top:3px}
.auth-card{width:100%;max-width:420px}
.auth-card h1{font:800 italic 40px/.95 var(--display);text-transform:uppercase;margin-bottom:8px}
.auth-card > p{margin-bottom:18px}
.auth-foot{font-size:13px}
.stack{display:grid;gap:14px}
.stack-lg{display:grid;gap:18px;align-content:start}
.fld{display:grid;gap:6px}
.fld .label{font-weight:600;font-size:15px}
.fld .help{color:var(--gray-text);font-size:13px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.two{grid-template-columns:1fr}}
a.link-btn{display:inline-block;text-decoration:underline}

/* shell */
.shell{min-height:100vh}
.topbar{position:sticky;top:0;z-index:30;display:none;align-items:center;justify-content:space-between;height:60px;padding:0 max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px));background:var(--bg-deep);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--lime)}
.brand svg{width:36px;height:36px}
.brand b{display:block;font:800 italic 24px/.9 var(--display);color:var(--white)}
.brand b i{color:var(--lime);font-style:italic}
.brand small{display:block;font:500 8.5px var(--mono);letter-spacing:.24em;text-transform:uppercase;color:var(--gray-text);margin-top:3px}
.icon-btn{background:none;border:0;color:var(--white);padding:8px;border-radius:8px;cursor:pointer;display:grid;place-items:center}
.icon-btn:hover{background:var(--surface)}
.side{position:fixed;inset:0 auto 0 0;width:240px;background:var(--bg-deep);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:20px 12px;z-index:40}
.side nav{display:grid;gap:2px;margin-top:6px}
.side nav a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:8px;color:var(--soft);text-decoration:none;font-weight:600;font-size:15px}
.side nav a:hover{background:var(--surface);color:var(--white)}
.side nav a.on{background:rgba(198,241,53,.1);color:var(--lime)}
.side-foot{margin-top:auto;display:grid;gap:8px;padding:12px;border-top:1px solid var(--line)}
.side-foot .link-btn{display:flex;align-items:center;gap:8px;padding:4px 0;text-decoration:none}
.content{margin-left:240px;padding:32px max(20px,env(safe-area-inset-right,0px)) 80px 32px;max-width:1240px}
.tabbar{display:none}

.side .brand{margin:0 8px 18px}
@media (max-width:900px){.side .brand{display:none}}
@media (max-width:900px){
  .topbar{display:flex}
  .side{inset:60px 0 0 auto;width:min(300px,86vw);transform:translateX(100%);transition:transform .2s;border-left:1px solid var(--line);border-right:0}
  .side.open{transform:none}
  .content{margin-left:0;padding:22px max(16px,env(safe-area-inset-right,0px)) 96px max(16px,env(safe-area-inset-left,0px))}
  .member .tabbar{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:30;background:var(--bg-deep);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
  .tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 4px 8px;color:var(--gray-text);text-decoration:none;font-size:11.5px;font-weight:600}
  .tabbar a.on{color:var(--lime)}
  .member .content{padding-bottom:110px}
}
@media (min-width:901px){.menu-btn{display:none}}

/* pages */
.page{display:grid;gap:22px}
.page-head h1{font:800 italic clamp(34px,5vw,48px)/.95 var(--display);text-transform:uppercase;margin-top:6px}
.page-head p{margin-top:8px}
.page-head.row,.card-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.card-head{align-items:center;margin-bottom:12px}
.card h3{font:700 21px/1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.card h3 + *{margin-top:12px}
.card h4{font:700 16px var(--display);text-transform:uppercase;letter-spacing:.02em;margin:0 0 10px}
.card .card-head h3 + *{margin-top:0}
.grid-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;align-items:start}
.grid-2.wide-left{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}
@media (max-width:1000px){.grid-2,.grid-2.wide-left{grid-template-columns:1fr}}
.narrow{max-width:560px}
.next h2{font:800 italic 30px/1 var(--display);text-transform:uppercase;margin:8px 0 8px}
.next p{margin-bottom:14px}
.card.accent{border-color:var(--lime)}
.empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:26px 12px;color:var(--gray-text)}
.empty b{color:var(--white);font:700 20px var(--display);text-transform:uppercase}
.empty .muted{max-width:44ch;font-size:15px}
.svc-list,.rows,.feed,.plain,.tasks,.notes{list-style:none;margin:0;padding:0}
.svc-list li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.svc-list li:first-child{border-top:0;padding-top:0}
.rows li{border-top:1px solid var(--line)}
.rows li:first-child{border-top:0}
.rows a,.rows.static li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 0;color:var(--white);text-decoration:none}
.rows a:hover b{color:var(--lime)}
.feed li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-size:14.5px}
.feed li:first-child{border-top:0}
.feed a{color:var(--white);text-decoration:none}
.feed a:hover{color:var(--lime)}
.tasks li{padding:9px 0 9px 22px;border-top:1px solid var(--line);position:relative;font-size:15px}
.tasks li:first-child{border-top:0}
.tasks li::before{content:"";position:absolute;left:2px;top:17px;width:8px;height:8px;border-radius:50%;background:var(--lime)}
.notes li{padding:12px 0;border-top:1px solid var(--line);white-space:pre-wrap;font-size:15px}
.notes li small{display:block;color:var(--gray-text);font:500 11px var(--mono);margin-bottom:4px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;margin:0}
.kv dt{color:var(--gray-text)}
.kv dd{margin:0;word-break:break-word}
.contact-btns{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 14px}
.contact-btns .btn{padding:10px 16px;min-height:44px}
.pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.pill{display:inline-flex;align-items:center;font:600 11.5px var(--mono);letter-spacing:.03em;padding:4px 9px;border-radius:999px;border:1px solid var(--line);color:var(--soft);white-space:nowrap}
.pill.on{background:var(--lime);border-color:var(--lime);color:var(--bg)}
.pill.soon{border-color:var(--lime);color:var(--lime)}
.pill.warn{border-color:#FFC27A;color:#FFC27A}
.pill.off{color:var(--gray-text)}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--lime);color:var(--bg);display:grid;place-items:center;font:800 20px var(--display);flex:none;text-transform:uppercase}
.avatar.sm{width:32px;height:32px;font-size:15px}
.who{display:flex;align-items:center;gap:10px}
.who.big .avatar{width:56px;height:56px;font-size:26px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.athlete-card{display:flex;gap:14px;align-items:flex-start;text-decoration:none;color:var(--white)}
.athlete-card:hover{border-color:var(--lime)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px;text-decoration:none;display:grid;gap:4px}
.stat:hover{border-color:var(--lime)}
.stat b{font:800 38px/1 var(--display);color:var(--lime)}
.stat span{color:var(--soft);font-size:13.5px}
.toolbar{display:flex;flex-wrap:wrap;gap:10px}
.toolbar input{flex:1 1 220px;min-height:44px}
.toolbar select{flex:0 1 210px;min-height:44px}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.tbl{width:100%;border-collapse:collapse;font-size:14.5px}
.tbl th,.tbl td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.tbl th{font:500 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gray-text);background:var(--bg-deep);white-space:nowrap}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr[tabindex]{cursor:pointer}
.tbl tbody tr[tabindex]:hover{background:rgba(255,255,255,.02)}
.tbl.compact td{padding:8px 10px}
.tbl input[type=date]{min-height:38px;padding:6px 8px;font-size:14px;width:auto}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.tabs a{padding:12px 14px;color:var(--soft);text-decoration:none;font-weight:600;white-space:nowrap;border-bottom:2px solid transparent}
.tabs a.on{color:var(--lime);border-bottom-color:var(--lime)}
.resp{border-top:1px solid var(--line);padding-block:16px}
.resp:first-child{border-top:0;padding-top:0}
.resp dl{margin:10px 0 0;display:grid;gap:12px}
.resp dt{font-size:13.5px;color:var(--gray-text)}
.resp dd{margin:3px 0 0;white-space:pre-wrap;word-break:break-word}
.grant{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.grant-row{display:grid;grid-template-columns:1.3fr 1fr .6fr 1.3fr auto;gap:10px;align-items:end}
@media (max-width:800px){.grant-row{grid-template-columns:1fr 1fr}}
.btn-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 8px}
.btn.danger:hover{border-color:var(--error);color:var(--error)}
.checks{display:grid;gap:8px}
.check{display:flex;gap:10px;align-items:center;font-size:15px}
.check input{width:18px;height:18px;accent-color:var(--lime)}
.modal{position:fixed;inset:0;z-index:60;background:rgba(10,10,11,.78);display:grid;place-items:center;padding:16px}
.modal-card{background:var(--bg);border:1px solid var(--line);border-radius:12px;width:100%;max-width:560px;max-height:100%;overflow:auto;padding:24px}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.modal-head h2{font:800 italic 30px var(--display);text-transform:uppercase}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%);background:var(--lime);color:var(--bg);font-weight:700;padding:10px 18px;border-radius:999px;z-index:70;box-shadow:0 10px 30px -10px #000}
textarea{min-height:110px}

/* ---------------------------------------------------------------- Phase 2: programming */
.grow{flex:1 1 auto;min-width:0}
.nowrap{white-space:nowrap}
.clip{max-width:320px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.warn-text{color:#F5C451}
.btn.sm{padding:8px 14px;min-height:40px;font-size:14px}
.btn.danger{color:var(--error)}
.icon-btn.sm{padding:6px;color:var(--soft)}
.icon-btn.sm:hover{color:var(--lime);background:rgba(255,255,255,.05)}
.icon-btn:disabled{opacity:.3;cursor:default}
select.sm{min-height:36px;padding:4px 30px 4px 10px;font-size:14px;width:auto}
input[type=number],input[type=url],input[type=search]{width:100%;font:16px var(--body);color:var(--white);background:var(--bg-deep);border:1px solid var(--line);border-radius:8px;padding:12px 14px;min-height:48px}
input[type=number]:focus,input[type=url]:focus,input[type=search]:focus{border-color:var(--lime);outline:none;box-shadow:0 0 0 3px rgba(198,241,53,.18)}
.table-wrap.flat{border:0;background:none;margin-top:10px}
.tbl tr[tabindex]:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}
.checks.scroll{max-height:240px;overflow:auto;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--bg-deep)}
.pick-list{list-style:none;margin:0;padding:0;max-height:52vh;overflow:auto;border:1px solid var(--line);border-radius:8px}
.pick-list li + li{border-top:1px solid var(--line)}
.pick-list button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;background:none;border:0;color:var(--white);padding:12px 14px;cursor:pointer;font:15px var(--body)}
.pick-list button:hover,.pick-list button:focus-visible{background:rgba(198,241,53,.08)}
.day-picks{display:flex;flex-wrap:wrap;gap:6px}
.day-pick{position:relative;display:grid;place-items:center;min-width:52px;min-height:44px;padding:0 10px;border:1px solid var(--line);border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;color:var(--soft)}
.day-pick input{position:absolute;opacity:0;pointer-events:none}
.day-pick.on{background:var(--lime);border-color:var(--lime);color:var(--bg)}
.day-pick:focus-within{outline:3px solid var(--lime);outline-offset:2px}

/* program builder */
.title-input{font:800 italic clamp(30px,5vw,44px)/1 var(--display)!important;text-transform:uppercase;background:transparent!important;border:1px solid transparent!important;padding:2px 6px!important;margin:4px 0 6px -7px;width:100%;color:var(--white);min-height:0!important}
.title-input:hover{border-color:var(--line)!important}
.title-input:focus{border-color:var(--lime)!important}
.row-card{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:end;padding:16px 20px;margin-bottom:18px}
.row-card .fld{flex:0 1 260px}
.row-card > p{flex:1 1 260px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:4px 0 14px}
.seg button{background:none;border:0;color:var(--soft);font:600 14px var(--body);padding:10px 16px;cursor:pointer;min-height:42px}
.seg button.on{background:var(--lime);color:var(--bg)}
.week-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:6px;margin-bottom:10px}
.week-tabs button{flex:none;background:var(--surface);border:1px solid var(--line);color:var(--soft);border-radius:8px;padding:8px 14px;font:600 14px var(--body);cursor:pointer;min-height:40px}
.week-tabs button.on{border-color:var(--lime);color:var(--lime)}
.week-tabs button.add{border-style:dashed}
.week-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:14px}
.week-bar .inline-input{flex:1 1 260px;max-width:460px}
.inline-input{width:100%;font:15px var(--body);color:var(--white);background:transparent;border:1px dashed var(--line);border-radius:8px;padding:9px 12px;min-height:42px}
.inline-input:focus{border-style:solid;border-color:var(--lime);outline:none}
.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
@media (max-width:1100px){.days{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:700px){.days{grid-template-columns:1fr}}
.day{background:var(--bg-deep);border:1px solid var(--line);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px;min-height:140px}
.day-head{display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.day-head b{font:700 16px var(--display);text-transform:uppercase;letter-spacing:.04em}
.wcard{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--lime);border-radius:8px;display:flex;flex-direction:column}
.wcard-main{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:9px 10px 4px;text-decoration:none;color:var(--white)}
.wcard-main b{font-size:14.5px;line-height:1.25}
.wcard-main:hover b{color:var(--lime)}
.wcard-actions{display:flex;justify-content:flex-end;padding:0 4px 2px}
.add-slot{margin-top:auto;display:grid;place-items:center;background:none;border:1px dashed var(--line);border-radius:8px;color:var(--gray-text);min-height:36px;cursor:pointer}
.add-slot:hover{border-color:var(--lime);color:var(--lime)}
.block-grid td{vertical-align:top;min-width:110px}
.chip{display:flex;justify-content:space-between;gap:6px;font-size:13px;background:var(--bg-deep);border:1px solid var(--line);border-radius:6px;padding:4px 8px;margin-bottom:4px;text-decoration:none;color:var(--white)}
.chip span{color:var(--gray-text)}
.chip:hover{border-color:var(--lime)}
.danger-zone{margin-top:28px;padding-top:14px;border-top:1px solid var(--line)}

/* workout builder */
.bblock{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:14px;margin:16px 0;display:grid;gap:10px}
.bblock.warmup{border-left:4px solid #6FA8FF}
.bblock.main{border-left:4px solid var(--lime)}
.bblock.cooldown{border-left:4px solid var(--gray)}
.bblock-head{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.bblock-head select{width:auto;min-height:40px;padding:6px 30px 6px 10px;font-size:14px}
.bitem{background:var(--bg-deep);border:1px solid var(--line);border-radius:10px;padding:12px;display:grid;gap:10px}
.bitem-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.rx{display:grid;gap:3px;font-size:12px;color:var(--gray-text);font-family:var(--mono);text-transform:uppercase;letter-spacing:.04em}
.rx input,.rx select{min-height:40px;padding:6px 10px;font:15px var(--body);text-transform:none;letter-spacing:0}
.rx.inline{grid-auto-flow:column;align-items:center;gap:8px}
.rx.inline input{width:76px}
.rx-sum{font-family:var(--mono);font-size:12.5px}

/* read-only workout */
.wo-wrap{max-width:760px}
.wo-view{display:grid;gap:16px}
.wo-note p{margin-top:6px;white-space:pre-line}
.wo-block{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.wo-block.warmup{border-top:3px solid #6FA8FF}
.wo-block.main{border-top:3px solid var(--lime)}
.wo-block.cooldown{border-top:3px solid var(--gray)}
.wo-block header{display:grid;gap:4px;margin-bottom:8px}
.wo-block h3{font:700 20px var(--display);text-transform:uppercase}
.wo-items{list-style:none;margin:0;padding:0}
.wo-item{display:flex;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.wo-item:first-child{border-top:0}
.wo-tag{flex:none;display:grid;place-items:center;min-width:34px;height:34px;padding:0 6px;border-radius:8px;background:var(--bg-deep);border:1px solid var(--line);font:700 14px var(--mono);color:var(--lime)}
.wo-body{display:grid;gap:4px;min-width:0}
.wo-body > b{font-size:17px}
.wo-rx{font-family:var(--mono);font-size:14px;color:var(--white)}
.wo-cue{display:flex;gap:6px;align-items:flex-start;font-size:14.5px;color:var(--soft)}
.wo-cue .ic{margin-top:3px;color:var(--lime)}
.wo-more summary{cursor:pointer;color:var(--soft);font-size:14px}
.wo-more p{margin-top:6px;font-size:14.5px;white-space:pre-line}
.video-btn{justify-self:start;display:inline-flex;align-items:center;gap:6px;margin-top:4px;background:none;border:1px solid var(--line);color:var(--white);border-radius:999px;padding:6px 12px;font:600 13.5px var(--body);text-decoration:none;cursor:pointer;min-height:36px}
.video-btn:hover{border-color:var(--lime);color:var(--lime)}
.video-frame{position:relative;aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden}
.video-frame iframe,.video-frame video{position:absolute;inset:0;width:100%;height:100%;border:0}
.modal-card .wo-view{margin-top:6px}

/* athlete training */
.prog-head h2{font:800 italic clamp(28px,4.5vw,40px)/1 var(--display);text-transform:uppercase;margin:6px 0 10px}
.prog-head{margin-bottom:18px}
.wo-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);text-decoration:none;color:var(--white)}
.card-head + .wo-row,.meter + .wo-row,.wo-row:first-child{border-top:0}
.wo-row:hover b{color:var(--lime)}
.wo-date{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:8px;background:var(--bg-deep);border:1px solid var(--line);line-height:1}
.wo-date b{font:600 10px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--gray-text)}
.wo-date span{font:700 19px var(--display)}
.kind-ic{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--bg-deep);color:var(--lime)}
.kind-ic.speed{color:#6FA8FF}
.today-card{border-color:rgba(198,241,53,.45)}
.meter{height:6px;border-radius:99px;background:var(--bg-deep);overflow:hidden;margin:2px 0 6px}
.meter i{display:block;height:100%;background:var(--lime);border-radius:99px}
.past-prog{border-top:1px solid var(--line);padding:10px 0}
.past-prog:first-of-type{border-top:0}
.past-prog summary{cursor:pointer;padding:4px 0}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle;margin:0 4px 0 8px;background:var(--lime)}
.dot.speed{background:#6FA8FF}

/* calendar */
.cal{display:grid;gap:14px}
.cal-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cal-bar h2{font:800 italic 30px/1 var(--display);text-transform:uppercase;min-width:220px;text-align:center}
.cal-bar .flip{display:inline-grid;transform:scaleX(-1)}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--line);gap:1px}
.cal-dow{background:var(--bg-deep);text-align:center;padding:8px 0;font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--gray-text)}
.cal-cell{background:var(--surface);min-height:108px;padding:4px 6px 6px;display:flex;flex-direction:column;gap:3px;min-width:0}
.cal-cell.out{background:var(--bg)}
.cal-cell.out .cal-day{color:var(--gray-text)}

.cal-cell.sel{box-shadow:inset 0 0 0 2px var(--lime)}
.cal-day{align-self:flex-start;background:none;border:0;color:var(--soft);font:600 13px var(--mono);border-radius:999px;min-width:28px;height:28px;cursor:pointer;padding:0 6px}
.cal-cell.today .cal-day{background:var(--lime);color:var(--bg)}
.cal-evs{display:grid;gap:3px;min-width:0}
.cal-ev{display:block;font-size:12px;line-height:1.3;padding:3px 6px;border-radius:5px;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:rgba(198,241,53,.16);color:var(--white);border-left:3px solid var(--lime)}
.cal-ev.speed{background:rgba(111,168,255,.15);border-left-color:#6FA8FF}
.cal-ev.draft{border-left-style:dashed;font-style:italic}
.cal-ev.st-on{text-decoration:line-through;text-decoration-color:rgba(255,255,255,.4);color:var(--soft)}
.cal-ev.st-off{color:var(--gray-text);background:var(--bg)}
.cal-ev:hover{color:var(--lime)}
.cal-more{background:none;border:0;color:var(--gray-text);font-size:12px;text-align:left;padding:0 6px;cursor:pointer}
.cal-dots{display:none;gap:3px;justify-content:center}
.cal-dots i{width:6px;height:6px;border-radius:50%;background:var(--lime)}
.cal-dots i.speed{background:#6FA8FF}
.cal-agenda{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.cal-agenda h3{font:700 20px var(--display);text-transform:uppercase;margin-bottom:6px}
.agenda-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--line);text-decoration:none;color:var(--white)}
.agenda-row:first-of-type{border-top:0}
.agenda-row .dot{margin:0}
.agenda-date{flex:none;width:52px;font:600 12px var(--mono);color:var(--gray-text);text-transform:uppercase}
.agenda-row:hover b{color:var(--lime)}
@media (max-width:760px){
  .cal-cell{min-height:56px;align-items:center;padding:4px 2px}
  .cal-day{align-self:center}
  .cal-evs{display:none}
  .cal-dots{display:flex}
  .cal-bar h2{min-width:0;font-size:24px;flex:1}
}
.page-head.row > select{width:auto;max-width:280px}

/* ---------------------------------------------------------------- Phase 3: workout player & history */
.btn.big{min-height:58px;font-size:17px;padding:16px 24px}
.btn.wide{width:100%}
.pre{white-space:pre-line;margin-top:8px}
.grid-2.tight{gap:14px}
.wo-actions{display:flex;flex-wrap:wrap;gap:10px}
.wo-actions:empty{display:none}
.today-start{margin-top:6px}
.shell.playing .content{margin:0 auto;max-width:720px;padding:0 max(14px,env(safe-area-inset-right,0px)) 140px max(14px,env(safe-area-inset-left,0px))}
.player{gap:16px}
.player-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;margin:0 -14px;padding:10px 14px;background:rgba(24,25,27,.96);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.player-title{display:block;font:800 italic 22px/1.05 var(--display);text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.elapsed{font-family:var(--mono);color:var(--lime)}
.sync{flex:none;display:inline-flex;align-items:center;gap:4px;font:600 11.5px var(--mono);padding:5px 9px;border-radius:999px;border:1px solid var(--line);color:var(--soft);white-space:nowrap}
.sync.ok{color:var(--lime);border-color:rgba(198,241,53,.35)}
.sync.off{color:#F5C451;border-color:rgba(245,196,81,.5)}
.pblock{display:grid;gap:10px}
.pblock + .pblock{margin-top:8px}
.pitem{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;gap:10px;scroll-margin-top:80px}
.pitem.complete{border-color:rgba(198,241,53,.5)}
.pitem-head{display:flex;gap:12px;align-items:flex-start}
.pitem-head b{font-size:18px;line-height:1.2}
.pitem-count{flex:none;font:700 14px var(--mono);color:var(--soft);padding-top:4px}
.pitem.complete .pitem-count{color:var(--lime)}
.pitem-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.pitem-tools .video-btn{margin-top:0}
.last-time{color:#9EC3FF;font-family:var(--mono);font-size:12.5px;margin-top:4px}
.sets{display:grid;gap:8px}
.set-row{display:grid;grid-template-columns:52px 1fr auto 56px;gap:8px;align-items:center;padding:6px;border-radius:12px;background:var(--bg-deep);border:1px solid transparent}
.set-row.logged{border-color:rgba(198,241,53,.35);background:rgba(198,241,53,.06)}
.set-label{font:700 13px var(--mono);color:var(--soft);text-align:center;line-height:1.2}
.set-label small{display:block;font-weight:500;color:var(--gray-text);font-size:11px}
.set-fields{display:flex;gap:6px;min-width:0}
.set-fields > .small{align-self:center}
.sf{position:relative;flex:1 1 0;min-width:0}
.sf input{width:100%;min-height:52px;font:700 20px var(--body);text-align:center;padding:14px 4px 4px!important;border-radius:10px;background:var(--surface)!important;border:1.5px solid var(--line);color:var(--white)}
.sf input:focus{border-color:var(--lime);outline:none}
.sf input::placeholder{color:#5D6066;font-weight:600}
.sf span{position:absolute;top:4px;left:0;right:0;text-align:center;font:600 10px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--gray-text);pointer-events:none}
.set-row.logged .sf input{border-color:transparent;background:transparent!important;color:var(--lime)}
.more-btn{width:36px;height:52px;background:none;border:0;color:var(--gray-text);font-size:20px;cursor:pointer;border-radius:8px}
.check-btn{width:56px;height:52px;border-radius:12px;border:2px solid var(--line);background:var(--surface);color:var(--gray-text);display:grid;place-items:center;cursor:pointer;transition:background .12s,transform .08s}
.check-btn:active{transform:scale(.94)}
.set-row.logged .check-btn{background:var(--lime);border-color:var(--lime);color:var(--bg)}
.set-more{grid-column:2 / -1;display:flex;gap:6px;flex-wrap:wrap}
.set-more .sf{flex:0 1 90px}
.set-note{flex:1 1 180px;min-height:44px;font:15px var(--body);color:var(--white);background:var(--surface);border:1.5px solid var(--line);border-radius:10px;padding:8px 12px}
.add-set{justify-self:start;font-size:14px}
.player-start,.player-end{display:grid;gap:10px;margin-top:6px}
.player-end{text-align:center}
.ready-q{display:grid;gap:6px}
.ready-q .label{font-weight:600}
.scale{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.scale.ten{grid-template-columns:repeat(10,1fr);gap:4px}
.scale button{min-height:48px;border-radius:10px;border:1.5px solid var(--line);background:var(--bg-deep);color:var(--white);font:700 17px var(--body);cursor:pointer}
.scale.ten button{min-height:44px;font-size:15px;padding:0}
.scale button.on{background:var(--lime);border-color:var(--lime);color:var(--bg)}
.scale-ends{display:flex;justify-content:space-between}
.rest-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--bg-deep);border-top:2px solid var(--lime);padding-bottom:env(safe-area-inset-bottom,0px);overflow:hidden}
.rest-fill{position:absolute;inset:0 auto 0 0;background:rgba(198,241,53,.12);transition:width .25s linear}
.rest-in{position:relative;display:flex;align-items:center;gap:10px;max-width:720px;margin:0 auto;padding:12px 16px}
.rest-label{flex:1;font:600 13px var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--soft)}
.rest-time{font:800 italic 40px/1 var(--display);color:var(--lime);min-width:96px;text-align:right}
.rest-btn{min-height:48px;min-width:58px;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--white);font:700 15px var(--body);cursor:pointer}
.rest-bar.go{animation:restflash .5s ease-in-out 6 alternate}
.rest-bar.go .rest-label{color:var(--lime)}
@keyframes restflash{from{background:var(--bg-deep)}to{background:#3d4a12}}
@media (prefers-reduced-motion:reduce){.rest-bar.go{animation:none;background:#3d4a12}}
.done-mark{display:grid;place-items:center;width:72px;height:72px;margin:0 auto;border-radius:50%;background:var(--lime);color:var(--bg)}
.stats.mini{grid-template-columns:repeat(auto-fit,minmax(90px,1fr))}
.stats.mini .stat{padding:12px}
.stats.mini .stat b{font-size:28px}
.tbl.actual{margin-top:6px}
.tbl.actual td{padding:6px 10px}
.hist .wo-row:first-child{border-top:0}
@media (max-width:420px){
  .set-row{grid-template-columns:44px 1fr 28px 52px;gap:6px;padding:5px}
  .more-btn{width:28px}
  .sf input{font-size:18px}
  .rest-time{font-size:34px;min-width:80px}
}

/* ---------------------------------------------------------------- Phase 3.1: maxes & suggested weights */
.sugg{color:var(--lime);font-weight:700;white-space:nowrap}
.max-prompt{justify-self:start;display:inline-flex;align-items:center;gap:6px;margin-top:6px;background:rgba(198,241,53,.1);border:1px dashed rgba(198,241,53,.6);color:var(--lime);border-radius:999px;padding:6px 12px;font:600 13.5px var(--body);cursor:pointer;min-height:36px}
.notice:not(.ok):not(.err){background:var(--surface);border:1px solid var(--line);color:var(--soft)}
.notice.warn-box{background:rgba(245,196,81,.08);border:1px solid rgba(245,196,81,.45);color:var(--white);display:grid;gap:10px;margin-bottom:12px}
.max-list{list-style:none;margin:0;padding:0}
.max-list li{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.max-list li:first-child{border-top:0}
.max-e1rm{display:grid;text-align:right;line-height:1.1}
.max-e1rm b{font:800 26px var(--display);color:var(--lime)}
.max-e1rm span{font:500 10.5px var(--mono);text-transform:uppercase;color:var(--gray-text);letter-spacing:.05em}
.input-unit{display:flex;gap:6px}
.input-unit input{flex:1;min-width:0}
.input-unit select{width:84px;flex:none}

/* ---------------------------------------------------------------- Phase 3.2: fixes */
/* Rest timer sits at the top of the screen so nothing pinned to the bottom (like the host's badge) covers it. */
.rest-bar{top:0;bottom:auto;border-top:0;border-bottom:2px solid var(--lime);padding-top:env(safe-area-inset-top,0px);padding-bottom:0;box-shadow:0 6px 18px rgba(0,0,0,.45)}
.set-row.need{border-color:#F5C451;background:rgba(245,196,81,.08)}
.set-row.need .sf-weight input{border-color:#F5C451}
.set-need{grid-column:1 / -1;font-size:14px;color:#F5C451;padding:0 4px 2px}
.logged-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}

/* ---------------------------------------------------------------- Phase 4: progress, testing, nutrition */
.chart{display:grid;gap:6px}
.chart svg{width:100%;height:auto;display:block;overflow:visible}
.chart-tip{min-height:24px;font-size:14px}
.chart .grid{stroke:#34363B;stroke-width:1}
.chart .axis{fill:var(--gray);font:500 11px var(--mono)}
.chart .line{fill:none;stroke:var(--lime);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .area{fill:var(--lime);opacity:.1}
.chart .dot{fill:var(--lime);stroke:var(--surface);stroke-width:2}
.chart .dot.on{stroke:var(--white)}
.chart .hit{fill:transparent}
.chart .col{fill:var(--lime)}
.chart .col.on{fill:var(--lime-deep)}
.chart .none{stroke:var(--line);stroke-width:2}
.chart g[tabindex]:focus{outline:none}
.chart g[tabindex]:focus-visible .dot,.chart g[tabindex]:focus-visible .col{stroke:var(--white);stroke-width:2}
.chart-table{justify-self:start}
.test-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px}
.test-tabs button{flex:none;background:var(--bg-deep);border:1px solid var(--line);color:var(--soft);border-radius:999px;padding:6px 12px;font:600 13px var(--body);cursor:pointer;min-height:36px}
.test-tabs button.on{border-color:var(--lime);color:var(--lime)}
.test-head{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;margin-top:6px}
.result-list li{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 0}
.pr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.pr{background:var(--bg-deep);border:1px solid var(--line);border-left:3px solid var(--lime);border-radius:10px;padding:12px;display:grid;gap:2px}
.pr.speed{border-left-color:#6FA8FF}
.pr-name{font-weight:600}
.pr b{font:800 30px/1.05 var(--display);color:var(--white)}
.pr b small{font:600 13px var(--mono);color:var(--gray-text)}
.pr-badge{display:inline-block;font:700 10.5px var(--mono);letter-spacing:.06em;background:var(--lime);color:var(--bg);border-radius:4px;padding:2px 6px;vertical-align:middle}
.stats.targets{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin:12px 0}
.stats.targets .stat b{font-size:30px}
.plan-card h2{font:800 italic clamp(26px,4vw,36px)/1 var(--display);text-transform:uppercase;margin:6px 0 4px}
.rich{display:grid;gap:10px;line-height:1.6}
.rich h3{font:700 21px/1.1 var(--display);text-transform:uppercase;margin-top:8px}
.rich h4{font:700 17px var(--display);text-transform:uppercase;margin-top:4px;color:var(--lime)}
.rich ul{margin:0;padding-left:20px;display:grid;gap:4px}
.rich strong{color:var(--white)}
.plan-body{min-height:340px;font-family:var(--mono);font-size:14px}
code{font:13px var(--mono);background:var(--bg-deep);border:1px solid var(--line);border-radius:4px;padding:1px 5px}
.target-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.habit-q{display:grid;gap:6px}
.habit-q .label{font-weight:600}
.scale.days8{grid-template-columns:repeat(8,1fr);gap:4px}
.scale.days8 button{min-height:44px;font-size:15px;padding:0}
.seg.sm{margin:0}
.seg.sm button{min-height:36px;padding:6px 12px;font-size:13px}
.habit-tbl th{white-space:nowrap;font-size:11px}
.habit-tbl td.center{text-align:center}
.goal-list{list-style:none;margin:0;padding:0}
.goal-list li{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.goal-list li:first-child{border-top:0}
.goal-list li.achieved b{color:var(--soft);text-decoration:line-through;text-decoration-color:rgba(255,255,255,.3)}
.goal-list li.dropped{opacity:.5}
.goal-mark{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;border:2px solid var(--line);color:var(--bg)}
.goal-list li.achieved .goal-mark{background:var(--lime);border-color:var(--lime)}

/* ---------------------------------------------------------------- Phase 5: check-ins, comments, flags, announcements */
.checkin-card{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--white)}
.checkin-card b{display:block;font-size:18px;margin-top:2px}
.checkin-card.due{border-color:rgba(198,241,53,.6);background:linear-gradient(0deg,rgba(198,241,53,.06),rgba(198,241,53,.06)),var(--surface)}
.checkin-kv dd.pre{white-space:pre-line}
.ck-list{display:grid}
.ck-item{border-top:1px solid var(--line);padding:12px 0}
.ck-item:first-child{border-top:0}
.ck-item summary{cursor:pointer;display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.ck-item .kv{margin-top:10px}
.coach-reply{margin-top:10px;padding:12px 14px;border-left:3px solid var(--lime);background:var(--bg-deep);border-radius:0 8px 8px 0}
.coach-reply p{margin:4px 0}
.ck-coach{display:grid;gap:12px}
.ck-coach.flagged{border-color:rgba(245,196,81,.6)}
.ck-reply{min-height:80px}
.ck-week{margin:0 0 6px 2px}
.week-label{font:700 15px var(--body);white-space:nowrap}
.section-title{font:700 21px var(--display);text-transform:uppercase;margin:4px 0 -6px}
.flag-list{list-style:none;margin:0 0 12px;padding:0}
.flag-list li{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}
.flag-list li:first-child{border-top:0}
.flag-dot{flex:none;width:10px;height:10px;border-radius:50%;background:#F5C451}
.flag-list.done li{opacity:.7}
.inline-form{display:flex;gap:8px;flex-wrap:wrap}
.inline-form input{flex:1 1 220px}
.seg.yn{margin:0}
.seg.yn button{min-width:84px;min-height:46px}
.ann-list{display:grid;gap:10px}
.announcement{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:12px;border:1px solid rgba(198,241,53,.5);background:rgba(198,241,53,.07)}
.announcement .ic{color:var(--lime);margin-top:3px}
.announcement p{margin:4px 0}
.comment-list{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:10px}
.comment-list li{padding:10px 12px;border-radius:10px;background:var(--bg-deep);border:1px solid var(--line)}
.comment-list li.coach{border-color:rgba(198,241,53,.45)}
.comment-list p{margin:4px 0 0}
.flip{display:inline-grid;transform:scaleX(-1)}

/* ---------------------------------------------------------------- first sign-in checklist */
.onb{min-height:100vh}
.onb-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px));background:var(--bg-deep);border-bottom:1px solid var(--line)}
.onb-top .link-btn{display:inline-flex;align-items:center;gap:6px}
.onb-main{max-width:760px;margin:0 auto;padding:28px max(16px,env(safe-area-inset-right,0px)) 96px max(16px,env(safe-area-inset-left,0px))}
.onb-steps{list-style:none;margin:0;padding:0;display:grid;gap:12px;counter-reset:none}
.onb-step{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:var(--surface);border:1.5px solid var(--line);border-radius:12px;padding:18px;color:var(--white);font:15px var(--body);cursor:pointer;transition:border-color .12s}
.onb-step:hover{border-color:var(--gray-text)}
.onb-step:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.onb-steps li.next .onb-step{border-color:var(--lime)}
.onb-steps li.done .onb-step{background:transparent}
.onb-step b{font-size:17px}
.onb-num{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line);font:800 20px var(--display);color:var(--soft)}
.onb-steps li.next .onb-num{border-color:var(--lime);color:var(--lime)}
.onb-steps li.done .onb-num{background:var(--lime);border-color:var(--lime);color:var(--bg)}
.onb-step .btn{pointer-events:none}
.onb-finish{display:grid;gap:12px;border-color:var(--lime)}
.onb-finish h2{font:800 italic 32px/1 var(--display);text-transform:uppercase}
.onb-progress{height:6px;border-radius:99px;background:var(--line);overflow:hidden;margin-top:-8px}
.onb-progress i{display:block;height:100%;background:var(--lime);transition:width .2s}
.q-card .field + .field{margin-top:26px}
.q-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.rank{display:grid;gap:8px}
.rank-row{display:grid;grid-template-columns:28px 1fr;align-items:center;gap:8px}
.rank-row b{font:800 22px var(--display);color:var(--lime);text-align:center}
.max-step{display:grid;gap:14px}
.max-step h3{font-size:18px}
.max-step.skipped{background:transparent}
.max-step.skipped h3{color:var(--soft)}
.max-row{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.max-row .sf{flex:1 1 120px;max-width:180px}
.max-row .rx{display:grid;gap:4px;font:600 10px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--gray-text)}
.max-row .rx select{min-height:52px}

/* food log */
input[type=time]{font:400 16px var(--body);padding:10px 10px;border:1.5px solid var(--line);border-radius:8px;background:var(--bg-deep);color:var(--white);min-height:48px;color-scheme:dark}
input[type=time]:focus{border-color:var(--lime);outline:none;box-shadow:0 0 0 3px rgba(198,241,53,.18)}
.food-rows{display:grid;gap:8px;margin-top:4px}
.food-row{display:grid;grid-template-columns:132px 1fr auto;gap:8px;align-items:center}
@media (max-width:520px){.food-row{grid-template-columns:118px 1fr auto}}
.food-days{display:grid;gap:12px}
.food-day{border:1px solid var(--line);border-radius:10px;padding:14px 16px;background:var(--bg-deep)}
.food-day-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.food-day-head .link-btn{margin-left:auto}
.food-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.food-list li{display:grid;grid-template-columns:76px 1fr;gap:10px;font-size:15px}
.food-time{font:600 13px var(--mono);color:var(--lime);padding-top:2px;white-space:nowrap}
.food-form{background:var(--bg-deep)}

/* max lifts (coach settings) */
.ml-row{display:flex;align-items:center;gap:6px;padding:8px 0;border-top:1px solid var(--line)}
.ml-row:first-child{border-top:0}
#max-lifts .btn-row select{flex:1 1 220px;width:auto;min-height:40px}

/* exercise categories */
.cat-ic{display:inline-grid;place-items:center;color:var(--lime);flex:none}
.cat-col{width:44px;text-align:center}
.cat-col .cat-ic{width:34px;height:34px;border-radius:8px;background:rgba(198,241,53,.08)}
.cat-chips{display:flex;flex-wrap:wrap;gap:8px}
.cat-chip{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:6px 12px;border:1.5px solid var(--line);border-radius:999px;background:var(--bg-deep);color:var(--soft);font:600 14px var(--body);cursor:pointer}
.cat-chip:hover{border-color:var(--gray-text);color:var(--white)}
.cat-chip.on{border-color:var(--lime);background:var(--lime);color:var(--bg)}
.cat-chip.on .cat-ic{color:var(--bg)}
.cat-chip:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
.cat-n{font:500 11px var(--mono);opacity:.8}
.cat-select{display:flex;align-items:center;gap:10px}
.cat-select select{flex:1}
.pick-list button.has-cat{flex-direction:row;align-items:center;gap:12px}

/* add-to-home-screen tip */
.install-card{position:relative;display:flex;gap:14px;align-items:flex-start;padding:18px 44px 18px 18px;border-color:var(--lime)}
.install-card img{border-radius:12px;flex:none}
.install-card p{margin:4px 0 10px}
.install-card p .ic{vertical-align:-3px;color:var(--lime)}
.install-x{position:absolute;top:8px;right:8px}

/* coach: getting-started and needs-a-program */
.pill.todo{border-color:#FFC27A;color:#FFC27A}

/* coach's own training: view switch */
.view-switch{width:100%;justify-content:flex-start}
.view-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:-8px 0 18px;padding:10px 14px;border:1px solid var(--lime);border-radius:10px;background:rgba(198,241,53,.08);font-size:14px}
.view-banner .link-btn{font-weight:700;color:var(--lime)}

/* JDXcel All-Access membership */
.member-card .card-head{align-items:center}
.member-card .svc-list{margin:4px 0 6px}
.member-card #manage-membership{justify-self:start}
.mem-cell .pill{margin-bottom:2px}
.access-details{margin-top:14px}
.access-details summary{cursor:pointer;color:var(--soft)}
.checkin-card.overdue{border-color:#FFC27A;background:linear-gradient(0deg,rgba(255,194,122,.07),rgba(255,194,122,.07)),var(--surface)}

/* muscle balance (radar) */
.radar-wrap{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:20px;align-items:center}
@media (max-width:640px){.radar-wrap{grid-template-columns:1fr}}
.radar svg{width:100%;height:auto;display:block}
.radar .ring{fill:none;stroke:var(--line);stroke-width:1}
.radar .spoke{stroke:var(--line);stroke-width:1}
.radar .area{fill:rgba(198,241,53,.22);stroke:var(--lime);stroke-width:2;stroke-linejoin:round}
.radar .dot{fill:var(--lime)}
.radar .lbl{fill:var(--soft);font:600 13px var(--body)}
.radar .lbl.n{fill:var(--white);font-weight:700}
.radar-legend{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:8px 16px}
.radar-legend li{display:flex;justify-content:space-between;gap:8px;border-bottom:1px dashed var(--line);padding-bottom:4px;font-size:14px}
.radar-legend b{color:var(--lime)}

/* body composition */
.bc-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.bc-stats .stat b{font-size:30px}
.bc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.bc-live{padding:10px 12px;border:1px dashed var(--line);border-radius:8px;color:var(--soft)}
.bc-live b{color:var(--lime)}
.bc-measure{border-top:1px solid var(--line);padding-top:14px}
.bc-pending{border:1px solid var(--lime);border-radius:10px;padding:12px 14px;display:grid;gap:8px}
.bc-pend-row{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.bc-pend-row .btn-row{margin:0}
.bc-charts h4{margin-bottom:6px}
.bc-checkin{border:1px solid var(--line);border-radius:10px;padding:14px;display:grid;gap:10px;margin:0}
.bc-checkin legend{font-weight:700;padding:0 6px}
.bc-checkin .help{font-size:12px}

/* multi-pick (muscles, equipment) */
.multipick{display:grid;gap:8px}
.multipick .chips{display:flex;flex-wrap:wrap;gap:6px}
.multipick .chip{display:inline-flex;align-items:center;gap:4px;padding:4px 4px 4px 10px;border-radius:999px;background:rgba(198,241,53,.12);border:1px solid rgba(198,241,53,.4);font-size:14px}
.multipick .chip button{background:none;border:0;color:var(--soft);font-size:18px;line-height:1;cursor:pointer;padding:0 6px;min-height:28px}
.multipick .chip button:hover{color:var(--white)}

/* set groups */
.rx-groups{grid-column:1/-1;display:grid;gap:8px}
.rx-group{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap}
.rx-group .rx{flex:1 1 80px;max-width:120px}
.rx-gnum{font:800 20px var(--display);color:var(--lime);width:20px;padding-bottom:10px}
.rx-add-group{margin-top:6px}
.bc-goal-banner{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:16px;border:1px solid var(--lime);border-radius:12px;background:rgba(198,241,53,.06)}
.bc-goal-banner.none{border-color:var(--line);background:transparent;display:grid;gap:4px}
.bc-goal-banner > div:first-child{display:grid}
.bc-weeks-n{font:800 italic 44px/1 var(--display);color:var(--lime)}
.bc-bar{height:10px;border-radius:99px;background:var(--line);overflow:hidden;margin:8px 0 4px}
.bc-bar i{display:block;height:100%;background:var(--lime)}

/* ---------- home widgets */
.widgets{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:18px;align-items:start}
.widget:empty{display:none}
.widget>.card{margin:0}
.widget-pick{list-style:none;margin:0;padding:0}
.widget-pick li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.widget-pick li:not(.on) label{color:var(--soft)}
.widget-pick label{display:flex;align-items:center;gap:10px;cursor:pointer}
.btn-row.tight{gap:4px}
/* ---------- watch data */
.watch-body h4{margin:18px 0 6px}
.watch-body .stats{margin-top:12px}
.sleep-stages{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px}
.sleep-stages div{display:grid}
.zones{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px}
.zones li{display:grid;grid-template-columns:minmax(120px,auto) 1fr 64px;align-items:center;gap:10px;font-size:14px}
.z-bar{height:10px;background:var(--line);border-radius:5px;overflow:hidden}
.z-bar span{display:block;height:100%;background:var(--lime);border-radius:5px}
.z-bar .z1{opacity:.35}.z-bar .z2{opacity:.5}.z-bar .z3{opacity:.7}.z-bar .z4{opacity:.85}
.z-time{text-align:right}
.hr-graph svg{width:100%;height:auto}
.polar-ex li{display:flex;justify-content:space-between;gap:12px;padding:10px 0}
/* ---------- checkmark multi-select */
.checkpick{position:relative;display:grid;gap:8px}
.checkpick-btn{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;text-align:left;background:var(--bg-deep);border:1px solid var(--line);border-radius:8px;padding:11px 12px;color:inherit;font:inherit;cursor:pointer;min-height:46px}
.checkpick-btn span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.checkpick-list{display:grid;gap:2px;max-height:300px;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px}
.checkpick-opt{display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:6px;cursor:pointer}
.checkpick-opt:hover{background:var(--bg-deep)}
.checkpick-opt input{position:absolute;opacity:0;width:1px;height:1px}
.checkpick-opt input:focus-visible+.tick{outline:2px solid var(--lime);outline-offset:2px}
.checkpick-opt .tick{width:20px;height:20px;border:1px solid var(--line);border-radius:5px;display:inline-grid;place-items:center;color:var(--lime);font-weight:700;flex:none}
.checkpick-opt.on .tick{border-color:var(--lime)}
.other-side{justify-self:start}
/* ---------- food log days */
.food-slots{display:grid;gap:12px}
.food-slot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0}
.food-slot.done{border-color:var(--lime)}
/* ---------- meal-time nutrition plans */
.estimates{display:grid;gap:8px}
.meal-plan{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:0}
.meal-plan>li{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:12px 0;border-top:1px solid var(--line)}
.meal-time{font:700 15px var(--mono);color:var(--lime)}
.meal-items{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.meal-items li{display:grid;gap:2px}
.meal-items.edit li{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid var(--line)}
.meal-items.edit .amt{width:64px}
.meals-edit{display:grid;gap:12px}
.meal-edit{margin:0;display:grid;gap:10px}
.meal-head{display:flex;justify-content:space-between;align-items:end;gap:12px}
.meal-head .fld{max-width:180px}
.food-add{display:grid;gap:8px}
.food-add-row{display:flex;gap:8px}
.food-add-row input{flex:1}
.food-results{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:8px;max-height:280px;overflow:auto}
.food-results button{display:block;width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:10px 12px;color:inherit;font:inherit;cursor:pointer}
.food-results li:first-child button{border-top:0}
.food-results button:hover,.food-results button:focus-visible{background:var(--bg-deep)}
.food-pick{display:grid;gap:6px;padding:10px 12px;border:1px solid var(--lime);border-radius:8px}
.food-pick-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.food-pick-row input{width:80px}
.plan-body.short{min-height:120px}
@media (max-width:520px){.meal-plan>li{grid-template-columns:1fr;gap:4px}}