.hb-review { --hb-section-gap: 24px; --hb-inset: 20px; padding-block-end: var(--s-5); }
.hb-review *, .hb-review *::before, .hb-review *::after { min-inline-size: 0; }
.hb-review p, .hb-review li, .hb-review td, .hb-review th, .hb-review dd { overflow-wrap: break-word; }
.hb-review h1, .hb-review h2, .hb-review h3, .hb-review p { max-inline-size: none; }
.hb-review p:last-child { margin-block-end: 0; }
.hb-hero { padding-block: var(--s-3) 0; }
.hb-brand { margin-block-end: var(--s-4); }
.hb-brand img { inline-size: min(15rem, 100%); block-size: auto; }
.hb-lead { color: var(--text-dim); font-size: 1.125rem; }
.hb-fork { display: grid; gap: var(--s-3); margin-block: var(--s-5); }
.hb-mode { padding: var(--hb-inset); border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--surface); }
.hb-mode--fixed { background: var(--brand-soft); }
.hb-label { margin-block-end: var(--s-2); font-weight: 700; color: var(--brand); }
.hb-key { font: 700 1.5rem/1.3 var(--font-display); margin-block-end: var(--s-3); }
.hb-mode p:not(.hb-label):not(.hb-key) { margin-block-end: var(--s-3); }
.hb-mode p:last-child { margin-block-end: 0; }
.hb-held { display: grid; gap: var(--s-2); padding: var(--s-4) var(--hb-inset); border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--surface-alt); }
.hb-held strong { color: var(--brand); }
.hb-action-condition { font-size: 1rem; margin-block-end: var(--s-4); }
.hb-actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--s-3) var(--s-4); }
.hb-actions a { min-block-size: var(--tap); display: inline-flex; align-items: center; }
.hb-actions .button { gap: var(--s-2); overflow-wrap: normal; word-break: normal; }
.hb-actions .rc-icon { flex: 0 0 auto; }
.hb-contents { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); margin-block: var(--hb-section-gap); padding: var(--s-3) var(--s-4); background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-control); }
.hb-contents a { display: inline-flex; min-block-size: 24px; align-items: center; font-size: 1rem; }
.hb-section { margin-block-start: var(--hb-section-gap); padding-block: 0; }
.hb-section--soft, .hb-choice { padding: var(--hb-inset); background: var(--surface-alt); border-radius: var(--r-panel); }
.hb-review .hb-table { position: relative; overflow-x: auto; overscroll-behavior-inline: contain; border: 1px solid var(--border); border-radius: var(--r-panel); margin-block: var(--s-4); background: var(--surface); scrollbar-color: var(--control-border) var(--surface-alt); }
.hb-table table { inline-size: 100%; font-size: 1rem; }
.hb-table th, .hb-table td { min-inline-size: 8rem; }
.hb-table caption { font-size: 1rem; }
.hb-scroll-hint { font-size: var(--t-small); color: var(--text-mute); margin-block-end: var(--s-2); }
.hb-timeline { display: grid; gap: var(--s-3); list-style: none; padding: 0; margin-block: var(--s-4); }
.hb-timeline li { margin: 0; display: grid; gap: var(--s-2); padding: var(--s-4); border: 1px solid var(--border); background: var(--surface); border-radius: var(--r-control); }
.hb-timeline strong { display: flex; gap: var(--s-2); align-items: center; color: var(--brand); }
.hb-equation { display: grid; gap: var(--s-3); margin-block: var(--s-5); }
.hb-equation > div { padding: var(--s-4); border-block-start: 2px solid var(--brand); background: var(--surface-alt); }
.hb-equation strong, .hb-equation span { display: block; }
.hb-equation strong { font-size: 1.25rem; font-family: var(--font-display); margin-block-end: var(--s-2); }
.hb-example { padding: var(--hb-inset); border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--surface); margin-block: var(--s-4); }
.hb-example strong, .hb-loss-example strong { color: var(--brand); }
.hb-claim { display: grid; gap: var(--s-3); padding-inline-start: 1.5rem; }
.hb-claim li { padding-inline-start: var(--s-2); margin: 0; }
.hb-claim li::marker { color: var(--brand); font-weight: 700; }
.hb-loss-example { padding: var(--hb-inset); background: var(--brand-soft); border-radius: var(--r-panel); margin-block: var(--s-4); }
.hb-gallery-pair { display: grid; gap: var(--s-5); margin-block-start: var(--s-5); }
.hb-evidence { margin: 0; }
.hb-evidence > a { display: block; padding: var(--s-3); border: 1px solid var(--border); background: var(--surface); border-radius: var(--r-panel); text-decoration: none; }
.hb-evidence img { display: block; inline-size: auto; max-inline-size: 100%; block-size: auto; max-block-size: 24rem; margin-inline: auto; object-fit: contain; }
.hb-enlarge { display: block; padding-block-start: var(--s-3); text-decoration: underline; text-underline-offset: .2em; font-weight: 650; font-size: var(--t-small); }
.hb-evidence figcaption { color: var(--text-mute); font-size: var(--t-small); line-height: 1.6; margin-block-start: var(--s-3); }
.hb-evidence figcaption a { display: inline-flex; align-items: center; min-block-size: 24px; }
.hb-alternative { margin-block: var(--s-5); }
.hb-alternative .compact-offer__brand img { inline-size: min(11rem,100%); block-size: auto; }
.hb-review .hb-alternative .compact-offer__actions > * { overflow-wrap: normal; word-break: normal; }
.hb-review .hb-alternative .compact-offer__conditions { grid-template-columns: minmax(0,1fr); }
.hb-method { margin-block-start: var(--s-4); font-size: 1rem; }
.hb-faq details { border-block-end: 1px solid var(--border); padding-block: var(--s-2); }
.hb-faq summary { font-weight: 650; }
.hb-lightbox { display: none; inline-size: calc(100% - 16px); max-inline-size: 76rem; block-size: calc(100dvh - 16px); max-block-size: calc(100dvh - 16px); margin: auto; padding: var(--s-3); border: 1px solid var(--border); border-radius: var(--r-panel); background: var(--surface); color: var(--text); }
.hb-lightbox[open] { display: block; }
.hb-lightbox::backdrop { background: var(--overlay-bg); }
.hb-lightbox-shell { display: grid; grid-template-rows: minmax(0,auto) minmax(0,1fr) auto; gap: var(--s-2); block-size: 100%; }
.hb-lightbox-top { display: grid; gap: var(--s-2); max-block-size: 45dvh; overflow: auto; overscroll-behavior: contain; }
.hb-lightbox-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.hb-lightbox-bar p { font-weight: 700; margin: 0; }
.hb-lightbox .button { padding: var(--s-2) var(--s-3); font-size: .875rem; min-block-size: var(--tap); }
.hb-lightbox-bar button { flex: 0 0 auto; }
.hb-lightbox-controls { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
.hb-lightbox-controls > span { padding-inline: var(--s-1); font-variant-numeric: tabular-nums; }
.hb-lightbox-short { font-size: .875rem; font-weight: 650; line-height: 1.35; margin: 0; }
.hb-lightbox-help { color: var(--text-mute); font-size: .875rem; line-height: 1.35; margin: 0; }
.hb-image-area { overflow: auto; overscroll-behavior: contain; border: 1px solid var(--border); background: var(--surface-alt); scrollbar-color: var(--control-border) var(--surface-alt); }
.hb-image-area > img { display: block; max-inline-size: 100%; max-block-size: 100%; inline-size: auto; block-size: auto; margin-inline: auto; object-fit: contain; }
.hb-lightbox.is-original .hb-image-area > img { max-inline-size: none; max-block-size: none; inline-size: 672px; block-size: auto; margin: 0; }
.hb-image-error { color: var(--danger); margin: 0; font-size: .875rem; }
body.is-hb-locked { overflow: hidden; }
body.is-hb-locked [data-ui-top] { display: none; }
@media (min-width: 480px) { .hb-lightbox { padding: var(--s-4); } }
@media (min-width: 768px) {
  .hb-fork { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hb-held { grid-column: 1 / -1; grid-template-columns: minmax(8rem,1fr) minmax(0,3fr); align-items: start; }
  .hb-gallery-pair { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .hb-equation { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .hb-timeline { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (min-width: 1024px) {
  .hb-timeline { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .hb-evidence img { max-block-size: 27rem; }
  .hb-review .hb-alternative { grid-template-columns: minmax(7rem,.6fr) minmax(0,3fr) minmax(9rem,.8fr); }
}
@media (min-width: 1280px) { .hb-hero { padding-block-start: var(--s-4); } }
@media print { .hb-lightbox, .hb-enlarge { display: none; } .hb-evidence img { max-block-size: none; } .hb-table { overflow: visible; } }


.hb-review .hb-alternative { grid-template-columns: minmax(0,1fr); gap: var(--s-3); }
.hb-alternative .compact-offer__brand img { inline-size: min(8rem,100%); }
.hb-alternative-base { margin-block: var(--s-2) 0; }
.hb-alternative-details { margin-block: 0 var(--s-5); padding: var(--s-3) var(--s-4); border: 1px solid var(--border); border-radius: var(--r-control); background: var(--surface); }
.hb-alternative-details > summary { min-block-size: var(--tap); padding-block: var(--s-2); font-weight: 650; cursor: pointer; }
.hb-alternative-details .compact-offer__conditions { display: grid; grid-template-columns: minmax(0,1fr); gap: var(--s-3); margin-block: var(--s-3); }
.hb-alternative-details .compact-offer__conditions > div { padding-block-end: var(--s-3); border-block-end: 1px solid var(--border); }
.hb-alternative-details dt { font-weight: 650; }
.hb-alternative-details dd { margin: var(--s-1) 0 0; }
.hb-alternative-visit { margin: var(--s-3) 0 0; }
.hb-alternative-visit a { display: inline-flex; align-items: center; gap: var(--s-2); min-block-size: var(--tap); }
.hb-lightbox-bar { flex-wrap: wrap; }
.hb-lightbox-bar > p { flex: 1 0 auto; min-inline-size: max-content; overflow-wrap: normal; word-break: normal; }
.hb-lightbox-bar > button { margin-inline-start: auto; touch-action: manipulation; }
main.rc-scope > .hb-review { padding-inline-start: min(var(--gutter),16px); }
.hb-hero h1 { margin-inline-end: calc(0px - clamp(0px,calc(100dvh - 660px),var(--backtop-required-inset))); }
@media (min-width: 768px) {
  main.rc-scope > .hb-review { padding-inline-start: var(--gutter); }
  .hb-hero h1 { margin-inline-end: 0; }
  .hb-review .hb-alternative { grid-template-columns: minmax(7rem,.6fr) minmax(0,3fr) auto; align-items: center; }
}


.hb-hero__brand { display: inline-block; max-inline-size: 100%; overflow-wrap: anywhere; }
.hb-hero__product { display: inline-block; white-space: nowrap; }
