/* calorie calculator: simple, calculator.net-style, in the site's black/red theme */
.calc-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.calc { gap: 1.4rem; }
.calc .pf-opt span { font-family: var(--body); font-style: normal; font-weight: 600; font-size: .92rem; text-transform: none; letter-spacing: 0; line-height: 1.2; min-height: 46px; }
.pf-opts-2 { grid-template-columns: repeat(2, 1fr); }
.calc .pf-row.c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem .8rem; }
.calc .pf-field > span { font-size: .78rem; }
.calc .pf-field input:not([type=range]), .calc .pf-field select { border-radius: 8px; }
.c-ftin > div { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; }
.calc .u-imperial { display: none; }
.calc.imperial .u-imperial { display: block; }
.calc.imperial .u-metric { display: none; }
.calc .pf-group legend { font-family: var(--body); font-weight: 700; font-size: .95rem; letter-spacing: 0; text-transform: none; color: var(--fg); margin-bottom: .7rem; }
.c-act { display: grid; gap: .4rem; }
.c-act label { display: block; cursor: pointer; }
.c-act input { position: absolute; opacity: 0; pointer-events: none; }
.c-act span { display: grid; grid-template-columns: 7.5rem 1fr; gap: .8rem; align-items: center; padding: .7rem .9rem; border-radius: 8px; background: var(--bg-3); font-size: .9rem; line-height: 1.3; }
.c-act span b { font-weight: 700; }
.c-act input:checked + span { background: #141414; color: #fff; }
.c-act input:focus-visible + span { outline: 2px solid var(--fg); outline-offset: 2px; }
.pf-field input[aria-invalid] { outline: 2px solid var(--red, #e0321f); outline-offset: 1px; }

#plan-out { border: 0; background: none; padding: 0; min-height: 0; }
.calc-result { position: sticky; top: 84px; background: #141414; color: #ece8e1; --mute: #a39e95; border-radius: 12px; padding: 1.4rem 1.5rem 1.2rem; }
.calc-result .plan-label { font-family: var(--body); font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--mute); margin-top: 1.2rem; }
.calc-result .plan-label:first-child { margin-top: 0; }
.c-kcal { font-family: var(--body); font-weight: 800; font-size: clamp(2.6rem, 4.4vw, 3.6rem); line-height: 1; letter-spacing: -.03em; color: #fff; margin-top: .35rem; }
.c-kcal span { font-size: 1rem; font-weight: 500; letter-spacing: 0; color: var(--mute); }
.c-delta { color: #ff8b7d; font-size: .88rem; margin-top: .45rem; }
.c-tbl { width: 100%; border-collapse: collapse; margin-top: .4rem; }
.c-tbl th, .c-tbl td { padding: .55rem 0; border-top: 1px solid #ece8e11f; vertical-align: middle; }
.c-tbl th { text-align: left; font-weight: 600; font-size: .92rem; }
.c-tbl td { text-align: right; }
.c-tbl small { display: block; font-size: .74rem; font-weight: 400; color: var(--mute); margin-top: .1rem; }
.c-tbl b { font-size: 1.15rem; color: #fff; }
.c-tbl tr.low b { color: #ff8b7d; font-size: .95rem; }
.calc-result .plan-send { width: 100%; background: #fff; color: #141414; border: 0; border-radius: 999px; font-family: var(--body); font-style: normal; font-weight: 700; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; margin-top: 1.2rem; height: 48px; cursor: pointer; }
.calc-result .plan-send:hover { background: #e0321f; color: #fff; }
.calc-result .plan-small { font-size: .68rem; line-height: 1.4; color: var(--mute); margin-top: .6rem; }
.calc-result .plan-error { color: #ff8b7d; font-size: .95rem; line-height: 1.5; margin: 0; }
@media (max-width: 960px) {
  .calc-grid { grid-template-columns: minmax(0, 1fr); }
  .calc-result { position: static; }
}
@media (max-width: 767px) {
  .c-act span { grid-template-columns: 1fr; gap: .15rem; }
}
