:root {
  font-family: Madefor, "Helvetica Neue", Arial, sans-serif;
  color: #162d3d;
  background: #f0f4f7;
  font-synthesis: none;
  font-size: 14px;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
summary {
  cursor: pointer;
}
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
a:focus-visible {
  outline: 3px solid #8b22c6;
  outline-offset: 3px;
}
h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}
h1 {
  font-size: 28px;
  line-height: 1.25;
  margin-bottom: 8px;
  letter-spacing: -0.4px;
}
h2 {
  font-size: 18px;
  margin-bottom: 16px;
}
h3 {
  font-size: 17px;
  margin-bottom: 0;
}
h4 {
  font-size: 16px;
  margin-bottom: 8px;
}
p {
  line-height: 1.6;
  margin-bottom: 14px;
  max-width: 78ch;
}
small {
  font-size: 12px;
  line-height: 1.5;
}
a {
  color: #7820ad;
}
code {
  overflow-wrap: anywhere;
  font-size: 12px;
}
.topbar {
  /* WordPress provides the persistent account toolbar. Keep this header in
     normal flow so it cannot cover workspace navigation when scrolling. */
  position: static;
  min-height: 52px;
  background: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 24px;
  border-bottom: 1px solid #dce5eb;
  gap: 15px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 16px;
}
.brand b {
  font-size: 23px;
  letter-spacing: -1px;
}
.brand strong {
  font-size: 15px;
  font-weight: 500;
}
.divider {
  height: 24px;
  width: 1px;
  background: #dce5eb;
}
.live-main {
  max-width: 1240px;
  margin: 20px auto;
  padding: 0 28px;
}
.live-card {
  background: white;
  border: 1px solid #dce5eb;
  border-radius: 8px;
  padding: 18px;
  margin-bottom: 16px;
}
.live-columns {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 310px;
  gap: 16px;
}
.live-columns > aside {
  align-self: start;
  position: sticky;
  top: 86px;
}
.live-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}
.live-card :where(button:not([data-hook])),
.generation-dialog button {
  background: #8b22c6;
  color: white;
  border: 0;
  border-radius: 6px;
  padding: 10px 15px;
  margin: 4px 6px 4px 0;
}
.live-card button.secondary,
.generation-dialog button.secondary {
  background: #f5edfb;
  color: #7820ad;
}
.live-card button:disabled,
.generation-dialog button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.live-field {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 7px;
  margin: 10px 0;
  font-weight: 500;
  min-width: 0;
}
.live-field select,
.live-field input,
.live-field textarea {
  width: 100%;
  padding: 10px 11px;
  border: 1px solid #a7b8c5;
  border-radius: 6px;
  background: white;
  color: #162d3d;
  min-width: 0;
  font-weight: 400;
}
.live-field textarea {
  resize: vertical;
  min-height: 88px;
  line-height: 1.5;
}
.live-field small {
  font-weight: 400;
}
.live-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 16px 0;
  line-height: 1.6;
}
.live-check input {
  margin-top: 5px;
  width: 16px;
  height: 16px;
  accent-color: #8b22c6;
  flex-shrink: 0;
}
.live-muted {
  color: #52697a;
}
.credit-warning {
  padding: 12px;
  margin-top: 12px;
  border: 1px solid #e7b75f;
  border-radius: 6px;
  background: #fff8e5;
}
.credit-warning p {
  margin: 0;
}
.live-error {
  padding: 16px;
  background: #ffe9e9;
  border: 1px solid #edb4b4;
  border-radius: 8px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.live-error button {
  border: 0;
  background: none;
  font-size: 22px;
}
.live-card details {
  margin-top: 16px;
}
.live-card summary {
  font-weight: 500;
  margin-bottom: 10px;
}
.account-card {
  padding: 15px 20px;
}
.account-card h2 {
  font-size: 15px;
  margin-bottom: 3px;
}
.account-card p {
  margin-bottom: 0;
  font-size: 13px;
}
.account-card.connected h2:before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #16824b;
  border-radius: 50%;
  margin-right: 8px;
}
.account-card.connected button {
  font-size: 12px;
  padding: 7px 12px;
}
.live-products {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  max-height: 280px;
  overflow: auto;
  padding: 3px;
}
.live-card .product-option {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  text-align: left;
  border: 1px solid #dce5eb;
  background: white;
  color: #162d3d;
  padding: 8px;
  min-width: 0;
}
.product-option img,
.no-photo {
  width: 48px;
  height: 52px;
  object-fit: contain;
  background: #f3f5f7;
  flex-shrink: 0;
  border-radius: 3px;
}
.no-photo {
  font-size: 10px;
  display: grid;
  place-content: center;
}
.product-option > span {
  min-width: 0;
}
.product-option strong,
.product-option small {
  display: block;
  overflow-wrap: anywhere;
}
.product-option strong {
  font-size: 13px;
  font-weight: 500;
}
.product-option small {
  color: #52697a;
  margin-top: 3px;
}
.live-card .product-option.selected {
  border-color: #8b22c6;
  background: #f8f2fc;
}
.live-photos {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 10px;
  max-height: 260px;
  overflow: auto;
  padding: 3px;
}
.live-card .live-photo {
  background: white;
  color: #162d3d;
  border: 2px solid #e2e8ed;
  padding: 5px;
  margin: 0;
  overflow: hidden;
}
.live-card .live-photo.selected {
  border-color: #8b22c6;
}
.live-photo img {
  width: 100%;
  height: 95px;
  object-fit: contain;
}
.live-photo span {
  display: block;
  overflow-wrap: anywhere;
  padding: 5px;
  font-size: 12px;
}
.selected-source {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 15px 0;
}
.selected-source img {
  width: 78px;
  height: 88px;
  object-fit: contain;
  background: #f3f5f7;
  border-radius: 4px;
}
.selected-source strong {
  overflow-wrap: anywhere;
}
.selected-source p {
  font-size: 12px;
  color: #52697a;
  margin: 4px 0;
}
.style-description {
  font-size: 13px;
  color: #52697a;
  margin-top: -4px;
}
.summary-photo {
  display: block;
  width: 100%;
  height: 135px;
  object-fit: contain;
  background: #f4f6f8;
  border-radius: 5px;
  margin-bottom: 16px;
}
.generate-button {
  width: 100%;
  font-weight: 600 !important;
  margin: 8px 0 !important;
}
.generation-panel .live-muted {
  font-size: 12px;
}
.generation-panel > p {
  font-size: 13px;
}
.generation-panel details {
  padding-top: 14px;
  border-top: 1px solid #e6ecf0;
}
.generation-panel details p {
  font-size: 12px;
}
.generation-dialog {
  border: 1px solid #dce5eb;
  border-radius: 12px;
  max-width: 520px;
  width: calc(100vw - 40px);
  padding: 30px;
  color: #162d3d;
  box-shadow: 0 20px 80px #162d3d40;
}
.generation-dialog::backdrop {
  background: #162d3d88;
}
.confirm-price {
  display: block;
  font-size: 26px;
  margin: 20px 0;
}
.generation-dialog details {
  margin: 16px 0;
}
.generation-dialog details p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.status-pill {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  padding: 5px 10px;
  border-radius: 20px;
  background: #f5edfb;
  color: #7820ad;
  white-space: nowrap;
}
.status-review {
  background: #fff3dc;
  color: #78500b;
}
.status-attached,
.status-accepted {
  background: #e6f5ec;
  color: #17613c;
}
.status-rejected,
.status-stopped {
  background: #edf0f2;
  color: #52697a;
}
.result-card > .live-muted {
  font-size: 13px;
  margin-top: 7px;
}
.comparison-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 18px;
  max-width: 780px;
}
.comparison-grid figure {
  margin: 0;
  min-width: 0;
}
.comparison-grid img,
.comparison-grid video {
  width: 100%;
  height: 300px;
  object-fit: contain;
  background: #eff2f5;
  border-radius: 5px;
  display: block;
}
.comparison-grid video {
  background: #172633;
}
.comparison-large {
  max-width: none;
}
.comparison-large img,
.comparison-large video {
  height: 500px;
}
.comparison-grid figcaption {
  font-size: 12px;
  color: #52697a;
  margin: 8px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
}
.live-card button.text-button {
  background: none;
  color: #7820ad;
  padding: 2px;
  margin: 0;
  font-size: 12px;
}
.review-seek {
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.review-seek button.secondary {
  font-size: 12px;
  padding: 5px 10px;
}
.review-decision {
  border-top: 1px solid #e6ecf0;
  padding-top: 18px;
  margin-top: 16px;
}
.review-decision p {
  font-size: 13px;
}
.review-decision > small {
  display: block;
  color: #52697a;
  margin-bottom: 12px;
}
.review-decision details {
  max-width: 600px;
}
.action-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 10px 0;
}
.destination-note {
  padding: 12px 14px;
  background: #f4f7fa;
  border-radius: 5px;
  font-size: 12px;
  margin: 16px 0 0;
  max-width: none;
}
.review-notice {
  padding: 14px;
  background: #fff4df;
  border: 1px solid #ead1a0;
  border-radius: 5px;
  line-height: 1.6;
  margin: 10px 0;
}
.result-card > details {
  border-top: 1px solid #e6ecf0;
  padding-top: 14px;
}
.result-card > details p {
  font-size: 12px;
  overflow-wrap: anywhere;
}
@media (max-width: 900px) {
  .live-main {
    padding: 0 18px;
  }
  .live-columns {
    grid-template-columns: minmax(0, 1fr) 270px;
    gap: 16px;
  }
  .live-card {
    padding: 18px;
  }
  .topbar {
    padding: 12px 20px;
    font-size: 12px;
  }
  .live-products {
    grid-template-columns: 1fr;
  }
  .live-row {
    flex-wrap: wrap;
  }
  .live-columns .live-row {
    gap: 8px;
  }
  .live-columns .live-field {
    min-width: 110px;
  }
  .comparison-grid img,
  .comparison-grid video {
    height: 270px;
  }
}
@media (max-width: 700px) {
  .live-columns {
    display: flex;
    flex-direction: column;
  }
  .live-columns > aside {
    position: static;
    order: 0;
    width: 100%;
  }
  .generation-panel {
    display: grid;
    grid-template-columns: 80px 1fr;
    column-gap: 14px;
  }
  .generation-panel h2,
  .generation-panel > button,
  .generation-panel > .live-muted,
  .generation-panel > details,
  .generation-panel > div {
    grid-column: 1/-1;
  }
  .summary-photo {
    height: 85px;
    grid-row: 2/4;
    margin-bottom: 0;
  }
  .generation-panel > p {
    margin-bottom: 6px;
  }
  .topbar {
    position: relative;
    flex-wrap: wrap;
    gap: 8px;
  }
  .topbar > div:last-child {
    font-size: 12px;
  }
  .brand b {
    font-size: 21px;
  }
  .live-main {
    margin-top: 20px;
    padding: 0 14px;
  }
  h1 {
    font-size: 25px;
  }
  .comparison-grid {
    gap: 10px;
  }
  .comparison-grid img,
  .comparison-grid video {
    height: 220px;
  }
  .comparison-large img,
  .comparison-large video {
    height: 340px;
  }
  .comparison-grid figcaption {
    display: block;
  }
  .comparison-grid figcaption button {
    display: block;
  }
  .generation-dialog {
    padding: 18px;
  }
  .generation-dialog .live-row {
    gap: 8px;
  }
  .live-products {
    grid-template-columns: 1fr;
  }
  .result-card > .live-row {
    align-items: flex-start;
  }
  .status-pill {
    white-space: normal;
  }
}
@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
    animation: none !important;
  }
}

/* The native file input remains in the tab order inside its visible label. */
.upload-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  border: 1px solid #a7b8c5;
  border-radius: 6px;
  padding: 9px 14px;
  margin: 4px 10px 4px 0;
  background: white;
  color: #7820ad;
  cursor: pointer;
  line-height: 1.5;
  vertical-align: middle;
}
.upload-control input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.upload-control:focus-within {
  outline: 3px solid #8b22c6;
  outline-offset: 3px;
}
.upload-control[aria-disabled="true"] {
  opacity: 0.5;
  cursor: not-allowed;
}
.live-card .product-option:not(:disabled):hover,
.live-card .live-photo:not(:disabled):hover {
  background: #f8f2fc;
  border-color: #8b22c6;
}

.edit-price-note {
  display: block;
  margin-top: 6px;
  color: #52697a;
}
.live-columns > *,
.live-row > *,
.result-card h3 {
  min-width: 0;
}
.result-card h3,
.generation-panel p {
  overflow-wrap: anywhere;
}
@media (max-width: 420px) {
  .live-main {
    padding: 0 10px;
  }
  .live-card {
    padding: 12px;
  }
  .brand {
    gap: 8px;
    flex-wrap: wrap;
  }
  .live-columns .live-field {
    min-width: min(110px, 100%);
  }
  .comparison-grid {
    grid-template-columns: 1fr;
  }
  .generation-panel {
    display: block;
  }
  .generation-dialog {
    padding: 16px;
  }
  .live-main,
  .topbar {
    overflow-wrap: anywhere;
  }
  .selected-source {
    flex-wrap: wrap;
  }
  .upload-control,
  .live-card button {
    max-width: 100%;
    white-space: normal;
  }
}

/* Each form owns its priced action; there is no separate generation step. */
.live-columns { display: block; }
.generation-panel { display: block; margin-top: 18px; }

/* Keep the starting image and generation settings together. */
.video-settings .video-start-photo { display:flex; align-items:center; gap:12px; margin-bottom:14px; padding:10px; background:#f4f7fa; border-radius:6px; }
.video-start-photo img { width:64px; height:72px; object-fit:contain; border-radius:4px; }
.video-start-photo p { font-size:12px; color:#52697a; margin:3px 0 0; }
.video-settings .live-field { margin:6px 0; gap:4px; font-size:13px; }
.video-settings .live-field select { padding:7px 9px; min-height:34px; }
.video-settings .style-description { margin:6px 0 12px; line-height:1.5; }
.video-controls { display:grid; grid-template-columns:minmax(160px,1.25fr) minmax(0,2fr); gap:12px; align-items:start; }
.video-controls .live-row { gap:8px; flex-wrap:nowrap; }
.video-controls .live-field { min-width:0; }
.video-settings .generation-panel { margin-top:10px; }
.video-settings .generate-button { width:auto; min-height:34px; margin:4px 0 8px !important; }
.video-settings .generation-panel .live-muted { margin-bottom:0; }
@media (max-width:560px) { .video-controls { grid-template-columns:1fr; gap:2px; } }
@media (max-width:340px) { .video-controls .live-row { flex-wrap:wrap; } }

.edit-progress { margin:12px 0; padding:12px; border-radius:6px; background:#f5edfb; }
.edit-progress progress { display:block; width:100%; margin:10px 0; }
.edit-progress img { display:block; max-width:100%; height:180px; object-fit:contain; margin-top:10px; }
.edit-progress p { font-size:12px; margin:6px 0 0; }

.edit-controls{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:12px 0}.edit-controls .live-field{width:240px;max-width:100%;margin:0}.edit-controls select{padding:8px 12px;min-height:36px}

.title-account-row { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.title-account-row h1 { margin:0; }
.account-menu { position:relative; font-size:13px; }
.account-menu summary { cursor:pointer; color:#15764a; padding:6px 10px; white-space:nowrap; }
.account-menu button.secondary { position:absolute; z-index:5; right:0; top:100%; white-space:nowrap; background:white; box-shadow:0 3px 12px #0002; }

/* Drive uses a quiet explorer palette instead of the global primary-button style. */
.live-card .drive-explorer { --drive-blue:#8b22c6; --drive-ink:#162d3d; --drive-muted:#637588; --drive-line:#e3eaf2; margin:18px 0; border:1px solid var(--drive-line); border-radius:12px; background:#fff; overflow:hidden; color:var(--drive-ink); }
.live-card .drive-explorer button { display:inline-flex; align-items:center; justify-content:center; gap:8px; margin:0; padding:8px 10px; border:1px solid transparent; border-radius:6px; background:transparent; color:var(--drive-ink); font:inherit; font-size:13px; font-weight:500; line-height:1.4; cursor:pointer; box-shadow:none; }
.live-card .drive-explorer button:hover:not(:disabled) { background:#f5edfb; color:#7820ad; }
.live-card .drive-explorer button:focus-visible { outline:2px solid var(--drive-blue); outline-offset:2px; }
.live-card .drive-explorer button:disabled { opacity:.55; cursor:default; }
.drive-explorer svg { flex-shrink:0; }
.drive-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 16px; border-bottom:1px solid var(--drive-line); }
.drive-breadcrumbs { display:flex; align-items:center; flex-wrap:wrap; gap:2px; min-width:0; }
.live-card .drive-breadcrumbs button { font-size:13px; padding:5px; max-width:200px; text-align:left; }
.live-card .drive-breadcrumbs button[aria-current] { font-weight:650; }
.drive-breadcrumbs button>svg { color:var(--drive-blue); }
.drive-crumb { display:flex; align-items:center; min-width:0; }
.drive-crumb>svg { width:13px; color:var(--drive-muted); }
.live-card .drive-crumb button { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; display:block; }
.drive-search { display:flex; align-items:center; gap:8px; flex:0 1 280px; border:1px solid #ccd8e5; border-radius:7px; padding:8px 10px; color:var(--drive-muted); }
.drive-search:focus-within { border-color:var(--drive-blue); box-shadow:0 0 0 2px #8b22c614; }
.drive-search input { width:100%; min-width:0; border:0; outline:0; padding:0; background:transparent; color:var(--drive-ink); font:inherit; font-size:13px; }
.drive-search input::placeholder { color:var(--drive-muted); }
.drive-workspace { display:grid; grid-template-columns:205px minmax(0,1fr); min-height:330px; }
.drive-sidebar { background:#f6f8fb; border-right:1px solid var(--drive-line); padding:16px 10px; min-width:0; }
.drive-sidebar h3 { font-size:12px; font-weight:600; color:var(--drive-muted); margin:0 10px 12px; }
.live-card .drive-explorer .drive-folder-row { display:flex; width:100%; justify-content:flex-start; gap:10px; padding:10px; margin:2px 0; text-align:left; font-size:12px; min-height:40px; }
.drive-folder-row>svg { width:18px; color:var(--drive-blue); }
.drive-folder-row>span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.drive-folder-row>svg:last-child:not(:first-child) { width:12px; margin-left:auto; color:#8a9bab; }
.live-card .drive-explorer .drive-folder-row.is-current { background:#f0e3f8; color:#7820ad; font-weight:600; }
.drive-folder-list { max-height:395px; overflow:auto; scrollbar-width:thin; }
.drive-sidebar-empty { color:var(--drive-muted); font-size:12px; padding:4px 10px; }
.drive-content { padding:18px; min-width:0; }
.drive-content-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.drive-content-heading>div:first-child { display:flex; align-items:baseline; gap:8px; min-width:0; }
.drive-content-heading h3 { font-size:15px; line-height:1.4; margin:0; overflow-wrap:anywhere; }
.drive-content-heading span { font-size:12px; color:var(--drive-muted); white-space:nowrap; }
.drive-filters { display:flex; gap:3px; padding:3px; background:#f2f5f9; border-radius:7px; }
.live-card .drive-filters button { font-size:12px; padding:5px 10px; }
.live-card .drive-filters button[aria-pressed="true"] { background:#fff; color:#7820ad; box-shadow:0 1px 3px #163a5e16; }
.drive-media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; max-height:470px; overflow:auto; scrollbar-width:thin; padding:2px; }
.drive-media-card { min-width:0; border:1px solid var(--drive-line); border-radius:8px; padding:8px; display:flex; flex-direction:column; gap:0; background:#fff; }
.drive-media-card:hover { border-color:#bccde2; }
.drive-thumbnail { position:relative; overflow:hidden; border-radius:4px; background:#f3f5f7; aspect-ratio:4/3; }
.drive-thumbnail>img,.drive-thumbnail>video { width:100%; height:100%; object-fit:contain; display:block; }
.drive-thumbnail>img { object-fit:cover; }
.live-card .drive-explorer .drive-play { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:44px; height:44px; padding:0; border:1px solid #ffffffc0; border-radius:50%; background:#162d3dc4; color:white; }
.live-card .drive-explorer .drive-play:hover:not(:disabled) { background:#8b22c6; color:white; }
.drive-play svg { width:20px; fill:currentColor; }
.drive-media-info { margin:10px 3px; }
.drive-media-info h4 { margin:0 0 3px; font-size:12px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.drive-media-info>span { font-size:11px; color:var(--drive-muted); }
.drive-media-actions { display:flex; gap:4px; align-items:center; margin-top:auto; }
.live-card .drive-media-actions button { flex:1; font-size:12px; padding:7px 5px; min-height:32px; color:#7820ad; }
.live-card .drive-media-actions .drive-use-photo { border-color:#a4c6fb; }
.drive-media-card small { padding:6px 3px 0; color:var(--drive-muted); font-size:11px; }
.drive-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--drive-line); padding:10px 16px; color:var(--drive-muted); font-size:11px; }
.live-card .drive-footer button { color:var(--drive-muted); font-size:12px; }
.drive-footer svg { width:15px; height:15px; }
.drive-no-preview { display:grid; place-items:center; height:100%; color:#8b9caf; }
.drive-no-preview svg { width:34px; height:34px; }
.drive-empty,.drive-loading { display:flex; align-items:center; justify-content:center; flex-direction:column; min-height:260px; text-align:center; gap:12px; color:var(--drive-muted); font-size:13px; }
.drive-empty>svg { width:32px; height:32px; }
.drive-empty strong { color:var(--drive-ink); font-weight:500; }
.drive-empty p { margin:0; font-size:12px; }
.drive-error { background:#fff4f2; color:#9c3325; padding:12px 16px; font-size:13px; border-bottom:1px solid #f1d3cd; }
.live-card.media-source-card>button { background:white; color:#526b85; border:1px solid #d3deeb; }
.live-card.media-source-card>button[aria-expanded="true"] { color:#7820ad; background:#f5edfb; border-color:#abcafa; }
@media(max-width:760px) {
 .drive-workspace { grid-template-columns:170px minmax(0,1fr); }
 .drive-toolbar { flex-wrap:wrap; gap:8px; }
 .drive-search { flex:1 0 100%; box-sizing:border-box; }
 .drive-content { padding:12px; }
 .drive-media-grid { grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); }
}
@media(max-width:520px) {
 .drive-workspace { grid-template-columns:1fr; }
 .drive-sidebar { border-right:0; border-bottom:1px solid var(--drive-line); padding:10px; }
 .drive-folder-list { max-height:132px; }
 .drive-sidebar h3 { margin-bottom:5px; }
 .drive-media-grid { grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
 .drive-content-heading { gap:8px; }
 .drive-footer { align-items:flex-start; }
 .drive-footer span { max-width:75%; }
}

/* Picsart action palette. */
.live-main a { color:#7820ad; }
.live-main input[type=checkbox], .live-main input[type=radio] { accent-color:#8b22c6; }
.picsart-connect .live-card button:hover:not(:disabled) { background-color:#7820ad; }

.picsart-connect-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; padding:11px 22px; border:1px solid #8b22c6; border-radius:999px; background:#8b22c6; color:#fff; font-family:inherit; font-size:14px; line-height:1.4; font-weight:600; white-space:nowrap; box-shadow:0 2px 5px #8b22c626; transition:background-color .15s,box-shadow .15s; }
.picsart-connect-button:hover:not(:disabled) { background:#7820ad; border-color:#7820ad; box-shadow:0 3px 8px #8b22c633; }
.picsart-connect-button:focus-visible { outline:3px solid #7820ad; outline-offset:3px; }
.picsart-connect-button:disabled { opacity:.6; cursor:not-allowed; box-shadow:none; }
.picsart-connect-button[aria-busy=true]::before { content:""; width:14px; height:14px; border:2px solid #ffffff66; border-top-color:#fff; border-radius:50%; animation:picsart-connect-spin .8s linear infinite; }
@keyframes picsart-connect-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .picsart-connect-button { transition:none; } .picsart-connect-button[aria-busy=true]::before { animation:none; } }

[hidden]{display:none!important}
.picsart-workspace-nav{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0;border-bottom:1px solid #e5dbea;padding-bottom:12px}.picsart-workspace-nav a{padding:10px 18px;border-radius:999px;color:#7820ad;text-decoration:none;font-weight:600}.picsart-workspace-nav a[aria-current=page]{background:#8b22c6;color:white}.picsart-workspace-nav a:hover{background:#f0e3f8;color:#7820ad}

.picsart-credit-status:empty{display:none}.picsart-credit-status{position:sticky;top:32px;z-index:25;padding:8px 24px;background:#fff5df;color:#59400c;border-bottom:1px solid #dfc57b}.picsart-credit-status p{margin:4px 0}.picsart-credit-status a{color:#7820ad;font-weight:600}@media(max-width:782px){.picsart-credit-status{top:46px}}

.media-type-filters{display:flex;gap:8px;align-items:center}.media-type-filters button{padding:8px 18px;border:1px solid #8b22c6;border-radius:999px;background:white;color:#7820ad;font-weight:600}.media-type-filters button[aria-pressed=true]{background:#8b22c6;color:white}.media-type-filters button:focus-visible{outline:3px solid #7820ad;outline-offset:3px}

.picsart-wordmark{display:inline-flex;color:#8b22c6;align-items:center;}
.picsart-wordmark svg{display:block;width:104px;height:24px;}
.picsart-settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:20px;margin-top:24px;}
.picsart-settings-grid dt{font-weight:600;margin-top:16px;}
.picsart-settings-grid dd{margin:6px 0 16px;overflow-wrap:anywhere;}
.picsart-settings-grid li{margin-bottom:12px;}

.picsart-header-account{display:flex;align-items:center;gap:12px;}
.picsart-settings-link{display:inline-flex;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;border-radius:50%;color:#52616b;text-decoration:none;}
.picsart-settings-link:hover,.picsart-settings-link[aria-current="page"]{color:#8b22c6;background:#f4e8fb;}
.picsart-settings-link:focus-visible{outline:2px solid #8b22c6;outline-offset:3px;}

.picsart-connected-status{display:inline-flex;align-items:center;gap:6px;color:#167448;font-size:14px;white-space:nowrap;}
.picsart-settings-grid .picsart-disconnect-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 16px;border:1px solid #cad1d8;border-radius:8px;background:#fff;color:#344054;box-shadow:none;font:inherit;font-weight:600;cursor:pointer;}
.picsart-settings-grid .picsart-disconnect-button:hover:not(:disabled){background:#fff4f3;border-color:#dba5a0;color:#a62a22;}
.picsart-settings-grid .picsart-disconnect-button:focus-visible{outline:2px solid #8b22c6;outline-offset:3px;}
.picsart-settings-grid .picsart-disconnect-button:disabled{opacity:.6;cursor:wait;}

.picsart-dismissible-help{position:relative}.picsart-dismissible-help>div>.review-notice{padding-right:58px}.picsart-dismissible-help:not(:has(.review-notice)){display:none}
.picsart-hide-help{position:absolute;right:12px;top:12px;width:32px;height:32px;padding:0!important;border:0!important;background:transparent!important;color:#173041!important;font-size:24px!important;line-height:1;cursor:pointer}
.picsart-hide-help:focus-visible{outline:2px solid #861acb;outline-offset:2px}.picsart-help-restore{display:flex;justify-content:flex-end;margin:8px 0}.picsart-help-restore button{display:flex;align-items:center;gap:7px}.picsart-help-restore button>span:first-child{font-size:22px}
.device-sign-in{padding:16px;margin:16px 0;border:1px solid #b9d6ef;border-radius:8px;background:#f0f7ff;max-width:560px}.device-sign-in h2{margin:0 0 8px;font-size:17px}.device-sign-in p{margin:8px 0}
.device-code-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0}.device-code{font:600 28px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.12em;user-select:all;background:white;border:1px solid #b9d6ef;border-radius:6px;padding:6px 12px}
.device-open{font-weight:600}.device-actions{display:flex;gap:8px;flex-wrap:wrap}
