/* Founder mobile/profile polish, 2026-10-21. Kept separate so the targeted launch corrections
   stay reversible and do not disturb the existing page compositions. */

/* Workspace menu: icons should read as a separate column, not touch the labels. */
html body .sidebar .ws-group > a { gap: 14px; }
html body .sidebar .ws-icon-slot { width: 18px; height: 18px; }

/* Solution Provider public card. */
.dp-card--solution-provider .dp-location {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 5px 0 0;
  color: var(--dp-mute);
  font-size: 11.5px;
  line-height: 1.3;
}
.dp-card--solution-provider .dp-location svg { flex: none; color: var(--dp-accent); }
.dp-card--solution-provider .dp-avatar .logo-image {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
}
.dp-card--solution-provider .dp-avatar .logo-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dp-card--solution-provider .dp-facts {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
}
.dp-card--solution-provider .dp-facts > div {
  display: grid;
  grid-template-rows: minmax(30px, auto) 24px;
  align-items: end;
  gap: 3px;
}
.dp-card--solution-provider .dp-facts dt {
  grid-row: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: 30px;
  line-height: 1.15;
  text-align: center;
}
.dp-card--solution-provider .dp-facts dd {
  grid-row: 2;
  align-self: end;
  line-height: 1;
}
.dp-card--solution-provider .dx-cmp-icon,
.dp-card--solution-provider .dx-cmp-button,
.dp-card--solution-provider .dx-cmp-open { display: none !important; }
.dp-card--solution-provider .dp-icon-row:has(.dx-cmp-icon):not(:has(button:not(.dx-cmp-icon))):not(:has(a)) {
  display: none !important;
}

/* Email verification should remain a reminder, not become the main mobile section. */
.verify-banner {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
  padding: 8px 10px !important;
  border-radius: 14px !important;
}
.verify-banner__row { gap: 8px !important; min-height: 0 !important; }
.verify-banner__icon {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
}
.verify-banner__icon svg { width: 16px !important; height: 16px !important; }
.verify-banner__row p { font-size: 12.5px !important; line-height: 1.3 !important; }
.verify-banner__actions { gap: 6px !important; }
.verify-banner__actions .button {
  min-height: 34px !important;
  padding: 5px 12px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
}
.verify-banner__actions .icon-button {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
}
.email-code--compact { padding-left: 38px !important; gap: 5px !important; }
.email-code--compact .email-code__form { gap: 6px !important; }
.email-code--compact label { font-size: 11px !important; }
.email-code--compact input {
  min-height: 34px !important;
  height: 34px !important;
  padding: 4px 8px !important;
  font-size: 16px !important;
  letter-spacing: .16em !important;
}
.email-code--compact .button {
  min-height: 34px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
}
.email-code--compact .text-button { min-height: 30px !important; font-size: 11.5px !important; }

/* Use Case detail: compact the conversion and related-work areas. */
.uc-contact { gap: 7px !important; margin: 20px 0 10px !important; }
.uc-contact-title { margin: 0 0 7px !important; font-size: 18px !important; line-height: 1.25 !important; }
.uc-contact-card { border-radius: 16px !important; }
.super-request { gap: 8px !important; padding: 13px 14px !important; border-radius: 16px !important; }
.super-request-head { gap: 1px !important; }
.super-request-head strong { font-size: 15px !important; }
.super-request-head small { font-size: 11.5px !important; line-height: 1.35 !important; }
.super-request-to { gap: 6px !important; font-size: 11.5px !important; }
.super-request-to select,
.super-request-find {
  min-height: 32px !important;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  font-size: 12px !important;
}
.super-request-input { padding: 4px 4px 4px 12px !important; }
.super-request-input input { min-height: 36px !important; font-size: 13px !important; }
.super-request-send { width: 36px !important; height: 36px !important; }
.uc-request-card { gap: 7px !important; padding: 11px 14px !important; border-radius: 14px !important; }
.uc-request-card strong { font-size: 14px !important; }
.uc-request-card p { font-size: 12px !important; line-height: 1.4 !important; }
.uc-recommended { padding: 2px 8px !important; font-size: 10.5px !important; }
.uc-request-card .button { min-height: 36px !important; padding: 6px 12px !important; font-size: 12px !important; }

/* A Solution Provider does not need the buyer-facing provider request panel. The provider workspace
   link is account state already rendered by Layout; display:none also removes the section from a11y. */
body:has(.sidebar .nav-workspaces a[href$="/creator"]) .uc-contact { display: none !important; }

.use-case-related { margin-top: 20px !important; }
.use-case-related > h2 { margin: 0 0 10px !important; font-size: 22px !important; line-height: 1.2 !important; }
.uc-around-grid { gap: 9px !important; }
.uc-around-card { border-radius: 15px !important; }
.uc-around-head { gap: 7px !important; padding: 10px 13px !important; }
.uc-around-head h3 { margin: 0 !important; font-size: 14.5px !important; line-height: 1.3 !important; }
.uc-around-head a { font-size: 11.5px !important; }
.uc-around-body { padding: 3px 13px 9px !important; border-radius: 0 0 15px 15px !important; }
.uc-around-body li { gap: 8px !important; padding: 8px 0 !important; font-size: 12.5px !important; }
.uc-asking {
  grid-template-columns: 68px minmax(0, 1fr) !important;
  gap: 3px 10px !important;
  padding: 12px 14px !important;
}
.uc-asking-art { width: 68px !important; height: 52px !important; }
.uc-asking-copy h3 { font-size: 14.5px !important; }
.uc-asking-copy p,
.uc-asking-empty { font-size: 12px !important; line-height: 1.4 !important; }
.uc-asking-list { margin: 5px 0 2px !important; gap: 4px !important; }
.uc-asking-list li { padding: 7px 9px !important; border-radius: 10px !important; font-size: 12px !important; }
.uc-asking > .button { min-height: 35px !important; padding: 6px 11px !important; font-size: 12px !important; }

/* Publish illustrations: final information is present immediately. Motion is continuous and ambient,
   rather than a timed reveal that temporarily hides the meaning. */
.publish-picture--continuous .pc-note.is-on { animation: founder-note-float 5.4s ease-in-out infinite; }
.publish-picture--continuous .pc-usecase.is-on,
.publish-picture--continuous .pb-build.is-done { animation: founder-card-breathe 6s ease-in-out infinite; }
.publish-picture--continuous .pb-logo.is-on,
.publish-picture--continuous .pb-fallback-mark { animation: founder-logo-float 4.8s ease-in-out infinite; }
.publish-picture--continuous .pb-logo:nth-child(2) { animation-delay: -1.2s; }
.publish-picture--continuous .pb-logo:nth-child(3) { animation-delay: -2.4s; }
.publish-picture--continuous .pb-logo:nth-child(4) { animation-delay: -3.6s; }
@keyframes founder-note-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
@keyframes founder-card-breathe {
  0%, 100% { transform: translateY(0); box-shadow: 0 0 0 4px rgba(77,174,139,.13); }
  50% { transform: translateY(-2px); box-shadow: 0 0 0 5px rgba(77,174,139,.2); }
}
@keyframes founder-logo-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}

@media (max-width: 600px) {
  /* Use Case listing invitations are choices, not hero cards. Keep both visible together. */
  .uc-invites {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-bottom: 10px !important;
  }
  .uc-invite {
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 7px !important;
    min-height: 46px !important;
    padding: 7px 8px !important;
    border-radius: 12px !important;
  }
  .uc-invite > svg { display: none !important; }
  .uc-invite > span:nth-child(2) > span { display: none !important; }
  .uc-invite strong {
    font-size: 12px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere;
  }
  .uc-invite-icon { width: 28px !important; height: 28px !important; border-radius: 8px !important; }
  .uc-invite-icon svg { width: 14px !important; height: 14px !important; }

  .verify-banner { margin: 7px 12px !important; padding: 7px 9px !important; }
  .verify-banner__more { display: none !important; }
  .email-code--compact { padding-left: 0 !important; margin-top: 5px !important; }
  .email-code--compact .email-code__form { grid-template-columns: minmax(112px, 1fr) auto !important; align-items: end !important; }
  .email-code--compact .text-button { grid-column: 1 / -1 !important; justify-self: start !important; min-height: 24px !important; }

  .uc-contact { margin-top: 16px !important; }
  .super-request { padding: 11px 12px !important; }
  .super-request-head small { display: none !important; }
  .super-request-to { flex-wrap: nowrap !important; }
  .super-request-to select { min-width: 0 !important; max-width: calc(100% - 24px) !important; }
  .uc-request-card { padding: 10px 12px !important; }

  .use-case-related > h2 { font-size: 19px !important; }
  .uc-around-head { padding: 9px 11px !important; }
  .uc-around-head h3 { font-size: 13.5px !important; }
  .uc-around-body { padding: 2px 11px 8px !important; }
  .uc-around-body li { padding: 7px 0 !important; }
  .uc-asking { grid-template-columns: 1fr !important; padding: 11px 12px !important; }
  .uc-asking-art { display: none !important; }

  .dp-card--solution-provider .dp-facts { gap: 2px; }
  .dp-card--solution-provider .dp-facts > div { grid-template-rows: minmax(34px, auto) 23px; }
  .dp-card--solution-provider .dp-facts dt { min-height: 34px; font-size: 9.5px; }
  .dp-card--solution-provider .dp-facts dd { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .publish-picture--continuous .pc-note,
  .publish-picture--continuous .pc-usecase,
  .publish-picture--continuous .pb-build,
  .publish-picture--continuous .pb-logo,
  .publish-picture--continuous .pb-fallback-mark { animation: none !important; }
}