.extension-setup {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  border: 1px solid var(--line);
  background: #fff;
  padding: 22px 24px;
  margin-top: 20px;
}
.extension-setup .eyebrow { margin-bottom: 7px; }
.extension-setup h2 { font-size: 24px; letter-spacing: -.04em; margin: 0 0 6px; }
.extension-setup p:not(.eyebrow) { margin: 0; color: var(--muted); max-width: 720px; }
.extension-setup form { margin: 0; flex: 0 0 auto; }
.extension-key { background: #152018; color: #fff; padding: 18px 23px; }
.extension-key p { margin: 0 0 9px; }
.extension-key code { display: block; overflow-wrap: anywhere; background: #29382a; padding: 10px; border-radius: 5px; color: var(--lime); }
.add-unit select { width: 100%; font: 15px/1.35 inherit; border: 1px solid #a5c55b; border-radius: 7px; background: #fff; padding: 10px; }
.condition { display: inline-block; margin-left: 5px; font-size: 12px; font-weight: 800; border-radius: 999px; padding: 5px 9px; }
.condition.new { background: #e6f7c2; color: #426413; }
.condition.used { background: #fff0cf; color: #8a5b12; }
@media (max-width: 680px) { .extension-setup { align-items: flex-start; flex-direction: column; } }