/* Food Detail typography and responsive secondary-nutrient chart. */
.food-hero h1{font-size:1.75rem}.food-section-head h2{font-size:1.375rem}.food-description,.food-portion-label,.portion-btn{font-size:1rem}.macro-card strong{font-size:1.5rem}.micro-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.micro-card>span,.micro-card small{font-size:.875rem}.micro-card strong{font-size:1rem}.micro-card{min-width:0}.food-portion-controls{align-items:flex-start;flex-direction:column}.portion-switch{flex-wrap:wrap}.sn-portion-controls{margin:1rem 0 1.5rem}
.food-secondary-visual{margin-top:18px;padding:24px;border-radius:14px;min-width:0}.sn-note,.sn-details{font-size:.875rem;line-height:1.6;color:#4d6052}.sn-note{margin-top:7px}.sn-details{margin-top:24px}.sn-details summary{cursor:pointer}.sn-details p{margin:10px 0}.sn-empty{height:74px;border:1px dashed #d4ded5;border-radius:8px;display:grid;place-items:center;color:#4d6052;background:#fafcf9;font-size:.875rem}
.sn-plot{--sn-grid:#e4eae6;position:relative;margin:44px 0 95px 40px;height:220px;font-size:.875rem;line-height:1.4;color:#344c39}.sn-grid{position:absolute;inset:0;pointer-events:none}.sn-grid i{position:absolute;left:0;right:0;border-top:1px solid var(--sn-grid)}.sn-grid i:nth-child(1){top:100%}.sn-grid i:nth-child(2){top:50%}.sn-grid i:nth-child(3){top:0}.sn-rows{position:relative;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;height:100%;padding:0 5px}.sn-row{position:relative;display:flex;align-items:flex-end;justify-content:center;min-width:0}.sn-bar{position:relative;background:#709c78;width:62%;max-width:48px;height:var(--sn-level);border-radius:5px 5px 0 0}.sn-percent{position:absolute;bottom:calc(var(--sn-level) + 7px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:.875rem}.sn-label{position:absolute;top:calc(100% + 12px);width:100%;text-align:center;font-size:.875rem;line-height:1.5}.sn-amount{display:block;overflow-wrap:anywhere}.sn-missing{position:absolute;bottom:10px;writing-mode:vertical-rl;color:#4d6052}.sn-scale span{position:absolute;right:calc(100% + 8px);transform:translateY(-50%);font-weight:400;white-space:nowrap}.sn-scale span:nth-child(1){top:100%}.sn-scale span:nth-child(2){top:50%}.sn-scale span:nth-child(3){top:0}.sn-over{border-radius:0}.sn-over:after{content:"";position:absolute;bottom:100%;left:0;width:100%;height:10px;background:repeating-linear-gradient(135deg,#709c7866 0 3px,transparent 3px 6px)}
@media(max-width:600px){
.food-hero h1{font-size:1.5rem}.food-section-head h2{font-size:1.25rem}.macro-card strong{font-size:1.375rem}.micro-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.food-secondary-visual{padding:20px 14px}
.sn-plot{height:auto;margin:22px 0 44px;--sn-value-width:76px;--sn-value-gap:18px}.sn-grid{right:calc(var(--sn-value-width) + var(--sn-value-gap))}.sn-grid i{top:0!important;bottom:0;right:auto;border-top:0;border-left:1px solid var(--sn-grid)}.sn-grid i:nth-child(1){left:0}.sn-grid i:nth-child(2){left:50%}.sn-grid i:nth-child(3){left:100%}
.sn-rows{display:flex;flex-direction:column;padding:0;gap:22px}.sn-row{display:grid;grid-template-columns:minmax(0,1fr) var(--sn-value-width);grid-template-rows:auto 24px;column-gap:var(--sn-value-gap);row-gap:8px;align-items:center;justify-content:normal;min-height:54px}
.sn-label{position:static;grid-column:1 / -1;grid-row:1;width:auto;text-align:left;background:transparent}.sn-amount{display:inline;margin-left:10px}.sn-bar{grid-column:1;grid-row:2;height:24px;width:var(--sn-level);max-width:none;border-radius:4px}.sn-percent{position:static;transform:none;grid-column:2;grid-row:2;text-align:right;line-height:24px}.sn-missing{position:static;writing-mode:horizontal-tb;grid-column:2;grid-row:2;text-align:right;white-space:nowrap}.sn-scale{position:absolute;top:calc(100% + 14px);left:0;right:calc(var(--sn-value-width) + var(--sn-value-gap));height:24px}.sn-scale span{top:0!important;right:auto;transform:translateX(-50%)}.sn-scale span:nth-child(1){left:0}.sn-scale span:nth-child(2){left:50%}.sn-scale span:nth-child(3){left:100%}.sn-over{border-radius:4px 0 0 4px}.sn-over:after{left:100%;bottom:0;height:100%;width:10px}.sn-details{margin-top:25px}
}
