/* ToolHoney — BMI only: styles base.css does not already cover.
   All selectors are scoped under .th-tool. Shared classes (.tool, .seg,
   .results, .gauge, .metrics, .toast, …) come from base.css and are NOT
   redefined here. No font declarations: fonts load from fonts.css. */
.th-tool #th-bmi-needle{transition:transform 1s cubic-bezier(.34,1.3,.5,1)}
.th-tool .scalebar div{transition:width .5s}
.th-tool .scalelabels span{transition:width .5s}
.th-tool .pctwrap{display:none}
.th-tool .pctmark{transition:left .8s cubic-bezier(.34,1.3,.5,1)}
.th-tool .pctmark::after{content:"";position:absolute;top:-9px;left:50%;transform:translateX(-50%);border:6px solid transparent;border-top:8px solid var(--choc)}
/* Nutrition card: dynamic (JS-updated) part of the tool, not page content.
   base.css has no .th-tool nutrition layout, so it lives here. */
.th-tool .th-nutri{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);padding:26px;margin-top:24px}
.th-tool .th-nutri h2{font-size:24px;margin-bottom:10px}
.th-tool .th-nutri h3{font-size:17px;margin:16px 0 6px}
.th-tool .th-nutri p{color:#5d4f40;margin:8px 0}
.th-tool .th-nutri .targets{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}
.th-tool .th-nutri .target{background:#FFF6E8;border-radius:14px;padding:14px;text-align:center}
.th-tool .th-nutri .target .v{font-family:'Archivo',sans-serif;font-weight:800;font-size:20px;color:var(--choc)}
.th-tool .th-nutri .target .k{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:800}
@media(max-width:900px){
  .th-tool .th-nutri .targets{grid-template-columns:1fr 1fr}
  .th-tool .th-nutri{padding:18px}
}