@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--color-bg:#faf8f5;--color-surface:#fff;--color-surface-warm:#fff8f0;--color-text:#2c1810;--color-text-secondary:#6b5b4f;--color-text-muted:#9b8b7f;--color-accent:#c4704b;--color-accent-hover:#a85d3d;--color-accent-light:#f5e6dc;--color-secondary:#5b8c5a;--color-secondary-light:#e8f0e8;--color-border:#e8ded4;--color-border-light:#f0ebe5;--color-result-bg:#fff8f0;--color-result-border:#e8d5c4;--color-error:#c44b4b;--color-focus:#c4704b;--font-family:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--max-width:52rem;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--shadow-sm:0 1px 2px #2c18100a;--shadow-md:0 2px 8px #2c18100f;--shadow-lg:0 4px 16px #2c181014;--transition-fast:.15s ease;--transition-base:.25s ease}@media (prefers-color-scheme:dark){:root{--color-bg:#1a1412;--color-surface:#241e1a;--color-surface-warm:#2a2320;--color-text:#f0eae4;--color-text-secondary:#bfb0a4;--color-text-muted:#8a7b6f;--color-accent:#d4885e;--color-accent-hover:#e09a70;--color-accent-light:#3a2820;--color-secondary:#7aac79;--color-secondary-light:#1e2e1e;--color-border:#3a3028;--color-border-light:#2e2620;--color-result-bg:#2a2320;--color-result-border:#4a3a2e;--color-error:#d46b6b;--color-focus:#d4885e;--shadow-sm:0 1px 2px #0003;--shadow-md:0 2px 8px #0000004d;--shadow-lg:0 4px 16px #0006}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background-color:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;flex-direction:column;min-height:100vh;line-height:1.6;display:flex}img{max-width:100%;height:auto;display:block}a{color:var(--color-accent);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent-hover);text-decoration:underline}:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px;border-radius:var(--radius-sm)}h1,h2,h3,h4,h5,h6{color:var(--color-text);font-weight:700;line-height:1.25}h1{font-size:var(--font-size-3xl);letter-spacing:-.02em}h2{font-size:var(--font-size-2xl);letter-spacing:-.01em;margin-top:var(--space-2xl);margin-bottom:var(--space-md)}h3{font-size:var(--font-size-xl);margin-top:var(--space-xl);margin-bottom:var(--space-sm)}p{margin-bottom:var(--space-md);color:var(--color-text-secondary)}.site-container{width:100%;max-width:var(--max-width);padding:0 var(--space-lg);margin:0 auto}main{padding-top:var(--space-xl);padding-bottom:var(--space-3xl);flex:1}.site-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-md) 0;z-index:100;position:sticky;top:0}.header-inner{max-width:var(--max-width);padding:0 var(--space-lg);justify-content:space-between;align-items:center;margin:0 auto;display:flex}.site-brand{align-items:center;gap:var(--space-sm);font-weight:700;font-size:var(--font-size-lg);color:var(--color-text);text-decoration:none;display:flex}.site-brand:hover{color:var(--color-accent);text-decoration:none}.brand-icon{font-size:var(--font-size-xl)}.site-nav{align-items:center;gap:var(--space-lg);display:flex}.site-nav a{color:var(--color-text-secondary);font-size:var(--font-size-sm);transition:color var(--transition-fast);font-weight:500}.site-nav a:hover{color:var(--color-accent);text-decoration:none}.nav-toggle{cursor:pointer;padding:var(--space-sm);color:var(--color-text);font-size:var(--font-size-xl);background:0 0;border:none;display:none}@media (width<=640px){.nav-toggle{display:block}.site-nav{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-md) var(--space-lg);gap:var(--space-md);flex-direction:column;display:none;position:absolute;top:100%;left:0;right:0}.site-nav.is-open{display:flex}}.breadcrumbs{gap:var(--space-xs);font-size:var(--font-size-sm);color:var(--color-text-muted);margin-bottom:var(--space-lg);flex-wrap:wrap;list-style:none;display:flex}.breadcrumbs li{align-items:center;gap:var(--space-xs);display:flex}.breadcrumbs li:after{content:"›";color:var(--color-text-muted)}.breadcrumbs li:last-child:after{content:none}.breadcrumbs a{color:var(--color-text-muted)}.breadcrumbs a:hover{color:var(--color-accent)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);box-shadow:var(--shadow-sm)}.card-warm{background:var(--color-surface-warm);border-color:var(--color-result-border)}.converter-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-xl);box-shadow:var(--shadow-md);margin-bottom:var(--space-xl)}.converter-grid{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}@media (width<=640px){.converter-grid{grid-template-columns:1fr}}.converter-field{gap:var(--space-xs);flex-direction:column;display:flex}.converter-field.full-width{grid-column:1/-1}.converter-field label{font-size:var(--font-size-sm);color:var(--color-text);font-weight:600}.converter-field input,.converter-field select{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-family);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-bg);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);width:100%}.converter-field input:focus,.converter-field select:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-light);outline:none}.converter-field input::placeholder{color:var(--color-text-muted)}.swap-button{border:1px solid var(--color-border);background:var(--color-surface);width:40px;height:40px;color:var(--color-text-secondary);cursor:pointer;font-size:var(--font-size-lg);transition:all var(--transition-fast);border-radius:50%;justify-content:center;align-self:flex-end;align-items:center;margin-bottom:2px;display:flex}.swap-button:hover{background:var(--color-accent-light);border-color:var(--color-accent);color:var(--color-accent);transform:rotate(180deg)}.cup-standard-toggle{align-items:center;gap:var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-top:var(--space-sm);display:flex}.cup-standard-toggle summary{cursor:pointer;color:var(--color-text-muted);font-size:var(--font-size-sm)}.result-card{background:var(--color-surface-warm);border:1px solid var(--color-result-border);border-radius:var(--radius-lg);padding:var(--space-xl);margin-top:var(--space-md);min-height:80px;transition:opacity var(--transition-base)}.result-card[hidden]{display:none}.result-primary{font-size:var(--font-size-3xl);color:var(--color-text);margin-bottom:var(--space-xs);font-weight:700}.result-primary .approx{color:var(--color-text-muted);font-weight:400}.result-context{font-size:var(--font-size-sm);color:var(--color-text-secondary);margin-bottom:var(--space-md)}.result-secondary{gap:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--color-border-light);flex-wrap:wrap;display:flex}.result-secondary-item{font-size:var(--font-size-sm);color:var(--color-text-secondary)}.result-secondary-item strong{color:var(--color-text);font-weight:600}.result-note{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:var(--space-md);font-style:italic}.quick-buttons{margin-top:var(--space-lg);margin-bottom:var(--space-xl)}.quick-buttons h3{font-size:var(--font-size-base);margin-bottom:var(--space-sm);margin-top:0;font-weight:600}.quick-button-row{gap:var(--space-sm);flex-wrap:wrap;display:flex}.quick-btn{padding:var(--space-sm) var(--space-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);color:var(--color-text-secondary);font-family:var(--font-family);font-size:var(--font-size-sm);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;min-width:48px;font-weight:500;display:inline-flex}.quick-btn:hover{background:var(--color-accent-light);border-color:var(--color-accent);color:var(--color-accent)}.quick-btn.is-active{background:var(--color-accent);border-color:var(--color-accent);color:#fff}.conversion-table-wrapper{margin:var(--space-lg) 0;overflow-x:auto}.conversion-table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.conversion-table th,.conversion-table td{padding:var(--space-sm) var(--space-md);text-align:left;border-bottom:1px solid var(--color-border-light)}.conversion-table th{color:var(--color-text);background:var(--color-surface-warm);font-weight:600;position:sticky;top:0}.conversion-table tr:hover td{background:var(--color-surface-warm)}.conversion-table .approx-cell{color:var(--color-text-muted)}.faq-section{margin-top:var(--space-2xl)}.faq-item{border-bottom:1px solid var(--color-border-light)}.faq-item summary{padding:var(--space-md) 0;color:var(--color-text);cursor:pointer;justify-content:space-between;align-items:center;font-weight:600;list-style:none;display:flex}.faq-item summary:after{content:"+";font-size:var(--font-size-xl);color:var(--color-text-muted);transition:transform var(--transition-fast)}.faq-item[open] summary:after{content:"−"}.faq-item .faq-answer{padding-bottom:var(--space-md);color:var(--color-text-secondary);line-height:1.7}.content-section{margin-top:var(--space-2xl)}.content-section p{max-width:65ch}.link-grid{gap:var(--space-md);margin-top:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(200px,1fr));display:grid}.link-card{align-items:center;gap:var(--space-sm);padding:var(--space-md);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);font-weight:500;font-size:var(--font-size-sm);transition:all var(--transition-fast);text-decoration:none;display:flex}.link-card:hover{border-color:var(--color-accent);box-shadow:var(--shadow-sm);color:var(--color-accent);text-decoration:none}.link-card .link-icon{font-size:var(--font-size-lg)}.site-footer{background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-xl) 0;margin-top:auto}.footer-inner{max-width:var(--max-width);padding:0 var(--space-lg);justify-content:space-between;gap:var(--space-md);font-size:var(--font-size-sm);color:var(--color-text-muted);flex-wrap:wrap;margin:0 auto;display:flex}.footer-links{gap:var(--space-md);flex-wrap:wrap;list-style:none;display:flex}.footer-links a{color:var(--color-text-muted)}.footer-links a:hover{color:var(--color-accent)}.page-intro{margin-bottom:var(--space-lg)}.page-intro p{font-size:var(--font-size-lg);color:var(--color-text-secondary);max-width:55ch}.ingredient-chips{gap:var(--space-sm);flex-wrap:wrap;display:flex}.ingredient-chip{padding:var(--space-xs) var(--space-md);border:1px solid var(--color-border);font-size:var(--font-size-sm);color:var(--color-text-secondary);background:var(--color-surface);cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-family);border-radius:100px}.ingredient-chip:hover{border-color:var(--color-secondary);background:var(--color-secondary-light);color:var(--color-secondary)}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-center{text-align:center}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}