:root{--color-bg:#fafaf8;--color-surface:#fff;--color-border:#e0ddd8;--color-border-strong:#bbb8b2;--color-text:#1a1a18;--color-text-muted:#6b6860;--color-accent:#3d5a3e;--color-accent-light:#eef2ee;--color-error:#c0392b;--color-error-bg:#fdf3f2;--color-warning:#7d5a00;--color-warning-bg:#fdf8ec;--color-highlight:#eef2ee;--radius:6px;--gap:1rem;--section-gap:2rem;--font:"Helvetica Neue", Arial, sans-serif;--font-mono:"Courier New", monospace}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);color:var(--color-text);background:var(--color-bg);padding:1.5rem 1rem 4rem;font-size:15px;line-height:1.5}.app{gap:var(--section-gap);flex-direction:column;max-width:680px;margin:0 auto;display:flex}h1{letter-spacing:-.02em;color:var(--color-text);font-size:1.4rem;font-weight:600}h1 span{color:var(--color-text-muted);font-weight:400}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.25rem}.section-title{letter-spacing:.08em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:1rem;font-size:.8rem;font-weight:600}.form-grid{gap:.75rem var(--gap);grid-template-columns:1fr 1fr;align-items:start;display:grid}@media (width<=480px){.form-grid{grid-template-columns:1fr}}.field{flex-direction:column;gap:.25rem;display:flex}.field.full{grid-column:1/-1}label{color:var(--color-text-muted);font-size:.8rem;font-weight:500}input[type=number],input[type=text],select{border:1px solid var(--color-border-strong);border-radius:var(--radius);width:100%;font-size:.95rem;font-family:var(--font);color:var(--color-text);background:var(--color-surface);appearance:none;outline:none;padding:.45rem .6rem;transition:border-color .15s}input[type=number]:focus,select:focus{border-color:var(--color-accent)}.input-with-unit{align-items:center;gap:.4rem;display:flex}.input-with-unit input{flex:1}.unit-label{color:var(--color-text-muted);white-space:nowrap;font-size:.85rem}.hint{color:var(--color-text-muted);margin-top:.3rem;font-size:.8rem}.btn{font-size:.85rem;font-family:var(--font);border:1px solid var(--color-border-strong);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);cursor:pointer;align-items:center;gap:.35rem;padding:.45rem .9rem;font-weight:500;transition:background .12s,border-color .12s;display:inline-flex}.btn:hover{background:var(--color-bg);border-color:var(--color-accent)}.btn.primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn.primary:hover{background:#2e4430}.btn-icon{border:1px solid var(--color-border-strong);border-radius:var(--radius);background:var(--color-surface);width:28px;height:28px;color:var(--color-text-muted);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;font-size:1.1rem;line-height:1;display:inline-flex}.btn-icon:hover{color:var(--color-error);border-color:var(--color-error)}.mode-toggle{gap:0;margin-bottom:1rem;display:flex}.mode-toggle button{font-size:.85rem;font-family:var(--font);border:1px solid var(--color-border-strong);background:var(--color-surface);color:var(--color-text-muted);cursor:pointer;flex:1;padding:.4rem .75rem;font-weight:500;transition:background .12s,color .12s}.mode-toggle button:first-child{border-radius:var(--radius) 0 0 var(--radius)}.mode-toggle button:last-child{border-radius:0 var(--radius) var(--radius) 0;border-left:none}.mode-toggle button.active{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.quick-btns{gap:.5rem;display:flex}.quick-btns .btn{padding:.3rem .6rem;font-size:.8rem}.module-header{align-items:center;gap:.6rem;margin-bottom:.75rem;display:flex}.module-header label{color:var(--color-text);cursor:pointer;font-size:.85rem;font-weight:500}input[type=checkbox]{width:16px;height:16px;accent-color:var(--color-accent);cursor:pointer}.radio-group{gap:1.25rem;display:flex}.radio-group label{color:var(--color-text);cursor:pointer;align-items:center;gap:.4rem;font-size:.85rem;display:flex}input[type=radio]{accent-color:var(--color-accent);cursor:pointer}#flour-rows{flex-direction:column;gap:.5rem;margin-bottom:.75rem;display:flex}.flour-row{grid-template-columns:1fr 1fr 80px 1.5rem 3rem 28px;align-items:center;gap:.5rem;display:grid}@media (width<=480px){.flour-row{grid-template-rows:auto auto;grid-template-columns:1fr 1fr}.flour-row .grams-input{grid-column:1}.flour-row .unit-label,.flour-row .pct-badge{display:none}.flour-row .remove-flour{grid-column:2;justify-self:end}}.inclusion-row{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.inclusion-row .input-text{flex:120px;min-width:80px}.inclusion-row .inclusion-amount{width:70px}.inclusion-row .inclusion-abs-label{white-space:nowrap;font-size:.85rem}.inclusion-row .inclusion-abs-pct{width:55px}.split-weight-row{align-items:center;gap:.5rem;margin-bottom:.4rem;display:flex}.split-weight-row label{min-width:65px;font-size:.85rem}.split-weight-row .input-number{width:80px}.qs-row{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.qs-row .input-text{flex:120px;min-width:80px}.qs-row .qs-amount{width:70px}.qs-row .qs-abs-label{white-space:nowrap;font-size:.85rem}.qs-row .qs-abs-pct{width:50px}.flour-type-row{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.pct-badge{color:var(--color-text-muted);text-align:right;font-variant-numeric:tabular-nums;font-size:.8rem}#results-section{background:var(--color-accent-light);border-color:#c8d9c8}#result-table{flex-direction:column;gap:1rem;display:flex}.result-block{border-radius:var(--radius);background:#fff9;border:1px solid #c8d9c8;padding:.85rem 1rem}.result-block-title{letter-spacing:.09em;text-transform:uppercase;color:var(--color-accent);margin-bottom:.6rem;font-size:.72rem;font-weight:700}.result-table{border-collapse:collapse;width:100%;font-size:.9rem}.result-table td{vertical-align:middle;padding:.28rem 0}.result-label{color:var(--color-text);width:60%}.result-value{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--font-mono)}tr.sub .result-label{color:var(--color-text-muted);padding-left:1rem;font-size:.82rem}tr.sub .result-value{color:var(--color-text-muted);font-size:.82rem}tr.total-divider td{border-top:1px solid #c8d9c8;padding-top:.4rem}tr.total .result-label,tr.total .result-value{padding-top:.1rem;font-weight:600}.result-summary{color:var(--color-text-muted);flex-wrap:wrap;align-items:center;gap:.75rem;padding-top:.25rem;font-size:.82rem;display:flex}.result-summary strong{color:var(--color-text)}.summary-sep{color:var(--color-border-strong)}.result-errors{background:var(--color-error-bg);border-radius:var(--radius);color:var(--color-error);border:1px solid #f0b8b2;padding:.75rem 1rem;font-size:.85rem;list-style:none;display:none}.result-errors li+li{margin-top:.25rem}.result-warnings{border-radius:var(--radius);color:#7a5800;background:#fef9ec;border:1px solid #f0c060;margin:0 0 .75rem;padding:.75rem 1rem;font-size:.875rem;list-style:none}.result-warnings li+li{margin-top:.25rem}.unit-toggle{white-space:nowrap;padding:.25rem .5rem;font-size:.8rem}.export-import-row{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.import-label{border:1px solid var(--color-border-strong);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);cursor:pointer;align-items:center;gap:.35rem;padding:.45rem .9rem;font-size:.85rem;font-weight:500;transition:background .12s;display:inline-flex}.import-label:hover{background:var(--color-bg);border-color:var(--color-accent)}input[type=file]{display:none}.import-error{color:var(--color-error);font-size:.82rem;display:none}#explainer-toggle{color:var(--color-text-muted);cursor:pointer;font-size:.85rem;font-family:var(--font);background:0 0;border:none;padding:0}#explainer-toggle:hover{color:var(--color-accent)}#explainer-content{flex-direction:column;gap:1.25rem;margin-top:1rem;display:flex}.explainer-block h3{color:var(--color-text);margin-bottom:.4rem;font-size:.85rem;font-weight:600}.explainer-block p,.explainer-block li{color:var(--color-text-muted);font-size:.85rem;line-height:1.6}.explainer-block ul{padding-left:1.1rem}.explainer-block code{font-family:var(--font-mono);background:var(--color-bg);border:1px solid var(--color-border);border-radius:3px;padding:0 .3rem;font-size:.82rem}.explainer-block pre{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);font-size:.8rem;font-family:var(--font-mono);color:var(--color-text-muted);padding:.75rem 1rem;line-height:1.6;overflow-x:auto}.section-divider{border:none;border-top:1px solid var(--color-border);margin:.5rem 0}.recipe-name-bar{margin-top:.5rem}.recipe-name-bar input{border:none;border-bottom:1px solid var(--color-border);width:100%;max-width:400px;color:var(--color-text);background:0 0;border-radius:0;padding:.25rem 0;font-size:1rem;font-weight:500}.recipe-name-bar input:focus{border-bottom-color:var(--color-accent);outline:none}.recipe-name-bar input::placeholder{color:var(--color-text-muted)}#anleitung-steps{counter-reset:step-counter;flex-direction:column;gap:.5rem;margin-bottom:.75rem;list-style:none;display:flex}.step-row{counter-increment:step-counter;align-items:flex-start;gap:.4rem;display:flex}.step-row:before{content:counter(step-counter) ".";color:var(--color-text-muted);min-width:1.5rem;padding-top:.5rem;font-size:.85rem;font-weight:600}.step-row .step-text{resize:vertical;min-height:2.5rem;font-family:var(--font);border:1px solid var(--color-border-strong);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);flex:1;padding:.4rem .6rem;font-size:.9rem;line-height:1.5}.step-row .step-text:focus{border-color:var(--color-accent);outline:none}.step-row .btn-icon{margin-top:2px}.result-steps{flex-direction:column;gap:.4rem;font-size:.9rem;display:flex}.result-step{gap:.5rem;display:flex}.result-step-num{min-width:1.5rem;color:var(--color-accent);font-weight:600}