/* Body measurements (owner-approved proposal 2026-10-10): Body › Measurements, one measurement, Weigh & measure, the Body
   cards and the block in the muscle sheet. Visual only; KGYM's own tokens (light and dark), logical properties only (so a
   right-to-left page mirrors), the app's real buttons (shared-action, second-action, segmented). The phone first; the
   website (900 px and wider) has its own layout below — never the phone column stretched. */
.measure-page{display:grid;gap:var(--kgym-s3);min-width:0}
.measure-page>*{min-width:0}
.measure-back{justify-self:start;gap:4px;padding-inline:8px 14px}
.measure-back .measure-glyph{width:18px;height:18px}
.measure-glyph{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.second-action.icon-only{width:44px;min-width:44px;padding:0}
.shared-action .measure-glyph{width:18px;height:18px;flex:none}
.measure-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--kgym-s3)}
.measure-page-note{flex-basis:100%;margin:0;color:var(--kgym-min)!important;font-weight:600}
.measure-head h1{margin:0;font:var(--kgym-t-page)/1.12 var(--lawha-display)}
.measure-head .page-date{margin:0 0 2px;font-size:var(--kgym-t-small);color:var(--lawha-muted)}
.measure-page .card{margin:0;padding:var(--kgym-pad);border:var(--lawha-rule);border-radius:var(--lawha-radius);background:var(--lawha-surface)}
.measure-page .card h2{margin:0 0 6px;font:600 var(--kgym-t-label)/1.3 var(--lawha-font)}
.measure-add{justify-content:center;gap:8px}
.measure-add-row .measure-add{width:100%;max-width:360px}
.measure-crumbs{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--lawha-muted)}
.measure-crumbs .crumb-now{color:var(--lawha-ink);font-weight:600}
/* the list */
.measure-group{margin:14px 0 2px!important;font:600 12.5px/1.3 var(--lawha-font)!important;letter-spacing:.08em;text-transform:uppercase;color:var(--lawha-muted)}
.measure-list>.measure-group:first-child{margin-top:0!important}
.measure-rows{list-style:none;margin:0;padding:0}
.measure-rows>li{border-top:var(--lawha-rule)}
.measure-rows>li:first-child{border-top:0}
.measure-row{display:grid;grid-template-columns:minmax(0,1fr) auto 18px;grid-template-areas:"name spark chev" "val spark chev" "words words words";align-items:center;column-gap:10px;row-gap:2px;width:100%;max-width:360px;min-height:44px;padding:10px 0;border:0;background:transparent;color:var(--lawha-ink);font:inherit;text-align:start;cursor:pointer}
.mr-name{grid-area:name;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:15px}
.mr-spark{grid-area:spark}
.mr-chev{grid-area:chev;color:var(--lawha-muted)}
.mr-chev .measure-glyph{width:16px;height:16px}
[dir=rtl] .mr-chev .measure-glyph,[dir=rtl] .measure-back .measure-glyph,[dir=rtl] .measure-crumb-back .measure-glyph{transform:scaleX(-1)}
.mr-val{grid-area:val;font-size:14px}
.measure-row .measure-words{grid-area:words;margin-top:4px}
.goal-tag{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;background:var(--lawha-sage);color:var(--lawha-ink);font:600 12px/1 var(--lawha-font);white-space:nowrap}
.goal-tag.is-unset{background:transparent;border:1px dashed var(--lawha-line);color:var(--lawha-muted);font-weight:500}
.measure-words{display:grid;gap:4px;justify-items:start}
.trend{display:inline-flex;align-items:flex-start;gap:6px;font-size:13.5px;line-height:1.35;color:var(--lawha-ink)}
.trend-sq{flex:none;width:12px;height:12px;margin-top:3px;border-radius:3px;border:1px solid transparent}
.trend-ar{flex:none;width:14px;font:700 15px/1.2 var(--lawha-font);text-align:center}
.tone-ok .trend-sq{background:var(--kgym-met)}
.tone-wait .trend-sq{background:var(--kgym-low)}
.tone-bad .trend-sq{background:var(--kgym-min)}
.tone-none .trend-sq{background:transparent;border-color:var(--lawha-muted)}
.measure-spark{display:block}
.measure-spark .spark-line{fill:none;stroke:var(--lawha-ink);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.measure-spark .spark-dot{stroke:var(--lawha-surface);stroke-width:1}
.spark-dot.tone-ok{fill:var(--kgym-met)}.spark-dot.tone-wait{fill:var(--kgym-low)}.spark-dot.tone-bad{fill:var(--kgym-min)}.spark-dot.tone-none{fill:var(--lawha-muted)}
/* one measurement */
.measure-one{display:grid;gap:var(--kgym-s3)}
.measure-big{display:flex;align-items:baseline;gap:8px;margin:0 0 6px}
.measure-big b{font:400 var(--kgym-t-big)/1.1 var(--lawha-display)}
.measure-big small{font-size:13px;color:var(--lawha-muted)}
.measure-label{margin:14px 0 6px;font:600 13px/1.3 var(--lawha-font);color:var(--lawha-muted)}
.measure-goal{margin:0}
.measure-chart{display:block;width:100%;height:auto;max-width:520px}
.measure-chart .chart-grid{stroke:var(--lawha-line);stroke-width:1}
.measure-chart .chart-axis{fill:var(--lawha-muted);font:11px var(--lawha-font)}
.measure-chart .chart-line{fill:none;stroke:var(--lawha-ink);stroke-width:2;stroke-linejoin:round}
.measure-chart .chart-line.is-dashed{stroke-dasharray:5 4}
.measure-chart .chart-dot{fill:var(--lawha-surface);stroke:var(--lawha-ink);stroke-width:1.6}
.measure-chart .chart-dot.is-last{fill:var(--kgym-met)}
.measure-chart .chart-value{fill:var(--lawha-ink);font:600 11px var(--lawha-font)}
.measure-legend{display:flex;align-items:center;gap:6px;margin:0 0 4px}
.legend-line{display:inline-block;width:22px;border-top:2px solid var(--lawha-ink)}
.legend-line.is-dashed{border-top-style:dashed}
.measure-how{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center}
.measure-how p{margin:0;font-size:14px;line-height:1.5}
.measure-figure{display:block;width:100%;height:96px}
.measure-figure.is-full{height:300px}
.mt-edge{fill:var(--kgym-skin-edge);stroke:var(--kgym-skin-edge);stroke-width:2.2;stroke-linejoin:round}
.mt-skin{fill:var(--kgym-skin)}
.mt-tape{fill:none;stroke:var(--kgym-low);stroke-width:3.6;stroke-linecap:round}
.mt-tape.is-full{stroke-width:6}
.mt-scale{fill:var(--kgym-skin);stroke:var(--kgym-skin-edge);stroke-width:2.2}
.mt-screen{fill:var(--lawha-sage)}
.measure-entries{list-style:none;margin:0;padding:0}
.measure-entries li{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:8px;align-items:center;padding:8px 0;border-top:var(--lawha-rule)}
.measure-entries li:first-child{border-top:0}
.entry-when{font-size:14px}
.entry-when small{display:block;font-size:13px;color:var(--lawha-muted)}
.measure-snack{position:fixed;inset-inline:var(--kgym-gutter);bottom:calc(68px + env(safe-area-inset-bottom));z-index:7;display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:560px;margin-inline:auto;padding:6px 6px 6px 16px;border-radius:var(--lawha-radius);background:var(--lawha-ink);color:var(--lawha-surface);font-size:14.5px;box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.measure-snack .measure-undo{gap:6px;border-color:var(--lawha-surface);color:var(--lawha-surface)}
.measure-snack .measure-undo .measure-glyph{width:18px;height:18px}
/* Weigh & measure */
.measure-cols{display:grid;gap:0}
.measure-col h3{margin:16px 0 6px;font:600 12.5px/1.3 var(--lawha-font);letter-spacing:.08em;text-transform:uppercase;color:var(--lawha-muted)}
.measure-col h3 small{font:500 12.5px var(--lawha-font);letter-spacing:0;text-transform:none}
.measure-when{margin:0}
.measure-when+.form-note{margin:4px 0 8px}
.measure-field{display:grid;grid-template-columns:minmax(0,1fr) 124px;gap:8px;align-items:center;padding:6px 0;border-top:var(--lawha-rule)}
.measure-field.is-pair{grid-template-columns:minmax(0,1fr) 84px 84px}
.measure-name{display:flex;align-items:center;gap:8px;min-width:0;font-size:15px}
.measure-name>span{min-width:0}
.measure-optional{font-size:13px;color:var(--lawha-muted)}
.measure-last{display:block;font-size:12.5px;color:var(--lawha-muted)}
.measure-box{position:relative;display:block}
.measure-input{box-sizing:border-box;width:100%;min-height:44px;padding:8px 10px;border:var(--lawha-rule);border-radius:var(--lawha-radius);background:var(--lawha-paper);color:var(--lawha-ink);font:var(--kgym-t-input) var(--lawha-font);text-align:end}
.measure-box .measure-input{padding-inline-end:38px}
.measure-unit{position:absolute;inset-inline-end:10px;top:50%;transform:translateY(-50%);font-size:13px;color:var(--lawha-muted);pointer-events:none}
.measure-input[aria-invalid=true],.measure-when input[aria-invalid=true]{border:2px solid var(--kgym-min)}
.measure-pairhead{display:grid;grid-template-columns:minmax(0,1fr) 84px 84px;gap:8px;margin:6px 0 0;font-size:13px;color:var(--lawha-muted);text-align:center}
.measure-howbox{display:grid;grid-template-columns:80px minmax(0,1fr);gap:10px;align-items:center;margin:0 0 8px;padding:10px 12px;border-radius:var(--lawha-radius);background:var(--lawha-paper)}
.measure-howbox p{margin:0;font-size:13.5px;line-height:1.5}
.measure-howbox .measure-figure{height:80px}
.measure-how-toggle[aria-expanded=true]{background:var(--lawha-ink);color:var(--lawha-surface)}
.measure-note{margin:12px 0 0;color:var(--kgym-min)!important;font-weight:600}
.measure-foot{display:flex;gap:var(--kgym-s2);margin-top:16px}
.measure-foot>button{flex:1 1 0;justify-content:center}
.measure-page .measure-foot .shared-action{margin:0}
/* Body: the Measuring day card, the Measurements card, and the block in the muscle sheet */
.measure-due,.measure-card-body{margin:0 0 var(--kgym-s3);padding:var(--kgym-pad);border:var(--lawha-rule);border-radius:var(--lawha-radius);background:var(--lawha-surface)}
.measure-due{border-inline-start:4px solid var(--kgym-low)}
.measure-due .due-line{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start}
.measure-due .due-line .measure-glyph{width:24px;height:24px;margin-top:2px}
.measure-due p{margin:0 0 2px;font-size:14px}
.measure-due .form-note{margin:0}
.measure-due .due-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.measure-due .due-actions .shared-action{margin:0;min-height:44px}
.measure-card-body .card-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.measure-card-body h2{margin:0;font:var(--kgym-t-card)/1.2 var(--lawha-display)}
.measure-card-body .card-head span{font-size:13px;color:var(--lawha-muted)}
.measure-mini{list-style:none;margin:8px 0 10px;padding:0}
.measure-mini li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 10px;padding:8px 0;border-top:var(--lawha-rule);font-size:14px}
.measure-mini li:first-child{border-top:0}
.measure-mini .measure-words{grid-column:1/-1}
.measure-all{gap:8px}
.measure-all .measure-glyph{width:16px;height:16px}
.measure-block{margin:12px 0 0;padding:12px;border:var(--lawha-rule);border-radius:var(--lawha-radius);background:var(--lawha-paper)}
.measure-block .block-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.measure-block h3{margin:0;font:600 15px/1.3 var(--lawha-font)}
.measure-block .block-sides{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 10px;align-items:center;margin:8px 0 6px;font-size:13px}
.measure-block .block-sides span{color:var(--lawha-muted)}
.measure-block .block-sides .measure-spark{width:100%;max-width:120px}
.measure-block .form-note{margin:8px 0 10px}
.measure-block .second-action{gap:6px}
@media (max-width:359px){.measure-field{grid-template-columns:minmax(0,1fr) 104px}.measure-field.is-pair,.measure-pairhead{grid-template-columns:minmax(0,1fr) 72px 72px}}
/* === The website, 900 px and wider: the list becomes a table beside the chosen measurement; the form spreads into columns
   with the how-to drawing beside them and its buttons at the bottom right; the Undo bar sits bottom right. === */
@media (min-width:900px){
.measure-page>.measure-back{display:none}
.measure-head .measure-add{flex:none}
.measure-web{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:24px;align-items:start}
.measure-table-card{padding:6px 8px!important}
.measure-table{width:100%;border-collapse:collapse;font-size:14px}
.measure-table th{padding:10px 8px;font:600 12px/1.3 var(--lawha-font);color:var(--lawha-muted);text-align:start}
.measure-table thead th{border-bottom:var(--lawha-rule)}
.measure-table .mt-group th{padding:14px 8px 4px;letter-spacing:.08em;text-transform:uppercase}
.measure-table td{padding:6px 8px;border-top:var(--lawha-rule);vertical-align:middle}
.measure-table .mt-group+tr td{border-top:0}
.measure-table tr.is-current td{background:var(--lawha-sage)}
.measure-table tr.is-current .measure-pick small{color:var(--lawha-ink)}
.measure-table .mt-last{white-space:nowrap}
.measure-pick{display:grid;justify-items:start;width:100%;min-height:44px;padding:4px 0;border:0;background:transparent;color:var(--lawha-ink);font:inherit;text-align:start;cursor:pointer}
.measure-pick small{font-size:12.5px;color:var(--lawha-muted)}
.measure-zone{padding:16px 18px;border:var(--lawha-rule);border-radius:var(--lawha-radius);background:var(--lawha-surface)}
.measure-zone .zone-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.measure-zone .zone-where{margin:0;font-size:13px;color:var(--lawha-muted)}
.measure-zone h2{margin:0 0 6px;font:var(--kgym-t-card)/1.2 var(--lawha-display)}
.measure-zone .measure-how{margin-top:12px}
.measure-empty{padding:22px 18px;border:1.5px dashed var(--lawha-line);border-radius:var(--lawha-radius);text-align:center;font-size:14px;color:var(--lawha-muted)}
.measure-empty b{display:block;margin:0 0 4px;font:400 19px/1.25 var(--lawha-display);color:var(--lawha-ink)}
.measure-form{padding:18px 22px!important}
.measure-cols{grid-template-columns:minmax(230px,1fr) minmax(250px,1fr) minmax(280px,1.15fr) 220px;gap:0 28px;align-items:start}
.measure-col h3{margin-top:0}
.measure-help{padding-inline-start:20px;border-inline-start:var(--lawha-rule)}
.measure-help h3{margin:0 0 8px;font:600 15px/1.3 var(--lawha-font)}
.measure-help p{margin:8px 0 0;font-size:13.5px;line-height:1.5}
.measure-help .measure-figure{height:260px}
.measure-foot{justify-content:flex-end;margin:18px -22px -18px;padding:14px 22px;border-top:var(--lawha-rule)}
.measure-foot>button{flex:0 0 auto;min-width:120px}
.measure-snack{inset-inline:auto 32px;bottom:26px;width:420px;max-width:none}
.screen-body>.body-side-parts{grid-column:1;grid-row:3;align-self:start}
}