/* Specialized model highlights — Figma 2182:170868.
   A single split card; the shared heading/control layer stays outside the moving
   track so carousel navigation retains focus. Its reserved height is shared with
   the copy column. Measurements, source strings, and handlers are untouched. */
.hl-section .hl-shell { --hl-proof-width:420px;--hl-head-height:87px;background:rgba(249,247,245,.9); }
.hl-section .hl-head { position:absolute;top:0;left:0;z-index:2;width:calc(100% - var(--hl-proof-width));height:var(--hl-head-height);max-width:none;margin:0;padding:24px 32px;background:transparent;border-radius:0; }
.hl-section .hl-head .hl-title { font-family:var(--fw-font-sans,'Inter',sans-serif)!important;font-size:12px;font-weight:600!important;line-height:17.4px;letter-spacing:-.06px!important;color:var(--fw-text-soft, #706666)!important; }
.hl-section .hl-viewport { padding:0;background:transparent;border-radius:0; }
.hl-section .hl-card { grid-template-columns:minmax(0,1fr) var(--hl-proof-width);align-items:stretch;gap:0;min-height:380px; }
.hl-section .hl-copy { padding:var(--hl-head-height) 32px 32px; }
.hl-section .hl-model-name { font-weight:600!important;letter-spacing:0!important; }
.hl-section .hl-badge-fw { background:var(--fw-surface-01, #F4F0EC)!important;color:var(--fw-accent, #A71E7E)!important;mix-blend-mode:normal; }
.hl-section .hl-badge-mark { width:16px;height:8px;object-fit:contain; }
.hl-section .hl-claim { margin-top:0;padding-top:32px;font-size:16px;line-height:20.3px;font-weight:500;letter-spacing:-.32px; }
.hl-section .hl-body { max-width:512px;font-size:14px;line-height:20.3px;font-weight:500!important;letter-spacing:-.28px;color:var(--fw-text-soft, #706666)!important; }
.hl-section .hl-foot { margin-top:0;padding-top:32px; }
.hl-section .hl-btn { border-radius:2px!important; }
/* Stretch rather than fix the height: additional source notes and narrow layouts
   must grow the card instead of clipping results or changing their values. */
.hl-section .hl-proof { min-height:380px;padding:32px 35px; }
.hl-section .hl-proof::before { left:-188px;right:auto;top:-188px;opacity:.5; }
.hl-section .hl-proof::after { content:"";position:absolute;left:-125px;bottom:-109px;width:250px;height:250px;border-radius:95px;background:var(--fw-button-bg, #280016);opacity:.45;filter:blur(100px);pointer-events:none;z-index:0; }
.hl-section .hl-proof-label { font-size:14px;line-height:17px;font-weight:600!important; }
.hl-section .hl-bars { margin-top:16px;gap:10px; }
.hl-section .hl-bar-row { gap:4px 10px; }
.hl-section .hl-bar-name { line-height:17px;font-weight:600!important; }
.hl-section .hl-bar-track { height:5px;margin:.5px 0; }
.hl-section .hl-bar-fill { transform-origin:left center; }
.hl-section .hl-bar-fill[data-ui-bg="#C9B8FF"] { background:var(--fw-accent-bg, #FFC0E7)!important; }
.hl-section .hl-chip { background:linear-gradient(90deg,rgba(244,240,236,.3),rgba(244,240,236,0))!important;border-radius:10px!important; }
.hl-section .hl-proof .hl-chip-text { color:#F7F3FF; }
.hl-section .hl-cost { gap:12px;margin-top:28px;padding-top:0;border-top:0; }
.hl-section .hl-cost-item { min-width:0;padding:8px 10px;border-radius:10px!important;background:linear-gradient(90deg,rgba(244,240,236,.15),rgba(244,240,236,.05)); }
.hl-section .hl-cost-label { font:600 12px/17px 'Inter',sans-serif;font-weight:600!important;letter-spacing:-.06px;text-transform:none;color:#FFFFFF; }
.hl-cost-label[data-display-name] .hl-cost-source { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap; }
.hl-cost-label[data-display-name]::before { content:attr(data-display-name); }
.hl-cost-amount { display:flex;align-items:center;gap:4px; }
.hl-section .hl-cost-val { margin:0;font:600 16px/24px 'Inter',sans-serif;font-weight:600!important;letter-spacing:-.08px;color:#FFFFFF!important; }
.hl-section .hl-proof .hl-cost-item:first-child .hl-cost-val { color:#F8F4FF!important; }
.hl-cost-unit { display:none; }
.hl-cost-unit[data-unit] { display:inline-flex;align-items:center;gap:2px;font:500 12px/17px 'Inter',sans-serif;letter-spacing:-.06px;color:rgba(255,255,255,.55);text-transform:capitalize; }
.hl-cost-unit img { display:block;width:5px;height:9px;opacity:.7; }
.hl-cost-unit::after { content:attr(data-unit); }
.hl-section .hl-cost-sub { margin:0;font:500 12px/17px 'Inter',sans-serif;letter-spacing:-.06px;color:rgba(255,255,255,.55); }
/* Result rows, set like the key-insight rows but lit for the dark proof panel. A mark sits
   on a light circle because several developers' marks are dark ink. */
.hl-section .hl-rows { display:flex;flex-direction:column;margin-top:16px; }
.hl-section .hl-row { display:grid;grid-template-columns:22px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;padding:8px 0;border:0;border-top:1px solid rgba(249,247,245,.14);border-radius:0;background:none;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:background-color 200ms; }
.hl-section .hl-row:last-child { border-bottom:1px solid rgba(249,247,245,.14); }
.hl-section .hl-row:hover { background:rgba(249,247,245,.06); }
.hl-section .hl-row:focus-visible { outline:3px solid var(--fw-brand,#6726FE);outline-offset:2px; }
.hl-section .hl-row-mark { display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--fw-surface,#FFFFFF); }
.hl-section .hl-row-mark img { display:block;width:14px;height:14px;object-fit:contain; }
.hl-section .hl-row-label { display:flex;flex-direction:column;min-width:0; }
.hl-section .hl-row-model, .hl-section .hl-row-bench { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.hl-section .hl-row-model { font:600 14px/17px 'Inter',sans-serif;letter-spacing:-.01em;color:var(--fw-surface,#FFFFFF); }
.hl-section .hl-row-bench { font:500 12px/16px 'Inter',sans-serif;letter-spacing:-.01em;color:rgba(255,255,255,.7); }
.hl-section .hl-row-side { display:flex;flex-direction:column;align-items:flex-end;gap:3px; }
.hl-section .hl-row-value { padding:2px 6px;border:1px solid rgba(249,247,245,.4);border-radius:0;font-family:var(--fw-font-label,'JetBrains Mono',ui-monospace,monospace);font-size:11px;line-height:14px;font-weight:600;letter-spacing:var(--fw-label-tracking,.04em);text-transform:uppercase;color:var(--fw-surface,#FFFFFF);font-variant-numeric:tabular-nums;white-space:nowrap; }
.hl-section .hl-row-value.is-first { border-color:var(--fw-accent-bg,#C9B8FF);background:var(--fw-accent-bg,#C9B8FF);color:var(--fw-ember,#18181B); }
.hl-section .hl-row-edge { font-family:var(--fw-font-label,'JetBrains Mono',ui-monospace,monospace);font-size:10px;line-height:12px;letter-spacing:var(--fw-label-tracking,.04em);text-transform:uppercase;color:rgba(255,255,255,.7);font-variant-numeric:tabular-nums;white-space:nowrap; }
.hl-section .hl-rows-note { margin:12px 0 0;font:400 12px/1.45 'Inter',sans-serif;letter-spacing:-.06px;color:rgba(255,255,255,.7); }
/* Keep actual inline percentage widths unchanged. Animate only their visual scale. */
.highlight-motion-ready .hl-proof:not([data-bars-animate]) .hl-bar-fill { transform:scaleX(0); }
.hl-proof[data-bars-animate="true"] .hl-bar-fill { animation:highlight-bar-reveal 1800ms cubic-bezier(.25,.1,.25,1) 80ms both; }
.hl-proof[data-bars-animate="true"] .hl-bar-row:nth-child(2) .hl-bar-fill { animation-delay:150ms; }
.hl-proof[data-bars-animate="true"] .hl-bar-row:nth-child(3) .hl-bar-fill { animation-delay:220ms; }
.hl-proof[data-bars-animate="true"] .hl-bar-row:nth-child(4) .hl-bar-fill { animation-delay:290ms; }
@keyframes highlight-bar-reveal { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@media(max-width:900px) {
  .hl-section .hl-head { width:100%; }
  .hl-section .hl-card { grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto; }
  .hl-section .hl-proof { min-height:0; }
  .hl-section .hl-claim, .hl-section .hl-foot { padding-top:24px; }
}
@media(max-width:640px) {
  .hl-section .hl-shell { --hl-head-height:76px; }
  .hl-section .hl-shell:has(.hl-nav) { --hl-head-height:112px; }
  .hl-section .hl-head { padding:20px;justify-content:center;align-items:flex-start;flex-direction:column;gap:12px; }
  .hl-section .hl-copy { padding:var(--hl-head-height) 20px 28px; }
  .hl-section .hl-proof { padding:28px 20px; }
  .hl-section .hl-cost { grid-template-columns:1fr; }
  .hl-section .hl-cost-item + .hl-cost-item { border-top:0;padding:8px 10px; }
  .hl-section .hl-badge { max-width:100%;white-space:normal; }
  .hl-section .hl-btn { height:auto;min-height:36px;white-space:normal;text-align:left; }
}
@media(prefers-reduced-motion:reduce) {
  .hl-section .hl-bar-fill { animation:none!important;transform:none!important; }
}
@media print {
  .hl-section .hl-bar-fill { animation:none!important;transform:none!important; }
}