/* A short surface, with the detail available on request. */
body.flow-refinement #unit-nutrition#unit-nutrition .nd-discovery .cd-rainbow-title{max-width:none}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-discovery .cd-rainbow-line{max-width:22em}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-controls{
 display:flex;flex-direction:column;gap:10px;width:min(100%,320px);margin:24px auto 0;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-open{
 display:flex;align-items:center;justify-content:space-between;gap:16px;
 width:100%;min-height:50px;margin:0;padding:10px 14px 10px 20px;
 border:1px solid var(--oh-line);border-radius:999px;background:var(--oh-mist);
 color:var(--oh-ink);font:500 var(--oh-body)/1.35 'Work Sans',sans-serif;
 letter-spacing:-.02em;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-open .nx-plus{
 display:block;position:relative;inset:auto;width:26px;height:26px;border-radius:50%;
 background:white;flex:none;color:var(--oh-ink);
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-open:focus-visible,
body.flow-refinement #unit-nutrition#unit-nutrition .nd-close:focus-visible{
 outline:2px solid var(--oh-ink);outline-offset:4px;
}
/* Native dialogs provide focus containment, Escape and focus return. */
body.flow-refinement #unit-nutrition#unit-nutrition dialog.nd-sheet{
 display:none;position:fixed;inset:auto 0 0;margin:0 auto;padding:0;
 width:100%;max-width:640px;max-height:88vh;max-height:88dvh;
 border:0;border-radius:24px 24px 0 0;background:white;color:var(--oh-ink);
 box-shadow:0 -8px 40px rgba(10,42,42,.12);overflow:auto;overscroll-behavior:contain;
 text-align:left;
}
body.flow-refinement #unit-nutrition#unit-nutrition dialog.nd-sheet[open]{display:block}
body.flow-refinement #unit-nutrition#unit-nutrition dialog.nd-sheet::backdrop{background:rgba(10,42,42,.36)}
body:has(dialog.nd-sheet[open]){overflow:hidden}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-head{
 position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;
 gap:16px;padding:16px 20px;background:white;border-bottom:1px solid var(--oh-line);
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-head h3{
 margin:0;font-size:var(--oh-sub);line-height:1.15;letter-spacing:-.035em;font-weight:500;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-close{
 display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;margin:0;
 border:0;border-radius:50%;background:var(--oh-mist);color:var(--oh-ink);cursor:pointer;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-close svg{display:block;width:20px;height:20px}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body{padding:24px 20px 32px}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body p{
 margin:0;font-size:var(--oh-body);line-height:1.5;font-weight:400;color:var(--oh-muted);letter-spacing:-.015em;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body p+p{margin-top:14px}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nx-panel-lead{
 font-size:var(--oh-item);line-height:1.25;font-weight:500;letter-spacing:-.025em;color:var(--oh-ink);
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nf-openbox{
 position:relative;aspect-ratio:4/3;margin:24px 0 0;overflow:hidden;border-radius:var(--oh-corner);
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nf-openbox img{
 display:block;width:100%;height:100%;object-fit:cover;object-position:48% 48%;
 margin:0;transform:scale(1.14);transform-origin:48% 48%;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nx-six{margin:20px 0 0}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nx-six li{font-size:var(--oh-row)}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nx-plant-pair{margin:24px 0 0}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nx-plant-pair img{display:block;width:100%;height:auto;margin:0}
body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body .nx-plant-labels{
 padding:8px 0 0;font-size:var(--oh-micro);font-weight:500;
}
body.flow-refinement #unit-nutrition#unit-nutrition #benefits .nm-detail h4{
 margin:20px 0 8px;font-size:var(--oh-row);line-height:1.3;font-weight:500;letter-spacing:-.02em;
}
body.flow-refinement #unit-nutrition#unit-nutrition #benefits .nm-detail p+a{display:inline-block;margin-top:10px}
/* Restore version 10's actual two-sided visual and label alignment. */
body.flow-refinement #unit-nutrition#unit-nutrition .handful-visual{
 display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);align-items:center;
 gap:10px;width:min(100%,820px);max-width:none;margin:16px auto 0;
}
body.flow-refinement #unit-nutrition#unit-nutrition #portion-comparison .handful-real{
 display:block;width:100%;height:auto;margin:0;-webkit-mask-image:none;mask-image:none;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs{
 width:min(100%,820px);max-width:none;display:grid;
 grid-template-columns:minmax(0,1fr) auto minmax(0,1.06fr);align-items:baseline;
 column-gap:4px;margin:12px auto 0;padding:0 16px;border:0;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs p:first-child{grid-column:1}
body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs p:last-child{grid-column:3}
body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs strong{
 font-size:var(--t-head);line-height:1.12;font-weight:600;letter-spacing:-.04em;
}
body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs small{
 margin-top:2px;font-size:var(--t-label);line-height:1.3;font-weight:500;
 white-space:nowrap;color:var(--nm-body);
}
body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs-word{
 padding-top:0;font-size:var(--t-label);line-height:1.3;color:var(--nm-body);
}
@media(min-width:700px){
 body.flow-refinement #unit-nutrition#unit-nutrition .nd-controls{flex-direction:row;width:max-content;max-width:100%;gap:12px}
 body.flow-refinement #unit-nutrition#unit-nutrition .nd-open{width:auto;min-width:218px;gap:24px}
 body.flow-refinement #unit-nutrition#unit-nutrition dialog.nd-sheet{
  inset:0;margin:auto;width:calc(100% - 96px);max-height:84vh;max-height:84dvh;
  border-radius:var(--oh-corner);box-shadow:0 20px 80px rgba(10,42,42,.18);
 }
 body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-head{padding:20px 28px}
 body.flow-refinement #unit-nutrition#unit-nutrition .nd-sheet-body{padding:28px 28px 36px}
 body.flow-refinement #unit-nutrition#unit-nutrition .handful-visual{gap:32px}
 body.flow-refinement #unit-nutrition#unit-nutrition .nm-vs{padding:0 32px}
}