/*
 * Hosting ("שיגור") app components: uploader, pre-check, preview, consent, scan results, share, dialogs,
 * diff, AI helper, and the dashboard (/hosting/dashboard). Loaded by the landing too (for the hero uploader).
 * v2 tokens only (html[data-v2]); light and dark come from the tokens. Contrast measured against --surface.
 */

.v2 .hs-app, .v2 .hs { --hs-warn: #8A5A12; --hs-warn-bg: color-mix(in srgb, #D69E2E 16%, var(--surface));
  --hs-ok-bg: color-mix(in srgb, var(--positive) 12%, var(--surface));
  --hs-bad-bg: color-mix(in srgb, var(--negative) 12%, var(--surface));
  --hs-mono: ui-monospace, "Cascadia Code", "SFMono-Regular", Menlo, Consolas, monospace; }
@supports (color: light-dark(#fff, #000)) {
  .v2 .hs-app, .v2 .hs { --hs-warn: light-dark(#8A5A12, #F0C674); }
}

/* ---------------------------------------------------------------- shared bits */
/* components set display:flex/grid; the hidden attribute must still win */
.v2 .hs [hidden], .v2 .hs-app [hidden], .v2 .hs-dialog [hidden], .v2 .hsl [hidden] { display: none !important; }
.v2 .hs *, .v2 .hs *::before, .v2 .hs *::after, .v2 .hs-app *, .v2 .hs-app *::before, .v2 .hs-app *::after, .v2 .hs-dialog, .v2 .hs-dialog * { box-sizing: border-box; }
.v2 .hs-small { font-size: var(--fs-1); }
.v2 .hs-linkbtn { background: none; border: 0; padding: 2px 0; min-block-size: 24px; color: var(--accent); font-weight: 600;
  text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.v2 .hs-linkbtn:hover { color: var(--accent-hover); }
.v2 .hs-linkbtn:disabled { color: var(--muted); cursor: default; }
.v2 .hs-iconbtn { inline-size: 40px; block-size: 40px; display: inline-grid; place-items: center; border-radius: var(--r-1);
  border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; font-size: 1rem; }
.v2 .hs-iconbtn:hover { border-color: var(--ink); }
.v2 .hs-btn-danger { background: var(--negative); color: var(--on-accent); }
.v2 .hs-btn-danger:hover { background: var(--ink); color: var(--paper); }
.v2 .hs-btn-danger:disabled { opacity: .5; cursor: not-allowed; }
.v2 .c-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }
.v2 .c-btn--sm { min-block-size: 40px; padding-inline: var(--sp-4); font-size: var(--fs-1); }
.v2 .hs-pill { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: var(--r-pill);
  font-size: .8125rem; font-weight: 700; line-height: 1.6; background: var(--surface-2); color: var(--ink-2); white-space: nowrap; }
.v2 .hs-pill::before { content: ""; inline-size: 8px; block-size: 8px; border-radius: 50%; background: currentColor; }
.v2 .hs-pill.is-live { color: var(--positive); background: var(--hs-ok-bg); }
.v2 .hs-pill.is-draft { color: var(--ink-2); }
.v2 .hs-pill.is-warn { color: var(--hs-warn); background: var(--hs-warn-bg); }
.v2 .hs-pill.is-blocked, .v2 .hs-pill.is-hidden { color: var(--negative); background: var(--hs-bad-bg); }
.v2 .hs-pill.is-pending { color: var(--ink-2); }

/* ------------------------------------------------------------------ uploader */
.v2 .hs-up { display: flex; flex-direction: column; gap: var(--sp-4); }
.v2 .hs-up__tabs { display: flex; gap: var(--sp-1); padding: 4px; background: var(--surface-2); border-radius: var(--r-2); }
.v2 .hs-up__tab { flex: 1; min-block-size: 44px; border: 0; border-radius: calc(var(--r-2) - 4px); background: transparent;
  font-weight: 700; color: var(--ink-2); cursor: pointer; padding-inline: var(--sp-3); }
.v2 .hs-up__tab[aria-selected="true"] { background: var(--surface); color: var(--ink); box-shadow: var(--shadow-1); }
.v2 .hs-up__panel { display: flex; flex-direction: column; gap: var(--sp-2); }
.v2 .hs-up__code { inline-size: 100%; box-sizing: border-box; min-block-size: 200px; resize: vertical; padding: var(--sp-3) var(--sp-4);
  font: 0.875rem/1.55 var(--hs-mono); tab-size: 2; text-align: left;
  background: var(--surface); color: var(--ink); border: 1.5px solid var(--line-strong); border-radius: var(--r-2); }
.v2 .hs-up__code:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: 0; border-color: var(--accent); }
.v2 .hs-up__hint { font-size: var(--fs-1); color: var(--muted); }
.v2 .hs-up__title .c-input { inline-size: 100%; }
.v2 .hs-up__now { font-size: var(--fs-1); }
.v2 .hs-up__actions { display: flex; flex-direction: column; gap: var(--sp-2); align-items: stretch; }
.v2 .hs-up__go { inline-size: 100%; }
.v2 .hs-up__status { font-weight: 600; min-block-size: 1.5em; }
.v2 .hs-up__status.is-error { color: var(--negative); }
.v2 .hs-up__result { display: flex; flex-direction: column; gap: var(--sp-4); padding-block-start: var(--sp-2); }
.v2 .hs-up__result:focus { outline: none; }
.v2 .hs-up__result:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; border-radius: var(--r-2); }

.v2 .hs-drop { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--sp-2); text-align: center;
  padding: var(--sp-6) var(--sp-4); border: 2px dashed var(--line-strong); border-radius: var(--r-2); background: var(--surface);
  transition: border-color var(--dur-2) var(--ease), background-color var(--dur-2) var(--ease); }
.v2 .hs-drop.is-over { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--surface)); }
.v2 .hs-drop__ico { inline-size: 44px; block-size: 44px; color: var(--accent); }
.v2 .hs-drop__title { font-weight: 700; }
.v2 .hs-drop__input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; overflow: hidden; }
.v2 .hs-drop__input:focus-visible + .hs-up__hint, .v2 .hs-drop:focus-within .hs-drop__pick { outline: 3px solid var(--accent); outline-offset: 2px; }
.v2 .hs-drop__pick { cursor: pointer; }
.v2 .hs-drop__name { font-size: var(--fs-1); font-weight: 600; color: var(--ink-2); overflow-wrap: anywhere; }

.v2 .hs-seg { display: inline-flex; border: 1px solid var(--line-strong); border-radius: var(--r-pill); padding: 2px; background: var(--surface); }
.v2 .hs-seg__btn { min-block-size: 32px; min-inline-size: 56px; border: 0; background: transparent; border-radius: var(--r-pill);
  font-size: var(--fs-1); font-weight: 600; color: var(--ink-2); cursor: pointer; padding-inline: var(--sp-3); }
.v2 .hs-seg__btn[aria-pressed="true"] { background: var(--ink); color: var(--paper); }

/* pre-check "flight checklist" */
.v2 .hs-check { border: 1px solid var(--line); border-radius: var(--r-2); background: var(--surface); padding: var(--sp-3) var(--sp-4); }
.v2 .hs-check__h { font-family: var(--font-ui); font-size: var(--fs-1); font-weight: 700; letter-spacing: .02em; color: var(--ink-2); margin-block-end: var(--sp-2); }
.v2 .hs-check__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); font-size: var(--fs-1); }
.v2 .hs-check__it { display: block; padding-inline-start: var(--sp-3); border-inline-start: 3px solid var(--line-strong); color: var(--ink); }
.v2 .hs-check__tag { font-weight: 700; }
.v2 .hs-check__it.is-ok { border-color: var(--positive); }
.v2 .hs-check__it.is-ok .hs-check__tag { color: var(--positive); }
.v2 .hs-check__it.is-tip .hs-check__tag, .v2 .hs-check__it.is-info .hs-check__tag { color: var(--ink-2); }
.v2 .hs-check__it.is-warn { border-color: #D69E2E; }
.v2 .hs-check__it.is-warn .hs-check__tag { color: var(--hs-warn); }
.v2 .hs-check__it.is-stop { border-color: var(--negative); }
.v2 .hs-check__it.is-stop .hs-check__tag { color: var(--negative); }

/* preview */
.v2 .hs-prev { display: flex; flex-direction: column; gap: var(--sp-2); }
.v2 .hs-prev__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); flex-wrap: wrap; }
.v2 .hs-prev__h { font-family: var(--font-ui); font-size: var(--fs-1); font-weight: 700; color: var(--ink-2); }
.v2 .hs-prev__frame { border: 1px solid var(--line-strong); border-radius: var(--r-2); overflow: hidden; background: #fff;
  block-size: min(62vh, 520px); transition: inline-size var(--dur-3) var(--ease); margin-inline: auto; inline-size: 100%; }
.v2 .hs-prev__frame.is-mobile { inline-size: min(100%, 390px); block-size: min(70vh, 640px); border-radius: 22px; border-width: 6px; border-color: var(--ink); }
.v2 .hs-prev__iframe { display: block; inline-size: 100%; block-size: 100%; border: 0; background: #fff; }

/* consent */
.v2 .hs-consent { display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-4); border-radius: var(--r-2);
  background: var(--surface-2); border: 1px solid var(--line); }
.v2 .hs-consent__rules summary { cursor: pointer; font-weight: 700; min-block-size: 32px; display: flex; align-items: center; }
.v2 .hs-consent__rules ul { margin: var(--sp-2) 0 0; padding-inline-start: 1.2em; display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-1); color: var(--ink-2); }
.v2 .hs-consent__box { font-size: var(--fs-1); color: var(--ink); line-height: 1.55; }
.v2 .hs-consent__box a { color: var(--accent); }
.v2 .hs-consent__note { font-size: .8125rem; color: var(--muted); }
.v2 .hs-consent__note a { color: inherit; }

/* scan result */
.v2 .hs-scan { border-radius: var(--r-2); padding: var(--sp-4); border: 1px solid var(--line); background: var(--surface);
  display: flex; flex-direction: column; gap: var(--sp-2); border-inline-start-width: 5px; }
.v2 .hs-scan.is-ok { border-inline-start-color: var(--positive); }
.v2 .hs-scan.is-warn { border-inline-start-color: #D69E2E; background: var(--hs-warn-bg); }
.v2 .hs-scan.is-blocked { border-inline-start-color: var(--negative); background: var(--hs-bad-bg); }
.v2 .hs-scan__head { display: flex; align-items: center; gap: var(--sp-2); font-size: var(--fs-3); }
.v2 .hs-scan__icon { inline-size: 28px; block-size: 28px; border-radius: 50%; display: inline-grid; place-items: center; font-weight: 800;
  font-size: .95rem; color: var(--on-accent); background: var(--ink-2); flex: none; }
.v2 .hs-scan.is-ok .hs-scan__icon { background: var(--positive); }
.v2 .hs-scan.is-warn .hs-scan__icon { background: var(--hs-warn); }
.v2 .hs-scan.is-blocked .hs-scan__icon { background: var(--negative); }
.v2 .hs-scan__text { color: var(--ink-2); }
.v2 .hs-scan__list { margin: 0; padding-inline-start: 1.2em; display: flex; flex-direction: column; gap: var(--sp-2); }
.v2 .hs-scan__sev { font-weight: 700; }
.v2 .hs-scan__detail { display: block; margin-block-start: 4px; font: .8125rem/1.5 var(--hs-mono); color: var(--ink-2); overflow-wrap: anywhere; text-align: left; }
.v2 .hs-scan__ai { font-size: var(--fs-1); color: var(--ink-2); }
.v2 .hs-appeal { display: flex; flex-direction: column; gap: var(--sp-2); align-items: flex-start; }
.v2 .hs-appeal__ta { inline-size: 100%; min-block-size: 80px; padding: var(--sp-2) var(--sp-3); }
.v2 .hs-appeal__msg { font-size: var(--fs-1); font-weight: 600; }

/* result "boarding pass" */
.v2 .hs-ticket { position: relative; padding: var(--sp-5); border-radius: var(--r-2); background: var(--surface);
  border: 1.5px solid var(--ink); box-shadow: 6px 6px 0 var(--accent); display: flex; flex-direction: column; gap: var(--sp-3); }
.v2 .hs-ticket__kicker { font-size: var(--fs-1); font-weight: 800; letter-spacing: .08em; color: var(--accent); }
.v2 .hs-result__h { font-size: var(--fs-5); }
.v2 .hs-result__next { margin: 0; }

/* share */
.v2 .hs-share { display: flex; flex-direction: column; gap: var(--sp-2); }
.v2 .hs-share__input { inline-size: 100%; font: 600 var(--fs-2) var(--hs-mono); text-align: left; }
.v2 .hs-share__btns { --gap: var(--sp-2); }
.v2 .hs-wa { border-color: #25D366; }

/* dialogs */
.v2 .hs-dialog { inline-size: min(760px, calc(100vw - 32px)); max-block-size: calc(100dvh - 32px); padding: 0; border: 1px solid var(--line-strong);
  border-radius: var(--r-2); background: var(--paper); color: var(--ink); box-shadow: var(--shadow-2); overflow: auto; }
.v2 .hs-dialog--sm { inline-size: min(460px, calc(100vw - 32px)); }
.v2 .hs-dialog--lg { inline-size: min(1100px, calc(100vw - 32px)); }
.v2 .hs-dialog::backdrop { background: rgb(27 25 22 / .55); }
.v2 .hs-dialog__head { position: sticky; inset-block-start: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between;
  gap: var(--sp-3); padding: var(--sp-3) var(--sp-5); background: var(--paper); border-block-end: 1px solid var(--line); }
.v2 .hs-dialog__h { font-size: var(--fs-5); }
.v2 .hs-dialog__body { padding: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-4); }
.v2 .hs-dialog__actions { --gap: var(--sp-2); }
.v2 .hs-qr__code { align-self: center; padding: 16px; background: #fff; border-radius: var(--r-2); border: 1px solid var(--line); line-height: 0; }
.v2 .hs-qr__code img, .v2 .hs-qr__code canvas { inline-size: 232px; block-size: 232px; }
.v2 .hs-qr__url { text-align: center; font: 600 var(--fs-1) var(--hs-mono); overflow-wrap: anywhere; }

/* helper */
.v2 .hs-helper { inline-size: min(520px, calc(100vw - 32px)); }
.v2 .hs-helper__log { padding: var(--sp-4) var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-3); max-block-size: 50vh; overflow: auto; }
.v2 .hs-helper__msg { padding: var(--sp-3) var(--sp-4); border-radius: var(--r-2); max-inline-size: 92%; font-size: var(--fs-2); line-height: 1.6; white-space: pre-line; }
.v2 .hs-helper__msg.is-bot { background: var(--surface); border: 1px solid var(--line); align-self: flex-start; }
.v2 .hs-helper__msg.is-me { background: var(--ink); color: var(--paper); align-self: flex-end; }
.v2 .hs-helper__msg a { color: var(--accent); }
.v2 .hs-helper__meta { display: block; margin-block-start: 6px; font-size: .8125rem; color: var(--muted); }
.v2 .hs-helper__more { margin-block-start: var(--sp-2); }
.v2 .hs-helper__form { display: flex; gap: var(--sp-2); padding: 0 var(--sp-5); }
.v2 .hs-helper__form .c-input { flex: 1; min-inline-size: 0; }
.v2 .hs-helper__note { padding: var(--sp-2) var(--sp-5) var(--sp-4); font-size: .8125rem; color: var(--muted); }

/* diff */
.v2 .hs-diffsum { display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-3) var(--sp-4); background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r-2); }
.v2 .hs-diffsum__list { margin: 0; padding-inline-start: 1.3em; font-size: var(--fs-1); display: flex; flex-direction: column; gap: 4px; }
.v2 .hs-diffsum__list a { color: var(--accent); }
.v2 .hs-diff { font: .8125rem/1.55 var(--hs-mono); text-align: left; border: 1px solid var(--line-strong); border-radius: var(--r-2);
  background: var(--surface); max-block-size: 60vh; overflow: auto; }
.v2 .hs-diff__ln { display: grid; grid-template-columns: 3.2em 3.2em 1.6em 1fr; align-items: start; border-block-end: 1px solid color-mix(in srgb, var(--line) 60%, transparent); scroll-margin-block-start: 80px; }
.v2 .hs-diff__no { color: var(--muted); text-align: right; padding-inline: 6px; user-select: none; font-size: .75rem; }
.v2 .hs-diff__mk { text-align: center; font-weight: 800; user-select: none; }
.v2 .hs-diff__code { white-space: pre-wrap; overflow-wrap: anywhere; padding-inline-end: 8px; text-decoration: none; color: var(--ink); }
.v2 .hs-diff__ln.is-add { background: color-mix(in srgb, var(--positive) 14%, var(--surface)); }
.v2 .hs-diff__ln.is-add .hs-diff__mk { color: var(--positive); }
.v2 .hs-diff__ln.is-del { background: color-mix(in srgb, var(--negative) 13%, var(--surface)); }
.v2 .hs-diff__ln.is-del .hs-diff__mk { color: var(--negative); }
.v2 .hs-diff__ln.is-del .hs-diff__code { text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--negative) 55%, transparent); }
.v2 .hs-diff__skip { padding: 4px 12px; color: var(--muted); background: var(--surface-2); font-family: var(--font-ui); font-size: var(--fs-1); direction: rtl; text-align: right; }

/* sparkline */
.v2 .hs-spark { display: block; overflow: visible; }
.v2 .hs-spark__line { fill: none; stroke: var(--accent); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.v2 .hs-spark__area { fill: color-mix(in srgb, var(--accent) 14%, transparent); stroke: none; }

/* ================================================================ dashboard */
.v2 .hs-app { padding-block: var(--sp-6) var(--sp-9); }
.v2 .hs-app__top { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--sp-4); margin-block: var(--sp-3) var(--sp-5); }
.v2 .hs-app__h1 { font-size: var(--fs-7); }
.v2 .hs-app__sub { color: var(--ink-2); margin-block-start: var(--sp-1); }
.v2 .hs-app__tools { --gap: var(--sp-2); }
.v2 .hs-meters { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); margin-block-end: var(--sp-6); }
.v2 .hs-meter { padding: var(--sp-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); display: flex; flex-direction: column; gap: 6px; }
.v2 .hs-meter__label { font-size: var(--fs-1); color: var(--ink-2); font-weight: 600; }
.v2 .hs-meter__val { font-family: var(--font-display); font-size: var(--fs-6); font-weight: 700; line-height: 1.1; }
.v2 .hs-meter__val small { font-family: var(--font-ui); font-size: var(--fs-1); color: var(--muted); font-weight: 500; }
.v2 .hs-meter meter, .v2 .hs-credits meter { inline-size: 100%; block-size: 10px; }
.v2 meter.hs-bar { appearance: none; -webkit-appearance: none; background: var(--surface-2); border-radius: var(--r-pill); border: 0; }
.v2 meter.hs-bar::-webkit-meter-bar { background: var(--surface-2); border-radius: var(--r-pill); border: 0; block-size: 10px; }
.v2 meter.hs-bar::-webkit-meter-optimum-value, .v2 meter.hs-bar::-webkit-meter-suboptimum-value { background: var(--accent); border-radius: var(--r-pill); }
.v2 meter.hs-bar::-webkit-meter-even-less-good-value { background: var(--negative); border-radius: var(--r-pill); }
.v2 meter.hs-bar::-moz-meter-bar { background: var(--accent); border-radius: var(--r-pill); }
.v2 .hs-meter__note { font-size: var(--fs-1); color: var(--muted); }

.v2 .hs-empty { text-align: center; padding: var(--sp-8) var(--sp-4); border: 2px dashed var(--line-strong); border-radius: var(--r-2); display: flex; flex-direction: column; align-items: center; gap: var(--sp-3); }
.v2 .hs-empty h2 { font-size: var(--fs-6); }

/* project list */
.v2 .hs-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
.v2 .hs-card { position: relative; display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-5); background: var(--surface);
  border: 1px solid var(--line); border-radius: var(--r-2); transition: border-color var(--dur-2) var(--ease), box-shadow var(--dur-2) var(--ease); }
.v2 .hs-card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-1); }
.v2 .hs-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-3); }
.v2 .hs-card__title { font-size: var(--fs-4); overflow-wrap: anywhere; }
.v2 .hs-card__title a { text-decoration: none; }
.v2 .hs-card__title a:hover { text-decoration: underline; }
.v2 .hs-card__url { font: 600 var(--fs-1) var(--hs-mono); color: var(--ink-2); overflow-wrap: anywhere; text-align: left; }
.v2 .hs-card__stats { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-3); }
.v2 .hs-card__num { font-family: var(--font-display); font-size: var(--fs-5); font-weight: 700; line-height: 1; }
.v2 .hs-card__num small { display: block; font-family: var(--font-ui); font-size: .8125rem; font-weight: 500; color: var(--muted); margin-block-start: 4px; }
.v2 .hs-card__acts { --gap: var(--sp-2); border-block-start: 1px solid var(--line); padding-block-start: var(--sp-3); }
.v2 .hs-card__meta { font-size: .8125rem; color: var(--muted); }

/* project page */
.v2 .hs-proj__head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: var(--sp-4); margin-block: var(--sp-3) var(--sp-5); }
.v2 .hs-proj__title { font-size: var(--fs-7); overflow-wrap: anywhere; }
.v2 .hs-proj__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-3); margin-block-start: var(--sp-2); color: var(--ink-2); font-size: var(--fs-1); }
.v2 .hs-proj__share { margin-block-end: var(--sp-5); padding: var(--sp-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); }
.v2 .hs-back { display: inline-flex; align-items: center; gap: 6px; min-block-size: 32px; font-size: var(--fs-1); color: var(--ink-2); text-decoration: none; }
.v2 .hs-back:hover { color: var(--accent); }

.v2 .hs-tabs { display: flex; gap: var(--sp-1); overflow-x: auto; border-block-end: 1px solid var(--line); margin-block-end: var(--sp-5); scrollbar-width: thin; }
.v2 .hs-tabs__tab { flex: none; min-block-size: 48px; padding-inline: var(--sp-4); border: 0; border-block-end: 3px solid transparent; background: none;
  font-weight: 600; color: var(--ink-2); cursor: pointer; white-space: nowrap; }
.v2 .hs-tabs__tab:hover { color: var(--ink); }
.v2 .hs-tabs__tab[aria-selected="true"] { color: var(--ink); border-block-end-color: var(--accent); font-weight: 700; }
.v2 .hs-tabs__tab.is-danger[aria-selected="true"] { border-block-end-color: var(--negative); }
.v2 .hs-panel { display: flex; flex-direction: column; gap: var(--sp-5); }
.v2 .hs-panel:focus { outline: none; }
.v2 .hs-panel__h { font-size: var(--fs-5); }
.v2 .hs-box { padding: var(--sp-5); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); display: flex; flex-direction: column; gap: var(--sp-4); }
.v2 .hs-box__h { font-size: var(--fs-4); font-family: var(--font-ui); font-weight: 700; }
.v2 .hs-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-3); }
.v2 .hs-note { font-size: var(--fs-1); color: var(--muted); }
.v2 .hs-status { font-weight: 600; min-block-size: 1.4em; }
.v2 .hs-status.is-error { color: var(--negative); }
.v2 .hs-status.is-ok { color: var(--positive); }

/* insights */
.v2 .hs-kpis { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); }
.v2 .hs-kpi { padding: var(--sp-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); }
.v2 .hs-kpi__label { font-size: var(--fs-1); color: var(--ink-2); }
.v2 .hs-kpi__val { font-family: var(--font-display); font-size: var(--fs-6); font-weight: 700; line-height: 1.15; }
.v2 .hs-kpi__delta { font-size: .8125rem; color: var(--muted); }
.v2 .hs-kpi__delta.is-up { color: var(--positive); }
.v2 .hs-kpi__delta.is-down { color: var(--negative); }
.v2 .hs-insight { padding: var(--sp-4) var(--sp-5); border-radius: var(--r-2); background: var(--surface-2); border-inline-start: 4px solid var(--accent); font-size: var(--fs-3); line-height: 1.6; }
.v2 .hs-chart { position: relative; }
.v2 .hs-chart svg { display: block; inline-size: 100%; block-size: auto; overflow: visible; }
.v2 .hs-chart__grid { stroke: var(--line); stroke-width: 1; }
.v2 .hs-chart__axis { fill: var(--muted); font: 11px var(--font-ui); }
.v2 .hs-chart__bar { fill: var(--accent); }
.v2 .hs-chart__hit { fill: transparent; cursor: default; }
.v2 .hs-chart__hit:hover + .hs-chart__bar, .v2 .hs-chart__bar.is-on { fill: var(--accent-hover); }
.v2 .hs-tip { position: absolute; z-index: 5; pointer-events: none; padding: 6px 10px; border-radius: var(--r-1); background: var(--ink); color: var(--paper);
  font-size: var(--fs-1); white-space: nowrap; transform: translate(50%, -110%); box-shadow: var(--shadow-2); }
.v2 .hs-tip[hidden] { display: none; }
.v2 .hs-bars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-3); }
.v2 .hs-bars li { display: grid; grid-template-columns: minmax(90px, 30%) 1fr auto; align-items: center; gap: var(--sp-3); font-size: var(--fs-1); }
.v2 .hs-bars__track { block-size: 10px; background: var(--surface-2); border-radius: var(--r-pill); overflow: hidden; }
.v2 .hs-bars__fill { display: block; block-size: 100%; background: var(--accent); border-radius: var(--r-pill); min-inline-size: 4px; }
.v2 .hs-bars__n { font-variant-numeric: tabular-nums; font-weight: 700; }
.v2 .hs-grid2 { display: grid; gap: var(--sp-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.v2 .hs-table { inline-size: 100%; border-collapse: collapse; font-size: var(--fs-1); }
.v2 .hs-table th, .v2 .hs-table td { text-align: start; padding: 6px 8px; border-block-end: 1px solid var(--line); }
.v2 .hs-table th { color: var(--ink-2); font-weight: 600; }
.v2 .hs-table td.n { font-variant-numeric: tabular-nums; }
.v2 .hs-tablewrap { overflow-x: auto; }
.v2 details.hs-more > summary { cursor: pointer; font-weight: 600; min-block-size: 32px; display: inline-flex; align-items: center; color: var(--accent); }

/* versions */
.v2 .hs-vers { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.v2 .hs-ver { position: relative; display: grid; grid-template-columns: auto 1fr; gap: var(--sp-2) var(--sp-4); padding: var(--sp-4) 0; border-block-end: 1px solid var(--line); }
.v2 .hs-ver__no { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-5); inline-size: 3.2rem; text-align: center; line-height: 1.2; color: var(--ink-2); }
.v2 .hs-ver.is-live .hs-ver__no { color: var(--positive); }
.v2 .hs-ver__main { display: flex; flex-direction: column; gap: var(--sp-2); min-inline-size: 0; }
.v2 .hs-ver__line { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; }
.v2 .hs-ver__note { overflow-wrap: anywhere; }
.v2 .hs-ver__meta { font-size: .8125rem; color: var(--muted); }
.v2 .hs-ver__acts { --gap: var(--sp-2); }
.v2 .hs-cmp { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--sp-3); }
.v2 .hs-cmp .c-field { min-inline-size: 150px; }
.v2 .hs-select { min-block-size: 44px; padding-inline: var(--sp-3); border: 1.5px solid var(--line-strong); border-radius: var(--r-2); background: var(--surface); color: var(--ink); }

/* settings */
.v2 .hs-form { display: flex; flex-direction: column; gap: var(--sp-4); max-inline-size: 640px; }
.v2 .hs-form .c-input { inline-size: 100%; }
.v2 .hs-form textarea.c-input { padding-block: var(--sp-3); resize: vertical; }
.v2 .hs-slug { display: flex; align-items: stretch; direction: ltr; border: 1.5px solid var(--line-strong); border-radius: var(--r-2); overflow: hidden; background: var(--surface); }
.v2 .hs-slug:focus-within { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); border-color: var(--accent); }
.v2 .hs-slug__pre { display: flex; align-items: center; padding-inline: var(--sp-3); background: var(--surface-2); color: var(--ink-2); font: var(--fs-1) var(--hs-mono); white-space: nowrap; }
.v2 .hs-slug input { flex: 1; min-inline-size: 0; border: 0; padding-inline: var(--sp-3); min-block-size: 48px; font: var(--fs-2) var(--hs-mono); background: transparent; color: var(--ink); }
.v2 .hs-slug input:focus-visible { outline: none; }
.v2 .hs-radios { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--sp-2); }
.v2 .hs-radios legend { font-weight: 700; margin-block-end: var(--sp-2); font-size: var(--fs-1); }
.v2 .hs-radio { display: grid; grid-template-columns: auto 1fr; gap: 2px var(--sp-3); padding: var(--sp-3) var(--sp-4); border: 1.5px solid var(--line); border-radius: var(--r-2); background: var(--surface); cursor: pointer; }
.v2 .hs-radio:has(input:checked) { border-color: var(--accent); }
.v2 .hs-radio input { grid-row: span 2; inline-size: 20px; block-size: 20px; margin: 3px 0 0; accent-color: var(--accent); }
.v2 .hs-radio small { color: var(--muted); font-size: var(--fs-1); }
.v2 .hs-pw { display: flex; gap: var(--sp-2); }
.v2 .hs-pw .c-input { flex: 1; }
.v2 .hs-lock { font-size: var(--fs-1); color: var(--ink-2); background: var(--surface-2); border-radius: var(--r-1); padding: var(--sp-2) var(--sp-3); }
.v2 .hs-lock a { color: var(--accent); }

/* AI */
.v2 .hs-credits { display: flex; flex-direction: column; gap: 6px; }
.v2 .hs-credits .hs-meter { border: 0; padding: 0; background: none; }
.v2 .hs-credits__row { display: flex; justify-content: space-between; gap: var(--sp-3); font-size: var(--fs-1); }
.v2 .hs-aigrid { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.v2 .hs-aibtn { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: start; padding: var(--sp-4); min-block-size: 96px;
  background: var(--surface); border: 1.5px solid var(--line); border-radius: var(--r-2); cursor: pointer; color: var(--ink); }
.v2 .hs-aibtn:hover:not(:disabled) { border-color: var(--accent); }
.v2 .hs-aibtn:disabled { opacity: .55; cursor: not-allowed; }
.v2 .hs-aibtn strong { font-size: var(--fs-2); }
.v2 .hs-aibtn span { font-size: var(--fs-1); color: var(--ink-2); }
.v2 .hs-aibtn em { font-style: normal; font-size: .8125rem; font-weight: 700; color: var(--accent); }
.v2 .hs-ask textarea { inline-size: 100%; min-block-size: 110px; padding: var(--sp-3) var(--sp-4); resize: vertical; }
.v2 .hs-resp { padding: var(--sp-3) var(--sp-4); border-radius: var(--r-2); background: var(--hs-warn-bg); border: 1px solid #D69E2E; font-size: var(--fs-1); }
.v2 .hs-resp strong { display: block; }
.v2 .hs-propsum { padding: var(--sp-3) var(--sp-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-2); white-space: pre-line; }

/* leads */
.v2 .hs-upsell { padding: var(--sp-5); border-radius: var(--r-2); background: var(--surface-2); display: flex; flex-direction: column; gap: var(--sp-3); align-items: flex-start; }

/* danger zone */
.v2 .hs-danger { border: 1.5px solid var(--negative); border-radius: var(--r-2); padding: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-3); background: var(--hs-bad-bg); }
.v2 .hs-danger h3 { color: var(--negative); font-family: var(--font-ui); font-size: var(--fs-4); }

.v2 .hs-skel { block-size: 160px; border-radius: var(--r-2); background: linear-gradient(90deg, var(--surface-2), var(--surface), var(--surface-2)); background-size: 200% 100%; animation: hs-skel 1.4s linear infinite; }
@keyframes hs-skel { to { background-position: -200% 0; } }

@media (max-width: 640px) {
  .v2 .hs-card { padding: var(--sp-4); }
  .v2 .hs-dialog__body { padding: var(--sp-4); }
  .v2 .hs-helper__form { padding: 0 var(--sp-4); }
  .v2 .hs-bars li { grid-template-columns: minmax(80px, 34%) 1fr auto; }
  .v2 .hs-diff__ln { grid-template-columns: 2.6em 2.6em 1.3em 1fr; }
}
@media (forced-colors: active) {
  .v2 .hs-chart__bar, .v2 .hs-bars__fill, .v2 .hs-spark__line { fill: CanvasText; stroke: CanvasText; background: CanvasText; }
  .v2 .hs-diff__ln.is-add, .v2 .hs-diff__ln.is-del { border-inline-start: 3px solid CanvasText; }
}