/* v104: the optional training log. Existing diary and WHOOP screens keep their layout. */
#trainingView{--tr-surface:var(--surface,#fff);--tr-raised:var(--raised,#edf5f6);--tr-accent:var(--teal,#009fa9);--tr-fill:var(--accent-fill,#087f83);max-width:760px;margin:0 auto;color:var(--ink);font-size:14px}
#trainingRoot *{box-sizing:border-box}
#trainingRoot button,#trainingRoot input,#trainingRoot select,#trainingRoot textarea{font-family:inherit}
#trainingRoot button{min-height:44px;margin:0;border-radius:10px;padding:8px 12px;box-shadow:none;cursor:pointer;font-size:13px;background:var(--tr-raised);color:var(--ink);border:1px solid var(--line)}
#trainingRoot button:disabled{opacity:.5;cursor:wait}
#trainingRoot button:focus-visible,#trainingRoot input:focus-visible,#trainingRoot select:focus-visible,#trainingRoot textarea:focus-visible,#trainingRoot summary:focus-visible{outline:2px solid var(--tr-accent);outline-offset:2px}
#trainingRoot .tr-primary{background:var(--tr-fill);color:var(--on-accent,#fff);border-color:var(--tr-accent);font-weight:650}
#trainingRoot .tr-link{background:none;border-color:transparent;color:var(--tr-accent);padding:4px 8px}
#trainingRoot .tr-danger{color:var(--danger,#bf6170)}
.tr-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:0 2px 2px}
.tr-heading h1{margin:0;font-size:20px;line-height:26px;letter-spacing:0}
.tr-heading small{font-size:11px;color:var(--muted);text-align:right}
.tr-whoop{padding:5px 11px;border:1px solid var(--line);border-radius:12px;background:var(--tr-surface);margin-bottom:4px}
.tr-whoop details{border:0;padding:0;margin:0}
.tr-whoop summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;min-height:44px}
.tr-whoop summary::-webkit-details-marker{display:none}
.tr-whoop summary>div{flex:1;min-width:0}
.tr-whoop-title{display:block;color:var(--muted);font-size:10px;line-height:12px}
.tr-whoop-metrics{display:flex;gap:15px;justify-content:space-between;flex-wrap:wrap;margin-top:2px;font-size:12px;line-height:16px}
.tr-whoop-metrics span{color:var(--muted)}
.tr-whoop-metrics b{color:var(--ink);font-size:14px;margin-left:4px;font-variant-numeric:tabular-nums}
.tr-whoop-metrics b[data-zone="green"]{color:#70b69a}.tr-whoop-metrics b[data-zone="yellow"]{color:#bca65a}.tr-whoop-metrics b[data-zone="red"]{color:#df7883}
.tr-whoop-chevron{font-size:22px;color:var(--muted)}
.tr-whoop details[open] .tr-whoop-chevron{transform:rotate(90deg)}
.tr-whoop p,.tr-muted{color:var(--muted);font-size:11px;line-height:1.45;margin:5px 0}
.tr-whoop-workouts{margin:4px 0 0;padding:4px 0 0;list-style:none;border-top:1px solid var(--line)}
.tr-whoop-workouts li{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:2px 0;font-size:12px;line-height:17px}
.tr-whoop-workouts strong{font-weight:550;overflow-wrap:anywhere}
.tr-whoop-workouts small{color:var(--muted);text-align:right;flex-shrink:0;font-size:11px}
.tr-tabs{display:grid;grid-template-columns:1fr 1fr;border-radius:10px;background:var(--tr-surface);padding:2px;gap:3px;margin:0 0 5px}
#trainingRoot .tr-tabs button{min-height:44px;padding:5px;border:0;background:none;color:var(--muted);border-radius:8px}
#trainingRoot .tr-tabs button[aria-pressed="true"]{color:var(--ink);background:var(--tr-raised);font-weight:650}
.tr-session-heading{display:flex;align-items:center;justify-content:space-between;gap:7px;margin:0 2px}
.tr-session-overview{min-width:0;flex:1}
.tr-session-heading h2{font-size:17px;line-height:22px;margin:0;overflow-wrap:anywhere}
#trainingRoot .tr-options{padding:0;min-width:44px;min-height:44px;border:0;background:none;color:var(--muted);font-size:20px}
.tr-session-state{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:11px;line-height:15px;margin:2px 0 3px;font-variant-numeric:tabular-nums}
.tr-session-state .tr-running{color:var(--tr-accent)}
.tr-progress{height:3px;border-radius:5px;background:var(--line);overflow:hidden;margin:0 2px 4px}
.tr-progress span{display:block;height:100%;background:var(--tr-accent)}
.tr-exercises{display:grid;gap:3px;margin:0;padding:0;list-style:none}
.tr-exercise{border:1px solid var(--line);border-radius:12px;background:var(--tr-surface);overflow:hidden;min-width:0}
.tr-exercise.tr-open{border-color:var(--tr-accent)}
.tr-exercise-titlebar{display:flex;align-items:center}
#trainingRoot .tr-exercise-more{min-width:44px;width:44px;height:44px;padding:0;font-size:22px;border:0;background:none;color:var(--muted)}
#trainingRoot .tr-exercise-head{min-width:0;flex:1;display:flex;align-items:center;width:100%;gap:8px;text-align:left;border:0;background:none;min-height:44px;padding:4px 10px;border-radius:0}
.tr-exercise-head>span:nth-child(2){flex:1;min-width:0}
.tr-exercise-head strong{font-size:14px;line-height:17px;font-weight:550;display:block;overflow-wrap:anywhere}
.tr-exercise-head small{display:block;font-size:10px;line-height:14px;color:var(--muted);margin-top:2px;overflow-wrap:anywhere}
.tr-number{color:var(--muted);font-size:12px;flex:0 0 21px;text-align:center}
.tr-number.tr-done{border-radius:7px;padding:3px;background:var(--tr-fill);color:var(--on-accent,#fff)}
.tr-exercise-count{font-size:11px;color:var(--muted);white-space:nowrap}
.tr-exercise-count.tr-done{color:var(--tr-accent)}
.tr-chevron{color:var(--muted);font-size:15px;margin-left:4px}
.tr-open .tr-exercise-head{min-height:44px;padding:8px 11px 3px}
.tr-open .tr-exercise-head>.tr-number{display:none}
.tr-exercise-body{padding:0 7px 3px}
.tr-set-head,.tr-set{display:grid;grid-template-columns:minmax(45px,.8fr) minmax(64px,1fr) minmax(64px,1fr) 52px;gap:8px;align-items:center}
.tr-set-head{color:var(--muted);font-size:10px;line-height:16px;padding:0 5px;text-align:center}
.tr-set-head span:first-child{text-align:left}
.tr-set{min-height:44px;border-radius:8px;padding:0 5px;font-variant-numeric:tabular-nums}
.tr-set.tr-next{background:color-mix(in srgb,var(--tr-accent) 12%,transparent)}
#trainingRoot .tr-set-number{padding:0;background:none;border:0;min-height:44px;min-width:44px;text-align:left;font-size:12px;color:var(--muted)}
#trainingRoot .tr-set input{display:block;width:100%;min-width:0;min-height:44px;padding:5px 4px;text-align:center;font-size:16px;line-height:22px;border:1px solid var(--line);border-radius:7px;background:var(--tr-raised);color:var(--ink);appearance:textfield;font-variant-numeric:tabular-nums}
#trainingRoot .tr-set input::-webkit-inner-spin-button,#trainingRoot .tr-set input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#trainingRoot .tr-set.tr-completed input{background:none;border-color:transparent}
#trainingRoot .tr-check{width:44px;height:44px;padding:0;background:none;border:0;justify-self:center;display:grid;place-items:center}
.tr-check>span{display:grid;place-items:center;width:23px;height:23px;border:1.5px solid var(--line);border-radius:7px;color:transparent;font-size:18px;line-height:1}
.tr-check[aria-pressed="true"]>span{background:var(--tr-fill);border-color:var(--tr-fill);color:var(--on-accent,#fff)}
.tr-rest{display:flex;gap:6px;align-items:center;border-top:1px solid var(--line);padding:1px 4px 0;margin-top:0;min-height:40px}
.tr-rest-label{font-size:11px;color:var(--muted)}
.tr-rest b{font-size:14px;font-variant-numeric:tabular-nums;min-width:44px;margin-left:5px}
.tr-rest-icon{width:20px;height:20px;color:var(--tr-accent);flex-shrink:0}
#trainingRoot .tr-rest button{font-size:11px;min-height:44px;padding:3px 9px;margin-left:auto;border:0}
#trainingRoot .tr-rest .tr-link{margin-left:0}
#trainingRoot .tr-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:8px;margin-top:6px}
.tr-actions button{min-height:45px!important}
.tr-status{color:var(--muted);font-size:10px;text-align:center;line-height:15px;min-height:15px;margin:2px 2px 2px;overflow-wrap:anywhere}
.tr-error{border:1px solid var(--danger,#bf6170);color:var(--ink);padding:10px;border-radius:10px;font-size:12px;line-height:1.45;margin:8px 0}
.tr-error p{margin:0 0 6px}
.tr-empty{background:var(--tr-surface);border:1px solid var(--line);border-radius:12px;padding:20px 14px;margin:8px 0;text-align:center}
.tr-empty h2{font-size:18px;margin:0 0 8px}.tr-empty p{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 15px}
#trainingRoot .tr-empty>button{width:100%;margin-top:7px}
.tr-history-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
#trainingRoot .tr-history-item{display:flex;width:100%;text-align:left;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;background:var(--tr-surface)}
.tr-history-item span{min-width:0}.tr-history-item b{font-size:14px;overflow-wrap:anywhere}.tr-history-item small{display:block;color:var(--muted);font-size:11px;line-height:17px;margin-top:3px}
.tr-history-summary{display:flex;gap:16px;flex-wrap:wrap;margin:8px 2px 12px;font-size:12px;color:var(--muted)}
.tr-history-summary b{color:var(--ink)}
.tr-history-detail{padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--tr-surface);margin:8px 0}
.tr-history-detail h3{font-size:14px;margin:0 0 4px}.tr-history-detail p{font-size:12px;line-height:1.5;margin:3px 0;overflow-wrap:anywhere}
.tr-history-detail ul{list-style:none;padding:0;margin:4px 0;color:var(--muted);font-size:12px;line-height:1.7}
.tr-history-detail li{display:flex;gap:8px;justify-content:space-between}.tr-history-detail li span:last-child{color:var(--ink);text-align:right}
#trainingRoot .tr-history-detail>button{margin-top:7px}
#trainingRoot dialog{width:min(480px,calc(100% - 20px));max-height:calc(100dvh - 32px);padding:15px;color:var(--ink);background:var(--tr-surface);border:1px solid var(--line);border-radius:15px;overflow:auto}
#trainingRoot dialog::backdrop{background:#0009}
.tr-dialog-head{display:flex;gap:8px;justify-content:space-between;align-items:center;margin-bottom:9px}
.tr-dialog-head h2{font-size:18px;margin:0}
#trainingRoot .tr-dialog-close{min-width:44px;padding:4px}
#trainingRoot .tr-search,#trainingRoot .tr-field input,#trainingRoot .tr-field select,#trainingRoot .tr-field textarea{width:100%;padding:10px;font-size:16px;border:1px solid var(--line);border-radius:9px;color:var(--ink);background:var(--tr-raised);min-height:44px;margin:0}
.tr-catalogue{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:5px}
#trainingRoot .tr-catalogue button{display:block;width:100%;text-align:left;background:var(--tr-raised);min-height:57px}
.tr-catalogue strong{display:block;font-size:14px}.tr-catalogue small{display:block;color:var(--muted);font-size:11px;margin-top:3px;line-height:16px}
.tr-field{display:block;color:var(--muted);font-size:12px;line-height:1.6;margin:10px 0}
#trainingRoot .tr-dialog-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:12px}
#trainingRoot .tr-progress-row{padding:9px 0;border-top:1px solid var(--line)}
.tr-progress-row strong{display:block;font-size:14px;line-height:19px}
.tr-progress-row p{font-size:12px;color:var(--muted);line-height:1.5;margin:3px 0}
#trainingRoot [hidden]{display:none!important}
body:has(#trainingView:not([hidden])) main{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
@media(max-width:600px){
 body:has(#trainingView:not([hidden]))>header{height:46px;min-height:46px;padding:1px 10px;gap:4px}
 body:has(#trainingView:not([hidden])) main{padding-top:5px;padding-left:8px;padding-right:8px}
}
@media(max-width:360px){.tr-whoop-metrics{gap:5px;font-size:10px}.tr-whoop-metrics b{font-size:12px;margin-left:2px}.tr-set-head,.tr-set{grid-template-columns:44px minmax(55px,1fr) minmax(55px,1fr) 44px;gap:5px}.tr-heading small{font-size:10px}.tr-rest{gap:3px}.tr-rest b{margin-left:1px}.tr-actions{grid-template-columns:1fr 1.25fr!important}#trainingRoot .tr-actions button{font-size:12px;padding:7px}}

#trainingRoot .tr-create-exercise{width:100%;margin-top:9px;text-align:left}
#trainingRoot #trCreateExerciseFields{border:0;padding:0;margin:0;min-width:0}
#trainingRoot .tr-create-details{margin-top:12px;padding:0;border:0}
#trainingRoot .tr-create-details summary{min-height:44px;display:flex;align-items:center;cursor:pointer;font-size:13px;color:var(--tr-accent)}
#trainingRoot .tr-field textarea{resize:vertical}
#trainingRoot .tr-field select{white-space:normal;max-width:100%}
#trainingRoot .tr-dialog-head h2,#trainingRoot .tr-catalogue strong{overflow-wrap:anywhere}