/* Claude refinement: only what differs from the polish page. One hand tokens throughout. */

/* Hero: the headline's two beats always sit on two lines */
body.claude-refine #unit-hero#unit-hero .cr-line{display:block}

/* ---------- Nutrition opening ---------- */
body.claude-refine #unit-nutrition#unit-nutrition .gp-page{overflow-x:clip}
body.claude-refine #unit-nutrition#unit-nutrition .concept-review-note{font-size:var(--oh-micro);line-height:1.5}
/* "That matters." gets the weight it earns, in the same two tones as the benefits */
body.claude-refine #unit-nutrition#unit-nutrition .gp-gap{margin-top:14px;font-size:var(--oh-item);font-weight:500;line-height:1.3;letter-spacing:-.02em}
body.claude-refine #unit-nutrition#unit-nutrition .gp-turn{margin-top:36px}
body.claude-refine #unit-nutrition#unit-nutrition .gp-product{padding-top:40px;padding-bottom:var(--oh-space)}

/* ---------- Benefits: type on your mist, no boxes ---------- */
body.claude-refine #unit-nutrition#unit-nutrition .gp-benefits{padding-top:var(--oh-space);padding-bottom:var(--oh-space)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-benefits-lead{margin-top:12px;font-size:var(--oh-body);line-height:1.45;color:var(--oh-muted)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-benefit-list{margin-top:24px;border-top:1px solid var(--oh-line)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-page .gp-benefit,
body.claude-refine #unit-nutrition#unit-nutrition .gp-page .gp-benefit:last-child{border-bottom:1px solid var(--oh-line)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-benefit>summary{align-items:flex-start;gap:20px;min-height:0;padding:20px 0}
body.claude-refine #unit-nutrition#unit-nutrition .gp-say{display:block;min-width:0;text-wrap:pretty;font-size:var(--oh-item);font-weight:500;line-height:1.28;letter-spacing:-.02em;color:var(--oh-muted)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-say strong{display:inline;margin:0;font-size:inherit;font-weight:500;letter-spacing:inherit;color:var(--oh-ink)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-plus{margin-top:6px}
body.claude-refine #unit-nutrition#unit-nutrition .gp-detail{padding-bottom:22px}

/* ---------- Portion: one picture that reads on its own ---------- */
body.claude-refine #unit-nutrition#unit-nutrition .gp-proof{padding-top:var(--oh-space);padding-bottom:0}
body.claude-refine #unit-nutrition#unit-nutrition .gp-portion{position:relative;margin:16px 0 0;overflow:hidden;border-radius:var(--oh-corner)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-proof .gp-portion>img{display:block;width:100%;margin:0}
body.claude-refine #unit-nutrition#unit-nutrition .gp-quantities{display:block;margin:0}
body.claude-refine #unit-nutrition#unit-nutrition .gp-q{position:absolute;margin:0;transform:translateX(-50%);white-space:nowrap;text-align:center}
body.claude-refine #unit-nutrition#unit-nutrition .gp-q-small{left:23%;bottom:33%}
body.claude-refine #unit-nutrition#unit-nutrition .gp-q-big{left:69%;bottom:75%}
body.claude-refine #unit-nutrition#unit-nutrition .gp-q strong{display:block;font-size:var(--oh-item);line-height:1.15;letter-spacing:-.025em}
body.claude-refine #unit-nutrition#unit-nutrition .gp-q span{display:block;margin-top:1px;font-size:var(--oh-micro);line-height:1.3;color:var(--oh-muted)}
body.claude-refine #unit-nutrition#unit-nutrition .gp-proof .gp-caption{margin-top:10px;text-align:left}

/* ---------- Handful: big, and the arm runs off the screen ---------- */
body.claude-refine #unit-nutrition#unit-nutrition .gp-ease{padding-top:var(--oh-space);padding-bottom:0}
body.claude-refine #unit-nutrition#unit-nutrition .gp-ease .gp-hand{display:block;width:calc(100% + var(--oh-gutter));max-width:none;height:auto;margin:6px calc(-1 * var(--oh-gutter)) 8px 0;object-fit:initial}
body.claude-refine #unit-nutrition#unit-nutrition .gp-usecases{padding-top:28px}

/* ---------- Comparison: one figure per price cell ---------- */
body.claude-refine #comparison .ec-table tbody th{letter-spacing:-.01em}

@media(max-width:359px){
  body.claude-refine #unit-nutrition#unit-nutrition .gp-q strong{font-size:var(--oh-row)}
}

/* ---------- Gallery: on the page's margin at every width ---------- */
body.claude-refine{--cr-edge:max(var(--oh-gutter),calc((100vw - 1200px) / 2))}
body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .recipe-toolbar,
body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .recipe-status{width:auto;margin-left:var(--cr-edge);margin-right:var(--cr-edge)}
body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .recipe-gallery .gallery{padding-left:var(--cr-edge);padding-right:var(--cr-edge);scroll-padding-left:var(--cr-edge)}

/* ---------- Tablet ---------- */
@media(min-width:700px){
  body.claude-refine #unit-nutrition#unit-nutrition .gp-study{display:none}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-proof,
  body.claude-refine #unit-nutrition#unit-nutrition .gp-ease{max-width:none;margin:0}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-portion,
  body.claude-refine #unit-nutrition#unit-nutrition .gp-proof .gp-caption{max-width:672px}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-ease .gp-hand{width:min(620px,calc(100% + var(--oh-gutter)));height:auto;margin:6px calc(-1 * var(--oh-gutter)) 8px auto}
}

/* ---------- Computer ---------- */
@media(min-width:1000px){
  body.claude-refine #unit-nutrition#unit-nutrition .gp-intro-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);column-gap:72px;align-items:center;width:calc(100% - 2 * var(--oh-gutter));max-width:1200px;margin:0 auto;padding-top:var(--oh-space);padding-bottom:var(--oh-space)}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-intro-layout>.gp-opening,
  body.claude-refine #unit-nutrition#unit-nutrition .gp-intro-layout>.gp-product{padding:0}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-reveal{max-width:none;margin-top:12px}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-benefits{display:block;padding-top:var(--oh-space);padding-bottom:var(--oh-space)}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-benefits-lead{max-width:34em}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-benefit-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;margin-top:40px;border-top:0}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-page .gp-benefit,
  body.claude-refine #unit-nutrition#unit-nutrition .gp-page .gp-benefit:last-child{border-bottom:0;border-top:1px solid var(--oh-line)}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-proof{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto auto;column-gap:64px;align-items:center;width:calc(100% - 2 * var(--oh-gutter));max-width:1200px;margin:0 auto;padding-inline:0;padding-top:var(--oh-space)}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-proof h3{grid-column:1;grid-row:1/3}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-portion{grid-column:2;grid-row:1;max-width:none;margin:0}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-proof .gp-caption{grid-column:2;grid-row:2;max-width:none}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-ease{position:relative;width:calc(100% - 2 * var(--oh-gutter));max-width:1200px;min-height:520px;margin:0 auto;padding-inline:0;padding-top:var(--oh-space);padding-right:52%}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-ease .gp-hand{position:absolute;right:calc((100% - 100vw) / 2);top:40px;width:min(640px,calc(50% + (100vw - 100%) / 2));height:auto;margin:0}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-ease>h3{margin-top:32px}
  body.claude-refine #unit-nutrition#unit-nutrition .gp-usecases{padding-top:40px}
}

/* ---------- Line breaks and row widths ---------- */
body.claude-refine #unit-nutrition#unit-nutrition :is(.gp-turn h3,.gp-proof h3,.gp-gap,.gp-benefits-lead){text-wrap:balance}
body.claude-refine #unit-nutrition#unit-nutrition .gp-notes .explore{max-width:none}

/* ---------- Gallery on the rule: one grey, one label size ---------- */
body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .use-filters button[aria-pressed="false"],
body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .recipe-status{color:var(--oh-muted)}
body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .gallery-caption{font-size:var(--oh-small)}

/* ---------- Computer: the gallery arrows sit beside the tabs, not on the tiles ---------- */
@media(min-width:1000px){
  body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .recipe-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px}
  body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .recipe-toolbar .meal-menu{flex:1 1 auto;min-width:0}
  body.claude-refine #unit-nutrition#unit-nutrition #taste#taste .gallery-controls{position:static;inset:auto;transform:none;flex:none;margin:0;opacity:1;pointer-events:auto}
}