.pro-search-actions {
  position: absolute;
  inset: 0 4px 0 auto;
  display: flex;
  align-items: center;
}

.pro-search-actions > [hidden] { display: none; }
.pro-search-actions .search-button { position: relative; inset: auto; flex: 0 0 32px; margin: 0; }
.pro-search-actions .pro-search-clear { background-image: none; }
.pro-search-clear::before,
.pro-search-clear::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 1px;
  border-radius: 1px;
  background: #000;
  content: '';
  transform: translate(-50%, -50%) rotate(45deg);
}
.pro-search-clear::after { transform: translate(-50%, -50%) rotate(-45deg); }

.pro-search-scan {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  width: 88px;
  height: 32px;
  padding: 0 1px 0 4px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #151515;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.pro-search-scan-ready { display: inline-flex; align-items: center; gap: 5px; }
.pro-search-scan-pending,
.pro-search-scan-cancel,
.pro-search-scan[data-scanning] .pro-search-scan-ready { display: none; }
.pro-search-scan[data-scanning] { color: #595959; cursor: pointer; }
.pro-search-scan[data-scanning] .pro-search-scan-pending,
.pro-search-scan[data-scanning]:is(:hover, :focus-visible) .pro-search-scan-cancel { display: inline; }
.pro-search-scan[data-scanning]:is(:hover, :focus-visible) .pro-search-scan-pending { display: none; }

@keyframes pro-scan-shimmer {
  from { background-position: 100% 0; }
  to { background-position: 0 0; }
}

@media (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  @supports (background-clip: text) {
    .pro-search-scan[data-scanning] .pro-search-scan-pending {
      background: linear-gradient(90deg, #454545 42%, #6b6b6b 50%, #454545 58%) 100% 0 / 220% 100%;
      background-clip: text;
      color: transparent;
      animation: pro-scan-shimmer 1.7s linear infinite;
    }
  }
}

@media (hover: none) {
  .pro-search-scan[data-scanning] .pro-search-scan-pending { display: none; }
  .pro-search-scan[data-scanning] .pro-search-scan-cancel { display: inline; }
}

.pro-search-scan kbd {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  height: 17px;
  padding: 0 3px 0 4px;
  border-radius: 5px;
  background: #dcdcdc;
  color: #595959;
  font: inherit;
  font-size: 11px;
  font-weight: 400;
  line-height: 1;
}
.search:focus-within .pro-search-scan kbd { background: #f2f2f2; }
.pro-search-actions > :focus-visible { outline: 2px solid #777500; outline-offset: -2px; }

.pro-image-action.cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 4px;
  background: #00000080;
  box-shadow: 0 0 0 1px #fff3;
  color: #ccc;
  letter-spacing: normal;
  text-shadow: none;
  cursor: pointer;
}
.pro-image-action.cta:is(:hover, :focus-visible) {
  background: #171717 linear-gradient(#404040, #171717);
  box-shadow: 0 2px 4px #0002, 0 0 0 .5px #fff4, inset 0 -1px #0006;
  color: #fff;
  text-shadow: 0 .5px #0006;
}
.pro-image-action.cta:active {
  background-image: linear-gradient(#202020, #171717);
  box-shadow: 0 0 0 .5px #fff4, inset 0 1px #0006;
}
.pro-image-action[aria-disabled="true"], .pro-image-action:disabled { cursor: default; }
.pro-image-card-actions > .pro-image-action.cta {
  width: auto;
  height: 24px;
  padding: 0 8px 1px;
  font-size: 12px;
}

:is([data-pro-gallery], [data-pro-search-enabled]) .search-input { padding-right: 40px; }
[data-pro-search-enabled] .search[data-pro-has-clear] .search-input { padding-right: 72px; }
:is([data-pro-gallery], [data-pro-search-enabled]) .search[data-pro-has-url] .search-input { padding-right: 120px; }
:is([data-pro-gallery], [data-pro-search-enabled]) .search-input::-webkit-search-cancel-button { display: none; }

[data-pro-header-pending] [data-pro-brand][hidden] { display: inline; visibility: hidden; }
[data-pro-header-pending] :is([data-pro-saved-link], [data-pro-account-link])[hidden] {
  display: flex;
  visibility: hidden;
}
[data-pro-header-pending] :is([data-pro-extension], [data-pro-resource-sign-in]) { display: none; }
[data-pro-shell-hint] [data-pro-header-pending] :is([data-pro-brand], [data-pro-saved-link], [data-pro-account-link])[hidden] {
  visibility: visible;
}
.header:is([data-pro-header-pending], [data-pro-search-enabled]) .text-block { white-space: nowrap; }
.pro-workspace-checkout {
  border: 0;
  background: transparent;
  color: #151515;
  font-weight: 600;
  white-space: nowrap;
}
.pro-workspace-checkout:hover { text-decoration: underline; text-underline-offset: 3px; }
.pro-workspace-checkout:disabled { opacity: .6; cursor: default; }
.pro-workspace-checkout[hidden], .pro-workspace-billing-status[hidden] { display: none; }
.pro-workspace-billing-status { margin: 0; color: #595959; font-size: 14px; text-align: right; }
.pro-workspace-billing-status:not(:empty) { margin-top: 8px; }

header:is([data-pro-gallery], [data-pro-routed-search]) ~ .categories,
header[data-pro-gallery] ~ :is([data-pro-workspace], [data-pro-saved-gallery]) > .categories {
  overflow-x: auto;
  scrollbar-width: none;
}

@media (max-width: 991px) {
  .header:is([data-pro-header-pending], [data-pro-search-enabled]) { flex-wrap: wrap; gap: 12px; }
  .header:is([data-pro-header-pending], [data-pro-search-enabled]) > :is(.logo, .nav) { width: auto; }
  .header:is([data-pro-header-pending], [data-pro-search-enabled]) > .search { display: block; order: 1; max-width: none; }
}

@media (max-width: 479px) {
  .header:is([data-pro-header-pending], [data-pro-search-enabled]) > .nav {
    flex-wrap: wrap;
    gap: 6px;
    max-width: 100%;
  }
  .header:is([data-pro-header-pending], [data-pro-search-enabled]) > .nav > :is(a, .pro-workspace-checkout) {
    margin-left: 0;
    font-size: 14px;
  }
  .header:is([data-pro-header-pending], [data-pro-search-enabled]) > .nav > .cta { padding-inline: 10px; }
}

[data-pro-session-pending] :is(.pro-account, [data-pro-workspace], [data-pro-saved-gallery]) { visibility: hidden; }

.pro-account {
  width: min(100%, 440px);
  margin: clamp(72px, 14vh, 140px) auto;
  text-align: center;
}

.pro-account[hidden],
.pro-account [hidden],
[data-pro-workspace][hidden],
[data-pro-brand][hidden],
[data-pro-account-link][hidden] { display: none; }
[data-pro-header-pending] ~ .pro-account[data-pro-page="account"][hidden] { display: block; visibility: hidden; }
[data-pro-header-pending] ~ .pro-account[data-pro-page="account"][hidden] [data-pro-signed-out] { display: none; }
[data-pro-header-pending] ~ .pro-account[data-pro-page="account"][hidden] [data-pro-signed-in][hidden] { display: block; }
.pro-account h1 { margin: 0 0 8px; font-size: 36px; line-height: 1.15; }
.pro-caption { margin: 0; color: #595959; overflow-wrap: anywhere; }
.pro-account [data-pro-email] { min-height: 22px; }

.pro-account[data-pro-view="offer"] {
  width: fit-content;
  max-width: min(100%, 320px);
  margin-block: clamp(40px, 8vh, 88px);
}
.pro-account[data-pro-view="offer"] .pro-account-panel {
  padding: clamp(20px, 5vw, 28px);
  border: 1px solid #e7e7e7;
  border-radius: 12px;
  text-align: left;
}
.pro-account[data-pro-view="offer"] h1 {
  margin-bottom: 8px;
  font-size: clamp(30px, 5vw, 38px);
  line-height: 1.1;
}
.pro-account:not([data-pro-view="offer"]) .pro-offer-features,
.pro-account:is([data-pro-view="confirm"], [data-pro-view="sign-in"]) .pro-plan-price { display: none; }
.pro-account[data-pro-view="confirm"] .pro-terms-link { display: none; }
.pro-get-pro { margin-top: 16px; text-align: center; }
.pro-confirm-button { margin: 16px auto 0; }
.pro-offer-features {
  display: grid;
  gap: 12px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  text-align: left;
}
.pro-offer-features li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  font-weight: 500;
}
.pro-offer-features svg { flex-shrink: 0; }
.pro-plan-price { margin: 0; color: #595959; font-size: 17px; line-height: 1.4; }
.pro-plan-price strong { color: #151515; font-weight: 600; }
.pro-account[data-pro-view="account"] .pro-plan-price { margin: 16px 0 12px; }
.pro-account .pro-terms-link {
  display: inline-block;
  margin-top: 16px;
  color: #595959;
  font-size: 13px;
  text-underline-offset: 3px;
}
.pro-checkout-note { margin: 12px 0 0; color: #595959; font-size: 13px; line-height: 1.4; }
.pro-member-since { margin: 8px 0 0; color: #595959; }
.pro-scan-target {
  margin: 0 0 12px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.pro-account[data-pro-view="offer"] .pro-scan-target { margin: 16px 0 0; }
.pro-continue-scan {
  display: inline-block;
  margin-top: 12px;
  color: #151515;
  font-weight: 600;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}

.pro-field,
.pro-actions {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 24px 0 0;
}

.pro-field .search-input { min-width: 0; flex: 1; font-size: 16px; }
.pro-account[data-pro-view="sign-in"] .pro-field { flex-direction: column; align-items: stretch; margin-top: 12px; }
.pro-account[data-pro-view="sign-in"] .pro-field :is(.search-input, .pro-primary) { min-height: 42px; }
.pro-account[data-pro-view="sign-in"] .pro-field .search-input { flex: auto; }
.pro-primary { flex: 0 0 auto; width: auto; white-space: nowrap; text-shadow: 0 .5px #fff3; }
.pro-primary:active { text-shadow: 0 -.5px #fff6; }
.pro-primary:disabled { opacity: .6; cursor: default; }
.pro-status { margin: 0; color: #595959; font-size: 14px; overflow-wrap: anywhere; }
.pro-status:not(:empty) { margin-top: 12px; }
.pro-status a { color: inherit; font-weight: 600; }

.pro-actions { flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.pro-sign-out { padding: 8px 0; border: 0; background: transparent; color: #595959; }
.pro-sign-out:hover { color: #151515; }
.pro-account :is(button, a):focus-visible { outline: 2px solid #777500; outline-offset: 3px; }
.pro-mcp { margin-top: 28px; padding-top: 24px; border-top: 1px solid #e1e1e1; }
.pro-mcp h2 { margin: 0 0 10px; font-size: 22px; line-height: 1.25; }
.pro-mcp > .cta { margin: 14px 0; }
.pro-mcp code { font-size: .9em; }
.pro-mcp input { margin-top: 12px; }

@media (max-width: 440px) {
  .pro-field { flex-direction: column; }
  .pro-field .search-input, .pro-field .pro-primary { min-height: 42px; }
}

[data-pro-extension][hidden],
[data-pro-resource-sign-in][hidden],
[data-pro-library][hidden],
[data-pro-resource-header] [hidden],
[data-pro-saved-link][hidden],
.pro-saved-gallery[hidden],
.pro-saved-gallery [data-pro-saved-list][hidden],
.pro-saved-detail[hidden] { display: none; }
[data-pro-saved-link] { white-space: nowrap; }
:is([data-pro-saved-link], [data-pro-account-link])[aria-current="page"] { color: #151515; }
.pro-saved-gallery { margin-bottom: 32px; }
.pro-saved-gallery > .categories { overflow-x: auto; }
.pro-saved-gallery .category { flex-shrink: 0; }
.pro-saved-gallery button.category { appearance: none; border: 0; cursor: pointer; }
.pro-saved-gallery .category:focus-visible { outline: 2px solid #777500; outline-offset: 2px; }
.pro-saved-gallery [role="status"] { margin-bottom: 16px; }
.pro-saved-gallery [role="status"]:empty { display: none; }
.pro-saved-empty {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: clamp(32px, 5vw, 64px) 16px;
  text-align: center;
}
.pro-saved-empty[hidden] { display: none; }
.pro-saved-example {
  position: relative;
  width: 168px;
  aspect-ratio: 1200 / 630;
  margin-bottom: 8px;
  overflow: hidden;
  border-radius: 8px;
  background: #f3f3f3;
}
.pro-saved-example img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pro-saved-empty h2 { margin: 0; font-size: 17px; line-height: 1.4; }
.pro-saved-empty a { color: #595959; font-weight: 600; text-underline-offset: 3px; }
.pro-saved-empty a:hover { color: #151515; }
.pro-saved-empty a:focus-visible { outline: 2px solid #777500; outline-offset: 3px; }
.pro-saved-card { min-width: 0; }
.pro-saved-preview { display: block; }
.pro-saved-frame {
  display: grid;
  place-items: center;
  aspect-ratio: 1200 / 630;
  border-radius: 8px;
  overflow: hidden;
  background: #f1f1f1;
}
.pro-saved-frame > .og-image,
.pro-saved-frame .site-inspection-motion :is(img, video) { display: block; width: 100%; height: 100%; object-fit: cover; }
.pro-saved-preview .source { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-saved-card :focus-visible { outline: 2px solid #777500; outline-offset: 2px; }
