/*
 * Weight assessment calculator (/weight-assessment/, 2026-11-05).
 * Loaded only on that page (see ptany_enqueue_styles in functions.php).
 * Everything is scoped under .wa so nothing here can touch other pages.
 * Layout: inputs card on the left (sticky on desktop), results on the right in two
 * tabs, "Your assessment" (Steps 1 to 3) and "Weight loss" (Step 4). One column on
 * phones, with the tab bar pinned under the site header. --wa-head is the site
 * header's height, measured by weight-assessment.js (0 when there is no header).
 * Several rules exist only to undo GeneratePress defaults (button colors,
 * table borders, paragraph and list margins).
 */
.wa{
  --wa-band:var(--gray);        /* #F2F2F2 cards */
  --wa-soft:#555555;            /* secondary text */
  --wa-line:#DADDE2;
  /* scale colors: meaning (good / caution / risk), separate from the brand blue */
  --sc-low:#C9CED6;
  --sc-ok:#6E9E78;
  --sc-caution:#D8A94A;
  --sc-risk:#C46A55;
  --warn-bg:#FBF3E2;
  --warn-ink:#6B4E12;
  --alert-bg:#FBE9E5;           /* below-minimum calorie warnings */
  --alert-ink:#8A2E1C;
  --alert-line:#B5523B;
  max-width:1080px;
}
.wa [hidden]{display:none!important}
.wa *{box-sizing:border-box}
.wa p{margin:0}
.wa .lede{margin-bottom:8px;max-width:62ch}
.wa h3,.wa h4{margin:0;text-wrap:balance}
.wa a{color:var(--blue)}
.wa a:hover{color:var(--blue-hover)}
.wa sup.ref{font-size:.7em;line-height:0;margin-left:1px}
.wa sup.ref a{font-weight:600}
.wa [id^="src-"],.wa #tabsTop,.wa #exercise-help,.wa #acts{scroll-margin-top:calc(var(--wa-head,0px) + 16px)}

.wa .grid{display:grid;grid-template-columns:330px minmax(0,1fr);gap:36px;margin-top:28px;align-items:start}
@media (max-width:820px){.wa .grid{grid-template-columns:minmax(0,1fr)}}

/* ---- inputs ---- */
.wa .inputs{background:var(--wa-band);border-radius:10px;padding:22px;position:sticky;top:calc(var(--wa-head,0px) + 16px);max-height:calc(100vh - var(--wa-head,0px) - 32px);overflow-y:auto;font-size:17px}
@media (max-width:820px){.wa .inputs{position:static;max-height:none;overflow:visible}}
body:not(.home) .wa .inputs h2{font:600 21px/1.2 var(--disp);font-variant-caps:normal;letter-spacing:0;margin:0}
.wa .example-note{font-size:14px;color:var(--wa-soft);margin:6px 0 16px}
.wa .field{display:grid;gap:6px;margin-bottom:14px;align-content:start}
.wa .field>label,.wa .field>.lbl{font-weight:600;font-size:15px;margin:0}
.wa .row{display:flex;gap:10px}
.wa .row>*{flex:1;min-width:0}
.wa input[type=number],.wa input[type=date],.wa select{width:100%;font:400 17px/1.3 var(--body);color:var(--ink);background:var(--white);border:1px solid var(--wa-line);border-radius:6px;padding:10px 12px;min-height:46px;margin:0}
.wa .unit{position:relative}
.wa .unit input{padding-right:38px}
.wa .unit span{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--wa-soft);font-size:15px;pointer-events:none}
.wa input:focus-visible,.wa select:focus-visible,.wa .seg label:focus-within,.wa button:focus-visible{outline:3px solid var(--macoun);outline-offset:2px}
.wa .seg{display:flex;border:1px solid var(--blue);border-radius:6px;overflow:hidden}
.wa .seg label{flex:1;text-align:center;padding:9px 6px;cursor:pointer;font-weight:600;font-size:15px;color:var(--blue);background:var(--white);margin:0}
.wa .seg label+label{border-left:1px solid var(--blue)}
.wa .seg input{position:absolute;opacity:0;pointer-events:none}
.wa .seg label:has(input:checked){background:var(--blue);color:var(--white)}
.wa .hint{font-size:13px;line-height:1.45;color:var(--wa-soft)}
.wa .btn-reset,.wa .btn-reset:hover,.wa .btn-reset:focus{font:600 15px var(--body);color:var(--blue);background:none;border:0;padding:4px 0;cursor:pointer;text-decoration:underline}
.wa .privacy{font-size:13px;color:var(--wa-soft);margin-top:14px;border-top:1px solid var(--wa-line);padding-top:12px}
.wa #forgetMsg{color:var(--ink)}
.wa #savedNote{color:var(--ink)}

/* ---- results ---- */
.wa .results{display:grid;gap:36px;min-width:0;font-size:17px;line-height:1.55}
.wa .step{display:grid;gap:12px;min-width:0}
.wa .eyebrow{font:600 12px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--macoun)}
.wa .step h3{font:600 24px/1.15 var(--disp)}
/* tabs: Your assessment / Weight loss */
.wa .tabs{display:flex;gap:4px;border-bottom:3px solid var(--blue);position:sticky;top:var(--wa-head,0px);z-index:5;background:var(--white);padding-top:8px}
.wa .tabs button,.wa .tabs button:hover,.wa .tabs button:focus{flex:1;font:600 18px/1.2 var(--disp);color:var(--blue);background:var(--wa-band);border:0;border-radius:8px 8px 0 0;padding:14px 12px;cursor:pointer;margin:0}
.wa .tabs button:hover{background:#E4E9F0}
.wa .tabs button[aria-selected="true"]{background:var(--blue);color:var(--white)}
/* three tabs on a phone: smaller text so the labels fit */
@media (max-width:480px){.wa .tabs button,.wa .tabs button:hover,.wa .tabs button:focus{font-size:15px;padding:12px 6px}}
/* Eating well tab: lists, and calorie counts under each item in the cuts table */
.wa .ewlist{margin:0;padding-left:22px;display:grid;gap:8px;max-width:62ch}
.wa .ewlist li{margin:0}
/* Our own recipe, folded up under the meals table: tap the title to open it */
.wa .ewrecipe{border:1px solid var(--wa-line);border-radius:8px;padding:12px 16px;max-width:62ch}
.wa .ewrecipe>p,.wa .ewrecipe>ul,.wa .ewrecipe>ol{margin-top:14px}
.wa .ewrecipe>p+ul,.wa .ewrecipe>p+ol{margin-top:8px}
.wa .ewrecipe summary{cursor:pointer;font-weight:600;color:var(--blue)}
.wa .ewrecipe summary small{display:block;font-weight:400;font-size:14px;color:var(--wa-soft)}
/* "Print this tab" button, top right of each tab. The negative margin tucks it closer
   to the first section (the panel's 36px gap would otherwise leave a big space). */
.wa .printbar{display:flex;justify-content:flex-end;margin-bottom:-24px}
.wa .printbtn,.wa .printbtn:focus{display:inline-flex;align-items:center;gap:8px;font:600 15px/1 var(--disp);color:var(--blue);background:var(--white);border:1.5px solid var(--blue);border-radius:6px;padding:9px 14px;cursor:pointer;margin:0}
.wa .printbtn:hover{background:#E4E9F0;color:var(--blue)}
.wa .printbtn svg{width:18px;height:18px}
.wa .printinfo{display:none}
.wa .ew .compare td small{display:block;font-size:13px;color:var(--wa-soft)}
.wa .ew .compare td:not(:first-child),.wa .ew .compare th:not(:first-child){white-space:normal;text-align:left}
.wa .ewcuts td:last-child,.wa .ewcuts th:last-child{white-space:nowrap;font-weight:600}
/* Easy cuts colors: "Instead of" soft red, "Try" soft green, and "Saves" boxed on its own
   (white, green outline, number centered) so it stands apart. Small gaps between the columns.
   The text stays dark on the light tints for contrast; the little calorie counts keep the gray. */
.wa .ew .ewcuts{border-collapse:separate;border-spacing:6px 6px}
.wa .ewcuts td{border-bottom:0;border-radius:6px}
.wa .ewcuts td:nth-child(1){background:var(--alert-bg)}
.wa .ewcuts td:nth-child(2){background:var(--tgt-bg)}
.wa .ew .ewcuts td:nth-child(3){background:var(--white);border:2px solid var(--tgt-line);color:var(--tgt);text-align:center;min-width:64px}
.wa .ewcuts th{border-bottom:0;padding-bottom:0}
.wa .ewcuts th:nth-child(1){color:var(--alert-ink)}
.wa .ewcuts th:nth-child(2){color:var(--tgt)}
.wa .ew .ewcuts th:nth-child(3){color:var(--tgt);text-align:center}
.wa .panel{display:grid;gap:36px;min-width:0}
.wa .next{padding-top:4px}
.wa .nextbtn,.wa .nextbtn:focus{font:600 17px/1 var(--disp);color:var(--white);background:var(--blue);border:0;border-radius:6px;padding:16px 24px;cursor:pointer}
.wa .nextbtn:hover{background:var(--blue-hover);color:var(--white)}
.wa .part-head{display:grid;gap:10px}
/* Osteoporosis caution under the daily target box (1.8.79), same width. Same look as the blog's
   "Talk to your doctor first" box; never folded, and it prints with the tab. */
.wa .bonecaution{max-width:600px;box-sizing:border-box;padding:16px 20px;background:var(--white);border:1px solid var(--wa-line);border-left:4px solid var(--blue);border-radius:6px;font-size:16px;line-height:1.55;color:var(--ink)}
.wa .bonecaution p{margin:0 0 8px}
.wa .bonecaution ul{margin:0 0 0 20px;padding:0}
.wa .bonecaution li{margin:4px 0}
.wa .big{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.wa .big b{font:600 clamp(34px,6vw,44px)/1 var(--disp);font-variant-numeric:tabular-nums}
.wa .unitlbl{color:var(--wa-soft)}
.wa .chip{display:inline-flex;align-items:center;gap:7px;font-weight:600;font-size:15px;padding:4px 11px;border-radius:999px;background:var(--wa-band)}
.wa .chip i{width:10px;height:10px;border-radius:50%;display:inline-block}
.wa .explain{max-width:62ch}
.wa .note{font-size:15px;color:var(--wa-soft);max-width:62ch}
.wa .warn{background:var(--warn-bg);color:var(--warn-ink);border-radius:8px;padding:12px 14px;font-size:15px}
.wa .warn.below{background:var(--alert-bg);color:var(--alert-ink);border-left:4px solid var(--alert-line)}
.wa .risk{font-weight:600}
.wa .sub{display:grid;gap:12px;padding-top:22px;border-top:1px solid var(--wa-line)}
.wa .step > .sub:first-of-type{border-top:0;padding-top:0}
.wa .sub h4{font:600 18px var(--disp)}
.wa .opt{font:400 14px var(--body);color:var(--wa-soft)}

/* scale bar */
.wa .scale{position:relative;padding-top:34px;padding-bottom:26px}
.wa .bar{display:flex;height:14px;border-radius:7px;overflow:hidden}
.wa .bar span{display:block;height:100%}
.wa .marker{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;transition:left .35s ease}
.wa .marker em{font:600 14px var(--body);font-style:normal;background:var(--ink);color:var(--white);padding:2px 7px;border-radius:4px;white-space:nowrap;font-variant-numeric:tabular-nums}
.wa .marker::after{content:"";width:3px;height:26px;background:var(--ink);border-radius:2px;margin-top:2px}
.wa .tick{position:absolute;bottom:0;transform:translateX(-50%);font-size:13px;color:var(--wa-soft);font-variant-numeric:tabular-nums}
.wa .legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:14px;color:var(--wa-soft);margin:0;padding:0;list-style:none}
.wa .legend li{display:flex;align-items:center;gap:6px;margin:0}
.wa .legend i{width:10px;height:10px;border-radius:2px;display:inline-block}
.wa .legend li.on{color:var(--ink);font-weight:600}

/* healthy-range boxes and the calorie-burn row */
.wa .ideal{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:1px;background:var(--wa-line);border-radius:8px;overflow:hidden;max-width:620px}
.wa .ideal div{background:var(--white);padding:10px 12px;display:grid;gap:2px;align-content:start}
.wa .ideal div:first-child{background:var(--wa-band)}
.wa .ideal small,.wa .range small{font-size:13px;color:var(--wa-soft)}
.wa .ideal strong{font:600 19px var(--disp);font-variant-numeric:tabular-nums}
@media (max-width:480px){.wa .ideal{grid-template-columns:1fr 1fr}.wa .ideal div:first-child{grid-column:1/-1}}
.wa .range{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--wa-line);border-radius:8px;overflow:hidden}
.wa .range div{background:var(--white);padding:12px;display:grid;gap:2px}
.wa .range div.mid{background:var(--wa-band)}
.wa .range strong{font:600 22px var(--disp);font-variant-numeric:tabular-nums}
@media (max-width:420px){.wa .range strong{font-size:19px}}

/* Step 4: the plan card, minimum note, rationale */
.wa .planrange{font-size:16px;line-height:2}
/* Highlights in the plan's range line: the healthy range in light steel blue, the
   middle (the plan's aim) in solid green; white on #3F7A4E is about 5:1 contrast */
.wa .hl{font-weight:600;padding:3px 9px;border-radius:5px;white-space:nowrap}
.wa .hl-range{background:#E4ECF5;color:var(--blue)}
.wa .hl-mid{background:var(--tgt-line);color:var(--white)}
.wa .hl-high{background:var(--warn-bg);color:var(--warn-ink)}
.wa .plantarget{font:600 19px/2 var(--disp)}
.wa .plancard{border:2px solid var(--blue);border-radius:10px;padding:16px 18px;display:grid;gap:8px;max-width:600px;background:var(--white)}
.wa .plancut{font-size:15px;color:var(--wa-soft)}
.wa .plancut b{color:var(--ink)}
.wa .planlist{list-style:none;margin:4px 0 0;padding:10px 0 0;border-top:1px solid var(--wa-line);display:grid;gap:6px;font-size:15px;line-height:1.45}
.wa .planlist:empty{display:none}
.wa .planlist li{margin:0}
.wa .tag{font-weight:600;padding:1px 7px;border-radius:4px}
.wa .tag-ok{background:var(--tgt-bg);color:var(--tgt)}
.wa .tag-low{background:var(--alert-bg);color:var(--alert-ink)}
.wa .tag-high{background:var(--warn-bg);color:var(--warn-ink)}
.wa .minnote{max-width:62ch;font-size:15px;border:1px solid var(--wa-line);border-radius:8px;padding:12px 14px}
.wa .why{border-left:3px solid var(--blue);padding:4px 0 4px 16px;display:grid;gap:6px}
.wa .why h4{font:600 17px var(--disp)}
.wa #goalTarget.low{color:var(--alert-ink)}
@keyframes waFlash{0%,100%{box-shadow:0 0 0 0 transparent}50%{box-shadow:0 0 0 6px var(--alert-line)}}
.wa .flash{animation:waFlash .6s ease-in-out 3}

/* food audit (Cronometer) */
.wa .auditsteps{margin:0;padding-left:24px;display:grid;gap:8px;max-width:62ch}
.wa .auditsteps li{margin:0;padding-left:4px}

/* goal inputs and plan */
.wa .goalinputs{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:520px}
.wa .goalinputs .field{margin:0}
@media (max-width:420px){.wa .goalinputs{grid-template-columns:1fr}}
.wa .quick{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.wa .quick button,.wa .quick button:focus{font:600 14px var(--body);color:var(--blue);background:var(--white);border:1px solid var(--blue);border-radius:999px;padding:5px 12px;cursor:pointer}
.wa .quick button:hover{background:var(--blue);color:var(--white)}
.wa .linkbtn,.wa .linkbtn:hover,.wa .linkbtn:focus{font:600 13px var(--body);color:var(--blue);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline}
/* "Your goal" stands out as its own card (white, blue border; the plan inside stays gray) */
.wa .sub.goalcard{border:2px solid var(--blue);border-radius:12px;padding:20px 22px;background:var(--white);margin-top:12px;gap:14px}
.wa .goalcard > h4{font:600 26px/1.15 var(--disp)}
.wa .goalcard > h4 .opt{font-size:16px}
.wa #goalGuide{line-height:2}
@media (max-width:480px){.wa .sub.goalcard{padding:16px 14px}}
.wa .goalplan{background:var(--wa-band);border-radius:10px;padding:18px;display:grid;gap:12px;min-width:0}
/* daily-calorie slider in "Your goal": amber from the minimum up to the guideline
   cap (--amber, set by the script), gray past it; a large round handle for thumbs */
.wa .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wa .calslider{display:grid;gap:4px;max-width:560px}
.wa input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:10px;margin:12px 0 6px;border-radius:999px;background:linear-gradient(to right,var(--sc-caution) 0 var(--amber,0%),var(--wa-line) var(--amber,0%) 100%);cursor:pointer}
.wa input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:30px;height:30px;border-radius:50%;background:var(--blue);border:3px solid var(--white);box-shadow:0 1px 4px rgba(0,0,0,.35)}
.wa input[type=range]::-moz-range-thumb{width:24px;height:24px;border-radius:50%;background:var(--blue);border:3px solid var(--white);box-shadow:0 1px 4px rgba(0,0,0,.35)}
.wa input[type=range]::-moz-range-track{background:transparent}
.wa input[type=range]:focus-visible{outline:3px solid var(--blue);outline-offset:6px}
/* optional activity checkboxes in "Your goal"; a ticked row gets a blue border */
.wa .acts{border:0;margin:0;padding:12px 0 0;border-top:1px solid var(--wa-line);display:grid;gap:8px;min-width:0}
.wa .acts legend{float:left;width:100%;padding:0;margin:0 0 2px;font-weight:600;font-size:15px}
.wa .acts label{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:start;margin:0;padding:10px 12px;background:var(--white);border:1px solid var(--wa-line);border-radius:8px;font-size:15px;line-height:1.4;cursor:pointer}
.wa .acts label:has(input:checked){border-color:var(--blue);box-shadow:inset 0 0 0 1px var(--blue)}
.wa .acts input[type=radio]{width:20px;height:20px;margin:1px 0 0;accent-color:var(--blue);cursor:pointer}
.wa .acts small{display:block;font-size:13px;color:var(--wa-soft)}
.wa .actcal{font-weight:600;font-size:14px;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--blue)}
.wa .calends{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--wa-soft);font-variant-numeric:tabular-nums}
.wa .calway{font-weight:600;color:var(--ink)}
.wa .facts{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:15px;color:var(--wa-soft)}
.wa .facts b{color:var(--ink);font-variant-numeric:tabular-nums}
.wa .chart svg{display:block;width:100%;height:auto}
.wa .chart .ax{stroke:var(--wa-line)}
.wa .chart .lbl{fill:var(--wa-soft);font:13px var(--body)}
.wa .chart .plan{stroke:var(--blue);fill:none;stroke-width:3}
.wa .chart .old{stroke:var(--wa-soft);fill:none;stroke-width:1.5;stroke-dasharray:5 5}
.wa .chart .goal{stroke:var(--sc-ok);stroke-width:1.5;stroke-dasharray:2 4}
.wa .chart .dot{fill:var(--blue)}
.wa .chart .key{font:14px var(--body);fill:var(--ink)}

/* timeline table (GeneratePress gives every table and cell a full border) */
.wa .compare{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums;margin:0;border:0}
.wa .compare th,.wa .compare td{text-align:left;padding:9px 8px;border:0;border-bottom:1px solid var(--wa-line)}
.wa .compare td:not(:first-child),.wa .compare th:not(:first-child){text-align:right;white-space:nowrap}
.wa .compare th{font-weight:600;color:var(--wa-soft);font-size:13px;text-transform:uppercase;letter-spacing:.06em}

/* footer: disclaimer, call to action, sources */
.wa .foot{margin-top:48px;padding-top:20px;border-top:1px solid var(--wa-line);font-size:16px;color:var(--wa-soft);max-width:70ch}
.wa .foot ul{margin:8px 0 8px 22px;padding:0}
.wa .foot li{margin:0}
.wa .form-help{margin-top:40px}
.wa .sources{margin-top:40px;max-width:80ch}
body:not(.home) .wa .sources h2{font-size:24px;margin:0}
.wa .sources ol{margin:12px 0 0;padding-left:24px;display:grid;gap:8px;font-size:14px;line-height:1.5;color:var(--wa-soft)}
.wa .sources li{padding-left:4px;margin:0;overflow-wrap:anywhere}
.wa .sources li:target{background:var(--warn-bg);color:var(--warn-ink);border-radius:4px}

@media (prefers-reduced-motion:reduce){.wa .marker{transition:none}.wa .flash{animation:none}}
/* ---- Streamlined layout (2026-11-07). The script marks what folds; see weight-assessment.js. ---- */
/* Footnote numbers show only with the research; color keys under the scales are left off
   (the label beside each number already names the band) */
.wa sup.ref,.wa .legend{display:none}
.wa .show-more sup.ref{display:inline}
/* research and fine print wait behind a "Show the research" link */
.wa .more{display:none}
.wa .show-more .more{display:block}
.wa .morebtn,.wa .morebtn:hover,.wa .morebtn:focus{justify-self:start;font:600 14px/1.3 var(--body);color:var(--blue);background:none;border:0;padding:2px 0;margin:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.wa .morebtn:focus-visible,.wa .foldbtn:focus-visible{outline:3px solid var(--macoun);outline-offset:2px}
.wa .sources ol{display:none}
.wa .sources.show-more ol{display:grid}
.wa .sources h2{display:inline}
.wa .sources .morebtn{margin-left:14px}
/* folding sections: the heading is the button; the chevron turns when open */
.wa .foldbtn,.wa .foldbtn:hover,.wa .foldbtn:focus{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:left}
.wa .foldbtn::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid var(--blue);border-bottom:2px solid var(--blue);transform:rotate(45deg);margin:0 6px 4px 0;transition:transform .15s}
.wa .fold.open .foldbtn::after{transform:rotate(-135deg);margin-bottom:-4px}
.wa .foldbtn small{font:400 14px var(--body);color:var(--wa-soft);margin-left:8px}
@media screen{.wa .fold:not(.open)>:not(h4):not(.foldlead){display:none}}
/* a line that stays visible under a folded heading (the Cronometer line on the food audit) */
.wa .foldlead{font-size:16px;margin-top:-4px}
.wa .why.fold{border-left:0;padding:16px 0 0;border-top:1px solid var(--wa-line)}
/* the one-sentence summary above the tabs: the site's serif, numbers in brand blue (about 7:1) */
.wa .sum{font:400 23px/1.45 var(--serif);color:var(--ink);max-width:40ch;margin:0;text-wrap:pretty}
.wa .sum b{font-weight:400;color:var(--blue);font-variant-numeric:lining-nums}
.wa .sum a{color:inherit;text-decoration:none;border-radius:2px}
.wa .sum a:hover,.wa .sum a:focus-visible{color:inherit;text-decoration:underline;text-decoration-color:var(--macoun);text-underline-offset:4px;outline:none}
@media (max-width:600px){.wa .sum{font-size:20px}}
/* Targets in green on every tab, matching the green "Target" pill on Weight loss.
   Dark green on light green is about 6.4:1. */
/* the green set, used for targets and the "Try"/"Saves" columns in Easy cuts */
.wa{--tgt:#2F5E3A;--tgt-bg:#E3EFE5;--tgt-line:#3F7A4E}
.wa .ideal div:first-child{background:var(--tgt-bg)}
.wa .ideal div:first-child small,.wa .ideal div:first-child strong{color:var(--tgt)}
.wa .plancard .big b,.wa #goalTarget{color:var(--tgt)}
/* "Want a different pace?" line at the bottom of the plan card: a button-style link down
   to Your goal. The goal card leaves room for the pinned tab bar when it scrolls into view. */
.wa .togoal{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:15px;padding-top:10px;border-top:1px solid var(--wa-line);margin-top:2px}
.wa .togoal a{display:inline-flex;align-items:center;gap:8px;font:600 15px/1.25 var(--disp);color:var(--white);background:var(--blue);border:1.5px solid var(--blue);border-radius:6px;padding:9px 14px;text-decoration:none}
.wa .togoal a:hover{background:var(--blue-hover);border-color:var(--blue-hover);color:var(--white)}
.wa .togoal a:focus-visible{outline:3px solid var(--macoun);outline-offset:2px}
.wa .togoal a::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin:-4px 2px 0 0;flex:none}
/* Your goal: reference boxes for today's burn and the chosen cut, under the big number */
.wa .goalref{display:flex;flex-wrap:wrap;gap:1px;background:var(--wa-line);border-radius:8px;overflow:hidden;max-width:420px}
.wa .goalref div{flex:1 1 140px;background:var(--white);padding:9px 12px;display:grid;gap:2px}
.wa .goalref small{font-size:13px;color:var(--wa-soft)}
.wa .goalref strong{font:600 19px var(--disp);font-variant-numeric:tabular-nums}
.wa .goalcard{scroll-margin-top:calc(var(--wa-head,0px) + 80px)}
.wa #cronoCal,.wa #cronoProt,.wa #cronoFiber,.wa #cronoMeal,.wa #ewCal,.wa #ewProt,.wa #ewFiber{color:var(--tgt);background:var(--tgt-bg);padding:0 5px;border-radius:4px}
/* Step 3: protein and fiber in two white boxes, side by side (stacked on phones).
   Only the target numbers are green (Stuart, 2026-11-07: "just the targets"). */
.wa .nutri{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:780px}
.wa .nbox{border:1.5px solid var(--wa-line);background:var(--white);border-radius:10px;padding:16px 18px;display:grid;gap:8px;align-content:start;min-width:0}
.wa .nbox h4{font:600 17px/1.2 var(--disp);color:var(--ink);margin:0}
.wa .nbox .big b{color:var(--tgt)}
.wa .nbox .explain{font-size:16px;line-height:1.5}
.wa .nbox .ncaution{font-size:14px;line-height:1.45;color:var(--ink);border-top:1px solid var(--wa-line);padding-top:8px}
@media (max-width:640px){.wa .nutri{grid-template-columns:minmax(0,1fr)}}
/* Food emoji in front of the calorie-dense foods. --fe is the emoji's slot width, shared by
   the slot and the cell's hanging indent, so a name that wraps lines up under itself.
   Emoji are from 2016 or earlier so they show on older phones and Windows 10 too
   (the theme turns off WordPress's emoji image fallback). */
.wa .compare td.fname{--fe:1.75em;padding-left:calc(8px + var(--fe));text-indent:calc(-1 * var(--fe))}
.wa .femoji{display:inline-block;width:var(--fe);line-height:1;text-indent:0}
/* Calories per gram as a boxed chart: nine squares per macro, filled to its calories per gram.
   Blue, wheat and plum so no macro reads as "good" or "bad". */
.wa .macros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.wa .mac{--mc:#395B81;--mt:#E6ECF3;--mi:#2C4A6A;border:1.5px solid var(--mc);background:var(--mt);border-radius:10px;padding:14px 16px;display:grid;gap:8px;align-content:start;min-width:0}
.wa .mac-c{--mc:#A9772A;--mt:#F6EEDF;--mi:#6E4C15}
.wa .mac-f{--mc:#7D5A8C;--mt:#EFE8F2;--mi:#56385F}
.wa .mac-name{font:600 17px/1.2 var(--disp);color:var(--mi)}
.wa .mac-kcal{color:var(--mi);font-size:15px}
.wa .mac-kcal b{font:700 36px/1 var(--disp);margin-right:6px;font-variant-numeric:tabular-nums}
.wa .mac-blocks{display:flex;gap:4px}
.wa .mac-blocks i{width:16px;height:16px;border-radius:3px;border:1.5px solid var(--mc);box-sizing:border-box}
.wa .mac-blocks i.on{background:var(--mc)}
.wa .mac-ex{font-size:14px;line-height:1.45;color:var(--ink)}
@media (max-width:640px){.wa .macros{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.wa .foldbtn::after{transition:none}}
/* Paper version (Stuart, 2026-11-07: "print it out and put it on the refrigerator").
   Only the open tab prints, since the others are hidden. Left off the paper: the site
   header, footer and side tab, the About you form, the tab bar, buttons, the calorie
   slider, unchosen walking options, and the Sources list with its footnote numbers
   (the sheet points back to the web page instead). Colors print as shown on screen.
   Kept at the end of this file so these rules win over the screen rules above. */
@media print{
  @page{margin:0.5in}
  .skip-link,#masthead,.site-header,.ptany-foot,.site-footer,.ptany-tab,.generate-back-to-top{display:none!important}
  .wa{max-width:none;font-size:10.5pt;line-height:1.4}
  /* the page's own outer spacing (it pushed a blank last page) */
  .site-content,.content-area,.site-main,.wa-page,.wa-page .sec,.wa-page .sec-in{padding:0!important;margin:0!important}
  /* the walking choice prints as a plain line, without its box */
  .wa .acts{border-top:0;padding:0}
  .wa .acts label:has(input:checked){display:block;border:0;box-shadow:none;padding:0;background:none}
  .wa .acts label small{display:block}
  .wa *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .wa .inputs,.wa .tabs,.wa .lede,.wa .printbar,.wa .next,.wa .form-help,.wa .sources,.wa sup.ref,
  .wa .calslider,.wa .quick,.wa .btn-reset,.wa #goalFloor,.wa .acts input,.wa .note,
  .wa .acts label:not(:has(input:checked)){display:none!important}
  .wa .printinfo{display:block;font-size:9.5pt;color:#444;margin:4pt 0 0}
  body .wa h1{font-size:22pt;margin:0}
  .wa .grid{display:block;margin-top:12pt}
  .wa .explain,.wa .ewlist,.wa .ewrecipe{max-width:none}
  /* Grid layouts don't split well across printed pages (Chrome pushed each section onto
     its own page and overlapped the last one), so on paper everything stacks as plain blocks. */
  .wa .results,.wa .panel,.wa .step,.wa .sub,.wa .why{display:block}
  .wa .panel>*+*{margin-top:18pt}
  .wa .step>*+*,.wa .sub>*+*,.wa .why>*+*{margin-top:7pt}
  .wa .sub{padding-top:12pt;margin-top:12pt}
  /* Keep small pieces whole; long sections and tables may run onto the next page */
  .wa .why,.wa .plancard,.wa .nbox,.wa .range,.wa .ideal,.wa .big,.wa .scale,.wa tr,.wa .auditsteps li,.wa .ewlist li,.wa .acts{break-inside:avoid}
  .wa .eyebrow{display:block}   /* so "Step 2" stays with its heading */
  .wa h3,.wa h4,.wa .eyebrow{break-after:avoid}
  .wa a{color:inherit;text-decoration:none}
  .wa .ewrecipe summary{list-style:none}
  /* on paper: folded sections print open (see the @media screen rule above), without the
     buttons; the summary sentence prints as plain text */
  .wa .morebtn,.wa .foldbtn::after,.wa .togoal{display:none!important}
  .wa .sum{font-size:13pt;max-width:none;margin-top:8pt}
  .wa .sum a{color:inherit}
  .wa .ewrecipe summary::-webkit-details-marker{display:none}
  .wa .foot{margin-top:16pt;padding-top:8pt;font-size:9pt;break-inside:avoid}
}
