:root{--color-bg:#f7f5ef;--color-surface:#fffefa;--color-surface-offset:#eeebe2;--color-text:#342d26;--color-text-muted:#74685b;--color-border:#ddd7cb;--color-primary:#a64b2c;--color-primary-hover:#85391f;--color-primary-highlight:#f5e6dc;--color-error:#a72c29;--font-display:'Boska',Georgia,serif;--font-body:'Satoshi',Arial,sans-serif;--text-xs:clamp(.75rem,.7rem + .25vw,.875rem);--text-sm:clamp(.875rem,.8rem + .35vw,1rem);--text-base:clamp(1rem,.95rem + .25vw,1.125rem);--text-lg:clamp(1.125rem,1rem + .75vw,1.5rem);--text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--radius-sm:4px;--radius-md:8px;--transition-interactive:180ms ease;}
[data-theme=dark]{--color-bg:#211d19;--color-surface:#2b251f;--color-surface-offset:#362e27;--color-text:#f1e9dc;--color-text-muted:#c0afa0;--color-border:#51453a;--color-primary:#efa583;--color-primary-hover:#ffc3a6;--color-primary-highlight:#4a3328;--color-error:#ffafa6;}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;scroll-behavior:smooth;scroll-padding-top:var(--space-8)}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);font-size:var(--text-base);line-height:1.6;min-height:100dvh}img,svg{display:block;max-width:100%;height:auto}button,input,select{font:inherit;color:inherit}button,a,input,select{transition:background var(--transition-interactive),border-color var(--transition-interactive),color var(--transition-interactive)}button{cursor:pointer;border:0;background:none;min-height:44px}button:hover{color:var(--color-primary)}input,select{border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-sm);min-height:44px;padding:var(--space-2) var(--space-3);width:100%}input[type=range]{padding:0;accent-color:var(--color-primary)}input:invalid:not(:focus){border-color:var(--color-error)}a{color:var(--color-primary)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px}h1,h2,h3{line-height:1.2;text-wrap:balance}h1{font:500 var(--text-xl)/1.14 var(--font-display);margin-block:var(--space-3) var(--space-4)}h2{font-size:var(--text-lg);font-weight:700}h3{font-size:var(--text-base)}p{max-width:72ch;text-wrap:pretty}.small,small{font-size:var(--text-xs)}.muted{color:var(--color-text-muted)}.skip{position:absolute;top:-100px;padding:var(--space-3);background:var(--color-surface);z-index:10}.skip:focus{top:0}.header{max-width:1200px;margin:auto;padding:var(--space-6) var(--space-8);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border)}.brand{display:flex;align-items:center;gap:var(--space-3);color:var(--color-text);text-decoration:none;font-size:var(--text-xs);font-weight:700;letter-spacing:.13em}.brand svg{color:var(--color-primary)}.brand small{display:block;font-size:.75rem;font-weight:400;letter-spacing:.15em;color:var(--color-text-muted);margin-top:var(--space-1)}.header-actions{display:flex;align-items:center;gap:var(--space-5)}.season{font-size:var(--text-xs);color:var(--color-text-muted)}.icon-button{font-size:var(--text-lg);width:44px;border:1px solid var(--color-border);border-radius:50%}main{max-width:1200px;margin:auto;padding:0 var(--space-8)}.intro{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-10);padding:var(--space-8) 0}.intro-copy{align-self:center}.eyebrow,.section-label{font-size:.75rem;letter-spacing:.15em;font-weight:700;color:var(--color-primary)}.intro p{font-size:var(--text-sm);color:var(--color-text-muted)}.blend-tag{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);margin-top:var(--space-5);color:var(--color-text-muted)}.dot{width:6px;height:6px;background:var(--color-primary);border-radius:50%}.intro-image{position:relative;min-height:220px;overflow:hidden;border-radius:var(--radius-md);background:var(--color-surface-offset)}.intro-image img{width:100%;height:100%;object-fit:cover;position:absolute}.image-caption{position:absolute;bottom:var(--space-3);right:var(--space-3);background:#fffefaeb;color:#574737;padding:var(--space-1) var(--space-2);font-size:.75rem;letter-spacing:.1em}.tabs{display:flex;border-bottom:1px solid var(--color-border);margin-bottom:var(--space-6);gap:var(--space-8)}.tab{font-size:var(--text-sm);padding:var(--space-3) 0 var(--space-4);color:var(--color-text-muted);border-bottom:2px solid transparent}.tab span{font-size:.75rem;margin-right:var(--space-2);opacity:.7}.tab.active{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:700}.panel[hidden]{display:none}.workspace{display:grid;grid-template-columns:340px 1fr;gap:var(--space-5)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-6)}.card h2{margin-top:var(--space-2)}.batch-card>p{font-size:var(--text-xs);margin-top:var(--space-2)}.segmented{display:flex;padding:var(--space-1);background:var(--color-surface-offset);border-radius:var(--radius-sm);margin-block:var(--space-5)}.segmented button{width:50%;font-size:var(--text-xs);border-radius:var(--radius-sm)}.segmented .selected{background:var(--color-surface);color:var(--color-primary);box-shadow:0 1px 4px #53391d14;font-weight:700}label{font-size:var(--text-xs);display:block;color:var(--color-text-muted);margin-bottom:var(--space-2)}.large-input{display:flex;align-items:center;border:1px solid var(--color-border);border-radius:var(--radius-sm);padding-right:var(--space-4)}.large-input input{border:0;font-size:var(--text-xl);font-weight:500;min-width:0;padding:var(--space-2) var(--space-4)}.large-input>span{color:var(--color-text-muted);font-size:var(--text-sm)}.presets{display:flex;gap:var(--space-2);margin-top:var(--space-3)}.presets button{flex:1;border:1px solid var(--color-border);border-radius:var(--radius-sm);font-size:var(--text-xs);padding:0 var(--space-2)}.presets button:hover,.secondary:hover{border-color:var(--color-primary);background:var(--color-primary-highlight)}.yield-line{display:flex;justify-content:space-between;gap:var(--space-2);font-size:var(--text-xs);margin-block:var(--space-5)}.yield-line span{color:var(--color-text-muted)}.base-note{padding-top:var(--space-4);border-top:1px solid var(--color-border);font-size:var(--text-xs)}.base-note p{color:var(--color-text-muted);margin-block:var(--space-2)}.base-note small{color:var(--color-primary)}.card-heading{display:flex;justify-content:space-between;align-items:start;gap:var(--space-3)}.badge{font-size:var(--text-xs);color:var(--color-primary);background:var(--color-primary-highlight);padding:var(--space-1) var(--space-3);white-space:nowrap;border-radius:30px}.ratio-bar{display:flex;height:8px;margin-block:var(--space-6) var(--space-4);border-radius:4px;overflow:hidden}.cinnamon{--spice:#a96843}.ginger{--spice:#d2ac68}.nutmeg{--spice:#80543e}.allspice{--spice:#504333}.ratio-bar span{background:var(--spice)}.ratio-bar .cinnamon{width:66.666667%}.ratio-bar .ginger{width:14.814815%}.ratio-bar .nutmeg{width:11.111111%}.ratio-bar .allspice{width:7.407407%}table{width:100%;border-collapse:collapse;font-size:var(--text-xs)}th{text-align:left;color:var(--color-text-muted);font-weight:500;padding:var(--space-3) var(--space-2);border-bottom:1px solid var(--color-border)}td{padding:var(--space-4) var(--space-2);border-bottom:1px solid var(--color-border);font-variant-numeric:tabular-nums}td:not(:first-child),th:not(:first-child){text-align:right}th:first-child,td:first-child{padding-left:0}td:last-child,th:last-child{padding-right:0}.ingredient-table td:first-child{font-weight:700}.ingredient-table td:first-child small{display:block;color:var(--color-text-muted);font-weight:400;margin-left:var(--space-4)}.spice-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--spice);margin-right:var(--space-2)}tfoot th,tfoot td{font-weight:700;border-bottom:0;color:var(--color-text)}.table-note{margin-top:var(--space-2)}.mix-note{margin-top:var(--space-4);background:var(--color-surface-offset);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm)}.mix-note p{font-size:var(--text-xs);margin-top:var(--space-1)}.recipe-actions{display:flex;justify-content:space-between;gap:var(--space-3);align-items:center;margin-top:var(--space-4)}.primary{padding:var(--space-2) var(--space-4);background:var(--color-primary);color:var(--color-surface);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:700}.primary:hover{background:var(--color-primary-hover);color:var(--color-surface)}.primary span{margin-left:var(--space-4)}.primary:disabled{opacity:.5;cursor:not-allowed}.text-button{color:var(--color-primary);font-size:var(--text-xs)}.cost-summary{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:var(--space-6);padding:var(--space-8) 0;border-bottom:1px solid var(--color-border)}.cost-summary h2{margin-block:var(--space-2)}.metric{border-left:1px solid var(--color-border);padding-left:var(--space-6)}.metric span,.metric small{display:block;color:var(--color-text-muted);font-size:var(--text-xs)}.metric strong{display:block;font-size:var(--text-xl);font-weight:500;line-height:1.5;font-variant-numeric:tabular-nums}.section-top{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);margin:var(--space-8) 0 var(--space-5)}.section-top h2{margin-block:var(--space-2)}.section-top p{font-size:var(--text-sm)}.secondary{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-4);font-size:var(--text-xs)}.example-note{font-size:var(--text-xs);color:var(--color-text-muted);background:var(--color-surface-offset);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-5);border-radius:var(--radius-sm)}.price-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.price-card{padding:var(--space-5)}.price-card h3{margin-bottom:var(--space-4)}.price-card label{margin-top:var(--space-3)}.price-card input,.price-card select{font-size:var(--text-xs)}.size-row{display:grid;grid-template-columns:1fr 78px;gap:var(--space-2)}.price-per{margin-top:var(--space-4);font-size:var(--text-xs);color:var(--color-primary)}.shopping-summary{margin-block:var(--space-6);display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}.shopping-summary p{margin-top:var(--space-2)}dl>div{display:flex;justify-content:space-between;font-size:var(--text-sm);padding:var(--space-2) 0;border-bottom:1px solid var(--color-border)}dt{color:var(--color-text-muted)}dd{font-weight:700}.shopping-summary>p{grid-column:1/-1}.density summary,.method summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:var(--text-sm);justify-content:space-between;font-weight:500}.density summary:hover,.method summary:hover{color:var(--color-primary)}.density p{margin-block:var(--space-3)}.density-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);margin-top:var(--space-4)}.density-grid input{font-size:var(--text-sm)}.error{color:var(--color-error);font-size:var(--text-xs);margin-top:var(--space-2)}.error:empty{display:none}.conversion-layout{display:grid;grid-template-columns:1fr 310px;gap:var(--space-5)}.conversion-card p{margin-top:var(--space-5)}.conversion-card table td{padding-block:var(--space-5)}.conversion-card td:first-child{font-weight:700}.taste-card p{margin-block:var(--space-4)}.taste-card label{margin-top:var(--space-6);display:flex;justify-content:space-between}.range-labels{display:flex;justify-content:space-between;font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:var(--space-5)}.composition{margin-top:var(--space-6)}.composition p{margin-top:var(--space-3)}.composition table{margin-top:var(--space-4)}.method{padding-block:var(--space-5);border-bottom:1px solid var(--color-border);margin-top:var(--space-4)}.method p{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-3)}footer{display:flex;justify-content:space-between;gap:var(--space-5);padding:var(--space-6) 0;font-size:.75rem;color:var(--color-text-muted)}.footer-dot{padding-inline:var(--space-2)}button:active{transform:translateY(1px)}
@media(max-width:950px){.workspace{grid-template-columns:300px 1fr}.card{padding:var(--space-5)}.price-grid{grid-template-columns:repeat(2,1fr)}.cost-summary{grid-template-columns:1fr 1fr 1fr}.cost-summary>div:first-child{grid-column:1/-1}.metric:first-of-type{border-left:0}.conversion-layout{grid-template-columns:1fr}.taste-card{max-width:none}.recipe-actions{flex-wrap:wrap}.season{display:none}.ingredient-table small{display:none!important}.card-heading{display:block}.badge{display:inline-block;margin-top:var(--space-2)}}
@media(max-width:650px){.header{padding:var(--space-4)}main{padding:0 var(--space-4)}.intro{grid-template-columns:1fr;gap:var(--space-5);padding-block:var(--space-6)}.intro-image{min-height:170px}.intro p br{display:none}.intro p{max-width:30ch}.intro-copy h1{font-size:var(--text-xl)}.tabs{gap:var(--space-3);justify-content:space-between;margin-bottom:var(--space-5)}.tab{font-size:.75rem;max-width:33%;text-align:left}.tab span{display:block}.workspace{grid-template-columns:1fr}.batch-card .base-note br{display:none}.card-heading{display:flex}.card-heading h2{font-size:var(--text-base)}.cost-summary{gap:var(--space-3)}.metric{padding-left:var(--space-3)}.metric strong{font-size:var(--text-lg)}.metric span,.metric small{font-size:.75rem}.metric small{margin-top:var(--space-2)}.price-grid{grid-template-columns:1fr}.shopping-summary{grid-template-columns:1fr}.density-grid{grid-template-columns:1fr 1fr}.section-top{align-items:flex-start;flex-direction:column}.table-wrap{overflow-x:auto}.conversion-card table{min-width:470px}.composition table{min-width:460px}.ingredient-table td,.ingredient-table th{padding-inline:var(--space-1)}.ingredient-table td:first-child small{display:none}.ingredient-table{font-size:.75rem}.recipe-actions{gap:var(--space-2)}footer{flex-direction:column;gap:var(--space-2)}.brand{letter-spacing:.09em}.brand small{letter-spacing:.1em}}
.workspace>*,.conversion-layout>*,.price-grid>*{min-width:0}.table-wrap{max-width:100%;overflow-x:auto}.panel{position:relative}.method{position:relative}.scroll-hint{display:none}[data-theme=dark]{color-scheme:dark}@media(max-width:650px){.scroll-hint{display:block}}
@media print{.header-actions,.tabs,.recipe-actions,.presets,.method,footer{display:none}.panel[hidden]{display:none}.intro-image{display:none}.intro{grid-template-columns:1fr}.workspace{grid-template-columns:1fr 2fr}body{background:white;color:black}.card{break-inside:avoid}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
