.yl-qualifier {
      --color-accent: #f5c518;
      --color-dark: #1b1e24;
      --color-bg: rgba(27, 30, 36, 0.8);
      --color-white: #ffffff;
      --color-label: #ffffff;
      --color-muted: #ffffff;
      --color-border: rgba(86, 92, 107, 0.4);
      --color-btn: #565c6b;
      --color-btn-disabled-bg: rgba(86, 92, 107, 0.1);
      --color-btn-disabled-text: #565c6b;
      --color-placeholder: rgba(255, 255, 255, 0.4);
      --color-progress-fill: #d9d9d9;
      --color-scale-bg: rgba(86, 92, 107, 0.1);
      --font: "Bricolage Grotesque", system-ui, sans-serif;

      width: 100%;
      max-width: 480px;
      font-family: var(--font);
      font-optical-sizing: auto;
      font-variation-settings: "opsz" 14, "wdth" 100;
      backdrop-filter: blur(75px);
      -webkit-backdrop-filter: blur(75px);
      background: var(--color-bg);
      padding: 36px;
      display: flex;
      flex-direction: column;
      gap: 36px;
      color: var(--color-white);
      --yl-form-height: 720px;
      height: var(--yl-form-height);
      max-height: var(--yl-form-height);
      overflow: hidden;
    }

    .yl-qualifier__header {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }

    .yl-qualifier.is-submitted .yl-qualifier__header {
      align-items: center;
      text-align: center;
      gap: 24px;
    }

    .yl-qualifier.is-submitted .yl-qualifier__badge {
      display: none;
    }

    .yl-qualifier__badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      align-self: flex-start;
      padding: 4px 8px;
      border: 1px solid var(--color-accent);
      border-radius: 4px;
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: var(--color-accent);
    }

    .yl-qualifier__title-block {
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding-top: 8px;
      width: 100%;
    }

    .yl-qualifier.is-submitted .yl-qualifier__title-block {
      padding-top: 0;
      align-items: center;
    }

    .yl-qualifier__title {
      font-size: 24px;
      font-weight: 400;
      line-height: normal;
      margin-bottom: 0 !important;
      margin-top:0 !important;
      color: var(--color-white);
    }

    .yl-qualifier.is-submitted .yl-qualifier__title {
      color: var(--color-accent);
    }

    .yl-qualifier__subtitle {
      font-size: 14px;
      font-weight: 400;
      line-height: 24px;
      margin-bottom: 0 !important;
      margin-top:0 !important;
      color: var(--color-white);
    }

    .yl-qualifier.is-submitted .yl-qualifier__subtitle {
      text-transform: none;
    }

    .yl-qualifier__subtitle-accent {
      color: var(--color-accent);
    }

    .yl-qualifier__progress-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      width: 100%;
      font-size: 14px;
      font-weight: 400;
      line-height: normal;
      white-space: nowrap;
    }

    .yl-qualifier__step-label { color: var(--color-white); }
    .yl-qualifier__step-name { color: var(--color-muted); }

    .yl-qualifier__consent {
      margin: 0;
      font-size: 12px;
      font-weight: 300;
      line-height: 18px;
      color: var(--color-muted);
    }

    .yl-qualifier__consent a {
      color: var(--color-accent);
      text-decoration: underline;
    }

    .yl-qualifier__header,
    .yl-qualifier__progress,
    .yl-qualifier__nav {
      flex-shrink: 0;
    }

    .yl-qualifier__progress {
      display: flex;
      flex-direction: column;
      gap: 8px;
      width: 100%;
    }

    .yl-qualifier__progress-track {
      width: 100%;
      padding: 2px;
      border-radius: 50px;
      background: var(--color-border);
    }

    .yl-qualifier__progress-fill {
      height: 6px;
      border-radius: 50px;
      background: var(--color-progress-fill);
      width: 25%;
      transition: width 0.3s ease;
    }

    .yl-qualifier__hidden { display: none; }

    .yl-qualifier__sr-only {
      border: 0;
      clip: rect(0, 0, 0, 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      white-space: nowrap;
      width: 1px;
    }

    .yl-qualifier__status {
      min-height: 0;
      font-size: 14px;
      line-height: 20px;
      color: var(--color-accent);
      text-align: center;
    }

    .yl-qualifier__status:empty { display: none; }

    .yl-qualifier.is-submitted .yl-qualifier__status { display: none; }

    .yl-qualifier__steps {
      display: flex;
      flex: 1 1 auto;
      flex-direction: column;
      min-height: 0;
      width: 100%;
    }

    .yl-qualifier__step {
      display: none;
      flex-direction: column;
      gap: 24px;
      width: 100%;
    }

    .yl-qualifier__step.is-active {
      display: flex;
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: auto;
    }

    .yl-qualifier__step.is-active > * {
      flex-shrink: 0;
    }

    .yl-qualifier__row {
      display: flex;
      gap: 16px;
      width: 100%;
    }

    .yl-qualifier__row--spaced { gap: 20px; }

    .yl-qualifier__step[data-step="1"].is-active {
      overflow-y: auto;
    }

    .yl-qualifier__row--column {
      flex: 0 0 auto;
      flex-direction: column;
      gap: 8px;
    }

    .yl-qualifier__field {
      display: flex;
      flex: 1 1 0;
      flex-direction: column;
      min-width: 0;
    }

    .yl-qualifier__row--column .yl-qualifier__field {
      flex: 0 0 auto;
      min-height: min-content;
      justify-content: flex-start;
    }

    .yl-qualifier__row--column .yl-qualifier__label {
      margin-bottom: 4px;
      flex-shrink: 0;
    }

    .yl-qualifier__row--column .yl-qualifier__input {
      flex: 0 0 auto;
      flex-shrink: 0;
    }

    .yl-qualifier__field--autocomplete {
      position: relative;
    }

    .yl-qualifier__suggest {
      --color-accent: #f5c518;
      --color-white: #ffffff;
      --color-border: rgba(86, 92, 107, 0.4);
      position: fixed;
      z-index: 100060;
      margin: 0;
      padding: 6px 0;
      list-style: none;
      max-height: 220px;
      overflow-y: auto;
      border: 1px solid var(--color-border);
      border-radius: 8px;
      background: rgba(27, 30, 36, 0.96);
      box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
      font-family: "Bricolage Grotesque", system-ui, sans-serif;
    }

    .yl-qualifier__suggest-item {
      padding: 8px 12px;
      font-size: 14px;
      font-weight: 300;
      line-height: 1.35;
      color: var(--color-white);
      cursor: pointer;
    }

    .yl-qualifier__suggest-item:hover,
    .yl-qualifier__suggest-item.is-active {
      background: rgba(245, 197, 24, 0.16);
      color: var(--color-accent);
    }

    .yl-qualifier__field--full {
      flex: 1 1 100%;
      width: 100%;
    }

    .yl-qualifier__label {
      font-size: 14px;
      font-weight: 300;
      line-height: 24px;
      color: var(--color-label);
      margin-bottom:10px;
    }

    .yl-qualifier__required { color: var(--color-accent); }

    .yl-qualifier__input,
    .yl-qualifier__textarea {
      width: 100%;
      padding: 8px 0;
      border: none;
      border-bottom: 1px solid var(--color-border);
      background: transparent;
      font-family: var(--font);
      font-size: 14px;
      font-weight: 300;
      line-height: 24px;
      color: var(--color-white);
      outline: none;
      transition: border-color 0.2s ease;
    }

    .yl-qualifier__input::placeholder,
    .yl-qualifier__textarea::placeholder {
      color: var(--color-placeholder);
    }

    .yl-qualifier__textarea {
      min-height: 96px;
      resize: vertical;
      text-transform: none;
      align-items: flex-start;
    }

    .yl-qualifier__textarea--issue {
      height: 125px;
      min-height: 125px;
      resize: none;
      border-bottom: 1px solid var(--color-border);
    }

    .yl-qualifier__input:focus,
    .yl-qualifier__textarea:focus {
      border-bottom-color: var(--color-accent);
    }

    .yl-qualifier__input.is-invalid,
    .yl-qualifier__textarea.is-invalid {
      border-bottom-color: var(--color-accent);
      color: var(--color-white);
    }

    .yl-qualifier__input.is-invalid::placeholder,
    .yl-qualifier__textarea.is-invalid::placeholder {
      color: var(--color-placeholder);
    }

    .yl-qualifier__field.is-invalid .yl-qualifier__label,
    .yl-qualifier__field.is-invalid .yl-qualifier__label .yl-qualifier__required,
    .yl-qualifier__choice-section:has([role="radiogroup"].is-invalid) > .yl-qualifier__label,
    .yl-qualifier__block:has([role="radiogroup"].is-invalid) > .yl-qualifier__label,
    [role="radiogroup"].is-invalid .yl-qualifier__choice-label,
    [role="radiogroup"].is-invalid .yl-qualifier__vehicle-label,
    [role="radiogroup"].is-invalid .yl-qualifier__scale-label {
      color: var(--color-white);
    }

    .yl-qualifier__choice-section {
      display: flex;
      flex-direction: column;
      gap: 16px;
      max-width: 100%;
      border: none;
      padding:0px;
    }

    .yl-qualifier__choice-section--tight { gap: 4px; }

    .yl-qualifier__block {
      display: flex;
      flex-direction: column;
      gap: 16px;
      width: 100%;
    }

    .yl-qualifier__block--tight {
      gap: 4px;
    }

    .yl-qualifier__choice-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      width: 100%;
    }

    .yl-qualifier__choice-grid--3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .yl-qualifier__choice-grid--acquire .yl-qualifier__choice-option {
      min-width: 150px;
      height: 44px;
    }

    .yl-qualifier__choice-option,
    .yl-qualifier__vehicle-option {
      position: relative;
      display: flex;
      flex-direction: row;
      gap: 10px;
      align-items: center;
      justify-content: center;
      min-height: 44px;
      padding: 10px 16px;
      border: 1px solid var(--color-border);
      border-radius: 8px;
      background: transparent;
      cursor: pointer;
      transition: border-color 0.2s ease, background 0.2s ease;
    }

    .yl-qualifier__vehicle-option {
      justify-content: flex-start;
      padding: 10px 16px 10px 42px;
    }

    .yl-qualifier__choice-option:hover,
    .yl-qualifier__vehicle-option:hover,
    .yl-qualifier__scale-option:hover {
      border-color: rgba(245, 197, 24, 0.5);
    }

    .yl-qualifier__choice-option.is-selected,
    .yl-qualifier__vehicle-option.is-selected {
      border-color: var(--color-accent);
      background: rgba(245, 197, 24, 0.08);
    }

    .yl-qualifier__choice-option.is-selected .yl-qualifier__choice-label,
    .yl-qualifier__vehicle-option.is-selected .yl-qualifier__vehicle-label {
      color: var(--color-white);
    }

    .yl-qualifier__choice-icon,
    .yl-qualifier__vehicle-icon {
      position: absolute;
      left: 10px;
      top: 50%;
      transform: translateY(-50%);
      display: flex;
      align-items: center;
      justify-content: center;
      width: 24px;
      height: 24px;
      flex-shrink: 0;
      pointer-events: none;
      z-index: 1;
      overflow: hidden;
      border-radius: 8px;
    }

    .yl-qualifier__choice-icon img,
    .yl-qualifier__vehicle-icon img {
      display: block;
      width: 24px;
      height: 24px;
      object-fit: contain;
      border-radius: 8px;
    }

    .yl-qualifier__choice-grid--stack {
      grid-template-columns: 1fr;
      gap: 10px;
    }

    .yl-qualifier__choice-grid--stack .yl-qualifier__choice-option {
      justify-content: flex-start;
      min-height: 44px;
      height: auto;
    }

    .yl-qualifier__choice-grid--stack .yl-qualifier__choice-label {
      text-align: left;
    }

    .yl-qualifier__choice-label,
    .yl-qualifier__vehicle-label {
      position: relative;
      z-index: 1;
      font-size: 14px;
      font-weight: 300;
      line-height: 24px;
      color: var(--color-muted);
      text-align: center;
      word-break: break-word;
      pointer-events: none;
    }

    .yl-qualifier__vehicle-option .yl-qualifier__choice-label,
    .yl-qualifier__vehicle-option .yl-qualifier__vehicle-label {
      flex: 1;
      text-align: center;
    }

    .yl-qualifier__choice-option input,
    .yl-qualifier__vehicle-option input,
    .yl-qualifier__scale-option input {
      position: absolute;
      inset: 0;
      z-index: 2;
      width: 100%;
      height: 100%;
      margin: 0;
      opacity: 0;
      cursor: pointer;
    }

 
    

    .yl-qualifier__vehicle-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
      width: 100%;
    }

    .yl-qualifier__scale-grid {
      display: flex;
      flex-direction: row;
      gap: 16px;
      width: 100%;
    }

    
    .yl-qualifier__scale-option {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width:100%;
      min-height: 44px;
      padding: 10px;
      border: 1px solid var(--color-border);
      border-radius: 8px;
      background: transparent;
      cursor: pointer;
      transition: border-color 0.2s ease, background 0.2s ease;
    }

    .yl-qualifier__scale-option.is-selected {
      border-color: var(--color-accent);
      background: rgba(245, 197, 24, 0.08);
    }

    .yl-qualifier__scale-label {
      font-size: 14px;
      font-weight: 300;
      line-height: 24px;
      color: var(--color-white);
    }

    .yl-qualifier__scale-option.is-selected .yl-qualifier__scale-label {
      color: var(--color-white);
    }

    .yl-qualifier__info {
      display: flex;
      gap: 8px;
      align-items: flex-start;
      max-width: 100%;
      padding: 16px;
      background: rgba(245, 197, 24, 0.1);
    }

    .yl-qualifier__info-icon {
      flex-shrink: 0;
      width: 24px;
      height: 24px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .yl-qualifier__info-icon img {
      width: 16px;
      height: 16px;
      display: block;
    }

    .yl-qualifier__info-text {
      display: flex;
      flex-direction: column;
      gap: 3px;
      flex: 1;
      font-size: 14px;
    }

    .yl-qualifier__info-title {
      font-weight: 500;
      line-height: 24px;
      color: var(--color-white);
    }

    .yl-qualifier__info-subtitle {
      font-weight: 200;
      line-height: 20px;
      color: var(--color-white);
    }

    .yl-qualifier__error {
      display: none;
      font-size: 12px;
      line-height: 18px;
      color: #e05a5a;
      margin-top: 4px;
    }

    .yl-qualifier__error.is-visible { display: block; }

    .yl-qualifier__success-extra {
      display: none;
      flex-direction: column;
      gap: 24px;
      width: 100%;
      align-items: center;
      text-align: center;
    }
    .yl-qualifier__btn--back.is-enabled:hover,
    .yl-qualifier__btn--next:hover{
      background: var(--color-accent) !important;
      color: #0f1115 !important;
    }
    .yl-qualifier.is-submitted .yl-qualifier__success-extra {
      display: flex;
      flex: 1 1 auto;
      min-height: 0;
      overflow-y: auto;
    }

    .yl-qualifier__reference {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 4px 8px;
      border: 1px solid var(--color-accent);
      border-radius: 4px;
      font-size: 14px;
      font-weight: 400;
      line-height: 20px;
      color: var(--color-accent);
    }

    .yl-qualifier__copy-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 16px;
      height: 16px;
      border: none;
      background-color: transparent !important;
      cursor: pointer;
      padding: 0;
      font-size: 12px;
      line-height: 1;
    }

    .yl-qualifier__copy-icon {
      font-size: 14px;
      line-height: 1;
      color: var(--color-accent);
    }

    .yl-qualifier__copy-btn.is-copied {
      pointer-events: none;
    }

    .yl-qualifier__summary {
      display: flex;
      flex-direction: column;
      width: 100%;
      max-width: 393px;
      font-size: 14px;
      font-weight: 300;
      line-height: 24px;
    }

    .yl-qualifier__summary-row {
      display: flex;
      gap: 4px;
      padding: 8px 0;
      border-bottom: 1px solid rgba(86, 92, 107, 0.15);
    }

    .yl-qualifier__summary-label {
      flex: 1;
      color: var(--color-muted);
      text-align: left;
    }

    .yl-qualifier__summary-value {
      flex: 1;
      color: var(--color-white);
      text-align: right;
    }

    .yl-qualifier__confirm-note {
      font-size: 14px;
      font-weight: 300;
      line-height: 22px;
      color: var(--color-white);
      max-width: 393px;
    }

    .yl-qualifier__confirm-note a {
      color: var(--color-accent);
      text-decoration: underline;
    }

    .yl-qualifier__restart {
      width: 100%;
      padding: 10px 24px;
      border: none;
      background: var(--color-border);
      color: var(--color-label);
      font-family: var(--font);
      font-size: 14px;
      font-weight: 300;
      line-height: 20px;
      cursor: pointer;
    }

    .yl-qualifier__restart:hover { opacity: 0.9; }

    .yl-qualifier__nav {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      width: 100%;
      gap: 16px;
    }

    .yl-qualifier__btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 100px;
      padding: 10px 24px;
      border: none;
      border-radius: 4px;
      font-family: var(--font);
      font-size: 14px;
      font-weight: 500;
      line-height: 20px;
      cursor: pointer;
      transition: opacity 0.2s ease, background 0.2s ease;
    }

    .yl-qualifier__btn--back {
      background: var(--color-btn-disabled-bg) !important;
      color: var(--color-btn-disabled-text) !important;
      cursor: default;
    }

    .yl-qualifier__btn--back.is-enabled {
      background: var(--color-bg)  !important;
      color: var(--color-accent) !important;
      cursor: pointer;
    }

    .yl-qualifier__btn--next {
      background: var(--color-bg) !important;
      color: var(--color-accent) !important;
    }

    .yl-qualifier__btn--next.is-accent {
      background: var(--color-dark) !important;
      color: var(--color-accent)  !important;
    }

    .yl-qualifier__btn--submit {
      background: var(--color-accent) !important;
      color: var(--color-dark)!important;
      min-width: auto;
      white-space: nowrap;
    }

    .yl-qualifier__btn.is-hidden,
    .yl-qualifier__btn[hidden] {
      display: none !important;
    }

    .yl-qualifier__nav-action {
      margin-left: auto;
    }

    .yl-qualifier__btn:disabled {
      opacity: 0.5;
      cursor: not-allowed;
    }

    .yl-qualifier.is-submitted .yl-qualifier__progress,
    .yl-qualifier.is-submitted .yl-qualifier__steps,
    .yl-qualifier.is-submitted .yl-qualifier__nav {
      display: none;
    }

    .yl-qualifier.is-submitting .yl-qualifier__btn--submit {
      opacity: 0.7;
      pointer-events: none;
    }

    .yl-qualifier.is-submitting .yl-qualifier__btn--submit::after {
      content: " …";
    }

    @media (max-width: 480px) {
      .yl-qualifier { padding: 24px; gap: 28px; }
      .yl-qualifier__row { flex-direction: column; }
      .yl-qualifier__vehicle-grid,
      .yl-qualifier__choice-grid { grid-template-columns: 1fr; }
      .yl-qualifier__choice-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .yl-qualifier__choice-grid--stack { grid-template-columns: 1fr; }
      .yl-qualifier__scale-grid { justify-content: flex-start; }
    }