@font-face {
  font-family: 'ABC Oracle';
  src: url('/public/fonts/abc-oracle/ABCOracleTrial-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Shop product create and edit workspace */
.creator-feed-page--shop-form {
  min-height: 100vh;
  background: #fff;
}

.creator-feed-page--shop-form .creator-feed-shell-main {
  min-width: 0;
}

.shop-product-editor {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  padding: 28px 24px 96px;
  color: #262626;
}

.shop-product-editor__header {
  margin-bottom: 24px;
}

.shop-product-editor__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 8px 14px;
  margin-bottom: 18px;
  border: 1px solid #dfe4ec;
  border-radius: 999px;
  background: #f6f8fb;
  color: #222b3a;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.shop-product-editor__back:hover,
.shop-product-editor__back:focus {
  border-color: #b8c4d8;
  color: #0634a3;
  text-decoration: none;
}

.shop-product-editor__heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
}

.shop-product-editor__heading h1 {
  margin: 7px 0 5px;
  color: #282828;
  font-size: clamp(27px, 3vw, 38px);
  font-weight: 700;
  letter-spacing: -0.035em;
}

.shop-product-editor__heading p {
  max-width: 640px;
  margin: 0;
  color: #677083;
  font-size: 14px;
}

.shop-product-editor__type {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #1745be;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.shop-product-editor__change {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 9px 13px;
  border: 0;
  background: transparent;
  color: #1945b8;
  font-size: 13px;
  font-weight: 600;
}

.shop-product-editor__change:hover,
.shop-product-editor__change:focus {
  color: #072b8a;
  text-decoration: underline;
}

.shop-product-form__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(300px, .8fr);
  align-items: start;
  gap: 24px;
}

.shop-product-form__main {
  display: grid;
  gap: 20px;
  min-width: 0;
}

.shop-product-form__section {
  min-width: 0;
  padding: 22px;
  border: 1px solid #e3e7ed;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(17, 35, 68, .035);
}

.shop-product-form__section--sticky {
  position: sticky;
  top: 24px;
}

.shop-product-form__section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.shop-product-form__section-heading span,
.shop-product-form__preview-label {
  display: block;
  margin-bottom: 4px;
  color: #697489;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.shop-product-form__section-heading h2 {
  margin: 0;
  color: #242424;
  font-size: 18px;
  font-weight: 700;
}

.shop-product-form sup {
  top: 0;
  color: #d92d20;
  font-size: inherit;
}

.shop-product-form__section-heading small {
  color: #788196;
  font-size: 11px;
  text-align: right;
}

.shop-product-form__row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.shop-product-form__field {
  min-width: 0;
  margin-bottom: 17px;
}

.shop-product-form__field:last-child {
  margin-bottom: 0;
}

.shop-product-form__field label {
  display: block;
  margin: 0 0 7px;
  color: #333a49;
  font-size: 12px;
  font-weight: 650;
}

.shop-product-form__control,
.shop-product-form__money {
  width: 100%;
  min-height: 44px;
  border: 1px solid #dce1e9;
  border-radius: 10px;
  background: #fff;
  color: #272d39;
  font-size: 14px;
  transition: border-color .18s ease, box-shadow .18s ease;
}

.shop-product-form__control {
  padding: 10px 12px;
}

.shop-product-form__control:focus,
.shop-product-form__money:focus-within {
  border-color: #1646c4;
  box-shadow: 0 0 0 3px rgba(22, 70, 196, .1);
  outline: 0;
}

.shop-product-form__control.is-invalid,
.shop-product-form__money.is-invalid {
  border-color: #dc3545;
  box-shadow: 0 0 0 3px rgba(220, 53, 69, .08);
}

.shop-product-form__textarea {
  min-height: 122px;
  resize: vertical;
}

.shop-product-form__money {
  display: flex;
  align-items: center;
  overflow: visible;
}

.shop-product-form__money span {
  padding: 0 0 0 13px;
  color: #626b7b;
  font-size: 14px;
  font-weight: 650;
}

.shop-product-form__money.is-right span {
  padding: 0 13px 0 0;
}

.shop-product-form__money input {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 9px 12px 9px 7px;
  border: 0;
  background: transparent;
  color: #272d39;
  outline: 0;
}

.shop-product-form__field-note,
.shop-product-form__hint {
  display: block;
  margin-top: 6px;
  color: #7a8393;
  font-size: 11px;
  line-height: 1.45;
}

.shop-product-form__field-error {
  min-height: 0;
  margin-top: 5px;
  color: #c62828;
  font-size: 11px;
  font-weight: 600;
}

.shop-product-form__field-error:empty {
  display: none;
}

.shop-product-form__upload {
  position: relative;
  min-height: 150px;
  padding: 20px;
  border: 1px dashed #aebbd1;
  border-radius: 13px;
  background: #f8faff;
}

.shop-product-form__upload-copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 108px;
  color: #657086;
  text-align: center;
  pointer-events: none;
}

.shop-product-form__upload-copy strong {
  margin: 9px 0 3px;
  color: #293244;
  font-size: 14px;
}

.shop-product-form__upload-copy > span:last-child {
  max-width: 390px;
  font-size: 11px;
}

.shop-product-form__upload-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 11px;
  background: #e8eeff;
  color: #1445c3;
  font-size: 18px;
}

.shop-product-form__upload > input[type=file] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  opacity: 0;
}

.shop-product-form__upload .fileuploader,
.shop-product-form__upload + .fileuploader,
.shop-product-form__section .fileuploader {
  margin: 10px 0 0;
}

.shop-product-form__existing-media {
  display: grid;
  grid-template-columns: repeat(5, minmax(72px, 1fr));
  gap: 10px;
}

.shop-product-form__existing-media figure {
  position: relative;
  margin: 0;
}

.shop-product-form__existing-media img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  border: 1px solid #e1e5ec;
  border-radius: 10px;
  object-fit: cover;
}

.shop-product-form__existing-media button {
  position: absolute;
  top: 6px;
  right: 6px;
  display: grid;
  width: 28px;
  height: 28px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: rgba(20, 25, 34, .84);
  color: #fff;
  cursor: pointer;
}

.shop-product-form__existing-media button:hover,
.shop-product-form__existing-media button:focus-visible {
  background: #d9364f;
}

.shop-product-form__media-empty {
  display: flex;
  align-items: center;
  gap: 8px;
  grid-column: 1 / -1;
  padding: 18px;
  border-radius: 10px;
  background: #f5f7fa;
  color: #6f7888;
}

.shop-product-form__file-summary {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid #e0e5ed;
  border-radius: 12px;
  background: #fafbfc;
}

.shop-product-form__file-summary > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 10px;
  background: #e9efff;
  color: #1746bf;
}

.shop-product-form__file-summary strong,
.shop-product-form__file-summary small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop-product-form__file-summary strong { color: #313744; font-size: 13px; }
.shop-product-form__file-summary small { margin-top: 3px; color: #747d8c; font-size: 10px; }
.shop-product-form__file-summary em { color: #157347; font-size: 10px; font-style: normal; font-weight: 700; }

.shop-product-form__publish {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 0;
  margin: 16px 0;
  border-top: 1px solid #edf0f4;
  border-bottom: 1px solid #edf0f4;
}

.shop-product-form__publish strong,
.shop-product-form__publish span { display: block; }
.shop-product-form__publish strong { color: #343a46; font-size: 12px; }
.shop-product-form__publish div > span { margin-top: 3px; color: #747d8e; font-size: 10px; }

.shop-product-form__status {
  padding: 5px 9px;
  border-radius: 999px;
  background: #e8f7ee;
  color: #187143;
  font-size: 10px;
  font-weight: 700;
}

.shop-product-form__switch {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  cursor: pointer;
}

.shop-product-form__switch input { position: absolute; opacity: 0; }
.shop-product-form__switch span { position: relative; width: 36px; height: 20px; border-radius: 999px; background: #bac2cf; }
.shop-product-form__switch span::after { content: ''; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: transform .18s ease; }
.shop-product-form__switch input:checked + span { background: #1745c1; }
.shop-product-form__switch input:checked + span::after { transform: translateX(16px); }
.shop-product-form__switch em { color: #3b4351; font-size: 11px; font-style: normal; font-weight: 600; }

.shop-product-form__preview {
  overflow: hidden;
  margin: 18px 0;
  border: 1px solid #e2e6ed;
  border-radius: 13px;
  background: #fff;
}

.shop-product-form__preview-label { padding: 12px 13px 7px; margin: 0; }
.shop-product-form__preview-media { position: relative; margin: 0 12px; overflow: hidden; border-radius: 9px; background: #edf1f5; }
.shop-product-form__preview-media img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.shop-product-form__preview-media span { position: absolute; top: 8px; right: 8px; padding: 4px 7px; border-radius: 999px; background: rgba(255,255,255,.92); color: #333; font-size: 9px; font-weight: 700; }
.shop-product-form__preview-copy { padding: 12px; }
.shop-product-form__preview-copy strong { display: block; overflow: hidden; color: #2e3340; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.shop-product-form__preview-copy p { min-height: 30px; margin: 5px 0 8px; color: #747c89; font-size: 10px; line-height: 1.5; }
.shop-product-form__preview-copy b { color: #202633; font-size: 16px; }

.shop-product-form__alert {
  padding: 10px 12px;
  margin: 0 0 12px;
  border: 1px solid #f1b8bc;
  border-radius: 9px;
  background: #fff5f5;
  color: #b4232c;
  font-size: 11px;
}

.shop-product-form__submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 46px;
  padding: 11px 16px;
  border: 1px solid #163fb6;
  border-radius: 10px;
  background: #173fc2;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 8px 18px rgba(23, 63, 194, .18);
}

.shop-product-form__submit:hover,
.shop-product-form__submit:focus { background: #0e329e; color: #fff; }
.shop-product-form__submit:disabled { cursor: wait; opacity: .72; }
.shop-product-form__submit-note { margin: 8px 0 0; color: #7a8392; font-size: 10px; text-align: center; }
.shop-product-form__delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  min-height: 36px;
  margin-top: 14px;
  padding: 0 14px;
  border: 1px solid rgba(190, 55, 67, .35);
  border-radius: 8px;
  background: transparent;
  color: #b42332;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.shop-product-form__delete:hover,
.shop-product-form__delete:focus { background: rgba(190, 55, 67, .07); color: #8f1d2a; }

.creator-shop-type-modal .modal-dialog { width: min(500px, calc(100% - 28px)); max-width: 500px; margin-right: auto; margin-left: auto; }
.creator-shop-type-modal .modal-content { position: relative; padding: 28px; border: 1px solid #e2e6ed; border-radius: 18px; background: #fff; box-shadow: 0 28px 70px rgba(17, 30, 54, .18); }
.creator-shop-type-modal__close { position: absolute; top: 16px; right: 16px; display: grid; width: 34px; height: 34px; place-items: center; border: 0; border-radius: 50%; background: #f2f4f7; color: #414958; }
.creator-shop-type-modal__heading { padding-right: 42px; margin-bottom: 20px; }
.creator-shop-type-modal__icon { display: grid; width: 42px; height: 42px; margin-bottom: 13px; place-items: center; border-radius: 12px; background: #eaf0ff; color: #1745c0; font-size: 18px; }
.creator-shop-type-modal__heading h2 { margin: 0 0 5px; color: #292f3a; font-size: 21px; font-weight: 700; }
.creator-shop-type-modal__heading p { margin: 0; color: #717b8b; font-size: 12px; }
.creator-shop-type-modal__options { display: grid; gap: 10px; }
.creator-shop-type-modal__option { display: grid; grid-template-columns: 42px minmax(0, 1fr) 18px; align-items: center; gap: 12px; padding: 13px; border: 1px solid #e1e5ec; border-radius: 12px; background: #fff; color: #2f3541; text-decoration: none; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.creator-shop-type-modal__option:hover,
.creator-shop-type-modal__option:focus { border-color: #9dafdc; background: #f7f9ff; color: #123da8; text-decoration: none; transform: translateY(-1px); }
.creator-shop-type-modal__option-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 10px; background: #f0f3f8; color: #2048af; font-size: 17px; }
.creator-shop-type-modal__option strong,
.creator-shop-type-modal__option small { display: block; }
.creator-shop-type-modal__option strong { margin-bottom: 2px; font-size: 13px; }
.creator-shop-type-modal__option small { overflow: hidden; color: #747d8c; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }

.shop-product-success .modal-dialog { width: min(430px, calc(100% - 28px)); max-width: 430px; margin-right: auto; margin-left: auto; }
.shop-product-success .modal-content { align-items: center; padding: 34px 28px 28px; border: 0; border-radius: 18px; text-align: center; box-shadow: 0 28px 70px rgba(17,30,54,.18); }
.shop-product-success__icon { display: grid; width: 52px; height: 52px; margin-bottom: 15px; place-items: center; border-radius: 50%; background: #e8f7ee; color: #198754; font-size: 23px; }
.shop-product-success h2 { margin: 0 0 7px; color: #292f39; font-size: 22px; font-weight: 700; }
.shop-product-success p { margin: 0 0 22px; color: #6f7888; font-size: 13px; }
.shop-product-success__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; }
.shop-product-success__primary,
.shop-product-success__secondary { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 9px 12px; border-radius: 9px; font-size: 12px; font-weight: 700; text-decoration: none; }
.shop-product-success__primary { background: #173fc2; color: #fff; }
.shop-product-success__secondary { border: 1px solid #dce1e8; background: #fff; color: #343b48; }
.shop-product-success__primary:hover { background: #0e329e; color: #fff; text-decoration: none; }
.shop-product-success__secondary:hover { background: #f7f8fa; color: #202633; text-decoration: none; }

@media (max-width: 991.98px) {
  .shop-product-editor { max-width: 820px; padding-top: 22px; }
  .shop-product-form__grid { grid-template-columns: minmax(0, 1fr) minmax(270px, .72fr); gap: 16px; }
  .shop-product-form__section { padding: 18px; }
}

@media (max-width: 767.98px) {
  .creator-feed-page--shop-form .creator-feed-shell-main { padding-bottom: 0; }
  .shop-product-editor { padding: 20px 16px 116px; }
  .shop-product-editor__header { margin-bottom: 18px; }
  .shop-product-editor__heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .shop-product-editor__heading h1 { font-size: 28px; }
  .shop-product-editor__change { padding-left: 0; }
  .shop-product-form__grid { display: block; }
  .shop-product-form__aside { margin-top: 18px; }
  .shop-product-form__section--sticky { position: static; }
  .shop-product-form__row { grid-template-columns: 1fr; gap: 0; }
  .shop-product-form__section-heading { display: block; }
  .shop-product-form__section-heading small { display: block; margin-top: 5px; text-align: left; }
  .shop-product-form__existing-media { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .creator-shop-type-modal .modal-dialog { min-height: calc(100% - 24px); margin-top: 12px; margin-bottom: 12px; }
  .creator-shop-type-modal .modal-content { max-height: calc(100vh - 24px); padding: 22px 18px; overflow-y: auto; }
  .creator-shop-type-modal__heading { padding-right: 34px; }
}

.creator-post-composer-existing-media {
  width: 100%;
  margin: 0 0 12px;
}

.creator-post-composer-existing-media__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(116px, 1fr));
  gap: 10px;
}

.creator-post-composer-existing-media__item {
  position: relative;
  min-height: 96px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 8px;
  background: #f8fafc;
  color: #334155;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px;
  font-size: 13px;
}

.creator-post-composer-existing-media__item img,
.creator-post-composer-existing-media__item video {
  width: 100%;
  height: 100%;
  min-height: 96px;
  display: block;
  object-fit: cover;
}

.creator-post-composer-existing-media__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 30px;
  background: rgba(15, 23, 42, 0.18);
}

.creator-post-composer-existing-media__icon {
  color: #2563eb;
  font-size: 20px;
}

/* Admin promoted profiles for post composer and feed cards. */
body.promoted-profile-modal-open {
  overflow: hidden;
}

.creator-promoted-profile-modal[hidden],
.creator-promoted-selection[hidden] {
  display: none !important;
}

.creator-promoted-profile-modal {
  position: fixed;
  inset: 0;
  z-index: 1095;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px;
}

.creator-promoted-profile-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12, 18, 28, 0.58);
}

.creator-promoted-profile-modal__dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(560px, calc(100vw - 32px));
  max-height: min(680px, calc(100vh - 48px));
  overflow: hidden;
  border: 1px solid rgba(22, 35, 55, 0.12);
  border-radius: 8px;
  background: var(--auth-surface-2);
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.26);
}

.creator-promoted-profile-modal__header,
.creator-promoted-profile-modal__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px;
  border-bottom: 1px solid rgba(22, 35, 55, 0.08);
}

.creator-promoted-profile-modal__footer {
  border-top: 1px solid rgba(22, 35, 55, 0.08);
  border-bottom: 0;
}

.creator-promoted-profile-modal__header h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.25;
}

.creator-promoted-profile-modal__header p {
  margin: 4px 0 0;
  color: #667085;
  font-size: 13px;
  line-height: 1.35;
}

.creator-promoted-profile-modal__close,
.creator-promoted-selection__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #475467;
}

.creator-promoted-profile-modal__body {
  min-height: 0;
  overflow: auto;
  padding: 16px 18px;
}

.creator-promoted-profile-modal__search {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid rgba(22, 35, 55, 0.13);
  border-radius: 8px;
  background: #f8fafc;
}

.creator-promoted-profile-modal__search .form-control {
  height: 42px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.creator-promoted-profile-modal__results {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.creator-promoted-profile-modal__empty {
  padding: 22px 14px;
  border: 1px dashed rgba(22, 35, 55, 0.16);
  border-radius: 8px;
  color: #667085;
  text-align: center;
  font-size: 14px;
}

.creator-promoted-profile-result {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 64px;
  padding: 10px 12px;
  border: 1px solid rgba(22, 35, 55, 0.1);
  border-radius: 8px;
  background: var(--auth-surface-2);
  color: #172033;
  text-align: left;
}

.creator-promoted-profile-result:hover,
.creator-promoted-profile-result.is-selected {
  border-color: #315efb;
  background: #f4f7ff;
}

.creator-promoted-profile-result__avatar,
.creator-promoted-selection__avatar,
.creator-promoted-profile__avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  background: #eef2f7;
}

.creator-promoted-profile-result__identity,
.creator-promoted-selection__identity,
.creator-promoted-profile__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.creator-promoted-profile-result__identity strong,
.creator-promoted-selection__identity strong,
.creator-promoted-profile__copy strong {
  overflow: hidden;
  color: #172033;
  font-size: 14px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-promoted-profile-result__identity small,
.creator-promoted-selection__identity span,
.creator-promoted-profile__copy small {
  overflow: hidden;
  color: #667085;
  font-size: 12px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-promoted-profile-result__check {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: transparent;
}

.creator-promoted-profile-result.is-selected .creator-promoted-profile-result__check {
  background: #315efb;
  color: #fff;
}

.creator-promoted-profile-modal__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.creator-promoted-selection {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
  margin: 10px 0 4px;
}

.creator-promoted-selection__item {
  display: inline-grid;
  grid-template-columns: 32px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 8px;
  max-width: min(100%, 260px);
  padding: 6px 7px;
  border: 1px solid rgba(22, 35, 55, 0.1);
  border-radius: 8px;
  background: #f8fafc;
}

.creator-promoted-selection__avatar {
  width: 32px;
  height: 32px;
}

.creator-promoted-selection__remove {
  width: 28px;
  height: 28px;
  flex-basis: 28px;
}

.creator-promoted-profiles {
  display: grid;
  gap: 10px;
  padding: 10px 0;
}

.creator-promoted-profile {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  align-items: end;
  min-height: 112px;
  overflow: hidden;
  border: var(--auth-border);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
  background: #eef2f7;
}

.creator-promoted-profile:hover {
  color: inherit;
  text-decoration: none;
}

.creator-promoted-profile__cover {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
}

.creator-promoted-profile__cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.1), rgba(15, 23, 42, 0.72));
}

.creator-promoted-profile__cover--fallback {
  background:
    linear-gradient(135deg, #eef2f7 0%, #d8e1ec 45%, #b8c3d1 100%);
}

.creator-promoted-profile__identity,
.creator-promoted-profile__open {
  position: relative;
  z-index: 1;
}

.creator-promoted-profile__identity {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 10px;
  padding: 14px;
}

.creator-promoted-profile__avatar {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  border: 2px solid rgba(255, 255, 255, 0.85);
}

.creator-promoted-profile__copy strong,
.creator-promoted-profile__copy small {
  color: #fff;
  text-shadow: 0 1px 2px rgba(15, 23, 42, 0.28);
}

.creator-promoted-profile__open {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin: 0 12px 14px 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.9);
  color: #172033;
}

html[data-theme="dark"] .creator-promoted-profile-modal__dialog,
html[data-theme="dark"] .creator-promoted-profile-result {
  border-color: rgba(255, 255, 255, 0.12);
  background: #171b24;
  color: #f8fafc;
}

html[data-theme="dark"] .creator-promoted-profile-modal__search,
html[data-theme="dark"] .creator-promoted-selection__item {
  border-color: rgba(255, 255, 255, 0.12);
  background: #202635;
}

html[data-theme="dark"] .creator-promoted-profile-modal__header,
html[data-theme="dark"] .creator-promoted-profile-modal__footer {
  border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .creator-promoted-profile-result__identity strong,
html[data-theme="dark"] .creator-promoted-selection__identity strong {
  color: #f8fafc;
}

@media (max-width: 575.98px) {
  .creator-promoted-profile-modal {
    align-items: stretch;
    padding: 10px;
  }

  .creator-promoted-profile-modal__dialog {
    max-height: calc(100vh - 20px);
  }

  .creator-promoted-profile-modal__header,
  .creator-promoted-profile-modal__footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .creator-promoted-profile-modal__actions {
    width: 100%;
  }

  .creator-promoted-profile-modal__actions .btn {
    flex: 1 1 0;
  }

  .creator-promoted-selection__item {
    max-width: 100%;
  }

  .creator-promoted-profiles {
    padding-right: 12px;
    padding-left: 12px;
  }

  .creator-promoted-profile {
    min-height: 104px;
  }
}

/* Product detail: scoped to the Figma product composition. */
.shop-product-detail {
  width: 100%;
  margin: 0;
  padding: 4px clamp(18px, 2.25vw, 34px) 56px;
  color: var(--text-primary, #172033);
}

.shop-product-detail-guest .shop-product-detail {
  width: min(100%, 1180px);
  margin: 0 auto;
  padding-top: 28px;
}

.shop-product-detail__intro {
  margin-bottom: 20px;
}

.shop-product-detail__back {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--border-color, rgba(15, 23, 42, .08));
  border-radius: 999px;
  background: var(--bg-muted, #f4f5f7);
  color: var(--text-primary, #172033);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}

.shop-product-detail__back:hover {
  color: var(--text-primary, #172033);
  text-decoration: none;
}

.shop-product-detail__layout {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(300px, 2fr);
  align-items: start;
  gap: clamp(30px, 4vw, 58px);
}

.shop-product-gallery {
  min-width: 0;
}

.shop-product-gallery__stage {
  position: relative;
  width: 100%;
  aspect-ratio: 1.6 / 1;
  overflow: hidden;
  border-radius: 16px;
  background: var(--bg-muted, #f3f5f8);
}

.shop-product-gallery__lightbox,
.shop-product-gallery__lightbox img {
  display: block;
  width: 100%;
  height: 100%;
}

.shop-product-gallery__lightbox img {
  object-fit: cover;
}

.shop-product-gallery__controls {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  align-items: center;
  gap: 12px;
  margin-top: 14px;
}

.shop-product-gallery__thumbs {
  display: flex;
  justify-content: center;
  gap: 10px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px;
  scrollbar-width: none;
}

.shop-product-gallery__thumbs::-webkit-scrollbar {
  display: none;
}

.shop-product-gallery__arrow,
.shop-product-gallery__thumb {
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-primary, #172033);
  cursor: pointer;
}

.shop-product-gallery__arrow {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  font-size: 18px;
}

.shop-product-gallery__arrow:hover {
  background: var(--bg-muted, #f4f5f7);
}

.shop-product-gallery__thumb {
  flex: 0 0 62px;
  width: 62px;
  height: 48px;
  overflow: hidden;
  border: 2px solid transparent;
  border-radius: 8px;
  background: var(--bg-muted, #f3f5f8);
}

.shop-product-gallery__thumb.is-active {
  border-color: var(--primary-color, #143db9);
}

.shop-product-gallery__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shop-product-summary {
  min-width: 0;
  padding: 0;
}

.shop-product-summary__heading h1 {
  margin: 0 0 10px;
  color: var(--text-primary, #172033);
  font-size: clamp(26px, 2.5vw, 26px);
  line-height: 1.12;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}

.shop-product-summary__description {
  margin: 0;
  color: var(--text-secondary, #667085);
  font-size: 14px;
  line-height: 1.55;
}

.shop-product-summary__seller {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 22px;
  color: var(--text-primary, #172033);
  text-decoration: none;
}

.shop-product-summary__seller:hover {
  color: var(--text-primary, #172033);
  text-decoration: none;
}

.shop-product-summary__avatar {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  overflow: hidden;
  border-radius: 50%;
  background: var(--bg-muted, #f3f5f8);
}

.shop-product-summary__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.shop-product-summary__creator-copy {
  display: grid;
  gap: 2px;
}

.shop-product-summary__creator-name {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.shop-product-summary__creator-name strong {
  font-size: 14px;
  line-height: 1.25;
}

.shop-product-summary__creator-copy small {
  color: var(--text-secondary, #667085);
  font-size: 12px;
}

.shop-product-summary__verified {
  color: #2854d8;
  font-size: 14px;
}

.shop-product-summary__price-row {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin: 28px 0 14px;
}

.shop-product-summary__price {
  color: var(--text-primary, #172033);
  font-size: 20px;
  line-height: 1;
  letter-spacing: -.025em;
}

.shop-product-summary__price-row > span {
  color: var(--text-secondary, #667085);
  font-size: 12px;
  font-weight: 600;
}

.shop-product-summary__actions {
  margin: 0;
}

.shop-product-summary__manage-actions {
  display: grid;
  gap: 10px;
}

.shop-product-summary__delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid rgba(190, 55, 67, .35);
  border-radius: 8px;
  background: transparent;
  color: #b42332;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}

.shop-product-summary__delete:hover,
.shop-product-summary__delete:focus {
  background: rgba(190, 55, 67, .07);
  color: #8f1d2a;
}

.shop-product-delete-modal__submit {
  background: #b42332;
  border-color: #b42332;
  color: #fff;
}

.shop-product-delete-modal__submit:hover,
.shop-product-delete-modal__submit:focus {
  background: #8f1d2a;
  border-color: #8f1d2a;
  color: #fff;
}

.shop-product-delete-modal__error {
  margin-top: 12px;
  padding: 9px 10px;
  border-radius: 6px;
  background: #fff1f2;
  color: #b42332;
  font-size: 12px;
}

.shop-product-summary__primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 46px;
  padding: 0 18px;
  border: 0;
  border-radius: 8px;
  background: var(--primary-color, #143db9);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}


.shop-product-summary__primary.is-disabled {
  cursor: not-allowed;
  opacity: .55;
}

.shop-product-summary__meta {
  display: grid;
  gap: 11px;
  margin-top: 22px;
  padding: 0;
}

.shop-product-summary__meta > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 22px;
  color: var(--text-secondary, #667085);
  font-size: 13px;
}

.shop-product-summary__meta i {
  width: 17px;
  color: var(--text-muted, #98a2b3);
  text-align: center;
}

.shop-product-summary__meta a {
  color: inherit;
  text-decoration: none;
}

.shop-product-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 11px;
  margin-top: 18px;
}

.shop-product-tags a {
  padding: 0;
  background: transparent;
  color: var(--primary-color, #143db9);
  font-size: 13px;
  text-decoration: none;
}

.shop-product-summary__share {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-top: 20px;
  color: var(--text-secondary, #667085);
  font-size: 13px;
}

.shop-product-summary__share a {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  color: var(--text-primary, #172033);
  font-size: 14px;
  text-decoration: none;
}

.shop-product-summary__share a:hover {
  background: var(--bg-muted, #f4f5f7);
  color: var(--primary-color, #143db9);
}

.shop-product-summary__report {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 16px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #d14343;
  font-size: 12px;
  cursor: pointer;
}

.shop-product-related {
  margin-top: 72px;
  padding-top: 28px;
  border-top: 1px solid var(--border-color, rgba(15, 23, 42, .08));
}

.shop-product-related__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.shop-product-related__heading h2 {
  margin: 0;
  color: var(--text-primary, #172033);
  font-size: 19px;
  letter-spacing: -.02em;
}

.shop-product-related__heading > a {
  color: var(--text-secondary, #667085);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}

.shop-product-related__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 991.98px) {
  .shop-product-detail {
    padding: 18px 18px 52px;
  }

  .shop-product-detail__layout {
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 1fr);
    gap: 28px;
  }
}

@media (max-width: 767.98px) {
  .shop-product-detail {
    padding: 14px 16px 38px;
  }

  .shop-product-detail__intro {
    margin-bottom: 14px;
  }

  .shop-product-detail__layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  .shop-product-gallery,
  .shop-product-summary {
    width: 100%;
  }

  .shop-product-gallery__stage {
    aspect-ratio: 1.6 / 1;
    border-radius: 13px;
  }

  .shop-product-gallery__controls {
    grid-template-columns: 30px minmax(0, 1fr) 30px;
    gap: 8px;
    margin-top: 10px;
  }

  .shop-product-gallery__arrow {
    width: 30px;
    height: 30px;
  }

  .shop-product-gallery__thumb {
    flex-basis: 56px;
    width: 56px;
    height: 43px;
  }

  .shop-product-summary__heading h1 {
    font-size: 28px;
  }

  .shop-product-summary__seller {
    margin-top: 18px;
  }

  .shop-product-summary__price-row {
    margin-top: 24px;
  }

  .shop-product-summary__primary {
    min-height: 48px;
  }

  .shop-product-related {
    margin-top: 48px;
  }

  .shop-product-related__grid {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 2px 2px 10px;
    scroll-snap-type: x proximity;
  }

  .shop-product-related__grid > div {
    flex: 0 0 min(78vw, 280px);
    scroll-snap-align: start;
  }
}

@media (max-width: 575.98px) {
  .shop-product-detail__back {
    min-height: 34px;
    padding: 0 12px;
    font-size: 12px;
  }

  .shop-product-summary__price {
    font-size: 20px;
  }
}
@font-face {
  font-family: 'ABC Oracle';
  src: url('/public/fonts/abc-oracle/ABCOracleTrial-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ABC Oracle';
  src: url('/public/fonts/abc-oracle/ABCOracleTrial-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --creator-font-family: 'ABC Oracle', Arial, sans-serif;
  --auth-sidebar-width: 280px;
  --auth-sidebar-width-compact: 240px;
  --auth-shell-gap: 18px;
  --auth-right-rail-width: 320px;
  /* Compatibility aliases for existing shared workspace components. */
  --creator-sidebar-width: var(--auth-sidebar-width);
  --creator-sidebar-width-tablet: var(--auth-sidebar-width-compact);
  --creator-right-sidebar-width: var(--auth-right-rail-width);
  --creator-workspace-max-width: 1440px;
  --creator-workspace-gutter: 20px;
  --creator-workspace-grid-gap: var(--auth-shell-gap);
  --creator-font-size-xs: 14px;
  --creator-font-size-sm: 15px;
  --creator-font-size-base: 14px;
  --creator-font-size-md: 17px;
  --creator-font-size-lg: 18px;
  --creator-font-size-xl: 20px;
  --creator-font-size-2xl: 24px;
  --creator-font-weight-regular: 400;
  --creator-font-weight-medium: 500;
  --creator-font-weight-semibold: 600;
  --creator-font-weight-bold: 700;
  --font-size-2xs: 12px;
  --font-size-xs: 13px;
  --font-size-sm: 14px;
  --font-size-base: 18px;
  --font-size-body: 16px;
  --font-size-md: 18px;
  --font-size-lg: 20px;
  --font-size-xl: 22px;
  --font-size-2xl: 24px;
  --text-icon-micro-size: 7px;
  --text-tiny-size: 8px;
  --text-badge-size: 9px;
  --text-caption-size: var(--font-size-2xs);
  --text-micro-size: var(--font-size-xs);
  --text-meta-size: var(--font-size-sm);
  --text-table-size: 12.5px;
  --text-body-size: var(--creator-font-size-base);
  --text-label-size: var(--font-size-sm);
  --text-button-size: var(--font-size-sm);
  --text-card-title-size: var(--font-size-base);
  --text-control-size: 15px;
  --text-lead-size: var(--font-size-md);
  --text-section-title-size: var(--font-size-lg);
  --text-subtitle-size: var(--font-size-xl);
  --text-modal-title-size: 22px;
  --text-page-title-size: var(--font-size-lg);
  --text-display-title-size: 28px;
  --text-lock-icon-size: 30px;
  --text-fluid-title-size: clamp(20px, 2vw, 24px);
  --text-fluid-page-title-size: clamp(24px, 2vw, 26px);
  --leading-tight: 1.2;
  --leading-snug: 1.35;
  --leading-normal: 1.5;
  --leading-relaxed: 1.6;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --shadow-sm: 0 4px 12px rgba(15, 23, 42, 0.08);
  --shadow-card: 0 8px 24px rgba(15, 23, 42, 0.08);
  --shadow-modal: 0 24px 60px rgba(15, 23, 42, 0.22);
  --control-height-sm: 32px;
  --control-height-md: 40px;
  --control-height-lg: 48px;
}

/* Wallet Figma parity: keep the role-specific cards visually balanced. */
.creator-wallet-page .creator-wallet-content {
  max-width: 1180px;
  gap: 30px;
}

.creator-wallet-page .creator-wallet-overview-grid--campaigner {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  grid-auto-rows: 1fr;
  gap: 22px;
}

.creator-wallet-page .creator-wallet-section {
  min-width: 0;
  height: 100%;
}

.creator-wallet-page .creator-wallet-section-header {
  min-height: 50px;
}

.creator-wallet-page .creator-wallet-panel {
  flex: 1 1 auto;
  min-height: 254px;
  padding: 12px;
}

.creator-wallet-page .creator-wallet-balance-card {
  height: 164px;
  min-height: 164px;
  padding: 18px;
}

.creator-wallet-page .creator-wallet-balance-copy {
  max-width: calc(100% - 20px);
}

.creator-wallet-page .creator-wallet-balance-copy p {
  margin-top: 22px;
}

.creator-wallet-page .creator-wallet-balance-card--campaign {
  background: #fff;
  color: #17356f;
}

.creator-wallet-page .creator-wallet-balance-card--campaign .creator-wallet-balance-name-label,
.creator-wallet-page .creator-wallet-balance-card--campaign .creator-wallet-balance-copy h2,
.creator-wallet-page .creator-wallet-balance-card--campaign .creator-wallet-balance-copy p {
  color: #17356f;
}

.creator-wallet-page .creator-wallet-balance-card--campaign .creator-wallet-balance-amount strong,
.creator-wallet-page .creator-wallet-balance-card--campaign .creator-wallet-balance-amount small {
  color: #17356f;
}

.creator-wallet-page .creator-wallet-balance-card--campaign .creator-wallet-balance-art {
  color: rgba(23, 53, 111, 0.07);
}

.creator-wallet-page .creator-wallet-actions {
  min-height: 42px;
  margin-top: auto;
  align-items: stretch;
}

.creator-wallet-page .creator-wallet-actions > .creator-wallet-fund-trigger,
.creator-wallet-page .creator-wallet-actions > .creator-wallet-withdraw-trigger {
  min-width: 0;
  min-height: 38px;
  white-space: nowrap;
}

.creator-wallet-page .creator-wallet-section--campaign .creator-wallet-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.creator-wallet-page .creator-wallet-section--campaign .creator-wallet-actions > * {
  padding-left: 8px;
  padding-right: 8px;
  gap: 6px;
  font-size: 12px;
}

.creator-wallet-page .creator-wallet-section--personal .creator-wallet-actions > * {
  flex: 1 1 0;
}

.creator-wallet-page .creator-wallet-transactions {
  margin-top: 2px;
}

@media (max-width: 991.98px) and (min-width: 768px) {
  .creator-wallet-page .creator-wallet-content {
    max-width: 960px;
  }

  .creator-wallet-page .creator-wallet-overview-grid--campaigner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .creator-wallet-page .creator-wallet-content {
    max-width: none;
    gap: 24px;
  }

  .creator-wallet-page .creator-wallet-overview-grid--campaigner {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .creator-wallet-page .creator-wallet-section-header {
    min-height: 0;
  }

  .creator-wallet-page .creator-wallet-panel {
    min-height: 0;
  }

  .creator-wallet-page .creator-wallet-section--campaign .creator-wallet-actions {
    display: flex;
  }

  .creator-wallet-page .creator-wallet-section--campaign .creator-wallet-actions > * {
    flex: 1 1 0;
  }
}

/* =========================================================
   CREATORSCRIB AUTHENTICATED UI
   Ownership map: tmp/css-audit/css-module-map.md
   Keep shared tokens/base/layout before page modules; keep
   responsive and dark-mode overrides in their scoped blocks.
   ========================================================= */

/* Normal User For You only: compact, consistent Figma content polish. */
.creator-feed-page--home .creator-feed-normal-user-for-you{--normal-gap:14px;--normal-radius:16px;--normal-shadow:0 8px 22px rgba(15,23,42,.055)}
.creator-feed-page--home .creator-feed-normal-user-for-you .grid-updates{gap:var(--normal-gap)}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;padding:12px 14px 12px 16px;border-radius:var(--normal-radius);}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-promo-kicker{margin-bottom:2px;font-size:var(--text-caption-size);line-height:1.2}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion p{max-width:480px;font-size:var(--text-meta-size);line-height:1.35}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-secondary-btn{display:inline-flex;align-items:center;justify-content:center;min-width:122px;min-height:34px;padding:7px 13px;border-radius:9px;font-size:var(--text-micro-size);font-weight:500;line-height:1}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-card{margin:0;overflow:hidden;border:1px solid var(--border-color);border-radius:var(--normal-radius);}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-card-body{padding:15px 16px 13px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-header{margin-bottom:0}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-header .avatarUser{width:46px;height:46px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-header .mr-3{margin-right:11px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-card .container-post-media{margin-top:11px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-card .footer-updates{margin-top:12px;padding-top:10px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery{
    padding:14px 0 13px;
    
}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-heading{align-items:center;margin-bottom:10px;padding:0 14px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-heading h3{margin-top:2px;font-size:var(--text-card-title-size);font-weight:650;line-height:1.25}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-link{font-size:var(--text-micro-size);font-weight:600}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-control{width:28px;height:28px;border-radius:var(--radius-sm)}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel{gap:10px;padding:0 14px 2px;scroll-padding-inline:14px;scroll-behavior:smooth}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel-card{
 /* height:320px;*/
  min-height:246px;
  gap:0;
  border-radius:13px;
  box-shadow:none;
  transition:transform .18s ease,box-shadow .18s ease
}
.creator-user-for-you-campaign-owner small{
  font-size: var(--text-body-size);
}


.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-campaign-media,.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-product-media{border-radius:12px 12px 0 0;}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-campaign-copy,
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-product-copy{
  padding:12px;
}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-campaign-title,.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-product-title{font-size:var(--text-meta-size);line-height:1.25}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-campaign-copy p,
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-product-copy p{
  display:-webkit-box;
  overflow:hidden;
  margin-top:3px;
  font-size:var(--text-meta-size);
  line-height:1.35;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  min-height: 40px;
}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-product-meta{padding:6px 11px 0}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel-actions{padding:8px 11px 10px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel-actions .creator-feed-secondary-btn{display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:30px;padding:6px 9px;border-radius:var(--radius-sm);font-size:var(--text-caption-size);font-weight:500;line-height:1}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-feed-normal-products-carousel{align-items:stretch;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card{flex:0 0 calc((100% - 20px) / 2.65);min-width:190px;min-height:266px;scroll-snap-align:start;box-shadow:none}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__media{height:148px;flex:0 0 148px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__body{padding:8px 9px 0;gap:3px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__title{font-size:var(--text-meta-size);line-height:1.25; padding: 10px auto;}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__seller{font-size:var(--text-table-size)}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__body p{font-size:var(--text-table-size);line-height:1.3;min-height:30px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__price{font-size:var(--text-meta-size)}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__footer{padding:8px 9px 9px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card__action{min-height:26px;padding:0 9px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-normal-creator-card{flex:0 0 188px;min-width:188px;height:210px;min-height:210px;text-align:center}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-carousel-profile{align-items:center;gap:3px;padding:14px 12px 0}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-carousel-profile img{width:64px;height:64px;margin-bottom:4px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-carousel-profile strong{margin:0;font-size:var(--text-meta-size);line-height:1.25}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-carousel-profile small{font-size:var(--text-caption-size);line-height:1.25}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-carousel-actions{padding:10px 12px 12px}
@media(max-width:767.98px){.creator-feed-page--home .creator-feed-normal-user-for-you{--normal-gap:12px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion{
    grid-template-columns:minmax(0,1fr);
    gap:9px;
    min-height:0;
    padding:12px;
    margin: 8px 15px;
}
    .creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion p{font-size:var(--text-micro-size)}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-secondary-btn{width:100%;min-height:32px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-post-card-body{padding:13px 12px 12px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery{padding: 8px 15px;}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-heading,.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel{padding-left:0;padding-right:0}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-campaign-card,.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-product-card{flex-basis:300px;min-width:224px}.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-normal-creator-card{flex-basis:176px;min-width:176px;height:202px;min-height:202px}
.creator-feed-page--home .creator-feed-normal-user-for-you .creator-feed-normal-shop-products .creator-shop-card{flex-basis:72%;min-width:216px;max-width:260px}}

/* Creator profile access gate: safe teaser only for unauthorized visitors. */
.creator-profile-locked {
  display: block;
  width: 100%;
  min-width: 0;
  overflow: hidden;
  padding: 0;
}
.creator-profile-locked.creator-profile-content-card { display: block; align-items: stretch; padding: 0; }
.creator-profile-lock-banner {
  display: flex; align-items: center; gap: .55rem; min-height: 48px;
  padding: 12px 16px; border-bottom: 1px solid var(--creator-feed-border, rgba(0,0,0,.08));
  color: var(--creator-feed-text, #20232a); font-weight: 600;
}
.creator-profile-locked-post__header {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  width: 100%; min-width: 0; padding: 14px 16px;
}
.creator-profile-locked-post__identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.creator-profile-locked-post__avatar { width: 44px; height: 44px; flex: 0 0 44px; border-radius: 50%; object-fit: cover; }
.creator-profile-locked-post__meta { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.creator-profile-locked-post__meta strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--text-card-title-size); }
.creator-profile-locked-post__meta small { color: var(--text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.creator-profile-locked-post__verified { margin-left: 5px; color: var(--brand-primary, #00167a); }
.creator-profile-locked-preview { position: relative; display: block; width: 100%; min-width: 0; min-height: 280px; background: var(--creator-feed-surface-muted, #f4f5f7); }
.creator-profile-locked-post__teaser {
  position: absolute; inset: 0; overflow: hidden;
  background:
    radial-gradient(ellipse at 22% 30%, rgba(255,255,255,.58) 0 13%, transparent 14%),
    radial-gradient(ellipse at 72% 36%, rgba(255,255,255,.34) 0 18%, transparent 19%),
    linear-gradient(135deg, #9aa5b5 0%, #d3d8df 45%, #7d8898 100%);
  filter: blur(1px) saturate(.7);
}
.creator-profile-locked-post__teaser::before {
  content: ''; position: absolute; border-radius: 22px;
  background: rgba(28,39,57,.2); filter: blur(14px); width: 52%; height: 70%; left: 8%; top: 18%; transform: rotate(-8deg); }
.creator-profile-locked-post__teaser::after {
  content: ''; position: absolute; border-radius: 22px;
  background: rgba(28,39,57,.2); filter: blur(14px); width: 42%; height: 82%; right: 7%; top: 5%; transform: rotate(12deg); }
.creator-profile-locked-post__lock {
  position: absolute; inset: 0; display: grid; place-items: center;
  color: rgba(255,255,255,.96); font-size: var(--text-display-title-size); text-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.creator-profile-locked-preview__surface {
  display: grid; place-items: center; width: 100%; min-height: 280px; color: rgba(32,35,42,.5);
  background: linear-gradient(135deg, rgba(0,0,0,.06), rgba(255,255,255,.18)); font-size: var(--text-display-title-size);
}
.creator-profile-locked-post__cta {
  position: absolute; right: 0; bottom: 0; left: 0; display: flex; align-items: center;
  justify-content: space-between; gap: 16px; width: 100%; min-width: 0; padding: 16px; color: #fff;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.78));
}
.creator-profile-locked-post__cta-copy { display: flex; flex: 1 1 auto; min-width: 0; flex-direction: column; gap: 3px; }
.creator-profile-locked-post__cta-copy strong { font-size: var(--text-card-title-size); line-height: 1.35; white-space: normal; word-break: normal; overflow-wrap: break-word; }
.creator-profile-locked-post__cta-copy small { color: rgba(255,255,255,.78); line-height: 1.35; white-space: normal; word-break: normal; overflow-wrap: break-word; }
.creator-profile-locked-post__cta .creator-profile-subscribe-btn { width: auto; min-width: 96px; max-width: none; flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 767px) {
  .creator-profile-locked-preview, .creator-profile-locked-preview__surface, .creator-profile-locked-post__teaser { min-height: 220px; }
  .creator-profile-locked-post__header { padding: 12px; }
  .creator-profile-locked-post__cta { gap: 10px; padding: 12px; }
  .creator-profile-locked-post__cta-copy strong { font-size: var(--text-body-size); }
}

html[data-theme="light"] {
  --auth-bg: #ffffff;
  --auth-surface-1: #ffffff;
  --auth-surface-2: #ffffff;
  --auth-surface-3: #eef2f7;
  --auth-surface-elevated: #ffffff;
  --auth-border: #dde4ee;
  --auth-border-strong: #cfd8e5;
  --auth-text-primary: #14213d;
  --auth-text-secondary: #6b7280;
  --auth-text-muted: #6b7280;
  --auth-accent: #16213e;
  --auth-accent-hover: #0f172a;
  --auth-accent-soft: rgba(22, 33, 62, 0.08);
  --auth-success: #15803d;
  --auth-warning: #b45309;
  --auth-danger: #b42318;
  --auth-overlay: rgba(15, 23, 42, 0.48);
  --auth-shadow: 0 18px 35px rgba(15, 23, 42, 0.06);
  --auth-input-bg: #ffffff;
  --auth-control-bg: #eef2f7;
  --auth-control-hover: #e4ebf5;
  --auth-card-radius: 24px;
  --bg-page: #ffffff;
  --bg-sidebar: #ffffff;
  --bg-card: #ffffff;
  --bg-muted: #eef2f7;
  --text-primary: #333333;
  --text-secondary: #666666;
  --text-muted: #6b7280;
  --border-color: #dde4ee;
  --brand-primary: #00167A;
  --brand-primary-hover: #00167A;
  --shadow-card: 0 18px 35px rgba(15, 23, 42, 0.06);
  --color-media-wrapper: #f1f1f1;
  --color-pulse-media-wrapper: #f8f8f8;
}

html[data-theme="dark"] {
  --auth-bg: #14233B;
  --auth-surface-1: #0f1b30;
  --auth-surface-2: #14233b;
  --auth-surface-3: #1b2b45;
  --auth-surface-elevated: #1f3150;
  --auth-border: rgba(144, 165, 197, 0.18);
  --auth-border-strong: rgba(144, 165, 197, 0.28);
  --auth-text-primary: #e7eef8;
  --auth-text-secondary: #aab7cb;
  --auth-text-muted: #8795ac;
  --auth-accent: #5b7cff;
  --auth-accent-hover: #7390ff;
  --auth-accent-soft: rgba(91, 124, 255, 0.16);
  --auth-success: #34d399;
  --auth-warning: #fbbf24;
  --auth-danger: #fb7185;
  --auth-overlay: rgba(2, 6, 23, 0.72);
  --auth-shadow: 0 22px 44px rgba(2, 6, 23, 0.38);
  --auth-input-bg: #111f36;
  --auth-control-bg: #17263f;
  --auth-control-hover: #203350;
  --auth-card-radius: 24px;
  --bg-page: var(--auth-bg);
  --bg-sidebar: var(--auth-surface-1);
  --bg-card: var(--auth-surface-2);
  --bg-muted: var(--auth-surface-3);
  --text-primary: var(--auth-text-primary);
  --text-secondary: var(--auth-text-secondary);
  --text-muted: var(--auth-text-muted);
  --border-color: var(--auth-border);
  --brand-primary: var(--auth-accent);
  --brand-primary-hover: var(--auth-accent-hover);
  --shadow-card: var(--auth-shadow);
  --color-media-wrapper: #454545;
  --color-pulse-media-wrapper: #373737;
}

html[data-theme] body {
  background: var(--bg-page);
}

html {
  height: auto;
  min-height: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  height: auto;
  min-height: 100%;
  max-width: 100%;
  overflow-x: clip;
}

main[role="main"] {
  min-height: 0;
  height: auto;
  max-height: none;
  overflow: visible;
}

a:hover{
  color: inherit !important;
  text-decoration: none;
}
.creator-campaign-asset-list a:hover{
  color: #fff!important;
}

@media (min-width: 992px) {
  .creator-feed-page[data-authenticated-shell="true"] {
    padding-top: 0;
    padding-bottom: 0;
  }

  .creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell-main,
  .creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell-right {
    padding-top: 24px;
    padding-bottom: 92.5px;
  }
}

.creator-feed-page h1,
.creator-feed-page h2,
.creator-feed-page h3,
.creator-feed-page h4,
.creator-feed-page h5,
.creator-feed-page h6,
.creator-feed-page strong {
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-page * {
  min-width: 0;
}

.creator-feed-page {
  min-height: 100vh;
  width: 100%;
  max-width: var(--creator-workspace-max-width);
  margin: 0 auto;
  padding: 24px 0 92px 0;
   font-family: var(--creator-font-family);
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.5;
  overflow: visible;
  min-width: 0;
}

.creator-feed-shell {
  width: 100%;
  display: grid;
  gap: var(--creator-workspace-grid-gap);
  align-items: start;
  min-height: 100vh;
  height: auto;
  overflow: visible;
}

.creator-feed-shell--three-column {
  grid-template-columns: var(--auth-sidebar-width) minmax(0, 1fr) var(--auth-right-rail-width);
}

.creator-feed-shell--two-column {
  grid-template-columns: var(--auth-sidebar-width) minmax(0, 1fr);
}

.creator-feed-shell-left {
  flex: 0 0 var(--auth-sidebar-width);
  width: var(--auth-sidebar-width);
  min-width: var(--auth-sidebar-width);
  max-width: var(--auth-sidebar-width);
  min-inline-size: var(--auth-sidebar-width);
  max-inline-size: var(--auth-sidebar-width);
  transform: none;
  zoom: 1;
  box-sizing: border-box;
  font-size: var(--text-body-size);
  line-height: 1.5;
  align-self: stretch;
  min-height: 100%;
  overflow: visible;
}

.creator-feed-shell-left .creator-feed-secondary-btn{
  width: 100%;
  margin-top: 12px;
  font-weight: 500;
  background: var(--brand-primary);
  color: #fff
}

.creator-feed-sticky {
  position: sticky;
  top: 12px;
  align-self: start;
  height: fit-content;
  max-height: calc(100vh - 24px);
  overflow-y: auto;
  overflow-x: visible;
}

/* Shared authenticated desktop sidebar only. */
.creator-feed-shell-left .creator-feed-sticky {
  top: 0;
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  overflow-y: auto;
  overflow-x: visible;
  border-radius: 0;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}

.creator-feed-shell-left .creator-feed-sticky:hover,
.creator-feed-shell-left .creator-feed-sticky:focus-within {
  scrollbar-color: rgba(107, 114, 128, 0.35) transparent;
}

.creator-feed-shell-left .creator-feed-sticky::-webkit-scrollbar {
  width: 4px;
}

.creator-feed-shell-left .creator-feed-sticky::-webkit-scrollbar-track {
  background: transparent;
}

.creator-feed-shell-left .creator-feed-sticky::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: var(--radius-pill);
}

.creator-feed-shell-left .creator-feed-sticky:hover::-webkit-scrollbar-thumb,
.creator-feed-shell-left .creator-feed-sticky:focus-within::-webkit-scrollbar-thumb {
  background: rgba(107, 114, 128, 0.35);
}

.creator-feed-shell-left .creator-feed-sticky::-webkit-scrollbar-button {
  display: none;
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right {
  align-self: stretch;
  min-height: 100%;
  padding-top: 0;
  padding-bottom: 0;
  overflow: visible;
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky {
  top: 24px;
  height: calc(100vh - 24px);
  height: calc(100dvh - 24px);
  max-height: calc(100dvh - 24px);
  overflow-y: auto;
  overflow-x: visible;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky:hover,
.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky:focus-within {
  scrollbar-color: rgba(107, 114, 128, 0.35) transparent;
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky::-webkit-scrollbar {
  width: 4px;
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky::-webkit-scrollbar-track {
  background: transparent;
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky::-webkit-scrollbar-thumb {
  background: transparent;
  border-radius: var(--radius-pill);
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky:hover::-webkit-scrollbar-thumb,
.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky:focus-within::-webkit-scrollbar-thumb {
  background: rgba(107, 114, 128, 0.35);
}

.creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell--three-column .creator-feed-shell-right > .creator-feed-sticky::-webkit-scrollbar-button {
  display: none;
}

.creator-feed-left-sidebar {
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  transform: none;
  zoom: 1;
}

.creator-feed-sidebar-card {
  background: linear-gradient(180deg, var(--bg-sidebar) 0%, var(--bg-card) 100%);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-xl);
  /*box-shadow: var(--shadow-card);*/
  padding: 14px;
}

.creator-feed-shell-left .creator-feed-sidebar-card {
  padding-top: 0;
  border-radius: 0;
}

.creator-feed-brand {
  margin-bottom: 14px;
}

.creator-feed-shell-left .creator-feed-brand {
  margin-top: 14px;
}

.creator-feed-sidebar-logo img {
  display: block;
  width: 100%;
  max-width: 140px;
  height: auto;
  margin: 0;
}

.creator-feed-shell-left .creator-feed-sidebar-logo img {
  width: 150px;
  max-width: 150px;
}

.creator-feed-nav {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.creator-feed-nav-link,
.creator-feed-nav-button {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--text-primary);
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 42px;
  border-radius: 14px;
  padding: 0 12px;
  font-size: var(--font-size-sm);
  line-height: 1.2;
  font-weight: 400;
  text-align: left;
}

.creator-feed-nav-link i,
.creator-feed-nav-button i {
  font-size: var(--text-control-size);
}

.creator-feed-nav-link > span:first-of-type,
.creator-feed-nav-button > span:first-of-type {
  flex: 1;
}

.creator-feed-nav-link.is-active,
.creator-feed-nav-link:hover,
.creator-feed-nav-button:hover,
.creator-feed-nav-button.is-active {
  background: rgba(63, 76, 255, 0.08);
  color: var(--brand-primary);
}

.creator-sidebar-more {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.creator-sidebar-more-toggle {
  cursor: pointer;
}

.creator-sidebar-more-toggle-icon {
  transition: transform 0.2s ease;
}

.creator-sidebar-more.is-open .creator-sidebar-more-toggle,
.creator-sidebar-more.is-open .creator-sidebar-more-toggle:hover {
  background: rgba(63, 76, 255, 0.08);
  color: var(--brand-primary);
}

.creator-sidebar-more.is-route-active .creator-sidebar-more-toggle {
  background: rgba(63, 76, 255, 0.08);
  color: var(--brand-primary);
}

.creator-sidebar-more.is-open .creator-sidebar-more-toggle-icon {
  transform: rotate(180deg);
}

.creator-sidebar-more-panel {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  background: var(--bg-card);
  
}

.creator-sidebar-more-user {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 28px 28px;
  align-items: center;
  column-gap: 8px;
  width: 100%;
  padding: 2px 2px 10px;
}

.creator-sidebar-more-user img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-sidebar-more-identity {
  min-width: 0;
  text-align: left;
}

.creator-sidebar-more-name {
  display: block;
  margin: 0;
  font-size: var(--text-body-size);
  line-height: 1.2;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.home-camp-data{
font-size: var(--text-lead-size);
}
.home-campaign{
text-align: center;
}
.creator-sidebar-more-username {
  display: block;
  margin-top: 2px;
  font-size: var(--text-micro-size);
  line-height: 1.2;
  font-weight: 400;
  color: var(--text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-sidebar-more-icon-btn {
  width: 28px;
  height: 28px;
  border: 0;
  padding: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.creator-sidebar-more-icon-btn i {
  font-size: var(--text-card-title-size);
  line-height: 1;
}

.creator-sidebar-more-icon-btn:hover {
  background: var(--bg-muted);
  color: var(--text-primary);
}

.creator-sidebar-more-nav {
  display: grid;
  gap: 2px;
}

.creator-sidebar-more form {
  display: block;
}

.creator-sidebar-more-item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 10px;
  width: 100%;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-primary);
  text-decoration: none;
  text-align: left;
}

.creator-sidebar-more-item-button {
  cursor: pointer;
}

.creator-sidebar-more-item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  font-size: var(--text-lead-size);
  line-height: 1;
  color: currentColor;
}

.creator-sidebar-more-item-icon i {
  font-size: var(--text-lead-size);
  line-height: 1;
}

.creator-sidebar-more-item-label {
  min-width: 0;
  margin: 0;
  text-align: left;
  font-size: var(--text-body-size);
  line-height: 1.2;
  font-weight: 400;
  white-space: nowrap;
}

.creator-sidebar-more-item-meta {
  margin-left: 8px;
  text-align: right;
  font-size: var(--text-micro-size);
  line-height: 1;
  font-weight: 600;
  color: var(--text-secondary);
  white-space: nowrap;
}

.creator-sidebar-more-item:hover,
.creator-sidebar-more-item:focus-visible,
.creator-sidebar-more-item.is-active,
.creator-sidebar-more-language-option:hover,
.creator-sidebar-more-language-option.is-active {
  background: var(--bg-muted);
  color: var(--brand-primary);
}

.creator-sidebar-more-language {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.creator-sidebar-more-language-current {
  font-size: var(--text-micro-size);
  line-height: 1;
  font-weight: 600;
  color: var(--text-secondary);
}

.creator-sidebar-more-language-list {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 2px 0 0;
}

.creator-sidebar-more-language-option {
  width: 100%;
  min-height: 32px;
  padding: 0 10px 0 38px;
  border-radius: 7px;
  color: var(--text-primary);
  text-decoration: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 10px;
  font-size: var(--text-body-size);
  line-height: 1.2;
  font-weight: 500;
}

.creator-sidebar-more-divider {
  height: 1px;
  margin: 8px 0;
  background: var(--border-color);
}

.creator-sidebar-more-item-logout {
  color: #b42318;
}

.creator-sidebar-more-item-logout .creator-sidebar-more-item-label {
  font-size: var(--text-body-size);
  font-weight: 600;
}

.creator-sidebar-more-item-logout:hover {
  background: rgba(180, 35, 24, 0.08);
  color: #b42318;
}
.fa-heart{
  color: #ef4444;
}

.creator-feed-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  height: 1.35rem;
  padding: 0 0.35rem;
  border-radius: var(--radius-pill);
  background: #ef4444;
  color: #fff;
  font-size: var(--text-caption-size);
  font-style: normal;
  line-height: 1;
}

.creator-auth-sidebar .creator-feed-pill {
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  font-size: var(--text-caption-size);
}

.for-you-post-btn{
  width: 88px;
  margin-top: 0;
}

.creator-feed-create-btn {
  border: 0;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: 14px;
  font-size: var(--text-meta-size);
  line-height: 1;
  font-weight: 600;
  transition: 0.2s ease;
  width: 100%;
  min-height: 44px;
  margin: 12px 0 0;
  padding: 0.95rem 1rem;
  background: var(--brand-primary);
  color: #fff;
}

.creator-feed-create-btn:hover {
  text-decoration: none;
  background: var(--brand-primary-hover);
  color: #fff;
}

.creator-sidebar-create-wrap {
  position: relative;
  margin-top: 0.5rem;
}

.creator-sidebar-create-wrap--mobile {
  margin-top: 0;
  display: inline-flex;
  justify-content: center;
}

.creator-sidebar-create-wrap .creator-feed-create-btn {
  width: 100%;
}

.creator-sidebar-create-wrap--mobile .creator-feed-create-btn {
  width: auto;
  margin: 0;
}

.creator-auth-sidebar__promo,
.creator-feed-sidebar-promo {
  margin-top: 14px;
  padding: 14px 14px 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(63, 76, 255, 0.06) 0%, rgba(63, 76, 255, 0.02) 100%);
  border: 1px solid rgba(63, 76, 255, 0.1);
}

.creator-feed-sidebar-promo p {
  margin: 0;
  font-size: var(--text-micro-size);
  line-height: 1.55;
  color: var(--text-secondary);
}

.creator-auth-sidebar__account,
.creator-feed-account-summary--sidebar {
  margin-top: 14px;
  padding: 10px 12px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  text-decoration: none;
  background: rgba(255, 255, 255, 0.6);
}

[data-theme="dark"] .creator-auth-sidebar__account:hover,
[data-theme="dark"] .creator-feed-account-summary--sidebar:hover {
  background: var(--auth-accent-soft);
}

.creator-auth-sidebar__account i,
.creator-feed-account-summary--sidebar i {
  font-size: var(--text-card-title-size);
  color: var(--text-secondary);
}

.creator-auth-sidebar__account img,
.creator-feed-account-summary--sidebar img {
  width: 40px;
  height: 40px;
}

.creator-auth-sidebar__account strong,
.creator-feed-account-summary--sidebar strong {
  font-size: var(--text-meta-size);
  line-height: 1.25;
}

.creator-auth-sidebar__account small,
.creator-feed-account-summary--sidebar small {
  margin-top: 2px;
  font-size: var(--text-caption-size);
}

.creator-workspace-page-header {
  margin-bottom: 18px;
  padding: 4px 2px 0;
}

.creator-workspace-page-title {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: var(--text-page-title-size);
  line-height: 1.15;
  font-weight: 700;
  color: var(--text-primary);
}

.creator-workspace-page-title i {
  font-size: var(--text-subtitle-size);
  color: var(--brand-primary);
}

.creator-workspace-page-subtitle {
  margin: 8px 0 0;
  font-size: var(--text-card-title-size);
  line-height: 1.6;
  color: var(--text-secondary);
}

@media (max-width: 1199.98px) {
  .creator-workspace-page-title {
    font-size: var(--text-modal-title-size);
  }
}

@media (max-width: 767.98px) {
  .creator-workspace-page-header {
    margin-bottom: 16px;
    padding-top: 6px;
  }

  .creator-workspace-page-title {
    font-size: var(--text-subtitle-size);
    gap: 8px;
  }

  .creator-workspace-page-subtitle {
    font-size: var(--text-body-size);
    line-height: 1.5;
  }
}

.creator-sidebar-create-menu {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 10px);
  z-index: 40;
  display: grid;
  gap: 4px;
  padding: 8px;
  border-radius: var(--radius-md);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  
}

.creator-sidebar-create-wrap--mobile .creator-sidebar-create-menu {
  left: 50%;
  right: auto;
  width: min(220px, calc(100vw - 24px));
  transform: translateX(-50%);
}

/* !important allowed: [hidden] must override component display contracts. */
.creator-sidebar-create-menu[hidden] {
  display: none !important;
}

.creator-sidebar-create-item {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 40px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-primary);
  text-decoration: none;
  text-align: left;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-medium);
}

.creator-sidebar-create-item:hover,
.creator-sidebar-create-item:focus-visible {
  background: var(--bg-muted);
  color: var(--brand-primary);
  text-decoration: none;
  outline: none;
}

.creator-sidebar-create-item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-lead-size);
}

.creator-sidebar-create-item-label {
  white-space: nowrap;
}

.creator-feed-promo-card {
  background: var(--bg-muted);
  border-radius: var(--radius-xl);
  padding: 1rem;
  margin-bottom: 1.25rem;
}

.creator-feed-promo-kicker,
.creator-feed-section-kicker,
.creator-feed-notice-kicker {
  display: inline-block;
  margin-bottom: 0.45rem;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  letter-spacing: 0.06em;
  text-transform: capitalize;
}

.creator-feed-promo-card h3,
.creator-feed-section-heading h3,
.creator-feed-notice-card h3 {
  margin-bottom: 0.35rem;
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-feed-promo-card p {
  margin-bottom: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.5;
}

.creator-feed-notifications-page {
  width: 100%;
}

.creator-feed-notifications-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.creator-feed-notifications-header h1 {
  margin: 0;
  font-size: var(--text-page-title-size);
  line-height: 1.15;
  font-weight: var(--creator-font-weight-bold);
  color: var(--text-primary);
}

.creator-feed-secondary-btn.creator-feed-notifications-settings-btn {
  flex: 0 0 auto;
  width: auto;
  min-width: 0;
  margin-top: 0;
  padding: 10px 22px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-semibold);
  gap: 8px;
  box-shadow: none;
}

.creator-feed-secondary-btn.creator-feed-notifications-settings-btn i {
  font-size: var(--text-card-title-size);
  line-height: 1;
}

.creator-feed-notification-announcement {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem;
  margin-bottom: 1rem;
  background: linear-gradient(135deg, #0f3d91, #143f7a);
  color: #fff;
  border-radius: var(--radius-xl);
  text-decoration: none;
  
}

.creator-feed-notification-announcement:hover {
  color: #fff;
  text-decoration: none;
}

.creator-feed-notification-announcement strong {
  display: block;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-notification-announcement span {
  display: block;
  opacity: 0.88;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-notification-filters {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 1rem;
  padding-bottom: 0.2rem;
  overflow-x: auto;
  scrollbar-width: none;
}

.creator-feed-notification-filters::-webkit-scrollbar {
  display: none;
}

.creator-feed-notification-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0.7rem 1rem;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-secondary);
  text-decoration: none;
  white-space: nowrap;
  font-size: var(--text-table-size);
  font-weight: var(--creator-font-weight-medium);
}

.creator-feed-notification-filter:hover {
  color: var(--text-primary);
  background: var(--bg-muted);
  text-decoration: none;
}

.creator-feed-notification-filter.is-active {
  color: var(--text-primary);
  background: var(--bg-muted);
  text-decoration: none;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-notification-list {
  border: 1px solid var(--border-color);
  border-radius: 24px;
  background: var(--bg-card);
  
  overflow: hidden;
}

.creator-feed-notification-row {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  width: 100%;
  padding: 1rem 1.1rem;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border-color);
  text-align: left;
}

.creator-feed-notification-row:last-child {
  border-bottom: 0;
}

.creator-feed-notification-row.is-unread {
  background: rgba(20, 33, 61, 0.05);
}

html[data-theme="dark"] .creator-feed-notification-row.is-unread {
  background: rgba(148, 163, 184, 0.08);
}

.creator-feed-notification-row.is-loading {
  pointer-events: none;
}

.creator-feed-notification-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  min-width: 46px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--bg-muted);
}

.creator-feed-notification-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-feed-notification-copy {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  gap: 0.28rem;
}

.creator-feed-notification-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  font-size: var(--text-body-size);
  color: var(--text-primary);
}

.creator-feed-notification-target {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-notification-actor {
  color: var(--text-primary);
  text-decoration: none;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-notification-target-btn {
  padding: 0;
  background: transparent;
  border: 0;
  font: inherit;
  cursor: pointer;
}

.creator-feed-notification-context {
  display: block;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-feed-notification-time {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-notification-unread-dot {
  width: 9px;
  height: 9px;
  min-width: 9px;
  margin-top: 0.45rem;
  border-radius: 50%;
  background: #2563eb;
}

.creator-feed-notification-empty {
  padding: 2rem 1.25rem;
  text-align: center;
}

.creator-feed-notification-empty h3 {
  margin-bottom: 0.35rem;
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-feed-notification-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 0.85rem;
  border-radius: 50%;
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-modal-title-size);
}

.creator-feed-notification-pagination {
  padding: 1rem 1.1rem 1.15rem;
}

.creator-feed-for-you {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}

/* Normal-user For You only: a compact, ordered discovery composition. */
.creator-feed-normal-user-for-you { gap: 0; }
.creator-feed-normal-user-for-you .grid-updates { display: flex; flex-direction: column; gap: 14px; }
.creator-feed-normal-user-for-you .creator-feed-block + .creator-feed-block { margin-top: 0; }
.creator-feed-normal-user-for-you .card-updates { margin-bottom: 0; }
.creator-feed-normal-user-for-you .creator-feed-normal-promotion {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 16px; border: 1px solid var(--border-color); border-radius: var(--radius-lg);
}
.creator-feed-normal-user-for-you .creator-feed-normal-promotion > div { min-width: 0; }
.creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-promo-kicker { display: block; margin-bottom: 3px; color: var(--brand-primary); font-size: var(--text-micro-size); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.creator-feed-normal-user-for-you .creator-feed-normal-promotion p { margin: 0; color: var(--text-secondary); font-size: var(--text-meta-size); line-height: 1.4; }
.creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-secondary-btn { flex: 0 0 auto; border-color: var(--brand-primary); background: var(--brand-primary); color: #fff; white-space: nowrap; }
.creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-secondary-btn:hover { color: #fff; filter: brightness(1.06); }
.creator-feed-normal-user-for-you .creator-feed-normal-discovery { margin: 0; padding: 14px 0 12px; overflow: hidden; }
.creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-heading { padding: 0 14px; }
.creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel { padding: 0 14px 4px; scroll-padding-inline: 14px; }
.creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel-card { min-height: 260px; background: var(--bg-card); }
.creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel-actions { margin-top: auto; }
.creator-feed-normal-user-for-you .creator-feed-normal-creator-card { min-width: 196px; }
.creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-carousel-actions { padding-top: 0; }
.creator-feed-normal-user-for-you .creator-feed-normal-creator-card .creator-feed-secondary-btn { width: 100%; text-align: center; }
html[data-theme="dark"] .creator-feed-normal-user-for-you .creator-feed-normal-promotion { background: linear-gradient(135deg, rgba(91, 124, 255, .17), var(--auth-surface-2)); border-color: var(--auth-border); }
html[data-theme="dark"] .creator-feed-normal-user-for-you .creator-feed-normal-discovery { background: var(--auth-surface-2); border-color: var(--auth-border); }
@media (max-width: 767.98px) {
  .creator-feed-normal-user-for-you .grid-updates { gap: 12px; }
  .creator-feed-normal-user-for-you .creator-feed-normal-promotion { align-items: flex-start; flex-direction: column; gap: 10px; padding: 13px; }
  .creator-feed-normal-user-for-you .creator-feed-normal-promotion .creator-feed-secondary-btn { width: 100%; }
  .creator-feed-normal-user-for-you .creator-feed-normal-discovery { padding-top: 12px; }
  .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-section-heading,
  .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel { padding-left: 12px; padding-right: 12px; }
  .creator-feed-normal-user-for-you .creator-feed-normal-discovery .creator-feed-carousel-card { min-height: 248px; }
}

.creator-feed-secondary-btn {
  border: 1px solid var(--border-color);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  border-radius: var(--radius-lg);
  font-size: var(--text-meta-size);
  line-height: 1;
  font-weight: 500;
  transition: 0.2s ease;
  background: var(--brand-primary);
  color: #fff;
  padding: 0.7rem 1rem;
}

.creator-feed-secondary-btn:hover {
  text-decoration: none;
}

.creator-feed-secondary-btn-muted {
  opacity: 0.72;
  pointer-events: none;
}

.creator-feed-account-trigger {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.75rem 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--text-primary);
}

.creator-feed-account-trigger img,
.creator-feed-account-summary img,
.creator-feed-person-card img,
.creator-feed-composer-trigger img,
.creator-feed-notice-card img {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-feed-account-trigger span,
.creator-feed-account-summary span,
.creator-feed-person-card span {
  flex: 1;
  min-width: 0;
  text-align: left;
}

.creator-feed-account-trigger strong,
.creator-feed-account-summary strong,
.creator-feed-person-card strong {
  display: block;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-account-trigger small,
.creator-feed-account-summary small,
.creator-feed-person-card small {
  display: block;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-account-summary {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.75rem 0;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--text-primary);
  margin-top: 0.25rem;
}

.creator-feed-dropdown-menu {
  width: 100%;
  border-radius: 18px;
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  
}

.creator-feed-dropdown-menu .dropdown-item {
  color: var(--text-primary);
}

.creator-feed-shell-main {
  min-width: 0;
  min-height: 0;
  width: 100%;
  max-width: none;
  height: auto;
  max-height: none;
  overflow: visible;
  overflow-y: visible;
}

.creator-shop-page {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding-top: 2px;
}

.creator-shop-hero {
  position: relative;
  min-height: 196px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.08);
  background: linear-gradient(180deg, #edeae6 0%, #f7f4ef 100%);
  padding: 0;
}

.creator-shop-hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.creator-shop-hero__scrim {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(16, 18, 27, 0.76) 0%, rgba(16, 18, 27, 0.68) 22%, rgba(16, 18, 27, 0.34) 38%, rgba(16, 18, 27, 0.06) 58%, transparent 75%),
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(19, 20, 29, 0.06) 100%);
  pointer-events: none;
}

.creator-shop-hero__copy {
  position: relative;
  z-index: 2;
  max-width: 324px;
  color: #fff;
  padding: 46px 0 0 34px;
}

.creator-shop-hero__copy h1 {
  margin: 0 0 10px;
  font-size: var(--text-modal-title-size);
  line-height: 1.08;
  font-weight: 600;
  letter-spacing: -0.03em;
}

.creator-shop-hero__copy p {
  margin: 0;
  max-width: 252px;
  font-size: var(--text-caption-size);
  line-height: 1.48;
  color: rgba(255, 255, 255, 0.82);
}

.creator-shop-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border-radius: 18px;
}

.creator-shop-toolbar__search {
  min-width: 0;
  margin: 0;
}

.creator-shop-toolbar__filters {
  display: flex;
  align-items: center;
  gap: 8px;
}

.creator-shop-toolbar__select {
  position: relative;
  min-width: 124px;
}

.creator-shop-toolbar__select select {
  width: 100%;
  min-height: 44px;
  padding: 20px 32px 10px 14px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  background: var(--bg-card);
  color: var(--text-primary);
  appearance: none;
  font-size: var(--text-micro-size);
  line-height: 1.2;
}

.creator-shop-toolbar__select span {
  position: absolute;
  top: 8px;
  left: 14px;
  font-size: var(--text-badge-size);
  line-height: 1;
  color: var(--text-secondary);
  pointer-events: none;
}

.creator-shop-toolbar__select i {
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translateY(-20%);
  color: var(--text-secondary);
  pointer-events: none;
  font-size: var(--text-body-size);
}

.creator-shop-toolbar__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.creator-shop-toolbar__search-submit {
  display: none;
}

.creator-shop-toolbar__add-btn {
  min-height: 44px;
  padding: 0 16px;
  border: 0;
  border-radius: 14px;
  background: #143db9;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-micro-size);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.creator-shop-toolbar__add-btn:hover {
  color: #fff;
  text-decoration: none;
  background: #10339d;
}

.creator-shop-results {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.creator-shop-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.creator-shop-card {
  padding: 0;
  border-radius: 14px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 308px;
  
}

.creator-shop-card__media {
  position: relative;
  /*aspect-ratio: 1.56 / 1;*/
  display: block;
  overflow: hidden;
  background: var(--bg-muted);
}

.creator-shop-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.25s ease;
}

.creator-shop-card:hover .creator-shop-card__media img {
  transform: scale(1.03);
}

.creator-shop-card__badges {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.creator-shop-card__badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 20px;
  padding: 0 7px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(8px);
  color: #0f172a;
  font-size: var(--text-badge-size);
  line-height: 1;
  font-weight: 600;
}

.creator-shop-card__badge--locked {
  background: rgba(17, 24, 39, 0.45);
  color: #fff;
}

.creator-shop-card__play {
  position: absolute;
  right: 8px;
  bottom: 8px;
  width: 20px;
  height: 20px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.82);
  color: #4b5563;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-caption-size);
}

.creator-shop-card__body {
  padding: 9px 10px 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.creator-shop-card__title {
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--text-body-size);
  line-height: 1.32;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.creator-shop-card__title:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-shop-card__seller {
  display: flex;
  align-items: baseline;
  gap: 5px;
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: 20px;
}

.creator-shop-card__seller:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-shop-card__seller small {
  color: inherit;
  opacity: .75;
}

.creator-shop-purchase-dialog,
.creator-shop-success-dialog {
  border: 0;
  border-radius: 18px;
  overflow: hidden;
}

.creator-shop-purchase-dialog {
  max-height: calc(100dvh - 32px);
}

.creator-shop-purchase-dialog form {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

.creator-shop-purchase-header,
.creator-shop-purchase-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
}

.creator-shop-purchase-header {
  border-bottom: 1px solid var(--border-color);
}

.creator-shop-purchase-eyebrow {
  margin: 0 0 4px;
  color: var(--text-secondary);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.creator-shop-purchase-header h2,
.creator-shop-success-dialog h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 22px;
}

.creator-shop-purchase-close {
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  font-size: 20px;
}

.creator-shop-purchase-body {
  display: grid;
  min-height: 0;
  flex: 1 1 auto;
  gap: 18px;
  max-height: min(70vh, 680px);
  overflow-y: auto;
  padding: 24px;
}

.creator-shop-purchase-summary {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
}

.creator-shop-purchase-thumb {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  object-fit: cover;
}

.creator-shop-purchase-summary-copy {
  min-width: 0;
  flex: 1;
}

.creator-shop-purchase-summary-copy h3,
.creator-shop-purchase-summary-copy p {
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-shop-purchase-summary-copy h3 {
  color: var(--text-primary);
  font-size: 16px;
}

.creator-shop-purchase-summary-copy p,
.creator-shop-purchase-summary-copy span,
.creator-shop-purchase-balance span {
  color: var(--text-secondary);
  font-size: 13px;
}

.creator-shop-purchase-summary-price {
  color: var(--text-primary);
  white-space: nowrap;
}

.creator-shop-purchase-payment,
.creator-shop-purchase-totals {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 12px;
  background: var(--bg-secondary);
}

.creator-shop-purchase-section-heading,
.creator-shop-purchase-balance,
.creator-shop-purchase-totals > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.creator-shop-purchase-section-heading h3,
.creator-shop-purchase-subheading {
  margin: 0;
  color: var(--text-primary);
  font-size: 15px;
}

.creator-shop-purchase-section-heading span {
  color: var(--text-primary);
  font-weight: 600;
}

.creator-shop-purchase-totals span {
  color: var(--text-secondary);
}

.creator-shop-purchase-total {
  padding-top: 10px;
  border-top: 1px solid var(--border-color);
  color: var(--text-primary);
  font-weight: 700;
}

.creator-shop-purchase-insufficient {
  display: grid;
  gap: 5px;
  padding: 13px 15px;
  border: 1px solid rgba(220, 53, 69, .3);
  border-radius: 12px;
  background: rgba(220, 53, 69, .08);
  color: var(--text-primary);
}

.creator-shop-purchase-insufficient span {
  color: var(--text-secondary);
  font-size: 13px;
}

.creator-shop-purchase-fund {
  color: var(--brand-primary, #00167a);
  font-weight: 600;
}

.creator-shop-purchase-error {
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(220, 53, 69, .1);
  color: #b42318;
}

.creator-shop-purchase-footer {
  border-top: 1px solid var(--border-color);
}

.creator-shop-purchase-cancel {
  border: 0;
  background: transparent;
  color: var(--text-secondary);
}

.creator-shop-purchase-submit {
  min-width: 150px;
  padding: 10px 18px;
  border: 0;
  border-radius: 10px;
  background: var(--brand-primary, #00167a);
  color: #fff;
  font-weight: 600;
}

.creator-shop-purchase-submit:hover,
.creator-shop-purchase-submit:focus {
  background: var(--brand-primary-hover, #00115f);
  color: #fff;
}

.creator-shop-purchase-submit:disabled {
  cursor: not-allowed;
  opacity: .55;
}

.creator-shop-success-dialog {
  position: relative;
  padding: 34px 28px;
  text-align: center;
}

.creator-shop-success-close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-grid;
  width: 36px;
  height: 36px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--text-secondary, #667085);
  font-size: 18px;
}

.creator-shop-success-close:hover,
.creator-shop-success-close:focus {
  background: var(--bg-muted, #f3f4f6);
  color: var(--text-primary, #172033);
}

.creator-shop-success-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: rgba(25, 135, 84, .12);
  color: #198754;
  font-size: 26px;
}

.creator-shop-success-dialog p {
  margin: 12px 0 22px;
  color: var(--text-secondary);
}

.creator-shop-success-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
}

.creator-shop-success-actions .btn-primary {
  border-color: var(--brand-primary, #00167a);
  background: var(--brand-primary, #00167a);
}

.creator-shop-success-unavailable {
  display: inline-flex;
  min-height: 38px;
  padding: 8px 14px;
  align-items: center;
  border-radius: 8px;
  background: var(--bg-muted, #f3f4f6);
  color: var(--text-secondary, #667085);
  font-weight: 600;
}

@media (max-width: 575.98px) {
  .creator-shop-purchase-modal .modal-dialog,
  .creator-shop-success-modal .modal-dialog {
    width: auto;
    max-width: none;
    margin: 8px;
  }

  .creator-shop-purchase-dialog,
  .creator-shop-success-dialog {
    max-height: calc(100dvh - 16px);
  }

  .creator-shop-purchase-header,
  .creator-shop-purchase-body,
  .creator-shop-purchase-footer {
    padding: 16px;
  }

  .creator-shop-purchase-body {
    max-height: none;
    padding-bottom: max(16px, env(safe-area-inset-bottom));
  }

  .creator-shop-purchase-summary-price {
    align-self: flex-start;
  }

  .creator-shop-purchase-footer {
    position: sticky;
    bottom: 0;
    background: var(--bg-card);
  }

  .creator-shop-purchase-submit {
    flex: 1;
  }

  .creator-shop-success-dialog {
    overflow-y: auto;
    padding: 32px 20px max(24px, env(safe-area-inset-bottom));
  }

  .creator-shop-success-actions {
    flex-direction: column;
  }

  .creator-shop-success-actions .btn {
    width: 100%;
  }
}

.creator-shop-card__body p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 24px;
}

.creator-shop-card__price {
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1.2;
  font-weight: 600;
}

.creator-shop-card__footer {
  margin-top: auto;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.creator-shop-card__metric {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

.creator-shop-card__metric i {
  font-size: var(--text-control-size);
}

.creator-shop-card__action {
  min-height: 24px;
  padding: 10px;
  border-radius: var(--radius-sm);
  background: var(--bg-muted);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-table-size);
  line-height: 1;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}

.creator-shop-card__action:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-shop-card__action.is-disabled {
  opacity: 0.55;
  pointer-events: none;
}

.creator-shop-empty {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}

.creator-shop-empty__icon {
  width: 46px;
  height: 46px;
  border-radius: 14px;
  background: var(--bg-muted);
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-subtitle-size);
}

.creator-shop-empty h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-lead-size);
  line-height: 1.2;
  font-weight: 600;
}

.creator-shop-empty p {
  margin: 0;
  max-width: 320px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
}

.creator-shop-pagination {
  padding-top: 4px;
}

html[data-theme="dark"] .creator-shop-hero {
  background:
    radial-gradient(circle at 76% 18%, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0) 28%),
    linear-gradient(90deg, rgba(6, 10, 19, 0.96) 0%, rgba(6, 10, 19, 0.82) 29%, rgba(8, 18, 39, 0.22) 62%, rgba(8, 18, 39, 0.12) 100%),
    linear-gradient(180deg, #111827 0%, #172033 100%);
}

.creator-bookmarks-mobile-header {
  display: none;
}

.creator-bookmarks-page {
  width: 100%;
  min-width: 0;
}

.creator-bookmarks-empty-state {
  min-height: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
  padding: 24px;
}

.creator-bookmarks-empty-state h2 {
  margin: 0;
  font-size: var(--text-modal-title-size);
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-bookmarks-empty-state p {
  margin: 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-bookmarks-right-rail {
  display: grid;
  gap: 16px;
}

.creator-bookmarks-sidebar-card {
  overflow: hidden;
}

.creator-bookmarks-campaign-list {
  display: grid;
  gap: 14px;
}

.creator-bookmarks-campaign-item {
  display: grid;
  gap: 10px;
}

.creator-bookmarks-campaign-media {
  display: block;
  border-radius: 14px;
  overflow: hidden;
}

.creator-bookmarks-campaign-media img {
  width: 100%;
  height: 140px;
  object-fit: cover;
  display: block;
}

.creator-bookmarks-campaign-copy {
  display: grid;
  gap: 6px;
}

.creator-bookmarks-campaign-title {
  color: var(--text-primary);
  font-size: var(--text-body-size);
  line-height: 1.35;
  font-weight: var(--creator-font-weight-semibold);
  text-decoration: none;
}

.creator-bookmarks-campaign-title:hover {
  text-decoration: none;
}

.creator-bookmarks-campaign-copy p {
  margin: 0;
  font-size: var(--text-meta-size);
  line-height: 1.45;
  color: var(--text-secondary);
}

.creator-bookmarks-person-card {
  align-items: center;
}

.creator-bookmarks-person-card .creator-feed-secondary-btn {
  white-space: nowrap;
}

.creator-wallet-page {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.creator-wallet-content {
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.creator-wallet-overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.creator-wallet-overview-grid--campaigner {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.creator-wallet-section {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.creator-wallet-section-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 0 4px;
}

.creator-wallet-section-header h2 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: var(--text-card-title-size);
  line-height: 1.2;
  font-weight: 600;
  color: var(--text-primary);
}

.creator-wallet-section-header p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-caption-size);
  line-height: 1.35;
}

.creator-wallet-panel {
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.07);
  
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
}

.creator-wallet-title-badge {
  color: #d946ef;
  font-size: var(--text-meta-size);
}

.creator-wallet-flash {
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  font-size: var(--text-body-size);
}

.creator-wallet-flash--error {
  background: rgba(220, 38, 38, 0.08);
  color: #b42318;
}

.creator-wallet-flash--success {
  background: rgba(22, 163, 74, 0.08);
  color: #15803d;
}

.creator-wallet-balance-card {
  position: relative;
  min-height: 120px;
  padding: 16px;
  border: 0;
  border-radius: 17px;
  background: linear-gradient(135deg, #10203f 0%, #17356f 100%);
  color: #f8fbff;
  overflow: hidden;
}

.creator-wallet-balance-card--creator {
  background: linear-gradient(135deg, #f3f6fc 0%, #eef2f9 100%);
  color: #17356f;
}

.creator-wallet-balance-card--campaign {
  background: linear-gradient(135deg, #163c35 0%, #24725e 100%);
}

.creator-wallet-panel--campaign .creator-wallet-balance-note {
  color: rgba(248, 250, 252, 0.78);
}

.creator-wallet-allocations {
  max-width: 1100px;
}

.creator-wallet-back {
  color: var(--text-secondary);
  text-decoration: none;
}

.creator-wallet-allocation-list {
  overflow: hidden;
}

.creator-wallet-allocation-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) repeat(3, minmax(100px, 0.7fr));
  gap: 18px;
  align-items: center;
  padding: 18px 20px;
  border-bottom: 1px solid var(--border-color);
}

.creator-wallet-allocation-row:last-child { border-bottom: 0; }
.creator-wallet-allocation-row div { display: flex; flex-direction: column; gap: 4px; }
.creator-wallet-allocation-row span,
.creator-wallet-allocation-row small { color: var(--text-secondary); font-size: var(--text-caption-size); }

.creator-wallet-balance-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 320px;
}

.creator-wallet-balance-copy--creator p,
.creator-wallet-balance-copy--creator .creator-wallet-balance-name-label,
.creator-wallet-balance-copy--creator h2 {
  color: #17356f;
}

.creator-wallet-balance-name-label {
  font-size: var(--text-meta-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-medium);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(248, 250, 252, 0.68);
  margin-top: 40px;
}

.creator-wallet-balance-amount {
  display: inline-flex;
  align-items: flex-end;
  gap: 4px;
  flex-wrap: wrap;
}

.creator-wallet-balance-amount strong {
  font-size: var(--text-page-title-size);
  line-height: 1.05;
  font-weight: var(--creator-font-weight-medium);
  color: #fff;
}

.creator-wallet-balance-amount--creator strong {
  color: #17356f;
}

.creator-wallet-balance-amount small {
  font-size: var(--text-caption-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-medium);
  color: rgba(248, 250, 252, 0.82);
  margin-bottom: 4px;
}

.creator-wallet-balance-amount--creator small {
  color: rgba(23, 53, 111, 0.82);
}

.creator-wallet-balance-copy h2 {
  margin: 0;
  font-size: var(--text-card-title-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-semibold);
  color: #fff;
}

.creator-wallet-balance-copy .creator-wallet-name{
  color: #17356f;
}

.creator-wallet-balance-copy p {
  margin: 0;
  font-size: var(--font-size-lg);
  line-height: 1.35;
  color: var(--brand-primary);
  margin-top: 26px;
}

.creator-wallet-balance-art {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(40%, 172px);
  color: rgba(248, 250, 252, 0.16);
  pointer-events: none;
}

.creator-wallet-balance-art--creator {
  color: rgba(23, 53, 111, 0.07);
}

.creator-wallet-balance-art svg {
  width: 100%;
  height: 100%;
}

.creator-wallet-balance-badge {
  position: absolute;
  top: 14px;
  right: 14px;
  color: #17356f;
  font-size: var(--text-modal-title-size);
  line-height: 1;
}

.creator-wallet-fund-trigger {
  border: 1px solid var(--border-color);
  border-radius: 11px;
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 14px;
  font-size: var(--text-micro-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  min-width: 126px;
}

.creator-wallet-withdraw-trigger {
  border: 1px solid var(--border-color);
  border-radius: 11px;
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 14px;
  font-size: var(--text-micro-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  min-width: 126px;
}

.creator-wallet-fund-trigger:hover,
.creator-wallet-withdraw-trigger:hover,
.creator-wallet-upload-btn:hover {
  background: var(--bg-muted);
  color: var(--brand-primary);
}

.creator-wallet-withdraw-trigger--muted {
  color: var(--text-secondary);
}

.creator-wallet-withdraw-trigger--disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.creator-wallet-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.creator-wallet-funding-modal,
.creator-wallet-success-modal {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.creator-wallet-funding-modal[hidden],
.creator-wallet-success-modal[hidden] {
  display: none;
}

.creator-wallet-funding-backdrop,
.creator-wallet-success-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 24, 39, 0.58);
}

.creator-wallet-funding-panel {
  position: relative;
  z-index: 1;
  width: min(100%, 760px);
  max-height: calc(100dvh - 48px);
  overflow-y: auto;
  padding: 18px;
  border-radius: 18px;
}

.wallet-allocation-modal__panel {
  position: relative;
  z-index: 2;
  width: min(1120px, calc(100vw - 48px));
  max-height: calc(100dvh - 48px);
  min-height: 320px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background: #fff;
  color: #172b4d;
  border: 1px solid rgba(15, 23, 42, .1);
  border-radius: 20px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, .24);
}
.wallet-allocation-modal { z-index: 1200; isolation: isolate; }
.wallet-allocation-modal__panel .creator-wallet-panel-header { flex: 0 0 auto; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid rgba(15, 23, 42, .08); }
.wallet-allocation-modal__panel .creator-wallet-panel-close { position: static; flex: 0 0 auto; }
.wallet-allocation-modal__summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.wallet-allocation-modal__summary > div { padding: 14px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--bg-card); display: flex; flex-direction: column; gap: 6px; }
.wallet-allocation-modal__summary span, .wallet-allocation-modal__row small { color: var(--text-secondary); font-size: var(--text-caption-size); }
.wallet-allocation-modal__summary strong { color: var(--text-primary); font-size: 18px; }
.wallet-allocation-modal__filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.wallet-allocation-modal__filters input { flex: 1 1 220px; min-width: 0; border: 1px solid var(--border-color); border-radius: 10px; padding: 9px 12px; }
.wallet-allocation-modal__filters button { border: 1px solid var(--border-color); border-radius: 999px; background: var(--bg-card); color: var(--text-secondary); padding: 8px 12px; }
.wallet-allocation-modal__filters button.is-active { background: var(--brand-primary); color: #fff; border-color: var(--brand-primary); }
.wallet-allocation-modal__list { overflow-x: auto; }
.wallet-allocation-modal__list { overflow-y: auto; min-height: 0; }
.wallet-allocation-modal__row { min-width: 900px; display: grid; grid-template-columns: minmax(220px, 1.5fr) 100px repeat(3, 110px) 130px; gap: 14px; align-items: center; padding: 14px 4px; border-bottom: 1px solid var(--border-color); }
.wallet-allocation-modal__campaign { display: flex; align-items: center; gap: 10px; min-width: 0; }
.wallet-allocation-modal__campaign img { width: 42px; height: 42px; object-fit: cover; border-radius: 8px; }
.wallet-allocation-modal__campaign div, .wallet-allocation-modal__row > div:not(.wallet-allocation-modal__campaign):not(.wallet-allocation-modal__progress) { display: flex; flex-direction: column; gap: 3px; }
.wallet-allocation-modal__campaign strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wallet-allocation-modal__status { text-transform: capitalize; color: var(--text-secondary); font-size: var(--text-caption-size); }
.wallet-allocation-modal__progress span { display: block; height: 5px; margin-top: 5px; border-radius: 99px; background: var(--border-color); overflow: hidden; }
.wallet-allocation-modal__progress i { display: block; height: 100%; border-radius: inherit; background: var(--brand-primary); }
.wallet-allocation-modal__empty { min-height: 180px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--text-secondary); text-align: center; }
@media (max-width: 767.98px) {
  .wallet-allocation-modal { padding: 10px; }
  .wallet-allocation-modal__panel { width: 100%; max-height: calc(100dvh - 20px); padding: 14px; }
  .wallet-allocation-modal__summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wallet-allocation-modal__row { min-width: 0; grid-template-columns: 1fr 1fr; gap: 12px; padding: 16px; margin-bottom: 10px; border: 1px solid var(--border-color); border-radius: 14px; background: #fff; }
  .wallet-allocation-modal__campaign { grid-column: 1 / -1; }
  .wallet-allocation-modal__status { justify-self: end; }
  .wallet-allocation-modal__progress { grid-column: 1 / -1; }
}

.creator-wallet-funding-panel:focus-visible,
.creator-wallet-success-surface:focus-visible {
  outline: 2px solid var(--brand-primary);
  outline-offset: 2px;
}

.creator-wallet-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.creator-wallet-transactions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.creator-wallet-transactions-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 4px;
}

.creator-wallet-transactions-header h2 {
  margin: 0;
  font-size: var(--text-card-title-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-panel-header h2 {
  margin: 0;
  font-size: var(--text-section-title-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-panel-header p {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
}

.creator-wallet-panel-close {
  width: 34px;
  height: 34px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-card);
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.creator-wallet-destination-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.creator-wallet-destination-option {
  min-height: 44px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 14px;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-align: left;
}

.creator-wallet-destination-option i {
  width: 22px;
  height: 22px;
  border-radius: var(--radius-pill);
  background: var(--brand-primary);
  color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  flex: 0 0 22px;
  font-size: var(--text-micro-size);
}

.creator-wallet-destination-option.is-selected {
  border-color: rgba(37, 99, 235, 0.45);
  background: rgba(37, 99, 235, 0.08);
  color: var(--brand-primary);
}

.creator-wallet-destination-option.is-selected i {
  display: inline-flex;
}

.creator-wallet-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
  gap: 20px;
}

.creator-wallet-field-label {
  display: block;
  margin-bottom: 8px;
  font-size: var(--text-meta-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-amount-field {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  min-height: 50px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  background: var(--bg-card);
}

.creator-wallet-amount-field span {
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-amount-field .form-control {
  border: 0;
  padding: 0;
  min-height: 0;
  background: transparent;
  box-shadow: none;
}

.creator-wallet-hint,
.creator-wallet-bank-upload small {
  display: block;
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.45;
}

.creator-wallet-balance-context {
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-muted);
  padding: 14px 16px;
  margin: 15px 0;
}

.creator-wallet-summary {
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-muted);
  padding: 14px 16px;
  margin-top: 16px;
}

.creator-wallet-summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 7px 0;
  font-size: var(--text-meta-size);
}

.creator-wallet-summary-row strong {
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-summary-row--total {
  padding-top: 10px;
  margin-top: 6px;
  border-top: 1px solid var(--border-color);
}

.creator-wallet-form-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.creator-wallet-balance-context span {
  display: block;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.creator-wallet-balance-context strong {
  display: block;
  margin-top: 6px;
  font-size: var(--text-lead-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-gateways {
  display: grid;
  gap: 10px;
}

.creator-wallet-gateway-option {
  display: block;
  margin: 0;
}

.creator-wallet-gateway-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.creator-wallet-gateway-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 13px 14px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  cursor: pointer;
}

.creator-wallet-gateway-option input:checked + .creator-wallet-gateway-card {
  border-color: rgba(37, 99, 235, 0.4);
  background: rgba(37, 99, 235, 0.08);
}

.creator-wallet-gateway-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 20px;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-medium);
}

.creator-wallet-gateway-label i {
  font-size: var(--text-control-size);
}

.creator-wallet-gateway-card small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.45;
}

.creator-wallet-bank-box {
  margin: 2px 0 4px;
  padding: 14px;
  border: 1px dashed var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-muted);
}

.creator-wallet-bank-details h3 {
  margin: 0 0 10px;
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-bank-upload {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.creator-wallet-bank-details {
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-muted);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.creator-wallet-upload-btn {
  border: 1px solid var(--border-color);
  border-radius: 11px;
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 14px;
  font-size: var(--text-micro-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  width: 100%;
  border-style: dashed;
}

.creator-wallet-terms {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 16px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
}

.creator-wallet-terms input {
  margin-top: 2px;
}

.creator-wallet-terms a {
  color: var(--brand-primary);
  text-decoration: none;
}

.creator-wallet-withdrawal-panel {
  width: min(100%, 430px);
  padding: 22px;
  border-radius: 22px;
}

.creator-wallet-withdrawal-panel .creator-wallet-panel-header {
  align-items: center;
  margin-bottom: 22px;
}

.creator-wallet-withdraw-back {
  width: 34px;
  height: 34px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 34px;
}

.creator-wallet-withdraw-back[hidden] {
  display: none;
}

.creator-wallet-withdraw-step {
  display: grid;
  gap: 14px;
}

.creator-wallet-withdraw-step[hidden] {
  display: none;
}

.creator-wallet-withdraw-section-title {
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-withdraw-methods {
  display: grid;
  gap: 12px;
}

.creator-wallet-withdraw-method {
  display: block;
  margin: 0;
}

.creator-wallet-withdraw-method input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.creator-wallet-withdraw-method-card {
  min-height: 74px;
  border: 1px solid var(--border-color);
  border-radius: 15px;
  background: var(--bg-card);
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.creator-wallet-withdraw-method-card strong,
.creator-wallet-withdraw-method-heading strong {
  display: block;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-withdraw-method-card small,
.creator-wallet-withdraw-method-heading span {
  display: block;
  margin-top: 4px;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.35;
}

.creator-wallet-withdraw-radio {
  width: 18px;
  height: 18px;
  border: 1.5px solid var(--border-color);
  border-radius: 50%;
  flex: 0 0 18px;
  position: relative;
}

.creator-wallet-withdraw-method input:checked + .creator-wallet-withdraw-method-card {
  border-color: rgba(37, 99, 235, 0.45);
  background: rgba(37, 99, 235, 0.08);
}

.creator-wallet-withdraw-method input:checked + .creator-wallet-withdraw-method-card .creator-wallet-withdraw-radio {
  border-color: var(--brand-primary);
}

.creator-wallet-withdraw-method input:checked + .creator-wallet-withdraw-method-card .creator-wallet-withdraw-radio::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 50%;
  background: var(--brand-primary);
}

.creator-wallet-withdraw-method-heading {
  padding: 14px;
  border: 1px solid rgba(37, 99, 235, 0.18);
  border-radius: 15px;
  background: rgba(37, 99, 235, 0.06);
  margin: 15px 0;
}

.creator-wallet-withdraw-input {
  min-height: 48px;
  border-radius: 14px;
  padding: 0 14px;
}

.creator-wallet-withdraw-info,
.creator-wallet-withdraw-limits,
.creator-wallet-withdraw-error {
  border: 1px solid var(--border-color);
  border-radius: 15px;
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.5;
  padding: 12px 14px;
}

.creator-wallet-withdraw-limits {
  display: grid;
  gap: 4px;
}

.creator-wallet-withdraw-error {
  margin-bottom: 14px;
  border-color: rgba(220, 38, 38, 0.28);
  background: rgba(220, 38, 38, 0.08);
  color: #b91c1c;
}

.creator-wallet-withdraw-actions {
  align-items: stretch;
  flex-direction: column;
  gap: 12px;
  margin-top: 4px;
}

.creator-wallet-withdraw-actions .creator-wallet-submit-btn {
  width: 100%;
  min-height: 46px;
  border-radius: var(--radius-pill);
  font-size: var(--text-body-size);
}

.creator-wallet-withdraw-terms {
  margin-top: 4px;
}

.creator-wallet-view-all {
  color: var(--brand-primary);
  text-decoration: none;
  font-size: var(--text-caption-size);
  font-weight: var(--creator-font-weight-medium);
  line-height: 1.2;
}

.creator-wallet-submit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 18px;
}

.creator-wallet-submit-row small {
  display: block;
  margin-top: 0;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.45;
}

.creator-wallet-submit-btn {
  border: 1px solid var(--border-color);
  border-radius: 11px;
  background: var(--brand-primary);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 14px;
  font-size: var(--text-micro-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
  text-decoration: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
  min-width: 180px;
  border-color: var(--brand-primary);
}

.creator-wallet-submit-btn:hover {
  background: var(--brand-primary-hover);
  color: #fff;
  border-color: var(--brand-primary-hover);
}

.creator-wallet-success-surface {
  position: relative;
  z-index: 1;
  width: min(100%, 350px);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border: 1px solid var(--border-color);
  border-radius: 24px;
  background: var(--bg-card);
  padding: 30px 24px 24px;
  text-align: center;
}

.creator-wallet-success-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.creator-wallet-success-close:hover,
.creator-wallet-success-close:focus-visible {
  background: var(--bg-muted);
  color: var(--text-primary);
}

.creator-wallet-success-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: var(--radius-pill);
  border: 1.5px solid color-mix(in srgb, var(--brand-primary) 30%, var(--border-color));
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-display-title-size);
}

.creator-wallet-success-surface h2 {
  margin: 0 0 8px;
  font-size: var(--text-section-title-size);
  line-height: 1.3;
  color: var(--text-primary);
}

.creator-wallet-success-surface p {
  margin: 0 0 18px;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.5;
}

.creator-wallet-success-action {
  width: 100%;
  min-height: 44px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--brand-primary);
  color: #fff;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-success-action:hover,
.creator-wallet-success-action:focus-visible {
  background: var(--brand-primary-hover);
  color: #fff;
}

.creator-wallet-transaction-list {
  padding: 18px;
  border-radius: 18px;
  display: flex;
  flex-direction: column;
  border: 0;
  background: transparent;
  box-shadow: none;
  padding-top: 0;
  padding-bottom: 0;
}
.shadow-large{
    box-shadow: none!important;
}

.creator-wallet-transaction-item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 60px;
  padding: 10px 0;
  border-top: 1px solid rgba(15, 23, 42, 0.07);
}

.creator-wallet-transaction-item:first-child {
  border-top: 0;
  padding-top: 0;
}

.creator-wallet-transaction-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--radius-md);
  background: #edf1ec;
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-lead-size);
}

.creator-wallet-transaction-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 14px;
}

.creator-wallet-transaction-icon.is-creator {
  background: rgba(197, 214, 244, 0.55);
  color: #17356f;
}

.creator-wallet-transaction-copy {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.creator-wallet-transaction-title-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.creator-wallet-transaction-title-row strong {
  font-size: var(--text-micro-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-medium);
}

.creator-wallet-transaction-title-row a {
  color: var(--brand-primary);
  text-decoration: none;
  font-size: var(--text-micro-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-medium);
}

.creator-wallet-transaction-copy small {
  color: var(--text-secondary);
  font-size: var(--text-badge-size);
  line-height: 1.45;
}

.creator-wallet-transaction-wallet {
  display: none;
}

.creator-wallet-transaction-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 18px;
  padding: 0 7px;
  border-radius: var(--radius-pill);
  font-size: var(--text-badge-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-semibold);
  text-transform: uppercase;
}

.creator-wallet-transaction-status.is-pending {
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

.creator-wallet-transaction-status.is-success {
  background: rgba(22, 163, 74, 0.12);
  color: #15803d;
}

.creator-wallet-transaction-status.is-canceled {
  background: rgba(220, 38, 38, 0.12);
  color: #b42318;
}

.creator-wallet-transaction-amount {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  text-align: right;
}

.creator-wallet-transaction-amount strong {
  font-size: var(--text-micro-size);
  font-weight: 500;
}

.creator-wallet-transaction-amount.is-positive strong {
  color: #111827;
}

.creator-wallet-transaction-amount.is-negative strong {
  color: #17356f;
}

.creator-wallet-transaction-amount a {
  color: var(--brand-primary);
  text-decoration: none;
  font-size: var(--text-badge-size);
}

.creator-wallet-empty {
  padding: 16px;
  border-radius: 14px;
  min-height: 112px;
  border: 0;
  background: transparent;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}

.creator-wallet-empty-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: var(--bg-card);
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-lead-size);
}

.creator-wallet-empty h3 {
  margin: 0;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-wallet-empty p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-caption-size);
  line-height: 1.45;
  max-width: 240px;
}

.creator-wallet-pagination {
  margin-top: 8px;
}

.creator-profile-page {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

/* The desktop rail is deliberately rendered a second time inside the profile
 * column for compact layouts.  This keeps Recent posts in reading order once
 * the workspace changes from columns to a single profile stream. */
.creator-profile-mobile-right-rail {
  display: none;
}

@media (max-width: 1199.98px) {
  .creator-feed-page--profile .creator-profile-mobile-right-rail {
    display: block;
    width: 100%;
    margin-top: 16px;
  }

  .creator-feed-page--profile .creator-profile-mobile-right-rail .creator-profile-right-panel {
    width: 100%;
  }
}

.creator-profile-hero {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  
  overflow: hidden;
}

.creator-profile-cover {
  position: relative;
  min-height: 238px;
  border-radius: 0;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.82), rgba(37, 99, 235, 0.46));
}

.creator-profile-cover-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-profile-cover-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.72));
}

.creator-profile-cover-top {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 1rem;
  padding: 16px;
  pointer-events: none;
}

.creator-profile-back {
  border: 0;
  background: transparent;
  color: #fff;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 0;
  padding: 0;
  font-size: var(--text-modal-title-size);
  line-height: var(--leading-tight);
  font-weight: var(--creator-font-weight-bold);
  text-align: left;
}

.creator-profile-cover-actions {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  pointer-events: auto;
}

.creator-profile-cover-menu {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 4;
  pointer-events: auto;
}

.creator-profile-cover-menu-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid rgba(15, 23, 42, 0.1);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  color: #111827;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
  line-height: 1;
}

.creator-profile-cover-menu-trigger i {
  font-size: 20px;
  line-height: 1;
}

.creator-profile-cover-menu-trigger:hover,
.creator-profile-cover-menu-trigger:focus {
  background: var(--auth-surface-2);
  color: #111827;
}

.creator-profile-cover-menu__dropdown {
  min-width: 174px;
  padding: 6px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 12px;
  box-shadow: 0 18px 38px rgba(15, 23, 42, 0.2);
}

.creator-profile-cover-menu__item {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 36px;
  padding: 8px 10px;
  border-radius: 8px;
  color: #1f2937;
  font-size: var(--text-meta-size);
  line-height: 1.2;
}

.creator-profile-cover-menu__item i {
  width: 16px;
  text-align: center;
}

.creator-profile-cover-menu__item--danger {
  color: #dc2626;
}

.creator-profile-cover-menu__item:hover,
.creator-profile-cover-menu__item:focus {
  background: rgba(15, 23, 42, 0.06);
  color: #111827;
}

.creator-profile-cover-menu__item--danger:hover,
.creator-profile-cover-menu__item--danger:focus {
  background: rgba(220, 38, 38, 0.08);
  color: #b91c1c;
}

.creator-profile-cover-btn {
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(15, 23, 42, 0.4);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 32px;
  padding: 0 12px;
  border-radius: var(--radius-md);
  font-size: var(--text-meta-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
}

.creator-profile-cover-btn i,
.creator-profile-back i {
  font-size: var(--text-card-title-size);
}

.creator-profile-cover-copy {
  position: absolute;
  left: 28px;
  z-index: 2;
  display: grid;
  gap: var(--space-3);
  max-width: calc(100% - 56px);
  color: #fff;
  top: 16px;
}

.creator-profile-cover-title-row {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  max-width: 100%;
  color: #fff;
  text-decoration: none;
}

.creator-profile-cover-title-row span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-profile-cover-stats {
  display: flex;
  align-items: center;
  gap: var(--space-5);
}

.creator-profile-cover-stat {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  color: #fff;
  font-size: var(--text-body-size);
  line-height: var(--leading-tight);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-profile-cover-stat i {
  font-size: var(--text-section-title-size);
  line-height: 1;
}

.creator-profile-identity-card {
  margin-top: -2px;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.creator-profile-identity-grid {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 0 28px 0;
}

.creator-profile-avatar-wrap {
  position: relative;
  flex: 0 0 118px;
  margin-top: -58px;
  width: 118px;
}

.creator-profile-avatar {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid var(--bg-card);
  
}

.creator-profile-cover-btn:hover,
.creator-profile-back:hover {
  opacity: 0.95;
}

.creator-profile-cropper-staging {
  display: none;
}

.creator-profile-cropper-popup .fileuploader-popup-node {
  background: var(--bg-card);
}

.creator-profile-cropper-popup .fileuploader-popup-preview {
  padding: 18px;
  background: rgba(15, 23, 42, 0.82);
}

.creator-profile-cropper-popup .fileuploader-popup-content {
  border-radius: var(--radius-xl);
  overflow: hidden;
  background: var(--bg-card);
  
}

.creator-profile-cropper-popup .fileuploader-popup-header {
  background: var(--bg-card);
  border-top: 1px solid var(--border-color);
}

.creator-profile-cropper-popup .fileuploader-popup-footer {
  background: var(--bg-hover, rgba(148, 163, 184, 0.08));
}

.creator-profile-cropper-heading {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 1.1rem 1.25rem 0;
}

.creator-profile-cropper-heading strong {
  font-size: var(--text-lead-size);
  line-height: 1.3;
  color: var(--text-primary);
}

.creator-profile-cropper-heading span {
  font-size: var(--text-card-title-size);
  line-height: 1.45;
  color: var(--text-muted);
}

.creator-profile-cropper-popup .fileuploader-popup-meta {
  gap: 0.85rem;
  padding: 1rem 1.25rem 0.65rem;
}

.creator-profile-cropper-popup .fileuploader-popup-meta li span {
  color: var(--text-muted);
}

.creator-profile-cropper-popup .fileuploader-popup-meta li h5 {
  color: var(--text-primary);
}

.creator-profile-cropper-popup .fileuploader-popup-buttons {
  padding: 1rem 1.25rem 1.15rem;
}

.creator-profile-cropper-popup .fileuploader-popup-button {
  min-height: 42px;
}

.creator-profile-cropper-popup .fileuploader-cropper {
  min-height: 420px;
  background: var(--bg-card);
}

.creator-profile-cropper-popup .fileuploader-cropper .fileuploader-cropper-area {
  background: rgba(15, 23, 42, 0.08);
}

.creator-profile-cropper-popup--avatar .fileuploader-cropper .fileuploader-cropper-area {
  border-radius: 50%;
  
}

.creator-profile-cropper-popup .fileuploader-popup-footer .fileuploader-popup-tools {
  gap: 0.5rem;
  align-items: center;
  padding: 0.95rem 1.25rem;
}

.creator-profile-cropper-popup .fileuploader-popup-footer .fileuploader-popup-tools li [data-action] {
  border-radius: var(--radius-pill);
}

.creator-profile-cropper-popup .fileuploader-popup-footer .fileuploader-popup-zoomer {
  flex: 1 1 auto;
  min-width: 0;
}

.creator-profile-cropper-popup .fileuploader-popup-footer .fileuploader-popup-zoomer input[type="range"] {
  width: 100%;
}

.creator-profile-cropper-popup .fileuploader-popup-move {
  opacity: 0;
  pointer-events: none;
}

.creator-profile-identity-copy {
  flex: 1 1 auto;
  min-width: 0;
  padding-top: 14px;
}

.creator-profile-identity-row {
  /*display: flex;*/
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  min-width: 0;
}

.creator-profile-identity-main {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}

.creator-profile-identity-row--visitor .creator-profile-identity-main{
    display: grid;
}
.profile_button{
  margin-left: auto;
  text-align: right;
}
.profile_button .creator-feed-secondary-btn{
  width: 150px;
  padding: 15px;
}
.creator-profile-identity-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.creator-profile-identity-main h1,
.creator-profile-identity-head h1 {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-size: var(--text-page-title-size);
  line-height: 1.15;
  font-weight: var(--creator-font-weight-bold);
  color: var(--text-primary);
}

.creator-profile-verified {
  color: #D308EE;
}

.creator-profile-meta {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-profile-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #22c55e;
}

.creator-profile-actions {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 8px;
  flex: 0 0 auto;
  align-self: flex-start;
}

.creator-profile-actions .creator-feed-secondary-btn {
  min-height: 37px;
  padding: 0 16px;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  border-radius: var(--radius-md);
  min-width: 120px;
  margin-top: 0;
}

.creator-profile-bio {
  max-width: 620px;
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.45;
}

.creator-profile-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.creator-profile-stat-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--bg-card) 92%, var(--brand-primary) 8%);
}

.creator-profile-stat-card span {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-medium);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.creator-profile-stat-card strong {
  color: var(--text-primary);
  font-size: var(--text-subtitle-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.15;
}

.creator-profile-tabs {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: var(--space-2);
  width: auto;
  margin: 20px 28px 22px;
  padding: var(--space-1);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-muted);
}

.creator-profile-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-medium);
}

.creator-profile-tab:hover {
  background: var(--bg-muted);
  color: var(--text-primary);
  text-decoration: none;
}

.creator-profile-tab.is-active {
  background: var(--bg-card);
  color: var(--text-primary);
  text-decoration: none;
  font-weight: var(--creator-font-weight-semibold);
  
}

.creator-profile-panel,
.creator-profile-right-panel {
  padding: 16px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-color);
  
}
.creator-profile-panel{
    border: none!important;
}

.creator-profile-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 12px;
}

.creator-profile-panel-heading h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-profile-right-heading {
  margin-bottom: 12px;
}

.creator-profile-right-heading h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-subtitle-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-profile-panel-heading p {
  margin: 0.3rem 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-profile-about-list {
  display: grid;
  gap: 0.9rem;
}

.creator-profile-about-item {
  display: grid;
  gap: 0.3rem;
}

.creator-profile-about-label {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.creator-profile-about-value {
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.55;
  word-break: break-word;
}

.creator-profile-about-value a {
  color: var(--brand-primary);
}

.creator-profile-about-panel {
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 0 8px;
}

.creator-profile-about-modern {
  display: grid;
  gap: 30px;
}

.creator-profile-about-section {
  display: grid;
  gap: 14px;
}

.creator-profile-about-section h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.2;
}

.creator-profile-about-bio {
  max-width: 760px;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.75;
  word-break: break-word;
}

.creator-profile-about-bio p:last-child {
  margin-bottom: 0;
}

.creator-profile-about-detail-list {
  display: grid;
  gap: 14px;
}

.creator-profile-about-detail-row {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.45;
  word-break: break-word;
}

.creator-profile-about-detail-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  min-width: 24px;
  color: var(--text-secondary);
  font-size: 18px;
}

.creator-profile-about-detail-row strong {
  margin-right: 4px;
  color: var(--text-primary);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-profile-about-detail-row a {
  color: inherit;
  text-decoration: none;
}

.creator-profile-about-detail-row a:hover {
  color: var(--brand-primary);
}

.creator-profile-about-social-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.creator-profile-about-social-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  width: 160px;
  max-width: 100%;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid var(--border-color);
  border-radius: 999px;
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.2;
  text-decoration: none;
}

.creator-profile-about-social-link:hover,
.creator-profile-about-social-link:focus {
  border-color: var(--brand-primary);
  color: var(--brand-primary);
  text-decoration: none;
}

.creator-profile-about-social-link i {
  font-size: 18px;
}

@media (max-width: 575.98px) {
  .creator-profile-about-panel {
    padding-bottom: 4px;
  }

  .creator-profile-about-modern {
    gap: 24px;
  }

  .creator-profile-about-detail-row {
    align-items: flex-start;
  }

  .creator-profile-about-social-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
    gap: 10px;
  }

  .creator-profile-about-social-link {
    width: 100%;
    padding: 0 14px;
  }
}

.creator-profile-shop-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.creator-profile-empty,
.creator-profile-popular-empty {
  padding: 32px 20px;
  text-align: center;
}

.creator-profile-empty h3 {
  margin-bottom: 0.35rem;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-profile-empty p,
.creator-profile-popular-empty p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-profile-empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 0.85rem;
  border-radius: 50%;
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-subtitle-size);
}

.creator-profile-content-card {
  min-height: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 0;
}

.creator-profile-search {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 42px;
  padding: 0 0.9rem;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  background: var(--bg-muted);
  margin-bottom: 12px;
}

.creator-profile-search input {
  width: 100%;
  border: 0;
  background: transparent;
  color: var(--text-primary);
  outline: none;
}

.creator-profile-popular-list {
  display: grid;
  gap: 12px;
}

.creator-profile-popular-item {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 12px;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-profile-popular-item:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-profile-popular-thumb {
  width: 74px;
  height: 74px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--bg-muted);
}

.creator-profile-popular-thumb img {
  width: 74px;
  height: 74px;
  border-radius: var(--radius-lg);
  display: block;
  object-fit: cover;
}

.creator-profile-popular-thumb-fallback {
  width: 74px;
  height: 74px;
  border-radius: var(--radius-lg);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
}

.creator-profile-popular-copy {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.creator-profile-popular-author {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-style: normal;
  line-height: 1.4;
}

.creator-profile-composer-card {
  padding: 16px;
  margin-bottom: 0;
  border-radius: var(--radius-lg);
  display: none;
}

.creator-profile-posts {
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.creator-profile-post-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.creator-profile-post-toolbar-label {
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-medium);
}

.creator-profile-post-list {
  margin-top: 0;
}

.creator-feed-page--profile .creator-profile-post-list {
  display: grid;
  gap: var(--space-4);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-card {
  margin-bottom: 0;
  border-radius: var(--radius-lg);
  
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-card-body {
  padding: 14px 16px 10px;
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-header {
  align-items: center;
  min-height: 52px;
  gap: var(--space-3);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-card .avatarUser {
  width: 44px;
  height: 44px;
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-author-row {
  min-height: 22px;
  gap: var(--space-1);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-author-name {
  font-size: var(--text-card-title-size);
  line-height: var(--leading-snug);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-meta-row {
  margin-top: 2px;
  gap: var(--space-2);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-copy-wrap {
  padding: 0 16px 12px;
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-copy {
  font-size: var(--text-body-size);
  line-height: var(--leading-relaxed);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-media-block {
  padding: 0 16px;
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-media-single,
.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-gallery {
  overflow: hidden;
  border-radius: var(--radius-md);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-image,
.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-video {
  max-height: min(520px, 68vh);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-footer {
  padding: 8px 16px 12px;
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-actions {
  min-height: 36px;
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-actions-left {
  gap: var(--space-4);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-action-btn {
  min-width: 30px;
  min-height: 30px;
  font-size: var(--text-card-title-size);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-action-chip span,
.creator-feed-page--profile .creator-profile-post-list .creator-feed-action-chip .countLikes,
.creator-feed-page--profile .creator-profile-post-list .creator-feed-action-chip .totalComments {
  font-size: var(--text-meta-size);
}

.creator-feed-page--profile .creator-profile-post-list .creator-feed-action-bookmark {
  margin-left: auto;
}

.creator-feed-page--profile .creator-profile-post-list .content-locked {
  position: relative;
  min-height: 280px;
  overflow: hidden;
  border-radius: var(--radius-md);
}

.creator-feed-page--profile .creator-profile-post-list .content-locked .ico-no-result {
  color: #fff;
  text-shadow: 0 2px 12px rgba(15, 23, 42, 0.42);
}

.creator-profile-popular-copy strong {
  font-size: var(--text-body-size);
  line-height: 1.35;
  color: var(--text-primary);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-profile-popular-copy small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.45;
  font-weight: var(--creator-font-weight-regular);
}

.creator-profile-vault-panel {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.creator-profile-vault-summary {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.creator-settings-section .session-btn{
    color: #fff;
    background-color: #6155F5!important;
    border-color: #6155F5!important;
}
.creator-settings-section .session-btn:hover{
    background-color: #463b9c!important;
    border-color: #463b9c!important;
}

.creator-profile-vault-summary p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.65;
}

.creator-profile-page--visitor {
  gap: 18px;
}

.creator-profile-hero--visitor {
  border-radius: 22px;
  overflow: hidden;
}

.creator-profile-identity-card--visitor {
  background: var(--bg-card);
}

.creator-profile-identity-grid--visitor {
  gap: 18px;
  padding: 0 24px 10px;
}

.creator-profile-identity-copy--visitor {
  padding-top: 8px;
}

.creator-profile-page--visitor .creator-profile-identity-main h1,
.creator-profile-page--visitor .creator-profile-identity-head h1 {
  font-size: var(--text-display-title-size);
}

.creator-profile-identity-row--visitor {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
}

.creator-profile-visitor-name-row {
  display: flex;
  align-items: center;
  min-width: 0;
}

.creator-profile-meta--visitor {
  flex-wrap: nowrap;
}

.creator-profile-active-copy {
  margin-top: 5px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: var(--leading-tight);
}

.creator-profile-page--visitor .creator-profile-bio {
  max-width: 720px;
  font-size: var(--text-card-title-size);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-profile-actions--visitor {
  display: flex;
  width: auto;
  max-width: none;
  flex-direction: column;
  flex: 0 0 auto;
  justify-content: flex-start;
  align-items: flex-end;
  gap: 8px;
  margin-left: auto;
}

.creator-profile-actions-primary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  white-space: nowrap;
}

.creator-profile-actions--visitor .creator-feed-secondary-btn {
  width: auto;
  justify-content: center;
}

.creator-profile-action-pill {
  min-height: 40px;
  border-radius: 14px;
}

.creator-profile-actions-primary .creator-profile-action-pill {
  min-width: 76px;
  padding-inline: 14px;
}

.creator-profile-share-icon-btn {
  width: 40px;
  min-width: 40px;
  padding-inline: 0;
}

.creator-profile-subscribe-btn {
  min-height: 40px;
  border-radius: 14px;
  background: #102a83;
  color: #fff;
  border-color: #102a83;
}

.creator-profile-subscribe-btn:hover {
  color: #fff;
}

.creator-profile-actions-danger {
  display: flex;
  justify-content: flex-end;
  gap: 14px;
}

.creator-profile-danger-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #dc2626;
  font-size: var(--text-meta-size);
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
}

.creator-profile-danger-link:hover {
  color: #b91c1c;
  text-decoration: none;
}

.creator-profile-subscribe-btn--active {
  background: #16a34a;
  border-color: #16a34a;
  color: #fff;
}

.creator-profile-tabs--visitor {
  margin-top: 14px;
}

.creator-profile-posts--visitor .card-updates {
  margin-bottom: 16px;
}

.creator-profile-shop-grid--visitor {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.creator-profile-dialog__narrow {
  max-width: 420px;
}

.creator-profile-dialog__surface {
  border: 1px solid var(--border-color);
  border-radius: 22px;
  background: var(--bg-card);
  
}

.creator-profile-dialog__header {
  padding: 22px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid var(--border-color);
}

.creator-profile-dialog__header h6 {
  margin: 0;
  font-size: var(--text-section-title-size);
  font-weight: 700;
  color: var(--text-primary);
}

.creator-profile-dialog__header p {
  margin: 6px 0 0;
  font-size: var(--text-meta-size);
  line-height: 1.5;
  color: var(--text-secondary);
}

.creator-profile-dialog__close {
  width: 34px;
  height: 34px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  background: var(--bg-muted);
  color: var(--text-primary);
}

.creator-profile-dialog__body {
  padding: 22px;
  display: grid;
  gap: 16px;
}

.creator-profile-dialog__field {
  display: grid;
  gap: 8px;
  margin: 0;
}

.creator-profile-dialog__field span {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: 600;
}

.creator-profile-dialog__footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.creator-subscription-modal__dialog {
  max-width: 680px;
}

.creator-subscription-modal__dialog--narrow {
  max-width: 520px;
}

.creator-subscription-modal__surface {
  overflow: hidden;
  border: 1px solid var(--border-color);
  border-radius: 26px;
  background: var(--bg-card);
  
}

.creator-subscription-modal__hero {
  position: relative;
  padding: 28px 28px 92px;
  background: linear-gradient(135deg, #0f1d5b, #183d9f);
  background-size: cover;
  background-position: center;
  color: #fff;
}

.creator-subscription-modal__close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
}

.creator-subscription-modal__eyebrow {
  display: inline-flex;
  margin-bottom: 10px;
  font-size: var(--text-micro-size);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.creator-subscription-modal__hero h4 {
  margin: 0;
  font-size: var(--text-display-title-size);
  line-height: 1.1;
  font-weight: 700;
}

.creator-subscription-modal__hero p {
  max-width: 360px;
  margin: 10px 0 0;
  font-size: var(--text-body-size);
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.82);
}

.creator-subscription-modal__body {
  padding: 0 28px 28px;
}

.creator-subscription-modal__identity {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: -20px;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}

.creator-subscription-modal__avatar {
  width: 88px;
  height: 88px;
  border-radius: 50%;
  object-fit: cover;
  border: 4px solid var(--bg-card);
  
}

.creator-subscription-modal__identity strong {
  display: block;
  color: var(--text-primary);
  font-size: var(--text-subtitle-size);
  font-weight: 700;
}

.creator-subscription-modal__identity span {
  display: block;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

.creator-subscription-modal__form,
.creator-subscription-modal__section {
  display: grid;
  gap: 16px;
}

.creator-subscription-modal__section + .creator-subscription-modal__section {
  margin-top: 18px;
}

.creator-subscription-modal__section-head h5 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-control-size);
  font-weight: 700;
}

.creator-subscription-modal__section-head span {
  display: block;
  margin-top: 4px;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-subscription-modal__gateways {
  display: grid;
  gap: 12px;
}

.creator-subscription-modal__plans {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.creator-subscription-modal__plan,
.creator-subscription-modal__gateway {
  margin: 0;
}

.creator-subscription-modal__plan input,
.creator-subscription-modal__gateway input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.creator-subscription-modal__plan-card {
  display: grid;
  gap: 4px;
  min-height: 88px;
  padding: 14px 16px;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--bg-card);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.creator-subscription-modal__gateway-card {
  display: grid;
  gap: 4px;
  min-height: 72px;
  padding: 14px 16px;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--bg-card);
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.creator-subscription-modal__plan-card strong,
.creator-subscription-modal__gateway-card strong {
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: 700;
}

.creator-subscription-modal__plan-card em,
.creator-subscription-modal__plan-card small,
.creator-subscription-modal__gateway-card small {
  color: var(--text-secondary);
  font-style: normal;
  font-size: var(--text-micro-size);
}

.creator-subscription-modal__plan input:checked + .creator-subscription-modal__plan-card,
.creator-subscription-modal__gateway input:checked + .creator-subscription-modal__gateway-card {
  border-color: #1d4ed8;
  background: color-mix(in srgb, var(--bg-card) 88%, #1d4ed8 12%);
  
}

.creator-subscription-modal__benefits {
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.creator-subscription-modal__benefits li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.5;
}

.creator-subscription-modal__benefits i {
  margin-top: 1px;
  color: #16a34a;
}

.creator-subscription-modal__terms {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.5;
}

.creator-subscription-modal__terms a {
  color: var(--brand-primary);
}

.creator-subscription-modal__taxes {
  margin: 0;
  padding: 12px 14px;
  list-style: none;
  border: 1px dashed var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-subscription-modal__footer {
  display: grid;
  justify-content: center;
  gap: 12px;
  margin-top: 8px;
  padding: 15px;
}
.creator-subscription-modal__footer .creator-feed-primary-btn{
  background-color: var(--brand-primary);
  border-color: var(--brand-primary); 
  border-radius: var(--radius-lg);
  padding: 10px 15px;
  color: #fff;
}

.creator-subscription-success__dialog {
  max-width: 420px;
}

.creator-subscription-success__surface {
  padding: 30px 24px;
  border: 1px solid var(--border-color);
  border-radius: 24px;
  background: var(--bg-card);
  
  text-align: center;
}

.creator-subscription-success__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  margin-bottom: 16px;
  border-radius: 50%;
  background: rgba(22, 163, 74, 0.12);
  color: #16a34a;
  font-size: var(--text-display-title-size);
}

.creator-subscription-success__surface h4 {
  margin: 0 0 10px;
  color: var(--text-primary);
  font-size: var(--text-display-title-size);
  font-weight: 700;
}

.creator-subscription-success__surface p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.6;
}

.creator-subscription-success__button {
  min-width: 140px;
  margin-top: 22px;
}

.creator-feed-topbar {
  margin-bottom: 0.75rem;
  top: 0.5rem;
  z-index: 20;
  width: 100%;
  min-height: 48px;
  padding: 0.5rem 0.875rem;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 17px;
}

.creator-feed-tabs {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  background: var(--bg-muted);
  border-radius: 14px;
  padding: 4px;
  flex: 0 0 auto;
  width: auto;
  min-width: 180px;
  height: 42px;
}

.creator-feed-tab {
  height: 34px;
  min-height: 34px;
  padding: 0 16px;
  border-radius: 11px;
  text-decoration: none;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-medium);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
  transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease;
}

.creator-feed-tab:hover {
  background: var(--bg-card);
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-tab.is-active {
  background: var(--bg-card);
  color: var(--text-primary);
  text-decoration: none;
  font-weight: var(--creator-font-weight-semibold);
  
}

.creator-feed-tab.is-disabled {
  pointer-events: none;
}

.creator-feed-tab.is-loading {
  opacity: 0.72;
}

.creator-feed-tab.is-loading::after {
  content: "";
  display: inline-block;
  width: 0.8rem;
  height: 0.8rem;
  margin-left: 0.45rem;
  border: 2px solid rgba(20, 33, 61, 0.18);
  border-top-color: currentColor;
  border-radius: 50%;
  animation: creator-feed-spin 0.75s linear infinite;
  vertical-align: middle;
}

.creator-global-search-bar {
  display: flex;
  justify-content: flex-end;
  margin: 0 0 16px;
}

.creator-global-search-bar .creator-feed-search {
  width: min(100%, 360px);
}

.creator-feed-search {
  position: relative;
  width: 100%;
  min-width: 0;
  max-width: none;
}

.creator-feed-search-toggle {
  display: none;
  width: 40px;
  height: 40px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-muted);
  color: var(--text-secondary);
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
}

.creator-feed-page .form-control,
.creator-feed-page .form-select {
  background: var(--bg-muted);
  color: var(--text-primary);
  border-color: var(--border-color);
}

.creator-feed-search-control {
  background: var(--bg-muted);
  color: var(--text-primary);
  border-color: var(--border-color);
  width: 100%;
  height: 42px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  padding: 0 16px 0 42px;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  
}

.creator-feed-search input {
  background: var(--bg-muted);
  color: var(--text-primary);
  border-color: var(--border-color);
  width: 100%;
  height: 42px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  padding: 0 16px 0 42px;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  
}

.creator-feed-search input:focus,
.creator-feed-search-control:focus,
.creator-feed-page .form-control:focus,
.creator-feed-page .form-select:focus {
  background: var(--bg-card);
  color: var(--text-primary);
  border-color: rgba(20, 33, 61, 0.3);
  
}

.creator-feed-search input:hover,
.creator-feed-search-control:hover {
  border-color: rgba(20, 33, 61, 0.18);
}

.creator-feed-search-control::placeholder {
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.creator-feed-header-theme {
  display: inline-flex;
  align-items: center;
}

.creator-feed-icon-btn,
.creator-feed-theme-toggle {
  position: relative;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  background: var(--bg-muted);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  flex: 0 0 42px;
  box-shadow: none;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.creator-feed-notification-btn {
  flex: 0 0 42px;
}

.creator-feed-notification-btn.is-active {
  color: var(--brand-primary);
  background: var(--bg-card);
}

.creator-feed-icon-btn i,
.creator-feed-theme-toggle i,
.creator-feed-search-toggle i {
  font-size: var(--text-section-title-size);
  line-height: 1;
}

.creator-feed-search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--text-secondary);
  pointer-events: none;
  font-size: var(--text-section-title-size);
  line-height: 1;
}

.creator-live-search-suggestions {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 80;
  max-height: min(420px, 62vh);
  overflow-x: hidden;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--border-color);
  border-radius: 16px;
  background: var(--bg-card);
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.16);
}

.creator-live-search-suggestions[hidden] {
  display: none;
}

.creator-live-search-option {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  border-radius: 12px;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-live-search-option:hover,
.creator-live-search-option:focus,
.creator-live-search-option.is-active {
  background: var(--bg-muted);
  color: var(--text-primary);
  text-decoration: none;
  outline: none;
}

.creator-live-search-avatar {
  display: block;
  width: 44px;
  height: 44px;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-live-search-copy,
.creator-live-search-name,
.creator-live-search-username,
.creator-live-search-subtitle {
  min-width: 0;
}

.creator-live-search-copy {
  display: flex;
  flex-direction: column;
  gap: 1px;
  overflow: hidden;
}

.creator-live-search-name {
  display: flex;
  align-items: center;
  gap: 5px;
  overflow: hidden;
  font-size: var(--text-body-size);
  font-weight: 650;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-live-search-verified {
  flex: 0 0 auto;
  color: var(--brand-primary);
  font-size: var(--text-meta-size);
}

.creator-live-search-username,
.creator-live-search-subtitle {
  overflow: hidden;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-live-search-arrow {
  color: var(--text-secondary);
  font-size: var(--text-body-size);
}

.creator-live-search-status {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 54px;
  padding: 12px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  text-align: center;
}

.creator-live-search-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: creator-feed-spin 0.75s linear infinite;
}

.creator-feed-icon-btn:hover,
.creator-feed-theme-toggle:hover {
  background: var(--bg-card);
  border-color: rgba(20, 33, 61, 0.18);
  color: var(--text-primary);
}

.creator-feed-theme-toggle .theme-icon-light {
  display: none;
}

html[data-theme="dark"] .creator-feed-theme-toggle .theme-icon-dark {
  display: none;
}

html[data-theme="dark"] .creator-feed-theme-toggle .theme-icon-light {
  display: inline-block;
}

.creator-feed-notice-card {
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  min-height: 42px;
  padding: 0.5rem 0.75rem;
  background: rgba(122, 103, 255, 0.08);
  border: 1px solid var(--border-color);
  border-radius: 10px;
}

.creator-feed-card {
  background: var(--bg-card);
  border-radius: 24px;
  /*box-shadow: var(--shadow-card);*/
  padding:15px;
}
.creator-profile-right-sidebar .creator-feed-card{
    padding: 0.85rem;
}
.creator-campaigns-page .creator-feed-card{
    padding-top: 0!important;
}

.creator-feed-notice-inline {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
  text-align: center;
  justify-content: center;

}

.creator-feed-notice-icon {
  width: 20px;
  height: 20px;
  border-radius: var(--radius-pill);
  color: #dc2626;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.creator-feed-notice-card p {
  margin-bottom: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-feed-notice-card p a {
  color: #2563eb;
  font-weight: 600;
  text-decoration: none;
}

.creator-feed-notice-close {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.creator-feed-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.creator-feed-section-heading a {
  color: var(--brand-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-decoration: none;
}

.creator-feed-right-rail .creator-feed-section-heading h3 {
  font-size: var(--text-lead-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-section-heading-with-controls {
  align-items: center;
}

.creator-feed-section-controls {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.creator-feed-section-link {
  color: var(--brand-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-decoration: none;
  margin-right: 0.15rem;
}

.creator-feed-section-control {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-card);
  color: var(--text-secondary);
  padding: 0;
}

.creator-feed-section-control:disabled {
  opacity: 0.42;
  cursor: default;
}

.creator-feed-status-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  margin-right: 0.4rem;
}

.creator-feed-stories-card {
  overflow: hidden;
  margin: 0.65rem 0 0.8rem;
}

.creator-feed-stories-wrapper {
  display: flex;
  align-items: stretch;
  gap: 0.5rem;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 0 0.1rem;
  min-height: 0;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.creator-feed-stories-wrapper::-webkit-scrollbar {
  display: none;
}

.creator-feed-composer-card {
  margin-bottom: 0.75rem;
}

.creator-feed-composer-trigger {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.creator-feed-composer-avatar-btn {
  pointer-events: auto;
  cursor: pointer;
  position: relative;
  z-index: 1;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: var(--radius-pill);
  flex: 0 0 42px;
  overflow: hidden;
}

.creator-feed-composer-avatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  display: block;
}

.creator-feed-composer-pill {
  pointer-events: auto;
  cursor: pointer;
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-muted);
  color: var(--text-secondary);
  text-align: left;
  padding: 0 1rem;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.4;
  transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.creator-feed-composer-pill:hover,
.creator-feed-composer-pill:focus-visible,
.creator-feed-composer-avatar-btn:focus-visible {
  border-color: color-mix(in srgb, var(--brand-primary) 18%, var(--border-color));
  background: color-mix(in srgb, var(--bg-muted) 88%, var(--brand-primary) 4%);
  color: var(--text-primary);
  
  outline: none;
}

.creator-post-composer-modal,
.creator-post-success-modal,
.creator-post-discard-modal {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.creator-post-composer-modal[hidden],
.creator-post-success-modal[hidden],
.creator-post-discard-modal[hidden] {
  display: none;
}

.creator-post-composer-backdrop,
.creator-post-success-backdrop,
.creator-post-discard-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(17, 24, 39, 0.58);
}

.creator-post-composer-surface {
  position: relative;
  width: min(100%, 720px);

  max-height: none;
  overflow: visible;

  border-radius: 24px;
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  z-index: 1;
}

.creator-post-composer-surface:focus-visible,
.creator-post-success-surface:focus-visible,
.creator-post-discard-surface:focus-visible {
  outline: 2px solid var(--brand-primary);
  outline-offset: 2px;
}

.creator-post-composer-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px 0;
}

.creator-post-composer-author {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.creator-post-composer-author-avatar {
  width: 44px;
  height: 44px;
  border-radius: var(--radius-pill);
  object-fit: cover;
  flex: 0 0 44px;
}

.creator-post-composer-author-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.creator-post-composer-author-copy strong {
  font-size: var(--text-control-size);
  line-height: 1.25;
  color: var(--text-primary);
}

.creator-post-composer-author-copy span {
  font-size: var(--text-meta-size);
  line-height: 1.35;
  color: var(--text-secondary);
}

.creator-post-composer-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.creator-post-composer-mode-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 11px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--brand-primary) 12%, var(--bg-card));
  color: var(--brand-primary);
  font-size: var(--text-micro-size);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.creator-post-composer-close,
.creator-post-success-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.creator-post-composer-close:hover,
.creator-post-composer-close:focus-visible,
.creator-post-success-close:hover,
.creator-post-success-close:focus-visible {
  background: var(--bg-muted);
  color: var(--text-primary);
}

.creator-post-composer-body {
  padding: 10px 0 0;
}

.creator-post-composer-body #formUpdateCreate {
  margin: 0;
}

/* !important allowed in this block: legacy Bootstrap/FileUploader composer markup. */
.creator-post-composer-body #formUpdateCreate .card {
  margin-bottom: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.creator-post-composer-body #formUpdateCreate .card-body {
  padding: 0 24px 0;
  background: transparent !important;
}

.creator-post-composer-body #formUpdateCreate .card-footer {
  padding: 0 24px 22px;
  background: transparent !important;
}

.creator-post-composer-body #formUpdateCreate .media {
  align-items: flex-start;
  gap: 14px;
}

.creator-post-composer-body #formUpdateCreate .avatarUser {
  width: 46px;
  height: 46px;
}

.creator-post-composer-body #formUpdateCreate textarea {
  min-height: 184px;
  padding: 8px 0 10px;
  font-size: var(--text-section-title-size);
  line-height: 1.55;
  color: var(--text-primary);
  background: transparent;
  border-radius: 0;
  box-shadow: none !important;
  resize: none;
}

.creator-post-composer-body #formUpdateCreate textarea::placeholder {
  color: var(--text-secondary);
}

.creator-post-composer-body #formUpdateCreate textarea:focus {
  outline: none;
}

.creator-post-composer-body #formUpdateCreate .form-group {
  margin-bottom: 14px;
}

.creator-post-composer-body #formUpdateCreate .input-group-text,
.creator-post-composer-body #formUpdateCreate .form-control {
  border-radius: var(--radius-md);
}
.creator-post-composer-body #formUpdateCreate .creator-post-composer-content-fields .form-control {
  border-radius: 0 12px 12px 0;
  padding-left: 15px;
}
.creator-post-composer-body #formUpdateCreate .creator-post-composer-content-fields .input-group-prepend .input-group-text{
border-radius: 12px 0  0 12px;
border: 1px var(--border-color) solid;
}
.creator-feed-post-card {
  overflow: visible !important;
}

.creator-feed-post-card:has(.dropdown-menu.show) {
  position: relative;
  z-index: 50;
}

.creator-feed-post-menu-dropdown {
  z-index: 1000 !important;
}

.creator-post-composer-body #formUpdateCreate .btn-post,
.creator-post-composer-body #formUpdateCreate #dropdownMoreOptions,
.creator-post-composer-body #formUpdateCreate #dropdownEmoji {
  width: 38px;
  height: 38px;
  padding: 0;
  border-radius: var(--radius-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-muted);
}

.creator-post-composer-body #formUpdateCreate .card-footer > .justify-content-between.align-items-center {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
}

.creator-post-composer-content-fields {
  width: 100%;
}

.creator-post-composer-toolbar {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  min-width: 0;
}


.creator-post-composer-body #formUpdateCreate .btn-post:hover,
.creator-post-composer-body #formUpdateCreate .btn-post:focus-visible,
.creator-post-composer-body #formUpdateCreate #dropdownMoreOptions:hover,
.creator-post-composer-body #formUpdateCreate #dropdownEmoji:hover {
  background: color-mix(in srgb, var(--brand-primary) 10%, var(--bg-muted));
}

.creator-post-composer-body #formUpdateCreate #btnCreateUpdate {
  min-width: 128px;
  min-height: 42px;
  font-size: var(--text-body-size);
  font-weight: 600;
  border-radius: var(--radius-pill);
}

.creator-post-composer-body #formUpdateCreate #the-count {
  margin: 0;
  color: var(--text-secondary);
}

.creator-post-composer-body #formUpdateCreate #previewImage img {
  max-width: 132px;
  border-radius: 14px;
}

.creator-post-composer-body #formUpdateCreate .progress-wrapper {
  padding: 0 22px !important;
}

.creator-post-success-surface {
  position: relative;
  width: min(100%, 340px);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border-radius: 24px;
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  
  z-index: 1;
  padding: 28px 24px 24px;
  text-align: center;
}

.creator-post-success-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 14px;
  border-radius: var(--radius-pill);
  border: 1.5px solid color-mix(in srgb, var(--brand-primary) 30%, var(--border-color));
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-display-title-size);
}

.creator-post-success-surface h2 {
  margin: 0 0 18px;
  font-size: var(--text-section-title-size);
  line-height: 1.35;
  color: var(--text-primary);
}

.creator-post-success-action {
  width: 100%;
  min-height: 44px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--brand-primary);
  color: #fff;
  font-size: var(--text-body-size);
  font-weight: 600;
}

.creator-post-discard-surface {
  position: relative;
  width: min(100%, 360px);
  max-height: calc(100dvh - 48px);
  overflow: auto;
  border-radius: 24px;
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  
  z-index: 1;
  padding: 18px 20px 20px;
}

.creator-post-discard-handle {
  width: 46px;
  height: 5px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--text-secondary) 24%, transparent);
  display: block;
  margin: 0 auto 14px;
}

.creator-post-discard-surface h2 {
  margin: 0 0 6px;
  font-size: var(--text-section-title-size);
  color: var(--text-primary);
}

.creator-post-discard-surface p {
  margin: 0 0 16px;
  font-size: var(--text-body-size);
  line-height: 1.55;
  color: var(--text-secondary);
}

.creator-post-discard-actions {
  display: grid;
  gap: 10px;
}

.creator-post-discard-actions button {
  min-height: 44px;
  border-radius: var(--radius-pill);
  font-size: var(--text-body-size);
  font-weight: 600;
}

.creator-post-discard-save {
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-secondary);
}

.creator-post-discard-save[disabled] {
  opacity: 0.55;
  cursor: not-allowed;
}

.creator-post-discard-discard {
  border: 0;
  background: var(--brand-primary);
  color: #fff;
}

.creator-post-discard-cancel {
  border: 1px solid var(--border-color);
  background: transparent;
  color: var(--text-primary);
}

.creator-feed-post-focus {
  
}

html[data-theme="dark"] .creator-post-composer-backdrop,
html[data-theme="dark"] .creator-post-success-backdrop,
html[data-theme="dark"] .creator-post-discard-backdrop {
  background: rgba(2, 6, 23, 0.74);
}

html[data-theme="dark"] .creator-post-composer-surface,
html[data-theme="dark"] .creator-post-success-surface,
html[data-theme="dark"] .creator-post-discard-surface {
  
}

html[data-theme="dark"] .creator-post-composer-body #formUpdateCreate .btn-post,
html[data-theme="dark"] .creator-post-composer-body #formUpdateCreate #dropdownMoreOptions,
html[data-theme="dark"] .creator-post-composer-body #formUpdateCreate #dropdownEmoji,
html[data-theme="dark"] .creator-post-composer-close:hover,
html[data-theme="dark"] .creator-post-composer-close:focus-visible,
html[data-theme="dark"] .creator-post-success-close:hover,
html[data-theme="dark"] .creator-post-success-close:focus-visible {
  background: color-mix(in srgb, var(--bg-muted) 76%, #fff 6%);
}

@media (max-width: 991.98px) {
  .creator-post-composer-modal,
  .creator-post-success-modal,
  .creator-post-discard-modal {
    padding: 0;
    align-items: flex-end;
  }

  .creator-post-composer-surface {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;

    border-radius: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
  }

  .creator-post-composer-header {
    padding: 16px 16px 0;
  }

  .creator-post-composer-body #formUpdateCreate .card-body,
  .creator-post-composer-body #formUpdateCreate .card-footer,
  .creator-post-composer-body #formUpdateCreate .progress-wrapper {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .creator-post-composer-body #formUpdateCreate textarea {
    min-height: 152px;
    font-size: var(--text-section-title-size);
  }

  .creator-post-composer-body #formUpdateCreate .avatarUser {
    width: 42px;
    height: 42px;
  }


  .creator-post-composer-body #formUpdateCreate .card-footer > .justify-content-between.align-items-center {
    gap: 10px;
  }

  .creator-post-success-surface,
  .creator-post-discard-surface {
    width: 100%;
    max-width: none;
    border-radius: 22px 22px 0 0;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
  }
    .creator-post-composer-body #formUpdateCreate
  .card-footer > .creator-post-composer-controls {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    width: 100%;
  }

  .creator-post-composer-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 4px;
    width: 100%;
  }

  .creator-post-composer-publish-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
    margin-left: 0;
  }

  .creator-post-composer-publish-wrap {
    flex: 1 1 auto;
    min-width: 0;
  }

  .creator-post-composer-body #formUpdateCreate #btnCreateUpdate {
    width: 100%;
    min-width: 0;
    min-height: 44px;
  }

  .creator-post-composer-count {
    flex: 0 0 auto;
    min-width: 30px;
    white-space: nowrap;
  }

}

.creator-post-composer-publish-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-left: auto;
}

.creator-post-composer-publish-wrap {
  display: inline-flex;
  align-items: center;
  position: relative;
}

.creator-post-composer-body #formUpdateCreate #btnCreateUpdate {
  min-width: 128px;
  min-height: 42px;
  width: auto;
  margin: 0;
  font-size: var(--text-body-size);
  font-weight: 600;
  border-radius: var(--radius-pill);
}

.creator-post-composer-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  margin: 0;
  color: var(--text-secondary);
  white-space: nowrap;
}

.creator-feed-page--home {
  --bg-page: #f6f6f8;
  --bg-sidebar: #fbfbfc;
  --bg-card: #ffffff;
  --bg-muted: #f3f4f6;
  --text-primary: #333333;
  --text-secondary: #666666;
  --border-color: #ececf0;
  --brand-primary: #00167A;
  --brand-primary-hover: #00167A;
  --shadow-card: 0 10px 30px rgba(16, 24, 40, 0.05);
}

html[data-theme="dark"] .creator-feed-page--home {
  --bg-page: var(--auth-bg);
  --bg-sidebar: var(--auth-surface-1);
  --bg-card: var(--auth-surface-2);
  --bg-muted: var(--auth-surface-3);
  --text-primary: var(--auth-text-primary);
  --text-secondary: var(--auth-text-secondary);
  --border-color: var(--auth-border);
  --brand-primary: var(--auth-accent);
  --brand-primary-hover: var(--auth-accent-hover);
  --shadow-card: var(--auth-shadow);
}

.creator-feed-page--home .creator-feed-topbar {
  border-bottom: 1px var(--border-color) solid;
}

.creator-feed-page--home .creator-feed-person-card img,
.creator-feed-page--home .creator-feed-composer-trigger img {
  width: 40px;
  height: 40px;
}

.creator-feed-page--home .creator-feed-composer-avatar {
  width: 100%;
  height: 100%;
}

.creator-feed-page--home .creator-feed-person-card strong {
  font-size: var(--text-meta-size);
  line-height: 1.25;
}

.creator-feed-page--home .creator-feed-person-card small {
  margin-top: 2px;
  font-size: var(--text-caption-size);
}

.creator-feed-page--home .creator-feed-composer-card {
  margin-bottom: 10px;
}

.creator-feed-page--home .creator-feed-empty-card {
  border-radius: var(--radius-xl);
  border-color: var(--border-color);
  
  margin-bottom: 10px;
}

.creator-feed-page--home .creator-feed-card {
  border-radius: var(--radius-xl);
  border-color: var(--border-color);
  /*box-shadow: var(--shadow-card);*/
  margin-bottom: 10px;
  padding: 0;
}

.creator-feed-page--home .creator-feed-composer-trigger {
  gap: 10px;
}

.creator-feed-page--home .creator-feed-composer-avatar-btn {
  width: 42px;
  height: 42px;
  flex-basis: 42px;
}

.creator-feed-page--home .creator-feed-composer-pill {
  min-height: 46px;
  padding: 0 16px;
  border-radius: var(--radius-pill);
  font-size: var(--text-body-size);
}

.creator-feed-page--home .creator-feed-notice-card {
  border-radius: var(--radius-xl);
  border-color: var(--border-color);
  
  margin-bottom: 10px;
  min-height: 40px;
  padding: 10px 12px;
  background: #f7f7fa;
  margin: 8px 15px;
}

.creator-feed-page--home .creator-feed-notice-inline {
  gap: 8px;
}

.creator-feed-page--home .creator-feed-notice-icon {
  width: 18px;
  height: 18px;
  font-size: var(--text-meta-size);
}

.creator-feed-page--home .creator-feed-notice-card p {
  font-size: var(--font-size-body);
}

.creator-feed-page--home .creator-feed-stories-card {
  margin-bottom: 10px;
  padding: 8px 10px;
}

.creator-feed-page--home .creator-feed-stories-wrapper {
  gap: 8px;
}

.creator-feed-page--home .creator-feed-for-you {
  gap: 10px;
}

.creator-feed-page--home .creator-feed-section-heading {
  margin-bottom: 12px;
}

.creator-feed-page--home .creator-feed-section-heading--compact {
  margin-bottom: 10px;
}

.creator-feed-page--home .creator-feed-shell-main .creator-feed-section-kicker {
  margin-bottom: 2px;
  font-size: var(--text-caption-size);
  font-weight: 600;
  letter-spacing: 0.04em;
}

.creator-feed-page--home .creator-feed-section-heading h3 {
  margin: 0;
  font-size: var(--font-size-body);
  line-height: 1.25;
  font-weight: 500!important;
}

.creator-feed-page--home .creator-feed-section-heading a {
  font-size: var(--text-micro-size);
}

.creator-feed-page--home .creator-feed-section-controls {
  gap: 6px;
}

.creator-feed-page--home .creator-feed-section-control {
  width: 26px;
  height: 26px;
}

.creator-feed-page--home .creator-feed-carousel {
  gap: 10px;
}

.creator-feed-page--home .creator-feed-carousel-card {
  min-width: 188px;
  padding: 0;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  overflow: hidden;
}

.creator-feed-page--home .creator-feed-product-card {
  min-width: 232px;
}

.creator-feed-page--home .creator-feed-carousel-profile {
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
}

.creator-feed-page--home .creator-feed-carousel-profile strong {
  margin-top: 10px;
  font-size: var(--text-meta-size);
}

.creator-feed-page--home .creator-feed-carousel-profile small {
  font-size: var(--text-caption-size);
}

.creator-feed-page--home .creator-feed-carousel-actions {
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  gap: 6px;
  padding-top: 0;
  padding-bottom: 10px;
}

.creator-feed-page--home .creator-feed-campaign-media,
.creator-feed-page--home .creator-feed-product-media {
  /*aspect-ratio: 1.58 / 1;*/
  height: 200px;
}

.creator-feed-page--home .creator-feed-campaign-media img,
.creator-feed-page--home .creator-feed-product-media img,
.creator-feed-page--home .creator-feed-right-highlight-media img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

.creator-feed-page--home .creator-feed-campaign-copy {
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
}

.creator-feed-page--home .creator-feed-product-copy {
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 10px;
}

.creator-feed-page--home .creator-feed-campaign-title,
.creator-feed-page--home .creator-feed-product-title {
  font-size: var(--text-meta-size);
  line-height: 1.4;
  font-weight: 600;
}

.creator-feed-page--home .creator-feed-campaign-copy p,
.creator-feed-page--home .creator-feed-product-copy p {
  margin: 6px 0 0;
  font-size: var(--text-caption-size);
  line-height: 1.5;
  color: var(--text-secondary);
}

.creator-feed-page--home .creator-feed-campaign-meta,
.creator-feed-page--home .creator-feed-campaign-stats {
  font-size: var(--text-caption-size);
}

.creator-feed-page--home .creator-feed-product-meta {
  padding-left: 10px;
  padding-right: 10px;
  font-size: var(--text-caption-size);
  padding-top: 10px;
  padding-bottom: 6px;
}

.creator-feed-page--home .creator-feed-feed-wrap .card-updates {
  border-radius: 18px;
  border-color: var(--border-color);
  
  margin-bottom: 10px;
}

.creator-feed-page--home .creator-feed-post-card {
  border-radius: 18px;
  overflow: hidden;
  background: var(--bg-card);
}

.creator-feed-page--home .card-updates .media {
  align-items: center;
}

.creator-feed-page--home .creator-feed-post-header {
  align-items: flex-start;
}

.creator-feed-page--home .card-updates .avatarUser {
  width: 42px;
  height: 42px;
}

.creator-feed-page--home .creator-feed-post-author-row {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  width: 100%;
  min-width: 0;
  padding-right: 0;
  font-size: var(--text-body-size);
  line-height: 1.2;
  font-weight: 600;
}

.creator-feed-page--home .creator-feed-post-author-name {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-page--home .creator-feed-post-author-badge {
  font-size: var(--text-micro-size);
}

.creator-feed-page--home .creator-feed-post-username,
.creator-feed-page--home .creator-feed-post-timestamp,
.creator-feed-page--home .creator-feed-post-visibility {
  font-size: var(--text-caption-size);
  line-height: 1.35;
  color: var(--text-secondary);
}

.creator-feed-page--home .creator-feed-post-menu-trigger {
  position: static;
  float: none;
  line-height: 1;
}

.creator-feed-page--home .creator-feed-post-meta-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.creator-feed-page--home .creator-feed-post-copy-wrap {
  padding-top: 0;
}

.creator-feed-page--home .creator-feed-post-copy {
  font-size: var(--text-control-size);
  line-height: 1.6;
  color: var(--text-secondary);
}

.creator-feed-page--home .creator-feed-post-media-block {
  overflow: hidden;
}

.creator-feed-page--home .creator-feed-post-media-single,
.creator-feed-page--home .creator-feed-post-gallery {
  display: block;
  width: 100%;
}

.creator-feed-page--home .creator-feed-post-image,
.creator-feed-page--home .creator-feed-post-video {
  width: 100%;
  max-height: 360px;
  object-fit: cover;
  display: block;
}

.creator-feed-page--home .creator-feed-post-gallery .media-wrapper {
  background: var(--bg-muted);
}

.creator-feed-page--home .creator-feed-post-actions {
  min-height: 2.5rem;
}

.creator-feed-page--home .creator-feed-post-actions-left {
  gap: 0.875rem;
}

.creator-feed-page--home .creator-feed-action-chip span,
.creator-feed-page--home .creator-feed-action-chip .countLikes,
.creator-feed-page--home .creator-feed-action-chip .totalComments {
  font-size: var(--text-meta-size);
}

.creator-feed-page--home .creator-feed-action-chip i,
.creator-feed-page--home .creator-feed-action-bookmark i {
  font-size: var(--text-control-size);
}

.creator-feed-page--home .creator-feed-action-bookmark {
  min-width: 2rem;
  min-height: 2rem;
  font-size: var(--text-control-size);
  margin-left: 10px;
}

.creator-feed-page--home .creator-feed-post-footer {
  padding: 0.7rem 1rem 0.8rem;
  background: transparent;
}

.creator-feed-page--home .creator-feed-action-btn {
  min-width: 2rem;
  min-height: 28px;
  font-size: var(--text-micro-size);
}

.creator-feed-page--home .creator-feed-right-rail {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.creator-feed-page--home .creator-feed-right-highlight-card {
  padding: 12px;
}

.creator-feed-page--home .creator-feed-right-highlight-media {
  display: block;
  /*aspect-ratio: 1.78 / 1;*/
  border-radius: 14px;
  overflow: hidden;
}

.creator-feed-page--home .creator-feed-right-highlight-copy {
  padding-top: 10px;
}

.creator-feed-page--home .creator-feed-right-campaign-meta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}

.creator-feed-page--home .creator-feed-right-campaign-source {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.creator-feed-page--home .creator-feed-right-campaign-avatar {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-feed-page--home .creator-feed-right-campaign-source-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.creator-feed-page--home .creator-feed-right-campaign-source-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex-wrap: nowrap;
}

.creator-feed-page--home .creator-feed-right-campaign-source-name {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  line-height: 1.35;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-page--home .creator-feed-right-campaign-source-title i {
  flex-shrink: 0;
  font-size: var(--text-meta-size);
  color: var(--brand-primary);
}

.creator-feed-page--home .creator-feed-right-campaign-source-time {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-secondary);
  font-size: var(--text-caption-size);
  line-height: 1.3;
}

.creator-feed-page--home .creator-feed-right-campaign-platforms {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  color: var(--text-secondary);
  flex-shrink: 0;
}

.creator-feed-page--home .creator-feed-right-campaign-platforms i {
  font-size: var(--text-body-size);
}

.creator-feed-page--home .creator-feed-right-highlight-copy strong {
  display: block;
  font-size: var(--text-meta-size);
  line-height: 1.35;
}

.creator-feed-page--home .creator-feed-right-highlight-copy p {
  margin: 6px 0 0;
  font-size: var(--text-caption-size);
  line-height: 1.5;
  color: var(--text-secondary);
}

.creator-feed-page--home .creator-feed-stack {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.creator-feed-page--home .creator-feed-empty-state {
  padding: 6px 0 0;
}

.creator-feed-page--home .creator-feed-footer {
  padding: 4px 2px 0;
}

@media (max-width: 1199.98px) {
  .creator-feed-page {
    --creator-workspace-gutter: 16px;
  }
}

@media (max-width: 575.98px) {
  .creator-feed-page--home .creator-feed-notice-card {
    border-radius: 18px;
  }

  .creator-feed-page--home .card-updates .card-body {
    padding: 10px;
  }

  .creator-feed-page--home .creator-feed-card {
    border-radius: 18px;
    padding: 10px;
  }

  .creator-feed-page--home .creator-feed-post-card {
    border-radius: var(--radius-lg);
  }

  .creator-feed-page--home .creator-feed-feed-wrap .card-updates {
    border-radius: var(--radius-lg);
  }

  .creator-feed-page--home .creator-feed-post-author-row {
    font-size: var(--text-meta-size);
    padding-right: 0;
  }

  .creator-feed-page--home .creator-feed-post-username,
  .creator-feed-page--home .creator-feed-post-timestamp,
  .creator-feed-page--home .creator-feed-post-visibility {
    font-size: var(--text-badge-size);
  }

  .creator-feed-page--home .creator-feed-post-copy {
    font-size: var(--text-micro-size);
    line-height: 1.5;
  }

  .creator-feed-page--home .creator-feed-post-image,
  .creator-feed-page--home .creator-feed-post-video {
    max-height: 320px;
  }

  .creator-feed-page--home .creator-feed-post-footer {
    padding: 8px 10px 10px;
  }

  .creator-feed-page--home .creator-feed-post-actions-left {
    gap: 10px;
  }

  .creator-feed-page--home .creator-feed-action-btn,
  .creator-feed-page--home .creator-feed-action-bookmark {
    font-size: var(--text-meta-size);
  }

  .creator-feed-page--home .creator-feed-carousel-card,
  .creator-feed-page--home .creator-feed-campaign-card,
  .creator-feed-page--home .creator-feed-product-card {
    min-width: 170px;
  }

  .creator-feed-page--home .creator-feed-composer-pill,
  .creator-feed-page--home .creator-feed-search-control {
    font-size: var(--text-card-title-size);
  }
}

.creator-feed-feed-wrap .card-updates {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  
  border-radius: 18px;
  margin-bottom: 0.85rem;
}

.creator-feed-feed-panel {
  min-height: 180px;
}

.creator-feed-skeleton-card,
.creator-feed-error-card {
  padding: 1.15rem;
}

.creator-feed-skeleton {
  position: relative;
  overflow: hidden;
  background: var(--bg-muted);
  border-radius: var(--radius-pill);
}

.creator-feed-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
  transform: translateX(-100%);
  animation: creator-feed-shimmer 1.1s infinite;
}

html[data-theme="dark"] .creator-feed-skeleton::after {
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
}

.creator-feed-skeleton-line {
  height: 12px;
  margin-bottom: 0.75rem;
}

.creator-feed-skeleton-title {
  height: 16px;
  width: 42%;
}

.creator-feed-skeleton-short {
  width: 68%;
  margin-bottom: 0;
}

.creator-feed-error-text {
  color: var(--text-secondary);
}

.creator-feed-empty-state-card .creator-feed-empty-actions {
  align-items: center;
}

.creator-feed-load-more-error {
  margin-bottom: 1rem;
}

.creator-feed-feed-wrap .card-updates .card-body {
  color: var(--text-primary);
}

.creator-feed-page .announcements {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  
  border-radius: 18px;
  color: var(--text-primary);
}

/* !important allowed in this block: Bootstrap utility color/surface overrides. */
.creator-feed-page .text-muted,
.creator-feed-page small.text-muted,
.creator-feed-page .update-text p,
.creator-feed-page .update-text {
  color: var(--text-secondary) !important;
}

.creator-feed-page .bg-white,
.creator-feed-page .dropdown-menu,
.creator-feed-page .modal-content,
.creator-feed-page .list-group-item {
  background: var(--bg-card) !important;
  color: var(--text-primary);
  border-color: var(--border-color);
}

.creator-feed-page .card-footer {
  border-top-color: var(--border-color) !important;
}

.creator-feed-action-tip {
  width: auto;
  padding: 0 0.55rem;
  gap: 0.35rem;
}

.creator-feed-action-tip svg {
  width: 18px;
  height: 18px;
}

.creator-feed-action-label {
  font-size: var(--text-body-size);
  font-weight: 500;
  line-height: 1;
}

.creator-feed-post-meta {
  display: flex;
  align-items: center;
  gap: 0.35rem 0.55rem;
  flex-wrap: wrap;
  margin-bottom: 0;
}

.creator-feed-post-meta .countLikes,
.creator-feed-post-meta .totalComments,
.creator-feed-post-meta .dot-item {
  font-size: var(--text-meta-size);
  line-height: 1.35;
}

.creator-feed-page .card-body,
.creator-feed-page .card,
.creator-feed-page .input-group-text,
.creator-feed-page .custom-file-label,
.creator-feed-page .fileuploader,
.creator-feed-page .fileuploader-items,
.creator-feed-page .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item,
.creator-feed-page .fileuploader-theme-thumbnails .fileuploader-thumbnails-input,
.creator-feed-page .fileuploader-input,
.creator-feed-page .modal-body,
.creator-feed-page .modal-footer {
  background: var(--bg-card);
  color: var(--text-primary);
  border-color: var(--border-color);
}

.creator-feed-page img,
.creator-feed-page video,
.creator-feed-page iframe,
.creator-feed-page canvas,
.creator-feed-page svg {
  max-width: 100%;
}

.creator-feed-feed-wrap .card-updates.creator-feed-post-card,
.creator-feed-page .card-updates.creator-feed-post-card {
  border-radius: 0;
  border-bottom: 1px solid var(--border-color);
  border-left: 0;
  border-right: 0;
  border-top: 0;
  
  overflow: hidden;
  margin-bottom: 1rem;
  background: var(--bg-card);
}

.creator-feed-post-card .creator-feed-post-card-body {
  padding: 1.05rem 1.1rem 0.8rem;
}

/* !important allowed in this block: legacy post-card utility classes emitted by Blade. */
.creator-feed-post-card .pinned_post,
.creator-feed-post-card .text-muted.w-100.mb-4 {
  margin-bottom: 0.75rem !important;
}

.creator-feed-post-card .media {
  align-items: flex-start;
}

.creator-feed-post-card .creator-feed-post-header {
  display: flex;
  align-items: flex-start;
  gap: 0.1rem;
}

.creator-feed-post-card .creator-feed-post-avatar-wrap {
  flex: 0 0 auto;
  margin-right: 0;
}

.creator-feed-post-card .avatarUser {
  width: 48px !important;
  height: 48px !important;
  object-fit: cover;
}

.creator-feed-post-card .creator-feed-post-header-body {
  flex: 1 1 auto;
  min-width: 0;
  z-index:10;
}

.creator-feed-post-card .creator-feed-post-author-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: 100%;
  min-width: 0;
  padding-right: 0;
}

.creator-feed-post-card .creator-feed-post-author-name {
  min-width: 0;
  max-width: 100%;
  font-size: var(--text-control-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-feed-post-card .media-body h5,
.creator-feed-post-card .media-body .h5 {
  margin-bottom: 0.15rem;
  font-size: var(--text-control-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
  padding-right: 0;
}

.creator-feed-post-card .media-body h5 a,
.creator-feed-post-card .media-body .h5 a {
  color: var(--text-primary);
}

.creator-feed-post-card .verified {
  font-size: var(--text-card-title-size);
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  color: #D308EE
}

.creator-feed-post-card .font-14,
.creator-feed-post-card .timeAgo,
.creator-feed-post-card .type-post,
.creator-feed-post-card small.text-muted {
  font-size: var(--text-meta-size) !important;
  line-height: 1.4;
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-post-card .creator-feed-post-username {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-feed-post-card .creator-feed-post-menu-trigger {
  position: static;
  float: none;
  line-height: 1;
}

.creator-feed-post-card .creator-feed-post-menu-dropdown {
  flex: 0 0 auto;
  margin-left: auto;
  align-self: flex-start;
  line-height: 1;
}

.creator-feed-post-card .creator-feed-post-meta-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.creator-feed-post-card .media-body > .timeAgo,
.creator-feed-post-card .media-body > .type-post {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
}

.creator-feed-post-card .text-word-break,
.creator-feed-post-card .update-text {
  font-size: var(--text-control-size);
  line-height: 1.6;
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-post-card .creator-feed-post-copy-wrap,
.creator-feed-post-card .card-body.pt-0.pb-3 {
  padding: 0 1.1rem 0.9rem !important;
}

.creator-feed-post-card .btn-block.creator-feed-post-media-block,
.creator-feed-post-card .btn-block {
  margin-top: 0;
}

.creator-feed-post-media-single,
.creator-feed-post-gallery {
  display: block;
  width: 100%;
}

.creator-feed-post-image,
.creator-feed-post-video {
  display: block;
  width: 100%;
  max-height: min(34rem, 72vh);
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-feed-post-gallery .media-wrapper {
  animation: none;
  background-color: var(--bg-muted);
  background-image: none;
  overflow: hidden;
}

.creator-feed-post-gallery .post-img-grid {
  opacity: 1;
}

.creator-feed-gallery-item {
  display: block;
}

.creator-feed-gallery-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 1;
}

.creator-feed-post-footer {
  padding: 0.7rem 1rem 0.8rem;
  background: var(--bg-card);
  border-top: 1px solid color-mix(in srgb, var(--border-color) 88%, transparent);
}

.creator-feed-post-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  min-height: 44px;
  margin-bottom: 0;
}

.creator-feed-post-actions-left {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  min-width: 0;
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
}

.creator-feed-post-actions-left::-webkit-scrollbar {
  display: none;
}

.creator-feed-post-actions-right {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  margin-left: auto;
}

.creator-feed-action-btn {
  min-width: 32px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-pill);
  font-size: var(--text-control-size);
  padding: 0;
  gap: 0.35rem;
  background: transparent;
  border: 0;
  box-shadow: none;
  color: var(--text-secondary);
}

.creator-feed-action-chip {
  width: auto;
  text-decoration: none;
}

.creator-feed-action-chip span,
.creator-feed-action-chip .countLikes,
.creator-feed-action-chip .totalComments {
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-medium);
  line-height: 1.2;
  color: inherit;
  white-space: nowrap;
}

.creator-feed-action-chip i,
.creator-feed-action-bookmark i {
  font-size: var(--text-control-size);
  line-height: 1;
}

.creator-feed-action-btn.active,
.creator-feed-action-btn.active i {
  color: var(--text-secondary);
}

.creator-feed-action-bookmark {
  margin-left: auto;
  margin-right: 0;
  min-width: 32px;
  min-height: 32px;
  padding: 0;
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
}

.creator-feed-post-card .content-locked {
  /*margin: 0 0.95rem 0.95rem;*/
  min-height: 0;
}

.creator-feed-post-card .content-locked.creator-feed-content-locked-preview {
  position: relative;
  overflow: hidden;
  background: #444444;
}

.creator-feed-post-card .content-locked.creator-feed-content-locked-preview::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--locked-preview-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: blur(16px);
  transform: scale(1.08);
}

.creator-feed-post-card .content-locked.creator-feed-content-locked-preview::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.42);
}

.creator-feed-post-card .content-locked.creator-feed-content-locked-preview > * {
  position: relative;
  z-index: 1;
}

.creator-feed-post-card .creator-feed-locked-media {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  min-height: 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  padding: 0;
  background: #596575;
  text-align: left;
}

.creator-feed-post-card .creator-feed-locked-media::before {
  display: none;
}

.creator-feed-post-card .creator-feed-locked-media::after {
  z-index: 1;
  background: rgba(15, 23, 42, 0.24);
}

.creator-feed-post-card .creator-feed-locked-media__preview {
  position: absolute;
  inset: -10px;
  z-index: 0;
  display: block;
  width: calc(100% + 20px);
  height: calc(100% + 20px);
  object-fit: cover;
  filter: blur(14px) saturate(0.8);
  transform: scale(1.04);
}

/* Override the legacy preview-child stacking rule for the floating locked layout. */
.creator-feed-post-card .content-locked.creator-feed-content-locked-preview .creator-feed-locked-media__preview {
  position: absolute;
  z-index: 0;
}

.creator-feed-post-card .creator-feed-locked-media__lock {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: block;
  color: rgba(255, 255, 255, 0.96);
  font-size: 34px;
  line-height: 1;
  pointer-events: none;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.28);
  transform: translate(-50%, -50%);
}

.creator-feed-post-card .content-locked.creator-feed-content-locked-preview .creator-feed-locked-media__lock {
  position: absolute;
  z-index: 3;
}

.creator-feed-post-card .creator-feed-locked-media__cta {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: auto;
  min-height: 68px;
  padding: 13px 15px;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 11px;
  /*background: rgba(22, 31, 46, 0.58);*/
  color: #fff;
  backdrop-filter: blur(7px);
}

.creator-feed-post-card .content-locked.creator-feed-content-locked-preview .creator-feed-locked-media__cta {
  position: absolute;
  z-index: 4;
  flex-direction: row;
}

.creator-feed-post-card .creator-feed-locked-media__copy {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  flex-direction: column;
  gap: 3px;
}

.creator-feed-post-card .creator-feed-locked-media__copy small {
  color: rgba(255, 255, 255, 0.76);
  font-size: 12px;
  line-height: 1.2;
}

.creator-feed-post-card .creator-feed-locked-media__copy strong {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  word-break: normal;
  overflow-wrap: normal;
}

.creator-feed-post-card .creator-feed-locked-media__subscribe {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 9px;
  background: var(--auth-surface-2);
  color: #17233d;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}

.creator-feed-post-card .creator-feed-locked-media__subscribe:hover {
  background: #eef2f7;
  color: #17233d;
}

.creator-feed-post-card .creator-feed-locked-media__subscribe--paid {
  min-width: 116px;
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  .creator-feed-post-card .creator-feed-locked-media__cta {
    right: 10px;
    bottom: 10px;
    left: 10px;
    gap: 10px;
    padding: 10px;
  }

  .creator-feed-post-card .content-locked.creator-feed-content-locked-preview .creator-feed-locked-media__lock {
    top: 50%;
    font-size: 30px;
  }

  .creator-feed-post-card .content-locked.creator-feed-content-locked-preview .creator-feed-locked-media__cta {
    flex-direction: column;
    align-items: stretch;
  }

  .creator-feed-post-card .creator-feed-locked-media__copy strong {
    font-size: 12px;
  }

  .creator-feed-post-card .creator-feed-locked-media__subscribe {
    min-height: 32px;
    padding: 0 11px;
    font-size: 12px;
  }
}

.creator-feed-post-card .container-comments {
  margin-top: 0.25rem;
}

.creator-feed-post-card .dropdown-menu {
  border-radius: 10px !important;
  border: 1px solid var(--border-color) !important;
  
  padding: 0.35rem !important;
  width: 180px;
}

.creator-feed-post-card .dropdown-item {
  border-radius: var(--radius-sm);
  padding: 0.5rem 0.65rem;
  font-size: var(--text-body-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-regular);
}

html[data-theme="dark"] .creator-feed-post-card .media-body h5 a,
html[data-theme="dark"] .creator-feed-post-card .media-body .h5 a {
  color: var(--text-primary);
}

html[data-theme="dark"] .creator-feed-feed-wrap .card-updates.creator-feed-post-card,
html[data-theme="dark"] .creator-feed-page .card-updates.creator-feed-post-card {
  
}

html[data-theme="dark"] .creator-feed-post-image,
html[data-theme="dark"] .creator-feed-post-video,
html[data-theme="dark"] .creator-feed-post-gallery .media-wrapper {
  background: #1e293b;
}

html[data-theme="dark"] .creator-feed-action-btn.active,
html[data-theme="dark"] .creator-feed-action-btn.active i {
  color: #fb7185;
}

.creator-feed-page .dropdown-item:hover,
.creator-feed-page .dropdown-item:focus {
  background: var(--bg-muted) !important;
  color: var(--text-primary) !important;
}

.creator-feed-page .btn-post,
.creator-feed-page .btn-outline-primary {
  border-color: var(--border-color);
}

.creator-feed-page .btn-post:hover,
.creator-feed-page .btn-outline-primary:hover {
  background: var(--bg-muted);
}

.creator-feed-page .form-control::placeholder {
  color: var(--text-secondary);
}

.creator-feed-search input::placeholder {
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-right-rail .creator-feed-card {
  margin-bottom: 1rem;
  border: 1px #f1f1f1 solid;
}

.creator-feed-right-section-card {
  padding: 16px;
  border-radius: 18px;
  /*box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);*/
}

.creator-feed-section-heading--right-rail {
  margin-bottom: 0.8rem;
}

.creator-feed-section-heading--right-rail h3 {
  margin: 0;
  font-size: var(--text-control-size);
  line-height: 1.35;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-stack {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.creator-feed-explore-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}

.creator-feed-explore-stack {
  gap: 0.9rem;
}

.creator-vault-workspace {
  min-height: calc(100vh - 180px);
  display: flex;
  flex-direction: column;
}

.creator-vault-empty-state {
  flex: 1;
  display: grid;
  place-items: center;
  padding: 2rem;
  color: var(--auth-text-secondary);
  font-size: var(--text-subtitle-size);
  text-align: center;
}

.creator-vault-empty-state p {
  margin: 0;
}

.creator-vault-mobile-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-height: 42px;
  color: var(--auth-text-primary);
}

.creator-vault-mobile-title a {
  color: inherit;
  text-decoration: none;
}

.creator-vault-mobile-title h1 {
  margin: 0;
  font-size: var(--text-card-title-size);
}

@media (max-width: 991.98px) {
  .creator-vault-workspace {
    min-height: calc(100vh - 190px);
  }

  .creator-vault-empty-state {
    place-items: start center;
    padding-top: 4.5rem;
    font-size: var(--text-lead-size);
  }
}

.creator-feed-explore-search-state {
  padding: 1.1rem 1.15rem;
}

.creator-feed-section-heading-search {
  margin-bottom: 0.5rem;
}

.creator-feed-search-clear {
  white-space: nowrap;
}

.creator-feed-explore-search-copy {
  margin: 0;
  font-size: var(--text-body-size);
  color: var(--text-secondary);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-carousel {
  display: flex;
  gap: 0.85rem;
  overflow-x: auto;
  padding-bottom: 0.35rem;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.creator-feed-carousel::-webkit-scrollbar {
  display: none;
}

.creator-feed-carousel-card {
  flex: 0 0 300px;
  min-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  padding: 1rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-xl);
  background: var(--bg-muted);
  scroll-snap-align: start;
}

.creator-feed-explore-card {
  background: var(--bg-card);
}

.creator-feed-carousel-profile {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-carousel-profile:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-carousel-profile img {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-feed-carousel-profile strong {
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1.35;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-carousel-profile small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-carousel-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.creator-feed-subscribe-btn i {
  font-size: var(--text-control-size);
}

.creator-feed-product-card {
  gap: 0.75rem;
}

.creator-feed-explore-creator-card {
  flex: 0 0 248px;
  min-width: 248px;
  padding: 0.75rem;
  overflow: hidden;
}

.creator-feed-explore-creator-cover {
  display: block;
  min-height: 118px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(15, 23, 42, 0.42)), var(--bg-muted);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow: hidden;
}

.creator-feed-explore-creator-badge {
  position: absolute;
  left: 0.8rem;
  bottom: 0.8rem;
  display: inline-flex;
  align-items: center;
  padding: 0.35rem 0.6rem;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.9);
  color: #0f172a;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
}

html[data-theme="dark"] .creator-feed-explore-creator-badge {
  background: rgba(15, 23, 42, 0.82);
  color: #f8fafc;
}

.creator-feed-explore-creator-body {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}

.creator-feed-explore-creator-profile {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-explore-creator-profile:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-explore-creator-profile img {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-feed-explore-creator-profile span {
  min-width: 0;
}

.creator-feed-explore-creator-profile strong {
  display: block;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-explore-creator-profile small {
  display: block;
  font-size: var(--text-micro-size);
  color: var(--text-secondary);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-explore-product-stats span {
  color: var(--text-secondary);
}

.creator-feed-empty-state p {
  margin-bottom: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.5;
}

.creator-feed-explore-card-actions {
  margin-top: auto;
}

.creator-feed-campaigns-card {
  padding-bottom: 0.9rem;
}

.creator-feed-campaigns-carousel {
  gap: 0.75rem;
}

.creator-feed-campaign-card {
  flex: 0 0 320px;
  min-width: 268px;
  gap: 0.75rem;
  padding: 0.85rem;
}

.creator-feed-campaign-media {
  display: block;
  border-radius: var(--radius-lg);
  overflow: hidden;
  /*aspect-ratio: 1.55 / 1;*/
  background: var(--bg-card);
}

.creator-feed-campaign-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.creator-feed-campaign-copy {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.creator-feed-campaign-meta,
.creator-feed-campaign-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.65rem;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-campaign-title {
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.35;
  text-align: left;
}

.creator-feed-campaign-title:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-campaign-copy p {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-product-media {
  display: block;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: var(--bg-card);
}

.creator-feed-product-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-feed-product-title {
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.35;
  text-align: left;
}

.creator-feed-product-title:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-product-copy p {
  margin: 0.35rem 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-product-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
}

.creator-feed-product-seller {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-product-seller:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-product-seller img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-feed-product-seller span {
  font-size: var(--text-micro-size);
  color: var(--text-secondary);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-product-meta strong {
  font-size: var(--text-meta-size);
  color: var(--text-primary);
  white-space: nowrap;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-explore-product-stats {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-person-link {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  color: var(--text-primary);
}

.creator-feed-person-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  color: var(--text-primary);
  justify-content: space-between;
}

.creator-feed-person-card em {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-style: normal;
  white-space: nowrap;
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-person-card .creator-feed-secondary-btn {
  flex-shrink: 0;
}

.creator-feed-right-list {
  display: flex;
  flex-direction: column;
}

.creator-feed-right-user-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-width: 0;
  padding: 0.78rem 0;
}

.creator-feed-right-user-row + .creator-feed-right-user-row {
  border-top: 1px solid color-mix(in srgb, var(--border-color) 72%, transparent);
}

.creator-feed-right-user-main {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-right-user-main:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-right-user-avatar {
  width: 46px;
  height: 46px;
  min-width: 46px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-feed-right-user-copy {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
  gap: 0.26rem;
}

.creator-feed-right-user-title {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

.creator-feed-right-user-title strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--text-body-size);
  line-height: 1.3;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-right-user-title i {
  flex-shrink: 0;
  font-size: var(--text-meta-size);
  color: #D308EE;
}

.creator-feed-right-user-bio {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.45;
  font-weight: var(--creator-font-weight-regular);
  word-break: break-word;
}

.creator-feed-right-user-row--recommended-normal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.creator-feed-right-user-main--recommended-normal {
  overflow: hidden;
}

.creator-feed-right-user-row--recommended-normal .creator-feed-right-user-copy {
  width: 100%;
}

.creator-feed-right-user-row--recommended-normal .creator-feed-right-user-title {
  width: 100%;
  display: flex;
}

.creator-feed-right-user-name--recommended-normal {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
}

.creator-feed-right-user-bio--recommended-normal {
  display: block;
  -webkit-line-clamp: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: normal;
}

.creator-feed-secondary-btn--subscribe {
  min-width: 82px;
  min-height: 31px;
  padding: 0.55rem 0.85rem;
  border-radius: var(--radius-md);
  border-color: var(--brand-primary);
  background: var(--bg-card);
  color: var(--brand-primary);
  font-size: var(--text-meta-size);
  line-height: 1;
  white-space: nowrap;
}

.creator-feed-secondary-btn--subscribe:hover {
  background: rgba(37, 99, 235, 0.08);
  color: var(--brand-primary);
}

.creator-feed-right-user-action {
  flex-shrink: 0;
}

.creator-feed-right-user-action--recommended-normal {
  align-self: center;
}

.creator-feed-right-rail--creator .creator-feed-right-section-card--creator {
  padding: 14px 14px 12px;
}

.creator-feed-right-rail--creator .creator-feed-right-section-card--creator + .creator-feed-right-section-card--creator,
.creator-feed-right-rail--creator .creator-feed-right-section-card--creator + .creator-feed-right-section-card {
  margin-top: 2px;
}

.creator-feed-section-heading--creator-right-rail {
  margin-bottom: 0.55rem;
}

.creator-feed-section-heading--creator-right-rail h3 {
  font-size: var(--text-card-title-size);
  line-height: 1.3;
  font-weight: var(--creator-font-weight-semibold);
  letter-spacing: -0.01em;
}

.creator-feed-right-rail-link--creator {
  display: none;
}

.creator-feed-right-list--creator {
  gap: 0;
}

.creator-feed-right-user-row--creator-subscription {
  padding: 0.72rem 0;
  gap: 0.7rem;
}

.creator-feed-right-user-row--creator-subscription + .creator-feed-right-user-row--creator-subscription,
.creator-feed-right-user-row--creator-recommended + .creator-feed-right-user-row--creator-recommended {
  border-top: 1px solid color-mix(in srgb, var(--border-color) 56%, transparent);
}

.creator-feed-right-user-main--creator {
  align-items: flex-start;
  gap: 12px;
}

.creator-feed-right-user-avatar--creator {
  width: 48px;
  height: 48px;
  min-width: 48px;
}

.creator-feed-right-user-copy--creator {
  gap: 0.18rem;
  padding-top: 1px;
}

.creator-feed-right-user-title--creator {
  gap: 0.28rem;
}

.creator-feed-right-user-row--creator-subscription .creator-feed-right-user-title strong {
  font-size: var(--text-body-size);
  line-height: 1.28;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-feed-right-user-title--creator i {
  font-size: var(--text-meta-size);
}

.creator-feed-right-user-bio--creator {
  font-size: var(--text-table-size);
  line-height: 1.38;
  color: var(--text-secondary);
  -webkit-line-clamp: 2;
}

.creator-feed-right-user-bio--creator-recommended {
  display: block;
  -webkit-line-clamp: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: normal;
}

.creator-feed-right-user-row--creator-recommended {
  padding: 0.72rem 0;
  gap: 0.7rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.creator-feed-right-user-row--creator-recommended .creator-feed-right-user-main--creator {
  overflow: hidden;
}

.creator-feed-right-user-row--creator-recommended .creator-feed-right-user-copy--creator {
  width: 100%;
}

.creator-feed-right-user-row--creator-recommended .creator-feed-right-user-title--creator {
  width: 100%;
  display: flex;
}

.creator-feed-right-user-name--creator {
  font-size: var(--text-body-size);
  line-height: 1.28;
  font-weight: var(--creator-font-weight-semibold);
  display: block;
  flex: 1 1 auto;
  min-width: 0;
}

.creator-feed-right-user-action--creator {
  align-self: center;
}

.creator-feed-right-rail--creator .creator-feed-secondary-btn--subscribe {
  width: 88px;
  min-width: 88px;
  height: 34px;
  min-height: 34px;
  padding: 0.5rem 0.8rem;
  border-radius: var(--radius-md);
  font-size: var(--text-meta-size);
  font-weight: 500;
}

@supports not (-webkit-line-clamp: 2) {
  .creator-feed-right-user-bio {
    max-height: calc(1.45em * 2);
  }
}

.creator-feed-empty-state {
  padding: 0.25rem 0 0;
}

.creator-feed-footer {
  display: none;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-regular);
}

.creator-feed-empty-card {
  margin-bottom: 0.75rem;
  padding: 2rem 1.5rem;
}

.creator-feed-empty-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1.25rem;
}

.creator-feed-mobile-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1080;
  display: none;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.35rem;
  padding: 0.7rem 0.75rem calc(0.7rem + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, 0.92);
  border-top: 1px solid var(--border-color);
  backdrop-filter: blur(16px);
  
}

.creator-currency-nav-trigger {
  cursor: pointer;
}

.creator-currency-nav-code {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1;
}

.creator-currency-nav-trigger:hover .creator-currency-nav-code,
.creator-currency-nav-trigger:focus-visible .creator-currency-nav-code {
  color: currentColor;
}

.creator-currency-chooser__panel {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1091;
  transform: translate(-50%, -50%);
  width: min(310px, calc(100vw - 32px));
  padding: 0.85rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  color: var(--text-primary);
  box-shadow: var(--shadow-card);
}

.creator-currency-chooser__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 0.5rem; }
.creator-currency-chooser__header h2 { margin: 0; font-size: var(--text-section-title-size); }
.creator-currency-chooser__close { border: 0; background: transparent; color: inherit; padding: 0.3rem; cursor: pointer; }
.creator-currency-chooser__option { display: flex; justify-content: space-between; align-items: center; width: 100%; gap: 1rem; padding: 0.65rem 0.55rem; border: 0; border-radius: var(--radius-sm); background: transparent; color: inherit; text-align: left; cursor: pointer; }
.creator-currency-chooser__option:hover,
.creator-currency-chooser__option:focus-visible { background: var(--bg-muted); outline: none; }
.creator-currency-chooser__option[aria-selected="true"] { color: var(--brand-primary); }
.creator-currency-chooser__option [data-currency-check] { opacity: 0; }
.creator-currency-chooser__option[aria-selected="true"] [data-currency-check] { opacity: 1; }
.creator-currency-chooser__backdrop { position: fixed; inset: 0; z-index: 1090; background: var(--auth-overlay); }
.currency-display__base-reference { display: block; max-width: 100%; color: currentColor; font-size: 0.72em; font-weight: 500; opacity: 0.68; overflow-wrap: anywhere; }

@media (max-width: 991.98px) {
  .creator-currency-chooser__panel { top: auto; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); left: 12px; width: auto; max-height: min(70dvh, 480px); overflow-y: auto; transform: none; }
}

body.currency-chooser-open { overflow: hidden; }

html[data-theme="dark"] .creator-sidebar-create-menu {
  
}

.creator-feed-mobile-nav a,
.creator-feed-mobile-nav button {
  min-width: 0;
  border: 0;
  background: transparent;
  color: var(--text-primary);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  min-height: 54px;
  padding: 0.4rem 0.2rem;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-medium);
  text-decoration: none;
  border-radius: 14px;
}

.creator-feed-mobile-nav > .creator-sidebar-create-wrap {
  min-width: 0;
  display: flex;
  justify-content: center;
}

.creator-feed-mobile-nav-chat {
  position: relative;
}

.creator-feed-mobile-nav-chat-badge {
  position: absolute;
  top: 2px;
  left: calc(50% + 8px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: var(--radius-pill);
  background: var(--brand-primary);
  color: #fff;
  font-size: var(--text-caption-size);
  font-style: normal;
  line-height: 1;
}

.creator-feed-page .stories.carousel {
  background: transparent;
}

.creator-feed-page .item-add-story,
.creator-feed-page .stories.carousel .story {
  border-radius: 14px;
}

.creator-feed-page .creator-feed-stories-wrapper.stories.carousel {
  display: flex;
  white-space: normal;
}

.creator-feed-page .creator-feed-stories-wrapper .add-story,
.creator-feed-page .creator-feed-stories-wrapper.stories.carousel .story {
  flex: 0 0 110px;
  width: 110px;
  max-width: 110px;
  margin: 0;
  scroll-snap-align: start;
}

.creator-feed-page .creator-feed-stories-wrapper .item-add-story,
.creator-feed-page .creator-feed-stories-wrapper.stories.carousel .story > .item-link {
  position: relative;
  display: block;
  width: 100%;
  height: 160px;
  min-height: 160px;
  max-height: none;
  overflow: hidden;
  border-radius: 18px;
  text-decoration: none;
  border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
  
  background: var(--bg-muted);
}

.creator-feed-page .creator-feed-stories-wrapper .add-story-preview,
.creator-feed-page .creator-feed-stories-wrapper.stories.carousel .story > .item-link > .item-preview {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.08), rgba(15, 23, 42, 0.35));
}

.creator-feed-page .creator-feed-stories-wrapper .add-story-preview img,
.creator-feed-page .creator-feed-stories-wrapper.stories.carousel .story > .item-link > .item-preview img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 18px;
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-feed-page .creator-feed-stories-wrapper .item-add-story::after,
.creator-feed-page .creator-feed-stories-wrapper.stories.carousel .story > .item-link::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 52%;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0), rgba(15, 23, 42, 0.78));
  pointer-events: none;
}

.creator-feed-story-create-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.02), rgba(15, 23, 42, 0.62));
}

.creator-feed-story-create-icon {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 32px;
  height: 32px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.94);
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  
  z-index: 2;
  border: 1px solid rgba(255, 255, 255, 0.72);
}

.creator-feed-story-create-icon i {
  font-size: var(--text-lead-size);
  line-height: 1;
  font-weight: 700;
}

.creator-feed-page .creator-feed-stories-wrapper .item-add-story > .info,
.creator-feed-page .stories.snapssenger.carousel .story > .item-link > .info {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 1;
  overflow: visible;
  text-overflow: clip;
  z-index: 2;
}

.creator-feed-page .creator-feed-stories-wrapper .item-add-story > .info .name,
.creator-feed-page .stories.snapssenger.carousel .story > .item-link > .info .name {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display: block;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.25;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-feed-page .stories.snapssenger.carousel .story > .item-link > .info img {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 30px;
  height: 30px;
  border-radius: var(--radius-pill);
  object-fit: cover;
  border: 2px solid rgba(255, 255, 255, 0.95);
  
  background: var(--bg-muted);
}

.creator-feed-page .stories.snapssenger.carousel .story > .item-link > .info .time {
  display: none;
}

html[data-theme="dark"] .creator-feed-page .creator-feed-stories-wrapper .item-add-story,
html[data-theme="dark"] .creator-feed-page .creator-feed-stories-wrapper.stories.carousel .story > .item-link {
  border-color: rgba(148, 163, 184, 0.16);
  
}

html[data-theme="dark"] .creator-feed-story-create-icon {
  background: rgba(255, 255, 255, 0.96);
  color: var(--brand-primary);
}

html[data-theme="dark"] .creator-feed-page .card-updates a,
html[data-theme="dark"] .creator-feed-page .creator-feed-section-heading a {
  color: #f8fafc;
}

html[data-theme="dark"] .creator-feed-campaign-media {
  background: var(--bg-muted);
}

/* !important allowed: dark-mode override for Bootstrap text utilities. */
html[data-theme="dark"] .creator-feed-page .btn-post.text-primary,
html[data-theme="dark"] .creator-feed-page .text-primary,
html[data-theme="dark"] .creator-feed-page .creator-feed-icon-btn,
html[data-theme="dark"] .creator-feed-page .creator-feed-theme-toggle {
  color: #f8fafc !important;
}

@keyframes creator-feed-shimmer {
  100% {
    transform: translateX(100%);
  }
}

@keyframes creator-feed-spin {
  100% {
    transform: rotate(360deg);
  }
}

@media (max-width: 1199.98px) {
  :root {
    --auth-sidebar-width: var(--auth-sidebar-width-compact);
  }

  .creator-feed-shell {
    grid-template-columns: var(--auth-sidebar-width) minmax(0, 1fr);
  }

  .creator-feed-shell-right {
    display: none;
  }

  .creator-profile-right {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1023.98px) {
  .creator-feed-page {
    padding: 1rem 1rem 2rem;
  }

  .creator-feed-shell,
  .creator-feed-shell-main {
    width: 100%;
    max-width: none;
  }

  .creator-feed-feed-wrap .card-updates,
  .creator-feed-card,
  .creator-feed-notice-card {
    border-radius: var(--radius-lg);
  }

 
}

@media (max-width: 991.98px) {
  .creator-feed-page {
    max-width: none;
    padding-top: 0!important;
  }
   .creator-for-you-page .creator-feed-composer-trigger{
      padding: 8px 15px;
  }
  .creator-feed-topbar{
      border: none;
      margin-bottom: 0!important;
      border-radius: 0!important;
  }

  .creator-feed-shell {
    grid-template-columns: 1fr;
    max-width: none;
  }

  .creator-feed-shell-main,
  .creator-feed-feed-wrap,
  #creatorFeedContent,
  #updatesPaginator {
    width: 100%;
    max-width: none;
  }

  .creator-feed-mobile-nav {
    display: grid;
  }

  .creator-sidebar-create-wrap--mobile-fab {
    position: fixed;
    right: clamp(16px, 5vw, 28px);
    bottom: calc(72px + env(safe-area-inset-bottom));
    z-index: 1085;
    display: block;
    margin: 0;
  }

  .creator-sidebar-create-wrap--mobile-fab .creator-feed-create-btn {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    min-height: 56px;
    padding: 0;
    border-radius: var(--radius-pill);
    /*box-shadow: var(--shadow-card);*/
    margin-bottom: 10px;
  }

  .creator-sidebar-create-wrap--mobile-fab .creator-feed-create-btn span {
    display: none;
  }

  .creator-sidebar-create-wrap--mobile-fab .creator-feed-create-btn i {
    margin: 0;
    font-size: var(--text-section-title-size);
    line-height: 1;
  }

  .creator-sidebar-create-wrap--mobile-fab .creator-sidebar-create-menu {
    right: 0;
    left: auto;
    width: min(220px, calc(100vw - 24px));
    transform: none;
  }

  body:has(.creator-post-composer-modal:not([hidden])) .creator-sidebar-create-wrap--mobile-fab {
    visibility: hidden;
    pointer-events: none;
  }

  .creator-feed-notifications-header {
    align-items: flex-start;
  }

  .creator-feed-notifications-header h1 {
    font-size: var(--text-display-title-size);
  }

  .creator-feed-notification-row {
    padding: 0.9rem 0.95rem;
  }

  .creator-profile-cover {
    min-height: 188px;
  }

  .creator-profile-cover-top {
    flex-direction: column;
    align-items: stretch;
  }

  .creator-profile-cover-actions {
    justify-content: flex-start;
  }

  .creator-profile-cover-copy {
    left: 18px;
    right: 18px;
    max-width: none;
    top: 10px;
  }

  .creator-profile-cover-stats {
    gap: var(--space-4);
    flex-wrap: wrap;
  }

  .creator-profile-identity-card {
    /*padding: 0 0.85rem 0.85rem;*/
  }

  .creator-profile-identity-grid {
    flex-direction: column;
    gap: 14px;
    padding: 0 20px;
  }

.creator-profile-page .creator-profile-composer-card{
  display: none;
}
  .creator-profile-avatar {
    width: 84px;
    height: 84px;
  }

  .creator-profile-identity-copy {
    margin-top: -35px;

  }

  .creator-profile-identity-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .creator-profile-identity-row {
    flex-direction: column;
    gap: 14px;
  }

  .creator-profile-identity-head h1 {
    font-size: var(--text-modal-title-size);
  }

  .creator-profile-actions {
    justify-content: flex-start;
  }

  .creator-profile-tabs {
    grid-auto-flow: column;
    grid-auto-columns: 1fr;
    margin: 0;
  }

  .creator-profile-shop-grid {
    grid-template-columns: 1fr;
  }

  .creator-profile-identity-grid--visitor {
    flex-direction: column;
    padding: 0 18px 12px;
  }

  .creator-profile-identity-copy--visitor {
    padding-top: 0;
  }

  .creator-profile-identity-row--visitor {
    flex-direction: column;
    gap: 12px;
  }

  .creator-profile-actions--visitor {
    width: 100%;
    max-width: none;
    align-items: stretch;
    flex: 1 1 auto;
    margin-left: 0;
  }

  .creator-profile-actions-primary,
  .creator-profile-actions-danger {
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .creator-profile-mobile-right-rail {
    display: block;
    margin-top: 16px;
  }

  .creator-profile-mobile-right-rail .creator-profile-right-panel {
    width: 100%;
  }

  .creator-profile-shop-grid--visitor,
  .creator-subscription-modal__plans {
    grid-template-columns: 1fr;
  }

  .creator-subscription-modal__body,
  .creator-subscription-modal__hero {
    padding-left: 20px;
    padding-right: 20px;
  }

  .creator-subscription-modal__footer {
    flex-direction: column-reverse;
  }

  .creator-wallet-content {
    max-width: none;
    padding: 15px;
  }

  .creator-shop-page {
    gap: 18px;
  }

  .creator-shop-hero {
    min-height: 188px;
  }

  .creator-shop-hero__copy h1 {
    font-size: var(--text-subtitle-size);
  }

  .creator-shop-toolbar {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .creator-shop-toolbar__filters {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-shop-toolbar__actions {
    width: 100%;
    justify-content: flex-start;
  }

  .creator-shop-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-wallet-overview-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .creator-wallet-allocation-row {
    grid-template-columns: 1fr 1fr;
  }

  .creator-wallet-section {
    gap: 12px;
  }

  .creator-wallet-panel {
    padding: 14px;
  }

  .creator-wallet-form-grid {
    grid-template-columns: 1fr;
  }

  .creator-wallet-funding-modal,
  .creator-wallet-success-modal {
    padding: 12px;
  }

  .creator-wallet-funding-panel {
    width: 100%;
    max-height: calc(100dvh - 24px);
    padding: 16px;
  }

  .creator-wallet-destination-options {
    grid-template-columns: 1fr;
  }

  .creator-wallet-submit-row {
    flex-direction: column;
    align-items: stretch;
  }

  .creator-wallet-submit-btn,
  .creator-wallet-fund-trigger,
  .creator-wallet-withdraw-trigger {
    width: 100%;
  }

  .creator-wallet-transaction-item {
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: flex-start;
  }

  .creator-wallet-transaction-amount {
    grid-column: 2;
    align-items: flex-start;
    text-align: left;
  }

  .creator-wallet-transactions-header {
    align-items: flex-start;
  }

  .creator-feed-page .container,
  .creator-feed-page .container-fluid,
  .creator-feed-page .col {
    max-width: 100%;
  }

  .creator-feed-page .row {
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .creator-feed-page [class*="col-"] {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}

@media (max-width: 575.98px) {
  .creator-feed-page {
    max-width: none;
  }

  .creator-feed-notifications-header {
    margin-bottom: 0.85rem;
  }

  .creator-feed-notifications-header h1 {
    font-size: var(--text-page-title-size);
  }

  .creator-feed-notification-announcement,
  .creator-feed-notification-list {
    border-radius: 18px;
  }

  .creator-feed-notifications-settings-btn span {
    display: none;
  }

  .creator-feed-notifications-settings-btn {
    min-width: 42px;
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .creator-bookmarks-mobile-header {
    display: flex;
    align-items: center;
    min-height: 48px;
    margin-bottom: 14px;
    padding: 15px;
  }

  .creator-bookmarks-mobile-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--text-primary);
    text-decoration: none;
    font-size: var(--text-card-title-size);
    font-weight: var(--creator-font-weight-semibold);
  }

  .creator-bookmarks-empty-state {
    min-height: calc(100vh - 220px);
  }

  .creator-wallet-header h1 {
    font-size: var(--text-modal-title-size);
  }

  .creator-shop-page {
    gap: 16px;
  }

  .creator-shop-hero {
    min-height: 160px;
    border-radius: 18px;
  }

  .creator-shop-hero__copy {
    max-width: 196px;
    padding: 20px 0 0 18px;
  }

  .creator-shop-hero__copy h1 {
    margin: 0 0 8px;
    font-size: var(--text-section-title-size);
  }

  .creator-shop-hero__copy p {
    font-size: var(--text-badge-size);
    max-width: 154px;
  }

  .creator-profile-actions--creator .creator-feed-secondary-btn {
    width: 100%;
    justify-content: center;
  }

  .creator-profile-safety-actions {
    width: 100%;
    align-items: stretch;
  }

  .creator-profile-action-pill,
  .creator-profile-subscribe-btn,
  .creator-profile-safety-link {
    width: 100%;
    justify-content: center;
  }

  .creator-profile-shop-grid--visitor {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .creator-subscription-modal__hero {
    padding: 22px 18px 82px;
  }

  .creator-subscription-modal__hero h4 {
    font-size: var(--text-page-title-size);
  }

  .creator-subscription-modal__body {
    padding: 0 18px 20px;
  }

  .creator-subscription-modal__identity {
    margin-top: -46px;
  }

  .creator-subscription-modal__avatar {
    width: 74px;
    height: 74px;
  }

  .creator-shop-toolbar {
    padding: 8px;
    border-radius: var(--radius-lg);
  }

  .creator-shop-toolbar__filters {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .creator-shop-toolbar__select {
    min-width: 0;
  }

  .creator-shop-toolbar__select select,
  .creator-shop-toolbar__search input {
    min-height: 40px;
  }

  .creator-shop-toolbar__add-btn {
    min-height: 40px;
    padding: 0 12px;
    border-radius: 14px;
  }

  .creator-shop-grid {
    gap: 12px;
  }

  .creator-shop-card {
    min-height: 274px;
    border-radius: 14px;
  }

  .creator-shop-card__title {
    font-size: var(--text-micro-size);
    min-height: 30px;
  }

  .creator-shop-card__body p {
    font-size: var(--text-badge-size);
    min-height: 22px;
  }

  .creator-shop-card__price,
  .creator-shop-card__metric {
    font-size: var(--text-meta-size);
  }

  .creator-shop-card__action {
    min-height: 22px;
    padding: 0 8px;
    font-size: var(--text-badge-size);
  }

  .creator-wallet-panel,
  .creator-wallet-empty {
    padding: 14px;
    border-radius: var(--radius-lg);
  }

  .creator-wallet-balance-card {
    padding: 14px;
    border-radius: var(--radius-lg);
    min-height: 120px;
  }

  .creator-wallet-balance-amount strong {
    font-size: var(--text-page-title-size);
  }

  .creator-wallet-balance-copy h2 {
    font-size: var(--text-card-title-size);
  }

  .creator-wallet-panel-header,
  .creator-wallet-transactions-header {
    flex-direction: column;
    align-items: stretch;
  }

  .creator-wallet-panel-close {
    align-self: flex-end;
  }

  .creator-wallet-transfer-trigger {
    align-self: stretch;
  }

  .creator-wallet-actions {
    justify-content: center;
  }

  .creator-wallet-amount-field {
    min-height: 46px;
  }

  .creator-profile-cropper-popup .fileuploader-popup-preview {
    padding: 10px;
  }

  .creator-profile-cropper-popup .fileuploader-popup-content {
    border-radius: var(--radius-lg);
  }

  .creator-profile-cropper-popup .fileuploader-cropper {
    min-height: 280px;
  }

  .creator-profile-cropper-popup .fileuploader-popup-footer .fileuploader-popup-tools {
    flex-wrap: wrap;
  }

  .creator-profile-page {
    gap: 16px;
    overflow: clip;
  }

  .creator-profile-hero {
    border-radius: var(--radius-lg);
  }

  .creator-profile-cover {
    min-height: 176px;
  }

  .creator-profile-cover-top {
    padding: 12px;
  }

  .creator-profile-page--visitor .creator-profile-cover-top {
    z-index: 5;
  }

  .creator-profile-cover-menu {
    top: 12px;
    right: 12px;
  }

  .creator-profile-cover-menu-trigger {
    width: 38px;
    height: 38px;
  }

  .creator-profile-back,
  .creator-profile-cover-btn {
    min-height: 30px;
    border-radius: 10px;
    font-size: var(--text-micro-size);
  }

  .creator-profile-cover-title-row.creator-profile-back {
    font-size: var(--text-card-title-size);
  }

  .creator-profile-cover-stat {
    font-size: var(--text-meta-size);
  }

  .creator-profile-cover-stat i {
    font-size: var(--text-card-title-size);
  }

  .creator-profile-identity-grid {
    padding: 0;
    gap: 10px;
  }

  .creator-profile-avatar-wrap {
    width: 84px;
    margin-top: -32px;
    padding-left: 12px;
  }

  .creator-profile-avatar {
    width: 80px;
    height: 80px;
  }

/* !important allowed: legacy avatar utility dimensions override profile geometry. */
.creator-profile-page .creator-profile-avatar.avatarUser {
    width: 80px !important;
    height: 80px !important;
    max-width: none;
  }

  .creator-profile-avatar-edit,
  .creator-profile-avatar-recrop {
    width: 28px;
    height: 28px;
  }

  .creator-profile-meta {
    font-size: var(--text-micro-size);
    gap: 0.35rem 0.45rem;
  }

  .creator-profile-identity-main h1,
  .creator-profile-identity-head h1,
  .creator-profile-page--visitor .creator-profile-identity-main h1 {
    display: flex;
    align-items: flex-start;
    font-size: var(--text-modal-title-size);
    line-height: 1.2;
    overflow-wrap: anywhere;
  }

  .creator-profile-page--visitor .creator-profile-identity-head h1 {
    font-size: var(--text-modal-title-size);
    display: flex;
    align-items: flex-start;
    line-height: 1.2;
    overflow-wrap: anywhere;
  }

  .creator-profile-verified {
    flex: 0 0 auto;
    line-height: 1.2;
  }

  .creator-profile-bio,
  .creator-profile-about-value,
  .creator-profile-popular-copy,
  .creator-profile-locked-post__cta-copy {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  .creator-profile-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .creator-profile-actions--visitor {
    width: 100%;
    max-width: 100%;
    align-items: stretch;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 8px;
    margin-left: 0;
    min-width: 0;
  }

  .creator-profile-identity-row--visitor,
  .creator-profile-identity-copy--visitor,
  .creator-profile-identity-row--visitor .creator-profile-identity-main {
    max-width: 100%;
    min-width: 0;
    width: 100%;
  }

.creator-profile-actions-primary {
        display: grid;
        grid-template-columns: 0.7fr 0.7fr 1.6fr;
        grid-template-areas:
            ". . share"
            "tips gifts subscription";
        gap: 8px;
        width: 100%;
        align-items: center;
        margin-top: -38px;
    }

    /* Tips */
    .creator-profile-actions-primary > .creator-profile-action-pill:first-child {
        grid-area: tips;
    }

    /* Gifts */
    .creator-profile-actions-primary > .creator-profile-action-pill:nth-of-type(2) {
        grid-area: gifts;
    }

    /* Dynamic state:
       Confirm Payment / Subscribed / Subscribe */
    .creator-profile-actions-primary > .creator-profile-subscribe-btn {
        grid-area: subscription;
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    /* Share goes alone on the top-right */
    .creator-profile-actions-primary > .creator-profile-share-icon-btn {
        grid-area: share!important;
        justify-self: end;
        width: 44px;
        height: 36px;
        width: 60px!important;
        margin: 0;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 72px;
        margin-top: -72px;
    }

    /* Tips + Gifts remain smaller */
    .creator-profile-actions-primary > .creator-profile-action-pill:not(.creator-profile-share-icon-btn) {
        width: 100%;
        min-width: 0;
        padding-inline: 8px;
        justify-content: center;
    }
    
  .creator-profile-actions-danger {
    justify-content: flex-end;
    flex-wrap: wrap;
    max-width: 100%;
    min-width: 0;
    width: 100%;
    margin: 10px 0;
  }

  .creator-profile-actions--creator {
    display: flex;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    gap: 8px;
    flex-direction: column;
    align-items: stretch;
  }

  .creator-profile-stat-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .creator-profile-stat-card {
    padding: 10px 12px;
    gap: 4px;
    min-height: 72px;
  }

  .creator-profile-stat-card span {
    font-size: var(--text-caption-size);
    letter-spacing: 0.04em;
  }

  .creator-profile-stat-card strong {
    font-size: var(--text-section-title-size);
  }

  .creator-profile-actions .creator-feed-secondary-btn {
    min-height: 36px;
    padding: 0 14px;
    width: 100%;
    justify-content: center;
  }

  .creator-profile-tabs {
    margin-top: 16px;
    display: flex;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .creator-profile-tabs::-webkit-scrollbar {
    display: none;
  }

  .creator-profile-tab {
    min-height: 48px;
    min-width: 72px;
    padding: 0 8px;
    font-size: var(--text-meta-size);
    flex: 1 0 max-content;
  }

  .creator-profile-composer-card,
  .creator-profile-panel,
  .creator-profile-right-panel,
  .creator-profile-content-card {
    border-radius: var(--radius-lg);
  }

.creator-profile-empty,
.creator-profile-popular-empty {
  padding: 28px 16px;
}

  .creator-profile-locked-post__header {
    align-items: flex-start;
  }

  .creator-profile-locked-post__cta {
    align-items: flex-start;
    flex-direction: column;
  }

  .creator-profile-locked-post__cta .creator-profile-subscribe-btn {
    width: 100%;
  }

  .creator-profile-locked-preview,
  .creator-profile-locked-preview__surface,
  .creator-profile-locked-post__teaser {
    min-height: 200px;
  }

  .creator-profile-mobile-right-rail {
    margin-top: 0;
  }

  .creator-profile-search {
    margin-bottom: 12px;
  }

  .creator-feed-shell-main,
  .creator-feed-feed-wrap,
  #creatorFeedContent,
  #updatesPaginator,
  .creator-feed-feed-panel,
  .creator-feed-feed-wrap .card-updates,
  .creator-feed-page .card-updates .card-body,
  .creator-feed-page .card-updates .card-footer {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .creator-feed-page .card-updates {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  .creator-feed-page .card-updates .media {
    align-items: flex-start;
  }

  .creator-feed-page .card-updates .media-body h5,
  .creator-feed-page .card-updates .media-body .h5 {
    font-size: var(--text-control-size);
    line-height: 1.35;
    word-break: break-word;
  }

  .creator-feed-page .card-updates .font-14,
  .creator-feed-page .card-updates small,
  .creator-feed-page .card-updates .timeAgo,
  .creator-feed-page .card-updates .text-muted {
    font-size: var(--text-meta-size);
  }

  .creator-feed-page .card-updates p,
  .creator-feed-page .card-updates .update-text,
  .creator-feed-page .comments-form textarea {
    font-size: var(--text-card-title-size);
    line-height: 1.45;
  }

/* !important allowed in this responsive block: legacy feed/comment utilities. */


  .creator-feed-page .storiesWrapper,
  .creator-feed-stories-wrapper {
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 0.1rem;
    margin: 0;
  }

  .creator-feed-stories-wrapper .add-story,
  .creator-feed-stories-wrapper .story {
    flex: 0 0 96px;
    width: 96px;
    scroll-snap-align: start;
  }

  .creator-feed-stories-wrapper .item-add-story {
    display: block;
    width: 100%;
  }

  .creator-feed-stories-wrapper .add-story-preview,
  .creator-feed-stories-wrapper .story > .item-link {
    display: block;
    min-height: 148px;
    border-radius: var(--radius-lg);
    overflow: hidden;
  }

  .creator-feed-notice-card {
    border-radius: 14px;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  .creator-feed-card {
    border-radius: 14px;
    /*padding-left: 0.75rem;
    padding-right: 0.75rem;*/
  }

  .creator-feed-composer-trigger button {
    height: 42px;
    font-size: var(--text-card-title-size);
  }

  .creator-feed-composer-avatar-btn {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
  }

  .creator-feed-page #formUpdateCreate textarea {
    min-height: 96px;
    font-size: var(--text-card-title-size);
  }

  .creator-feed-page #formUpdateCreate .card-footer {
    padding: 0.75rem 0.95rem 0.95rem !important;
  }

  .creator-feed-action-btn {
    min-width: 36px;
    min-height: 36px;
    font-size: var(--text-control-size);
    margin-right: 0.1rem;
  }

  .creator-feed-action-tip {
    padding: 0 0.45rem;
  }

  .creator-feed-action-label {
    font-size: var(--text-meta-size);
  }

  .creator-feed-post-meta .countLikes,
  .creator-feed-post-meta .totalComments,
  .creator-feed-post-meta .dot-item {
    font-size: var(--text-meta-size);
    line-height: 1.35;
  }

  .creator-feed-page .dropdown-menu-right {
    right: 0 !important;
  }

  .creator-feed-page .modal-dialog {
    margin: 0.75rem;
    max-width: calc(100vw - 1.5rem);
  }

  .creator-feed-page .comments-form .position-absolute {
    right: 0.35rem !important;
  }

  .creator-feed-page .comments-form .triggerGif,
  .creator-feed-page .comments-form .triggerSticker,
  .creator-feed-page .comments-form .triggerEmoji {
    font-size: var(--text-lead-size) !important;
  }

  .creator-feed-page .comments-form input {
    font-size: var(--text-card-title-size);
    line-height: 1.45;
    min-height: 44px;
    padding-right: 105px !important;
  }

  .creator-feed-mobile-nav a,
  .creator-feed-mobile-nav button {
    min-height: 58px;
    font-size: var(--text-meta-size);
  }

  .creator-feed-mobile-nav i {
    font-size: var(--text-section-title-size);
  }

  .creator-feed-person-card {
    flex-wrap: wrap;
  }

  .creator-feed-person-card .creator-feed-secondary-btn {
    width: 100%;
  }

  .creator-feed-carousel-card {
    flex-basis: 172px;
    min-width: 172px;
    padding: 0.9rem;
  }

  .creator-feed-product-card {
    flex-basis: 188px;
    min-width: 188px;
  }

  .creator-feed-campaign-card {
    flex-basis: 246px;
    min-width: 246px;
  }

  .creator-feed-section-control {
    width: 30px;
    height: 30px;
  }

  .creator-feed-carousel-profile img {
    width: 52px;
    height: 52px;
  }
}

[data-home-feed-header].home-feed-header {
  display: block;
  width: 100%;
  padding: 8px 12px;
  border-radius: var(--radius-lg);
}

[data-home-feed-header] .home-feed-search-toggle-mobile {
  display: none;
}

.auth-mobile-header,
.creator-mobile-header {
  display: none;
  width: 100%;
  position: sticky;
  top: 0;
  z-index: 44;
}

.auth-mobile-header__inner,
.creator-mobile-header__surface {
  padding: calc(env(safe-area-inset-top) + 10px) 12px 10px;
  border-radius: 0 0 18px 18px;
  margin-bottom: 10px;
  }

.auth-mobile-header__top,
.creator-mobile-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.auth-mobile-header__logo,
.creator-mobile-header__logo {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  text-decoration: none;
}

.auth-mobile-header__logo img,
.creator-mobile-header__logo img {
  display: block;
  width: auto;
  height: 44px;
  max-width: 132px;
}

.auth-mobile-header__actions,
.creator-mobile-header__actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 5px;
  flex: 0 0 auto;
}

.auth-mobile-header__action,
.creator-mobile-header__action {
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: var(--radius-md);
  flex: 0 0 38px;
}

.auth-mobile-header__theme .creator-feed-theme-toggle {
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: var(--radius-md);
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.auth-mobile-header__action i,
.auth-mobile-header__theme .creator-feed-theme-toggle i,
.creator-mobile-header__action i {
  font-size: var(--text-card-title-size);
}

.auth-mobile-header__search,
.creator-mobile-header__search {
  position: relative;
  flex: 0 0 auto;
}

.auth-mobile-header__badge {
  top: 4px;
  right: 4px;
}

.auth-mobile-search-panel {
  display: none;
  margin: 0 0 8px;
  position: relative;
  z-index: 24;
}

.auth-mobile-search-panel.is-open {
  display: block;
}

.auth-mobile-search-panel__form {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--bg-card);
  /*box-shadow: var(--shadow-card);*/
}

.auth-mobile-search-panel__form .creator-live-search-suggestions {
  top: calc(100% + 6px);
  left: 10px;
  right: 10px;
  width: auto;
  max-height: min(390px, 58vh);
}

.auth-mobile-search-panel__close {
  width: 40px;
  height: 40px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  background: var(--bg-muted);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.auth-mobile-search-panel__close i {
  font-size: var(--text-lead-size);
}

.auth-mobile-search-panel__field {
  position: relative;
  min-width: 0;
}

.auth-mobile-search-panel__field .creator-feed-search-control {
  height: 44px;
  padding-right: 14px;
}

.auth-mobile-search-panel__submit {
  min-width: 72px;
  height: 40px;
  border: 0;
  border-radius: 14px;
  background: var(--brand-primary);
  color: #fff;
  padding: 0 14px;
  font-size: var(--text-meta-size);
  font-weight: 600;
}

.auth-mobile-search-panel__results {
  display: none;
}

body.auth-mobile-search-open .creator-feed-mobile-nav {
  transform: translateY(calc(100% + env(safe-area-inset-bottom)));
  opacity: 0;
  pointer-events: none;
}

.home-mobile-feed-tabs {
  display: none;
  width: 100%;
}

.home-mobile-feed-tabs__inner {
  padding: 15px 15px 7px 15px;
  border-radius: 18px;
}

.home-mobile-feed-tabs__grid {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  height: 42px;
  padding: 3px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg-muted) 90%, white 10%);
}

.home-mobile-feed-tabs__item {
  width: 100%;
  min-width: 0;
  height: 36px;
  padding: 0 10px;
  border-radius: 11px;
  font-size: var(--font-size-sm);
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  justify-content: center;
}

.auth-mobile-drawer,
.creator-mobile-drawer {
  position: fixed;
  inset: 0;
  z-index: 1400;
}

.auth-mobile-drawer__backdrop,
.creator-mobile-drawer__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(15, 23, 42, 0.48);
  padding: 0;
}

.auth-mobile-drawer__panel,
.creator-mobile-drawer__panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(340px, calc(100vw - 24px));
  padding: calc(env(safe-area-inset-top) + 14px) 14px calc(env(safe-area-inset-bottom) + 14px);
  background: var(--bg-card);
  border-left: 1px solid var(--border-color);
  /*box-shadow: -18px 0 40px rgba(15, 23, 42, 0.16);*/
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.auth-mobile-drawer__header,
.creator-mobile-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.auth-mobile-drawer__brand,
.creator-mobile-drawer__brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.auth-mobile-drawer__brand img,
.creator-mobile-drawer__brand img {
  height: 24px;
  width: auto;
  max-width: 136px;
  display: block;
}

.auth-mobile-drawer__brand span,
.creator-mobile-drawer__brand span {
  font-size: var(--text-card-title-size);
  font-weight: 700;
  color: var(--text-primary);
  white-space: nowrap;
}

.auth-mobile-drawer__close,
.creator-mobile-drawer__close {
  width: 40px;
  height: 40px;
  min-width: 40px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  background: var(--bg-muted);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.auth-mobile-drawer__close i,
.creator-mobile-drawer__close i {
  font-size: var(--text-section-title-size);
}

.auth-mobile-drawer__content,
.creator-mobile-drawer__content {
  min-height: 100%;
}

.auth-mobile-drawer__content .creator-feed-sidebar-card,
.creator-mobile-drawer__content .creator-feed-sidebar-card {
  min-height: 100%;
  padding: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
}

.auth-mobile-drawer__content .creator-feed-sidebar-logo,
.creator-mobile-drawer__content .creator-feed-sidebar-logo {
  display: none;
}

.auth-mobile-drawer__content .creator-feed-nav,
.creator-mobile-drawer__content .creator-feed-nav {
  gap: 8px;
}

.auth-mobile-drawer__content .creator-feed-nav-link,
.creator-mobile-drawer__content .creator-feed-nav-link {
  min-height: 44px;
}

.auth-mobile-drawer__content .creator-feed-sidebar-promo,
.auth-mobile-drawer__content .creator-verification-sidebar-card,
.auth-mobile-drawer__content .creator-feed-account-summary--sidebar,
.creator-mobile-drawer__content .creator-feed-sidebar-promo,
.creator-mobile-drawer__content .creator-verification-sidebar-card,
.creator-mobile-drawer__content .creator-feed-account-summary--sidebar {
  margin-top: 12px;
}

body.creator-mobile-drawer-open {
  overflow: hidden;
}

html[data-theme="dark"] .creator-mobile-drawer__backdrop {
  background: rgba(2, 6, 23, 0.72);
}

html[data-theme="dark"] .creator-feed-page,
html[data-theme="dark"] .creator-feed-page a:not(.creator-feed-create-btn):not(.creator-wallet-submit-btn):not(.creator-shop-toolbar__add-btn):not(.creator-feed-tab):not(.creator-profile-tab):not(.creator-feed-nav-link) {
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-feed-card,
html[data-theme="dark"] .creator-feed-notice-card,
html[data-theme="dark"] .creator-feed-empty-card,
html[data-theme="dark"] .creator-feed-feed-wrap .card-updates,
html[data-theme="dark"] .creator-feed-dropdown-menu,
html[data-theme="dark"] .auth-mobile-header__inner,
html[data-theme="dark"] .auth-mobile-search-panel__form,
html[data-theme="dark"] .auth-mobile-drawer__panel,
html[data-theme="dark"] .creator-profile-hero,
html[data-theme="dark"] .creator-profile-panel,
html[data-theme="dark"] .creator-profile-right-panel,
html[data-theme="dark"] .creator-wallet-transaction-list,
html[data-theme="dark"] .creator-settings-card,
html[data-theme="dark"] .creator-settings-table-card,
html[data-theme="dark"] .creator-shop-toolbar {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  /*box-shadow: var(--auth-shadow);*/
}

html[data-theme="dark"] .creator-feed-topbar {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  /*box-shadow: var(--auth-shadow);*/
}

html[data-theme="dark"] .creator-live-search-suggestions {
  border-color: var(--auth-border);
  background: var(--auth-surface-elevated);
  box-shadow: 0 18px 38px rgba(2, 6, 23, 0.42);
}

html[data-theme="dark"] .creator-live-search-option:hover,
html[data-theme="dark"] .creator-live-search-option:focus,
html[data-theme="dark"] .creator-live-search-option.is-active {
  background: var(--auth-control-hover);
}

html[data-theme="dark"] .creator-feed-sidebar-card {
  background: var(--auth-bg);
  border-color: var(--auth-border);
  /*box-shadow: var(--auth-shadow);*/
}

html[data-theme="dark"] .creator-feed-nav-link,
html[data-theme="dark"] .creator-feed-nav-button,
html[data-theme="dark"] .creator-feed-account-trigger,
html[data-theme="dark"] .creator-feed-account-summary,
html[data-theme="dark"] .creator-feed-account-trigger strong,
html[data-theme="dark"] .creator-feed-account-summary strong,
html[data-theme="dark"] .creator-feed-person-card strong,
html[data-theme="dark"] .creator-feed-page .card-updates .media-body h5 a,
html[data-theme="dark"] .creator-feed-page .card-updates .media-body .h5 a,
html[data-theme="dark"] .creator-dashboard-mobile-bar h1,
html[data-theme="dark"] .creator-dashboard-header h1,
html[data-theme="dark"] .creator-dashboard-panel-header h2,
html[data-theme="dark"] .creator-profile-panel-heading h2,
html[data-theme="dark"] .creator-profile-right-heading h3,
html[data-theme="dark"] .creator-wallet-section-header h2,
html[data-theme="dark"] .creator-wallet-panel-header h2,
html[data-theme="dark"] .creator-wallet-transactions-header h2,
html[data-theme="dark"] .creator-shop-card__title {
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-shop-card__seller {
  color: var(--auth-text-secondary, var(--text-secondary));
}

html[data-theme="dark"] .creator-feed-page .dropdown-item {
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-feed-page .text-muted,
html[data-theme="dark"] .creator-feed-account-trigger small,
html[data-theme="dark"] .creator-feed-account-summary small,
html[data-theme="dark"] .creator-feed-person-card small,
html[data-theme="dark"] .creator-feed-section-heading a,
html[data-theme="dark"] .creator-feed-footer,
html[data-theme="dark"] .creator-feed-post-username,
html[data-theme="dark"] .creator-feed-post-timestamp,
html[data-theme="dark"] .creator-feed-post-visibility,
html[data-theme="dark"] .creator-dashboard-header p,
html[data-theme="dark"] .creator-dashboard-mobile-bar p,
html[data-theme="dark"] .creator-dashboard-panel-header p,
html[data-theme="dark"] .creator-dashboard-table thead th,
html[data-theme="dark"] .creator-dashboard-user small,
html[data-theme="dark"] .creator-dashboard-table-title small,
html[data-theme="dark"] .creator-dashboard-table-amount small,
html[data-theme="dark"] .creator-dashboard-muted,
html[data-theme="dark"] .creator-profile-meta,
html[data-theme="dark"] .creator-profile-bio,
html[data-theme="dark"] .creator-profile-panel-heading p,
html[data-theme="dark"] .creator-wallet-section-header p,
/* !important allowed: dark-mode text normalization over Bootstrap/legacy utility colors. */
html[data-theme="dark"] .creator-wallet-panel-header p,
html[data-theme="dark"] .creator-wallet-hint,
html[data-theme="dark"] .creator-wallet-submit-row small,
html[data-theme="dark"] .creator-wallet-bank-upload small,
html[data-theme="dark"] .creator-wallet-transaction-copy small,
html[data-theme="dark"] .creator-wallet-success-surface p,
html[data-theme="dark"] .creator-shop-card__body p,
html[data-theme="dark"] .creator-shop-card__metric,
html[data-theme="dark"] .creator-settings-empty-state p,
html[data-theme="dark"] .creator-settings-switch span {
  color: var(--auth-text-secondary) !important;
}

html[data-theme="dark"] .creator-feed-nav-link.is-active,
html[data-theme="dark"] .creator-feed-nav-link:hover,
html[data-theme="dark"] .creator-feed-nav-button:hover,
html[data-theme="dark"] .creator-feed-nav-button.is-active,
html[data-theme="dark"] .creator-sidebar-more.is-open .creator-sidebar-more-toggle,
html[data-theme="dark"] .creator-sidebar-more.is-open .creator-sidebar-more-toggle:hover,
html[data-theme="dark"] .creator-sidebar-more.is-route-active .creator-sidebar-more-toggle,
html[data-theme="dark"] .creator-feed-mobile-nav a.is-active,
html[data-theme="dark"] .creator-feed-mobile-nav a:hover,
html[data-theme="dark"] .creator-feed-mobile-nav button:hover,
html[data-theme="dark"] .creator-profile-tab:hover,
html[data-theme="dark"] .creator-profile-tab.is-active {
  background: var(--auth-accent-soft);
  color: var(--auth-accent);
}

html[data-theme="dark"] .creator-feed-create-btn,
html[data-theme="dark"] .auth-mobile-search-panel__submit,
html[data-theme="dark"] .creator-wallet-submit-btn,
html[data-theme="dark"] .creator-wallet-success-action {
  background: var(--auth-accent);
  border-color: var(--auth-accent);
  color: #f8fbff;
}

html[data-theme="dark"] .creator-shop-toolbar__add-btn {
  background: var(--auth-accent);
  border-color: var(--auth-accent);
  color: #f8fbff;
}

html[data-theme="dark"] .creator-feed-create-btn:hover,
html[data-theme="dark"] .auth-mobile-search-panel__submit:hover,
html[data-theme="dark"] .creator-wallet-submit-btn:hover {
  background: var(--auth-accent-hover);
  border-color: var(--auth-accent-hover);
}

html[data-theme="dark"] .creator-shop-toolbar__add-btn:hover {
  background: var(--auth-accent-hover);
  border-color: var(--auth-accent-hover);
}

html[data-theme="dark"] .creator-feed-secondary-btn,
html[data-theme="dark"] .creator-feed-icon-btn,
html[data-theme="dark"] .creator-feed-theme-toggle,
html[data-theme="dark"] .auth-mobile-header__action,
html[data-theme="dark"] .auth-mobile-header__theme .creator-feed-theme-toggle,
html[data-theme="dark"] .auth-mobile-search-panel__close,
html[data-theme="dark"] .auth-mobile-drawer__close,
html[data-theme="dark"] .creator-wallet-fund-trigger,
html[data-theme="dark"] .creator-wallet-withdraw-trigger,
html[data-theme="dark"] .creator-wallet-upload-btn,
html[data-theme="dark"] .creator-wallet-panel-close,
html[data-theme="dark"] .creator-shop-card__action,
html[data-theme="dark"] .creator-messages-filter-chip,
html[data-theme="dark"] .creator-messages-thread-submit {
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-feed-section-control {
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-feed-action-bookmark {
  color: var(--auth-text-primary);
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
}

html[data-theme="dark"] .creator-feed-action-btn {
  color: var(--auth-text-primary);
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
}

html[data-theme="dark"] .creator-feed-secondary-btn:hover,
html[data-theme="dark"] .creator-feed-icon-btn:hover,
html[data-theme="dark"] .creator-feed-theme-toggle:hover,
html[data-theme="dark"] .auth-mobile-header__action:hover,
html[data-theme="dark"] .auth-mobile-search-panel__close:hover,
html[data-theme="dark"] .auth-mobile-drawer__close:hover,
html[data-theme="dark"] .creator-wallet-fund-trigger:hover,
html[data-theme="dark"] .creator-wallet-withdraw-trigger:hover,
html[data-theme="dark"] .creator-wallet-upload-btn:hover,
html[data-theme="dark"] .creator-wallet-panel-close:hover,
html[data-theme="dark"] .creator-shop-card__action:hover,
html[data-theme="dark"] .creator-dashboard-filter select:hover,
html[data-theme="dark"] .creator-settings-mobile-row:hover,
html[data-theme="dark"] .creator-settings-mobile-language-link:hover,
html[data-theme="dark"] .creator-messages-filter-chip:hover {
  background: var(--auth-control-hover);
}

html[data-theme="dark"] .creator-feed-page input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] .creator-feed-page textarea,
html[data-theme="dark"] .creator-feed-page select,
html[data-theme="dark"] .creator-feed-search-control,
html[data-theme="dark"] .creator-feed-composer-pill,
html[data-theme="dark"] .creator-wallet-amount-field,
html[data-theme="dark"] .creator-wallet-destination-option,
html[data-theme="dark"] .creator-wallet-gateway-card,
html[data-theme="dark"] .creator-wallet-summary,
html[data-theme="dark"] .creator-wallet-balance-context,
html[data-theme="dark"] .creator-wallet-bank-details,
html[data-theme="dark"] .creator-wallet-bank-box,
html[data-theme="dark"] .creator-settings-switch,
html[data-theme="dark"] .creator-settings-card .form-control,
html[data-theme="dark"] .creator-settings-card .custom-select,
html[data-theme="dark"] .creator-settings-card textarea.form-control,
html[data-theme="dark"] .creator-shop-toolbar__select select,
html[data-theme="dark"] .creator-message-composer__field {
  background: var(--auth-input-bg);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-feed-page input::placeholder,
html[data-theme="dark"] .creator-feed-page textarea::placeholder,
html[data-theme="dark"] .creator-feed-search-control::placeholder,
html[data-theme="dark"] .creator-messages-composer textarea::placeholder {
  color: var(--auth-text-muted);
}

html[data-theme="dark"] .creator-feed-page input:focus,
html[data-theme="dark"] .creator-feed-page textarea:focus,
html[data-theme="dark"] .creator-feed-page select:focus,
html[data-theme="dark"] .creator-feed-search-control:focus,
html[data-theme="dark"] .creator-settings-card .form-control:focus,
html[data-theme="dark"] .creator-settings-card .custom-select:focus,
html[data-theme="dark"] .creator-settings-card textarea.form-control:focus,
html[data-theme="dark"] .creator-wallet-amount-field:focus-within,
html[data-theme="dark"] .creator-message-composer__field:focus-within {
  border-color: var(--auth-border-strong);
  /*box-shadow: 0 0 0 3px rgba(91, 124, 255, 0.16);*/
}

html[data-theme="dark"] .creator-feed-page--home .creator-feed-secondary-btn,
html[data-theme="dark"] .creator-feed-page--home .creator-feed-carousel-card,
html[data-theme="dark"] .creator-feed-page--home .creator-feed-right-highlight-card,
html[data-theme="dark"] .creator-feed-page--home .creator-feed-post-card {
  background: var(--auth-surface-2);
}

html[data-theme="dark"] .creator-feed-page--home .creator-feed-person-card {
  background: color-mix(in srgb, var(--auth-surface-2) 88%, var(--auth-surface-1) 12%);
}

html[data-theme="dark"] .creator-feed-right-section-card {
  box-shadow: none;
}

html[data-theme="dark"] .creator-feed-right-user-title i {
  color: var(--auth-accent);
}

html[data-theme="dark"] .creator-feed-secondary-btn--subscribe {
  color: var(--auth-accent);
  border-color: var(--auth-accent);
}

html[data-theme="dark"] .creator-feed-secondary-btn--subscribe:hover {
  background: color-mix(in srgb, var(--auth-accent) 12%, var(--auth-surface-2));
}

html[data-theme="dark"] .creator-feed-page--home .creator-feed-notice-card {
  background: #111f36;
}

html[data-theme="dark"] .creator-feed-page .creator-feed-notice-card {
  background: #111f36;
}

html[data-theme="dark"] .creator-feed-page .announcements {
  background: #111f36;
}

html[data-theme="dark"] .creator-feed-page--home .creator-feed-tabs,
html[data-theme="dark"] .creator-profile-stat-card,
html[data-theme="dark"] .creator-settings-mobile-list-card,
html[data-theme="dark"] .creator-messages-row:hover,
html[data-theme="dark"] .creator-messages-thread-notice,
html[data-theme="dark"] .creator-message-reaction {
  background: color-mix(in srgb, var(--auth-surface-3) 84%, var(--auth-surface-2) 16%);
}

html[data-theme="dark"] .home-mobile-feed-tabs__inner {
  background: color-mix(in srgb, var(--auth-surface-3) 84%, var(--auth-surface-2) 16%);
  border-color: var(--auth-border);
  /*box-shadow: var(--auth-shadow);*/
}

html[data-theme="dark"] .creator-feed-tab.is-active,
html[data-theme="dark"] .home-mobile-feed-tabs__item.is-active {
  background: var(--auth-surface-elevated);
  color: var(--auth-accent);
}

html[data-theme="dark"] .creator-feed-mobile-nav {
  background: rgba(15, 27, 48, 0.94);
  border-top-color: var(--auth-border);
  /*box-shadow: 0 -16px 28px rgba(2, 6, 23, 0.32);*/
}

html[data-theme="dark"] .creator-feed-post-card .content-locked.creator-feed-content-locked-preview {
  background: linear-gradient(180deg, rgba(15, 27, 48, 0.98), rgba(20, 35, 59, 0.92));
  border: 1px solid var(--auth-border);
}

html[data-theme="dark"] .creator-feed-post-card .content-locked.creator-feed-content-locked-preview::after {
  background: rgba(2, 6, 23, 0.58);
}

html[data-theme="dark"] .creator-feed-post-card .content-locked .btn,
html[data-theme="dark"] .creator-feed-post-card .content-locked .btn-post,
html[data-theme="dark"] .creator-feed-post-card .content-locked .btn-primary {
  background: var(--auth-accent);
  border-color: var(--auth-accent);
  color: #f8fbff;
}

html[data-theme="dark"] .creator-shop-card {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-feed-carousel-card {
  background: rgba(255, 255, 255, 0.03);
  
}

html[data-theme="dark"] .creator-shop-card__play {
  background: rgba(8, 17, 31, 0.6);
  color: var(--auth-text-primary);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .creator-shop-card__badge {
  background: rgba(8, 17, 31, 0.6);
  color: var(--auth-text-primary);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .creator-wallet-destination-option.is-selected,
html[data-theme="dark"] .creator-wallet-gateway-option input:checked + .creator-wallet-gateway-card,
html[data-theme="dark"] .creator-dashboard-status-pill.is-active,
html[data-theme="dark"] .creator-dashboard-status-pill.is-warning,
html[data-theme="dark"] .creator-dashboard-status-pill.is-cancelled {
  border-color: transparent;
}

html[data-theme="dark"] .creator-dashboard-metric-hint,
html[data-theme="dark"] .creator-dashboard-panel-footer a,
html[data-theme="dark"] .creator-wallet-terms a,
html[data-theme="dark"] .creator-wallet-view-all,
html[data-theme="dark"] .creator-wallet-transaction-title-row a,
html[data-theme="dark"] .creator-wallet-transaction-amount a {
  color: #8eb0ff;
}

html[data-theme="dark"] .creator-feed-notice-card p a {
  color: #8eb0ff;
}

html[data-theme="dark"] .creator-dashboard-table tbody td,
html[data-theme="dark"] .creator-wallet-transaction-amount strong,
html[data-theme="dark"] .creator-wallet-summary-row strong,
html[data-theme="dark"] .creator-wallet-balance-context strong,
html[data-theme="dark"] .creator-settings-switch strong,
html[data-theme="dark"] .creator-settings-card .custom-control-label,
html[data-theme="dark"] .creator-settings-mobile-back,
html[data-theme="dark"] .creator-messages-row,
html[data-theme="dark"] .creator-message-bubble,
html[data-theme="dark"] .creator-messages-thread-identity strong {
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-wallet-empty {
  background: color-mix(in srgb, var(--auth-surface-3) 84%, var(--auth-surface-2) 16%);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-wallet-funding-backdrop,
html[data-theme="dark"] .creator-wallet-success-backdrop {
  background: rgba(2, 6, 23, 0.74);
}

html[data-theme="dark"] .creator-wallet-funding-panel,
html[data-theme="dark"] .creator-wallet-success-surface {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-wallet-panel {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-wallet-balance-card--creator {
  background: linear-gradient(135deg, #172944 0%, #20385c 100%);
  color: #edf4ff;
}

html[data-theme="dark"] .creator-wallet-balance-copy--creator p,
html[data-theme="dark"] .creator-wallet-balance-copy--creator .creator-wallet-balance-name-label,
html[data-theme="dark"] .creator-wallet-balance-amount--creator strong,
html[data-theme="dark"] .creator-wallet-balance-amount--creator small,
html[data-theme="dark"] .creator-wallet-balance-badge {
  color: #edf4ff;
}

html[data-theme="dark"] .creator-wallet-transaction-icon {
  background: rgba(52, 211, 153, 0.1);
}

html[data-theme="dark"] .creator-wallet-transaction-icon.is-creator {
  background: rgba(91, 124, 255, 0.16);
  color: #bcd0ff;
}

html[data-theme="dark"] .creator-wallet-transaction-item,
html[data-theme="dark"] .creator-dashboard-table th,
html[data-theme="dark"] .creator-dashboard-table td,
html[data-theme="dark"] .creator-messages-filters,
html[data-theme="dark"] .creator-messages-composer-wrap {
  border-color: var(--auth-border);
}

html[data-theme="dark"] .creator-settings-mobile-language-link {
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-settings-mobile-row {
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-messages-thread-body {
  background: var(--auth-surface-2);
}

html[data-theme="dark"] .creator-messages-thread-header {
  border-color: var(--auth-border);
  background: var(--auth-surface-2);
}

html[data-theme="dark"] .creator-messages-sidebar-header {
  border-color: var(--auth-border);
  background: var(--auth-surface-2);
}

html[data-theme="dark"] .creator-messages-sidebar {
  border-right-color: var(--auth-border);
}

html[data-theme="dark"] .creator-message-delete {
  color: var(--auth-text-secondary);
}

html[data-theme="dark"] .creator-messages-header-action:hover,
html[data-theme="dark"] .creator-messages-thread-icon:hover,
html[data-theme="dark"] .creator-messages-composer-tool:hover,
html[data-theme="dark"] .creator-messages-thread-back:hover {
  background: var(--auth-accent-soft);
  color: var(--auth-accent);
}

html[data-theme="dark"] .creator-message-bubble--other {
  background: var(--auth-input-bg);
  border-color: var(--auth-border);
}

html[data-theme="dark"] .creator-settings-switch-control span {
  background: rgba(144, 165, 197, 0.28);
}

html[data-theme="dark"] .creator-settings-switch-control span::after {
  background: #d9e4f7;
}

html[data-theme="dark"] .creator-settings-card .input-group-text {
  background: rgba(144, 165, 197, 0.12);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-settings-card .alert {
  background: rgba(20, 35, 59, 0.92);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

html[data-theme="dark"] ::-webkit-scrollbar-track {
  background: rgba(8, 17, 31, 0.72);
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: rgba(144, 165, 197, 0.26);
  border-radius: var(--radius-pill);
  border: 2px solid rgba(8, 17, 31, 0.72);
}

html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(144, 165, 197, 0.4);
}

.creator-settings-workspace > *,
.creator-settings-desktop,
.creator-settings-section,
.creator-settings-section-inner {
  width: 100%;
  min-width: 0;
}

.creator-settings-workspace {
  width: 100%;
  min-width: 0;
  padding-top: 0.25rem;
}

.creator-notification-settings-workspace > *,
.creator-notification-settings-desktop,
.creator-notification-settings-section {
  width: 100%;
  min-width: 0;
}

.creator-notification-settings-workspace {
  width: 100%;
  min-width: 0;
  padding-top: 0.25rem;
}

.creator-notification-settings-feedback-wrap {
  margin-bottom: 16px;
}

.creator-notification-settings-feedback {
  padding: 12px 14px;
  border-radius: 10px;
  font-size: var(--text-meta-size);
}

.creator-notification-settings-feedback--success {
  background: rgba(34, 197, 94, 0.12);
  border: 1px solid rgba(34, 197, 94, 0.2);
  color: #15803d;
}

.creator-notification-settings-feedback--error {
  background: rgba(239, 68, 68, 0.1);
  border: 1px solid rgba(239, 68, 68, 0.2);
  color: #dc2626;
}

.creator-notification-settings-header {
  margin-bottom: 12px;
}

.creator-notification-settings-header h1 {
  margin: 0;
  font-size: var(--text-page-title-size);
  line-height: 1.15;
  font-weight: var(--creator-font-weight-bold);
  color: var(--text-primary);
}

.creator-notification-settings-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  padding-bottom: 10px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--border-color);
  scrollbar-width: none;
}

.custom-switch-lg .custom-control-input:checked ~ .custom-control-label::after{
    transform: translate(1.7rem, -50%)!important;
}

.creator-notification-settings-tabs::-webkit-scrollbar {
  display: none;
}

.creator-notification-settings-tab {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--text-meta-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
  white-space: nowrap;
}

.creator-notification-settings-tab:hover {
  color: var(--text-primary);
  background: rgba(148, 163, 184, 0.12);
  text-decoration: none;
}

.creator-notification-settings-tab.is-active {
  color: var(--text-primary);
  background: rgba(148, 163, 184, 0.12);
  text-decoration: none;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-notification-settings-mobile {
  width: 100%;
  min-width: 0;
  display: none;
}

.creator-notification-settings-section-intro {
  margin-bottom: 18px;
}

.creator-notification-settings-section-intro h2 {
  margin: 0;
  font-size: var(--text-section-title-size);
  line-height: 1.2;
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-notification-settings-section-intro p {
  margin: 6px 0 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-notification-settings-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 14px;
  
  padding: 22px;
}

.creator-notification-settings-card + .creator-notification-settings-card {
  margin-top: 18px;
}

.creator-notification-settings-card-head {
  margin-bottom: 14px;
}

.creator-notification-settings-card-head h2 {
  margin: 0;
  font-size: var(--text-control-size);
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-notification-settings-card-head p {
  margin: 6px 0 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-notification-settings-rows {
  display: grid;
}

.creator-notification-settings-row {
  min-height: 50px;
  padding: 12px 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--border-color);
}

.creator-notification-settings-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.creator-notification-settings-row-copy {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.creator-notification-settings-row-copy strong {
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-medium);
  color: var(--text-primary);
}

.creator-notification-settings-row-copy small {
  font-size: var(--text-micro-size);
  color: var(--text-secondary);
}

.creator-notification-settings-switch {
  position: relative;
  width: 38px;
  height: 22px;
  flex: 0 0 auto;
}

.creator-notification-settings-switch input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.creator-notification-settings-switch span {
  position: absolute;
  inset: 0;
  border-radius: var(--radius-pill);
  background: rgba(148, 163, 184, 0.4);
  transition: background 0.2s ease;
}

.creator-notification-settings-switch span::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--auth-surface-2);
  transition: transform 0.2s ease;
}

.creator-notification-settings-switch input:checked + span {
  background: #2563eb;
}

.creator-notification-settings-switch input:checked + span::after {
  transform: translateX(16px);
}

.creator-notification-settings-switch input:disabled + span {
  opacity: 0.6;
}

.creator-notification-settings-switch input:focus + span {
  
}

.creator-notification-settings-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}

.creator-notification-settings-inline-note {
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(59, 130, 246, 0.18);
  background: rgba(59, 130, 246, 0.08);
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

.creator-notification-settings-empty-state {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-align: center;
}

.creator-notification-settings-empty-state-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(59, 130, 246, 0.08);
  color: #2563eb;
  font-size: var(--text-subtitle-size);
}

.creator-notification-settings-empty-state h2 {
  margin: 0;
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-notification-settings-empty-state p {
  margin: 0;
  max-width: 420px;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-settings-header {
  margin-bottom: 12px;
}

.creator-settings-header h1 {
  margin: 0;
  font-size: var(--text-page-title-size);
  line-height: 1.15;
  font-weight: var(--creator-font-weight-bold);
  color: var(--text-primary);
}

.creator-settings-tabs {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  padding-bottom: 10px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--border-color);
  scrollbar-width: none;
}

.creator-settings-tabs::-webkit-scrollbar {
  display: none;
}

.creator-settings-tab {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 10px 14px;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--text-meta-size);
  line-height: 1;
  font-weight: var(--creator-font-weight-medium);
  white-space: nowrap;
}

.creator-settings-tab:hover {
  color: var(--text-primary);
  background: rgba(148, 163, 184, 0.12);
  text-decoration: none;
}

.creator-settings-tab.is-active {
  color: var(--text-primary);
  background: rgba(148, 163, 184, 0.12);
  text-decoration: none;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-mobile {
  width: 100%;
  min-width: 0;
  display: none;
}

.creator-settings-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  
  padding: 22px;
}

.creator-settings-card + .creator-settings-card {
  margin-top: 20px;
}

.creator-settings-preview-card {
  overflow: hidden;
  padding: 0;
}

.creator-settings-cover {
  min-height: 198px;
}

.creator-settings-cover-upload {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  padding: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.creator-settings-cover-upload__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  pointer-events: none;
  transition: opacity .18s ease;
}

.creator-settings-cover-upload__control {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  background: rgba(15, 23, 42, 0.66);
  color: #fff;
  font-size: var(--text-micro-size);
  font-weight: 600;
  line-height: 1;
}

.creator-settings-cover-upload__control i {
  font-size: var(--text-card-title-size);
}

.creator-settings-cover:hover .creator-settings-cover-upload__overlay,
.creator-settings-cover:focus-within .creator-settings-cover-upload__overlay,
.creator-settings-cover-upload:focus-visible .creator-settings-cover-upload__overlay {
  opacity: 1;
}

.creator-settings-cover-upload:focus-visible,
.creator-settings-avatar-upload:focus-visible,
.creator-settings-cover-menu__trigger:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.92);
  outline-offset: -3px;
}

.creator-settings-cover-menu {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 4;
  opacity: 0;
  transition: opacity .18s ease;
}

.creator-settings-cover:hover .creator-settings-cover-menu,
.creator-settings-cover:focus-within .creator-settings-cover-menu,
.creator-settings-cover-menu[open] {
  opacity: 1;
}

.creator-settings-cover-menu__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(15, 23, 42, 0.62);
  color: #fff;
  cursor: pointer;
  list-style: none;
}

.creator-settings-cover-menu__trigger::-webkit-details-marker {
  display: none;
}

.creator-settings-cover-menu__panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 130px;
  padding: 6px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  
}

.creator-settings-cover-menu__panel button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 32px;
  border: 0;
  border-radius: 6px;
  padding: 0 9px;
  background: transparent;
  color: var(--text-primary);
  font-size: var(--text-micro-size);
  text-align: left;
  cursor: pointer;
}

.creator-settings-cover-menu__panel button:hover,
.creator-settings-cover-menu__panel button:focus {
  background: rgba(148, 163, 184, 0.14);
}

.creator-settings-preview-body {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 18px;
  padding: 0 28px 20px;
}

.creator-settings-avatar-wrap {
  margin-top: -56px;
  width: 130px;
}

.creator-settings-avatar {
  width: 130px;
  height:auto;
}

.creator-settings-avatar-upload {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  display: block;
  width: 90px;
  height: 90px;
  border: 0;
  border-radius: 50%;
  overflow: hidden;
  padding: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.creator-settings-avatar-upload__overlay {
  position: absolute;
  inset: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(15, 23, 42, 0.42);
  opacity: 1;
  pointer-events: none;
  transition: opacity .18s ease;
  border-radius: 999px;
}

.creator-settings-avatar-upload__overlay i {
  font-size: var(--text-section-title-size);
}

.creator-settings-avatar-wrap:hover .creator-settings-avatar-upload__overlay,
.creator-settings-avatar-wrap:focus-within .creator-settings-avatar-upload__overlay,
.creator-settings-avatar-upload:focus-visible .creator-settings-avatar-upload__overlay {
  opacity: 1;
}

.creator-settings-preview-copy {
  padding-top: 20px;
  align-self: center;
}

.creator-settings-preview-copy h2 {
  margin: 0;
  font-size: var(--text-modal-title-size);
  line-height: 1.15;
  font-weight: var(--creator-font-weight-bold);
  color: var(--text-primary);
}

.creator-settings-preview-copy p {
  margin: 4px 0 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-settings-card-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}

.creator-settings-card-heading--stack {
  align-items: flex-start;
}

.creator-settings-card-heading h2 {
  margin: 0;
  font-size: var(--text-section-title-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-settings-card-heading p {
  margin: 4px 0 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-settings-subcard-heading {
  margin-bottom: 18px;
}

.creator-settings-subcard-heading h2 {
  margin: 0;
  font-size: var(--text-section-title-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-settings-subcard-heading p {
  margin: 6px 0 0;
  max-width: 680px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
}

.creator-settings-form-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
}

.creator-settings-privacy-page-card {
  width: 100%;
}

.creator-settings-privacy-section-heading {
  margin-bottom: 16px;
}

.creator-settings-privacy-section-heading h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-privacy-section-heading p {
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
}

.creator-settings-privacy-section-heading--divided {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--border-color);
}

.creator-settings-login-sessions {
  display: grid;
  gap: 0;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  padding: 14px;
  background: var(--bg-card);
}

.creator-settings-session-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--border-color);
}

.creator-settings-session-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.creator-settings-session-row--current {
  padding-bottom: 14px;
}

.creator-settings-session-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-sm);
  background: var(--bg-subtle);
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
}

.creator-settings-session-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.creator-settings-session-copy strong,
.creator-settings-session-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-settings-session-copy strong {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-session-copy small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-settings-session-badge {
  border-radius: var(--radius-pill);
  padding: 4px 10px;
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1;
  text-transform: uppercase;
}

.creator-settings-session-warning {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-color);
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.45;
}

.creator-settings-session-warning i {
  color: #b45309;
}

.creator-settings-session-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: start;
  gap: 8px;
  min-height: 36px;
  margin-top: 12px;
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: var(--radius-sm);
  padding: 0 14px;
  background: rgba(239, 68, 68, 0.08);
  color: #dc2626;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-privacy-switch-list {
  display: grid;
  gap: 11px;
}

.creator-settings-privacy-switch-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-height: 28px;
  padding: 0;
  border-top: 0;
}

.creator-settings-privacy-switch-row--security {
  margin-top: 0;
}

.creator-settings-privacy-switch-copy {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  min-width: 0;
  gap: 4px;
}

.creator-settings-privacy-switch-copy label {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-regular);
  line-height: 1.3;
}

.creator-settings-privacy-switch-copy small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.3;
}

.creator-settings-privacy-switch.custom-control {
  min-height: 24px;
  padding-left: 0;
}

.creator-settings-privacy-switch .custom-control-input {
  position: absolute;
}

.creator-settings-privacy-switch .custom-control-label {
  position: relative;
  width: 44px;
  min-height: 24px;
  padding-left: 44px;
  cursor: pointer;
}

.creator-settings-privacy-switch .custom-control-label::before {
  top: 50%;
  left: 0;
  width: 44px;
  height: 24px;
  border: 0;
  border-radius: var(--radius-pill);
  background: #cbd5e1;
  transform: translateY(-50%);
  box-shadow: none;
}

.creator-settings-privacy-switch .custom-control-label::after {
  top: 50%;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--auth-surface-2);
  transform: translateY(-50%);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);
}

.creator-settings-privacy-switch .custom-control-input:checked ~ .custom-control-label::before {
  background: var(--brand-primary);
}

.creator-settings-privacy-switch .custom-control-input:checked ~ .custom-control-label::after {
  transform: translate(20px, -50%);
}

.creator-settings-privacy-switch .custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.18);
}

.creator-settings-delete-heading {
  margin-bottom: 12px;
}

.creator-settings-delete-actions {
  display: flex;
  align-items: center;
}

.creator-settings-delete-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  border: 0;
  border-radius: var(--radius-sm);
  padding: 0 14px;
  background: #dc2626;
  color: #fff;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-decoration: none;
}

.creator-settings-delete-button:hover {
  color: #fff;
  opacity: 0.94;
  text-decoration: none;
}

.creator-settings-privacy-card-heading {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border-color);
}

.creator-settings-privacy-empty {
  min-height: 190px;
}

.creator-settings-privacy-actions {
  width: 100%;
}

.creator-settings-block-countries .select2-container {
  width: 100%;
}

.creator-settings-block-countries .select2-container--default .select2-selection--multiple {
  min-height: 44px;
  border-color: var(--border-color);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
}

.creator-settings-block-countries .select2-container--default .select2-selection--multiple .select2-selection__rendered {
  width: 100%;
  padding: 4px 10px;
}

.creator-settings-block-countries .select2-container--default .select2-search--inline .select2-search__field {
  min-height: 28px;
  margin-top: 0;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
}

.creator-settings-restricted-list {
  display: grid;
  gap: 12px;
}

.creator-settings-restricted-user {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
  padding: 12px 0;
  border-top: 1px solid var(--border-color);
}

.creator-settings-restricted-user:first-child {
  border-top: 0;
  padding-top: 0;
}

.creator-settings-restricted-user__profile {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-settings-restricted-user__avatar {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-settings-restricted-user__profile span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.creator-settings-restricted-user__profile strong,
.creator-settings-restricted-user__profile small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-settings-restricted-user__profile strong {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-restricted-user__profile small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-settings-restricted-user__action {
  flex: 0 0 auto;
  min-height: 34px;
  border: 1px solid rgba(239, 68, 68, 0.2);
  border-radius: var(--radius-sm);
  padding: 0 12px;
  background: rgba(239, 68, 68, 0.08);
  color: #dc2626;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-restricted-empty {
  min-height: 190px;
}

.creator-settings-subscription-page {
  width: 100%;
  /*max-width: 940px;*/
}

.creator-settings-subscription-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  margin-bottom: 20px;
  padding: 14px 16px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: rgba(59, 130, 246, 0.06);
  color: var(--text-primary);
}

.creator-settings-subscription-banner__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(37, 99, 235, 0.1);
  color: #2563eb;
}

.creator-settings-subscription-banner p {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.4;
}

.creator-settings-subscription-card .creator-settings-subcard-heading {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--border-color);
}

.creator-settings-subscription-form {
  width: 100%;
}

.creator-settings-subscription-fields {
  display: grid;
  gap: 22px;
}

.creator-settings-subscription-plan {
  display: grid;
  gap: 10px;
}

.creator-settings-subscription-plan label {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-subscription-money-input {
  width: 100%;
}

.creator-settings-subscription-money-input .creator-settings-input {
  width: 100%;
}

.creator-settings-subscription-status {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 34px;
}

.creator-settings-subscription-status > span {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-subscription-status .creator-settings-switch-control span::after {
  top: 50%;
  transform: translateY(-50%);
}

.creator-settings-subscription-status .creator-settings-switch-control input:checked + span::after {
  transform: translate(16px, -50%);
}

.creator-settings-subscription-user-list {
  display: grid;
  gap: 12px;
}

.creator-settings-subscription-user-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  min-width: 0;
  padding: 12px 0;
  border-top: 1px solid var(--border-color);
  color: var(--text-primary);
  text-decoration: none;
}

.creator-settings-subscription-user-row:first-child {
  border-top: 0;
  padding-top: 0;
}

.creator-settings-subscription-user-row img {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-settings-subscription-user-row span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.creator-settings-subscription-user-row strong,
.creator-settings-subscription-user-row small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-settings-subscription-user-row strong {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-subscription-user-row small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-settings-subscription-user-row em {
  margin-left: auto;
  border-radius: var(--radius-pill);
  padding: 4px 10px;
  background: rgba(34, 197, 94, 0.1);
  color: #15803d;
  font-size: var(--text-micro-size);
  font-style: normal;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-subscription-empty {
  min-height: 210px;
}

.creator-settings-subscription-secondary-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-sm);
  padding: 0 16px;
  background: transparent;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-decoration: none;
}

.creator-settings-subscription-pagination {
  margin-top: 12px;
}

.creator-settings-subscription-actions {
  width: 100%;
}

.creator-settings-live-private-page {
  width: 100%;
  /*max-width: 940px;*/
}

.creator-settings-live-private-heading {
  padding-bottom: 18px;
  border-bottom: 1px solid var(--border-color);
}

.creator-settings-live-private-form {
  display: grid;
  gap: 22px;
}

.creator-settings-live-private-switch-row {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 36px;
}

.creator-settings-live-private-switch-row > span,
.creator-settings-live-private-field label {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-live-private-switch-row .creator-settings-switch-control span::after {
  top: 50%;
  transform: translateY(-50%);
}

.creator-settings-live-private-switch-row .creator-settings-switch-control input:checked + span::after {
  transform: translate(16px, -50%);
}

.creator-settings-live-private-field {
  display: grid;
  gap: 10px;
}

.creator-settings-live-private-money-input,
.creator-settings-live-private-money-input .creator-settings-input {
  width: 100%;
}

.creator-settings-live-private-request-list {
  display: grid;
  gap: 14px;
}

.creator-settings-live-private-request-row {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) minmax(180px, auto) auto auto;
  align-items: center;
  gap: 14px;
  padding: 14px 0;
  border-top: 1px solid var(--border-color);
}

.creator-settings-live-private-request-row:first-child {
  padding-top: 0;
  border-top: 0;
}

.creator-settings-live-private-request-user {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-settings-live-private-request-user img {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-settings-live-private-request-user span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.creator-settings-live-private-request-user strong,
.creator-settings-live-private-request-user small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-settings-live-private-request-user strong {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-live-private-request-user small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-settings-live-private-request-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px 10px;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-settings-live-private-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border-radius: var(--radius-pill);
  padding: 4px 10px;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1;
  text-transform: uppercase;
}

.creator-settings-live-private-status--warning {
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

.creator-settings-live-private-status--success {
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
}

.creator-settings-live-private-status--danger {
  background: rgba(239, 68, 68, 0.12);
  color: #b91c1c;
}

.creator-settings-live-private-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.creator-settings-live-private-actions form {
  margin: 0;
}

.creator-settings-live-private-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: var(--radius-sm);
  color: #fff;
}

.creator-settings-live-private-action--accept {
  background: #16a34a;
}

.creator-settings-live-private-action--reject {
  background: #dc2626;
}

.creator-settings-live-private-empty {
  min-height: 210px;
}

.creator-settings-live-private-pagination {
  margin-top: 12px;
}

.creator-settings-live-private-save {
  width: 100%;
}

.creator-settings-shop-card {
  width: 100%;
}

.creator-settings-shop-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.creator-settings-shop-heading__copy h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-shop-heading__copy p {
  margin: 4px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

.creator-settings-shop-filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.creator-settings-shop-filters label {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}

.creator-settings-shop-filters label > span {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-shop-filter {
  min-width: 132px;
  min-height: 38px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-sm);
  padding: 0 34px 0 12px;
  background-color: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-shop-divider {
  margin: 18px 0 0;
  border-top: 1px solid var(--border-color);
}

.creator-settings-shop-list {
  display: grid;
  gap: 0;
}

.creator-settings-shop-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.35fr) minmax(180px, 1fr) minmax(120px, auto) auto auto;
  align-items: center;
  gap: 14px;
  padding: 16px 0;
  border-top: 1px solid var(--border-color);
}

.creator-settings-shop-row:first-child {
  border-top: 0;
}

.creator-settings-shop-row--product {
  grid-template-columns: minmax(240px, 1.5fr) minmax(120px, auto) minmax(90px, auto) auto auto;
}

.creator-settings-shop-row__profile,
.creator-settings-shop-row__user {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-settings-shop-row__profile:hover,
.creator-settings-shop-row__user:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-settings-shop-row__icon,
.creator-settings-shop-row__thumb,
.creator-settings-shop-row__user img {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 50%;
}

.creator-settings-shop-row__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border-color);
  background: var(--bg-subtle);
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
}

.creator-settings-shop-row__thumb,
.creator-settings-shop-row__user img {
  object-fit: cover;
}

.creator-settings-shop-row__profile span,
.creator-settings-shop-row__user span,
.creator-settings-shop-row__meta {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.creator-settings-shop-row__profile strong,
.creator-settings-shop-row__profile small,
.creator-settings-shop-row__user strong,
.creator-settings-shop-row__user small,
.creator-settings-shop-row__meta strong,
.creator-settings-shop-row__meta small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-settings-shop-row__profile strong,
.creator-settings-shop-row__user strong,
.creator-settings-shop-row__meta strong {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-shop-row__profile small,
.creator-settings-shop-row__user small,
.creator-settings-shop-row__meta small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-settings-shop-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border-radius: var(--radius-pill);
  padding: 4px 10px;
  background: var(--bg-subtle);
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1;
  text-transform: uppercase;
}

.creator-settings-shop-status--success {
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
}

.creator-settings-shop-status--warning {
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

.creator-settings-shop-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.creator-settings-shop-actions form {
  margin: 0;
}

.creator-settings-shop-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: var(--radius-sm);
  background: var(--brand-primary);
  color: #fff;
  text-decoration: none;
}

.creator-settings-shop-action:hover {
  color: #fff;
  opacity: 0.94;
}

.creator-settings-shop-action--accept {
  background: #16a34a;
}

.creator-settings-shop-action--reject {
  background: #dc2626;
}

.creator-settings-shop-empty {
  min-height: 300px;
}

.creator-settings-shop-product-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 18px;
}

.creator-settings-shop-pagination {
  margin-top: 12px;
}

.creator-payments-card {
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  padding: 22px;
  background: var(--bg-card);
  box-shadow: none;
}

.creator-payments-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.creator-payments-heading__copy h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1.25;
}

.creator-payments-heading__copy p {
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.45;
}

.creator-payments-filters {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.creator-payments-filter {
  position: relative;
}

.creator-payments-filter summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  min-width: 132px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-sm);
  padding: 0 12px;
  background: var(--bg-card);
  color: var(--text-primary);
  cursor: pointer;
  list-style: none;
}

.creator-payments-filter summary::-webkit-details-marker {
  display: none;
}

.creator-payments-filter summary span {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-payments-filter summary strong {
  max-width: 120px;
  overflow: hidden;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-payments-filter summary i {
  margin-left: auto;
  color: var(--text-secondary);
}

.creator-payments-filter__menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 20;
  display: grid;
  min-width: 180px;
  overflow: hidden;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  box-shadow: var(--shadow-sm);
}

.creator-payments-filter__menu a {
  padding: 9px 12px;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-medium);
  text-decoration: none;
}

.creator-payments-filter__menu a:hover,
.creator-payments-filter__menu a:focus,
.creator-payments-filter__menu a.is-active {
  text-decoration: none;
}

.creator-payments-divider {
  margin: 18px 0 0;
  border-top: 1px solid var(--border-color);
}

.creator-payments-table-wrap {
  width: 100%;
  overflow: visible;
}

.creator-payments-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--text-primary);
}

.creator-payments-table th,
.creator-payments-table td {
  padding: 15px 10px;
  border-bottom: 1px solid var(--border-color);
  vertical-align: middle;
  font-size: var(--text-meta-size);
  line-height: 1.35;
  text-align: left;
}

.creator-payments-table th {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  white-space: nowrap;
}

.creator-payments-table tbody tr:last-child td {
  border-bottom: 0;
}

.creator-payments-reference,
.creator-payments-amount {
  font-weight: var(--creator-font-weight-semibold);
}

.creator-payments-user {
  display: grid;
  gap: 2px;
  min-width: 0;
  color: var(--text-primary);
  text-decoration: none;
}

.creator-payments-user:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-payments-user strong,
.creator-payments-user small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-payments-user strong {
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-payments-user small,
.creator-payments-muted {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-payments-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  border-radius: var(--radius-pill);
  padding: 4px 10px;
  background: var(--bg-subtle);
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.creator-payments-status--success {
  background: rgba(34, 197, 94, 0.12);
  color: #15803d;
}

.creator-payments-status--pending {
  background: rgba(245, 158, 11, 0.12);
  color: #b45309;
}

.creator-payments-status--canceled {
  background: rgba(239, 68, 68, 0.12);
  color: #dc2626;
}

.creator-payments-invoice {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--brand-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  text-decoration: none;
  white-space: nowrap;
}

.creator-payments-invoice:hover {
  color: var(--brand-primary-hover);
  text-decoration: none;
}

.creator-payments-gift {
  display: inline-flex;
  margin-left: 6px;
  vertical-align: middle;
}

.creator-payments-gift img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.creator-payments-empty {
  display: grid;
  place-items: center;
  min-height: 300px;
  gap: 12px;
  text-align: center;
}

.creator-payments-empty__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(59, 130, 246, 0.14);
  border-radius: var(--radius-sm);
  background: rgba(59, 130, 246, 0.08);
  color: var(--brand-primary);
  font-size: var(--text-lead-size);
}

.creator-payments-empty h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-payments-pagination {
  margin-top: 14px;
}

.creator-settings-save {
  border: 0;
  border-radius: 10px;
  min-height: 40px;
  padding: 0 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--brand-primary);
  color: #fff;
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  box-shadow: none;
}

.creator-settings-save:hover {
  opacity: 0.96;
}

.creator-settings-feedback {
  margin-bottom: 16px;
  border-radius: 10px;
}

.creator-settings-feedback--success {
  padding: 12px 14px;
  background: rgba(34, 197, 94, 0.12);
  border: 1px solid rgba(34, 197, 94, 0.2);
  color: #15803d;
}

.creator-feed-creator-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.creator-feed-creator-cta {
  width: 100%;
  min-height: 42px;
  border-radius: var(--radius-md);
  background: var(--brand-primary);
  color: #fff;
}

.creator-feed-creator-cta:hover {
  background: var(--brand-primary-hover);
  color: #fff;
}

.creator-verification-dialog {
  position: fixed;
  inset: 0;
  z-index: 1080;
}

/* !important allowed: [hidden] must override modal display contracts. */
.creator-verification-dialog[hidden] {
  display: none !important;
}

.creator-verification-dialog-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.52);
}

.creator-verification-dialog-surface {
  position: relative;
  width: min(620px, calc(100vw - 32px));
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  margin: 40px auto;
  border-radius: 14px;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  
}

.creator-verification-dialog-card {
  width: 100%;
}

.creator-verification-dialog-head {
  display: flex;
  justify-content: flex-end;
  padding: 16px 16px 0;
}

.creator-verification-dialog-close {
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--bg-muted);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.creator-verification-workspace > * {
  min-width: 0;
}

.creator-verification-workspace {
  min-width: 0;
  width: 100%;
  padding: 0 24px 24px;
}

.creator-verification-mobile-header {
  display: none;
}

.creator-verification-copy h1 {
  margin: 0;
  font-size: var(--text-lead-size);
  line-height: 1.25;
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-verification-copy p {
  margin: 4px 0 0;
  max-width: 430px;
  font-size: var(--text-micro-size);
  line-height: 1.5;
  color: var(--text-secondary);
}

.creator-verification-panel--compact {
  gap: 14px;
}

.creator-verification-panel-top {
  display: flex;
  align-items: center;
}

.creator-verification-card {
  background: var(--bg-card);
  box-shadow: none;
}

.creator-verification-panel {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: var(--bg-card);
  box-shadow: none;
}

.creator-verification-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--text-meta-size);
  font-weight: 500;
}

.creator-verification-back:hover {
  color: var(--brand-primary);
  text-decoration: none;
}

.creator-verification-section-title {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.creator-verification-section-title strong {
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-verification-section-title small {
  font-size: var(--text-micro-size);
  color: var(--text-secondary);
}

.creator-verification-section-title--spaced {
  margin-top: 2px;
}

.creator-verification-form-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.creator-verification-form-grid--residence {
  margin-top: 2px;
}

.creator-verification-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
}

.creator-verification-field--full {
  grid-column: 1 / -1;
}

.creator-verification-field span {
  font-size: var(--text-micro-size);
  font-weight: 500;
  color: var(--text-primary);
}

.creator-verification-field input,
.creator-verification-field select {
  width: 100%;
  min-width: 0;
  height: 42px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
  padding: 0 12px;
  font-size: var(--text-body-size);
  font-weight: 400;
}

.creator-verification-date-field {
  position: relative;
  display: block;
}

.creator-verification-date-field .creator-verification-birthdate {
  padding-right: 42px;
  cursor: pointer;
}

.creator-verification-date-trigger {
  position: absolute;
  top: 50%;
  right: 10px;
  width: 24px;
  height: 24px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
}

.creator-verification-date-trigger:hover,
.creator-verification-date-trigger:focus {
  color: var(--brand-primary);
  outline: none;
}

.creator-verification-profile-media {
  position: relative;
  overflow: visible;
  margin-bottom: 54px;
  padding-bottom: 0;
}

.creator-verification-cover {
  position: relative;
  min-height: 172px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--border-color);
  background:
    linear-gradient(135deg, rgba(241, 245, 249, 0.96), rgba(248, 250, 252, 0.88)),
    var(--bg-muted);
}

.creator-verification-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(148, 163, 184, 0.12), transparent 56%);
  pointer-events: none;
}

.creator-verification-cover-upload {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  appearance: none;
  border-radius: inherit;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

.creator-verification-cover-upload::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.18);
  opacity: 0;
  transition: opacity 160ms ease;
  pointer-events: none;
}

.creator-verification-cover-upload__overlay {
  position: absolute;
  inset: 0;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-size: var(--text-micro-size);
  font-weight: 600;
  line-height: 1;
  opacity: 1;
  transition: opacity 160ms ease;
  pointer-events: none;
}

.creator-verification-cover-upload__control {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 13px;
  border-radius: var(--radius-pill);
  background: rgba(15, 23, 42, 0.68);
}

.creator-verification-cover:hover .creator-verification-cover-upload::before,
.creator-verification-cover-upload:focus-visible::before,
.creator-verification-cover:hover .creator-verification-cover-upload__overlay,
.creator-verification-cover-upload:focus-visible .creator-verification-cover-upload__overlay {
  opacity: 1;
}

.creator-verification-cover-upload:focus-visible {
  outline: 3px solid rgba(29, 78, 216, 0.34);
  outline-offset: -4px;
}

.creator-verification-avatar-wrap {
  position: absolute;
  left: 24px;
  bottom: -42px;
  z-index: 3;
  width: 88px;
  height: 88px;
  overflow: visible;
  pointer-events: auto;
}

.creator-verification-avatar {
  display: block;
  width: 88px;
  height: 88px;
  border-radius: var(--radius-pill);
  object-fit: cover;
  border: 4px solid var(--bg-card);
  
}

.creator-verification-avatar-upload {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  appearance: none;
  border-radius: var(--radius-pill);
  background: transparent;
  cursor: pointer;
}

.creator-verification-avatar-upload__overlay {
  position: absolute;
  inset: 24px;
  border-radius: var(--radius-pill);
  background: rgba(15, 23, 42, 0.38);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-lead-size);
  opacity: 1;
  transition: opacity 160ms ease;
  pointer-events: none;
}

.creator-verification-avatar-upload:hover .creator-verification-avatar-upload__overlay,
.creator-verification-avatar-upload:focus-visible .creator-verification-avatar-upload__overlay {
  opacity: 1;
}

.creator-verification-avatar-upload:focus-visible {
  outline: 3px solid rgba(29, 78, 216, 0.42);
  outline-offset: 3px;
}

#uploadCover,
#uploadAvatar {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.creator-verification-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.creator-verification-details {
  border-radius: 10px;
  border: 1px solid var(--border-color);
  background: var(--bg-muted);
  padding: 0 14px 14px;
}

.creator-verification-details summary {
  list-style: none;
  cursor: pointer;
  padding: 12px 0;
  font-size: var(--text-meta-size);
  font-weight: 600;
  color: var(--text-primary);
}

.creator-verification-details summary::-webkit-details-marker {
  display: none;
}

.creator-verification-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.creator-verification-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--text-meta-size);
  line-height: 1.5;
  color: var(--text-secondary);
}

.creator-verification-check input {
  margin-top: 2px;
}

.creator-verification-primary-btn {
  width: 100%;
  min-height: 42px;
  margin-top: 0;
  border-radius: var(--radius-sm);
}

.creator-verification-document-list {
  display: grid;
  gap: 8px;
}

.creator-verification-document-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  padding: 13px 14px;
  cursor: pointer;
}

.creator-verification-document-row.is-selected {
  border-color: rgba(29, 78, 216, 0.34);
  background: rgba(29, 78, 216, 0.08);
}

.creator-verification-document-copy {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: var(--text-body-size);
  color: var(--text-primary);
}

.creator-verification-document-control {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text-secondary);
}

.creator-verification-document-control input {
  width: 16px;
  height: 16px;
}

.creator-verification-extra-uploads {
  display: grid;
  gap: 10px;
}

.creator-verification-extra-uploads.is-hidden {
  display: none;
}

.creator-verification-compact-upload {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  padding: 12px 14px;
  background: var(--bg-card);
  cursor: pointer;
}

.creator-verification-compact-upload.is-hidden {
  display: none;
}

.creator-verification-compact-upload-meta {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.creator-verification-compact-upload-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.creator-verification-compact-upload-copy strong {
  font-size: var(--text-meta-size);
  font-weight: 600;
  color: var(--text-primary);
}

.creator-verification-compact-upload-copy small {
  font-size: var(--text-micro-size);
  line-height: 1.4;
  color: var(--text-secondary);
}

.creator-verification-compact-upload-action {
  flex-shrink: 0;
  font-size: var(--text-micro-size);
  font-weight: 600;
  color: var(--brand-primary);
}

.creator-verification-upload-preview {
  width: 42px;
  height: 42px;
  border-radius: 10px;
  object-fit: cover;
  border: 1px solid var(--border-color);
  background: var(--bg-muted);
}

.creator-verification-upload-preview.is-hidden {
  display: none;
}

.creator-verification-pending-shell {
  display: flex;
  justify-content: center;
}

.creator-verification-pending-card {
  background: var(--bg-card);
  
  text-align: center;
  width: min(340px, 100%);
  position: relative;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-color);
  padding: 24px 22px 20px;
}

.creator-verification-state-card {
  background: var(--bg-card);
  box-shadow: none;
  text-align: center;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  padding: 20px;
}

.creator-verification-pending-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--bg-muted);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.creator-verification-pending-icon {
  width: 58px;
  height: 58px;
  margin: 0 auto 14px;
  border-radius: var(--radius-pill);
  background: rgba(29, 78, 216, 0.12);
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-modal-title-size);
}

html[data-theme="dark"] .creator-feed-creator-cta {
  color: #fff;
}

html[data-theme="dark"] .creator-verification-dialog-backdrop {
  background: rgba(2, 6, 23, 0.72);
}

html[data-theme="dark"] .creator-verification-dialog-close,
html[data-theme="dark"] .creator-verification-pending-close {
  background: rgba(148, 163, 184, 0.12);
}

html[data-theme="dark"] .creator-verification-cover {
  background:
    linear-gradient(135deg, rgba(30, 41, 59, 0.96), rgba(15, 23, 42, 0.92)),
    var(--bg-muted);
}

html[data-theme="dark"] .creator-verification-cover-upload__control {
  background: rgba(2, 6, 23, 0.78);
}

/* !important allowed: datepicker plugin overlay must sit above the verification dialog. */
.creator-verification-dialog .datepicker-dropdown,
.creator-verification-dialog .datepicker {
  z-index: 1400 !important;
}

@media (max-width: 991.98px) {
  .creator-verification-dialog {
    display: none;
  }

  .creator-verification-mobile-header {
    display: flex;
    margin-bottom: 16px;
  }

  .creator-verification-workspace {
    padding: 0 16px 96px;
  }

  .creator-verification-copy h1 {
    font-size: var(--text-lead-size);
  }

  .creator-verification-details-grid,
  .creator-verification-form-grid {
    grid-template-columns: 1fr;
  }

  .creator-verification-panel,
  .creator-verification-state-card {
    padding: 0;
  }

  .creator-verification-pending-card {
    padding: 22px 18px 18px;
  }

  .creator-verification-back {
    display: none;
  }

  .creator-verification-profile-media {
    margin-bottom: 48px;
  }

  .creator-verification-cover {
    min-height: 156px;
  }

  .creator-verification-avatar-wrap {
    left: 16px;
    bottom: -34px;
  }

  .creator-verification-avatar {
    width: 78px;
    height: 78px;
  }
}

.creator-settings-feedback--error {
  padding: 12px 14px;
  background: rgba(239, 68, 68, 0.1);
  border: 1px solid rgba(239, 68, 68, 0.2);
  color: #dc2626;
}

html[data-theme="dark"] .creator-settings-feedback--success {
  color: #86efac;
}

html[data-theme="dark"] .creator-settings-feedback--error {
  color: #fca5a5;
}

html[data-theme="dark"] .creator-notification-settings-feedback--success {
  color: #86efac;
}

html[data-theme="dark"] .creator-notification-settings-feedback--error {
  color: #fca5a5;
}

.creator-settings-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}

.creator-settings-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 15px 0;
}

.creator-settings-field--full {
  grid-column: 1 / -1;
}

.creator-settings-field label {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-medium);
}

.creator-settings-input,
.creator-settings-field .select2-selection,
.creator-settings-social-control .select2-selection {
  width: 100%;
  min-height: 42px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-regular);
  padding: 0 12px;
  box-shadow: none;
}

.creator-settings-textarea {
  width: 100%;
  min-height: 110px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-regular);
  padding: 0 12px;
  box-shadow: none;
  padding-top: 12px;
  padding-bottom: 12px;
  resize: vertical;
  line-height: 1.45;
}
.subscribe-btn{
  width: 110px!important;
}

.creator-settings-select {
  width: 100%;
  min-height: 42px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-regular);
  padding: 0 12px;
  box-shadow: none;
  padding-right: 32px;
}

/* !important allowed: Select2 injects inline width on its generated container. */
.creator-settings-field .select2-container {
  width: 100% !important;
}

.creator-settings-field .select2-container--default .select2-selection--multiple {
  min-height: 42px;
  padding: 2px 8px;
}

.creator-settings-input:focus,
.creator-settings-select:focus,
.creator-settings-textarea:focus {
  outline: 0;
  border-color: #60a5fa;
  
}

.creator-settings-input[disabled],
.creator-settings-input[readonly] {
  background: rgba(148, 163, 184, 0.12);
  color: var(--text-secondary);
}

.creator-settings-input.is-invalid,
.creator-settings-select.is-invalid,
.creator-settings-textarea.is-invalid {
  border-color: #ef4444;
}

.creator-settings-helper,
.creator-settings-counter {
  color: var(--text-secondary);
  font-size: var(--text-body-size);
}

.creator-settings-field-footer {
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.creator-settings-field-error {
  display: none;
  margin: 0;
  color: #dc2626;
  font-size: var(--text-micro-size);
}

.creator-settings-field-error.is-visible {
  display: block;
}

.creator-settings-form-narrow {
  width: 100%;
  max-width: 680px;
}

.creator-settings-money-input,
.creator-settings-password-input {
  display: flex;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  min-height: 42px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  overflow: hidden;
}

.creator-settings-money-input > span,
.creator-settings-password-input > i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 12px;
  color: var(--text-secondary);
  background: rgba(148, 163, 184, 0.12);
}

.creator-settings-money-input .creator-settings-input,
.creator-settings-password-input .creator-settings-input {
  border: 0;
  min-height: 40px;
  background: transparent;
  box-shadow: none;
}

.creator-settings-password-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 12px;
  color: var(--text-secondary);
  background: rgba(148, 163, 184, 0.12);
  cursor: pointer;
}

.creator-settings-summary-grid {
  display: grid;
  gap: 12px;
}

.creator-settings-summary-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.creator-settings-summary-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.creator-settings-summary-item {
  padding: 14px 16px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: rgba(148, 163, 184, 0.06);
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.creator-settings-summary-label {
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-medium);
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.creator-settings-summary-item strong {
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
  color: var(--text-primary);
}

.creator-settings-link-list {
  display: grid;
  gap: 8px;
}

.creator-settings-link-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  text-decoration: none;
  color: var(--text-primary);
  background: rgba(148, 163, 184, 0.04);
}

.creator-settings-empty-state {
  min-height: 260px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 12px;
  padding: 24px;
}

.creator-settings-empty-state--compact {
  min-height: 220px;
}

.creator-settings-empty-state-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(59, 130, 246, 0.08);
  color: #2563eb;
  font-size: var(--text-subtitle-size);
}

.creator-settings-empty-state h3 {
  margin: 0;
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-empty-state p {
  margin: 0;
  max-width: 420px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

.creator-settings-save--link,
.creator-settings-save--inline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.creator-settings-inline-note {
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid rgba(245, 158, 11, 0.24);
  background: rgba(245, 158, 11, 0.08);
  color: #92400e;
  font-size: var(--text-meta-size);
}

.creator-settings-table-card {
  border: 1px solid var(--border-color);
  border-radius: 14px;
  overflow: hidden;
}

.creator-settings-table th,
.creator-settings-table td {
  vertical-align: middle;
  font-size: var(--text-meta-size);
}

.creator-settings-card .form-control,
.creator-settings-card .custom-select {
  min-height: 42px;
  border-radius: var(--radius-sm);
  border-color: var(--border-color);
  font-size: var(--text-meta-size);
}

.creator-settings-card textarea.form-control {
  min-height: 110px;
  border-radius: var(--radius-sm);
  border-color: var(--border-color);
  font-size: var(--text-meta-size);
}

.creator-settings-card .input-group-text {
  min-height: 42px;
  border-radius: var(--radius-sm);
  border-color: var(--border-color);
  font-size: var(--text-meta-size);
  background: rgba(148, 163, 184, 0.12);
  color: var(--text-secondary);
}

.creator-settings-card .alert {
  border-radius: var(--radius-md);
  font-size: var(--text-meta-size);
}

.creator-settings-card .custom-control {
  padding-left: 0;
}

.creator-settings-card .custom-control-label {
  width: 100%;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding-left: 58px;
  font-size: var(--text-meta-size);
  color: var(--text-primary);
}

.creator-settings-card .custom-control-label::before,
.creator-settings-card .custom-control-label::after {
  top: 50%;
  transform: translateY(-50%);
  left: 0;
}

.creator-settings-switch {
  min-height: 58px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  padding: 12px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.creator-settings-switch strong {
  display: block;
  font-size: var(--text-meta-size);
  color: var(--text-primary);
}

.creator-settings-switch span {
  display: block;
  margin-top: 2px;
  font-size: var(--text-micro-size);
  color: var(--text-secondary);
}

.creator-settings-switch-control {
  position: relative;
  width: 36px;
  height: 20px;
  flex: 0 0 auto;
  margin: 0;
}

.creator-settings-switch-control input {
  position: absolute;
  opacity: 0;
  inset: 0;
}

.creator-settings-switch-control span {
  position: absolute;
  inset: 0;
  border-radius: var(--radius-pill);
  background: rgba(148, 163, 184, 0.4);
  transition: background 0.2s ease;
}

.creator-settings-switch-control span::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--auth-surface-2);
  transition: transform 0.2s ease;
}

.creator-settings-switch-control input:checked + span {
  background: #2563eb;
}

.creator-settings-switch-control input:checked + span::after {
  transform: translateX(16px);
}

.creator-settings-socials {
  display: grid;
  gap: 10px;
}

.creator-settings-social-row {
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
}

.creator-settings-social-label {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-medium);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
}

.creator-settings-social-label i {
  width: 16px;
  text-align: center;
  color: var(--text-secondary);
}

.creator-settings-social-control {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.creator-settings-mobile-list-card {
  padding: 0;
  overflow: hidden;
}

.creator-settings-mobile-header {
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.creator-settings-mobile-profile-header {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.creator-settings-mobile-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--text-card-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-mobile-row,
.creator-settings-mobile-language-link {
  width: 100%;
  min-height: 50px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text-primary);
  text-decoration: none;
  border-bottom: 1px solid var(--border-color);
  background: transparent;
}

.creator-settings-mobile-row:last-child {
  border-bottom: 0;
}

.creator-settings-mobile-row--toggle .creator-feed-theme-toggle {
  margin-left: auto;
}

.creator-settings-mobile-language {
  margin: 0;
}

.creator-settings-mobile-language summary {
  list-style: none;
  cursor: pointer;
}

.creator-settings-mobile-language summary::-webkit-details-marker {
  display: none;
}

.creator-settings-mobile-language-list {
  border-top: 1px solid var(--border-color);
  background: rgba(148, 163, 184, 0.06);
}

.creator-settings-mobile-language-link small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-settings-mobile-language-link.is-active {
  background: rgba(59, 130, 246, 0.08);
}

html[data-theme="dark"] .creator-settings-save {
  background: #2563eb;
  color: #eff6ff;
}

html[data-theme="dark"] .creator-settings-mobile-language-list,
html[data-theme="dark"] .creator-settings-tab.is-active,
html[data-theme="dark"] .creator-settings-tab:hover {
  background: rgba(148, 163, 184, 0.12);
}

html[data-theme="dark"] .creator-settings-inline-note {
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(251, 191, 36, 0.24);
  color: #fcd34d;
}

@media (max-width: 991.98px) {
  .creator-settings-workspace {
    padding: 15px;
  }

  .creator-settings-desktop {
    display: none;
  }

  .creator-settings-mobile-header,
  .creator-settings-mobile-profile-header {
    display: flex;
  }

  .creator-settings-mobile,
  .creator-settings-section {
    display: none;
  }

  .creator-notification-settings-desktop {
    display: none;
  }

  .creator-notification-settings-mobile {
    display: block;
  }

  .creator-notification-settings-mobile-header {
    display: flex;
    margin-bottom: 12px;
  }

  .creator-notification-settings-workspace[data-mobile-view="list"] .creator-notification-settings-section {
    display: none;
  }

  .creator-notification-settings-workspace[data-mobile-view="channel"] .creator-notification-settings-section {
    display: block;
  }

  .creator-notification-settings-card {
    padding: 18px 16px;
  }

  .creator-notification-settings-actions--mobile {
    display: none;
  }

  .creator-notification-settings-section-intro--mobile {
    margin-bottom: 14px;
  }

  .creator-settings-workspace[data-mobile-settings-view="list"] .creator-settings-mobile {
    display: block;
  }

  .creator-settings-workspace[data-mobile-settings-view="profile"] .creator-settings-section {
    display: block;
  }

  .creator-settings-card {
    padding: 16px;
    border-radius: var(--radius-lg);
  }

  .creator-settings-cover {
    min-height: 164px;
  }

  .creator-settings-cover-menu {
    top: 10px;
    right: 10px;
  }

  .creator-settings-preview-body {
    grid-template-columns: 1fr;
    padding: 0 16px 16px;
    gap: 12px;
  }

  .creator-settings-avatar-wrap {
    margin-top: -34px;
    width: 84px;
  }

  .creator-settings-avatar {
    width: 80px;
    height: 80px;
  }
  

  .creator-settings-preview-copy {
    padding-top: 0;
  }

  .creator-settings-card-heading {
    display: none;
  }

  .creator-settings-form-grid {
    grid-template-columns: 1fr;
  }

  .creator-settings-summary-grid--two,
  .creator-settings-summary-grid--three {
    grid-template-columns: 1fr;
  }

  .creator-settings-social-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .creator-settings-social-label {
    min-height: auto;
  }

  .creator-settings-subcard-heading {
    margin-bottom: 14px;
  }

  .creator-settings-subcard-heading h2 {
    font-size: var(--text-card-title-size);
  }

  .creator-settings-restricted-user {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .creator-settings-restricted-user__profile {
    width: 100%;
  }

  .creator-settings-restricted-user__action {
    align-self: flex-start;
  }

  .creator-settings-form-actions {
    justify-content: stretch;
  }

  .creator-settings-form-actions .creator-settings-save {
    width: 100%;
  }

  .creator-settings-privacy-page-card .creator-settings-privacy-section-heading {
    margin-bottom: 14px;
  }

  .creator-settings-privacy-page-card .creator-settings-privacy-section-heading h2,
  .creator-settings-privacy-card .creator-settings-privacy-card-heading h2 {
    font-size: var(--text-card-title-size);
  }

  .creator-settings-privacy-page-card .creator-settings-login-sessions {
    padding: 12px;
  }

  .creator-settings-privacy-page-card .creator-settings-session-row {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: flex-start;
  }

  .creator-settings-privacy-page-card .creator-settings-session-badge {
    grid-column: 2;
    justify-self: start;
  }

  .creator-settings-privacy-page-card .creator-settings-session-copy strong,
  .creator-settings-privacy-page-card .creator-settings-session-copy small {
    white-space: normal;
  }

  .creator-settings-privacy-page-card .creator-settings-session-close,
  .creator-settings-privacy-page-card .creator-settings-delete-button {
    width: 100%;
  }

  .creator-settings-privacy-page-card .creator-settings-privacy-switch-row {
    align-items: center;
    gap: 10px;
  }

  .creator-settings-privacy-page-card .creator-settings-privacy-switch-copy label {
    overflow-wrap: anywhere;
  }

  .creator-settings-subscription-page {
    max-width: none;
  }

  .creator-settings-subscription-banner {
    align-items: flex-start;
    padding: 12px 14px;
  }

  .creator-settings-subscription-card .creator-settings-subcard-heading {
    padding-bottom: 14px;
  }

  .creator-settings-subscription-fields {
    gap: 20px;
  }

  .creator-settings-subscription-user-row {
    align-items: flex-start;
  }

  .creator-settings-subscription-user-row em {
    margin-left: 0;
    align-self: center;
  }

  .creator-settings-live-private-page {
    max-width: none;
  }

  .creator-settings-live-private-heading {
    padding-bottom: 14px;
  }

  .creator-settings-live-private-form {
    gap: 20px;
  }

  .creator-settings-live-private-switch-row {
    align-items: center;
  }

  .creator-settings-live-private-request-row {
    grid-template-columns: 1fr;
    align-items: flex-start;
    gap: 10px;
  }

  .creator-settings-live-private-request-meta {
    justify-content: flex-start;
  }

  .creator-settings-live-private-actions {
    justify-content: flex-start;
  }

  .creator-settings-shop-card .creator-settings-shop-heading {
    flex-direction: column;
    gap: 14px;
  }

  .creator-settings-shop-card .creator-settings-shop-heading__copy h2 {
    font-size: var(--text-card-title-size);
  }

  .creator-settings-shop-card .creator-settings-shop-filters {
    width: 100%;
    justify-content: stretch;
  }

  .creator-settings-shop-card .creator-settings-shop-filters label {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .creator-settings-shop-card .creator-settings-shop-filter {
    width: 100%;
    min-width: 0;
  }

  .creator-settings-shop-row,
  .creator-settings-shop-row--product {
    grid-template-columns: 1fr;
    align-items: flex-start;
    gap: 10px;
  }

  .creator-settings-shop-row__profile,
  .creator-settings-shop-row__user,
  .creator-settings-shop-row__meta {
    width: 100%;
  }

  .creator-settings-shop-card .creator-settings-shop-status {
    align-self: flex-start;
  }

  .creator-settings-shop-actions,
  .creator-settings-shop-product-actions {
    justify-content: flex-start;
  }

  .creator-feed-page--my-payments .creator-payments-card {
    padding: 16px;
    border-radius: var(--radius-lg);
  }

  .creator-feed-page--my-payments .creator-payments-heading {
    flex-direction: column;
    gap: 14px;
  }

  .creator-feed-page--my-payments .creator-payments-heading__copy h1 {
    font-size: var(--text-card-title-size);
  }

  .creator-feed-page--my-payments .creator-payments-filters {
    width: 100%;
    justify-content: stretch;
  }

  .creator-feed-page--my-payments .creator-payments-filter {
    width: 100%;
  }

  .creator-feed-page--my-payments .creator-payments-filter summary {
    width: 100%;
    min-width: 0;
  }

  .creator-feed-page--my-payments .creator-payments-filter__menu {
    right: auto;
    left: 0;
    width: 100%;
    min-width: 0;
  }

  .creator-feed-page--my-payments .creator-payments-table,
  .creator-feed-page--my-payments .creator-payments-table tbody,
  .creator-feed-page--my-payments .creator-payments-table tr,
  .creator-feed-page--my-payments .creator-payments-table td {
    display: block;
    width: 100%;
  }

  .creator-feed-page--my-payments .creator-payments-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }

  .creator-feed-page--my-payments .creator-payments-table tr {
    padding: 14px 0;
    border-bottom: 1px solid var(--border-color);
  }

  .creator-feed-page--my-payments .creator-payments-table tbody tr:last-child {
    border-bottom: 0;
  }

  .creator-feed-page--my-payments .creator-payments-table td {
    display: grid;
    grid-template-columns: minmax(108px, 0.42fr) minmax(0, 1fr);
    gap: 10px;
    border-bottom: 0;
    padding: 6px 0;
  }

  .creator-feed-page--my-payments .creator-payments-table td::before {
    content: attr(data-label);
    color: var(--text-secondary);
    font-size: var(--text-micro-size);
    font-weight: var(--creator-font-weight-semibold);
  }

  .creator-feed-page--my-payments .creator-payments-empty {
    min-height: 240px;
  }
}

[data-home-feed-header] > .home-feed-header-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 12px;
  width: 100%;
  min-width: 0;
  margin: 0;
}

[data-home-feed-header] {
  min-height: 56px;
  padding: 10px 12px;
  border-radius: 18px;
  
}

[data-home-feed-header] .home-feed-tabs {
  display: inline-flex;
  flex: 0 0 auto;
  width: auto;
  margin: 0;
  min-width: 186px;
  height: 46px;
  padding: 5px;
  gap: 0;
  border-radius: var(--radius-lg);
}

[data-home-feed-header] .creator-feed-tab {
  height: 36px;
  min-height: 36px;
  padding: 0 18px;
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  font-weight: 450;
}

[data-home-feed-header] .creator-feed-tab.is-active {
  
}

[data-home-feed-header] .home-feed-search-area {
  position: relative;
  display: block;
  flex: 1 1 0;
  width: 0;
  min-width: 0;
  margin: 0;
}

[data-home-feed-header] .home-feed-search {
  position: relative;
  display: block;
  width: 100%;
  min-width: 0;
  max-width: none;
  margin: 0;
}

[data-home-feed-header] .creator-feed-search-control {
  display: block;
  width: 100%;
  height: 46px;
  margin: 0;
  padding-left: 44px;
  padding-right: 18px;
  border-radius: var(--radius-lg);
  font-size: var(--text-card-title-size);
}

[data-home-feed-header] .creator-feed-search-icon {
  left: 16px;
  font-size: var(--text-lead-size);
}

[data-home-feed-header] .home-feed-search-toggle {
  display: none;
}

[data-home-feed-header] .home-feed-header-actions {
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  width: auto;
  margin: 0;
}

[data-home-feed-header] .home-feed-notification,
[data-home-feed-header] .creator-feed-theme-toggle,
[data-home-feed-header] .home-feed-theme-switcher button {
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  margin: 0;
  border-radius: var(--radius-pill);
}

@media (max-width: 1199.98px) {
  [data-home-feed-header] {
    padding: 8px 10px;
  }

  [data-home-feed-header] > .home-feed-header-row {
    gap: 10px;
  }

  [data-home-feed-header] .home-feed-tabs {
    min-width: 174px;
  }

  [data-home-feed-header] .creator-feed-tab {
    padding: 0 15px;
  }

  [data-home-feed-header] .creator-feed-search-control {
    padding-right: 14px;
  }
  .creator-feed-page--profile .creator-profile-post-list .creator-feed-post-card-body,
  .creator-feed-page--profile .creator-profile-post-list .creator-feed-post-copy-wrap,
  .creator-feed-post-card .creator-feed-post-copy-wrap, .creator-feed-post-card .card-body.pt-0.pb-3,
  .creator-feed-page--profile .creator-profile-post-list .creator-feed-post-footer{
      padding: 0 15px 15px 15px;
  }
  .creator-for-you-page .creator-feed-post-media-single,
.creator-for-you-page .creator-feed-post-gallery,
.creator-for-you-page .container-post-media {
  border-radius: 0!important;
}
}

@media (max-width: 768px) {
  .home-feed-header--desktop {
    display: none!important;
  }
  .creator-profile-identity-main{
    display: grid;
  }

  .auth-mobile-header {
    display: block;
  }

  .home-mobile-feed-tabs {
    display: block;
  }

  .creator-feed-page--home .creator-feed-composer-card {
    margin-bottom: 8px;
    padding: 10px 12px;
  }

  .creator-feed-page--home .creator-feed-composer-trigger {
    gap: 8px;
  }

  .creator-feed-page--home .creator-feed-composer-avatar-btn {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
  }
  .creator-feed-post-card .creator-feed-post-copy-wrap, .creator-feed-post-card .card-body.pt-0.pb-3{
    padding: 0 15px 15px 15px!important;
  }

  .creator-feed-page--home .creator-feed-composer-pill {
    min-height: 40px;
    padding: 0 14px;
    font-size: var(--text-meta-size);
  }

  .creator-post-composer-header {
    gap: 12px;
  }

  .creator-post-composer-author {
    gap: 10px;
  }

  .creator-post-composer-author-avatar,
  .creator-post-composer-body #formUpdateCreate .avatarUser {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  .creator-post-composer-body #formUpdateCreate textarea {
    min-height: 132px;
    font-size: var(--text-lead-size);
  }

  .creator-post-composer-body #formUpdateCreate .btn-post,
  .creator-post-composer-body #formUpdateCreate #dropdownMoreOptions,
  .creator-post-composer-body #formUpdateCreate #dropdownEmoji {
    width: 38px;
    height: 38px;
    border-radius: 11px;
  }

  .creator-feed-page--home .creator-feed-stories-card {
    padding: 6px 4px 6px 6px;
    margin-bottom: 8px;
  }

  .creator-feed-page--home .creator-feed-stories-wrapper {
    gap: 6px;
  }

  .creator-feed-page--home .creator-feed-empty-card,
  .creator-feed-page--home .creator-feed-topbar {
    margin-bottom: 8px;
  }

  .creator-feed-page--home .home-feed-header--desktop{
    display: none;
  }

  .creator-feed-page--home .creator-feed-notice-card {
    margin-bottom: 8px;
    border-radius: var(--radius-lg);
  }

  .creator-feed-page--home .creator-feed-feed-wrap .card-updates {
    margin-bottom: 8px;
    border-radius: var(--radius-lg);
  }
  .creator-feed-feed-wrap .card-updates.creator-feed-post-card, .creator-feed-page .card-updates.creator-feed-post-card{
      border-top: 0!important;
  }

  .creator-feed-page--home .creator-feed-card {
    margin-bottom: 8px;
    border-radius: var(--radius-lg);
    padding: 10px 12px;
  }

  .creator-feed-page--home .card-updates .card-body {
    padding: 15px!important;
  }

  .creator-feed-page--home .creator-feed-post-footer {
    padding: 8px 15px;
  }
  .creator-for-you-page .creator-user-for-you-discovery {
      padding: 8px 15px 20px 15px!important;
  }

  .creator-feed-page--home .creator-feed-post-actions-left {
    gap: 10px;
  }

  .creator-feed-mobile-nav {
    gap: 0;
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
  }

  .creator-feed-mobile-nav a,
  .creator-feed-mobile-nav button {
    min-height: 56px;
    padding: 6px 2px;
    border-radius: var(--radius-lg);
    gap: 3px;
    font-size: var(--text-micro-size);
  }

  .creator-feed-mobile-nav i {
    font-size: var(--text-section-title-size);
  }
   .auth-mobile-header__inner {
    padding: 10px 15px;
    margin-bottom: 10px;
  }
  .creator-feed-notifications-page{
      padding: 15px;
  }
    .creator-feed-page--profile .creator-profile-post-list .creator-feed-post-media-single,
.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-gallery {
  border-radius: 0;
}

  .creator-feed-page--profile .creator-profile-post-list .content-locked {
  border-radius: 0;
}


}

@media (max-width: 390px) {
  .creator-post-composer-body #formUpdateCreate .card-footer > .justify-content-between.align-items-center {
    gap: 8px;
  }

  .creator-post-composer-body #formUpdateCreate .btn-post,
  .creator-post-composer-body #formUpdateCreate #dropdownMoreOptions,
  .creator-post-composer-body #formUpdateCreate #dropdownEmoji {
    width: 32px;
    height: 32px;
    border-radius: 10px;
  }

  .creator-post-composer-body #formUpdateCreate #btnCreateUpdate {
    min-height: 40px;
  }
}

@media (max-width: 767.98px) {
  .creator-post-composer-modal {
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
  }

  .creator-post-composer-surface {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: none;
    height: 100dvh;
    min-height: 100dvh;
    max-height: 100dvh;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
  }

  .creator-post-composer-header {
    flex: 0 0 auto;
    align-items: center;
    gap: 12px;
    padding: 10px 12px 8px;
    border-bottom: 1px solid var(--border-color);
  }

  .creator-post-composer-author {
    gap: 10px;
  }

  .creator-post-composer-author-avatar,
  .creator-post-composer-body #formUpdateCreate .avatarUser {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
  }

  .creator-post-composer-author-copy strong {
    overflow: hidden;
    font-size: var(--text-control-size);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .creator-post-composer-author-copy span {
    font-size: var(--text-meta-size);
    line-height: 1.25;
  }

  .creator-post-composer-header-actions {
    align-self: flex-start;
    flex: 0 0 auto;
    gap: 6px;
  }

  .creator-post-composer-mode-pill {
    min-height: 26px;
    padding: 0 9px;
  }

  .creator-post-composer-close {
    width: 38px;
    height: 38px;
    border-radius: 10px;
  }

  .creator-post-composer-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    padding: 0;
  }

  .creator-post-composer-body #formUpdateCreate {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
  }

  .creator-post-composer-body #formUpdateCreate .card {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
  }

  .creator-post-composer-body #formUpdateCreate .card-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 14px 14px 10px !important;
    -webkit-overflow-scrolling: touch;
  }

  .creator-post-composer-body #formUpdateCreate .media {
    gap: 10px;
    min-width: 0;
    min-height: calc(100dvh - 277px);
    }
    .auth-mobile-drawer__content {
    height: calc(100dvh - 70px);
    overflow-y: auto !important;
    overflow-x: hidden;
    padding-bottom: 90px;
    -webkit-overflow-scrolling: touch;
  }

  .auth-mobile-drawer__content .creator-auth-sidebar {
    min-height: auto !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
  }

  .creator-post-composer-body #formUpdateCreate .media > .rounded-circle {
    flex: 0 0 42px;
    margin-right: 0 !important;
  }

  .creator-post-composer-body #formUpdateCreate .media-body {
    min-width: 0;
  }

  .creator-post-composer-body #formUpdateCreate textarea {
    min-height: 152px;
    height: auto;
    padding: 6px 0 8px;
    overflow: hidden;
    font-size: var(--text-lead-size);
    line-height: 1.45;
    vertical-align: top;
  }

  .creator-post-composer-content-fields {
    min-width: 0;
    margin-top: 6px;
  }

  .creator-post-composer-body #formUpdateCreate #previewImage,
  .creator-post-composer-body #formUpdateCreate #previewEpub {
    display: block;
    max-width: 100%;
  }

  .creator-post-composer-body #formUpdateCreate #previewImage img,
  .creator-post-composer-body #formUpdateCreate #previewImage video,
  .creator-post-composer-body #formUpdateCreate #previewEpub img,
  .creator-post-composer-body #formUpdateCreate #previewEpub video,
  .creator-post-composer-body #formUpdateCreate .fileuploader,
  .creator-post-composer-body #formUpdateCreate .fileuploader-items {
    max-width: 100%;
  }

  .creator-post-composer-existing-media__grid {
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
  }

  .creator-post-composer-existing-media__item img,
  .creator-post-composer-existing-media__item video {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }

  .creator-promoted-selection {
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  .creator-promoted-selection::-webkit-scrollbar {
    display: none;
  }

  .creator-promoted-selection__item {
    flex: 0 0 min(260px, calc(100vw - 40px));
    max-width: min(260px, calc(100vw - 40px));
  }

  .creator-post-composer-body #formUpdateCreate .card-footer {
    flex: 0 0 auto;
    padding: 8px 12px calc(10px + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid var(--border-color) !important;
    border-radius: 0 !important;
  }

  .creator-post-composer-body #formUpdateCreate .card-footer > .justify-content-between.align-items-center {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 8px;
    min-width: 0;
  }

  .creator-post-composer-toolbar {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 2px 2px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    justify-content: center;
  }

  .creator-post-composer-toolbar::-webkit-scrollbar {
    display: none;
  }

  .creator-post-composer-toolbar > * {
    flex: 0 0 auto;
  }

  .creator-post-composer-body #formUpdateCreate .btn-post,
  .creator-post-composer-body #formUpdateCreate #dropdownMoreOptions,
  .creator-post-composer-body #formUpdateCreate #dropdownEmoji {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 12px;
  }

  .creator-post-composer-body #formUpdateCreate #dropdownMoreOptionsWrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
  }

  .creator-post-composer-body #formUpdateCreate #dropdownEmojiWrap .dropdown-menu.show,
  .creator-post-composer-body #formUpdateCreate #dropdownMoreOptionsWrap .dropdown-menu.show {
    position: fixed !important;
    top: auto !important;
    right: 12px !important;
    bottom: calc(108px + env(safe-area-inset-bottom)) !important;
    left: 12px !important;
    max-width: none;
    max-height: min(320px, calc(100dvh - 170px));
    overflow: auto;
    transform: none !important;
  }

  .creator-post-composer-body #formUpdateCreate .d-inline-block.float-right.mt-3.mt-lg-1.position-relative.w-100-mobile {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    width: 100% !important;
    margin-top: 0 !important;
    margin-left: 0;
  }

  .creator-post-composer-body #formUpdateCreate .d-inline-block.float-right.mt-3.mt-lg-1.position-relative.w-100-mobile > span {
    display: block !important;
    width: 100% !important;
  }

  .creator-post-composer-body #formUpdateCreate #btnCreateUpdate {
    width: 100%;
    min-height: 46px;
    font-size: var(--text-body-size);
    background: var(--brand-primary);
    opacity: 1;
  }

  .creator-post-composer-body #formUpdateCreate #the-count {
    margin: 0 2px;
    line-height: 1;
  }
  #maximum{
    font-size: 16px;
  }
}

@media (max-width: 575.98px) {
  .auth-mobile-header__inner {
    padding: 10px 15px;
    margin-bottom: 8px;
  }

  .auth-mobile-header__top {
    gap: 8px;
  }

  .auth-mobile-header__logo img {
    height: 44px;
    max-width: 120px;
  }

  .auth-mobile-header__action,
  .auth-mobile-header__theme .creator-feed-theme-toggle {
    width: 34px;
    height: 34px;
    min-width: 34px;
    flex-basis: 34px;
    border-radius: 11px;
  }

  .auth-mobile-header__action i,
  .auth-mobile-header__theme .creator-feed-theme-toggle i {
    font-size: var(--text-body-size);
  }

  .auth-mobile-search-panel__form {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 6px;
    padding: 7px 8px;
  }

  .auth-mobile-search-panel__close {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-md);
  }

  .auth-mobile-search-panel__field .creator-feed-search-control {
    height: 42px;
    font-size: var(--text-meta-size);
  }

  .auth-mobile-search-panel__submit {
    grid-column: 1 / -1;
    width: 100%;
    height: 40px;
  }

  .home-mobile-feed-tabs__grid {
    height: 40px;
    padding: 2px;
  }

  .home-mobile-feed-tabs__item {
    height: 36px;
    padding: 0 8px;
    font-size: var(--font-size-sm);
  }

  .creator-feed-mobile-nav {
    padding-right: 6px;
    padding-left: 6px;
  }
}

@media (min-width: 992px) {
  .auth-mobile-header,
  .home-mobile-feed-tabs,
  .creator-mobile-header {
    display: none;
  }
}

.creator-campaigns-page,
.creator-campaign-detail-page {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}

.creator-campaign-surface-card {
  border: 1px solid color-mix(in srgb, var(--border-color) 88%, transparent);
  border-radius: var(--radius-lg);
  
  background: var(--bg-card);
}

.creator-campaign-toolbar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 54px;
  width: 100%;
  padding: 7px;
  border: 1px solid color-mix(in srgb, var(--border-color) 86%, transparent);
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  
}

.creator-campaign-toolbar__search {
  position: relative;
  display: flex;
  align-items: center;
  flex: 1 1 340px;
  gap: var(--space-2);
  min-width: 0;
  height: var(--control-height-md);
  padding: 0 13px;
  border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--bg-muted) 42%, var(--bg-card));
}

.creator-campaign-toolbar__search i {
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
}

.creator-campaign-toolbar__search input {
  width: 100%;
  height: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-campaign-toolbar__search input::placeholder {
  color: var(--text-secondary);
  opacity: 1;
}

.creator-campaign-toolbar__select {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 132px;
  min-width: 0;
  height: var(--control-height-md);
  padding: 0 10px;
  border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--bg-muted) 42%, var(--bg-card));
}

.creator-campaign-toolbar__select--time {
  flex-basis: 124px;
}

.creator-campaign-toolbar__select select {
  width: 100%;
  height: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  cursor: pointer;
  appearance: none;
  padding-right: 18px;
}

.creator-campaign-toolbar__select::after {
  content: '';
  position: absolute;
  right: 12px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid var(--text-secondary);
  border-bottom: 1.5px solid var(--text-secondary);
  transform: translateY(-68%) rotate(45deg);
  pointer-events: none;
}

.creator-campaign-toolbar__submit {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

.creator-campaign-toolbar__notification {
  position: relative;
  flex: 0 0 var(--control-height-md);
  width: var(--control-height-md);
  height: var(--control-height-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  border: 1px solid color-mix(in srgb, var(--border-color) 82%, transparent);
  color: var(--text-primary);
  text-decoration: none;
  background: color-mix(in srgb, var(--bg-muted) 42%, var(--bg-card));
}

.creator-campaign-toolbar__notification i {
  font-size: var(--text-card-title-size);
}

.creator-campaign-toolbar__notification span {
  position: absolute;
  top: 7px;
  right: 8px;
  min-width: 7px;
  height: 7px;
  border-radius: var(--radius-pill);
  background: #10b981;
  color: transparent;
}

.creator-campaign-toolbar__search:focus-within,
.creator-campaign-toolbar__select:focus-within,
.creator-campaign-toolbar__notification:focus-visible {
  border-color: color-mix(in srgb, var(--brand-primary) 48%, var(--border-color));
  
  outline: none;
}

.creator-campaigns-heading {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 2px;
}

.creator-campaigns-heading span,
.creator-campaign-bottom-kicker {
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: var(--leading-tight);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-campaigns-heading h1,
.creator-campaign-detail-copy h1 {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-page-title-size);
  line-height: var(--leading-tight);
  font-weight: var(--creator-font-weight-bold);
  letter-spacing: 0;
}

.creator-campaigns-heading h1 i {
  width: 8px;
  height: 8px;
  border-radius: var(--radius-pill);
  background: #10b981;
  
}

.creator-campaign-detail-copy p {
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.65;
}

.creator-campaign-apply-btn:hover,
.creator-campaign-apply-btn:focus-visible,
.creator-campaign-gate-action:hover,
.creator-campaign-gate-action:focus-visible {
  opacity: 0.96;
  
}

.creator-campaign-card-action:focus-visible,
.creator-campaign-back:focus-visible,
.creator-campaign-gate-close:focus-visible,
.creator-campaign-asset-row:focus-visible,
.creator-campaign-card-title:focus-visible,
.creator-campaign-card-media:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--brand-primary) 74%, #ffffff);
  outline-offset: 3px;
}

.creator-campaign-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  align-items: stretch;
}

.creator-campaign-detail-card,
.creator-campaign-summary-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.creator-campaign-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  border-radius: var(--radius-lg);
  overflow: hidden;
}

.creator-campaign-card-media {
  position: relative;
  display: block;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  overflow: hidden;
  background: var(--bg-muted);
  /*aspect-ratio: 1.7 / 1;*/
  height: 200px;
}

.creator-campaign-card-media img,
.creator-campaign-detail-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.creator-campaign-card-fallback,
.creator-campaign-detail-fallback {
  min-height: 124px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  background:
    radial-gradient(circle at top left, rgba(29, 78, 216, 0.18), transparent 42%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.04), rgba(15, 23, 42, 0.09));
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-campaign-detail-hero-media .creator-campaign-detail-fallback {
  min-height: inherit;
  height: 100%;
}

.creator-campaign-badge {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 5px 9px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.94);
  color: #0f172a;
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-semibold);
  
}

.creator-campaign-detail-copy {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.creator-campaign-card-body {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
  padding: 12px;
  flex: 1 1 auto;
  height: 192px;
}

.creator-campaign-brand {
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-campaign-card-title {
  color: var(--text-primary);
  text-decoration: none;
  font-size: var(--text-card-title-size);
  line-height: var(--leading-snug);
  font-weight: var(--creator-font-weight-semibold);
  letter-spacing: 0;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.creator-campaign-card-title:hover,
.creator-campaign-back:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-campaign-card-description {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: var(--leading-normal);
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.creator-campaign-metrics,
.creator-campaign-brand-row {
  display: flex;
  gap: var(--space-2);
  align-items: center;
}

.creator-campaign-metrics span,
.creator-campaign-hero-meta span,
.creator-campaign-application-pill {
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--bg-muted) 85%, transparent);
  border: 1px solid color-mix(in srgb, var(--border-color) 78%, transparent);
  padding: 6px 10px;
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1;
  white-space: nowrap;
}

.creator-campaign-application-pill.is-pending {
  color: #a16207;
  background: rgba(245, 158, 11, 0.12);
  border-color: rgba(245, 158, 11, 0.24);
}

.creator-campaign-application-pill.is-approved {
  color: #15803d;
  background: rgba(22, 163, 74, 0.1);
  border-color: rgba(22, 163, 74, 0.22);
}

.creator-campaign-application-pill.is-rejected {
  color: #dc2626;
  background: rgba(220, 38, 38, 0.1);
  border-color: rgba(220, 38, 38, 0.2);
}

.creator-campaign-application-pill.is-completed,
.creator-campaign-application-pill.is-cancelled {
  color: #475569;
  background: rgba(148, 163, 184, 0.14);
  border-color: rgba(148, 163, 184, 0.22);
}

.creator-campaign-platform-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 14px;
  border-radius: var(--radius-pill);
  background: var(--auth-surface-2);
  border: 1px solid var(--auth-border);
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 800;
}

.creator-campaign-platform-chip i {
  color: #00167a;
  font-size: 15px;
}

.creator-campaign-card .creator-campaign-brand-row--compact {
  flex-wrap: nowrap;
}

.creator-campaign-card .creator-campaign-brand-row--compact img,
.creator-campaign-card .creator-campaign-brand-row--compact .creator-campaign-brand-avatar-fallback {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  font-size: var(--text-meta-size);
}

.creator-campaign-card .creator-campaign-brand-copy {
  display: flex;
  gap: 1px;
  min-width: 0;
}

.creator-campaign-card .creator-campaign-brand-copy strong,
.creator-campaign-card .creator-campaign-brand-row strong {
  display: flex;
  align-items: center;
  gap: 4px;
  min-width: 0;
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  font-weight: var(--creator-font-weight-semibold);
  line-height: var(--leading-tight);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-campaign-card .creator-campaign-brand-copy strong i {
  flex: 0 0 auto;
  color: #d927ff;
  font-size: var(--text-micro-size);
}

.creator-campaign-card .creator-campaign-brand-copy small,
.creator-campaign-card .creator-campaign-brand-row small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: var(--leading-tight);
}

.creator-campaign-platforms {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  margin-left: auto;
  flex: 0 0 auto;
}

.creator-campaign-detail-section .creator-campaign-platforms {
  margin-left: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
}

.creator-campaign-platform-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: var(--radius-pill);
  color: var(--text-primary);
  background: color-mix(in srgb, var(--bg-muted) 72%, transparent);
  border: 1px solid color-mix(in srgb, var(--border-color) 70%, transparent);
}

.creator-campaign-platform-icon i {
  font-size: var(--text-micro-size);
}

.creator-campaign-finance {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-3);
  margin-top: auto;
}

.creator-campaign-finance div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}

.creator-campaign-finance div:last-child {
  text-align: right;
}

.creator-campaign-finance span,
.creator-campaign-footer-row small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: var(--leading-tight);
}

.creator-campaign-finance strong {
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: var(--leading-tight);
  font-weight: var(--creator-font-weight-bold);
  white-space: nowrap;
}

.creator-campaign-finance em {
  color: var(--text-secondary);
  font-style: normal;
  font-weight: 500;
}

.creator-campaign-progress {
  width: 100%;
  height: 5px;
  overflow: hidden;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--border-color) 72%, transparent);
}

.creator-campaign-progress span {
  display: block;
  height: 100%;
  min-width: 4px;
  border-radius: inherit;
  background: #2563eb;
}

.creator-campaign-footer-row {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  justify-content: space-between;
  min-height: 24px;
  margin-top: auto;
}

.creator-campaign-participants {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
}

.creator-campaign-participants i {
  font-size: var(--text-micro-size);
}

.creator-campaign-card-actions {
  display: flex;
  margin-top: auto;
  padding: 0 12px 12px;
}

.creator-campaign-card-action {
  display: inline-flex;
  width: 100%;
  justify-content: center;
  min-height: 34px;
  align-items: center;
  text-decoration: none;
  border-radius: var(--radius-md);
  font-size: var(--text-meta-size);
}

.creator-campaign-empty-state {
  align-items: center;
  justify-content: center;
  min-height: 240px;
  padding: 28px;
  text-align: center;
  grid-column: 1 / -1;
}

.creator-campaign-empty-state h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-campaign-empty-state p {
  max-width: 420px;
  margin: 8px auto 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.65;
}

.creator-campaign-clear-search {
  margin-top: 14px;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
}

.creator-campaign-pagination .pagination {
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}

.creator-campaign-pagination .page-link {
  min-width: 40px;
  min-height: 40px;
  border-radius: var(--radius-md);
  border-color: var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
}

.creator-campaign-pagination .page-item.active .page-link {
  background: var(--brand-primary);
  border-color: var(--brand-primary);
  color: #fff;
}

.creator-campaign-pagination .page-item.disabled .page-link {
  opacity: 0.58;
}

.creator-campaign-pagination {
  margin-top: auto;
  display: flex;
  justify-content: center;
}

.creator-feed-page--campaign-details .creator-feed-shell-main {
  max-width: 1180px;
}

.creator-campaign-detail-layout {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  gap: 24px;
}

.creator-campaign-detail-hero {
  position: relative;
  overflow: hidden;
  padding: 0;
  min-height: 360px;
  border: 0;
  background: transparent;
}

.creator-campaign-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 13px;
  border-radius: var(--radius-pill);
  background: rgba(15, 23, 42, 0.42);
  color: #fff;
  text-decoration: none;
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-bold);
  width: fit-content;
  position: relative;
  z-index: 2;
  backdrop-filter: blur(8px);
}

.creator-campaign-brand-row img,
.creator-campaign-brand-avatar-fallback {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-muted);
  color: var(--text-primary);
  font-weight: var(--creator-font-weight-bold);
}

.creator-campaign-brand-row--compact img,
.creator-campaign-brand-row--compact .creator-campaign-brand-avatar-fallback {
  width: 40px;
  height: 40px;
  font-size: var(--text-card-title-size);
}

.creator-campaign-brand-copy {
  display: flex;
  gap: 2px;
  min-width: 0;
}

.creator-campaign-brand-copy strong,
.creator-campaign-brand-row strong {
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: var(--creator-font-weight-semibold);
}

.creator-campaign-brand-copy small,
.creator-campaign-brand-row small {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
}

.creator-campaign-hero-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 8px;
  justify-content: flex-end;
}

.creator-campaign-hero-meta .creator-campaign-meta-chip {
  background: rgba(255, 255, 255, 0.14);
  border-color: rgba(255, 255, 255, 0.16);
  color: #eff6ff;
  backdrop-filter: blur(8px);
}

.creator-campaign-detail-hero-media {
  position: relative;
  display: block;
  min-height: 360px;
  border-radius: 0 0 28px 28px;
  overflow: hidden;
  background: var(--bg-muted);
  aspect-ratio: 3 / 1;
}

.creator-campaign-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(15, 23, 42, 0.26) 0%, rgba(15, 23, 42, 0.06) 44%, rgba(15, 23, 42, 0.76) 100%),
    linear-gradient(90deg, rgba(15, 23, 42, 0.34), transparent 58%);
  z-index: 1;
}

.creator-campaign-hero-top {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 26px 30px;
  top: 0;
}

.creator-campaign-hero-bottom {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  padding: 28px 30px;
  bottom: 0;
}

.creator-campaign-hero-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.9);
  color: var(--text-primary);
  font-size: var(--text-micro-size);
  font-weight: var(--creator-font-weight-bold);
  backdrop-filter: blur(8px);
}

.creator-campaign-brand-row--hero {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
}

.creator-campaign-brand-row--hero strong {
  color: inherit;
  font-size: 18px;
  font-weight: 800;
}

.creator-campaign-brand-row--hero small {
  color: inherit;
  opacity: 0.8;
}

.creator-campaign-detail-title {
  margin: 0;
  color: var(--text-primary);
  font-size: 24px;
  line-height: 1.16;
  font-weight: 800;
  letter-spacing: 0;
}

.creator-campaign-detail-panel {
  display: grid;
  padding: 0;
  gap: 22px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.creator-campaign-detail-section {
  display: grid;
  gap: 16px;
  padding: 24px;
  border: 1px solid var(--auth-border);
  border-radius: 20px;
  background: var(--auth-surface-2);
}

.creator-campaign-detail-section--summary {
  padding: 0;
  border: 0;
  background: transparent;
}

.creator-campaign-detail-section--platforms {
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
}

.creator-campaign-detail-section--platforms .creator-campaign-platform-chip {
  min-height: 38px;
}

.creator-campaign-detail-section--guidelines {
  padding: 0;
  border: 0;
  background: transparent;
}

.creator-campaign-detail-section--about,
.creator-campaign-detail-section--requirements {
  gap: 14px;
}

.creator-campaign-metric-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.creator-campaign-metric-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
  min-height: 168px;
  padding: 22px;
  border-radius: 18px;
  border: 1px solid var(--auth-border);
  background: var(--auth-surface-2);
}

.creator-campaign-metric-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #eef4ff;
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}

.creator-campaign-metric-card span,
.creator-campaign-section-heading {
  display: block;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  text-transform: uppercase;
  letter-spacing: 0;
  font-weight: 800;
}

.creator-campaign-metric-card strong,
.creator-campaign-bottom-cta strong {
  color: var(--text-primary);
  font-size: 16px;
  line-height: 1.18;
  margin-top: 0;
  display: block;
  font-weight: 500;
}

.creator-campaign-metric-card small {
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.creator-campaign-metric-progress {
  height: 6px;
  margin-top: 6px;
  border-radius: var(--radius-pill);
  overflow: hidden;
  background: #FF8D28;
}

.creator-campaign-metric-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--brand-primary);
}

.creator-campaign-detail-card h2,
.creator-campaign-summary-card h2,
.creator-campaign-guidelines-head h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 20px;
  font-weight: 800;
}

.creator-campaign-detail-list,
.creator-campaign-requirements {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.creator-campaign-detail-list li {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 0;
  border-top: 1px solid var(--auth-border);
}

.creator-campaign-detail-list li:first-child {
  padding-top: 0;
  border-top: 0;
}

.creator-campaign-detail-list li:last-child {
  padding-bottom: 0;
}

.creator-campaign-detail-list li span {
  color: var(--text-secondary);
  font-size: 15px;
  line-height: 1.5;
}

.creator-campaign-detail-list li strong {
  color: var(--text-primary);
  font-size: 15px;
  line-height: 1.5;
  text-align: right;
  font-weight: 500;
}

.creator-campaign-submission-history-list {
  display: grid;
  gap: 10px;
}

.creator-campaign-submission-history-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 14px 0;
  border-top: 1px solid var(--auth-border);
}

.creator-campaign-submission-history-item:first-child {
  padding-top: 0;
  border-top: 0;
}

.creator-campaign-submission-history-item a {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  color: var(--brand-primary);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-campaign-submission-history-item small,
.creator-campaign-submission-history-item p {
  display: block;
  margin: 4px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.creator-campaign-submission-history-meta {
  display: grid;
  justify-items: end;
  gap: 4px;
  min-width: 86px;
}

.creator-campaign-submission-history-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: var(--radius-pill);
  background: var(--auth-accent-soft);
  color: var(--text-primary);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.creator-campaign-submission-history-meta strong {
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 800;
}

.creator-campaign-requirements li {
  display: flex;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--brand-primary) 74%;
  color: #fff;
  font-size: 14px;
  line-height: 1.58;
  align-items: center;
}

.creator-campaign-requirements i {
  color: var(--text-primary);
  margin-top: 1px;
  font-size: 12px;
  flex: 0 0 auto;
}

.creator-campaign-rich-copy {
  margin: 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.7;
  display: grid;
  gap: 12px;
  max-width: 880px;
}

.creator-campaign-rich-copy p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 16px;
  line-height: 1.7;
}

.creator-campaign-asset-list {
  display: grid;
  gap: 10px;
}

.creator-campaign-asset-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  border-radius: 16px;
  border: 1px solid rgba(59, 130, 246, 0.2);
  padding: 14px 16px;
  text-decoration: none;
  color: #fff;
  background: var(--brand-primary) 74%;
  transition: border-color 0.18s ease, transform 0.18s ease, background 0.18s ease;
}

.creator-campaign-guidelines-panel {
  display: grid;
  gap: 16px;
  padding: 24px;
  border-radius: 20px;
  border: 1px solid rgba(59, 130, 246, 0.2);
  background: #eff6ff;
}

.creator-campaign-guidelines-head {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.creator-campaign-guidelines-head p {
  margin: 6px 0 0;
  color: #334155;
  font-size: 14px;
  line-height: 1.55;
}

.creator-campaign-guidelines-icon {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border-radius: var(--radius-md);
  background: rgba(29, 78, 216, 0.14);
  color: #1d4ed8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-section-title-size);
}

.creator-campaign-asset-row small {
  display: block;
  color: #fff;
}

.creator-campaign-bottom-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 24px;
  align-items: center;
  padding: 24px;
  border-radius: 20px;
  border: 1px solid var(--auth-border);
  background: var(--auth-surface-2);
}

.creator-campaign-bottom-kicker {
  margin-bottom: 6px;
}

.creator-campaign-bottom-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.creator-campaign-apply-btn {
  min-width: 210px;
  min-height: 54px;
  justify-content: center;
  text-decoration: none;
  border-radius: 14px;
  gap: 8px;
}

.creator-campaign-bottom-cta .creator-campaign-apply-btn:not(:disabled)::after {
  content: "\2192";
  font-size: 16px;
  line-height: 1;
}

.creator-campaign-secondary-action {
  min-height: 44px;
  border-radius: 13px;
}

.creator-campaign-chat-action {
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none;
}

.creator-campaign-gate-modal {
  position: fixed;
  inset: 0;
  z-index: 1090;
}

/* !important allowed: [hidden] must override campaign modal display contracts. */
.creator-campaign-gate-modal[hidden] {
  display: none !important;
}

.creator-campaign-gate-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.52);
}

.creator-campaign-gate-surface {
  position: relative;
  width: min(340px, calc(100vw - 28px));
  margin: min(18vh, 132px) auto 0;
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  
  padding: 18px 18px 18px;
  text-align: center;
}

.creator-campaign-gate-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 30px;
  height: 30px;
  border-radius: var(--radius-pill);
  border: 0;
  background: var(--bg-muted);
  color: var(--text-primary);
}

.creator-campaign-gate-icon {
  width: 56px;
  height: 56px;
  margin: 8px auto 14px;
  border-radius: 50%;
  border: 2px solid rgba(220, 38, 38, 0.24);
  color: #dc2626;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-modal-title-size);
}

.creator-campaign-gate-surface h3 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  line-height: 1.35;
}

.creator-campaign-gate-copy {
  margin: 10px 0 16px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.55;
}

.creator-campaign-gate-action {
  width: 100%;
  justify-content: center;
}

.campaigner-verification-modal {
  position: fixed;
  inset: 0;
  z-index: 1093;
}

/* !important allowed: [hidden] must override verification modal display contracts. */
.campaigner-verification-modal[hidden],
.campaigner-verification-modal__form[hidden],
.campaigner-verification-pending[hidden] {
  display: none !important;
}

.campaigner-verification-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.62);
}

.campaigner-verification-modal__surface {
  position: relative;
  width: min(744px, calc(100vw - 40px));
  max-height: calc(100vh - 48px);
  margin: 24px auto;
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
  overflow: hidden;
}

.campaigner-verification-modal__form {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 48px);
}

.campaigner-verification-modal__header {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 28px 32px 16px;
}

.campaigner-verification-modal__badge {
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-pill);
  color: #0500ff;
  background: rgba(5, 0, 255, 0.08);
  font-size: 18px;
}

.campaigner-verification-modal__headline {
  min-width: 0;
  flex: 1;
}

.campaigner-verification-modal__header h2,
.campaigner-verification-pending h2 {
  margin: 0;
  color: var(--brand-primary);
  font-size: var(--text-page-title-size);
  line-height: 1.25;
  font-weight: 600;
}

.campaigner-verification-modal__header p {
  margin: 7px 0 0;
  color: var(--auth-text-primary);
  font-size: var(--text-body-size);
  line-height: 1.45;
  font-weight: 400;
  text-transform: capitalize;
}

.campaigner-verification-modal__close {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border: 0;
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-section-title-size);
}

.campaigner-verification-modal__body {
  display: grid;
  gap: 16px;
  padding: 0 32px 20px;
  overflow-y: auto;
}

.campaigner-verification-modal__errors {
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-size: var(--text-body-size);
  line-height: 1.45;
  background: rgba(220, 38, 38, 0.1);
  color: #b91c1c;
}

.campaigner-verification-modal__card {
  display: grid;
  gap: 17px;
  border: 1px solid var(--border-color);
  border-radius: 10px;
  padding: 22px;
  background: var(--bg-card);
}

.campaigner-verification-modal__card h3 {
  margin: 0 0 2px;
  color: var(--text-primary);
  font-size: var(--font-size-md);
  line-height: 1.3;
  font-weight: 500;
}

.campaigner-verification-modal__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 20px;
  row-gap: 17px;
}

.campaigner-verification-modal__field {
  display: grid;
  gap: 8px;
  margin: 0;
}

.campaigner-verification-modal__field > span:first-child {
  color: var(--text-primary);
  font-size: var(--font-size-sm);
  line-height: 1.35;
  font-weight: 500;
}

.campaigner-verification-modal__field input,
.campaigner-verification-modal__field select {
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1.45;
  min-height: 48px;
  padding: 0 15px;
}

.campaigner-verification-modal__field select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--text-secondary) 50%),
    linear-gradient(135deg, var(--text-secondary) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 18px,
    calc(100% - 13px) 18px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 34px;
}

.campaigner-verification-modal__file-row {
  position: relative;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--border-color);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  padding: 0 15px;
  cursor: pointer;
  overflow: hidden;
}

.campaigner-verification-modal__file-row:focus-within {
  border-color: rgba(5, 0, 255, 0.65);
  box-shadow: 0 0 0 3px rgba(5, 0, 255, 0.12);
}

.campaigner-verification-modal__file-row input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.campaigner-verification-modal__file-row small {
  min-width: 0;
  flex: 1;
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.campaigner-verification-modal__file-row i {
  flex: 0 0 auto;
  color: var(--text-primary);
  font-size: 18px;
  pointer-events: none;
}

.campaigner-verification-modal__checkbox {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin: 2px 0 0;
  color: var(--text-primary);
  font-size: var(--font-size-sm);
  line-height: 1.4;
  font-weight: 500;
}

.campaigner-verification-modal__checkbox input {
  width: 18px;
  height: 18px;
  margin-top: 1px;
}

.campaigner-verification-modal__notice {
  border-radius: 10px;
  background: rgba(59, 130, 246, 0.08);
  color: var(--text-primary);
  padding: 14px 15px;
  font-size: var(--font-size-sm);
  font-weight: 500;
  line-height: 1.35;
  text-align: center;
}

.campaigner-verification-modal__notice--warning {
  background: rgba(245, 158, 11, 0.14);
}

.campaigner-verification-modal__footer {
  padding: 0 32px 28px;
  background: var(--bg-card);
}

.campaigner-verification-modal__footer button,
.campaigner-verification-pending > button:last-child {
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 10px;
  background: var(--brand-primary);
  color: #fff;
  font-size: var(--font-size-sm);
  font-weight: 500;
}

.campaigner-verification-modal__footer button:disabled {
  opacity: 0.62;
}

.campaigner-verification-pending {
  position: relative;
  min-height: 280px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: 44px 34px 34px;
  text-align: center;
}

.campaigner-verification-pending__close {
  position: absolute;
  top: 14px;
  right: 14px;
}

.campaigner-verification-pending p {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  line-height: 1.35;
  font-weight: 800;
}

.campaigner-verification-pending span {
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.45;
  font-weight: 700;
}

.campaigner-verification-pending > button:last-child {
  margin-top: 12px;
}

html[data-theme="dark"] .campaigner-verification-modal__backdrop {
  background: rgba(0, 0, 0, 0.7);
}

html[data-theme="dark"] .campaigner-verification-modal__badge {
  background: rgba(96, 165, 250, 0.16);
  color: #93c5fd;
}

html[data-theme="dark"] .campaigner-verification-modal__notice {
  background: rgba(96, 165, 250, 0.14);
}

html[data-theme="dark"] .campaigner-verification-modal__notice--warning {
  background: rgba(245, 158, 11, 0.16);
}

.campaign-submission-modal {
  position: fixed;
  inset: 0;
  z-index: 1092;
}

/* !important allowed: [hidden] must override submission modal display contracts. */
.campaign-submission-modal[hidden] {
  display: none !important;
}

.campaign-submission-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.62);
}

.campaign-submission-modal__surface {
  position: relative;
  width: min(520px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  margin: 24px auto;
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  color: var(--text-primary);
  border: 1px solid var(--border-color);
  
  overflow: hidden;
}

.campaign-submission-modal__form {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 48px);
}

.campaign-submission-modal__header {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 22px 24px 14px;
}

.campaign-submission-modal__title-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  min-width: 0;
}

.campaign-submission-modal__title-row h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-page-title-size);
  line-height: 1.25;
  font-weight: 800;
}

.campaign-submission-modal__title-row span {
  min-width: 0;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.campaign-submission-modal__header p {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.35;
  font-weight: 600;
}

.campaign-submission-modal__close {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border: 0;
  border-radius: var(--radius-pill);
  background: transparent;
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-section-title-size);
}

.campaign-submission-modal__body {
  display: grid;
  gap: 13px;
  padding: 0 24px 18px;
  overflow-y: auto;
}

.campaign-submission-modal__errors {
  border-radius: var(--radius-md);
  padding: 12px 14px;
  font-size: var(--text-body-size);
  line-height: 1.45;
  background: rgba(220, 38, 38, 0.1);
  color: #b91c1c;
}

.campaign-submission-modal__field {
  display: grid;
  gap: 6px;
  margin: 0;
}

.campaign-submission-modal__field span {
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  line-height: 1.35;
  font-weight: 700;
}

.campaign-submission-modal__field input {
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1.45;
  min-height: 43px;
  padding: 0 13px;
}

.campaign-submission-modal__field select {
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1.45;
  min-height: 43px;
  padding: 0 13px;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--text-secondary) 50%),
    linear-gradient(135deg, var(--text-secondary) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 18px,
    calc(100% - 13px) 18px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  padding-right: 34px;
}

.campaign-submission-modal__field textarea {
  width: 100%;
  border: 1px solid var(--border-color);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  line-height: 1.45;
  resize: vertical;
  min-height: 78px;
  padding: 11px 13px;
}

.campaign-submission-modal__proof {
  position: relative;
  display: grid;
  gap: 10px;
}

.campaign-submission-modal__proof-upload {
  width: 100%;
  min-height: 43px;
  border: 1px dashed var(--border-color);
  border-radius: 9px;
  background: var(--bg-input);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: var(--text-card-title-size);
  font-weight: 700;
}

.campaign-submission-modal__proof-upload i {
  color: var(--text-secondary);
}

.campaign-submission-modal__proof-preview {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid var(--border-color);
  border-radius: 9px;
  padding: 10px;
  background: var(--bg-input);
}

.campaign-submission-modal__proof-preview[hidden] {
  display: none;
}

.campaign-submission-modal__proof-preview img,
.campaign-submission-modal__proof-preview video {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 7px;
  background: var(--bg-page);
}

.campaign-submission-modal__proof-preview img[hidden],
.campaign-submission-modal__proof-preview video[hidden] {
  display: none;
}

.campaign-submission-modal__proof-preview strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
}

.campaign-submission-modal__proof-preview small,
.campaign-submission-modal__proof-help {
  display: block;
  margin-top: 3px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

.campaign-submission-modal__proof-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.campaign-submission-modal__proof-actions button {
  border: 0;
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 0 10px;
  font-size: var(--text-meta-size);
  font-weight: 700;
}

.campaign-submission-modal__proof-file {
  display: none;
}

.campaign-submission-modal__estimate {
  display: grid;
  gap: 3px;
  border-radius: 10px;
  background: rgba(34, 197, 94, 0.09);
  color: var(--text-primary);
  padding: 11px 13px;
}

.campaign-submission-modal__estimate[hidden] {
  display: none;
}

.campaign-submission-modal__estimate span {
  font-size: var(--text-meta-size);
  font-weight: 700;
}

.campaign-submission-modal__estimate strong {
  font-size: 20px;
  line-height: 1.2;
}

.campaign-submission-modal__estimate small {
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.35;
}

.campaign-submission-modal__notice {
  border-radius: 10px;
  background: rgba(59, 130, 246, 0.08);
  color: var(--text-primary);
  padding: 12px 13px;
  font-size: var(--text-meta-size);
  font-weight: 700;
  line-height: 1.35;
}

.campaign-submission-modal__footer {
  padding: 0 24px 24px;
  background: var(--bg-card);
}

.campaign-submission-modal__footer button {
  width: 100%;
  min-height: 48px;
  border: 0;
  border-radius: 10px;
  background: var(--brand-primary);
  color: #fff;
  font-size: var(--text-card-title-size);
  font-weight: 800;
}

.campaign-submission-modal__footer button:disabled {
  opacity: 0.62;
}

html[data-theme="dark"] .campaign-submission-modal__backdrop {
  background: rgba(0, 0, 0, 0.7);
}

html[data-theme="dark"] .campaign-submission-modal__notice {
  background: rgba(96, 165, 250, 0.14);
}

@media (max-width: 575.98px) {
  .campaigner-verification-modal__surface {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 24px);
    margin: 12px auto;
    border-radius: var(--radius-lg);
  }

  .campaigner-verification-modal__form {
    max-height: calc(100vh - 24px);
  }

  .campaigner-verification-modal__header,
  .campaigner-verification-modal__body,
  .campaigner-verification-modal__footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  .campaigner-verification-modal__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 15px;
  }

  .campaigner-verification-modal__card {
    padding: 17px;
  }

  .campaigner-verification-modal__header {
    gap: 10px;
  }

  .campaigner-verification-modal__badge {
    width: 30px;
    height: 30px;
    font-size: 16px;
  }

  .campaigner-verification-modal__header h2,
  .campaigner-verification-pending h2 {
    font-size: var(--text-subtitle-size);
  }

  .campaigner-verification-pending {
    min-height: 240px;
    padding: 42px 18px 22px;
  }

  .campaign-submission-modal__surface {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 24px);
    margin: 12px auto;
    border-radius: var(--radius-lg);
  }

  .campaign-submission-modal__form {
    max-height: calc(100vh - 24px);
  }

  .campaign-submission-modal__header,
  .campaign-submission-modal__body,
  .campaign-submission-modal__footer {
    padding-left: 16px;
    padding-right: 16px;
  }

  .campaign-submission-modal__title-row {
    display: block;
  }

  .campaign-submission-modal__title-row h2 {
    font-size: var(--text-subtitle-size);
  }

  .campaign-submission-modal__title-row span {
    display: block;
    margin-top: 3px;
  }
}

html[data-theme="dark"] .creator-campaign-surface-card {
  
}

html[data-theme="dark"] .creator-campaign-badge {
  background: rgba(15, 23, 42, 0.88);
  color: #f8fafc;
}

html[data-theme="dark"] .creator-campaign-gate-backdrop {
  background: rgba(2, 6, 23, 0.74);
}

html[data-theme="dark"] .creator-campaign-card-fallback,
html[data-theme="dark"] .creator-campaign-detail-fallback {
  background:
    radial-gradient(circle at top left, rgba(96, 165, 250, 0.16), transparent 44%),
    linear-gradient(145deg, rgba(15, 23, 42, 0.92), rgba(30, 41, 59, 0.88));
}

html[data-theme="dark"] .creator-campaign-guidelines-panel {
  border-color: rgba(96, 165, 250, 0.18);
  background: linear-gradient(180deg, rgba(30, 64, 175, 0.18), rgba(15, 23, 42, 0.5));
}

html[data-theme="dark"] .creator-campaign-guidelines-head p {
  color: #cbd5e1;
}

html[data-theme="dark"] .creator-campaign-hero-badge {
  background: rgba(15, 23, 42, 0.82);
  color: #f8fafc;
}

html[data-theme="dark"] .creator-campaign-application-pill.is-completed,
html[data-theme="dark"] .creator-campaign-application-pill.is-cancelled {
  color: #cbd5e1;
}

@media (min-width: 992px) and (max-width: 1099.98px) {
  .creator-campaign-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .creator-campaign-detail-hero {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .creator-campaign-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-campaign-toolbar {
    flex-wrap: wrap;
  }

  .creator-campaign-toolbar__search {
    /*flex-basis: 100%;*/
  }

  .creator-campaign-toolbar__select, .creator-campaign-toolbar__search {
    flex: 1 1 0;
  }

  .creator-campaign-toolbar__notification {
    margin-left: auto;
  }

  .creator-campaign-bottom-cta {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .creator-campaign-bottom-actions,
  .creator-campaign-bottom-actions form {
    width: 100%;
  }

  .creator-campaign-apply-btn,
  .creator-campaign-bottom-actions .creator-feed-secondary-btn {
    width: 100%;
  }

  .creator-campaign-detail-layout {
    max-width: 100%;
  }

  .creator-campaign-detail-panel {
    padding: 0;
  }

  .creator-campaign-metric-grid {
    grid-template-columns: 1fr;
  }

  .creator-campaign-detail-hero-media {
    min-height: 280px;
    aspect-ratio: 16 / 8;
  }

  .creator-campaign-hero-bottom {
    flex-direction: column;
    align-items: flex-start;
  }
   .creator-campaigns-page,
  .creator-campaign-detail-page {
      padding: 15px!important;
  }
  .creator-campaigns-page .creator-feed-card{
      padding: 0 0 15px 0;
  }
}

@media (max-width: 575.98px) {
  .creator-campaigns-page,
  .creator-campaign-detail-page {
    gap: 18px;
  }

  .creator-campaign-detail-hero,
  .creator-campaign-bottom-cta {
    border-radius: var(--radius-lg);
  }

  .creator-campaign-grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .creator-campaign-toolbar {
    display: flex;
    grid-template-columns: minmax(0, 1fr) var(--control-height-md);
    gap: var(--space-2);
    border-radius: var(--radius-lg);
  }

  .campaign-category-select, .creator-campaign-toolbar__notification {
    display: none!important;
    
  }

  .creator-campaign-toolbar__search {
    width: 100%;
    grid-column: 1 / -1;
  }

  .creator-campaign-toolbar__select--time {
    grid-column: 1;
  }

  .creator-campaign-toolbar__notification {
    grid-column: 2;
    grid-row: 4;
    margin-left: 0;
  }

  .creator-campaign-card-media {
    /*aspect-ratio: 1.72 / 1;*/
  }

  .creator-campaign-card-body {
    padding: 12px;
  }

  .creator-campaign-card-actions {
    padding: 0 12px 12px;
  }

  .creator-campaign-detail-hero-media {
    min-height: 260px;
    aspect-ratio: 16 / 10;
  }

  .creator-campaign-hero-top,
  .creator-campaign-hero-bottom {
    padding: 14px;
  }

  .creator-campaign-detail-title {
    font-size: var(--font-size-xl);
  }

  .creator-campaign-detail-panel {
    padding: 0;
    gap: 22px;
  }

  .creator-campaign-detail-list li {
    flex-direction: column;
    gap: 4px;
  }

  .creator-campaign-detail-list li strong {
    text-align: left;
  }

  .creator-campaign-submission-history-item {
    grid-template-columns: minmax(0, 1fr);
  }

  .creator-campaign-submission-history-meta {
    justify-items: start;
  }

  .creator-campaign-gate-surface {
    width: min(332px, calc(100vw - 24px));
    margin-top: min(16vh, 96px);
  }
}

/* Campaign discovery: shared filters with a desktop-specific toolbar layout. */
.creator-campaign-toolbar--desktop {
  position: relative;
  z-index: 30;
  flex-wrap: nowrap;
  gap: 8px;
  overflow: visible;
}

.creator-campaign-toolbar__search-form {
  display: flex;
  flex: 1 1 260px;
  min-width: 220px;
  margin: 0;
}

.creator-campaign-toolbar--desktop .creator-campaign-toolbar__search {
  flex: 1 1 auto;
  width: 100%;
  height: 42px;
}

.creator-campaign-toolbar__filters {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 6px;
  min-width: 0;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip,
.creator-campaign-toolbar--desktop .creator-campaign-platform-filter {
  flex: 0 0 auto;
  min-height: 42px;
  border: 1px solid color-mix(in srgb, var(--border-color) 86%, transparent);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--bg-muted) 42%, var(--bg-card));
  color: var(--text-primary);
  text-decoration: none;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  max-width: 142px;
  padding: 0 10px;
  font: inherit;
  font-size: 12px;
  font-weight: var(--creator-font-weight-semibold);
  white-space: nowrap;
  cursor: pointer;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip i {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: 12px;
}

.creator-campaign-toolbar--desktop .creator-campaign-platform-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  font-size: 17px;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip:hover,
.creator-campaign-toolbar--desktop .creator-campaign-filter-chip:focus-visible,
.creator-campaign-toolbar--desktop .creator-campaign-platform-filter:hover,
.creator-campaign-toolbar--desktop .creator-campaign-platform-filter:focus-visible {
  border-color: color-mix(in srgb, var(--brand-primary) 52%, var(--border-color));
  background: color-mix(in srgb, var(--brand-primary) 8%, var(--bg-card));
  color: var(--brand-primary);
  text-decoration: none;
  outline: none;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip.is-active,
.creator-campaign-toolbar--desktop .creator-campaign-platform-filter.is-active {
  border-color: var(--brand-primary);
  background: var(--brand-primary);
  color: #fff;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-chip.is-active i {
  color: currentColor;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: var(--campaign-filter-menu-left, 0);
  z-index: 1000;
  display: grid;
  width: min(272px, 100%);
  max-height: min(320px, 48vh);
  overflow-y: auto;
  padding: 6px;
  border: 1px solid color-mix(in srgb, var(--border-color) 92%, transparent);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  box-shadow: var(--shadow-card);
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-menu[hidden] {
  display: none !important;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  color: var(--text-primary);
  font-size: 13px;
  font-weight: var(--creator-font-weight-medium);
  line-height: 1.25;
  text-decoration: none;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-menu a:hover,
.creator-campaign-toolbar--desktop .creator-campaign-filter-menu a:focus-visible,
.creator-campaign-toolbar--desktop .creator-campaign-filter-menu a.is-selected {
  background: color-mix(in srgb, var(--brand-primary) 9%, var(--bg-card));
  color: var(--brand-primary);
  outline: none;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-menu a i {
  flex: 0 0 auto;
  visibility: hidden;
  font-size: 15px;
}

.creator-campaign-toolbar--desktop .creator-campaign-filter-menu a.is-selected i {
  visibility: visible;
}

@media (min-width: 576px) and (max-width: 1199.98px) {
  .creator-campaign-toolbar--desktop {
    flex-wrap: wrap;
  }

  .creator-campaign-toolbar__search-form {
    flex: 1 1 100%;
    width: 100%;
  }

  .creator-campaign-toolbar__filters {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 1px 2px;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .creator-campaign-toolbar__filters::-webkit-scrollbar {
    display: none;
  }
}

/* Campaign discovery: compact mobile-only filters. */
.creator-campaign-mobile-filters {
  display: none;
}

@media (max-width: 575.98px) {
  .creator-campaigns-page {
    gap: 12px;
  }

  .creator-campaign-toolbar--desktop {
    display: none !important;
  }

  .creator-campaign-mobile-filters {
    position: relative;
    z-index: 30;
    display: grid;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    gap: 8px;
  }

  .creator-campaign-mobile-search {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
    height: 42px;
    padding: 0 13px;
    border: 1px solid color-mix(in srgb, var(--border-color) 86%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--bg-muted) 42%, var(--bg-card));
  }

  .creator-campaign-mobile-search:focus-within {
    border-color: color-mix(in srgb, var(--brand-primary) 48%, var(--border-color));
  }

  .creator-campaign-mobile-search > i {
    flex: 0 0 auto;
    margin-right: 9px;
    color: var(--text-secondary);
    font-size: 17px;
  }

  .creator-campaign-mobile-search input[type="search"] {
    width: 100%;
    min-width: 0;
    height: 100%;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-primary);
    font-size: 13px;
    font-weight: var(--creator-font-weight-medium);
  }

  .creator-campaign-mobile-search input[type="search"]::placeholder {
    color: var(--text-secondary);
    opacity: 1;
  }

  .creator-campaign-mobile-filter-row {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 1px 1px 3px;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .creator-campaign-mobile-filter-row::-webkit-scrollbar {
    display: none;
  }

  .creator-campaign-filter-chip,
  .creator-campaign-platform-filter {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 38px;
    border: 1px solid color-mix(in srgb, var(--border-color) 88%, transparent);
    background: var(--bg-card);
    color: var(--text-primary);
    text-decoration: none;
    touch-action: manipulation;
  }

  .creator-campaign-filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    max-width: 172px;
    padding: 0 12px;
    border-radius: var(--radius-pill);
    font: inherit;
    font-size: 12px;
    font-weight: var(--creator-font-weight-semibold);
    white-space: nowrap;
    cursor: pointer;
  }

  .creator-campaign-filter-chip span {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .creator-campaign-filter-chip i {
    flex: 0 0 auto;
    color: var(--text-secondary);
    font-size: 13px;
  }

  .creator-campaign-platform-filter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    font-size: 16px;
  }

  .creator-campaign-filter-chip:hover,
  .creator-campaign-filter-chip:focus-visible,
  .creator-campaign-platform-filter:hover,
  .creator-campaign-platform-filter:focus-visible {
    border-color: color-mix(in srgb, var(--brand-primary) 46%, var(--border-color));
    background: color-mix(in srgb, var(--brand-primary) 8%, var(--bg-card));
    color: var(--brand-primary);
    text-decoration: none;
    outline: none;
  }

  .creator-campaign-filter-chip.is-active,
  .creator-campaign-platform-filter.is-active {
    border-color: color-mix(in srgb, var(--brand-primary) 62%, var(--border-color));
    background: color-mix(in srgb, var(--brand-primary) 13%, var(--bg-card));
    color: var(--brand-primary);
  }

  .creator-campaign-filter-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: var(--campaign-filter-menu-left, 0);
    z-index: 100;
    display: grid;
    width: min(272px, 100%);
    max-height: min(320px, 48vh);
    overflow-y: auto;
    padding: 6px;
    border: 1px solid color-mix(in srgb, var(--border-color) 92%, transparent);
    border-radius: var(--radius-lg);
    background: var(--bg-card);
    box-shadow: var(--shadow-card);
  }

  .creator-campaign-filter-menu[hidden] {
    display: none !important;
  }

  .creator-campaign-filter-menu a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 38px;
    padding: 8px 10px;
    border-radius: var(--radius-md);
    color: var(--text-primary);
    font-size: 13px;
    font-weight: var(--creator-font-weight-medium);
    line-height: 1.25;
    text-decoration: none;
  }

  .creator-campaign-filter-menu a:hover,
  .creator-campaign-filter-menu a:focus-visible,
  .creator-campaign-filter-menu a.is-selected {
    background: color-mix(in srgb, var(--brand-primary) 9%, var(--bg-card));
    color: var(--brand-primary);
    outline: none;
  }

  .creator-campaign-filter-menu a i {
    flex: 0 0 auto;
    visibility: hidden;
    font-size: 15px;
  }

  .creator-campaign-filter-menu a.is-selected i {
    visibility: visible;
  }

  .creator-campaigns-page > .creator-campaigns-heading {
    display: none;
  }
}

.creator-messages-page {
  width: 100%;
  min-width: 0;
}

.creator-messages-workspace {
  display: grid;
  width: 100%;
  max-width: none;
  min-width: 0;
  grid-template-columns: 360px minmax(0, 1fr);
  justify-content: stretch;
  gap: 0;
  min-height: clamp(604px, calc(100vh - 170px), 760px);
  height: clamp(604px, calc(100vh - 170px), 760px);
  max-height: clamp(604px, calc(100vh - 170px), 760px);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--auth-surface-2);
  
}

.creator-messages-thread {
  border-radius: 0;
  overflow: hidden;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: transparent;
  box-shadow: none;
  border: 0;
}

.creator-messages-sidebar {
  border-radius: 0;
  overflow: hidden;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: transparent;
  box-shadow: none;
  border: 0;
  border-right: 1px solid var(--border-color);
}

.creator-messages-sidebar-header {
  padding: 9px 13px 8px;
  border-bottom: 1px solid var(--border-color);
  background: var(--auth-surface-2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.creator-messages-sidebar-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.creator-messages-sidebar-header h1,
.creator-messages-thread-empty h1,
.creator-messages-empty-panel h1 {
  margin: 0;
  font-size: var(--text-card-title-size);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--text-primary);
}

.creator-messages-thread-icon,
.creator-messages-composer-tool,
.creator-messages-thread-back {
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: var(--radius-pill);
  background: transparent;
  color: #8a94a6;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  font-size: var(--text-micro-size);
}

.creator-messages-header-action {
  width: 22px;
  height: 22px;
  border: 0;
  border-radius: var(--radius-pill);
  background: transparent;
  color: #8a94a6;
  display: none;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  font-size: var(--text-micro-size);
}

.creator-messages-header-action:hover,
.creator-messages-thread-icon:hover,
.creator-messages-composer-tool:hover,
.creator-messages-thread-back:hover {
  background: rgba(15, 39, 71, 0.06);
  color: #17305c;
}

.creator-messages-filters {
  display: flex;
  flex-wrap: nowrap;
  gap: 5px;
  padding: 7px 13px;
  border-bottom: 1px solid var(--border-color);
}

.creator-messages-filter-chip {
  border: 1px solid #edf0f5;
  background: #fafbfd;
  color: #666666;
  text-decoration: none;
  padding: 2px 8px 1px;
  border-radius: var(--radius-pill);
  font-size: var(--text-badge-size);
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.2;
  min-height: 18px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}

.creator-messages-filter-chip.is-active {
  background: #0f2f83;
  border-color: #0f2f83;
  color: #fff;
}

.creator-messages-list {
  display: flex;
  flex-direction: column;
  padding: 6px 7px 8px;
}

.creator-messages-row {
  display: grid;
  grid-template-columns: 31px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: start;
  text-decoration: none;
  color: var(--text-primary);
  border: 1px solid transparent;
  border-radius: 10px;
  min-height: 44px;
  padding: 6px 7px;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.creator-messages-row + .creator-messages-row {
  margin-top: 2px;
}

.creator-messages-row:hover {
  background: #f5f7fb;
  border-color: #eef2f7;
}

.creator-messages-row.is-active {
  background: #f5f7fb;
  border-color: #eef2f7;
  box-shadow: none;
}

.creator-messages-row.is-unread strong,
.creator-messages-row.is-unread .creator-messages-preview {
  color: var(--text-primary);
}

.creator-messages-row.is-disabled {
  opacity: 0.7;
}

.creator-messages-avatar-wrap {
  position: relative;
  display: inline-flex;
}

.creator-messages-avatar {
  width: 31px;
  height: 31px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-messages-avatar--fallback {
  background: var(--bg-muted);
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-micro-size);
}

.creator-messages-avatar-status {
  position: absolute;
  right: 1px;
  bottom: 1px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 2px solid var(--bg-card);
  background: transparent;
}

.creator-messages-avatar-status.is-online {
  background: #22c55e;
}

.creator-messages-row-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.creator-messages-row-top,
.creator-messages-row-bottom {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.creator-messages-row-top strong {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--text-badge-size);
  line-height: 1.2;
  font-weight: 700;
}

.creator-messages-row-top i {
  color: #D308EE;
  font-size: var(--text-table-size);
  line-height: 1.15;
}

.creator-messages-preview {
  color: #666666;
  font-size: var(--text-icon-micro-size);
  line-height: 1.15;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 4px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-weight: 400;
}

.creator-messages-unread-badge {
  min-width: 12px;
  height: 12px;
  padding: 0 3px;
  border-radius: var(--radius-pill);
  background: #0b8a3f;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-icon-micro-size);
  font-weight: 700;
}

.creator-messages-list-empty,
.creator-messages-empty-panel,
.creator-messages-thread-empty,
.creator-messages-thread-loading {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 28px;
}

.creator-messages-empty-icon {
  width: 64px;
  height: 64px;
  border-radius: var(--radius-xl);
  background: var(--bg-muted);
  color: var(--brand-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-display-title-size);
  margin-bottom: 16px;
}

.creator-messages-list-empty h2,
.creator-messages-thread-empty h2,
.creator-messages-empty-panel h2 {
  margin: 0 0 8px;
  font-size: var(--text-section-title-size);
  color: var(--text-primary);
}

.creator-messages-list-empty p,
.creator-messages-empty-panel p,
.creator-messages-thread-empty p {
  margin: 0 0 18px;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
}

.creator-messages-thread-header-main,
.creator-messages-thread-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.creator-messages-thread-header {
  padding: 9px 13px 8px;
  border-bottom: 1px solid var(--border-color);
  background: var(--auth-surface-2);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 42px;
}

.creator-messages-thread-user {
  display: flex;
  align-items: center;
  gap: 7px;
  text-decoration: none;
  color: inherit;
  min-width: 0;
  flex: 1;
}

.creator-messages-thread-identity {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.creator-messages-thread-identity strong {
  font-size: var(--text-badge-size);
  line-height: 1.1;
  color: var(--text-primary);
}

.creator-messages-thread-identity small {
  color: #8f97a7;
  font-size: var(--text-icon-micro-size);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.creator-messages-thread-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #83cc66;
  display: inline-block;
}

.creator-messages-thread-submit {
  min-width: 56px;
  height: 22px;
  padding: 0 12px;
  border-radius: 9px;
  border: 1px solid #7e9ad0;
  background: #f7fbff;
  color: #17305c;
  font-size: var(--text-table-size);
  font-weight: 600;
}

.creator-messages-thread-notice {
  margin: 8px 14px 0;
  padding: 6px 9px;
  border: 1px solid #edf0f5;
  border-radius: var(--radius-md);
  background: #f8f9fb;
  color: #8d95a5;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--text-icon-micro-size);
  line-height: 1.35;
  min-height: 24px;
}

.creator-messages-thread-notice a {
  color: #68778f;
  text-decoration: underline;
}

.creator-messages-thread-notice--footer {
  margin: 0;
  border-radius: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}

.creator-message-item {
  display: flex;
  gap: 7px;
  margin-bottom: 7px;
}

.creator-message-item.is-own {
  justify-content: flex-end;
}

.creator-message-item.is-grouped {
  margin-top: -3px;
}

.creator-message-item.is-other.is-grouped {
  margin-left: 0;
}

.creator-message-avatar-link {
  flex: 0 0 auto;
  align-self: flex-start;
}

.creator-message-avatar-spacer {
  flex: 0 0 22px;
  width: 22px;
}

.creator-message-avatar {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-message-label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #8f97a7;
  margin-bottom: 0;
}

.creator-message-label span {
  font-size: var(--text-icon-micro-size);
  line-height: 1.2;
  margin: 0;
}

.creator-message-label strong {
  font-size: var(--text-icon-micro-size);
  line-height: 1.2;
  margin: 0;
  color: #4c566b;
  font-weight: 600;
}

.creator-message-stack {
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-width: min(38%, 274px);
  position: relative;
}

.plyr__video-embed, .plyr__video-wrapper--fixed-ratio{
  aspect-ratio: 16 / 9!important;
}

.creator-message-item.is-own .creator-message-stack {
  align-items: flex-end;
  max-width: min(34%, 244px);
}

.creator-message-delete {
  position: absolute;
  top: -2px;
  right: -18px;
  color: var(--text-secondary);
  font-size: var(--text-caption-size);
}

.creator-message-bubble {
  border-radius: 13px;
  padding: 7px 10px;
  border: 1px solid #edf0f5;
  background: var(--auth-surface-2);
  color: var(--text-primary);
  word-break: break-word;
  overflow-wrap: anywhere;
  box-shadow: none;
  font-size: var(--text-icon-micro-size);
  line-height: 1.38;
}

.creator-message-bubble--own {
  background: #15387c;
  border-color: #15387c;
  color: #fff;
  border-bottom-right-radius: 6px;
}

.creator-message-bubble--other {
  background: var(--auth-surface-2);
  color: var(--text-primary);
  border-bottom-left-radius: 6px;
}

.creator-message-bubble--media {
  background: transparent;
  border: 0;
  padding: 0;
  box-shadow: none;
  max-width: 148px;
}

.creator-message-bubble--locked {
  max-width: 500px;
}

.creator-message-bubble p:last-child {
  margin-bottom: 0;
}

.creator-message-meta {
  color: #666666;
  font-size: var(--text-icon-micro-size);
  line-height: 1.15;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: -2px;
}

.creator-message-reactions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
}

.creator-message-reaction {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  min-height: 14px;
  padding: 0 5px;
  border-radius: var(--radius-pill);
  background: #f5f7fb;
  color: #6b7587;
  font-size: var(--text-badge-size);
  line-height: 1;
}

.creator-message-reaction--danger i {
  color: #ef4444;
}

.creator-message-reaction--warning i {
  color: #f59e0b;
}

.creator-message-reaction--info i {
  color: #60a5fa;
}

.creator-message-item.is-own .creator-message-meta {
  justify-content: flex-end;
}

.creator-message-item.is-other .creator-message-meta {
  justify-content: flex-start;
}

.creator-messages-load-more {
  text-align: center;
  margin-bottom: 18px;
}

.creator-messages-load-more a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: var(--radius-pill);
  background: var(--bg-muted);
  color: var(--text-secondary);
  text-decoration: none;
  font-size: var(--text-meta-size);
}

.creator-messages-composer-wrap {
  border-top: 1px solid var(--border-color);
  background: var(--bg-card);
  position: sticky;
  bottom: 0;
  z-index: 3;
  flex-shrink: 0;
}

.creator-messages-composer {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  width: 100%;
  padding: 5px 13px 6px;
}

.creator-message-composer__field {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 4px 9px;
  border: 1px solid #dfe5ef;
  border-radius: var(--radius-pill);
  background: var(--auth-surface-2);
  min-height: 29px;
}

.creator-message-composer__input {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 auto;
  min-width: 0;
}

.creator-message-composer__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  flex-wrap: nowrap;
  min-width: 0;
}

.creator-messages-composer textarea {
  background: transparent;
  color: var(--text-primary);
  border: 0;
  resize: none;
  min-height: 13px;
  max-height: 42px;
  box-shadow: none;
  padding: 0;
  font-size: var(--text-icon-micro-size);
  line-height: 1.15;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
  writing-mode: horizontal-tb;
}

.creator-messages-composer textarea:focus {
  box-shadow: none;
  background: transparent;
  border: 0;
  outline: 0;
}

.creator-message-composer__send,
.creator-messages-send-btn {
  flex: 0 0 27px;
  width: 27px;
  height: 27px;
  border: 0;
  border-radius: var(--radius-pill);
  background: #0f2f83;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
  font-size: var(--text-caption-size);
}

.creator-messages-send-btn:disabled {
  opacity: 0.45;
  box-shadow: none;
}

.creator-message-composer__inline-tools,
.creator-messages-toolbar {
  display: flex;
  flex-wrap: nowrap;
  gap: 1px;
  justify-content: flex-end;
  flex-shrink: 0;
}

.creator-messages-attachment-preview {
  font-size: var(--text-icon-micro-size);
  color: var(--text-secondary);
  min-width: 0;
  flex: 1 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.creator-messages-thread-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 7px 13px 4px;
  background: var(--auth-surface-2);
  scrollbar-width: thin;
  scrollbar-color: #cfd6e3 transparent;
}

.creator-messages-sidebar-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: thin;
  scrollbar-color: #cfd6e3 transparent;
}

.creator-messages-sidebar-scroll::-webkit-scrollbar,
.creator-messages-thread-body::-webkit-scrollbar {
  width: 6px;
}

.creator-messages-sidebar-scroll::-webkit-scrollbar-thumb,
.creator-messages-thread-body::-webkit-scrollbar-thumb {
  background: #cfd6e3;
  border-radius: var(--radius-pill);
}

.creator-message-modal-dialog {
  max-width: 420px;
}

.creator-message-modal-card {
  border-radius: 18px;
  overflow: hidden;
}

.creator-message-modal-body {
  padding: 18px 18px 14px;
}

.creator-message-modal-title {
  font-size: var(--text-section-title-size);
  font-weight: 600;
  line-height: 1.2;
}

.creator-message-modal-close {
  position: absolute;
  top: 0;
  right: 0;
  width: 26px;
  height: 26px;
  border-radius: var(--radius-pill);
  color: var(--text-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.creator-message-search-icon {
  position: absolute;
  left: 12px;
  top: 10px;
  color: var(--text-secondary);
  z-index: 1;
}

.creator-message-search-input {
  height: 42px;
  padding-left: 36px;
  border-radius: 14px;
}

.creator-message-modal-loading {
  padding: 12px 0 4px;
}

.creator-message-modal-results {
  max-height: 430px;
  overflow-y: auto;
  padding-top: 8px;
}

/* Messages reference-scale pass: keep the shared workspace geometry, restore the
   readable desktop scale used by the supplied Messages composition. */
.creator-messages-page .creator-messages-sidebar-header {
  padding: 14px 18px 12px;
  min-height: 58px;
}

.creator-messages-page .creator-messages-sidebar-header h1,
.creator-messages-page .creator-messages-thread-empty h1,
.creator-messages-page .creator-messages-empty-panel h1 {
  font-size: var(--text-section-title-size);
}

.creator-messages-page .creator-messages-filters {
  gap: 7px;
  padding: 10px 18px;
}

.creator-messages-page .creator-messages-filter-chip {
    min-height: 24px;
    padding: 9px 14px;
    font-size: var(--text-caption-size);
    min-width: 54px;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-weight: 400;
    text-rendering: optimizeLegibility;
}

.creator-messages-page .creator-messages-list {
  padding: 15px 0;
}

.creator-messages-page .creator-messages-row {
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 58px;
  padding: 9px 10px;
  border-radius: var(--radius-md);
  margin-bottom: 10px;
}

.creator-messages-page .creator-messages-row + .creator-messages-row {
  margin-top: 4px;
}

.creator-messages-page .creator-messages-avatar {
  width: 40px;
  height: 40px;
}

.creator-messages-page .creator-messages-row-top strong {
  font-size: var(--font-size-body);
  line-height: 1.25;
  color: var(--text-primary);
  font-weight: 500;
}

.creator-messages-page .creator-messages-row-top small,
.creator-messages-page .creator-messages-preview,
.creator-messages-page .creator-message-meta {
  font-size: var(--text-meta-size);
  line-height: 1.25;
}

.creator-messages-page .creator-messages-unread-badge {
  min-width: 16px;
  height: 16px;
  font-size: var(--text-badge-size);
}

.creator-messages-page .creator-messages-thread-header {
  padding: 14px 18px 12px;
  min-height: 58px;
}

.creator-messages-page .creator-messages-thread-identity strong {
  font-size: var(--text-card-title-size);
  line-height: 1.2;
  font-family: 700;
}

.creator-messages-page .creator-messages-thread-identity small {
  font-size: var(--text-meta-size);
}

.creator-messages-page .creator-messages-thread-icon,
.creator-messages-page .creator-messages-header-action {
  width: 28px;
  height: 28px;
  font-size: var(--text-body-size);
}

.creator-messages-page .creator-messages-thread-body {
  padding: 13px 20px 8px;
}

.creator-messages-page .creator-message-item {
  gap: 10px;
  margin-bottom: 13px;
}

.creator-messages-page .creator-message-avatar-spacer,
.creator-messages-page .creator-message-avatar {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
}

.creator-messages-page .creator-message-stack {
  max-width: min(58%, 430px);
  gap: 5px;
}

.creator-messages-page .creator-message-item.is-own .creator-message-stack {
  max-width: min(54%, 400px);
}

.creator-messages-page .creator-message-label strong,
.creator-messages-page .creator-message-label span {
  font-size: var(--text-meta-size);
}

.creator-messages-page .creator-message-bubble {
  padding: 10px 14px;
  border-radius: var(--radius-lg);
  font-size: var(--text-table-size);
  line-height: 1.45;
}

.creator-messages-page .creator-message-bubble--media {
  max-width: 220px;
  padding: 0;
}

.creator-messages-page .creator-message-reactions {
  gap: 7px;
  margin-top: 4px;
}

.creator-messages-page .creator-message-reaction {
  min-height: 20px;
  padding: 0 7px;
  font-size: var(--text-caption-size);
}

@media (max-width: 767.98px) {
  .creator-messages-page .creator-messages-sidebar-header,
  .creator-messages-page .creator-messages-thread-header {
    padding-left: 14px;
    padding-right: 14px;
  }
  .creator-messages-page .creator-feed-card{
    padding-top: 0!important;
  }

  .creator-messages-page .creator-messages-filters,
  .creator-messages-page .creator-messages-thread-body {
    padding-left: 14px;
    padding-right: 14px;
  }

  .creator-messages-page .creator-messages-row {
    grid-template-columns: 40px minmax(0, 1fr) auto;
  }

  .creator-messages-page .creator-message-stack,
  .creator-messages-page .creator-message-item.is-own .creator-message-stack {
    max-width: min(82%, 320px);
  }
}

.creator-message-recipient-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.creator-message-recipient-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--border-color);
  border-radius: 14px;
  text-decoration: none;
  color: var(--text-primary);
  background: var(--bg-card);
}

.creator-message-recipient-row:hover {
  background: rgba(28, 100, 242, 0.05);
  border-color: rgba(28, 100, 242, 0.18);
}

.creator-message-recipient-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg-muted);
}

.creator-message-recipient-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.creator-message-recipient-copy strong {
  font-size: var(--text-body-size);
  line-height: 1.2;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-message-recipient-copy small,
.creator-message-recipient-action {
  color: var(--text-secondary);
  font-size: var(--text-micro-size);
  line-height: 1.2;
}

.creator-message-recipient-empty {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
  padding: 14px;
}

.creator-message-recipient-empty h3 {
  margin: 0;
  font-size: var(--text-control-size);
  line-height: 1.2;
  font-weight: 600;
}

.creator-message-recipient-empty p {
  margin: 0;
  font-size: var(--text-meta-size);
  line-height: 1.45;
  color: var(--text-secondary);
}

html[data-theme="dark"] .creator-messages-send-btn {
  color: #fff;
}

html[data-theme="dark"] .creator-messages-filter-chip.is-active {
  background: var(--auth-accent);
  border-color: var(--auth-accent);
  color: #fff;
}

html[data-theme="dark"] .creator-message-bubble--own {
  background: var(--auth-accent);
  border-color: var(--auth-accent);
  color: #f8fafc;
}

html[data-theme="dark"] .creator-messages-workspace {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-messages-row.is-active {
  background: rgba(59, 130, 246, 0.16);
  border-color: rgba(59, 130, 246, 0.22);
}

html[data-theme="dark"] .creator-messages-thread-back {
  color: var(--auth-text-secondary);
  background: rgba(148, 163, 184, 0.06);
}

html[data-theme="dark"] .creator-messages-composer-tool {
  color: var(--auth-text-secondary);
  background: rgba(148, 163, 184, 0.06);
}

html[data-theme="dark"] .creator-messages-thread-icon {
  color: var(--auth-text-secondary);
  background: rgba(148, 163, 184, 0.06);
}

html[data-theme="dark"] .creator-messages-header-action {
  color: var(--auth-text-secondary);
  background: rgba(148, 163, 184, 0.06);
}

@media (max-width: 1199.98px) {
  .creator-messages-workspace {
    width: 100%;
    max-width: none;
    min-width: 0;
    grid-template-columns: 280px minmax(0, 1fr);
    min-height: clamp(590px, calc(100vh - 220px), 656px);
    height: clamp(590px, calc(100vh - 220px), 656px);
    max-height: clamp(590px, calc(100vh - 220px), 656px);
  }

  .creator-message-stack {
    max-width: min(42%, 248px);
  }
}

@media (max-width: 991.98px) {
  .creator-messages-workspace {
    grid-template-columns: minmax(0, 1fr);
    min-height: auto;
    height: auto;
    max-height: none;
    width: 100%;
    border-radius: var(--radius-lg);
  }

  .creator-messages-thread {
    min-height: calc(100vh - 138px);
    height: calc(100vh - 138px);
  }

  .creator-messages-sidebar {
    min-height: calc(100vh - 138px);
    height: calc(100vh - 138px);
    border-right: 0;
  }

  .creator-messages-page .creator-messages-workspace[data-mobile-thread-mode="thread"].has-active-conversation .creator-messages-sidebar {
    display: none;
  }

  .creator-messages-page .creator-messages-workspace[data-mobile-thread-mode="list"] .creator-messages-thread,
  .creator-messages-page .creator-messages-workspace.is-empty-thread .creator-messages-thread {
    display: none;
  }

  .creator-message-stack {
    max-width: 80%;
  }
}

@media (max-width: 767.98px) {
  .creator-messages-workspace {
    border-radius: 0;
    border-left: 0;
    border-right: 0;
     none;
  }

  .creator-messages-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    min-height: 52px;
    padding: 6px 12px;
  }

  .creator-messages-sidebar-header,
  .creator-messages-thread-header {
    padding: 8px 12px 7px;
  }

  .creator-messages-filters,
  .creator-messages-thread-body,
  .creator-messages-composer {
    padding-left: 12px;
    padding-right: 12px;
  }

  .creator-message-delete {
    right: 0;
    top: -18px;
  }

  .creator-messages-thread-actions {
    gap: 4px;
  }

  .creator-messages-thread-icon,
  .creator-messages-composer-tool,
  .creator-messages-thread-back {
    width: 22px;
    height: 22px;
    border-radius: var(--radius-pill);
  }

  .creator-message-item {
    gap: 8px;
  }

  .creator-message-stack {
    max-width: min(79%, 248px);
  }

  .creator-message-item.is-own .creator-message-stack {
    max-width: min(76%, 232px);
  }

  .creator-message-bubble--media {
    max-width: min(64vw, 204px);
  }

  .creator-messages-composer-shell {
    display: contents;
  }

  .creator-message-composer__field {
    gap: 6px;
    min-height: 30px;
  }

  .creator-message-composer__meta {
    gap: 4px;
  }

  .creator-messages-toolbar {
    gap: 1px;
  }
}

.creator-dashboard-page {
  width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 4px 0 20px;
}

.creator-dashboard-mobile-bar {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.creator-dashboard-mobile-back {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  
}

.creator-dashboard-mobile-bar h1,
.creator-dashboard-header h1 {
  margin: 0;
  font-size: var(--text-display-title-size);
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.creator-dashboard-mobile-bar p,
.creator-dashboard-header p {
  margin: 6px 0 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-dashboard-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.creator-dashboard-header-eyebrow {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  background: rgba(37, 99, 235, 0.08);
  color: #2563eb;
  font-size: var(--text-micro-size);
  font-weight: 600;
  margin-bottom: 10px;
}

.creator-dashboard-card-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.creator-dashboard-metric-card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 18px;
  
  min-height: 154px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.creator-dashboard-metric-icon {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--text-lead-size);
}

.creator-dashboard-metric-icon--indigo { background: rgba(79, 70, 229, 0.12); color: #4f46e5; }
.creator-dashboard-metric-icon--blue { background: rgba(37, 99, 235, 0.12); color: #2563eb; }
.creator-dashboard-metric-icon--emerald { background: rgba(5, 150, 105, 0.12); color: #059669; }
.creator-dashboard-metric-icon--amber { background: rgba(217, 119, 6, 0.12); color: #d97706; }
.creator-dashboard-metric-icon--rose { background: rgba(225, 29, 72, 0.12); color: #e11d48; }
.creator-dashboard-metric-icon--violet { background: rgba(124, 58, 237, 0.12); color: #7c3aed; }
.creator-dashboard-metric-icon--sky { background: rgba(2, 132, 199, 0.12); color: #0284c7; }
.creator-dashboard-metric-icon--teal { background: rgba(13, 148, 136, 0.12); color: #0d9488; }
.creator-dashboard-metric-icon--orange { background: rgba(249, 115, 22, 0.12); color: #f97316; }
.creator-dashboard-metric-icon--cyan { background: rgba(8, 145, 178, 0.12); color: #0891b2; }

.creator-dashboard-metric-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
}

.creator-dashboard-metric-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: var(--text-caption-size);
  color: var(--text-secondary);
  min-height: 18px;
}

/* !important allowed in this block: Bootstrap text-success/text-danger utilities. */
.creator-dashboard-metric-trend {
  text-align: right;
}

.creator-dashboard-metric-trend .text-danger {
  font-size: var(--text-caption-size);
  font-weight: 600;
  color: #dc2626 !important;
}

.creator-dashboard-metric-trend .text-success {
  font-size: var(--text-caption-size);
  font-weight: 600;
  color: #059669 !important;
}

.creator-dashboard-metric-value {
  display: block;
  font-size: var(--text-page-title-size);
  line-height: 1.15;
  letter-spacing: -0.03em;
}

.creator-dashboard-metric-label {
  display: block;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-dashboard-metric-hint {
  font-size: var(--text-micro-size);
  color: #2563eb;
  text-decoration: none;
}

.creator-dashboard-panel {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 18px;
  
  padding: 18px;
}

.creator-dashboard-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.creator-dashboard-panel-header h2 {
  margin: 0;
  font-size: var(--text-section-title-size);
  line-height: 1.15;
}

.creator-dashboard-panel-header p {
  margin: 6px 0 0;
  font-size: var(--text-meta-size);
  color: var(--text-secondary);
}

.creator-dashboard-filter select {
  min-width: 142px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid var(--border-color);
  background: var(--bg-muted);
  color: var(--text-primary);
  font-size: var(--text-meta-size);
  padding: 0 38px 0 14px;
  box-shadow: none;
}

.creator-dashboard-chart-wrap {
  position: relative;
  height: 320px;
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(37, 99, 235, 0.03) 0%, rgba(37, 99, 235, 0) 100%);
  padding: 8px 0 0;
}

.creator-dashboard-data-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.creator-dashboard-table-scroll {
  overflow-x: auto;
}

.creator-dashboard-table {
  width: 100%;
  border-collapse: collapse;
}

.creator-dashboard-table th,
.creator-dashboard-table td {
  text-align: left;
  padding: 14px 10px;
  vertical-align: middle;
  border-top: 1px solid var(--border-color);
}

.creator-dashboard-table thead th {
  padding-top: 0;
  border-top: 0;
  font-size: var(--text-micro-size);
  font-weight: 600;
  color: var(--text-secondary);
  white-space: nowrap;
}

.creator-dashboard-table tbody td {
  font-size: var(--text-meta-size);
  color: var(--text-primary);
}

.creator-dashboard-user {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: inherit;
  text-decoration: none;
}

.creator-dashboard-user img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.creator-dashboard-user span,
.creator-dashboard-table-title,
.creator-dashboard-table-amount {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.creator-dashboard-user strong,
.creator-dashboard-table-title strong,
.creator-dashboard-table-amount strong {
  font-size: var(--text-meta-size);
  font-weight: 600;
}

.creator-dashboard-user small,
.creator-dashboard-table-title small,
.creator-dashboard-table-amount small,
.creator-dashboard-muted {
  font-size: var(--text-caption-size);
  color: var(--text-secondary);
}

.creator-dashboard-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 72px;
  padding: 6px 10px;
  border-radius: var(--radius-pill);
  font-size: var(--text-caption-size);
  font-weight: 600;
  text-transform: uppercase;
}

.creator-dashboard-status-pill.is-active {
  background: rgba(5, 150, 105, 0.12);
  color: #059669;
}

.creator-dashboard-status-pill.is-warning {
  background: rgba(217, 119, 6, 0.12);
  color: #d97706;
}

.creator-dashboard-status-pill.is-cancelled {
  background: rgba(220, 38, 38, 0.12);
  color: #dc2626;
}

.creator-dashboard-empty-state {
  min-height: 140px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-align: center;
  color: var(--text-secondary);
}

.creator-dashboard-empty-state i {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-muted);
  color: var(--text-primary);
}

.creator-dashboard-empty-state strong {
  color: var(--text-primary);
  font-size: var(--text-body-size);
}

.creator-dashboard-empty-state span {
  max-width: 280px;
  font-size: var(--text-micro-size);
}

.creator-dashboard-panel-footer {
  margin-top: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--border-color);
}

.creator-dashboard-panel-footer a {
  font-size: var(--text-meta-size);
  font-weight: 600;
  color: #2563eb;
  text-decoration: none;
}

html[data-theme="dark"] .creator-dashboard-mobile-back {
  background: var(--auth-control-bg);
  border-color: var(--auth-border);
  
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-dashboard-panel {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-dashboard-metric-card {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
  
}

html[data-theme="dark"] .creator-dashboard-header-eyebrow {
  border-color: transparent;
  color: #bfdbfe;
  background: rgba(96, 165, 250, 0.18);
}

html[data-theme="dark"] .creator-dashboard-filter select {
  background: rgba(148, 163, 184, 0.06);
  border-color: var(--auth-border);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-dashboard-chart-wrap {
  background: linear-gradient(180deg, rgba(59, 130, 246, 0.08) 0%, rgba(59, 130, 246, 0) 100%);
}

@media (max-width: 1399.98px) {
  .creator-dashboard-card-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1199.98px) {
  .creator-dashboard-page {
    width: 100%;
  }

  .creator-dashboard-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .creator-dashboard-header {
    display: none;
  }

  .creator-dashboard-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-dashboard-data-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .creator-dashboard-panel--payments {
    order: 1;
  }

  .creator-dashboard-panel--subscriptions {
    order: 2;
  }
}

@media (max-width: 767.98px) {
  .creator-dashboard-page {
    gap: 14px;
    padding-bottom: 4px;
  }

  .creator-dashboard-mobile-bar h1 {
    font-size: var(--text-page-title-size);
  }

  .creator-dashboard-card-grid {
    gap: 10px;
  }

  .creator-dashboard-metric-card {
    min-height: 138px;
    padding: 14px;
    border-radius: var(--radius-lg);
  }

  .creator-dashboard-metric-value {
    font-size: var(--text-section-title-size);
  }

  .creator-dashboard-metric-label {
    font-size: var(--text-micro-size);
  }

  .creator-dashboard-panel {
    padding: 16px;
    border-radius: var(--radius-lg);
  }

  .creator-dashboard-panel-header {
    flex-direction: column;
    align-items: stretch;
    margin-bottom: 12px;
  }

  .creator-dashboard-filter select {
    width: 100%;
  }

  .creator-dashboard-chart-wrap {
    height: 250px;
  }

  .creator-dashboard-table th,
  .creator-dashboard-table td {
    padding-left: 8px;
    padding-right: 8px;
  }
}

/* Messages composer: inline utilities with the send control beside the field. */
.creator-messages-page .creator-message-composer__field {
  min-height: 42px;
  padding: 12px; position: relative; display: block; padding-right: 12px; }
.creator-messages-page .creator-message-composer__input { position: relative; display: block; min-width: 0; }
.creator-messages-page .creator-messages-composer textarea {
  min-height: 18px;
  font-size: var(--text-card-title-size);
  line-height: 1.3; display: block; padding-right: 154px; }
.creator-messages-page .creator-message-composer__meta { position: absolute; top: 50%; right: 0; z-index: 1; display: flex; align-items: center; width: auto; max-width: calc(100% - 8px); gap: 4px; transform: translateY(-50%); }
.creator-messages-page .creator-messages-attachment-preview { flex: 0 1 auto; max-width: 72px; }
.creator-messages-page .creator-message-composer__inline-tools { display: flex; align-items: center; gap: 3px; }
.creator-messages-page .creator-messages-composer-tool { width: 24px; height: 24px;
  font-size: var(--text-body-size); display: flex; align-items: center; justify-content: center; flex: 0 0 24px; padding: 0; margin: 0; border: 0; line-height: 1; vertical-align: middle; appearance: none; background: transparent; }
.creator-messages-page .creator-message-composer__attach {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  background: #f1f5f9;
  color: var(--text-secondary);
  font-size: var(--text-lead-size);
}
.creator-messages-page .creator-message-composer__inline-tools > * { flex-shrink: 0; }
.creator-messages-page .creator-messages-composer-emoji { display: flex; align-items: center; justify-content: center; flex: 0 0 24px; width: 24px; height: 24px; margin: 0; padding: 0; }
.creator-messages-page .creator-messages-composer-emoji > .triggerEmoji { position: static; inset: auto; align-self: center; }
.creator-messages-page .creator-messages-composer-emoji > i { display: block; line-height: 1; }
.creator-messages-page .creator-messages-send-btn {
  flex-basis: 40px;
  width: 40px;
  height: 40px;
  font-size: var(--text-lead-size); align-self: center; }
@media (max-width: 767.98px) {
}

@media (min-width: 992px) {
  .creator-feed-page[data-authenticated-shell="true"] .creator-feed-shell-main:has(.creator-messages-page) {
    padding-bottom: 0;
  }

  .creator-messages-page .creator-messages-workspace {
    height: calc(100dvh - 24px);
    min-height: 0;
    max-height: none;
  }

  .creator-messages-page .creator-messages-thread {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: 0;
    padding-bottom: 0;
  }

  .creator-messages-page .creator-messages-thread-body {
    min-height: 0;
    overflow-y: auto;
  }

  .creator-messages-page .creator-messages-composer-wrap {
    position: relative;
    bottom: auto;
  }
}

@media (max-width: 991.98px) {
  .creator-messages-page .creator-messages-workspace {
    height: calc(100dvh - 124px);
    min-height: 0;
    max-height: none;
  }

  .creator-messages-page .creator-messages-sidebar,
  .creator-messages-page .creator-messages-thread {
    min-height: 0;
    height: 97%;
    padding-bottom: 0;
  }
  .creator-profile-right-panel{
      display: none;
  }
}

/* Final attachment-row layout. */
.creator-messages-page .creator-messages-composer {
  gap: 10px;
  padding: 10px 18px 12px; align-items:stretch; display:flex; flex-direction:column; }
.creator-messages-page .creator-message-composer__attachments { display:none; width:100%; min-width:0; max-width:100%; align-items:center; gap:8px; overflow-x:auto; overflow-y:hidden; padding:0 4px; scrollbar-width:thin; }
.creator-messages-page .creator-message-composer__attachments:not(.has-message-attachments) {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.creator-messages-page .creator-message-composer__attachments[hidden],
.creator-messages-page .creator-message-composer__attachments .creator-messages-attachment-preview[hidden],
.creator-messages-page .creator-message-composer__attachments #previewFile[hidden] {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.creator-messages-page .creator-message-composer__attachments > * { flex:0 0 auto; }
.creator-messages-page .creator-message-composer__attachments > input[type="file"] {
  display: none !important;
}
.creator-messages-page .creator-message-composer__attachments:not(.has-message-attachments) .fileuploader,
.creator-messages-page .creator-message-composer__attachments:not(.has-message-attachments) .fileuploader-items,
.creator-messages-page .creator-message-composer__attachments:not(.has-message-attachments) .fileuploader-items-list,
.creator-messages-page .creator-message-composer__attachments:not(.has-message-attachments) .fileuploader-item,
.creator-messages-page .creator-message-composer__attachments:not(.has-message-attachments) .creator-messages-attachment-preview {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
.creator-messages-page .creator-message-composer__attachments .fileuploader {
  display:block;
  width:auto;
  min-width:0;
  margin:0;
  padding:0;
  background:transparent;
}
.creator-messages-page .creator-message-composer__attachments .fileuploader-items {
  margin:0;
}
.creator-messages-page .creator-message-composer__attachments .fileuploader-items-list {
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
  padding:0;
}
.creator-messages-page .creator-message-composer__attachments .fileuploader-thumbnails-input {
  display:none !important;
}
.creator-messages-page .creator-message-composer__attachments .fileuploader-theme-thumbnails .fileuploader-items .fileuploader-item {
  flex:0 0 56px;
  width:56px;
  height:56px;
  min-width:56px;
  margin:0;
  padding:0;
  border-radius:8px;
  overflow:hidden;
}
.creator-messages-page .creator-message-composer__attachments .fileuploader-theme-thumbnails .fileuploader-item-inner {
  border-radius:8px;
}
.creator-messages-page .creator-message-composer__attachments .creator-messages-attachment-preview {
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:40px;
  max-width:min(100%, 320px);
  padding:6px 10px;
  border-radius:10px;
  background:#f8fafc;
}
.creator-messages-page .creator-message-composer__attachments .creator-messages-attachment-preview small:empty + a,
.creator-messages-page .creator-message-composer__attachments .creator-messages-attachment-preview small:empty {
  display:none;
}
.creator-messages-page .creator-message-composer__row { display:flex; align-items:center; gap:10px; width:100%; min-width:0; }
.creator-messages-page .creator-message-composer__row > .creator-message-composer__field { flex:1 1 auto; min-width:0; }
.creator-messages-page .creator-message-composer__row > .creator-messages-send-btn { flex:0 0 auto; }
@media (max-width:767.98px) {
  .creator-messages-page .creator-messages-composer { align-items:stretch; }
  .creator-messages-page .creator-message-composer__attachments { gap:8px; padding:0; }
}

@media (max-width: 767.98px) {
  .creator-messages-page .creator-messages-composer {
    padding-left: 14px;
    padding-right: 14px; align-items: stretch; gap: 8px; padding: 6px 12px 7px; }
  .creator-messages-page .creator-message-composer__field { flex: 1 1 auto; min-width: 0; min-height: 40px; padding: 9px 16px; overflow: hidden; }
  .creator-messages-page .creator-message-composer__input { min-width: 0; }
  .creator-messages-page .creator-messages-composer textarea { padding-right: 132px; height: 20px; min-height: 20px; padding: 0 92px 0 0; font-size: var(--text-card-title-size); line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .creator-messages-page .creator-message-composer__meta { gap: 10px; right: 8px; }
  .creator-messages-page .creator-message-composer__inline-tools { gap: 10px; }
  .creator-messages-page .creator-message-composer__inline-tools > button { flex: 0 0 24px; width: 24px; height: 24px; }
  .creator-messages-page .creator-messages-composer-emoji { flex-basis: 22px; width: 24px; height: 24px; flex: 0 0 24px;
  }
  .creator-messages-page .creator-messages-composer-tool { flex-basis: 22px; width: 24px; height: 24px; font-size: var(--text-section-title-size); }
  .creator-messages-page .creator-message-composer__attach { flex-basis: 38px; width: 38px; height: 38px; font-size: var(--text-lead-size); }
  .creator-messages-page .creator-message-composer__inline-tools > button:not([data-message-file-target="zipFile"]),
  .creator-messages-page .creator-message-composer__inline-tools > .btnShowVault,
  .creator-messages-page .creator-message-composer__inline-tools > [id="setPrice"] { display: none; }
}

@media (max-width: 767.98px) {
  .creator-feed-page--messages {
    --messages-mobile-header-height: 72px;
    --messages-mobile-bottom-nav-height: 72px;
    --messages-mobile-shell-height: calc(100dvh - var(--messages-mobile-header-height) - var(--messages-mobile-bottom-nav-height) - env(safe-area-inset-bottom));
    min-height: 100dvh;
    padding-bottom: 0;
    overflow: hidden;
  }

  .creator-feed-page--messages .auth-mobile-header__inner {
    margin-bottom: 0;
  }

  .creator-feed-page--messages .creator-feed-shell,
  .creator-feed-page--messages .creator-feed-shell-main--messages {
    min-height: 0;
    height: auto;
    overflow: hidden;
  }

  .creator-feed-page--messages .creator-sidebar-create-wrap--mobile-fab {
    display: none !important;
  }

  .creator-feed-page--messages .creator-messages-page {
    height: var(--messages-mobile-shell-height);
    min-height: 0;
    overflow: hidden;
  }

  .creator-feed-page--messages .creator-messages-workspace {
    display: block;
    grid-template-columns: 1fr;
    height: 100%;
    min-height: 0;
    max-height: none;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    background: var(--auth-surface-2);
  }

  .creator-feed-page--messages .creator-messages-workspace[data-mobile-thread-mode="list"] .creator-messages-thread,
  .creator-feed-page--messages .creator-messages-workspace[data-mobile-thread-mode="list"] .creator-messages-thread--empty,
  .creator-feed-page--messages .creator-messages-workspace[data-mobile-thread-mode="thread"] .creator-messages-sidebar {
    display: none !important;
  }

  .creator-feed-page--messages .creator-messages-workspace[data-mobile-thread-mode="list"] .creator-messages-sidebar,
  .creator-feed-page--messages .creator-messages-workspace[data-mobile-thread-mode="thread"] .creator-messages-thread {
    display: flex;
  }

  .creator-feed-page--messages .creator-messages-sidebar,
  .creator-feed-page--messages .creator-messages-thread {
    height: 100%;
    min-height: 0;
    border-right: 0;
    border-radius: 0;
    background: var(--auth-surface-2);
  }

  .creator-feed-page--messages .creator-messages-sidebar-header {
    min-height: 56px;
    padding: 8px 0;
    flex: 0 0 auto;
  }

  .creator-feed-page--messages .creator-messages-sidebar-title {
    gap: 8px;
  }

  .creator-feed-page--messages .creator-messages-sidebar-header h1 {
    font-size: var(--text-card-title-size);
    line-height: 1.2;
  }

  .creator-feed-page--messages .creator-messages-header-action {
    display: none;
    width: 38px;
    height: 38px;
    background: #f5f7fb;
    color: #17305c;
  }

  .creator-feed-page--messages .creator-messages-filters {
    flex: 0 0 auto;
    gap: 7px;
    padding: 8px 14px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .creator-feed-page--messages .creator-messages-filters::-webkit-scrollbar {
    display: none;
  }

  .creator-feed-page--messages .creator-messages-filter-chip {
    min-height: 32px;
    padding: 0 12px;
    font-size: var(--text-caption-size);
    flex: 0 0 auto;
  }

  .creator-feed-page--messages .creator-messages-sidebar-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: 8px;
  }

  .creator-feed-page--messages .creator-messages-list {
    padding: 8px 0;
  }

  .creator-feed-page--messages .creator-messages-row {
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 76px;
    padding: 10px 12px;
    margin-bottom: 4px;
    border-radius: 12px;
  }

  .creator-feed-page--messages .creator-messages-avatar {
    width: 48px;
    height: 48px;
  }

  .creator-feed-page--messages .creator-messages-row-top,
  .creator-feed-page--messages .creator-messages-row-bottom {
    align-items: center;
  }

  .creator-feed-page--messages .creator-messages-preview {
    max-width: 100%;
  }

  .creator-feed-page--messages .creator-messages-unread-badge {
    min-width: 18px;
    height: 18px;
  }

  .creator-feed-page--messages .creator-messages-thread-header {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    min-height: 64px;
    padding: 8px 0;
  }

  .creator-feed-page--messages .creator-messages-thread-header-main {
    min-width: 0;
    flex: 1 1 auto;
  }

  .creator-feed-page--messages .creator-messages-thread-back {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    background: #f5f7fb;
    color: #17305c;
  }

  .creator-feed-page--messages .creator-messages-thread-user {
    gap: 8px;
  }

  .creator-feed-page--messages .creator-messages-thread-user .creator-messages-avatar {
    width: 40px;
    height: 40px;
  }

  .creator-feed-page--messages .creator-messages-thread-identity strong {
    font-size: var(--text-body-size);
    line-height: 1.2;
  }

  .creator-feed-page--messages .creator-messages-thread-identity small {
    font-size: var(--text-caption-size);
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .creator-feed-page--messages .creator-messages-thread-actions {
    flex: 0 0 auto;
    gap: 6px;
  }

  .creator-feed-page--messages .creator-messages-thread-icon {
    width: 38px;
    height: 38px;
    background: #f5f7fb;
    color: #17305c;
  }

  .creator-feed-page--messages .creator-messages-thread-submit {
    min-height: 34px;
    height: auto;
    padding: 0 10px;
    white-space: nowrap;
  }

  .creator-feed-page--messages .creator-messages-thread-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px 0;
    display: block;
  }

  .creator-feed-page--messages .creator-message-item {
    margin-bottom: 9px;
  }

  .creator-feed-page--messages .creator-message-stack,
  .creator-feed-page--messages .creator-message-item.is-own .creator-message-stack {
    max-width: min(84%, 330px);
  }

  .creator-feed-page--messages .creator-message-avatar-spacer,
  .creator-feed-page--messages .creator-message-avatar {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
  }

  .creator-feed-page--messages .creator-message-bubble {
    padding: 8px 11px;
    font-size: var(--text-meta-size);
    line-height: 1.4;
  }

  .creator-feed-page--messages .creator-message-bubble--media {
    max-width: min(76vw, 260px);
    padding: 0;
  }

  .creator-feed-page--messages .creator-messages-composer-wrap {
    position: relative;
    bottom: auto;
    flex: 0 0 auto;
    z-index: 3;
  }

  .creator-feed-page--messages .creator-messages-composer {
    padding: 8px 10px;
    gap: 6px;
  }

  .creator-feed-page--messages .creator-message-composer__row {
    gap: 8px;
    align-items: center;
  }

  .creator-feed-page--messages .creator-message-composer__attach,
  .creator-feed-page--messages .creator-messages-send-btn {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    align-self: center;
  }

  .creator-feed-page--messages .creator-message-composer__field {
    min-height: 44px;
    padding: 10px;
    display: flex;
    align-items: center;
  }

  .creator-feed-page--messages .creator-message-composer__input {
    width: 100%;
    min-width: 0;
  }

  .creator-feed-page--messages .creator-messages-composer textarea {
    min-height: 22px;
    height: 22px;
    max-height: 88px;
    padding: 0;
    padding-right: 0;
    font-size: var(--text-body-size);
    line-height: 22px;
    white-space: pre-wrap;
    text-overflow: clip;
  }

  .creator-feed-page--messages .creator-message-composer__meta {
    right: 10px;
    gap: 6px;
  }

  .creator-feed-page--messages .creator-message-composer__inline-tools {
    gap: 6px;
  }

  .creator-feed-page--messages .creator-messages-composer-tool,
  .creator-feed-page--messages .creator-message-composer__inline-tools > button,
  .creator-feed-page--messages .creator-messages-composer-emoji {
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
  }

  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-workspace,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-sidebar,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-thread,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-sidebar-header,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-thread-header,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-thread-body {
    background: var(--bg-card);
  }

  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-header-action,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-thread-back,
  html[data-theme="dark"] .creator-feed-page--messages .creator-messages-thread-icon {
    background: var(--bg-muted);
    color: var(--text-primary);
  }
}

.creator-feed-top-creators {
  overflow: hidden;
}

.creator-feed-creators-carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(175px, 1fr);
  grid-template-rows: 1fr;
  gap: 14px;
  overflow-x: auto;
  padding: 8px 0 12px;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.creator-feed-creators-carousel::-webkit-scrollbar {
  display: none;
}

.creator-feed-creator-preview-card {
  min-width: 0;
  overflow: hidden;
  background: var(--auth-surface-2);
  border: 1px solid var(--auth-border);
  border-radius: 17px;
  
  scroll-snap-align: start;
}

.creator-feed-creator-cover {
  position: relative;
  display: block;
  width: 100%;
  height: 150px;
  overflow: hidden;
  background: #dce9e9;
}

.creator-feed-creator-cover img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-feed-creator-cover-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: #dce9e9;
}

.creator-feed-creator-content {
  position: relative;
  min-height: 84px;
  padding: 20px 10px 11px;
}

.creator-feed-creator-avatar {
  position: absolute;
  top: -18px;
  left: 10px;
  width: 34px;
  height: 34px;
  overflow: hidden;
  border: 2px solid #fff;
  border-radius: 50%;
  background: var(--auth-surface-2);
  
}

.creator-feed-creator-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-feed-creator-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.creator-feed-creator-identity {
  min-width: 0;
}

.creator-feed-creator-name {
  display: flex;
  align-items: center;
  gap: 3px;
  overflow: hidden;
  color: #202124;
  font-size: var(--text-body-size);
  font-weight: 650;
  line-height: 1.25;
  text-decoration: none;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--text-primary);
}

.creator-feed-creator-name .bi-patch-check-fill {
  flex: 0 0 auto;
  color: #d927ff;
  font-size: var(--text-caption-size);
}

.creator-feed-creator-profession {
  display: block;
  margin-top: 2px;
  overflow: hidden;
  color: #878b91;
  font-size: var(--text-table-size);
  line-height: 1.2;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.creator-feed-view-profile-btn {
  flex: 0 0 auto;
  padding: 7px 10px;
  color: #fff;
  font-size: var(--text-table-size);
  font-weight: 500;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  background: #777;
  border-radius: var(--radius-sm);
}

.creator-feed-view-profile-btn:hover {
  color: #fff;
  background: #5f5f5f;
}

.creator-feed-creator-bio {
  margin: 8px 0 0;
  overflow: hidden;
  color: #888c92;
  font-size: var(--text-table-size);
  line-height: 1.35;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (min-width: 768px) {
  .creator-feed-creators-carousel {
    grid-auto-columns: minmax(280px, calc((100% - 28px) / 3.2));
  }
}

@media (max-width: 575.98px) {
.creator-feed-creators-carousel {
    grid-auto-columns: 78%;
  }
}

/* Creator User For You only. */
.creator-for-you-page .creator-feed-shell {
  column-gap: 10px;
}

.creator-for-you-page .creator-feed-feed-panel,
.creator-for-you-page .creator-user-for-you,
.creator-for-you-page .creator-feed-campaigner-for-you {
  width: 100%;
  min-width: 0;
}

.creator-for-you-page .creator-user-for-you > .grid-updates,
.creator-for-you-page .creator-feed-campaigner-for-you > .grid-updates {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.creator-for-you-page .creator-feed-composer-card {
  margin-bottom: 18px;
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
}

.creator-for-you-page .creator-feed-composer-trigger {
  gap: 10px;
}

.creator-for-you-page .creator-feed-composer-avatar {
  width: 44px;
  height: 44px;
}

.creator-for-you-page .creator-feed-composer-pill {
  min-height: 44px;
  border: 0;
  border-radius: var(--radius-lg);
  background: #89898913;
  font-size: var(--text-body-size);
  color: var(--text-secondary);
}

.creator-for-you-page .creator-feed-notice-card {
  margin-bottom: 18px;
  min-height: 48px;
  border: 0;
  border-radius: 10px;
  box-shadow: none;
  background: #89898913;
  justify-content: center;
}

.creator-for-you-page .creator-feed-stories-card {
  margin-bottom: 18px;
  overflow: hidden;
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
}

.creator-for-you-page .creator-feed-stories-wrapper {
  gap: 12px;
  padding: 0;
}

.creator-for-you-page .creator-feed-stories-wrapper .add-story,
.creator-for-you-page .creator-feed-stories-wrapper.stories.carousel .story {
  flex: 0 0 118px;
  width: 118px;
  height: 176px;
  margin: 0;
}

.creator-for-you-page .creator-feed-stories-wrapper .item-add-story,
.creator-for-you-page .creator-feed-stories-wrapper.stories.carousel .story > .item-link {
  border-radius: var(--radius-md);
}

.creator-for-you-page .creator-feed-block {
  min-width: 0;
}

.creator-for-you-page .creator-feed-post-card {
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  border-bottom: 1px solid var(--border-color);
}

.creator-for-you-page .creator-feed-feed-wrap .card-updates.creator-feed-post-card,
.creator-for-you-page.creator-feed-page .card-updates.creator-feed-post-card {
  border: 0;
  border-bottom: 1px solid var(--border-color);
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

html[data-theme="dark"] .creator-for-you-page .creator-feed-feed-wrap .card-updates.creator-feed-post-card,
html[data-theme="dark"] .creator-for-you-page.creator-feed-page .card-updates.creator-feed-post-card {
  border: 0;
  border-bottom: 1px solid var(--border-color);
  box-shadow: none;
  background: transparent;
}

.creator-for-you-page .creator-feed-post-card .creator-feed-post-header {
  align-items: center;
}

.creator-for-you-page .creator-feed-post-card .avatarUser {
  width: 42px;
  height: 42px;
}

.creator-for-you-page .creator-feed-post-author-name {
  font-size: var(--text-card-title-size);
  font-weight: 500;
}

.creator-for-you-page .creator-feed-post-username,
.creator-for-you-page .creator-feed-post-timestamp,
.creator-for-you-page .creator-feed-post-visibility {
  font-size: var(--text-micro-size);
}

.creator-for-you-page .creator-feed-post-card .creator-feed-post-copy-wrap {
  padding: 0 8px 12px;
}

.creator-for-you-page .creator-feed-post-card .creator-feed-post-copy {
  font-size: var(--text-body-size);
  line-height: 1.38;
}

.creator-for-you-page .creator-feed-post-media-block {
  margin: 0;
  padding: 0;
}

.creator-for-you-page .creator-feed-post-media-single,
.creator-for-you-page .creator-feed-post-gallery,
.creator-for-you-page .container-post-media {
  border-radius: 7px;
  overflow: hidden;
}

.creator-for-you-page .creator-feed-video-media {
  position: relative;
  width: 100%;
  aspect-ratio: var(--creator-feed-video-ratio, 16 / 9);
  overflow: hidden;
  background: #000;
  border-radius: 7px;
}

.creator-for-you-page .creator-feed-video-media > video,
.creator-for-you-page .creator-feed-video-media > .plyr,
.creator-for-you-page .creator-feed-video-media .plyr__video-wrapper,
.creator-for-you-page .creator-feed-video-media .plyr__video-wrapper--fixed-ratio {
  width: 100%;
  height: 100%;
  max-height: none;
}

.creator-for-you-page .creator-feed-video-media > .plyr {
  min-width: 0;
  overflow: hidden;
  border-radius: inherit;
}

.creator-for-you-page .creator-feed-video-media .plyr__video-wrapper,
.creator-for-you-page .creator-feed-video-media .plyr__video-wrapper--fixed-ratio {
  padding-bottom: 0 !important;
  aspect-ratio: auto !important;
  background: #000;
}

.creator-for-you-page .creator-feed-video-media video,
.creator-for-you-page .creator-feed-video-media iframe,
.creator-for-you-page .creator-feed-video-media .video-js {
  width: 100%;
  height: 100%;
  max-height: none;
  display: block;
  object-fit: contain;
  background: #000;
}

.creator-for-you-page .creator-feed-video-media .plyr__poster {
  width: 100%;
  height: 100%;
  background-size: contain;
  background-color: #000;
}

.creator-for-you-page .creator-feed-post-card .footer-updates {
  padding: 12px 8px 0;
  border-top: 0;
}

.creator-for-you-page .for-you-post-btn,
.creator-for-you-page .creator-feed-post-menu-trigger.creator-feed-secondary-btn {
  width: auto;
  min-width: 82px;
  min-height: 31px;
  margin: 0;
  border: 1px solid var(--text-primary);
  border-radius: 9px;
  background: transparent;
  color: var(--text-primary);
  font-size: var(--text-micro-size);
  font-weight: 500;
}

.creator-for-you-page .creator-user-for-you-discovery {
  overflow: hidden;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  padding: 0 0 18px;
  border-bottom: 1px solid var(--border-color);
}

.creator-for-you-page .creator-user-for-you-section-heading,
.creator-feed-normal-user-for-you .creator-user-for-you-section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 12px;
  padding: 0 8px;
}

.creator-for-you-page .creator-user-for-you-section-heading span,
.creator-feed-normal-user-for-you .creator-user-for-you-section-heading span {
  display: block;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.2;
}

.creator-for-you-page .creator-user-for-you-section-heading h3,
.creator-feed-normal-user-for-you .creator-user-for-you-section-heading h3 {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  font-size: var(--text-lead-size);
  font-weight: 700;
  line-height: 1.2;
}

.creator-for-you-page .creator-user-for-you-section-heading h3 > span,
.creator-feed-normal-user-for-you .creator-user-for-you-section-heading h3 > span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #26a542;
}

.creator-for-you-page .creator-user-for-you-section-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.creator-for-you-page .creator-user-for-you-section-controls button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: #D9D9D970;
  color: var(--text-secondary);
}

.creator-for-you-page .creator-user-for-you-carousel {
  display: grid;
  grid-auto-flow: column;
  gap: 14px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding: 0 8px 2px;
  scroll-padding-inline: 8px;
}

.creator-for-you-page .creator-user-for-you-carousel::-webkit-scrollbar {
  display: none;
}

.creator-for-you-page .creator-user-for-you-campaign-carousel {
  grid-auto-columns: minmax(320px, calc((100% - 28px) / 2.35));
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel,
.creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel,
.creator-feed-campaigner-campaign-carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(320px, calc((100% - 28px) / 3));
  gap: 14px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  scroll-padding-inline: 8px;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel::-webkit-scrollbar,
.creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel::-webkit-scrollbar,
.creator-feed-campaigner-campaign-carousel::-webkit-scrollbar {
  display: none;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card,
.creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel .creator-campaign-card,
.creator-feed-campaigner-campaign-carousel .creator-campaign-card {
  min-width: 0;
  scroll-snap-align: start;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card-media,
.creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel .creator-campaign-card-media,
.creator-feed-campaigner-campaign-carousel .creator-campaign-card-media {
  height: 150px;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card,
.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card-media,
.creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel .creator-campaign-card,
.creator-feed-campaigner-campaign-carousel .creator-campaign-card {
  border-radius: 10px;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card-body,
.creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel .creator-campaign-card-body,
.creator-feed-campaigner-campaign-carousel .creator-campaign-card-body {
  padding: 10px;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card-title {
  font-size: var(--text-card-title-size);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-card-description {
  font-size: var(--text-meta-size);
  -webkit-line-clamp: 2;
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-finance {
  gap: 8px;
  font-size: var(--text-meta-size);
}

.campaigner-home-page .creator-feed-campaigner-campaign-carousel .creator-campaign-progress {
  margin-top: 0;
}

.creator-for-you-page .creator-user-for-you-campaign-card,
.creator-for-you-page .creator-user-for-you-creator-card {
  min-width: 0;
  overflow: hidden;
  scroll-snap-align: start;
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 10px;
}

.creator-for-you-page .creator-user-for-you-campaign-media {
  position: relative;
  display: block;
  /*aspect-ratio: 1.72 / 1;*/
  overflow: hidden;
  color: inherit;
  height: 200px;
}

.creator-for-you-page .creator-user-for-you-campaign-media img,
.creator-for-you-page .creator-user-for-you-creator-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-for-you-page .creator-user-for-you-campaign-media span {
  position: absolute;
  right: 8px;
  bottom: 8px;
  max-width: calc(100% - 16px);
  padding: 4px 8px;
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,.88);
  color: #111827;
  font-size: var(--text-caption-size);
  line-height: 1;
}

.creator-for-you-page .creator-user-for-you-campaign-body {
  padding: 10px 10px 12px;
}

.creator-for-you-page .creator-user-for-you-campaign-owner {
  display: flex;
  align-items: center;
  min-width: 0;
}

.creator-for-you-page .creator-user-for-you-campaign-meta {
  display: flex;
  align-items: center;
  min-width: 0;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

.creator-user-for-you-campaign-owner {
  gap: 6px;
}

.creator-user-for-you-campaign-owner img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.creator-user-for-you-campaign-owner strong {
  overflow: hidden;
  max-width: 94px;
  color: var(--text-primary);
  font-size: var(--text-table-size);
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-for-you-page .creator-user-for-you-campaign-owner small {
  color: var(--text-secondary);
  font-size: var(--text-card-title-size);
}

.creator-for-you-page .creator-user-for-you-campaign-owner .bi-patch-check-fill,
.creator-for-you-page .creator-user-for-you-creator-name .bi-patch-check-fill,
.creator-feed-normal-user-for-you .creator-user-for-you-creator-name .bi-patch-check-fill {
  color: #d927ff;
  font-size: var(--text-body-size);
}

.creator-for-you-page .creator-user-for-you-campaign-platforms {
  display: flex;
  align-items: center;
  min-width: 0;
  flex: 0 0 auto;
  gap: 4px;
  color: var(--brand-primary);
  font-size: var(--text-body-size);
}

.creator-for-you-page .creator-user-for-you-campaign-title, .creator-user-for-you-campaign-title {
  display: block;
  overflow: hidden;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-for-you-page .creator-user-for-you-campaign-body p, .creator-user-for-you-campaign-body p {
  display: -webkit-box;
  min-height: 34px;
  margin: 5px 0 10px;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.creator-for-you-page .creator-user-for-you-campaign-stats,
.creator-user-for-you-campaign-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  line-height: 1.2;
}

.creator-for-you-page .creator-user-for-you-campaign-stats span,
.creator-user-for-you-campaign-stats span {
  min-width: 0;
}

.creator-for-you-page .creator-user-for-you-campaign-stats strong,
.creator-user-for-you-campaign-stats strong {
  display: block;
  margin-bottom: 2px;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  font-weight: 650;
}

.creator-for-you-page .creator-user-for-you-campaign-progress,
.creator-user-for-you-campaign-progress {
  height: 5px;
  margin-top: 10px;
  overflow: hidden;
  border-radius: var(--radius-pill);
  background: var(--auth-surface-2);
}

.creator-for-you-page .creator-user-for-you-campaign-progress span,
.creator-user-for-you-campaign-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--brand-primary);
}

.creator-for-you-page .creator-user-for-you-creators-carousel {
  grid-auto-columns: minmax(280px, calc((100% - 28px) / 3.2));
}

.creator-for-you-page .creator-user-for-you-creator-cover {
  display: block;
  background: var(--auth-surface-2);
  height: 150px;
}

.creator-for-you-page .creator-user-for-you-creator-cover span {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--auth-surface-2);
}

.creator-for-you-page .creator-user-for-you-creator-body {
  position: relative;
  min-height: 120px;
  padding: 24px 10px 12px;
}

.creator-for-you-page .creator-user-for-you-creator-avatar {
  position: absolute;
  top: -19px;
  left: 10px;
  width: 40px;
  height: 40px;
  overflow: hidden;
  /*border: 2px solid var(--bg-card);*/
  border-radius: 50%;
  background: var(--bg-card);
}

.creator-for-you-page .creator-user-for-you-creator-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.creator-for-you-page .creator-user-for-you-creator-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.creator-for-you-page .creator-user-for-you-creator-head > div {
  min-width: 0;
}

.creator-for-you-page .creator-user-for-you-creator-name {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow: hidden;
  color: var(--text-primary);
  font-size: var(--text-body-size);
  font-weight: 650;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-for-you-page .creator-user-for-you-creator-head small {
  display: block;
  overflow: hidden;
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-for-you-page .creator-user-for-you-creator-head .creator-feed-secondary-btn {
  width: auto;
  min-height: 31px;
  margin: 0;
  padding: 0 10px;
  border-radius: 9px;
  background: #5f6268;
  color: #fff;
  font-size: var(--text-table-size);
}

.creator-for-you-page .creator-user-for-you-creator-body p {
  display: -webkit-box;
  overflow: hidden;
  margin: 10px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
  line-height: 1.4;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.creator-for-you-page .creator-user-for-you-subscription-state {
  display: inline-flex;
  margin-top: 10px;
  color: var(--text-secondary);
  font-size: var(--text-meta-size);
}

html[data-theme="dark"] .creator-for-you-page .creator-user-for-you-campaign-media span {
  background: rgba(17,24,39,.86);
  color: #fff;
}

@media (max-width: 991.98px) {
  .creator-for-you-page .creator-feed-shell-main {
    max-width: none;
  }
}

@media (max-width: 575.98px) {
  .creator-for-you-page .creator-feed-composer-card,
  .creator-for-you-page .creator-feed-notice-card,
  .creator-for-you-page .creator-feed-stories-card {
    margin-bottom: 0;
  }

  .creator-for-you-page .creator-user-for-you > .grid-updates {
    gap: 15px;
  }

  .creator-for-you-page .creator-feed-stories-wrapper .add-story,
  .creator-for-you-page .creator-feed-stories-wrapper.stories.carousel .story {
    flex-basis: 104px;
    width: 104px;
    height: 156px;
  }

  .creator-for-you-page .creator-user-for-you-campaign-carousel {
    grid-auto-columns: 82%;
  }

  .campaigner-home-page .creator-feed-campaigner-campaign-carousel,
  .creator-feed-normal-user-for-you .creator-feed-campaigner-campaign-carousel,
  .creator-feed-campaigner-campaign-carousel{
    grid-auto-columns: 82%;
  }

  .creator-for-you-page .creator-user-for-you-creators-carousel {
    grid-auto-columns: 72%;
  }

  .creator-for-you-page .creator-feed-post-card .creator-feed-post-card-body,
  .creator-for-you-page .creator-feed-post-card .creator-feed-post-copy-wrap,
  .creator-for-you-page .creator-feed-post-media-block,
  .creator-for-you-page .creator-feed-post-card .footer-updates,
  .creator-for-you-page .creator-user-for-you-section-heading,
  .creator-feed-normal-user-for-you .creator-user-for-you-section-heading,
  .creator-for-you-page .creator-user-for-you-carousel {
    padding: 0;
  }
}


/* Explore: Campaign marketplace carousel */
.creator-feed-explore-campaigns {
  padding: 0;
  overflow: hidden;
  border-radius: 0;
  box-shadow: none;
}

.creator-feed-explore-campaigns .creator-feed-section-heading {
  margin-bottom: 8px;
  padding-inline: 2px;
}

.creator-feed-explore-campaigns .creator-feed-section-heading h3::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 5px;
  border-radius: 50%;
  background: #21a51c;
  vertical-align: 1px;
}

.creator-feed-trending-campaigns-carousel {
  gap: 10px;
  padding: 8px 2px 4px;
  scroll-padding-inline: 2px;
}

.creator-feed-trending-campaign-card {
  display: flex;
  flex: 0 0 300px;
  min-width: 300px;
  flex-direction: column; 
  overflow: hidden;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  
  scroll-snap-align: start;
}



.creator-feed-trending-campaign-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 180ms ease;
}

.creator-feed-trending-campaign-card:hover .creator-feed-trending-campaign-media img {
  transform: scale(1.025);
}
.creator-feed-trending-campaign-media {
  position: relative;
  display: block;
  /*aspect-ratio: 1.72 / 1;*/
  margin: 10px 10px 0;
  height: 160px;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--bg-muted);
}

.creator-feed-trending-campaign-media > span {
  position: absolute;
  top: 7px;
  right: 7px;
  max-width: 160px;
  padding: 3px 7px;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, 0.94);
  color: #334155;
  font-size: var(--text-badge-size);
  font-weight: 650;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-feed-trending-campaign-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  padding: 9px 10px 10px;
}

.creator-feed-trending-campaign-owner-row {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 6px;
}

.creator-feed-trending-campaign-owner-row > img,
.creator-feed-trending-campaign-avatar-fallback {
  display: inline-grid;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 50%;
  background: var(--bg-muted);
  color: var(--text-primary);
  font-size: var(--text-caption-size);
  font-weight: 700;
  object-fit: cover;
}

.creator-feed-trending-campaign-owner-copy {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  align-items: center;
  gap: 4px;
}

.creator-feed-trending-campaign-owner-copy strong {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 3px;
  overflow: hidden;
  color: var(--text-primary);
  font-size: var(--text-caption-size);
  font-weight: 650;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-feed-trending-campaign-owner-copy strong i {
  flex: 0 0 auto;
  color: var(--brand-primary);
  font-size: var(--text-badge-size);
}

.creator-feed-trending-campaign-owner-copy small {
  flex: 0 0 auto;
  color: var(--text-secondary);
  font-size: var(--text-badge-size);
  line-height: 1.1;
  white-space: nowrap;
}

.creator-feed-trending-campaign-platforms {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}

.creator-feed-trending-campaign-platforms span {
  display: inline-grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border-radius: 50%;
  background: var(--bg-muted);
  color: var(--text-primary);
  font-size: var(--text-badge-size);
}

.creator-feed-trending-campaign-title {
  display: -webkit-box;
  min-height: 34px;
  overflow: hidden;
  margin-top: 8px;
  color: var(--text-primary);
  font-size: var(--text-card-title-size);
  font-weight: 700;
  line-height: 1.22;
  text-decoration: none;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.creator-feed-trending-campaign-title:hover {
  color: var(--text-primary);
  text-decoration: none;
}

.creator-feed-trending-campaign-body > p {
  display: -webkit-box;
  min-height: 34px;
  overflow: hidden;
  margin: 5px 0 9px;
  color: var(--text-secondary);
  font-size: var(--text-caption-size);
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.creator-feed-trending-campaign-finance {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(58px, auto);
  gap: 10px;
  margin-top: auto;
}

.creator-feed-trending-campaign-finance span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
}

.creator-feed-trending-campaign-finance span:last-child {
  align-items: flex-end;
  text-align: right;
}

.creator-feed-trending-campaign-finance small {
  color: var(--text-secondary);
  font-size: var(--text-badge-size);
  font-weight: 600;
  line-height: 1;
}

.creator-feed-trending-campaign-finance strong {
  overflow: hidden;
  color: var(--text-primary);
  font-size: var(--text-caption-size);
  font-weight: 700;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-feed-trending-campaign-progress {
  height: 4px;
  margin-top: 8px;
  overflow: hidden;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--border-color) 78%, transparent);
}

.creator-feed-trending-campaign-progress span {
  display: block;
  min-width: 3px;
  height: 100%;
  border-radius: inherit;
  background: #3f51b5;
}

.creator-feed-trending-campaign-bottom-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: var(--text-caption-size);
  font-weight: 600;
  line-height: 1.2;
}

.creator-feed-trending-campaign-bottom-meta span {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.creator-feed-trending-campaign-cta {
  width: 100%;
  min-height: var(--control-height-sm);
  margin-top: 10px;
  font-size: var(--text-button-size);
}

html[data-theme="dark"] .creator-feed-trending-campaign-media > span {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(15, 23, 42, 0.88);
  color: #e2e8f0;
}

@media (max-width: 767.98px) {
  .creator-feed-trending-campaign-card {
    flex-basis: 214px;
    min-width: 214px;
  } 
  .creator-for-you-page .creator-feed-stories-wrapper{
      padding: 8px 15px;
  }
}

/* Explore > Top Creators — Figma creator card */
.creator-feed-explore-top-creators {
  overflow: hidden;
  padding: 0;
}

.creator-feed-explore-top-creators .creator-feed-section-heading {
  margin-bottom: 14px;
}

.creator-feed-explore-creators-carousel {
  grid-auto-columns: calc(22% - 10.5px);
  gap: 14px;
  padding: 8px 0 12px;
  scroll-padding-inline: 0;
}

.creator-feed-explore-creators-carousel .creator-feed-creator-preview-card {
  min-height: 185px;
}

html[data-theme="dark"] .creator-feed-explore-creators-carousel .creator-feed-creator-preview-card {
  background: var(--bg-card);
  border-color: var(--border-color);
}

html[data-theme="dark"] .creator-feed-explore-creators-carousel .creator-feed-creator-name {
  color: var(--text-primary);
}


@media (max-width: 991.98px) {
  .creator-feed-explore-creators-carousel {
    grid-auto-columns: calc(33.3333% - 9.3333px);
  }
  .creator-profile-content-layout{
      grid-template-columns: 1fr!important;
  }
  .creator-profile-identity-row--creator .profile_button{
      margin-top:-113px;
  }

.creator-profile-identity-row--creator .profile_button .creator-feed-secondary-btn{
    width: 127px;
    padding: 15px 10px;
} 
.creator-feed-page--profile .creator-profile-post-list .creator-feed-post-media-block{
    padding:0;
}
.main-container-responsive{
    padding-left: 15px!important;
    padding-right: 15px!important;
}
}

@media (max-width: 767.98px) {
  .creator-feed-explore-creators-carousel {
    grid-auto-columns: calc(50% - 7px);
  }
}

@media (max-width: 575.98px) {
  .creator-feed-explore-creators-carousel {
    grid-auto-columns: 78%;
  }
}
.cpm-data-main{
    font-size: 14px;
    font-weight: 500;
}
.cpm-data{
        margin-right: 10px;
    border: 1px var(--text-secondary) solid;
    padding: 3px 10px;
    border-radius: 10px;
}
.creator-profile-content-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 24px;
    align-items: start;
    width: 100%;
}

.creator-profile-content-main {
    min-width: 0;
    width: 100%;
}

.creator-profile-right-sidebar {
    min-width: 0;
    width: 300px;
    align-self: start;
    position: sticky;
    top: 10px;
}

.creator-profile-right-sidebar > * {
    width: 100%;
}

/* =========================================================
   CREATOR SUBSCRIPTION MODAL — FIGMA FINAL OVERRIDE
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__dialog {
    width: calc(100% - 32px);
    max-width: 390px;
    margin: 20px auto;
}

.creator-subscription-modal .creator-subscription-modal__surface {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: 12px;
    background: var(--bg-card, #fff);
    
}


/* =========================================================
   FIGMA TOP AREA
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__hero {
    position: relative;
    height: 105px;
    min-height: 105px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background-image: none !important;
    background: #071f92 !important;
}

/* Hide old hero text while preserving the markup */
.creator-subscription-modal .creator-subscription-modal__hero
.creator-subscription-modal__eyebrow,
.creator-subscription-modal .creator-subscription-modal__hero h4,
.creator-subscription-modal .creator-subscription-modal__hero p {
    display: none;
}

.creator-subscription-modal .creator-subscription-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    line-height: 1;
}


/* =========================================================
   CREATOR IDENTITY / AVATAR
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__body {
    position: relative;
    padding: 0;
    background: var(--bg-card, #fff);
    padding-left: 15px;
    padding-right: 15px;
}

.creator-subscription-modal .creator-subscription-modal__identity {
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: center;
    width: 100%;
    margin: -38px 0 0;
    padding: 0;
}

/* Figma only shows avatar here */
.creator-subscription-modal .creator-subscription-modal__identity > div {
    display: none;
}

.creator-subscription-modal .creator-subscription-modal__avatar {
    display: block;
    width: 76px;
    height: 76px;
    margin: 0;
    object-fit: cover;
    border: 3px solid #fff;
    border-radius: 50%;
    background: var(--auth-surface-2);
    
}


/* =========================================================
   FORM
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__form {
    width: 100%;
    margin: 0;
    padding: 16px 28px 24px;
}


/* =========================================================
   MONTHLY SUMMARY
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__summary {
    width: 100%;
    max-width: 280px;
    margin: 0 auto 14px;
    text-align: center;
}

.creator-subscription-modal .creator-subscription-modal__summary p {
    margin: 0;
    color: var(--text-primary, #172033);
    font-size: var(--text-meta-size);
    font-weight: 500;
    line-height: 1.35;
}

.creator-subscription-modal .creator-subscription-modal__summary p strong {
    font-weight: 700;
}

.creator-subscription-modal .creator-subscription-modal__summary small {
    display: block;
    margin-top: 2px;
    color: var(--text-secondary, #64748b);
    font-size: var(--text-micro-size);
    line-height: 1.3;
}


/* =========================================================
   SECTIONS
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__compact-section {
    width: 100%;
    margin-top: 14px;
}

.creator-subscription-modal .creator-subscription-modal__compact-section h5 {
    margin: 0 0 8px;
    color: var(--text-primary, #172033);
    font-size: var(--text-meta-size);
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
}


/* =========================================================
   BENEFITS
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__benefits {
    width: 100%;
    max-width: 270px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.creator-subscription-modal .creator-subscription-modal__benefits li {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin: 0 0 6px;
    padding: 0;
    color: var(--text-secondary, #64748b);
    font-size: var(--text-micro-size);
    line-height: 1.35;
}

.creator-subscription-modal .creator-subscription-modal__benefits li:last-child {
    margin-bottom: 0;
}

.creator-subscription-modal .creator-subscription-modal__benefits li i {
    flex: 0 0 auto;
    margin-top: 1px;
    color: #0aa84f;
}


/* =========================================================
   PAYMENT GATEWAY
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__gateway-title {
    margin-top: 2px;
    text-transform: uppercase;
}

.creator-subscription-modal .creator-subscription-modal__gateway-list {
    width: 100%;
    max-width: 270px;
    margin: 0 auto;
}

.creator-subscription-modal .creator-subscription-modal__gateway-row {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 0 5px;
    padding: 0;
    cursor: pointer;
}

.creator-subscription-modal .creator-subscription-modal__gateway-row input {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    margin: 0 9px 0 0;
}

.creator-subscription-modal .creator-subscription-modal__gateway-content {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    color: var(--text-primary, #172033);
    font-size: var(--text-micro-size);
    line-height: 1.3;
}

.creator-subscription-modal .creator-subscription-modal__gateway-content strong {
    font-weight: 500;
}

.creator-subscription-modal .creator-subscription-modal__gateway-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.creator-subscription-modal .creator-subscription-modal__transaction-fee {
    display: block;
    width: 100%;
    margin: 2px 0 0;
    padding-left: 23px;
    color: var(--text-secondary, #64748b);
    font-size: var(--text-micro-size);
    line-height: 1.3;
}


/* =========================================================
   TERMS
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__terms {
    display: flex;
    align-items: flex-start;
    width: 100%;
    max-width: 270px;
    margin: 14px auto;
    padding: 0;
    gap: 7px;
    color: var(--text-secondary, #64748b);
    font-size: var(--text-micro-size);
    line-height: 1.35;
}

.creator-subscription-modal .creator-subscription-modal__terms input {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    margin: 1px 0 0;
}

.creator-subscription-modal .creator-subscription-modal__terms a {
    color: var(--brand-primary, #071f92);
}


/* =========================================================
   MONTHLY PRIMARY CTA
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__primary-plan {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 270px;
    min-height: 32px;
    margin: 0 auto;
    padding: 7px 14px;
    border: 0;
    border-radius: 4px;
    background: #071f92;
    color: #fff;
    font-size: var(--text-micro-size);
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    box-shadow: none;
}

.creator-subscription-modal .creator-subscription-modal__primary-plan:hover,
.creator-subscription-modal .creator-subscription-modal__primary-plan:focus {
    background: #071f92;
    color: #fff;
}


/* Remove loader spacing when loader is inactive */
.creator-subscription-modal .creator-subscription-modal__primary-plan > i:empty,
.creator-subscription-modal .creator-subscription-modal__bundle-plan > i:empty {
    display: none;
}


/* =========================================================
   BUNDLE TOGGLE
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__bundle-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    max-width: 270px;
    min-height: 30px;
    margin: 8px auto 0;
    padding: 5px 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #071f92;
    font-size: var(--text-micro-size);
    font-weight: 500;
    line-height: 1.2;
    cursor: pointer;
}

.creator-subscription-modal .creator-subscription-modal__bundle-toggle:hover,
.creator-subscription-modal .creator-subscription-modal__bundle-toggle:focus {
    background: transparent;
    color: #071f92;
}


/* =========================================================
   BUNDLE OPTIONS
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__bundle {
    width: 100%;
    max-width: 270px;
    margin: 4px auto 0;
    padding: 0;
}

.creator-subscription-modal .creator-subscription-modal__bundle[hidden] {
    display: none;
}

.creator-subscription-modal .creator-subscription-modal__bundle-item {
    width: 100%;
    margin: 6px 0 0;
    padding: 0;
    text-align: center;
}

.creator-subscription-modal .creator-subscription-modal__bundle-plan {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 30px;
    margin: 0;
    padding: 6px 12px;
    border: 0;
    border-radius: 4px;
    background: #071f92;
    color: #fff;
    font-size: var(--text-micro-size);
    font-weight: 500;
    line-height: 1.2;
    text-align: center;
    box-shadow: none;
}

.creator-subscription-modal .creator-subscription-modal__bundle-plan:hover,
.creator-subscription-modal .creator-subscription-modal__bundle-plan:focus {
    background: #071f92;
    color: #fff;
}


/* =========================================================
   DISCOUNT
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__discount {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 5px auto 0;
    padding: 2px 11px;
    border: 1px dashed #53b85f;
    border-radius: 999px;
    background: var(--auth-surface-2);
    color: #2f9f49;
    font-size: var(--text-micro-size);
    font-weight: 600;
    line-height: 1.2;
}


/* =========================================================
   CANCEL
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__cancel {
    display: block;
    width: auto;
    min-width: 0;
    margin: 14px auto 0;
    padding: 4px 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text-primary, #172033);
    font-size: var(--text-micro-size);
    font-weight: 400;
    line-height: 1.2;
    text-align: center;
    box-shadow: none;
}

.creator-subscription-modal .creator-subscription-modal__cancel:hover,
.creator-subscription-modal .creator-subscription-modal__cancel:focus {
    background: transparent;
    color: var(--text-primary, #172033);
}
.creator-settings-card-button{
    margin-top: 30px;
}

/* =========================================================
   TAX / ERROR
   ========================================================= */

.creator-subscription-modal .creator-subscription-modal__taxes {
    width: 100%;
    max-width: 270px;
    margin: 8px auto;
    padding: 0;
    list-style: none;
}

.creator-subscription-modal #error {
    width: 100%;
    max-width: 270px;
    margin: 8px auto;
}


/* =========================================================
   BILLING INFO
   Keep functional, but prevent it from widening the modal
   ========================================================= */

.creator-subscription-modal #formSubscription > .billing-info,
.creator-subscription-modal #formSubscription .billing-info {
    max-width: 270px;
    margin-left: auto;
    margin-right: auto;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 575.98px) {

    .creator-subscription-modal .creator-subscription-modal__dialog {
        width: calc(100% - 28px);
        max-width: 360px;
        margin: 14px auto;
    }

    .creator-subscription-modal .creator-subscription-modal__hero {
        height: 96px;
        min-height: 96px;
    }

    .creator-subscription-modal .creator-subscription-modal__identity {
        margin-top: -34px;
    }

    .creator-subscription-modal .creator-subscription-modal__avatar {
        width: 70px;
        height: 70px;
    }

    .creator-subscription-modal .creator-subscription-modal__form {
        padding: 14px 22px 22px;
    }

    .creator-subscription-modal .creator-subscription-modal__summary,
    .creator-subscription-modal .creator-subscription-modal__benefits,
    .creator-subscription-modal .creator-subscription-modal__gateway-list,
    .creator-subscription-modal .creator-subscription-modal__terms,
    .creator-subscription-modal .creator-subscription-modal__primary-plan,
    .creator-subscription-modal .creator-subscription-modal__bundle-toggle,
    .creator-subscription-modal .creator-subscription-modal__bundle,
    .creator-subscription-modal .creator-subscription-modal__taxes,
    .creator-subscription-modal #error {
        max-width: 100%;
    }
}

/* =========================================================
   Campaign UI theme tokens
   ========================================================= */

.campaigner-create-dialog[hidden],
.campaigner-create-step,
.campaigner-create-state[hidden] {
  display: none !important;
}

.campaigner-create-dialog {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  padding: 24px;
}

.campaigner-create-dialog__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.42);
}

.campaigner-create-dialog__surface {
  position: relative;
  width: min(760px, 100%);
  max-height: min(92vh, 860px);
  overflow-y: auto;
  background: var(--auth-surface-2);
  padding: 34px;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.24);
}

.campaigner-create-dialog__close {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: var(--campaign-surface-muted);
  color: var(--campaign-text-primary);
}

.campaigner-create-step.is-active,
.campaigner-create-state:not([hidden]) {
  display: block !important;
}

.campaigner-create-header {
  text-align: center;
  display: flex;
  width: 100%;
  gap: 14px;
}

.campaigner-create-header h2,
.campaigner-create-state h2 {
  margin: 0;
  color: var(--brand-primary);
  font-size: 20px;
  font-weight: 600;
}

.campaigner-create-header__leftside {
  display: flex;
  gap: 12px;
}

.campaigner-create-header p,
.campaigner-create-state p {
  margin: 4px 0 0;
  color: var(--campaign-text-secondary);
  font-size: 15px;
}

.campaigner-create-progress {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-bottom: 24px;
  margin-left: auto;
  margin-right: 30px;
}

.campaigner-create-progress span {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--brand-primary);
  color: var(--campaign-text-secondary);
  font-weight: 700;
}

.campaigner-create-progress .is-active,
.campaigner-create-progress .is-complete {
  border-color: var(--brand-primary);
  background: var(--brand-primary);
  color: #fff;
}

.campaigner-create-upload {
  display: grid;
  place-items: center;
  min-height: 210px;
  margin-bottom: 22px;
  border: 1.5px dashed var(--campaign-border);
  border-radius: 18px;
  background: var(--campaign-surface-muted);
  color: var(--campaign-text-secondary);
  cursor: pointer;
  text-align: center;
  overflow: hidden;
}

.campaigner-create-upload input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.campaigner-create-upload__preview {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 128px;
}

.campaigner-create-upload__preview img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.campaigner-create-upload strong,
.campaigner-create-upload small {
  display: block;
}

.campaigner-create-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.campaigner-create-field,
.campaigner-create-platforms {
  display: grid;
  gap: 8px;
}

.campaigner-create-field--full,
.campaigner-create-platforms {
  grid-column: 1 / -1;
}

.campaigner-create-field span,
.campaigner-create-platforms legend {
  color: var(--campaign-text-strong);
  font-size: 14px;
  font-weight: 500;
}

.campaigner-create-field input,
.campaigner-create-field select,
.campaigner-create-field textarea {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--auth-border);
  border-radius: 12px;
  padding: 12px 14px;
  color: var(--campaign-text-primary);
  background: var(--auth-surface-2);
}

.campaigner-create-field select {
  appearance: auto;
}

.campaigner-create-field > small {
  margin-top: -4px;
  color: var(--campaign-text-secondary);
  font-size: 12px;
  line-height: 1.35;
}

.campaigner-create-step--task-rules .campaigner-create-header {
  margin-bottom: 14px;
}

.campaigner-create-step--task-rules .campaigner-create-progress {
  margin-bottom: 18px;
}

.campaigner-create-step--task-rules .campaigner-create-grid {
  gap: 14px;
}

.campaigner-create-step--task-rules .campaigner-create-field {
  gap: 6px;
}

.campaigner-create-step--task-rules .campaigner-create-field input,
.campaigner-create-step--task-rules .campaigner-create-field select {
  min-height: 44px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.campaigner-create-step--task-rules .campaigner-create-field textarea {
  min-height: 104px;
}

.campaigner-create-step--task-rules .campaigner-create-actions {
  margin-top: 18px;
}

.campaigner-create-step--reward-wallet .campaigner-create-grid {
  gap: 16px;
}

.campaigner-create-step--reward-wallet .campaigner-create-note {
  width: 100%;
  min-height: 42px;
  margin-top: 18px;
  display: flex;
  align-items: center;
  background: var(--campaign-surface-muted);
  color: var(--campaign-text-secondary);
  text-align: left;
}

.campaigner-create-step--reward-wallet .campaigner-create-actions--wide {
  margin-top: 22px;
}

.campaigner-create-step--reward-wallet .campaigner-create-secondary {
  gap: 8px;
}

.campaigner-create-file {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  border: 1px solid var(--auth-border);
  border-radius: 12px;
  padding: 0 14px;
  background: var(--auth-surface-2);
  color: var(--campaign-text-secondary);
  cursor: pointer;
}

.campaigner-create-file input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.campaigner-create-file small {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: var(--campaign-text-secondary);
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.campaigner-create-file i {
  flex: 0 0 auto;
  color: var(--campaign-text-strong);
}

.campaigner-create-money {
  position: relative;
  display: block;
}

.campaigner-create-money em {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--campaign-text-secondary);
  font-style: normal;
}

.campaigner-create-money input {
  padding-left: 34px;
}

.campaigner-create-platforms {
  margin: 18px 0 0;
  padding: 0;
  border: 0;
}

.campaigner-create-platforms > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.campaigner-create-platforms label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--auth-border);
  border-radius: 999px;
  background: var(--auth-surface-2);
}

.campaigner-create-note,
.campaigner-create-errors {
  margin-top: 18px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
}

.campaigner-create-note {
  background: #ecfdf3;
  color: #067647;
}

.campaigner-create-errors {
  background: #fef3f2;
  color: #b42318;
}

.campaigner-create-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
}

.campaigner-create-actions--split {
  justify-content: space-between;
}

.campaigner-create-actions--wide .campaigner-create-secondary {
  flex: 0 0 116px;
}

.campaigner-create-actions--wide .campaigner-create-primary {
  flex: 1 1 auto;
}

.campaigner-create-primary,
.campaigner-create-secondary,
.campaigner-manage-create {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  border-radius: 8px;
  padding: 0 22px;
  font-weight: 700;
  text-decoration: none;
}

.campaigner-create-primary,
.campaigner-manage-create {
  border: 0;
  background: var(--brand-primary);
  color: #fff;
}

.campaigner-create-secondary {
  border: 1px solid var(--auth-border);
  background: var(--auth-surface-2);
  color: var(--campaign-text-strong);
}

.campaigner-create-preview__banner {
  width: 100%;
  min-height: 214px;
  border-radius: 16px;
  background: var(--campaign-surface-subtle) center/cover no-repeat;
}

.campaigner-create-preview .campaigner-create-header {
  margin-bottom: 18px;
  text-align: left;
}

.campaigner-create-preview__helper {
  display: block;
  margin: 8px 0 18px;
  color: var(--campaign-text-secondary);
  font-size: 12px;
  line-height: 1.35;
}

.campaigner-create-preview__fields {
  display: grid;
  gap: 14px;
}

.campaigner-create-preview__field {
  display: grid;
  gap: 8px;
  margin: 0;
}

.campaigner-create-preview__field > span {
  color: var(--campaign-text-strong);
  font-size: 14px;
  font-weight: 500;
}

.campaigner-create-preview__field > strong {
  display: flex;
  align-items: center;
  min-height: 48px;
  width: 100%;
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--campaign-surface-muted);
  color: var(--campaign-text-primary);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
}

.campaigner-create-preview__platforms {
  display: grid !important;
  align-items: stretch !important;
  gap: 8px;
}

.campaigner-create-preview__platforms span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.campaigner-create-preview__platforms i {
  color: var(--campaign-text-primary);
  font-size: 15px;
}

.campaigner-create-confirm {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  color: var(--campaign-text-strong);
  font-size: 14px;
  line-height: 1.4;
}

.campaigner-create-confirm input {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
}

.campaigner-create-preview .campaigner-create-actions--wide {
  margin-top: 22px;
}

.campaigner-create-preview .campaigner-create-secondary {
  gap: 8px;
  background: var(--campaign-surface-muted);
}

.campaigner-create-preview .campaigner-create-primary {
  background: #00167a;
}

.campaigner-create-state {
  text-align: center;
  padding: 48px 8px 18px;
}





.campaign-manager-dashboard__back,
.campaign-manager-dashboard__requests {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}









.campaign-manager-summary,
.campaign-manager-metrics article,
.campaign-manager-table-card {
  border: 1px solid var(--auth-border);
  border-radius: 18px;
  background: var(--auth-surface-2);
}











 
















.camp-btn-reject{
  background-color: #FF563029!important;
  color: #FF0B0B!important;
}
.camp-btn-dash-approve{
  background-color: #A4F4CF45!important;
  color: #007A4D!important;
}
.camp-btn-dash-vcont{
  background-color: #582BE81A!important;
  color: #8A38F5!important;
}

.camp-btn-dash-chat{
  background-color: #FFF5DD!important;
  color: #EA802A!important;
}


.campaign-manager-summary__payout div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.campaign-manager-summary__payout span,
.campaign-manager-metrics span,
.campaign-manager-table-card__head p {
  color: var(--campaign-text-secondary);
  font-size: 14px;
  font-weight: 600;
}





.campaign-manager-summary__progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #FCCE88;
}



















.campaign-manager-table-card__head {
  padding: 20px 22px 10px;
}

.campaign-manager-table-card__head h2 {
  margin: 0;
  color: var(--campaign-text-primary);
  font-size: 20px;
  font-weight: 800;
}

.campaign-manager-table-card__head p {
  margin: 6px 0 0;
}











.campaign-manager-creator-cell img,
.campaign-manager-creator-cell > span {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 50%;
}

.campaign-manager-creator-cell img {
  object-fit: cover;
}







.campaign-manager-table-btn,
.campaign-manager-table-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  border-radius: 10px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
}

.campaign-manager-table-link--button {
  border: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
}

.campaign-content-review-modal {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: grid;
  place-items: center;
  padding: 24px;
}

.campaign-content-review-modal[hidden] {
  display: none;
}

.campaign-content-review-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .58);
}

.campaign-content-review-modal__dialog {
  position: relative;
  width: min(820px, 100%);
  max-height: min(820px, calc(100vh - 48px));
  overflow: auto;
  border-radius: 20px;
  background: var(--auth-surface-2);
  box-shadow: 0 24px 70px rgba(15, 23, 42, .24);
}

.campaign-content-review-modal__header,
.campaign-content-review-modal__footer {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 22px 28px;
}

.campaign-content-review-modal__header {
  justify-content: space-between;
  border-bottom: 1px solid var(--campaign-border);
}

.campaign-content-review-modal__identity {
  display: flex;
  align-items: center;
  gap: 12px;
}

.campaign-content-review-modal__avatar {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  order: 2;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: var(--campaign-surface-subtle);
  color: #475569;
  font-weight: 700;
}

.campaign-content-review-modal__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.campaign-content-review-modal__header h2 {
  margin: 0 0 4px;
  color: var(--campaign-text-primary);
  font-size: 22px;
}

.campaign-content-review-modal__header strong,
.campaign-content-review-modal__header p {
  color: var(--campaign-text-secondary);
  font-size: 13px;
}

.campaign-content-review-modal__header p {
  margin: 4px 0 0;
}

.campaign-content-review-modal__close {
  border: 0;
  background: transparent;
  color: var(--campaign-text-secondary);
  font-size: 20px;
}

.campaign-content-review-modal__body {
  padding: 24px 28px;
}

.campaign-content-review-modal__previews {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.campaign-content-review-modal__preview-card,
.campaign-content-review-modal__requirements {
  min-width: 0;
}

.campaign-content-review-modal__preview-card h3,
.campaign-content-review-modal__requirements h3 {
  margin: 12px 0 0;
  color: var(--campaign-text-strong);
  font-size: 14px;
}

.campaign-content-review-modal__preview {
  display: grid;
  min-height: 190px;
  place-items: center;
  overflow: hidden;
  border-radius: 14px;
  border: 1px solid var(--campaign-border);
  background: var(--campaign-surface-subtle);
}

.campaign-content-review-modal__preview img,
.campaign-content-review-modal__preview video,
.campaign-content-review-modal__preview iframe {
  display: block;
  width: 100%;
  height: 240px;
  max-height: 280px;
  border: 0;
  object-fit: contain;
}

.campaign-content-review-modal__preview img {
  height: 240px;
  object-fit: contain;
}

.campaign-content-review-modal__empty,
.campaign-content-review-modal__muted {
  color: var(--campaign-text-secondary);
  font-size: 13px;
}

.campaign-content-review-modal__facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.campaign-content-review-modal__facts div {
  min-width: 0;
  border: 1px solid var(--campaign-border);
  border-radius: 10px;
  background: var(--campaign-surface-subtle);
  padding: 12px;
}

.campaign-content-review-modal__facts span,
.campaign-content-review-modal__facts small {
  display: block;
  color: var(--campaign-text-secondary);
  font-size: 12px;
  font-weight: 700;
}

.campaign-content-review-modal__facts strong {
  display: block;
  margin-top: 4px;
  color: var(--campaign-text-strong);
  font-size: 16px;
}

.campaign-content-review-modal__file,
.campaign-content-review-modal__original,
.campaign-content-review-modal__profile {
  color: #3156d3;
  font-size: 13px;
  text-decoration: none;
}

.campaign-content-review-modal__requirements {
  margin-top: 18px;
  padding-top: 18px;
  border-top: 1px solid var(--campaign-border);
}

.campaign-content-review-modal__requirement {
  display: flex;
  gap: 9px;
  padding: 9px 0;
  border-top: 1px solid var(--campaign-surface-subtle);
  color: #475569;
  font-size: 13px;
}

.campaign-content-review-modal__requirement:first-of-type {
  border-top: 0;
}

.campaign-content-review-modal__requirement > span:first-child {
  color: var(--campaign-text-secondary);
  font-weight: 700;
}

.campaign-content-review-modal__footer {
  display: grid;
  grid-template-columns: 1fr;
  justify-content: stretch;
  border-top: 1px solid var(--campaign-border);
}

.campaign-content-review-modal__secondary-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.campaign-content-review-modal__footer form {
  margin: 0;
}

.campaign-content-review-modal__profile,
.campaign-content-review-modal__reject,
.campaign-content-review-modal__approve {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
}

.campaign-content-review-modal__footer form,
.campaign-content-review-modal__reject,
.campaign-content-review-modal__approve,
.campaign-content-review-modal__profile {
  width: 100%;
}

.campaign-content-review-modal__reject {
  border: 1px solid #fecaca;
  background: #fff1f2;
  color: #be123c;
}

.campaign-content-review-modal__profile {
  border: 1px solid var(--campaign-border);
  background: var(--campaign-surface-muted);
  color: var(--campaign-text-strong);
}

.campaign-content-review-modal__approve {
  border: 0;
  background: #3156d3;
  color: #fff;
}

@media (max-width: 700px) {
  .campaign-content-review-modal {
    padding: 12px;
  }

  .campaign-content-review-modal__dialog {
    max-height: calc(100vh - 24px);
    border-radius: 14px;
  }

  .campaign-content-review-modal__header,
  .campaign-content-review-modal__body,
  .campaign-content-review-modal__footer {
    padding: 18px;
  }

  .campaign-content-review-modal__previews {
    grid-template-columns: 1fr;
  }

  .campaign-content-review-modal__facts {
    grid-template-columns: 1fr;
  }

  .campaign-content-review-modal__footer {
    align-items: stretch;
    flex-direction: column;
  }

  .campaign-content-review-modal__secondary-actions {
    grid-template-columns: 1fr;
  }

  .campaign-content-review-modal__profile,
  .campaign-content-review-modal__reject,
  .campaign-content-review-modal__approve,
  .campaign-content-review-modal__footer form {
    width: 100%;
  }
  .campaigner-create-progress{
    margin-right: 40px;
  }
  .campaigner-create-header__leftside {
    text-align: left;
  }
  .campaigner-create-header h2{
    font-size: 17px;
  }
  .campaigner-create-header__leftside {
    display: grid;
  }
}

.campaign-manager-table-btn {
  border: 0;
  cursor: pointer;
}

.campaign-manager-table-btn.is-reject {
  background: #fef3f2;
  color: #b42318;
}

.campaign-manager-table-btn.is-approve {
  background: #ecfdf3;
  color: #027a48;
}

.campaign-manager-table-btn.is-disabled {
  background: var(--campaign-surface-subtle);
  color: var(--campaign-text-secondary);
  cursor: not-allowed;
}

.campaign-manager-table-link {
  background: #eef4ff;
  color: #00167a;
}



.campaign-manager-table-empty {
  padding: 34px 16px !important;
  text-align: center !important;
}

/* =========================================================
   Campaign Manager Dashboard - Responsive + Dark Mode Fix
   ========================================================= */

.campaign-manager-dashboard {
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 22px;
  color: var(--text-primary);
}

.campaign-manager-dashboard__topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.campaign-manager-dashboard__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--text-secondary);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.campaign-manager-dashboard__back:hover {
  color: var(--text-primary);
}

.campaign-manager-dashboard__requests {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--border-color);
  border-radius: 12px;
  background: var(--bg-card);
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.campaign-manager-dashboard__requests:hover {
  color: var(--text-primary);
  background: var(--bg-muted);
}

.campaign-manager-dashboard__requests strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  min-height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--brand-primary);
  color: #fff;
  font-size: 12px;
}

.campaign-manager-dashboard h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: 24px;
  font-weight: 800;
  line-height: 1.2;
}


/* =========================
   Summary
   ========================= */

.campaign-manager-summary {
  display: grid;
  grid-template-columns:
    minmax(0, 1.3fr)
    minmax(220px, 0.9fr)
    auto;
  align-items: center;
  gap: 24px;

  width: 100%;
  min-width: 0;
  padding: 20px;

  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--bg-card);
}

.campaign-manager-summary__identity {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.campaign-manager-summary__identity > div:last-child {
  min-width: 0;
}

.campaign-manager-summary__avatar {
  display: grid;
  place-items: center;

  width: 64px;
  height: 64px;
  flex: 0 0 64px;

  overflow: hidden;
  border-radius: 50%;

  background: var(--bg-muted);
  color: var(--text-primary);

  font-size: 20px;
  font-weight: 800;
}

.campaign-manager-summary__avatar img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.campaign-manager-summary h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: 20px;
  font-weight: 800;
  line-height: 1.2;

  overflow: hidden;
  text-overflow: ellipsis;
}

.campaign-manager-summary p {
  margin: 5px 0 0;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
}

.campaign-manager-summary__payout {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.campaign-manager-summary__payout > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.campaign-manager-summary__payout span {
  color: var(--text-secondary);
  font-size: 14px;
  font-weight: 600;
}

.campaign-manager-summary__payout strong {
  color: var(--text-primary);
  font-size: 15px;
  font-weight: 800;
  white-space: nowrap;
}

.campaign-manager-summary__progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: color-mix(
    in srgb,
    var(--brand-primary) 18%,
    var(--bg-muted)
  );
}

.campaign-manager-summary__progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--brand-primary);
}

.campaign-manager-summary__status {  background: #eef4ff;
  color: #00167a;
display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 34px;
  padding: 0 14px;

  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;}

.campaign-manager-summary__status.is-active {
  background: rgba(16, 185, 129, 0.12);
  color: #059669;
}

.campaign-manager-summary__status.is-pending {
  background: rgba(245, 158, 11, 0.14);
  color: #b45309;
}

.campaign-manager-summary__status.is-completed {
  background: rgba(59, 130, 246, 0.14);
  color: #2563eb;
}

.campaign-manager-summary__status.is-rejected {
  background: rgba(239, 68, 68, 0.13);
  color: #dc2626;
}


/* =========================
   Metrics
   ========================= */

.campaign-manager-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;

  width: 100%;
  min-width: 0;
}

.campaign-manager-metrics article {
  display: grid;
  align-content: start;
  gap: 10px;

  min-width: 0;
  min-height: 130px;
  padding: 18px;

  border: 1px solid var(--border-color);
  border-radius: 18px;

  background: var(--bg-card);
}

.campaign-manager-metrics article > span:not(.campaign-dash-sec) {
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1.35;
  font-weight: 600;
}

.campaign-manager-metrics strong {
  color: var(--text-primary);
  font-size: 28px;
  line-height: 1;
  font-weight: 800;
}

.campaign-dash-sec {  font-size: 24px;
  text-align: center;
  vertical-align: middle;
display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 42px;
  height: 42px;

  border-radius: 50%;
  flex: 0 0 42px;}

.campaign-dash-sec i {
  font-size: 22px;
  line-height: 1;
}

.creator-person {  background-color: #00167A0A;
background: color-mix(
    in srgb,
    var(--brand-primary) 8%,
    transparent
  );}

.creator-person i {
  color: var(--text-primary);
}

.creator-received {  background-color: #FCCE884D;
background: rgba(252, 206, 136, 0.3);}

.creator-received i {
  color: #ff8d28;
}

.creator-camp-panding {  background-color: #E895FF1C;
background: rgba(232, 149, 255, 0.12);}

.creator-camp-panding i {
  color: #d308ee;
}

.creator-camp-budget {  background-color: #00167A0A;
background: color-mix(
    in srgb,
    var(--brand-primary) 8%,
    transparent
  );}

.creator-camp-budget i {
  color: var(--brand-primary);
}


/* =========================
   Creator table
   ========================= */

.campaign-manager-table-card {
  width: 100%;
  min-width: 0;

  overflow: hidden;

  border: 1px solid var(--border-color);
  border-radius: 18px;

  background: var(--bg-card);
}

.campaign-manager-table-wrap {
  width: 100%;
  min-width: 0;

  overflow-x: auto;
  overflow-y: hidden;

  -webkit-overflow-scrolling: touch;
}

.campaign-manager-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
}

.campaign-manager-table th,
.campaign-manager-table td {
  padding: 14px 16px;

  border-top: 1px solid var(--border-color);

  text-align: left;
  vertical-align: middle;

  color: var(--text-secondary);
  font-size: 14px;
}

.campaign-manager-table th {
  background: var(--bg-muted);
  color: var(--text-secondary);

  font-size: 14px;
  font-weight: 800;
}

.campaign-manager-creator-cell {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 160px;
}

.campaign-manager-creator-cell strong {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 800;
}

.campaign-manager-creator-cell > span {  display: inline-grid;
  place-items: center;
  font-weight: 800;
background: var(--bg-muted);
  color: var(--text-primary);}

.campaign-manager-status-pill {
  display: inline-flex;
  align-items: center;

  min-height: 28px;
  padding: 0 10px;

  border-radius: 999px;

  background: var(--bg-muted);
  color: var(--text-primary);

  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}

.campaign-manager-table-muted,
.campaign-manager-table-empty {
  color: var(--text-secondary);
}


/* =========================
   Dark mode
   ========================= */

html[data-theme="dark"] .campaign-manager-dashboard {
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .campaign-manager-dashboard h1,
html[data-theme="dark"] .campaign-manager-summary h2,
html[data-theme="dark"] .campaign-manager-summary__payout strong,
html[data-theme="dark"] .campaign-manager-metrics strong,
html[data-theme="dark"] .campaign-manager-creator-cell strong {
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .campaign-manager-dashboard__back,
html[data-theme="dark"] .campaign-manager-summary p,
html[data-theme="dark"] .campaign-manager-summary__payout span,
html[data-theme="dark"] .campaign-manager-metrics article > span:not(.campaign-dash-sec),
html[data-theme="dark"] .campaign-manager-table td {
  color: var(--auth-text-secondary);
}

html[data-theme="dark"] .campaign-manager-dashboard__requests,
html[data-theme="dark"] .campaign-manager-summary,
html[data-theme="dark"] .campaign-manager-metrics article,
html[data-theme="dark"] .campaign-manager-table-card {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
}

html[data-theme="dark"] .campaign-manager-table th {
  background: var(--auth-surface-3);
  color: var(--auth-text-secondary);
  border-color: var(--auth-border);
}

html[data-theme="dark"] .campaign-manager-table td {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
}

html[data-theme="dark"] .campaign-manager-status-pill {
  background: var(--auth-surface-3);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .campaign-manager-summary__avatar,
html[data-theme="dark"] .campaign-manager-creator-cell > span {
  background: var(--auth-surface-3);
  color: var(--auth-text-primary);
}

html[data-theme="dark"] .creator-person i {
  color: var(--auth-text-primary);
}


/* =========================
   Tablet
   ========================= */

@media (max-width: 991.98px) {

  .campaign-manager-dashboard {
    gap: 18px;
  }

  .campaign-manager-summary {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(200px, 0.75fr);

    gap: 18px;
  }

  .campaign-manager-summary__status {
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
  }

  .campaign-manager-summary__payout {
    grid-column: 1 / -1;
  }

  .campaign-manager-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* =========================
   Mobile
   ========================= */

@media (max-width: 767.98px) {

  .campaign-manager-dashboard {
    width: 100%;
    min-width: 0;

    gap: 16px;

    padding:
      10px
      15px
      96px;
  }

  .campaign-manager-dashboard__topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    width: 100%;
  }

  .campaign-manager-dashboard__back {
    flex: 0 0 auto;
  }

  .campaign-manager-dashboard__requests {
    flex: 0 1 auto;
    min-width: 0;

    min-height: 38px;
    padding: 0 10px;

    gap: 8px;

    font-size: 12px;
  }

  .campaign-manager-dashboard__requests > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .campaign-manager-dashboard__requests strong {
    min-width: 22px;
    min-height: 22px;

    font-size: 11px;
  }

  .campaign-manager-dashboard h1 {
    font-size: 21px;
    line-height: 1.2;
  }


  /* Summary */

  .campaign-manager-summary {
    display: grid;

    grid-template-columns:
      minmax(0, 1fr)
      auto;

    gap: 14px 12px;

    align-items: center;

    padding: 16px;
  }

  .campaign-manager-summary__identity {
    grid-column: 1;
    grid-row: 1;

    display: grid;

    grid-template-columns:
      58px
      minmax(0, 1fr);

    gap: 12px;

    align-items: center;
  }

  .campaign-manager-summary__avatar {
    width: 58px;
    height: 58px;
    flex-basis: 58px;
  }

  .campaign-manager-summary h2 {
    font-size: 17px;
    line-height: 1.2;
    white-space: normal;
    overflow-wrap: break-word;
  }

  .campaign-manager-summary p {
    margin-top: 3px;
    font-size: 12px;
  }

  .campaign-manager-summary__status {
    grid-column: 2;
    grid-row: 1;

    justify-self: end;
    align-self: center;

    min-height: 30px;
    padding: 0 11px;

    font-size: 11px;
  }

  .campaign-manager-summary__payout {
    grid-column: 1 / -1;
    grid-row: 2;

    width: 100%;

    gap: 8px;
  }

  .campaign-manager-summary__payout > div:first-child {
    display: flex;

    flex-direction: row;

    align-items: center;
    justify-content: space-between;

    gap: 10px;
  }

  .campaign-manager-summary__payout span {
    font-size: 12px;
  }

  .campaign-manager-summary__payout strong {
    font-size: 13px;
  }


  /* Metrics: exactly 2 x 2 */

  .campaign-manager-dashboard .campaign-manager-metrics {
    display: grid;

    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap: 10px;
  }

  .campaign-manager-dashboard
  .campaign-manager-metrics article {
    min-width: 0;
    min-height: 128px;

    padding: 14px;

    gap: 8px;
  }

  .campaign-manager-dashboard
  .campaign-manager-metrics article > span:not(.campaign-dash-sec) {
    font-size: 12px;
    line-height: 1.3;

    white-space: normal;
    overflow-wrap: break-word;
  }

  .campaign-manager-dashboard
  .campaign-manager-metrics strong {
    font-size: 24px;
  }

  .campaign-dash-sec {
    width: 38px;
    height: 38px;
  }

  .campaign-dash-sec i {
    font-size: 20px;
  }


  /* Table */

  .campaign-manager-table-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;

    border-radius: 16px;
  }

  .campaign-manager-table-wrap {
    width: 100%;
    max-width: 100%;

    overflow-x: auto;

    scrollbar-width: thin;
  }

  .campaign-manager-table {
    min-width: 840px;
  }

  .campaign-manager-table th,
  .campaign-manager-table td {
    padding: 12px;

    font-size: 12px;

    white-space: nowrap;
  }

  .campaign-manager-creator-cell {
    min-width: 140px;
  }
}


/* =========================
   Small mobile
   ========================= */

@media (max-width: 390px) {

  .campaign-manager-dashboard {
    padding-left: 12px;
    padding-right: 12px;
  }

  .campaign-manager-summary {
    padding: 14px;
  }

  .campaign-manager-summary__identity {
    grid-template-columns:
      52px
      minmax(0, 1fr);
  }

  .campaign-manager-summary__avatar {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
  }

  .campaign-manager-summary h2 {
    font-size: 16px;
  }

  .campaign-manager-dashboard
  .campaign-manager-metrics article {
    padding: 12px;
    min-height: 122px;
  }

  .campaign-manager-dashboard
  .campaign-manager-metrics strong {
    font-size: 22px;
  }
}

.campaign-reward-modal,
.campaign-reward-success-modal {
  position: fixed;
  inset: 0;
  z-index: 1080;
  display: grid;
  place-items: center;
  padding: 20px;
}

.campaign-reward-modal[hidden],
.campaign-reward-success-modal[hidden] {
  display: none !important;
}

.campaign-reward-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
}

.campaign-reward-modal__dialog,
.campaign-reward-success-modal__dialog {
  position: relative;
  width: min(100%, 430px);
  border-radius: 22px;
  background: var(--auth-surface-2);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
  outline: none;
}

.campaign-reward-form {
  display: grid;
  gap: 15px;
  padding: 26px;
}

.campaign-reward-form h2,
.campaign-reward-success-modal h2 {
  margin: 0;
  color: var(--campaign-text-primary);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.2;
}

.campaign-reward-form__creator {
  margin: -8px 0 0;
  color: var(--campaign-text-secondary);
  font-size: 13px;
  font-weight: 600;
}

.campaign-reward-form__field {
  display: grid;
  gap: 7px;
  margin: 0;
}

.campaign-reward-form__field span {
  color: var(--campaign-text-strong);
  font-size: 13px;
  font-weight: 700;
}

.campaign-reward-form__field input {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--auth-border);
  border-radius: 12px;
  padding: 0 14px;
  background: var(--auth-surface-2);
  color: var(--campaign-text-primary);
  font-size: 15px;
  font-weight: 700;
}

.campaign-reward-form__field input[readonly] {
  background: var(--campaign-surface-muted);
  border-color: var(--campaign-border);
}

.campaign-reward-form__notice {
  margin: 0;
  padding: 11px 12px;
  border-radius: 12px;
  background: var(--campaign-surface-muted);
  color: var(--campaign-text-secondary);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
}

.campaign-reward-form__errors {
  padding: 10px 12px;
  border-radius: 12px;
  background: #fef3f2;
  color: #b42318;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
}

.campaign-reward-form__actions {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 12px;
  padding-top: 4px;
}

.campaign-reward-form__cancel,
.campaign-reward-form__approve,
.campaign-reward-success-modal__dialog button {
  min-height: 46px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}

.campaign-reward-form__cancel,
.campaign-reward-success-modal__dialog button {
  border: 1px solid var(--auth-border);
  background: var(--auth-surface-2);
  color: var(--campaign-text-strong);
}

.campaign-reward-form__approve {
  border: 0;
  background: #00167a;
  color: #fff;
}

.campaign-reward-form__approve:disabled {
  opacity: 0.65;
  cursor: wait;
}

.campaign-reward-success-modal__dialog {
  display: grid;
  justify-items: center;
  gap: 14px;
  max-width: 360px;
  padding: 34px 28px 28px;
  text-align: center;
}

.campaign-reward-success-modal__icon {
  display: inline-grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 2px solid #00167a;
  border-radius: 50%;
  color: #00167a;
  font-size: 25px;
}

.campaign-reward-success-modal p {
  max-width: 240px;
  margin: 0;
  color: var(--campaign-text-secondary);
  font-size: 14px;
  line-height: 1.45;
}

.campaign-reward-success-modal__dialog button {
  width: 100%;
}

.campaign-requests-page {
  display: grid;
  gap: 22px;
  color: var(--campaign-text-primary);
}

.campaign-requests-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-self: start;
  color: var(--campaign-text-strong);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.campaign-requests-page h1 {
  margin: 0;
  color: var(--campaign-text-primary);
  font-size: 32px;
  font-weight: 800;
  line-height: 1.15;
}

.campaign-requests-list {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--auth-border);
  border-radius: 18px;
  background: var(--auth-surface-2);
}

.campaign-requests-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 18px 20px;
}

.campaign-requests-row + .campaign-requests-row {
  border-top: 1px solid var(--auth-border);
}

.campaign-requests-row__creator {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.campaign-requests-row__creator img,
.campaign-requests-row__creator > span {
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 50%;
}

.campaign-requests-row__creator img {
  object-fit: cover;
}

.campaign-requests-row__creator > span {
  display: inline-grid;
  place-items: center;
  background: var(--campaign-surface-subtle);
  color: var(--campaign-text-strong);
  font-size: 17px;
  font-weight: 800;
}

.campaign-requests-row__creator div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.campaign-requests-row__creator strong {
  color: var(--campaign-text-primary);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.25;
}

.campaign-requests-row__creator small {
  color: var(--campaign-text-secondary);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
}

.campaign-requests-row__actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.campaign-request-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  border: 0;
  border-radius: 999px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.campaign-request-action.is-approve {
  background: #ecfdf3;
  color: #027a48;
}

.campaign-request-action.is-profile {
  background: #f4f3ff;
  color: #5925dc;
}

.campaign-request-action.is-reject {
  background: #fef3f2;
  color: #b42318;
}

.campaign-request-action.is-disabled {
  background: var(--campaign-surface-subtle);
  color: var(--campaign-text-secondary);
  cursor: not-allowed;
}

.campaign-requests-empty {
  padding: 42px 20px;
  text-align: center;
}

.campaign-requests-empty strong {
  color: var(--campaign-text-secondary);
  font-size: 15px;
  font-weight: 800;
}

/* =========================================================
   MANAGE CAMPAIGN
   ========================================================= */

.campaigner-manage-page {
  display: grid;
  gap: 22px;
  color: var(--text-primary);
}

.campaigner-manage-mobile-content {
  display: none;
}

/* Header */

.campaigner-manage-header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 20px;
}

.campaigner-manage-header h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: 24px;
  font-weight: 600;
}

/* Desktop tabs */

.campaigner-manage-tabs {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  margin-bottom: 20px;
  scrollbar-width: none;
}

.campaigner-manage-tabs::-webkit-scrollbar {
  display: none;
}

.campaigner-manage-tabs a {
  flex: 0 0 auto;
  min-height: 40px;
  padding: 10px 17px;

  border: 1px solid transparent;
  border-radius: 12px;

  color: var(--text-secondary);
  background: transparent;

  font-size: 14px;
  text-decoration: none;
}

.campaigner-manage-tabs a.is-active {
  border-color: var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
}

/* Cards */

.campaigner-manage-grid {
  display: grid;
  gap: 18px;
}

.campaigner-manage-card {
  overflow: hidden;
  padding: 0;

  border: 1px solid var(--border-color);
  border-radius: 16px;

  background: var(--bg-card);
  color: var(--text-primary);
}

.campaigner-manage-card__top {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(240px, 0.9fr);

  gap: 22px;
  padding: 22px 24px;

  background: var(--bg-muted);
  border-bottom: 1px solid var(--border-color);
}

.campaigner-manage-card__identity {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}

.campaigner-manage-card__avatar {
  display: grid;
  place-items: center;

  flex: 0 0 62px;
  width: 62px;
  height: 62px;

  overflow: hidden;
  border-radius: 50%;

  background: var(--bg-card);
  color: var(--text-secondary);

  font-size: 18px;
  font-weight: 800;
  text-decoration: none;
}

.campaigner-manage-card__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.campaigner-manage-card__title-block {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.campaigner-manage-card h2 {
  margin: 0;

  color: var(--text-primary);

  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
}

.campaigner-manage-card h2 a {
  color: inherit;
  text-decoration: none;
}

/* Brand */

.campaigner-manage-card__brand {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
}

.campaigner-manage-card__brand span {
  display: inline-flex;
  align-items: center;

  min-height: 22px;
  padding: 3px 8px;

  border: 1px solid var(--border-color);
  border-radius: 999px;

  background: var(--bg-card);
  color: var(--text-secondary);

  font-size: 11px;
  font-weight: 700;
}

.campaigner-manage-card__brand strong {
  min-width: 0;

  color: var(--text-primary);

  font-size: 13px;
  font-weight: 700;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Top-right info */

.campaigner-manage-card__brief {
  display: grid;
  justify-items: end;
  align-content: start;

  gap: 9px;
  text-align: right;
}

.campaigner-manage-card__chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.campaigner-manage-card__chips span {
  padding: 5px 10px;

  border: 1px solid var(--border-color);
  border-radius: 999px;

  background: var(--bg-card);
  color: var(--text-primary);

  font-size: 14px;
  font-weight: 500;
}

.campaigner-manage-card__posted {
  margin: 0;
  padding-top: 5px;

  color: var(--text-secondary);

  font-size: 14px;
  font-weight: 500;
}

.campaigner-manage-card__type {
  display: flex;
  align-items: center;
  justify-content: flex-end;

  gap: 8px;

  color: var(--text-secondary);

  font-size: 13px;
  font-weight: 700;
}

.campaigner-manage-card__type i {
  color: var(--text-secondary);
}

/* Bottom area */

.campaigner-manage-card__bottom {
  display: grid;
  grid-template-columns:
    minmax(220px, 1.45fr)
    repeat(4, minmax(96px, 0.7fr));

  align-items: center;

  gap: 18px;
  padding: 18px 24px;

  background: var(--bg-card);
}

.campaigner-manage-card__platform-status,
.campaigner-manage-card__metric {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.campaigner-manage-card__platform-status p {
  margin: 0;

  color: var(--brand-primary);

  font-size: 14px;
  font-weight: 500;
}

.campaigner-manage-card__platform-status p strong {
  color: inherit;
  font-weight: 500;
}

.campaigner-manage-card__status {
  display: inline-flex;
  align-items: center;

  gap: 7px;

  color: var(--text-secondary);

  font-size: 13px;
  font-weight: 700;
}

.campaigner-manage-card__status i {
  width: 8px;
  height: 8px;

  border-radius: 50%;
  background: var(--text-muted);
}

.campaigner-manage-card__status.is-active i {
  background: #12b76a;
}

.campaigner-manage-card__status.is-pending i {
  background: #f79009;
}

.campaigner-manage-card__status.is-completed i {
  background: #2e90fa;
}

.campaigner-manage-card__metric span {
  color: var(--text-secondary);

  font-size: 12px;
  font-weight: 600;
}

.campaigner-manage-card__metric strong {
  color: var(--text-primary);

  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}

.campaigner-manage-card__mobile-label {
  display: none;
}

.campaigner-manage-empty {
  padding: 36px;
  text-align: center;

  border: 1px solid var(--border-color);
  background: var(--bg-card);
  color: var(--text-primary);
}
@media (max-width: 640px) {

  .campaigner-manage-desktop-content {
    display: none;
  }

  .campaigner-manage-mobile-content {
    display: grid;
    gap: 22px;

    padding-left: 15px;
    padding-right: 15px;

    color: var(--text-primary);
  }

  .campaigner-manage-mobile-heading {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .campaigner-manage-mobile-heading a {
    display: inline-grid;
    place-items: center;

    width: 32px;
    height: 32px;

    color: var(--text-primary);
    text-decoration: none;
  }

  .campaigner-manage-mobile-heading h1 {
    margin: 0;

    color: var(--text-primary);

    font-size: 22px;
    font-weight: 600;
  }

  .campaigner-manage-mobile-menu {
    display: grid;

    border-top: 1px solid var(--border-color);
  }

  .campaigner-manage-mobile-menu a {
    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 64px;
    padding: 0 2px;

    border-bottom: 1px solid var(--border-color);

    color: var(--text-primary);

    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
  }

  .campaigner-manage-mobile-menu a i {
    color: var(--text-secondary);
    font-size: 18px;
  }

  .campaigner-manage-mobile-grid {
    display: grid;
    gap: 18px;
  }

  .campaigner-manage-card__top,
  .campaigner-manage-card__bottom {
    grid-template-columns: 1fr;
  }

  .campaigner-manage-card__top {
    display: block;
    padding: 0;
  }

  .campaigner-manage-card__identity {
    display: block;
  }

  .campaigner-manage-card__avatar {
    width: 100%;
    height: 176px;

    border-radius: 0;
  }

  .campaigner-manage-card__title-block {
    gap: 7px;
    padding: 16px 16px 0;
  }

  .campaigner-manage-card__brief {
    gap: 10px;
    padding: 14px 16px 16px;

    justify-items: start;
    text-align: left;
  }

  .campaigner-manage-card__chips,
  .campaigner-manage-card__type {
    justify-content: flex-start;
  }

  .campaigner-manage-card__bottom {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 16px 12px;
    padding: 16px;

    background: var(--bg-card);
  }

  .campaigner-manage-card__platform-status {
    grid-column: 1 / -1;
  }

  .campaigner-manage-card__metric strong {
    font-size: 14px;
  }

  .campaigner-manage-card__desktop-label {
    display: none;
  }

  .campaigner-manage-card__mobile-label {
    display: inline;
  }
}
@media (max-width: 575.98px) {
  .creator-profile-actions-primary {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-template-areas: none;
    align-items: center;
    gap: 6px;
    width: 100%;
    min-width: 0;
    margin-top: 0;
    white-space: nowrap;
  }

  .creator-profile-actions-primary > .creator-profile-action-pill:not(.creator-profile-share-icon-btn),
  .creator-profile-actions-primary > .camp-btn-dash-chat {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 100% !important;
    min-width: 0;
    height: 44px;
    min-height: 44px;
    padding: 0 4px !important;
    border-radius: 13px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
  }

  .creator-profile-actions-primary > .creator-profile-action-pill:not(.creator-profile-share-icon-btn) i,
  .creator-profile-actions-primary > .camp-btn-dash-chat i {
    flex: 0 0 auto;
    margin: 0;
    font-size: 14px;
    line-height: 1;
  }

  .creator-profile-actions-primary > .creator-profile-action-pill:not(.creator-profile-share-icon-btn) span,
  .creator-profile-actions-primary > .camp-btn-dash-chat span {
    min-width: 0;
    line-height: 1;
  }

  .creator-profile-actions-primary > .creator-profile-top-up,
  .creator-profile-actions-primary > .creator-profile-gift,
  .creator-profile-actions-primary > .creator-profile-tip {
    border-color: #001b8e;
    background: #001b8e;
    color: #fff;
  }

  .creator-profile-actions-primary > .creator-profile-top-up {
    grid-area: 1 / 1 / 2 / 2 !important;
  }

  .creator-profile-actions-primary > .creator-profile-gift {
    grid-area: 1 / 2 / 2 / 3 !important;
  }

  .creator-profile-actions-primary > .camp-btn-dash-chat {
    grid-area: 1 / 3 / 2 / 4 !important;
  }

  .creator-profile-actions-primary > .creator-profile-tip {
    grid-area: 1 / 4 / 2 / 5 !important;
  }

  .creator-profile-actions-primary > .camp-btn-dash-chat span {
    font-size: 0;
  }

  .creator-profile-actions-primary > .camp-btn-dash-chat span::after {
    content: "Chat";
    font-size: 12px;
    font-weight: 700;
  }

  .creator-profile-actions-primary > .creator-profile-share-icon-btn {
    position: absolute;
    right: 0;
    top: -137px;
    grid-area: auto !important;
    width: 40px !important;
    min-width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
  }
}

@media (max-width: 339.98px) {
  .creator-profile-actions-primary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-profile-actions-primary > .creator-profile-top-up {
    grid-area: 1 / 1 / 2 / 2 !important;
  }

  .creator-profile-actions-primary > .creator-profile-gift {
    grid-area: 1 / 2 / 2 / 3 !important;
  }

  .creator-profile-actions-primary > .camp-btn-dash-chat {
    grid-area: 2 / 1 / 3 / 2 !important;
  }

  .creator-profile-actions-primary > .creator-profile-tip {
    grid-area: 2 / 2 / 3 / 3 !important;
  }
}

/* Authenticated global search results. This is intentionally scoped to /search. */
.creator-feed-page--search .creator-feed-shell-main {
  min-width: 0;
}

.creator-search-results {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  overflow: visible;
}

.creator-search-results__bar {
  position: relative;
  z-index: 12;
  width: 100%;
}

.creator-search-page-form .creator-feed-search-control {
  height: 50px;
  padding-left: 48px;
  border-radius: var(--radius-lg);
  background: var(--bg-muted);
  color: var(--text-primary);
  font-size: var(--text-body-size);
}

.creator-search-page-form .creator-feed-search-icon {
  left: 18px;
}

.creator-search-results__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 4px 2px 2px;
}

.creator-search-results__header h1 {
  margin: 0;
  color: var(--text-primary);
  font-size: clamp(22px, 2.1vw, 30px);
  line-height: 1.25;
  letter-spacing: 0;
}

.creator-search-results__header p {
  margin: 6px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
}

.creator-search-results__clear {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 15px;
}

.creator-search-results__sections {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 18px;
}

.creator-search-results__section {
  min-width: 0;
  margin: 0;
  padding: 18px;
  overflow: visible;
  border-radius: var(--radius-xl);
}

.creator-search-results__section-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.creator-search-results__section-heading h2 {
  margin: 2px 0 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
  line-height: 1.2;
}

.creator-search-results__section .creator-feed-section-kicker {
  letter-spacing: .06em;
  text-transform: uppercase;
}

.creator-search-results__count {
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--text-secondary);
  font-size: var(--text-table-size);
  font-weight: 700;
  white-space: nowrap;
}

.creator-search-results__grid {
  display: grid;
  min-width: 0;
  gap: 14px;
}

.creator-search-results__grid--profiles {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.creator-search-results__grid--campaigns {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.creator-search-results__grid--products {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.creator-search-profile-card {
  min-width: 0;
  min-height: 248px;
  background: var(--auth-surface-2);
}

.creator-search-profile-card .creator-feed-creator-cover {
  height: 132px;
}

.creator-search-profile-card .creator-feed-creator-content {
  min-height: 112px;
}

.creator-search-creator-username,
.creator-search-profile-card .creator-feed-creator-profession {
  display: block;
  max-width: 145px;
  margin-top: 2px;
  overflow: hidden;
  color: var(--text-secondary);
  font-size: var(--text-table-size);
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.creator-search-profile-card .creator-feed-creator-profession {
  opacity: .82;
}

.creator-search-profile-card .creator-feed-view-profile-btn {
  max-width: 124px;
  overflow: hidden;
  border: 0;
  text-overflow: ellipsis;
}

.creator-search-subscribe-btn {
  cursor: pointer;
}

.creator-search-subscription-state {
  background: var(--bg-muted);
  color: var(--text-secondary);
}

.creator-search-results__grid--campaigns .creator-campaign-card {
  min-width: 0;
  box-shadow: none;
}

.creator-search-results__grid--products .creator-shop-card {
  min-width: 0;
  min-height: 306px;
  box-shadow: none;
}

.creator-search-results__grid--products .creator-shop-card__media {
  height: 148px;
  flex: 0 0 148px;
}

.creator-search-results__pagination {
  display: flex;
  justify-content: center;
  margin-top: 16px;
}

.creator-search-results__pagination .pagination {
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px;
  margin: 0;
}

.creator-search-empty {
  min-height: 260px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 34px 22px;
  text-align: center;
}

.creator-search-empty--initial {
  min-height: 220px;
}

.creator-search-empty__icon {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  border-radius: var(--radius-pill);
  background: var(--bg-muted);
  color: var(--text-secondary);
  font-size: var(--text-lead-size);
}

.creator-search-empty h1,
.creator-search-empty h2 {
  margin: 0;
  color: var(--text-primary);
  font-size: var(--text-section-title-size);
}

.creator-search-empty p {
  max-width: 440px;
  margin: 8px 0 0;
  color: var(--text-secondary);
  font-size: var(--text-body-size);
}

html[data-theme="dark"] .creator-search-profile-card,
html[data-theme="dark"] .creator-search-empty {
  background: var(--auth-surface-2);
  border-color: var(--auth-border);
}

@media (max-width: 1199.98px) {
  .creator-search-results__grid--profiles {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .creator-search-results__grid--campaigns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-search-results__grid--products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 991.98px) {
  .creator-feed-page--search .creator-feed-shell-main {
    width: 100%;
  }

  .creator-search-results {
    padding: 0 14px 24px;
  }

  .creator-search-results__grid--profiles,
  .creator-search-results__grid--products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .creator-search-results__grid--campaigns {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .creator-search-results {
    gap: 15px;
  }

  .creator-search-page-form .creator-feed-search-control {
    height: 46px;
  }

  .creator-search-results__header {
    align-items: center;
    gap: 12px;
  }

  .creator-search-results__header h1 {
    font-size: var(--text-section-title-size);
  }

  .creator-search-results__header p {
    font-size: var(--text-meta-size);
  }

  .creator-search-results__clear {
    min-height: 34px;
    padding: 0 11px;
    font-size: var(--text-table-size);
  }

  .creator-search-results__section {
    padding: 14px;
    border-radius: var(--radius-lg);
  }

  .creator-search-results__section .creator-feed-section-controls {
    display: none;
  }

  .creator-search-results__section-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .creator-search-results__grid--campaigns {
    grid-template-columns: minmax(0, 1fr);
  }

  .creator-search-results__grid--products .creator-shop-card__media {
    height: 132px;
    flex-basis: 132px;
  }

  .creator-search-empty {
    min-height: 210px;
    padding: 28px 18px;
  }
}

@media (max-width: 419.98px) {
  .creator-search-results__header {
    align-items: flex-start;
    flex-direction: column;
  }

  .creator-search-results__grid--profiles {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Support tickets: isolated help workflow */
.creator-feed-page--support .creator-feed-shell-main {
  padding-bottom: 96px;
}

.support-workspace {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
  color: var(--text-primary);
}

.support-page-header,
.support-panel,
.support-closed-card {
  border: 1px solid var(--border-color);
  background: var(--bg-card);
  box-shadow: var(--shadow-card);
}

.support-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 28px;
  border-radius: var(--auth-card-radius);
}

.support-page-header--compact {
  align-items: flex-start;
}

.support-page-header h1 {
  margin: 3px 0 7px;
  color: var(--text-primary);
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.15;
  font-weight: 700;
}

.support-page-header p,
.support-panel-heading p,
.support-empty-state p,
.support-closed-card p {
  margin: 0;
  color: var(--text-secondary);
}

.support-kicker {
  color: var(--brand-primary);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.support-primary-button,
.support-secondary-button,
.support-link-button,
.support-file-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  border-radius: 12px;
  padding: 0 17px;
  border: 1px solid transparent;
  font-weight: 650;
  text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.support-primary-button {
  flex-shrink: 0;
  border: 0;
  color: #fff;
  background: var(--brand-primary);
}

.support-primary-button:hover {
  color: #fff;
  background: var(--brand-primary-hover);
}

.support-secondary-button,
.support-file-button {
  color: var(--text-primary);
  border-color: var(--border-color);
  background: var(--auth-control-bg);
}

.support-link-button {
  min-height: 34px;
  padding-inline: 13px;
  color: var(--brand-primary);
  border-color: var(--border-color);
  background: var(--bg-card);
}

.support-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.support-summary-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--border-color);
  border-radius: 18px;
  background: var(--bg-card);
}

.support-summary-card span {
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
}

.support-summary-card strong {
  color: var(--text-primary);
  font-size: 25px;
}

.support-panel {
  overflow: hidden;
  border-radius: var(--auth-card-radius);
}

.support-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 24px;
  border-bottom: 1px solid var(--border-color);
}

.support-panel-heading h2,
.support-reply-panel h2 {
  margin: 0 0 4px;
  color: var(--text-primary);
  font-size: 19px;
}

.support-ticket-table-wrap {
  max-width: 100%;
  overflow-x: auto;
}

.support-ticket-table {
  width: 100%;
  border-collapse: collapse;
}

.support-ticket-table th,
.support-ticket-table td {
  padding: 15px 16px;
  border-bottom: 1px solid var(--border-color);
  color: var(--text-secondary);
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
}

.support-ticket-table th {
  color: var(--text-muted);
  background: var(--bg-muted);
  font-size: 11px;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.support-ticket-table td:nth-child(2) {
  max-width: 290px;
  white-space: normal;
}

.support-ticket-table tr.is-unread td {
  background: var(--auth-accent-soft);
}

.support-ticket-table tbody tr:last-child td {
  border-bottom: 0;
}

.support-ticket-table strong,
.support-ticket-subject {
  color: var(--text-primary);
  font-weight: 650;
}

.support-status,
.support-new-reply {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
}

.support-status--open { color: var(--brand-primary); background: var(--auth-accent-soft); }
.support-status--waiting_for_support { color: var(--auth-warning); background: color-mix(in srgb, var(--auth-warning) 13%, transparent); }
.support-status--answered { color: var(--auth-success); background: color-mix(in srgb, var(--auth-success) 13%, transparent); }
.support-status--waiting_for_user { color: var(--brand-primary); background: var(--auth-accent-soft); }
.support-status--closed { color: var(--text-secondary); background: var(--bg-muted); }
.support-new-reply { margin-top: 5px; color: #fff; background: var(--brand-primary); }

.support-ticket-cards {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.support-ticket-card {
  display: block;
  min-width: 0;
  padding: 16px;
  color: var(--text-primary);
  border: 1px solid var(--border-color);
  border-radius: 16px;
  background: var(--bg-card);
  text-decoration: none;
}

.support-ticket-card.is-unread {
  border-color: var(--brand-primary);
  background: var(--auth-accent-soft);
}

.support-ticket-card__top,
.support-ticket-card__meta,
.support-ticket-heading-row,
.support-reply-actions,
.support-form-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.support-ticket-card h3 {
  margin: 13px 0 8px;
  overflow-wrap: anywhere;
  font-size: 16px;
}

.support-ticket-card__meta {
  color: var(--text-secondary);
  font-size: 12px;
}

.support-pagination {
  padding: 18px 22px 6px;
}

.support-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 310px;
  padding: 35px 22px;
  text-align: center;
}

.support-empty-state > i {
  margin-bottom: 14px;
  color: var(--brand-primary);
  font-size: 36px;
}

.support-empty-state h3 { margin: 0 0 6px; }
.support-empty-state .support-primary-button { margin-top: 18px; }

.support-alert {
  padding: 13px 16px;
  border: 1px solid;
  border-radius: 14px;
}

.support-alert--success { color: var(--auth-success); border-color: color-mix(in srgb, var(--auth-success) 35%, transparent); background: color-mix(in srgb, var(--auth-success) 9%, var(--bg-card)); }
.support-alert--error { color: var(--auth-danger); border-color: color-mix(in srgb, var(--auth-danger) 35%, transparent); background: color-mix(in srgb, var(--auth-danger) 9%, var(--bg-card)); }
.support-alert ul { margin: 8px 0 0; padding-left: 20px; }

.support-form-panel,
.support-reply-panel {
  padding: 25px;
}

.support-form {
  display: flex;
  flex-direction: column;
  gap: 19px;
}

.support-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.support-field {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 7px;
}

.support-field label {
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 650;
}

.support-field input,
.support-field select,
.support-field textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 13px;
  color: var(--text-primary);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  outline: none;
  background: var(--auth-input-bg);
}

.support-field textarea {
  resize: vertical;
}

.support-field input:focus,
.support-field select:focus,
.support-field textarea:focus {
  border-color: var(--brand-primary);
  box-shadow: 0 0 0 3px var(--auth-accent-soft);
}

.support-field small {
  color: var(--text-muted);
  font-size: 11px;
}

.support-field .support-field-error { color: var(--auth-danger); }
.support-optional { color: var(--text-muted); font-weight: 400; }
.support-back-link { display: inline-flex; align-items: center; gap: 6px; color: var(--text-secondary); text-decoration: none; font-size: 13px; font-weight: 600; }

.support-ticket-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-top: 14px;
  color: var(--text-secondary);
  font-size: 12px;
}

.support-thread {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.support-message {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  width: min(86%, 740px);
}

.support-message--admin { align-self: flex-start; }
.support-message--user { align-self: flex-end; flex-direction: row-reverse; }

.support-message__avatar {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  overflow: hidden;
  place-items: center;
  border: 1px solid var(--border-color);
  border-radius: 50%;
  color: var(--text-secondary);
  background: var(--bg-muted);
}

.support-message__avatar img { width: 100%; height: 100%; object-fit: cover; }

.support-message__content {
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid var(--border-color);
  border-radius: 6px 18px 18px 18px;
  background: var(--bg-card);
}

.support-message--user .support-message__content {
  border-radius: 18px 6px 18px 18px;
  background: var(--auth-accent-soft);
}

.support-message__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 18px; margin-bottom: 8px; }
.support-message__meta strong { color: var(--text-primary); font-size: 13px; }
.support-message__meta time { color: var(--text-muted); font-size: 10px; }
.support-message__body { color: var(--text-primary); overflow-wrap: anywhere; line-height: 1.6; }

.support-attachments { display: flex; flex-direction: column; gap: 7px; margin-top: 13px; }
.support-attachment { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 8px 10px; color: var(--text-primary); border: 1px solid var(--border-color); border-radius: 10px; background: var(--bg-card); text-decoration: none; }
.support-attachment span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.support-attachment small { flex-shrink: 0; margin-left: auto; color: var(--text-muted); }

.support-reply-panel h2 { margin-bottom: 16px; }
.support-close-form { margin-top: 15px; padding-top: 14px; border-top: 1px solid var(--border-color); text-align: right; }
.support-text-button { border: 0; color: var(--auth-danger); background: transparent; font-size: 12px; font-weight: 650; }
.support-closed-card { display: flex; align-items: center; gap: 14px; padding: 20px; border-radius: 18px; }
.support-closed-card > i { color: var(--auth-success); font-size: 25px; }
.support-closed-card strong { color: var(--text-primary); }
.support-closed-card p { margin-top: 2px; font-size: 12px; }

@media (max-width: 1023.98px) {
  .support-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
  .creator-feed-page--support .creator-feed-shell-main { padding-bottom: 88px; }
  .support-workspace { gap: 14px; }
  .support-page-header { align-items: stretch; flex-direction: column; padding: 20px 16px; border-radius: 18px; }
  .support-page-header .support-primary-button { width: 100%; }
  .support-summary-grid { gap: 9px; }
  .support-summary-card { align-items: flex-start; flex-direction: column; padding: 14px; border-radius: 14px; }
  .support-summary-card strong { font-size: 22px; }
  .support-panel { border-radius: 18px; }
  .support-panel-heading { padding: 18px 16px; }
  .support-form-panel, .support-reply-panel { padding: 18px 15px; }
  .support-form-grid { grid-template-columns: minmax(0, 1fr); }
  .support-ticket-heading-row { align-items: flex-start; flex-direction: column; }
  .support-message { width: 96%; }
  .support-message__avatar { flex-basis: 32px; width: 32px; height: 32px; }
  .support-message__content { padding: 12px; }
  .support-reply-actions { align-items: stretch; flex-direction: column; }
  .support-reply-actions .support-primary-button, .support-file-button { width: 100%; }
  .support-form-actions { align-items: stretch; flex-direction: column-reverse; }
}
