:root{--color-primary:#e07b39;--color-primary-light:#fdf0e6;--color-surface:#fff;--color-background:#faf8f5;--color-border:#e5e0da;--color-text:#1a1a1a;--color-text-secondary:#666;--color-text-tertiary:#999;--color-success:#22c55e;--color-error:#ef4444;--radius:8px;--radius-lg:12px;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 12px #0000001a;--max-width:720px}@media (prefers-color-scheme:dark){:root{--color-primary:#f0a060;--color-primary-light:#3a2a1a;--color-surface:#1e1c1a;--color-background:#141210;--color-border:#3a3530;--color-text:#e8e4e0;--color-text-secondary:#a09890;--color-text-tertiary:#706860;--color-success:#4ade80;--color-error:#f87171;--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 12px #0006}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--color-background);color:var(--color-text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;line-height:1.6}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:var(--max-width);margin:0 auto;padding:0 16px}.site-header{background:var(--color-surface);border-bottom:1px solid var(--color-border);z-index:10;padding:12px 0;position:sticky;top:0}.site-header .container{align-items:center;gap:24px;display:flex}.site-header__title{white-space:nowrap;font-size:1.1rem;font-weight:700}.site-header__title a{color:var(--color-text);text-decoration:none}.site-nav{scrollbar-width:none;gap:4px;display:flex;overflow-x:auto}.site-nav::-webkit-scrollbar{display:none}.site-nav a{color:var(--color-text-secondary);border-radius:var(--radius);white-space:nowrap;padding:6px 12px;font-size:.875rem;font-weight:500;text-decoration:none;transition:background-color .2s,color .2s}.site-nav a:hover{background:var(--color-primary-light);color:var(--color-primary);text-decoration:none}.site-nav a.active{background:var(--color-primary-light);color:var(--color-primary)}.main{min-height:calc(100vh - 200px);padding:32px 0}.site-footer{background:var(--color-surface);border-top:1px solid var(--color-border);text-align:center;color:var(--color-text-secondary);margin-top:48px;padding:24px 0;font-size:.85rem}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:24px}.card+.card{margin-top:16px}.card h2{margin-top:20px;margin-bottom:8px;font-size:1.1rem}.card h2:first-child{margin-top:0}.card p{color:var(--color-text-secondary);margin-bottom:12px;line-height:1.7}.card ul{color:var(--color-text-secondary);padding-left:20px}.card li{margin-bottom:4px}.copy-btn{color:var(--color-text-secondary);background:var(--color-background);border:1px solid var(--color-border);border-radius:var(--radius);cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;padding:4px 10px;font-size:.75rem;font-weight:500;transition:all .15s;display:inline-flex}.copy-btn:hover{background:var(--color-primary-light);color:var(--color-primary);border-color:var(--color-primary)}.copy-btn--copied{background:var(--color-success);color:#fff;border-color:var(--color-success)}.form-group{flex-direction:column;gap:6px;display:flex}.form-group label{color:var(--color-text-secondary);font-size:.8125rem;font-weight:600}.form-group input,.form-group select{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);color:var(--color-text);padding:8px 12px;font-size:.9375rem;transition:border-color .15s}.form-group input:focus,.form-group select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.page-title{margin-bottom:8px;font-size:1.5rem;font-weight:700}.page-description{color:var(--color-text-secondary);margin-bottom:24px}.loading{min-height:200px;color:var(--color-text-tertiary);justify-content:center;align-items:center;display:flex}.amazon-rec{background:var(--color-background);border-radius:var(--radius-lg);margin-top:24px;padding:16px}.amazon-rec__intro{color:var(--color-text-secondary);margin-bottom:10px;font-size:.8125rem;font-weight:600}.amazon-rec__items{flex-direction:column;gap:8px;display:flex}.amazon-rec__item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);flex-direction:column;gap:2px;padding:10px 12px;text-decoration:none;transition:all .15s;display:flex}.amazon-rec__item:hover{border-color:var(--color-primary);box-shadow:var(--shadow-sm);text-decoration:none}.amazon-rec__item-title{color:var(--color-primary);font-size:.875rem;font-weight:600}.amazon-rec__item-desc{color:var(--color-text-tertiary);font-size:.75rem}.amazon-rec__disclosure{color:var(--color-text-tertiary);margin-top:8px;font-size:.6875rem}.seo-content{color:var(--color-text-secondary);margin-top:48px;font-size:.875rem;line-height:1.8}.seo-content h2{color:var(--color-text);margin-top:24px;margin-bottom:8px;font-size:1.1rem}.seo-content ul{padding-left:20px}.seo-content li{margin-bottom:4px}.converter-form{flex-direction:column;gap:16px;display:flex}.converter-row{grid-template-columns:1fr 1fr auto 1fr;align-items:end;gap:12px;display:grid}.converter-swap{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);cursor:pointer;flex-shrink:0;justify-content:center;align-self:end;align-items:center;width:40px;height:40px;margin-bottom:1px;font-size:1.2rem;transition:all .15s;display:flex}.converter-swap:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.ingredient-select{position:relative}.ingredient-select__input{border:1px solid var(--color-border);border-radius:var(--radius);background:var(--color-surface);width:100%;color:var(--color-text);padding:8px 12px;font-size:.9375rem;transition:border-color .15s}.ingredient-select__input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.ingredient-select__input::placeholder{color:var(--color-text-tertiary)}.ingredient-select__selected{border:1px solid var(--color-primary);border-radius:var(--radius);background:var(--color-primary-light);align-items:center;gap:8px;padding:8px 12px;display:flex}.ingredient-select__selected-name{color:var(--color-text);font-weight:600}.ingredient-select__selected-density{color:var(--color-text-secondary);font-size:.8125rem}.ingredient-select__clear{width:24px;height:24px;color:var(--color-text-secondary);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;margin-left:auto;font-size:1.1rem;transition:all .15s;display:flex}.ingredient-select__clear:hover{background:var(--color-border);color:var(--color-text)}.ingredient-select__dropdown{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);max-height:320px;box-shadow:var(--shadow-md);z-index:20;margin-top:4px;position:absolute;top:100%;left:0;right:0;overflow-y:auto}.ingredient-select__category{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);background:var(--color-surface);padding:8px 12px 4px;font-size:.6875rem;font-weight:700;position:sticky;top:0}.ingredient-select__item{cursor:pointer;justify-content:space-between;align-items:center;padding:8px 12px;transition:background-color .1s;display:flex}.ingredient-select__item:hover,.ingredient-select__item--highlighted{background:var(--color-primary-light)}.ingredient-select__item-name{color:var(--color-text);font-size:.875rem}.ingredient-select__item-density{color:var(--color-text-tertiary);font-size:.75rem}.ingredient-select__empty{text-align:center;color:var(--color-text-tertiary);padding:16px;font-size:.875rem}.conversion-result{margin-top:16px}.conversion-result__main{justify-content:space-between;align-items:center;gap:12px;display:flex}.conversion-result__value{align-items:baseline;gap:8px;display:flex}.conversion-result__number{color:var(--color-primary);font-size:2rem;font-weight:800}.conversion-result__unit{color:var(--color-text-secondary);font-size:1.1rem;font-weight:600}.conversion-result__hint{color:var(--color-text-tertiary);text-align:center;padding:8px 0;font-size:.875rem}.conversion-result__tip{color:var(--color-text-secondary);background:var(--color-background);border-radius:var(--radius);margin-top:12px;padding:8px 12px;font-size:.8125rem;line-height:1.5}.equivalents{border-top:1px solid var(--color-border);margin-top:20px;padding-top:16px}.equivalents__title{text-transform:uppercase;letter-spacing:.03em;color:var(--color-text-secondary);margin-bottom:12px;font-size:.8125rem;font-weight:700}.equivalents__grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;display:grid}.equivalents__item{background:var(--color-background);border-radius:var(--radius);align-items:baseline;gap:6px;padding:8px 10px;display:flex}.equivalents__value{color:var(--color-text);font-size:.9375rem;font-weight:700}.equivalents__unit{color:var(--color-text-secondary);font-size:.8125rem}.temp-form{margin-bottom:20px}.temp-input-row{grid-template-columns:1fr 1fr;gap:12px;display:grid}.temp-results{border-top:1px solid var(--color-border);justify-content:space-between;align-items:center;gap:12px;padding-top:16px;display:flex}.temp-results__row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.temp-results__eq{color:var(--color-text-tertiary);font-size:1.2rem;font-weight:300}.temp-result-item{align-items:baseline;gap:4px;display:flex}.temp-result-item__value{color:var(--color-primary);font-size:1.5rem;font-weight:800}.temp-result-item__unit{color:var(--color-text-secondary);font-size:.9375rem;font-weight:600}.temp-result-item__label{color:var(--color-text-tertiary);font-size:.75rem}.temp-ref__title{margin-bottom:12px;font-size:1rem;font-weight:700}.temp-ref-table-wrap{overflow-x:auto}.temp-ref-table{border-collapse:collapse;width:100%;font-size:.875rem}.temp-ref-table th,.temp-ref-table td{text-align:left;border-bottom:1px solid var(--color-border);padding:8px 12px}.temp-ref-table th{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.03em;font-size:.75rem;font-weight:700}.temp-ref-table td{color:var(--color-text)}.temp-ref-table tbody tr:hover{background:var(--color-primary-light)}.temp-ref-table tbody tr:last-child td{border-bottom:none}.scaler-servings{align-items:end;gap:12px;margin-bottom:20px;display:flex}.scaler-servings .form-group{flex:1}.scaler-servings__arrow{color:var(--color-text-tertiary);padding-bottom:8px;font-size:1.2rem}.scaler-servings__ratio{color:var(--color-primary);white-space:nowrap;padding-bottom:10px;font-size:.8125rem;font-weight:600}.scaler-textarea-group{margin-top:4px}.scaler-textarea-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.scaler-textarea-header label{color:var(--color-text-secondary);font-size:.8125rem;font-weight:600}.scaler-example-btn{color:var(--color-primary);background:var(--color-primary-light);border-radius:var(--radius);cursor:pointer;border:none;padding:4px 10px;font-size:.75rem;font-weight:500;transition:all .15s}.scaler-example-btn:hover{background:var(--color-primary);color:#fff}.scaler-textarea{border:1px solid var(--color-border);border-radius:var(--radius);resize:vertical;background:var(--color-surface);width:100%;color:var(--color-text);padding:10px 12px;font-family:inherit;font-size:.9375rem;line-height:1.6;transition:border-color .15s}.scaler-textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.scaler-textarea::placeholder{color:var(--color-text-tertiary)}.scaler-results{margin-top:16px}.scaler-results__header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.scaler-results__title{margin:0;font-size:1rem;font-weight:700}.scaler-table{border-collapse:collapse;width:100%;font-size:.875rem}.scaler-table th,.scaler-table td{text-align:left;border-bottom:1px solid var(--color-border);padding:8px 12px}.scaler-table th{color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.03em;font-size:.75rem;font-weight:700}.scaler-table__original{color:var(--color-text-tertiary);white-space:nowrap}.scaler-table__scaled{color:var(--color-primary);white-space:nowrap;font-weight:700}.scaler-table tbody tr:hover{background:var(--color-primary-light)}.scaler-table tbody tr:last-child td{border-bottom:none}@media (width<=640px){.site-header .container{flex-direction:column;align-items:flex-start;gap:8px}.page-title{font-size:1.25rem}.converter-row{grid-template-columns:1fr 1fr;gap:8px}.converter-swap{grid-column:1/-1;width:100%}.equivalents__grid{grid-template-columns:repeat(2,1fr)}}
