:root{color-scheme:light dark;--surface: #FAFBFB;--surface-2: #EEF2F3;--surface-3: #E2E8EA;--on-surface: #142026;--muted: #53636B;--outline: #7D8D94;--outline-variant: #DCE3E5;--accent: #C0281C;--on-accent: #FFFFFF;--accent-container: #FBE6E3;--on-accent-container: #7A140D;--error: #8C1D18;--scrim: rgb(20 32 38 / .32);--shadow-2: 0 8px 24px rgb(15 20 22 / .18);--font: "IBM Plex Sans", sans-serif;--fs-answer: 56px;--fs-answer-unit: 32px;--fs-title: 22px;--fs-h1: 28px;--fs-h2: 20px;--fs-value: 20px;--fs-key: 20px;--fs-body: 17px;--fs-caption: 14px;--fs-label: 14px;--fs-nav: 12px;--stretch-answer: 75%;--stretch-value: 85%;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 20px;--s6: 24px;--s8: 32px;--s12: 48px;--target: 48px;--row: 52px;--page-max: 640px;--r-control: 8px;--r-band: 12px;--r-sheet: 28px;--r-full: 999px;--t-band: .15s ease-out}@media(prefers-color-scheme:dark){:root{--surface: #0F1416;--surface-2: #182024;--surface-3: #222C31;--on-surface: #E6ECEE;--muted: #98A7AE;--outline: #6F8089;--outline-variant: #24303A;--accent: #FF7A6E;--on-accent: #2A0905;--accent-container: #40201B;--on-accent-container: #FFD9D4;--error: #FFB4AB;--scrim: rgb(0 0 0 / .5);--shadow-2: 0 8px 24px rgb(0 0 0 / .5)}}@media(prefers-reduced-motion:reduce){:root{--t-band: 0ms}}@font-face{font-family:IBM Plex Sans;src:url(../fonts/plex.woff2) format("woff2");font-weight:100 700;font-stretch:75% 100%;font-display:swap}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--surface);color:var(--on-surface);font:400 var(--fs-body)/1.45 var(--font);-webkit-tap-highlight-color:transparent;overflow:hidden}button,input,textarea{font:inherit;color:inherit}::placeholder{color:var(--muted);opacity:1}button{cursor:pointer}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.ic{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}.n,.v,.qty,td{font-variant-numeric:tabular-nums}#app{max-width:var(--page-max);margin:0 auto;height:100dvh;display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}.screen{flex:1;min-height:0;display:flex;flex-direction:column}.scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}.converter .scroll{mask-image:linear-gradient(transparent,#000 var(--s4))}.appbar{height:64px;flex:none;display:flex;align-items:center;padding:0 var(--s4)}.appbar-title,.appbar-text{max-width:100%;display:flex;align-items:center;gap:var(--s1);min-width:0;min-height:var(--target);margin:0;padding:0;border:0;background:none;font-size:var(--fs-title);font-weight:600;line-height:1.25}.appbar-h{margin:0;min-width:0;font:inherit}.appbar-title .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.answer{flex:none;padding:0 var(--s4) var(--s3)}.answer p{margin:0}.question{color:var(--muted);font-size:var(--fs-body);line-height:1.4}.value{margin-top:var(--s1)!important;line-height:1}.value .n{font-size:var(--fs-answer);font-weight:600;font-stretch:var(--stretch-answer)}.value .u{font-size:var(--fs-answer-unit);font-weight:500;font-stretch:var(--stretch-answer);margin-left:var(--s1)}.trust{color:var(--muted);font-size:var(--fs-caption);line-height:1.4;margin-top:var(--s2)!important}.hint{color:var(--muted);margin-top:var(--s2)!important}.hint,.intro,.empty-state p,.soon p,.trust{max-width:32em}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.error{text-wrap:pretty;display:flex;gap:var(--s2);align-items:flex-start;margin-top:var(--s2)!important}.error .ic{color:var(--error);margin-top:1px}.rail{list-style:none;margin:0;padding:0 var(--s4)}.rail .row{position:relative;margin-left:0;border-left:2px solid var(--accent);min-height:var(--row);display:flex;align-items:center}.rail.mass{margin-top:var(--s6)}.rail.mass .row{border-left-color:transparent}.row:before{content:"";position:absolute;left:0;top:50%;height:2px;margin-top:-1px;width:0;background:var(--accent)}.row.tick-long:before{width:var(--s5)}.row.tick-mid:before{width:14px}.row.tick-short:before{width:var(--s2)}.row-btn{width:100%;min-height:var(--row);display:grid;grid-template-columns:88px 1fr;align-items:center;padding:0;border:0;background:none;text-align:left;border-radius:0 var(--r-band) var(--r-band) 0}.row-btn:active{background:var(--surface-2)}.row-btn .v{text-align:right;font-size:var(--fs-value);font-weight:500;font-stretch:var(--stretch-value)}.row-btn .name,.fill .name{padding-left:var(--s4);color:var(--muted)}.row.fill{background:var(--accent-container);color:var(--on-accent-container);border-radius:0 var(--r-band) var(--r-band) 0;transition:background var(--t-band)}.row.fill:before{width:var(--s6)}.rail.mass .row.fill:before{width:0}.row.fill{scroll-margin-block:var(--s4)}.fill .qty{width:56px;margin-left:var(--s8);height:var(--target);padding:0;border:0;border-bottom:2px solid var(--accent);border-radius:0;background:transparent;text-align:right;color:var(--on-accent-container);font-size:var(--fs-value);font-weight:600;font-stretch:var(--stretch-value)}.fill .qty:focus-visible{outline:none;border-bottom-width:4px;background:var(--surface);border-radius:var(--r-control) var(--r-control) 0 0}.fill .name{color:var(--on-accent-container);font-weight:600}.foot{margin:var(--s6) var(--s4) var(--s4)}.foot a{display:inline-flex;align-items:center;min-height:var(--target);color:var(--on-surface);text-underline-offset:3px}.dock{flex:none;display:grid;gap:var(--s2);padding:var(--s2) var(--s4);background:var(--surface-2)}.chips{display:flex;gap:var(--s2);overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--s4));padding:0 var(--s4)}.chips::-webkit-scrollbar{display:none}.chip{flex:none;display:inline-flex;align-items:center;gap:var(--s2);height:var(--target);padding:0 var(--s4);border:1px solid var(--outline);border-radius:var(--r-full);background:var(--surface);font-size:var(--fs-label);font-weight:600;white-space:nowrap}.chip .ic{width:20px;height:20px}.keys{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s2)}.key{min-width:var(--target);height:var(--target);border:0;border-radius:var(--r-control);background:var(--surface-3);font-size:var(--fs-key);font-weight:500;display:grid;place-items:center}.key.small{font-size:var(--fs-label);font-weight:600;font-stretch:var(--stretch-value)}.key[aria-pressed=true]{background:var(--accent);color:var(--on-accent)}.key:disabled{opacity:.4;cursor:default}.keys.four{grid-template-columns:repeat(4,1fr)}@media(max-width:359px){.keys{grid-template-columns:repeat(4,1fr)}.key.small:first-child,.key.small:nth-child(4){display:none}}.nav{flex:none;display:grid;grid-template-columns:repeat(3,1fr);height:80px;padding-bottom:env(safe-area-inset-bottom);background:var(--surface-2)}.nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s1);color:var(--muted);text-decoration:none;font-size:var(--fs-nav);font-weight:600;line-height:1.33}.nav .ind{width:64px;height:32px;border-radius:var(--r-full);display:grid;place-items:center}.nav a.on{color:var(--on-surface)}.nav a.on .ind{background:var(--accent-container);color:var(--on-accent-container)}body.typing .nav,body.typing .chips,body.typing .answer .trust{display:none}body.sheet-open #app{visibility:hidden}.sheet{position:fixed;inset:0;z-index:10;max-width:var(--page-max);margin:0 auto;display:flex;flex-direction:column;background:var(--surface);padding-top:env(safe-area-inset-top)}.sheet-bar{height:64px;flex:none;display:flex;align-items:center;gap:var(--s1);padding:0 var(--s4) 0 var(--s1);background:var(--surface-2)}.icon-btn[hidden]{display:none}.icon-btn{width:var(--target);height:var(--target);flex:none;display:grid;place-items:center;border:0;border-radius:var(--r-full);background:none}.sheet-bar input{flex:1;min-width:0;height:var(--target);padding:0 var(--s3);border:1px solid var(--outline);border-radius:var(--r-control);background:var(--surface)}.sheet-bar input::-webkit-search-cancel-button{-webkit-appearance:none;display:none}.sheet-bar .clear{color:var(--muted)}.sheet-bar input:focus{outline:2px solid var(--accent);outline-offset:-1px}.sheet-body{flex:1;overflow-y:auto;padding-bottom:var(--s8)}.group{display:flex;justify-content:space-between;gap:var(--s3);margin:var(--s6) var(--s4) var(--s1);font-size:var(--fs-label);font-weight:600;line-height:1.3;color:var(--muted)}.pick{list-style:none;margin:0;padding:0}.pick button{width:100%;min-height:var(--row);display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:0 var(--s4);border:0;background:none;text-align:left}.pick button:active{background:var(--surface-2)}.pick button[aria-current=true]{font-weight:600;color:var(--accent)}.pick .g{color:var(--muted);font-weight:400;font-stretch:var(--stretch-value);font-variant-numeric:tabular-nums;white-space:nowrap}.empty{margin:var(--s6) var(--s4);color:var(--muted)}.soon{margin:var(--s8) var(--s4) 0}.soon-btn{width:100%;min-height:var(--row);display:flex;justify-content:space-between;align-items:center;gap:var(--s3);padding:0 var(--s4);border:0;border-radius:var(--r-control);background:var(--surface-2);text-align:left;font-weight:600}.badge{font-size:var(--fs-label);font-weight:600;padding:var(--s1) var(--s3);border-radius:var(--r-full);background:var(--surface-3);white-space:nowrap}.soon p{margin:var(--s3) 0 0;color:var(--muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:var(--target);padding:0 var(--s5);border:0;border-radius:var(--r-control);font-weight:600}.btn.primary{background:var(--accent);color:var(--on-accent)}.btn.secondary{background:var(--surface-3);color:var(--on-surface)}.field{display:grid;gap:var(--s2)}.label{font-size:var(--fs-label);font-weight:600;color:var(--muted)}textarea,.servings input{border:1px solid var(--outline);border-radius:var(--r-control);background:var(--surface);padding:var(--s3);font-size:var(--fs-body)}textarea{width:100%;resize:none;field-sizing:content;line-height:1.5;min-height:160px;max-height:50vh}.recipe .scroll{padding:0 var(--s4) var(--s8)}.segmented{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s2);margin-top:var(--s4)}.segmented button{height:var(--target);border:0;border-radius:var(--r-control);background:var(--surface-3);font-size:var(--fs-label);font-weight:600}.segmented button[aria-pressed=true]{background:var(--accent);color:var(--on-accent)}.servings-title{margin:var(--s4) 0 0}.servings{display:flex;align-items:center;gap:var(--s2);margin-top:var(--s2);color:var(--muted);font-size:var(--fs-label);font-weight:600}.servings input{width:64px;height:var(--target);text-align:center;padding:0 var(--s2);color:var(--on-surface);font-weight:400}.result-title{margin:var(--s6) 0 var(--s2);font-size:var(--fs-h2);font-weight:600;line-height:1.3}.scaled{list-style:none;margin:0 0 var(--s4);padding:0}.scaled li{display:grid;grid-template-columns:56px 1fr;gap:var(--s3);padding:var(--s2) 0;align-items:baseline}.scaled .v{text-align:right;font-weight:600;font-stretch:var(--stretch-value);font-size:var(--fs-value)}.scaled li.same{color:var(--muted)}.empty-state{margin-top:var(--s6);color:var(--muted)}.empty-state p{margin:0 0 var(--s4)}.table .scroll{padding:0 var(--s4) var(--s4)}.intro{margin:0;color:var(--muted)}.table .group{margin-left:0;margin-right:0}.ref{width:100%;border-collapse:collapse}.ref thead th{font-size:var(--fs-label);font-weight:600;color:var(--muted);text-align:right;padding:var(--s2) 0;border-bottom:1px solid var(--outline-variant)}.ref thead th:first-child{text-align:left}.ref tbody th{padding:0;font-weight:400;text-align:left}.ref tbody th button{width:100%;min-height:var(--target);border:0;background:none;padding:var(--s2) 0;line-height:1.3;text-align:left;text-decoration:underline;text-decoration-color:var(--outline);text-underline-offset:3px}.ref td{text-align:right;white-space:nowrap;width:76px;font-stretch:var(--stretch-value);font-size:var(--fs-value);font-weight:500}.table .trust{margin-top:var(--s6)!important}.table .foot{margin-left:0}.toast{position:fixed;left:var(--s4);right:var(--s4);bottom:96px;z-index:20;max-width:480px;margin:0 auto;padding:var(--s3) var(--s4);border-radius:var(--r-control);background:var(--on-surface);color:var(--surface);opacity:0;pointer-events:none}.toast.on{opacity:1}@media(min-width:700px){html,body{background:var(--surface-2)}#app{background:var(--surface);border-inline:1px solid var(--outline-variant)}}