:root{--color-border: #718096;--color-border-soft: #d6dce5;--color-page: #f8f8f8;--color-primary: #9b2c83;--color-primary-hover: #7b1f68;--color-surface: #fff;--color-surface-accent: #fff7fc;--color-text: #4a5568;background:var(--color-page);color:var(--color-text);font-family:Georgia,Times New Roman,serif;font-size:16px;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:0}#root{width:100%}button,input,select{font:inherit}a{color:var(--color-primary)}a:hover,a:focus{color:var(--color-primary-hover)}a:focus-visible,button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.app-layout{color:var(--color-text);min-height:100vh;min-height:100dvh;max-width:420px;margin:0 auto;padding-bottom:calc(1rem + env(safe-area-inset-bottom));padding-left:calc(1rem + env(safe-area-inset-left));padding-right:calc(1rem + env(safe-area-inset-right));padding-top:calc(.75rem + env(safe-area-inset-top));position:relative;width:100%}.app-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:1.25rem}.app-logo{display:block;width:56px}.app-icon{display:inline-block;height:1.25rem;vertical-align:-.2em;width:1.25rem}.app-icon *{vector-effect:non-scaling-stroke}.about-link{align-items:center;display:flex;font-size:1.5rem;height:2.75rem;justify-content:center;line-height:1;text-decoration:none;width:2.75rem}.about-link:hover,.about-link:focus{text-decoration:none}.about-icon{stroke-width:1.5;vertical-align:0}.converter-row{align-items:center;display:flex;justify-content:center;margin-bottom:.75rem;margin-top:.75rem;width:100%}.source-row{gap:.5rem;justify-content:flex-start}.source-unit-group{align-items:center;display:flex;flex:1 1 auto;gap:.5rem;min-width:0}.source-unit-group .select-wrapper{flex:1 1 auto;min-width:0;width:auto}.volume-padding{flex:0 0 auto}.select-wrapper{border-radius:8px;min-width:0;position:relative;width:10rem}.ingredient-select-wrapper{width:100%}.select-arrow-wrapper{height:3.25rem;line-height:3.25rem;padding:0 .75rem;pointer-events:none;position:absolute;right:0;top:0}.select-arrow{fill:currentColor;height:1rem;width:1rem}.app-select,.quantity-input{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);height:3.25rem;line-height:1.25rem;padding:.875rem;width:100%}.app-select{padding-right:2.5rem;-webkit-appearance:none}.quantity-input{flex:0 0 4.5rem;margin:0;text-align:right;width:4.5rem;-webkit-appearance:none}.app-select:focus,.quantity-input:focus{background-color:var(--color-surface);border-color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px}.divider{align-items:center;display:flex;text-align:center}.divider:before,.divider:after{border-bottom:1px solid var(--color-border-soft);content:"";flex:1}.divider:before{margin-right:.5rem}.divider:after{margin-left:.5rem}.result-row{margin-top:.5rem}.conversion-result{align-items:center;background:var(--color-surface-accent);border:1px solid var(--color-border-soft);border-radius:12px;display:flex;gap:.75rem;padding:.625rem;width:100%}.conversion-result-value{flex:1 1 auto;font-size:1.5rem;font-weight:700;min-width:0;text-align:center}.conversion-result .select-wrapper{flex:0 1 8.5rem;width:8.5rem}.add-ingredient{background-color:transparent;border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);cursor:not-allowed;font-size:1rem;margin-bottom:1rem;margin-top:.25rem;min-height:3rem;padding:.75rem;width:100%}.add-ingredient:disabled{opacity:.65}.can-add-ingredient{background:var(--color-primary);border-color:var(--color-primary);color:#fff;cursor:pointer}.can-add-ingredient:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}.ingredient-list-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:.5rem}.ingredient-list-heading{font-size:1.25rem;margin:0}.clear-all{background:none;border:1px solid var(--color-border);border-radius:8px;color:var(--color-primary);font-size:.875rem;min-height:2.75rem;padding:.625rem .75rem}.ingredient-item{align-items:center;border-bottom:1px solid var(--color-border-soft);border-top:1px solid var(--color-border-soft);display:flex;font-size:1rem;margin:0 -1rem -1px;min-height:3.25rem}.ingredient-item.completed{color:var(--color-border);text-decoration:line-through}.ingredient-handle,.ingredient-checkbox,.ingredient-remove{background:none;border:0;color:inherit;min-height:2.75rem;min-width:2.75rem;padding:.75rem}.ingredient-handle{cursor:grab;text-align:center}.ingredient-checkbox,.ingredient-remove{cursor:pointer}.ingredient-content{flex:1;overflow:hidden;padding:.75rem 0;text-overflow:ellipsis;white-space:nowrap}.ingredient-remove{color:var(--color-primary);margin-left:auto}.clear-undo{align-items:center;background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:8px;display:flex;font-size:.9375rem;justify-content:space-between;min-height:3.25rem;padding:.25rem .25rem .25rem .75rem}.clear-undo button{background:none;border:0;color:var(--color-primary);font-weight:700;min-height:2.75rem;min-width:2.75rem;padding:.625rem .75rem}.empty-placeholder,.about p,.about li{font-size:1rem;line-height:1.5}.about h3{font-size:1.25rem}.about ul{padding-inline-start:1rem}.about li{margin-left:0}