.cvb-page {
  --cvb-accent: var(--praca-coral, #f56a4f);
  --cvb-accent-dark: var(--praca-coral-hover, #c74831);
  --cvb-accent-soft: var(--praca-coral-soft, #fff0ec);
  --cvb-ink: var(--ink, #23242a);
  --cvb-text: var(--text, var(--ink, #393b43));
  --cvb-muted: var(--muted, #6e717c);
  --cvb-line: var(--line, #e5e6eb);
  --cvb-line-strong: #d6d8df;
  --cvb-surface: var(--surface, #fff);
  --cvb-surface-2: var(--surface-2, #f8f8fa);
  --cvb-success: #2f8b5b;
  --cvb-success-soft: #eaf7ef;
  width: min(1240px, calc(100% - 40px));
  margin: 0 auto;
  padding: 28px 0 56px;
  color: var(--cvb-text);
}

.cvb-page button,
.cvb-page input,
.cvb-page select,
.cvb-page textarea { font: inherit; }

.cvb-page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
}

.cvb-eyebrow,
.cvb-step-label {
  margin: 0 0 7px;
  color: var(--cvb-accent-dark);
  font-family: var(--praca-heading);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.cvb-page-head h1 {
  margin: 0;
  color: var(--cvb-ink);
  font: 900 clamp(29px, 3vw, 42px)/1.05 var(--praca-heading);
  letter-spacing: -.045em;
}

.cvb-page-head p:last-child {
  max-width: 760px;
  margin: 9px 0 0;
  color: var(--cvb-muted);
  font-size: 14px;
  line-height: 1.55;
}

.cvb-save-state {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 13px;
  border: 1px solid #cfe8d8;
  border-radius: 12px;
  background: var(--cvb-success-soft);
  color: var(--cvb-success);
  font-size: 12px;
  font-weight: 800;
}

.cvb-save-state::before {
  content: "✓";
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--cvb-success);
  color: #fff;
}

.cvb-progress {
  margin: 0 0 18px;
  padding: 17px 22px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  border: 1px solid var(--cvb-line);
  border-radius: 18px;
  background: var(--cvb-surface);
  box-shadow: 0 8px 24px rgba(38, 41, 52, .04);
}

.cvb-progress-step {
  min-width: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 10px;
  position: relative;
  border: 0;
  background: transparent;
  color: var(--cvb-muted);
  text-align: left;
}

.cvb-progress-step:not(:last-child)::after {
  content: "";
  height: 2px;
  position: absolute;
  left: 45px;
  right: -4px;
  bottom: -6px;
  border-radius: 99px;
  background: var(--cvb-line);
}

.cvb-progress-step.done::after,
.cvb-progress-step.active::after { background: var(--cvb-accent); }

.cvb-progress-number {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid var(--cvb-line-strong);
  border-radius: 50%;
  background: var(--cvb-surface-2);
  color: var(--cvb-muted);
  font-size: 12px;
  font-weight: 900;
}

.cvb-progress-step.done .cvb-progress-number,
.cvb-progress-step.active .cvb-progress-number {
  border-color: var(--cvb-accent);
  background: var(--cvb-accent);
  color: #fff;
}

.cvb-progress-copy strong { display: block; color: var(--cvb-ink); font-size: 13px; }
.cvb-progress-copy span { font-size: 11px; }

.cvb-guest-note,
.cvb-status {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid var(--cvb-line);
  border-radius: 12px;
  background: var(--cvb-surface);
  font-size: 12px;
  line-height: 1.5;
}

.cvb-status.error { border-color: #f3b4a8; background: #fff0ef; color: #9d2f24; }
.cvb-status.success { border-color: #b7dfc8; background: var(--cvb-success-soft); color: #176a47; }
.cvb-status:focus { outline: 3px solid color-mix(in srgb, var(--cvb-accent) 22%, transparent); }

.cvb-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 370px;
  align-items: start;
  gap: 18px;
}

.cvb-form,
.cvb-preview {
  min-width: 0;
  border: 1px solid var(--cvb-line);
  border-radius: 22px;
  background: var(--cvb-surface);
  box-shadow: 0 18px 48px rgba(38, 41, 52, .09);
}

.cvb-form { padding: 26px; }
.cvb-panel[hidden] { display: none; }
.cvb-panel.active { animation: cvb-panel-in .18s ease-out; }

@keyframes cvb-panel-in {
  from { transform: translateY(5px); opacity: .45; }
  to { transform: translateY(0); opacity: 1; }
}

.cvb-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.cvb-section-head h2 {
  margin: 0;
  color: var(--cvb-ink);
  font: 900 clamp(22px, 3vw, 26px)/1.15 var(--praca-heading);
  letter-spacing: -.035em;
}

.cvb-section-head p:last-child {
  margin: 7px 0 0;
  color: var(--cvb-muted);
  font-size: 13px;
  line-height: 1.5;
}

.cvb-duration {
  flex: 0 0 auto;
  padding: 8px 11px;
  border-radius: 999px;
  background: var(--cvb-surface-2);
  color: var(--cvb-muted);
  font-size: 11px;
  font-weight: 800;
}

.cvb-identity,
.cvb-helper,
.cvb-phone,
.cvb-consent,
.cvb-success {
  margin-top: 18px;
  padding: 15px;
  border: 1px solid var(--cvb-line);
  border-radius: 15px;
  background: var(--cvb-surface-2);
}

.cvb-identity {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
}

.cvb-identity-avatar,
.cvb-avatar {
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: linear-gradient(135deg, #ffd9d0, #fff2ee);
  color: var(--cvb-accent-dark);
  font-family: var(--praca-heading);
  font-weight: 900;
}

.cvb-identity-avatar { width: 42px; height: 42px; }
.cvb-identity-copy strong { display: block; color: var(--cvb-ink); font-size: 13px; }
.cvb-identity-copy span { display: block; margin-top: 2px; color: var(--cvb-muted); font-size: 10px; }

.cvb-source {
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--cvb-success-soft);
  color: var(--cvb-success);
  font-size: 9px;
  font-weight: 900;
  white-space: nowrap;
}

.cvb-source.imported { background: #eaf3ff; color: #286ba8; }
.cvb-source.draft { background: #fff3d8; color: #8b6513; }
.cvb-source.private { background: var(--cvb-surface); color: var(--cvb-muted); box-shadow: inset 0 0 0 1px var(--cvb-line); }

.cvb-section {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--cvb-line);
}

.cvb-block-title { margin: 0 0 5px; color: var(--cvb-ink); font-size: 13px; font-weight: 900; }
.cvb-block-note { margin: 0 0 12px; color: var(--cvb-muted); font-size: 11px; line-height: 1.45; }

.cvb-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cvb-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cvb-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cvb-field { min-width: 0; }
.cvb-field.full { grid-column: 1 / -1; }
.cvb-field > span { display: block; margin: 0 0 6px; color: var(--cvb-ink); font-size: 11px; font-weight: 800; }
.cvb-field > span .cvb-optional { margin-left: 4px; color: var(--cvb-muted); font-size: 9px; font-weight: 700; }
.cvb-field > span .cvb-important { margin-left: 4px; color: var(--cvb-accent); font-size: 9px; font-weight: 800; }

.cvb-control {
  width: 100%;
  min-height: 46px;
  padding: 10px 13px;
  border: 1px solid var(--cvb-line-strong);
  border-radius: 12px;
  outline: 0;
  background: var(--cvb-surface);
  color: var(--cvb-ink);
  font-size: 13px;
}

textarea.cvb-control { min-height: 96px; resize: vertical; }
.cvb-control:focus { border-color: var(--cvb-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cvb-accent) 12%, transparent); }
.cvb-control.invalid,
.cvb-field.invalid .cvb-control { border-color: #d84b3d; box-shadow: 0 0 0 3px rgba(216, 75, 61, .12); }
.cvb-field-note { margin-top: 5px; color: var(--cvb-muted); font-size: 10px; line-height: 1.4; }
.cvb-field-error { min-height: 15px; margin-top: 4px; color: #b53b31; font-size: 10px; font-weight: 700; }

.cvb-choice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.cvb-choice,
.cvb-check-chip {
  position: relative;
  min-width: 0;
}

.cvb-choice input,
.cvb-check-chip input { position: absolute; opacity: 0; pointer-events: none; }

.cvb-choice span,
.cvb-check-chip span {
  min-height: 46px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  border: 1px solid var(--cvb-line);
  border-radius: 12px;
  background: var(--cvb-surface-2);
  color: var(--cvb-muted);
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}

.cvb-choice span { min-height: 64px; display: block; }
.cvb-choice span strong { display: block; color: var(--cvb-ink); font-size: 12px; }
.cvb-choice span small { display: block; margin-top: 3px; font-size: 9px; line-height: 1.35; }
.cvb-choice input:checked + span,
.cvb-check-chip input:checked + span { border-color: var(--cvb-accent); background: var(--cvb-accent-soft); color: var(--cvb-accent-dark); box-shadow: 0 0 0 2px color-mix(in srgb, var(--cvb-accent) 10%, transparent); }
.cvb-choice input:focus-visible + span,
.cvb-check-chip input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--cvb-accent) 22%, transparent); }

.cvb-chip-row { display: flex; flex-wrap: wrap; gap: 7px; }
.cvb-check-chip span { min-height: 36px; border-radius: 999px; background: var(--cvb-surface); }
.cvb-role-suggestion {
  min-height: 36px;
  padding: 7px 12px;
  border: 1px solid var(--cvb-line);
  border-radius: 999px;
  background: var(--cvb-surface);
  color: var(--cvb-muted);
  font-size: 11px;
  font-weight: 800;
  text-align: left;
}
.cvb-role-suggestion strong { display: block; color: inherit; font-size: 11px; }
.cvb-role-suggestion small { display: block; margin-bottom: 2px; color: var(--cvb-muted); font-size: 8px; font-weight: 750; }
.cvb-role-suggestion.correction { border-color: color-mix(in srgb, var(--cvb-accent) 50%, var(--cvb-line)); background: var(--cvb-accent-soft); }
.cvb-role-suggestion.active { border-color: var(--cvb-accent); background: var(--cvb-accent-soft); color: var(--cvb-accent-dark); }
.cvb-role-suggestion:hover { border-color: color-mix(in srgb, var(--cvb-accent) 55%, var(--cvb-line)); color: var(--cvb-ink); }
.cvb-check-chip.recommended span {
  border-color: color-mix(in srgb, var(--cvb-accent) 62%, var(--cvb-line));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--cvb-accent) 8%, transparent);
}
.cvb-check-chip.recommended span::after {
  content: "Рекомендовано перевірити";
  margin-left: 7px;
  color: var(--cvb-accent-dark);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.cvb-role-credentials { margin-top: 12px; }

.cvb-modes { margin: 20px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.cvb-mode {
  min-height: 68px;
  padding: 10px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--cvb-line);
  border-radius: 14px;
  background: var(--cvb-surface-2);
  color: var(--cvb-text);
  text-align: left;
}
.cvb-mode.active { border-color: var(--cvb-accent); background: var(--cvb-accent-soft); }
.cvb-mode-icon { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 10px; background: var(--cvb-surface); }
.cvb-mode strong { display: block; color: var(--cvb-ink); font-size: 12px; }
.cvb-mode small { display: block; margin-top: 2px; color: var(--cvb-muted); font-size: 9px; }

.cvb-goal {
  padding: 13px 15px;
  display: flex;
  align-items: center;
  gap: 11px;
  border: 1px solid #ffd6cc;
  border-radius: 14px;
  background: color-mix(in srgb, var(--cvb-accent) 6%, var(--cvb-surface));
}
.cvb-goal-icon { width: 36px; height: 36px; display: grid; place-items: center; flex: 0 0 36px; border-radius: 11px; background: var(--cvb-accent); color: #fff; }
.cvb-goal-copy { min-width: 0; }
.cvb-goal-copy small { display: block; color: var(--cvb-muted); font-size: 10px; }
.cvb-goal-copy strong { display: block; overflow: hidden; color: var(--cvb-ink); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }

.cvb-text-action {
  margin-left: auto;
  padding: 6px;
  border: 0;
  background: transparent;
  color: var(--cvb-accent-dark);
  font-size: 10px;
  font-weight: 800;
}

.cvb-experience-choice {
  margin: 18px 0 14px;
  padding: 4px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  border-radius: 13px;
  background: var(--cvb-surface-2);
}
.cvb-experience-choice label { position: relative; }
.cvb-experience-choice input { position: absolute; opacity: 0; }
.cvb-experience-choice span { min-height: 42px; display: grid; place-items: center; border-radius: 10px; color: var(--cvb-muted); font-size: 12px; font-weight: 800; cursor: pointer; }
.cvb-experience-choice input:checked + span { background: var(--cvb-surface); color: var(--cvb-ink); box-shadow: 0 3px 12px rgba(30, 32, 42, .08); }

.cvb-smart {
  margin-top: 16px;
  padding: 16px;
  border: 1px dashed #f0aa9b;
  border-radius: 15px;
  background: color-mix(in srgb, var(--cvb-accent) 5%, var(--cvb-surface));
}
.cvb-smart-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cvb-smart-head strong { color: var(--cvb-ink); font-size: 13px; }
.cvb-smart-head span { color: var(--cvb-accent-dark); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.cvb-smart p { margin: 5px 0 11px; color: var(--cvb-muted); font-size: 11px; line-height: 1.45; }

.cvb-dropzone,
.cvb-voice {
  margin-top: 16px;
  padding: 25px 18px;
  border: 1px dashed var(--cvb-line-strong);
  border-radius: 15px;
  background: var(--cvb-surface-2);
  text-align: center;
}
.cvb-dropzone strong,
.cvb-voice strong { display: block; color: var(--cvb-ink); font-size: 13px; }
.cvb-dropzone p,
.cvb-voice p { max-width: 560px; margin: 6px auto 12px; color: var(--cvb-muted); font-size: 11px; line-height: 1.5; }
.cvb-record { width: 54px; height: 54px; margin-bottom: 10px; border: 0; border-radius: 50%; background: var(--cvb-accent); color: #fff; font-size: 20px; }

.cvb-secondary,
.cvb-primary,
.cvb-back,
.cvb-preview-toggle {
  align-items: center;
  cursor: pointer;
  display: inline-flex;
  justify-content: center;
  min-height: 44px;
  padding: 9px 16px;
  border: 1px solid var(--cvb-line);
  border-radius: 12px;
  background: var(--cvb-surface);
  color: var(--cvb-ink);
  font-weight: 800;
  text-align: center;
  text-decoration: none;
}
.cvb-primary { border-color: var(--cvb-accent); background: var(--cvb-accent); color: #fff; }
.cvb-primary:hover { background: var(--cvb-accent-dark); }
.cvb-secondary:hover,
.cvb-back:hover { border-color: var(--cvb-accent); color: var(--cvb-accent-dark); }

.cvb-language-list,
.cvb-review-list { display: grid; gap: 9px; }
.cvb-language,
.cvb-review-row { padding: 15px; display: grid; align-items: center; gap: 10px; border: 1px solid var(--cvb-line); border-radius: 13px; background: var(--cvb-surface-2); }
.cvb-language { grid-template-columns: 1fr 170px; }
.cvb-review-row { grid-template-columns: minmax(0, 1fr) auto auto; }
.cvb-language strong,
.cvb-review-row strong { color: var(--cvb-ink); font-size: 13px; }
.cvb-language small,
.cvb-review-row small { display: block; margin-top: 3px; color: var(--cvb-muted); font-size: 9px; line-height: 1.35; }
.cvb-review-value { display: block; margin-top: 6px; color: var(--cvb-ink); font-size: 15px; font-weight: 750; line-height: 1.42; overflow-wrap: anywhere; }
.cvb-review-row.needs-review { border-color: #e4b84f; background: color-mix(in srgb, #fff3d8 72%, var(--cvb-surface)); box-shadow: inset 4px 0 0 #e4b84f; }
.cvb-review-row.needs-review .cvb-review-value { color: var(--cvb-ink); }
.cvb-review-alert { margin: 0 0 11px; padding: 12px 14px; display: grid; gap: 4px; border: 1px solid #e4b84f; border-radius: 13px; background: color-mix(in srgb, #fff3d8 72%, var(--cvb-surface)); color: var(--cvb-ink); }
.cvb-review-alert strong { font-size: 13px; }
.cvb-review-alert span { color: var(--cvb-text); font-size: 11px; line-height: 1.45; }

.cvb-photo-options { display: grid; grid-template-columns: 68px minmax(0, 1fr); align-items: center; gap: 12px; }
.cvb-photo-preview { width: 66px; height: 66px; display: grid; place-items: center; overflow: hidden; border-radius: 17px; background: linear-gradient(135deg, #ffd9d0, #fff2ee); color: var(--cvb-accent-dark); font-family: var(--praca-heading); font-size: 18px; font-weight: 900; }
.cvb-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.cvb-photo-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cvb-photo-note { grid-column: 1 / -1; margin: 0; color: var(--cvb-muted); font-size: 10px; line-height: 1.45; }
.cvb-fb-status { grid-column: 1 / -1; margin: 0; color: var(--cvb-muted); font-size: 10px; }
.cvb-fb-status.error { color: #b53b31; }
.cvb-fb-status.success { color: var(--cvb-success); }

.cvb-phone { background: color-mix(in srgb, var(--cvb-accent) 6%, var(--cvb-surface)); border-color: #ffd2c8; }
.cvb-phone-head { display: flex; align-items: flex-start; gap: 10px; }
.cvb-phone-icon { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px; border-radius: 10px; background: var(--cvb-surface); }
.cvb-phone-copy { min-width: 0; }
.cvb-phone-copy strong { display: block; color: var(--cvb-ink); font-size: 12px; }
.cvb-phone-copy p { margin: 4px 0 0; color: var(--cvb-muted); font-size: 10px; line-height: 1.4; }
.cvb-phone-status { margin-left: auto; color: #a24635; font-size: 9px; font-weight: 900; white-space: nowrap; }
.cvb-phone-status.verified { color: var(--cvb-success); }
.cvb-phone-actions { margin-top: 12px; display: grid; grid-template-columns: minmax(180px, 1fr) 150px auto; gap: 8px; }
.cvb-phone-hint { margin: 9px 0 0; color: var(--cvb-text); font-size: 10px; font-weight: 650; line-height: 1.45; }

.cvb-check-row {
  margin-top: 9px;
  padding: 12px;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: start;
  gap: 10px;
  border: 1px solid var(--cvb-line);
  border-radius: 13px;
  background: var(--cvb-surface-2);
}
.cvb-check-row input { width: 19px; height: 19px; margin: 1px 0 0; accent-color: var(--cvb-accent); }
.cvb-check-row strong { display: block; color: var(--cvb-ink); font-size: 11px; }
.cvb-check-row span span { display: block; margin-top: 3px; color: var(--cvb-muted); font-size: 9px; line-height: 1.4; }
.cvb-check-row.invalid { border-color: #d84b3d; }
.cvb-private-control { border-color: color-mix(in srgb, var(--cvb-accent) 25%, var(--cvb-line)); }

.cvb-form-footer {
  position: sticky;
  z-index: 9;
  bottom: 8px;
  margin-top: 22px;
  padding: 12px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--cvb-line);
  border-radius: 14px;
  background: color-mix(in srgb, var(--cvb-surface) 94%, transparent);
  box-shadow: 0 12px 32px rgba(38, 41, 52, .12);
  backdrop-filter: blur(12px);
}
.cvb-footer-help { margin-right: auto; color: var(--cvb-muted); font-size: 10px; }
.cvb-preview-toggle { display: none; }

.cvb-preview { position: sticky; top: 88px; overflow: hidden; }
.cvb-preview-top { padding: 13px 18px; display: flex; justify-content: space-between; border-bottom: 1px solid var(--cvb-line); }
.cvb-preview-top strong { color: var(--cvb-ink); font-size: 13px; }
.cvb-preview-top span { color: var(--cvb-muted); font-size: 10px; }
.cvb-preview-sheet { padding: 22px; }
.cvb-profile-head { display: grid; grid-template-columns: 58px 1fr; align-items: center; gap: 12px; }
.cvb-avatar { width: 58px; height: 58px; overflow: hidden; }
.cvb-avatar img { width: 100%; height: 100%; object-fit: cover; }
.cvb-profile-head h3 { margin: 0; color: var(--cvb-ink); font-size: 17px; }
.cvb-profile-head p { margin: 3px 0; color: var(--cvb-accent-dark); font-size: 12px; font-weight: 800; }
.cvb-profile-head small { color: var(--cvb-muted); font-size: 10px; }
.cvb-legend { margin: 17px 0; padding: 10px; display: grid; gap: 6px; border-radius: 12px; background: var(--cvb-surface-2); color: var(--cvb-muted); font-size: 9px; }
.cvb-legend i { width: 8px; height: 8px; display: inline-block; margin-right: 6px; border-radius: 50%; background: var(--cvb-success); }
.cvb-legend i.imported { background: #3276b5; }
.cvb-legend i.draft { background: #d59b23; }
.cvb-resume-section { padding: 15px 0; border-top: 1px solid var(--cvb-line); }
.cvb-resume-section h4 { margin: 0 0 8px; color: var(--cvb-ink); font-size: 11px; text-transform: uppercase; }
.cvb-resume-section p { margin: 0; color: var(--cvb-muted); font-size: 10px; line-height: 1.5; }
.cvb-mini-chips { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 5px; }
.cvb-mini-chips span { padding: 4px 7px; border-radius: 999px; background: var(--cvb-accent-soft); color: var(--cvb-accent-dark); font-size: 8px; font-weight: 800; }
.cvb-quality { margin-top: 16px; padding: 13px; border-radius: 13px; background: var(--cvb-surface-2); }
.cvb-quality-head { display: flex; justify-content: space-between; color: var(--cvb-ink); font-size: 10px; font-weight: 800; }
.cvb-quality-bar { height: 7px; margin: 8px 0; overflow: hidden; border-radius: 99px; background: var(--cvb-line); }
.cvb-quality-bar i { display: block; width: 35%; height: 100%; border-radius: inherit; background: var(--cvb-accent); transition: width .2s ease; }
.cvb-quality p { margin: 0; color: var(--cvb-muted); font-size: 9px; line-height: 1.45; }
.cvb-privacy { margin: 14px 0 0; color: var(--cvb-muted); font-size: 9px; line-height: 1.45; }

.cvb-success { padding: 42px 24px; text-align: center; }
.cvb-success-icon { width: 66px; height: 66px; margin: 0 auto 16px; display: grid; place-items: center; border-radius: 50%; background: var(--cvb-success); color: #fff; font-size: 30px; }
.cvb-success h2 { margin: 0; color: var(--cvb-ink); font: 900 27px var(--praca-heading); }
.cvb-success p { max-width: 560px; margin: 10px auto 18px; color: var(--cvb-muted); font-size: 12px; line-height: 1.55; }

html[data-theme="dark"] .cvb-page {
  --cvb-accent-soft: #38231f;
  --cvb-text: #d9dbe3;
  --cvb-line-strong: #4a4e5b;
  --cvb-success: #69c894;
  --cvb-success-soft: #183426;
  color-scheme: dark;
}
html[data-theme="dark"] .cvb-save-state { border-color: #315f46; }
html[data-theme="dark"] .cvb-status.error { border-color: #75463c; background: #3b1c1d; color: #ffb0a2; }
html[data-theme="dark"] .cvb-status.success { border-color: #315f46; color: #92e2c4; }
html[data-theme="dark"] .cvb-source.imported { background: #182c43; color: #8bc3f7; }
html[data-theme="dark"] .cvb-source.draft { background: #382d16; color: #efd184; }
html[data-theme="dark"] .cvb-source.private { background: #24262d; color: #c7cad3; }
html[data-theme="dark"] .cvb-review-row.needs-review,
html[data-theme="dark"] .cvb-review-alert { border-color: #8d702c; background: #2d281b; }

@media (max-width: 1000px) {
  .cvb-workspace { grid-template-columns: minmax(0, 1fr) 330px; }
  .cvb-form { padding: 22px; }
}

@media (max-width: 900px) {
  .cvb-page { width: min(100% - 28px, 720px); padding-top: 20px; }
  .cvb-workspace { grid-template-columns: 1fr; }
  .cvb-preview { display: none; }
  .cvb-preview.mobile-open { position: fixed; inset: 74px 14px 14px; z-index: 110; display: block; overflow: auto; }
  .cvb-preview.mobile-open .cvb-preview-top { position: sticky; top: 0; z-index: 2; background: var(--cvb-surface); }
  .cvb-preview-toggle { display: inline-flex; align-items: center; }
}

@media (max-width: 680px) {
  .cvb-page { width: calc(100% - 20px); padding: 14px 0 32px; }
  .cvb-page-head { align-items: flex-start; flex-direction: column; gap: 10px; }
  .cvb-page-head h1 { font-size: 27px; }
  .cvb-save-state { padding: 7px 10px; }
  .cvb-progress { padding: 11px 8px; gap: 3px; }
  .cvb-progress-step { display: flex; flex-direction: column; gap: 5px; text-align: center; }
  .cvb-progress-step:not(:last-child)::after { left: calc(50% + 19px); right: calc(-50% + 19px); top: 16px; bottom: auto; }
  .cvb-progress-copy span { display: none; }
  .cvb-progress-copy strong { font-size: 9px; }
  .cvb-progress-number { width: 31px; height: 31px; }
  .cvb-form { padding: 17px 14px; border-radius: 17px; }
  .cvb-section-head { display: block; }
  .cvb-duration { width: max-content; margin-top: 10px; }
  .cvb-identity { grid-template-columns: 40px minmax(0, 1fr); }
  .cvb-identity .cvb-source { grid-column: 2; justify-self: start; }
  .cvb-grid,
  .cvb-grid.three,
  .cvb-grid.four,
  .cvb-choice-grid,
  .cvb-modes { grid-template-columns: 1fr; }
  .cvb-modes { gap: 7px; }
  .cvb-mode { min-height: 60px; }
  .cvb-language { grid-template-columns: 1fr; }
  .cvb-review-row { grid-template-columns: minmax(0, 1fr) auto; }
  .cvb-review-value { font-size: 16px; line-height: 1.45; }
  .cvb-review-row strong { font-size: 14px; }
  .cvb-source { font-size: 10px; }
  .cvb-review-row .cvb-text-action { grid-column: 1 / -1; margin: 0; justify-self: start; }
  .cvb-phone-actions { grid-template-columns: 1fr; }
  .cvb-form-footer { position: static; align-items: stretch; flex-direction: column-reverse; }
  .cvb-footer-help { margin: 0; text-align: center; }
  .cvb-form-footer button { width: 100%; }
  .cvb-preview-toggle { display: inline-flex; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .cvb-panel.active { animation: none; }
}
