.tool [hidden]{display:none}
.tools-head{background:var(--spice);color:var(--on-spice);padding-block:clamp(28px,4vw,52px) 0}
.tools-head__title{font-size:clamp(42px,6.4vw,88px);line-height:1.04}
.tools-head__sub{font-size:clamp(21px,1.8vw,25px);margin:12px 0 30px}
.tools-nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);padding-block-start:6px}
.tools-nav a{display:flex;align-items:center;min-height:46px;padding:0 20px;border-radius:12px 12px 0 0;background:var(--spice);color:var(--on-spice);font-family:var(--font-ui);font-weight:700;font-size:18px;white-space:nowrap;text-decoration:none;translate:0 6px;transition:translate .18s var(--ease)}
.tools-nav li:last-child a{box-shadow:inset 0 0 0 2px var(--ink)}
@media (hover:hover) and (pointer:fine){.tools-nav a:hover{translate:0 0}}
.tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 28px;padding-block:72px 88px;align-items:start}
.tool{position:relative;display:flex;flex-direction:column;align-self:stretch;scroll-margin-block-start:64px}
.tool--wide{grid-column:1/-1}
.tool__tab{align-self:flex-start;margin-inline-start:22px;padding:9px 22px 7px;border-radius:12px 12px 0 0;background:var(--spice);color:var(--on-spice);font-family:var(--font-ui);font-weight:700;font-size:21px;line-height:1.2;word-spacing:normal;letter-spacing:0}
.tool__body{flex:1;display:grid;gap:22px;align-content:start;padding:clamp(20px,3vw,36px);background:#fff;border:2px solid var(--ink);border-block-start:10px solid var(--spice);border-radius:10px}
.tool__form{display:grid;gap:14px}
.tool__row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(130px,100%),1fr));gap:14px;align-items:end}
.tool select.field__input{height:56px;padding-block:0}
.tool__big{margin:0;font-family:var(--font-display);font-size:clamp(44px,5vw,68px);line-height:1.1;letter-spacing:-.02em;word-spacing:0;color:var(--ink)}
.tool__small{margin:6px 0 0;font-size:19px;line-height:1.45}
.cups{grid-template-columns:minmax(0,5fr) minmax(0,5fr) 170px;align-items:center;gap:clamp(20px,4vw,48px)}
.cup{direction:ltr;width:100%;max-width:170px;height:auto;overflow:visible}
.cup__fill{fill:var(--cup,#F1E7D3);transition:y .4s var(--ease),height .4s var(--ease),fill .25s}
.cup__glass{fill:none;stroke:var(--ink);stroke-width:4}
.cup__handle{fill:none;stroke:var(--ink);stroke-width:7;stroke-linecap:round}
.cup__ticks path{stroke:var(--ink);stroke-width:2;fill:none}
.cup__ticks text{font:700 17px var(--font-ui);fill:var(--ink);text-anchor:end}
.cup__ticks.is-dark path{stroke:#fff}.cup__ticks.is-dark text{fill:#fff}
.cup__times{font:700 18px var(--font-ui);fill:var(--pen);text-anchor:middle}
.pans{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.pan{border:0;padding:0;margin:0;min-width:0}
.pan legend{padding:0;margin-block-end:8px;font-family:var(--font-ui);font-weight:700;font-size:19px}
.pans__out{grid-column:1/-1}
.scaler{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.scaler__list{margin-block-start:10px;font-size:20px;line-height:1.7}
.tables{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:start;gap:clamp(24px,4vw,48px)}
.table-wrap{overflow-x:auto}
.measure{width:100%;border-collapse:collapse;font-size:19px}
.measure caption{text-align:start;font-family:var(--font-ui);font-weight:700;font-size:21px;padding-block-end:10px}
.measure th,.measure td{padding:7px 10px;border-block-end:1px solid var(--rule-strong);text-align:start;font-weight:400}
.measure thead th{font-weight:700;border-block-end:2px solid var(--ink)}
.measure tbody th{font-weight:700}
.tables .btn{margin-block-start:18px}
@media (max-width:900px){
  .tools{grid-template-columns:minmax(0,1fr);gap:48px}
  .cups{grid-template-columns:minmax(0,1fr) 120px}
  .cups .tool__form{grid-column:1/-1}
  .pans,.scaler,.tables{grid-template-columns:minmax(0,1fr)}
}
@media print{
  body>:not(main),.tools-head,.tool:not(.tool--table),.tool__tab,.tables .btn{display:none!important}
  .tools{display:block;padding:0}
  .tool__body{border:0;padding:0}
  .tables{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .measure{font-size:10pt}
  .measure th,.measure td{padding:3px 6px}
  .tool__small{font-size:10pt}
}