.next-step {
  --ns-bg: #f3f7fb;
  --ns-text: #182d42;
  --ns-muted: #425970;
  --ns-line: #becfdf;
  --ns-button: #184b73;
  background: var(--ns-bg);
  color: var(--ns-text);
  border: 1px solid var(--ns-line);
  border-radius: 16px;
  padding: clamp(20px, 4vw, 36px);
  margin: 20px 0 28px;
  max-width: 760px;
  min-width: 0;
  box-sizing: border-box;
}
html[data-theme="dark"] .next-step, html.dark .next-step {
  --ns-bg: #172635;
  --ns-text: #edf4fb;
  --ns-muted: #bccdde;
  --ns-line: #49647e;
  --ns-button: #174e78;
}
.next-step__eyebrow { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; margin: 0 0 10px; color: var(--ns-muted); }
.next-step:not(#_):not(#_) h2 { font-size: clamp(22px, 3vw, 30px); line-height: 1.2; margin: 0 0 12px; padding: 0; border: 0; color: var(--ns-text); overflow-wrap: anywhere; }
.next-step__note { font-size: 15px; line-height: 1.55; color: var(--ns-muted); margin: 0 0 20px; }
/* Keep primary-link contrast above shared document-link styling. */
.next-step:not(#_):not(#_) .next-step__primary { display: inline-flex; align-items: center; justify-content: center; gap: 12px; background: var(--ns-button); color: #fff; border: 1px solid #4d82a9; border-radius: 9px; min-height: 50px; padding: 12px 20px; box-sizing: border-box; font: inherit; font-size: 16px; font-weight: 700; text-decoration: none; cursor: pointer; }
.next-step :focus-visible { outline: 3px solid #5794c5; outline-offset: 3px; }
.next-step__search label { display: block; font-size: 14px; margin: 0 0 8px; }
.next-step__search > div { display: flex; gap: 10px; }
.next-step__search input { width: 100%; min-width: 0; font: inherit; padding: 12px; background: var(--ns-bg); color: var(--ns-text); border: 1px solid var(--ns-line); border-radius: 8px; }
.next-step__search button { flex-shrink: 0; }
.next-step__other { margin: 20px 0 0; font-size: 14px; }
.next-step__other summary { cursor: pointer; color: var(--ns-muted); padding: 6px 0; }
.next-step__other ul { padding-left: 20px; margin: 8px 0; }
.next-step__other li { padding: 6px 0; }
.next-step__other a, .next-step a:not(.next-step__primary) { color: var(--ns-text); text-decoration: underline; }
.next-step__code { max-width: 100%; overflow-x: auto; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--ns-bg); color: var(--ns-text); border: 1px solid var(--ns-line); border-radius: 8px; padding: 14px; font-size: 12px; line-height: 1.6; }
.next-step__status:empty { display: none; }
.next-step__primary:disabled { opacity: .7; cursor: default; }
.next-step [data-next-step-share-link] { overflow-wrap: anywhere; font-size: 13px; }
html:has(meta[name="hugging-bay-next-step"][content="1"]) .five-second-bar__cta { background: transparent; color: inherit; border-color: transparent; box-shadow: none; font-weight: 500; }
/* The page already has one primary action. Search remains in the site menu. */
html:has(meta[name="hugging-bay-next-step"][content="1"]) body:has([data-next-step]) .five-second-bar:not(#_):not(#_):not(#_) :is(.five-second-bar__search, .five-second-bar__cta) { display: none; }
html[data-hb-next-step="1"] .model-aside .next-step { margin-top: 0; }
.next-step-legacy-options { margin: 12px 0 20px; }
.next-step-legacy-options > summary { cursor: pointer; padding: 10px 0; }
@media (max-width: 560px) {
  .next-step__search > div { flex-direction: column; }
  .next-step .next-step__primary { width: 100%; }
}

.next-step:not(#_):not(#_) .next-step__search input::placeholder { color: var(--ns-muted); opacity: 1; }
@media (max-width: 560px) {
  html:has(meta[name="hugging-bay-next-step"][content="1"]) .hb-shelf:not(#_):not(#_):not(#_) { flex-wrap: wrap; overflow: visible; white-space: normal; }
}

html:has(meta[name="hugging-bay-next-step"][content="1"]) table[aria-label="Browse models catalog results"] th:not(#_):not(#_):not(#_),
html:has(meta[name="hugging-bay-next-step"][content="1"]) table[aria-label="Loaded models"] th:not(#_):not(#_):not(#_) { padding-inline: 10px; }
