.calc-lead{font-size:var(--text-base);margin-block-end:var(--space-4)}@media (width>=52rem){.calc-lead{font-size:var(--text-lg)}}.calc{margin-block-end:var(--space-8)}hydration-calc:not(:defined) .js-only{visibility:hidden}.calc:not(:has(input[name=mode][value=reverse]:checked)) [data-mode=reverse],.calc:has(input[name=mode][value=reverse]:checked) [data-mode=forward]{display:none}.switch{margin:0 0 var(--space-4);border:0;min-width:0;padding:0}.switch-legend{font-size:var(--text-sm);color:var(--color-muted);margin-block-end:var(--space-1);padding:0}.switch-options{border:1px solid var(--color-border);background:var(--color-sunken);border-radius:999px;padding:4px;display:inline-flex}.switch-option{display:inline-flex;position:relative}.switch-option input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.switch-option span{min-height:var(--target);padding-inline:var(--space-4);color:var(--color-muted);white-space:nowrap;border-radius:999px;align-items:center;font-weight:600;display:inline-flex}@media (width<=23.99rem){.switch-option span{padding-inline:var(--space-3)}}.switch-option input:checked+span{background:var(--color-surface);color:var(--color-accent-ink);box-shadow:inset 0 0 0 2px var(--color-link)}.switch-option input:focus-visible+span{outline:3px solid var(--color-focus);outline-offset:2px}.calc-body{gap:var(--space-6);display:grid}@media (width>=52rem){.calc-body{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.calc-body>.result{grid-area:1/2/span 2}.calc-body>.calc-actions{grid-area:2/1;margin-block-start:0}}.calc-fields{gap:var(--space-3) var(--space-4);border:0;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;margin:0;padding:0;display:grid}.field label{font-weight:600;font-size:var(--text-sm);line-height:var(--leading-tight);margin-block-end:var(--space-1);display:block}.field-box{position:relative}.field input,.field select{width:100%;min-height:3rem;padding:var(--space-2) 2.75rem var(--space-2) var(--space-3);border:1px solid var(--color-border-strong);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);font:inherit;font-size:var(--text-lg);font-variant-numeric:tabular-nums}.field select{font-size:var(--text-base);padding-inline-end:var(--space-3)}.field input:focus-visible,.field select:focus-visible{outline:3px solid var(--color-focus);outline-offset:1px}.field input[aria-invalid=true]{border-color:var(--color-error);border-width:2px}.field-unit{color:var(--color-muted);pointer-events:none;align-items:center;display:flex;position:absolute;inset-block:0;inset-inline-end:var(--space-3)}.field-help,.field-read,.field-error{margin:var(--space-1) 0 0;font-size:var(--text-sm);line-height:1.35}.field-help{color:var(--color-muted)}.field-read{color:var(--color-text)}.field-error{color:var(--color-error);font-weight:600}.field-read:empty,.field-error:empty{display:none}.result{padding:var(--space-4) var(--space-4) var(--space-6);border-radius:var(--radius-lg);background:var(--color-sunken)}.result-title{font-size:var(--text-base);margin:0;font-weight:600}.readout{font-family:var(--font-display);font-size:var(--text-readout);letter-spacing:-.03em;font-variant-numeric:tabular-nums;margin:0;font-weight:700;line-height:1}.result-gap{margin-block:var(--space-2) var(--space-4);color:var(--color-muted)}.result-gap strong{color:var(--color-text)}.result-list{margin:0 0 var(--space-3);gap:0;display:grid}.result-list div,.recipe div{justify-content:space-between;gap:var(--space-3);padding-block:var(--space-2);border-block-end:1px solid var(--color-border);display:flex}.result-list div:last-child,.recipe div:last-child{border-block-end:0}.result-list dd,.recipe dd{font-variant-numeric:tabular-nums;white-space:nowrap;margin:0;font-weight:600}.recipe{margin:var(--space-2) 0 var(--space-4)}.recipe div{align-items:baseline}.recipe dt{font-size:var(--text-lg)}.recipe dd{font-family:var(--font-display);font-size:var(--text-2xl);letter-spacing:-.02em;font-weight:700}.bars{margin:0 0 var(--space-4)}.bars-grid{align-items:center;gap:var(--space-2) var(--space-3);grid-template-columns:auto minmax(0,1fr) auto;display:grid}.bars-name,.bars-total{font-size:var(--text-sm);font-variant-numeric:tabular-nums;font-weight:600}.bars-svg{background:var(--color-surface);border-radius:999px;width:100%;height:1.25rem;display:block}.bars-flour .bar-own,.bars-flour .hatch-fill{fill:var(--color-flour)}.bars-water .bar-own,.bars-water .hatch-fill{fill:var(--color-water)}.hatch-line{stroke:var(--color-sunken);stroke-width:2.5px}.bars-legend{align-items:center;gap:var(--space-1) var(--space-2);font-size:var(--text-sm);color:var(--color-muted);flex-wrap:wrap;margin-block-start:var(--space-2);display:flex}.key{background:var(--color-text);border-radius:2px;width:1.5rem;height:.75rem;display:inline-block}.key-starter{background:repeating-linear-gradient(45deg, var(--color-text) 0 3px, var(--color-sunken) 3px 6px);margin-inline-start:var(--space-2)}.callout{margin:var(--space-3) 0 0;padding:var(--space-3) var(--space-4);border-radius:var(--radius);font-size:var(--text-sm);border-inline-start:4px solid;list-style:none}.callout li{margin:0}.callout li+li{margin-block-start:var(--space-2)}.callout-error{border-color:var(--color-error);background:var(--color-error-bg);color:var(--color-text)}.callout-warning{border-color:var(--color-warn);background:var(--color-warn-bg);color:var(--color-text)}.callout[hidden]{display:none}.calc-actions{align-items:end;gap:var(--space-3) var(--space-6);flex-wrap:wrap;margin-block-start:var(--space-4);display:flex}.calc-actions .switch{margin:0}.calc-buttons{align-items:center;gap:var(--space-2) var(--space-3);flex-wrap:wrap;display:flex}.button{min-height:var(--target);padding-inline:var(--space-4);border:1px solid var(--color-border-strong);background:var(--color-surface);color:var(--color-text);font:inherit;cursor:pointer;border-radius:999px;font-weight:600}.button:hover{background:var(--color-sunken)}.calc-status{font-size:var(--text-sm);color:var(--color-muted);margin:0}