/* FoodScan: coherent, theme-aware presentation. No nutrition or event logic changed. */
:root{--ui-bg:#f4f7f6;--ui-card:#ffffff;--ui-soft:#edf3f0;--ui-text:#172e27;--ui-muted:#4e665e;--ui-border:#cedcd5;--ui-accent:#096445;--ui-accent-text:#fff;--ui-alert:#fff0ec;--ui-alert-text:#8e2c24;--ui-shadow:0 12px 36px -24px #123e354d}
:root[data-theme=dark]{--ui-bg:#0e1916;--ui-card:#182923;--ui-soft:#21392f;--ui-text:#f0f7f3;--ui-muted:#b8cfc3;--ui-border:#415d50;--ui-accent:#a6e7c5;--ui-accent-text:#102d20;--ui-alert:#452a27;--ui-alert-text:#ffc8bb;--ui-shadow:0 16px 40px -24px #000}
html body{background:var(--ui-bg);color:var(--ui-text);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;line-height:1.6}
html body :is(h1,h2,h3,h4){font-family:inherit;font-style:normal;letter-spacing:-.035em;color:var(--ui-text)}
html body :is(.fs11-tag,.fs-mini-kicker,.eyebrow,.section-kicker){color:var(--ui-muted);font-size:.75rem;letter-spacing:.09em}
html body :is(.fs12-result,.d8-ing-preview,.d8-profile,.fs12-portion){background:var(--ui-card);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:24px;box-shadow:var(--ui-shadow);overflow:hidden}
/* Homepage: one primary action, readable supporting copy. */
html body .fs11-launch{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;padding:40px 0}
html body .fs11-launch-copy h1{font-size:clamp(2.5rem,5.5vw,4.5rem);line-height:1.07;max-width:15ch}
html body .fs11-launch-copy h1 em{font:inherit;color:var(--ui-accent);background:none;-webkit-text-fill-color:currentColor}
html body .fs11-launch-copy>p{font:inherit;font-size:1.1rem;color:var(--ui-muted);max-width:48ch;margin-top:24px}
html body .fs11-proof-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px;color:var(--ui-muted)}
html body .fs11-scan-panel{padding:28px;background:var(--ui-card);border:1px solid var(--ui-border);border-radius:24px;box-shadow:var(--ui-shadow)}
html body .fs11-scan-panel-top strong{font-size:1.5rem;color:var(--ui-text)}
html body .fs11-scan-buttons{display:grid;grid-template-columns:1fr;gap:12px}
html body .fs-scan-primary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px;padding:18px 24px;border:0;border-radius:16px;background:var(--ui-accent);color:var(--ui-accent-text);font-weight:750;font-size:1.1rem;text-align:left}
html body .fs-scan-primary small{display:block;font-size:.85rem;font-weight:500}
html body .fs-scan-alt{min-height:48px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-soft);color:var(--ui-text)}
html body .fs-quick-find-row{display:flex;align-items:center;gap:8px;padding:8px;background:var(--ui-soft);border:1px solid var(--ui-border);border-radius:14px}
html body .fs-quick-find-row input{min-width:0;flex:1;width:0;background:transparent;color:var(--ui-text);border:0;font-size:16px}
html body .fs-quick-find-row button[type=submit]{padding:12px;border:0;border-radius:10px;background:var(--ui-accent);color:var(--ui-accent-text)}
html body :is(.fs-command-note,.fs12-instant-try small,.fs11-separator){color:var(--ui-muted);font-size:.85rem}
/* Result: product identity, finding, measured evidence. */
html body .fs12-hero{padding:28px;background:var(--ui-card);color:var(--ui-text)}
html body .fs12-hero-bar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--ui-border);color:var(--ui-muted);font-size:.8rem}
html body .fs12-hero-grid{display:grid;grid-template-columns:200px minmax(0,1fr);gap:28px;margin-top:24px;align-items:start}
html body .fs12-identity{background:var(--ui-soft);border:1px solid var(--ui-border);border-radius:18px;padding:16px;color:var(--ui-text)}
html body .fs12-identity .d8-pack{height:180px;background:#fff;border-radius:12px;padding:12px;overflow:hidden}
html body .fs12-identity img{width:100%;height:100%;object-fit:contain}
html body .fs12-identity h2{font-size:1.35rem;margin-top:8px}
html body :is(.fs12-product-kicker,.fs12-identity p){color:var(--ui-muted);font-size:.85rem}
html body .fs12-executive{padding:0;background:transparent;border:0;box-shadow:none;color:var(--ui-text)}
html body .fs12-executive-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
html body .fs12-verdict-label{color:var(--ui-accent);font-size:.75rem;font-weight:750;letter-spacing:.09em}
html body #decision-title{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.15;margin:20px 0 14px;max-width:27ch;color:var(--ui-text)}
html body .fs12-verdict-lead{font:inherit;font-size:1rem;line-height:1.7;color:var(--ui-muted);max-width:66ch}
html body .fs12-traffic{padding:16px;margin-top:24px;border:1px solid var(--ui-border);border-radius:16px;background:var(--ui-soft)}
html body .fs12-traffic-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;color:var(--ui-text)}
html body .fs12-traffic-head span{color:var(--ui-muted);font-size:.8rem}
html body .lights{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
html body .light{display:flex;flex-direction:column;gap:7px;padding:14px 12px;border-radius:12px;border:1px solid var(--ui-border);background:var(--ui-card);color:var(--ui-text);border-top:4px solid var(--ui-muted)}
html body .light.l-high{border-top-color:#e87568}html body .light.l-medium{border-top-color:#e7b857}html body .light.l-low{border-top-color:#58b98c}
html body :is(.light-name,.light-word,.light-note){color:var(--ui-text)}
html body .light-val{font-size:1.65rem;line-height:1.2;color:var(--ui-text);font-variant-numeric:tabular-nums}
html body .light-note{font-size:.75rem}
html body .fs12-hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
html body :is(.fs12-hero-primary,.fs12-hero-secondary){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 16px;border-radius:12px;border:1px solid var(--ui-border);background:var(--ui-soft);color:var(--ui-text);font-weight:700;text-decoration:none}
html body .fs12-hero-primary{background:var(--ui-accent);color:var(--ui-accent-text);border-color:var(--ui-accent)}
html body .fs12-hero-disclaimer{margin-top:14px;font-size:.8rem;color:var(--ui-muted)}
html body :is(.fs11-evidence-row,.fs11-result-source,.fs11-metrics-head,.d8-metrics,.d8-result-actions,.d8-result-tools){background:var(--ui-card);color:var(--ui-text);border-color:var(--ui-border)}
html body :is(.fs11-evidence-heading p,.fs11-evidence-list p,.d8-source,.d10-confidence small,.d10-sugar small,.d8-metric span,.d8-metric small){color:var(--ui-muted);font-size:.85rem}
html body .d8-metric{background:var(--ui-soft);border:1px solid var(--ui-border);border-radius:14px;padding:18px}
html body .d8-metric strong{color:var(--ui-text);font-size:1.6rem}
/* Ingredients: restore legibility on every tone, including white panels. */
html body #fs-ingredients{background:var(--ui-card);color:var(--ui-text)}
html body #fs-ingredients :is(h2,h3,h4,p,small){color:var(--ui-text)}
html body .fs12-ingredient-intro{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:24px 0 14px;color:var(--ui-text)}
html body .fs12-ingredient-intro strong{font-size:1.15rem;color:var(--ui-text)}
html body .fs12-ingredient-intro span{color:var(--ui-muted);font-size:.85rem}
html body .fs12-ingredient-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
html body .fs12-ingredient-list .fs12-ing-row{display:grid;grid-template-columns:40px minmax(0,1fr) 90px;gap:16px;align-items:center;padding:18px;background:var(--ui-soft);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:14px;box-shadow:none}
html body .fs12-ing-index{display:grid;place-items:center;width:40px;height:40px;background:var(--ui-card);color:var(--ui-muted);border-radius:10px;font-size:.85rem;font-weight:750}
html body .fs12-ing-content{min-width:0;display:flex;flex-direction:column;gap:5px}
html body .fs12-ing-content strong{color:var(--ui-text);font-size:1rem;overflow-wrap:anywhere}
html body .fs12-ing-translation{color:var(--ui-muted);font-size:.9rem}
html body .fs12-ing-label{align-self:start;color:var(--ui-text);background:var(--ui-card);border:1px solid var(--ui-border);border-radius:6px;padding:3px 7px;font-size:.7rem}
html body .fs12-ing-right{text-align:right;color:var(--ui-muted)}
html body .fs12-ing-percent{font-size:1.4rem;color:var(--ui-text);font-weight:750}
html body .fs12-ing-right small{display:block;color:var(--ui-muted)}
html body .fs12-ing-bar{height:6px;background:var(--ui-border);border-radius:8px;margin-top:4px;overflow:hidden}
html body .fs12-ing-bar span{display:block;height:100%;background:var(--ui-accent)}
html body :is(.fs12-raw-label,.fs12-label-footnote){background:var(--ui-soft);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:14px;padding:18px;margin-top:18px}
html body .fs12-raw-label p{font-size:1rem;line-height:1.8;color:var(--ui-text)}
html body .fs12-ing-disclaimer{font-size:.85rem;color:var(--ui-muted);line-height:1.7}
html body .d8-ing-preview li{background:var(--ui-soft);color:var(--ui-text);border:1px solid var(--ui-border);padding:12px;border-radius:10px}
html body .d8-ing-preview .ing-name{color:var(--ui-text);font-size:.95rem}
/* Actual diary-linked quantity calculator: preserve all existing handlers. */
html body .fs12-portion{padding:28px;margin-top:24px}
html body .fs11-portion-intro h2{font-size:clamp(1.6rem,3vw,2rem)}
html body .fs11-portion-intro p{font-size:1rem;color:var(--ui-muted)}
html body .fs12-portion-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);gap:20px;margin-top:24px;align-items:stretch}
html body :is(.fs12-portion-control,.fs12-portion-output){background:var(--ui-soft);color:var(--ui-text);border:1px solid var(--ui-border);padding:24px;border-radius:18px}
html body .fs12-portion-control>label{display:block;color:var(--ui-text);font-size:1rem;font-weight:750;margin-bottom:12px}
html body .fs12-amount-stepper{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;gap:8px}
html body .fs12-amount-stepper button{min-height:64px;border:1px solid var(--ui-border);background:var(--ui-card);color:var(--ui-text);border-radius:12px;font-size:1.5rem}
html body .fs11-amount-field{display:flex;align-items:center;gap:6px;background:var(--ui-card);border:1px solid var(--ui-border);border-radius:12px;padding-right:12px}
html body #md-product-amount{width:100%;min-width:0;min-height:64px;border:0;background:transparent;color:var(--ui-text);font-size:2rem;font-weight:750;text-align:center;font-variant-numeric:tabular-nums;padding:8px}
html body .fs11-amount-field strong{color:var(--ui-muted)}
html body #md-amount-slider{width:100%;accent-color:var(--ui-accent);min-height:44px;margin:12px 0;background:transparent;border:0;padding:0}
html body :is(#fs11-serving-help,#md-est-foot,.fs12-portion-submit p){color:var(--ui-muted);font-size:.85rem;line-height:1.6}
html body .fs12-presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:18px}
html body .fs12-presets button{padding:12px;background:var(--ui-card);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:12px;min-height:60px;text-align:left}
html body .fs12-presets button small{display:block;color:var(--ui-muted);font-size:.75rem}
html body .fs12-presets button[aria-pressed=true]{outline:2px solid var(--ui-accent);outline-offset:-2px;background:var(--ui-soft)}
html body .fs11-portion-results-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;color:var(--ui-text)}
html body .fs11-portion-results-head strong{font-size:1.4rem}
html body .fs12-sugar-focus{background:var(--ui-alert);color:var(--ui-alert-text);border:1px solid var(--ui-border);border-radius:14px;padding:16px;margin:16px 0}
html body .fs12-sugar-focus strong{display:block;font-size:1.65rem;color:var(--ui-alert-text)}
html body .fs12-sugar-focus small{display:block;font-size:.8rem;color:var(--ui-alert-text);line-height:1.6}
html body .fs12-macro-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0}
html body .fs12-macro{background:var(--ui-card);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:12px;padding:14px;min-width:0}
html body .fs12-macro span{display:block;font-size:.8rem;color:var(--ui-muted)}
html body .fs12-macro strong{display:block;font-size:1.2rem;color:var(--ui-text);margin-top:6px;font-variant-numeric:tabular-nums}
html body .fs12-portion-submit{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:20px;flex-wrap:wrap}
html body .fs12-portion-submit p{max-width:55ch}
html body .fs12-portion-submit button{min-height:48px;border:0;border-radius:12px;padding:14px 20px;background:var(--ui-accent);color:var(--ui-accent-text);font-weight:750}
/* White cards must never inherit pale dark-theme text. */
html body .qr{background:var(--ui-card);color:var(--ui-text);border-color:var(--ui-border)}
html body .qr-text strong{color:var(--ui-text)}html body .qr-text small{color:var(--ui-muted)}
html body :is(button,a,input):focus-visible{outline:3px solid var(--ui-accent);outline-offset:4px}
@media(max-width:850px){html body .fs11-launch{grid-template-columns:1fr;gap:24px;padding:24px 0}html body .fs12-hero-grid{grid-template-columns:1fr}html body .fs12-identity{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:center}html body .fs12-identity .d8-pack{height:110px}html body .fs12-portion-grid{grid-template-columns:1fr}}
@media(max-width:520px){html body :is(.fs12-hero,.fs12-portion,.fs11-scan-panel){padding:18px}html body .lights{grid-template-columns:repeat(2,minmax(0,1fr))}html body .fs12-ingredient-list .fs12-ing-row{grid-template-columns:28px minmax(0,1fr) 68px;gap:10px;padding:12px}html body .fs12-ing-index{width:28px;height:32px}html body :is(.fs12-portion-control,.fs12-portion-output){padding:16px}html body .fs12-hero-actions>*{flex:1 1 100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
