/* HPC nutrition: a compact working surface in the site's monochrome identity. */
.nutrition-tool{max-width:1180px;padding-block:38px 56px}
.nutrition-heading{margin-bottom:28px}
.nutrition-heading .eyebrow{font-size:.875rem;color:#666973;letter-spacing:.1em;margin-bottom:12px}
.nutrition-heading h1{font-family:var(--display);font-size:clamp(2.8rem,5vw,4.5rem);font-weight:600;line-height:1.02;letter-spacing:-.015em;margin:0 0 12px}
.nutrition-heading>p:last-child{font-size:1rem;color:#53565e;line-height:1.6}
.nutrition-tool .workspace{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:24px;align-items:stretch}
.nutrition-tool .input-panel{min-width:0;padding:28px;background:#fff;border:1px solid #d2d3d7;border-radius:4px}
.nutrition-tool .panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}
.nutrition-tool h2{font-family:var(--body);font-size:1.125rem;font-weight:600;line-height:1.4;letter-spacing:0;margin:0}
.nutrition-tool h3{font-family:var(--body);font-size:1rem;font-weight:600;line-height:1.5;letter-spacing:0;margin:0}
.nutrition-tool .clear-button{font:inherit;font-size:.875rem;min-height:44px;padding:8px 12px;margin:-8px -12px -8px 0;border:0;background:transparent;color:#565a63;text-decoration:underline;text-underline-offset:4px}
.nutrition-tool .clear-button:hover{color:#0b0b0c}
.nutrition-tool fieldset{border:0;padding:0;margin:0;min-width:0}
.nutrition-tool legend{padding:0}
.nutrition-tool .measurements{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px}
.nutrition-tool .field label,.nutrition-tool .sex-field legend{display:block;font-size:.875rem;font-weight:600;line-height:1.5;margin-bottom:8px}
.nutrition-tool .quiet-label{font-weight:400;color:#62656d}
.nutrition-tool .input-unit{display:flex;align-items:center;min-height:54px;border:1px solid #bfc2c9;border-radius:4px;background:#f7f7f8;overflow:hidden}
.nutrition-tool .input-unit input{font:inherit;font-size:1.125rem;font-variant-numeric:tabular-nums;width:100%;min-width:0;padding:13px 0 13px 12px;border:0;background:transparent;color:var(--ink);appearance:textfield;-moz-appearance:textfield}
.nutrition-tool .input-unit input::-webkit-inner-spin-button,.nutrition-tool .input-unit input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.nutrition-tool .input-unit>span{font-size:.875rem;color:#60646d;padding-inline:8px 12px}
.nutrition-tool .input-unit:focus-within{border-color:#111216;outline:2px solid #111216;outline-offset:2px}
.nutrition-tool .input-unit input:focus{outline:0}
.nutrition-tool .input-unit:has([aria-invalid="true"]){border-color:#a33929;outline-color:#a33929}
.nutrition-tool .sex-options{display:flex;gap:8px}
.nutrition-tool .sex-options label{position:relative;flex:1;min-width:0;cursor:pointer}
.nutrition-tool .sex-options input{position:absolute;opacity:0;width:1px;height:1px}
.nutrition-tool .sex-options span{display:flex;align-items:center;justify-content:center;min-height:54px;padding:12px 8px;border:1px solid #bfc2c9;border-radius:4px;font-size:1rem;background:#f7f7f8}
.nutrition-tool .sex-options input:checked+span{background:#141519;border-color:#141519;color:white}
.nutrition-tool .sex-options input:focus-visible+span{outline:2px solid #111216;outline-offset:3px}
.nutrition-tool .activity-field{margin-top:26px}
.nutrition-tool .field-hint{font-size:1rem;color:#5a5d66;line-height:1.5;margin:0 0 12px}
.nutrition-tool .select-wrap{position:relative}
.nutrition-tool select{display:block;width:100%;min-height:54px;appearance:none;font:inherit;font-size:1rem;line-height:1.4;color:#111216;border:1px solid #bfc2c9;border-radius:4px;background:#f7f7f8;padding:14px 42px 14px 12px}
.nutrition-tool .select-wrap>.icon{position:absolute;right:14px;top:50%;transform:translateY(-50%);pointer-events:none}
.nutrition-tool select:focus-visible,.nutrition-tool button:focus-visible,.nutrition-tool summary:focus-visible,.nutrition-tool a:focus-visible{outline:2px solid #111216;outline-offset:4px}
.nutrition-tool .activity-description{font-size:.875rem;line-height:1.5;color:#5a5d66;min-height:2.8em;margin:10px 0 0}
.nutrition-tool .input-message{font-size:.875rem;line-height:1.5;color:#60646d;margin:20px 0 0}
.nutrition-tool .input-message.error{color:#9d3324}
.nutrition-tool .results-panel{position:relative;min-width:0;display:flex;flex-direction:column;padding:28px 32px;border:1px solid #40424a;border-radius:4px;background:linear-gradient(135deg,#27292f,#101114 70%);color:#f5f6f8;box-shadow:0 14px 40px #11121612}
.nutrition-tool .results-panel:before{content:"";position:absolute;left:24px;right:24px;top:0;height:2px;background:linear-gradient(90deg,#727680,#f3f4f7,#727680)}
.nutrition-tool .results-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.nutrition-tool .maintenance-tag{border:1px solid #696d78;border-radius:3px;padding:6px 9px;color:#e0e2e8;font-size:.875rem;line-height:1.3}
.nutrition-tool .energy-block{padding:30px 0 24px}
.nutrition-tool .energy-label{font-size:1rem;line-height:1.5;color:#c4c7d0}
.nutrition-tool .energy-value{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;margin-top:6px;line-height:1}
.nutrition-tool output{font-variant-numeric:tabular-nums}
.nutrition-tool .energy-value output{font-family:var(--display);font-size:clamp(4.5rem,7vw,6.5rem);font-weight:600;letter-spacing:-.015em;color:#f5f6f9}
.nutrition-tool .energy-value>span{font-size:1rem;line-height:1.5;color:#d0d2da}
.nutrition-tool .per-day{font-size:.875rem;color:#b3b7c2}
.nutrition-tool .result-context{font-size:.875rem;line-height:1.5;color:#b8bcc6;margin-top:12px}
.nutrition-tool .macro-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:22px;border-top:1px solid #565962}
.nutrition-tool .macro{min-width:0}
.nutrition-tool .macro-label{font-size:1rem;line-height:1.5;color:#e2e4e9}
.nutrition-tool .macro>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;margin-top:7px}
.nutrition-tool .macro output{font-family:var(--display);font-size:2.7rem;font-weight:500;line-height:1.1}
.nutrition-tool .unit{font-size:.875rem;color:#b9bdc7}
.nutrition-tool .macro-bar{display:flex;gap:4px;height:5px;background:#454852;margin:18px 0 26px;overflow:hidden;border-radius:2px}
.nutrition-tool #protein-bar{background:#fff}
.nutrition-tool #carbs-bar{background:#aeb3be}
.nutrition-tool #fat-bar{background:#6f7582}
.nutrition-tool .guides-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px}
.nutrition-tool .guides-heading>span{font-size:.875rem;color:#b9bdc7}
.nutrition-tool .guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.nutrition-tool .guide{min-width:0;padding:16px;border:1px solid #53565f;border-radius:3px;background:#ffffff05}
.nutrition-tool .guide>span{font-size:1rem;color:#e2e4e9}
.nutrition-tool .guide>div{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;margin:6px 0}
.nutrition-tool .guide output{font-family:var(--display);font-size:2.2rem;font-weight:500;line-height:1.1}
.nutrition-tool .guide small{display:block;font-size:.875rem;line-height:1.5;color:#b9bdc7}
.nutrition-tool .sodium-note{font-size:.875rem;line-height:1.5;color:#b9bdc7;margin-top:12px}
.nutrition-tool .review-note{display:flex;gap:12px;padding-top:24px;margin-top:auto}
.nutrition-tool .note-rule{flex:0 0 2px;background:#8b919c}
.nutrition-tool .review-note p{font-size:1rem;line-height:1.5;color:#d0d3db}
.nutrition-tool .method-panel{margin-top:24px;border:1px solid #d2d3d7;border-radius:4px;background:#fff}
.nutrition-tool .method-panel summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;list-style:none;cursor:pointer;font-size:1rem;font-weight:600}
.nutrition-tool .method-panel summary::-webkit-details-marker{display:none}
.nutrition-tool .method-panel[open] .method-chevron{transform:rotate(180deg)}
.nutrition-tool .method-content{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;padding:0 24px 24px;font-size:1rem;line-height:1.65;color:#535761}
.nutrition-tool .method-content h3{color:#111216;margin-bottom:12px}
.nutrition-tool .method-content p+p{margin-top:14px}
.nutrition-tool .method-content strong{color:#22252b}
.nutrition-tool .sources{grid-column:1/-1;padding-top:22px;border-top:1px solid #d7d9de}
.nutrition-tool .sources ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 32px;margin:0 0 16px;padding-left:20px}
.nutrition-tool .sources a{color:#303640;text-decoration:underline;text-underline-offset:4px;overflow-wrap:anywhere}
.nutrition-tool .sources small{font-size:.875rem}

@media(max-width:900px){
 .nutrition-tool{width:calc(100% - 40px)}
 .nutrition-tool .workspace{gap:16px}
 .nutrition-tool .input-panel,.nutrition-tool .results-panel{padding:24px 20px}
 .nutrition-tool .measurements{gap:20px 12px}
 .nutrition-tool .quiet-label{display:block}
 .nutrition-tool .guides-heading{align-items:flex-start;flex-direction:column;gap:4px}
 .nutrition-tool .macro-grid{gap:8px}
 .nutrition-tool .macro output{font-size:2.3rem}
}
@media(max-width:720px){
 .nutrition-tool{width:calc(100% - 32px);padding-block:28px 36px}
 .nutrition-heading{margin-bottom:22px}
 .nutrition-heading h1{font-size:clamp(2.6rem,9.4vw,3.5rem)}
 .nutrition-heading .eyebrow{margin-bottom:10px}
 .nutrition-tool .workspace{grid-template-columns:minmax(0,1fr);gap:16px}
 .nutrition-tool .input-panel,.nutrition-tool .results-panel{padding:24px}
 .nutrition-tool .panel-heading{margin-bottom:20px}
 .nutrition-tool .quiet-label{display:inline}
 .nutrition-tool .measurements{gap:18px 14px}
 .nutrition-tool .activity-field{margin-top:22px}
 .nutrition-tool .activity-description{min-height:0}
 .nutrition-tool .input-message{margin-top:16px}
 .nutrition-tool .energy-block{padding-top:24px}
 .nutrition-tool .energy-value output{font-size:5.3rem}
 .nutrition-tool .macro output{font-size:2.7rem}
 .nutrition-tool .guides-heading{flex-direction:row;align-items:center}
 .nutrition-tool .method-content{grid-template-columns:minmax(0,1fr);gap:24px;padding:0 20px 24px}
 .nutrition-tool .method-panel summary{padding:20px}
 .nutrition-tool .sources ul{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:390px){
 .nutrition-tool .input-panel,.nutrition-tool .results-panel{padding:20px 16px}
 .nutrition-tool .measurements{gap:16px 10px}
 .nutrition-tool .quiet-label{display:block}
 .nutrition-tool .sex-field legend{margin-bottom:8px}
 .nutrition-tool .macro-grid{gap:8px}
 .nutrition-tool .macro output{font-size:2.3rem}
 .nutrition-tool .guide{padding:12px}
 .nutrition-tool .guides-heading{align-items:flex-start;flex-direction:column}
}