:root {
  --page-bg: #f2f4f8;
  --panel-bg: #ffffff;
  --panel-soft: #f7f8fb;
  --panel-muted: #eef2f6;
  --rail-bg: #181920;
  --rail-muted: #9799a5;
  --rail-active: #2d2f38;
  --line: #dce2ea;
  --line-strong: #c7cfdb;
  --text: #2b3645;
  --muted: #7f8a9c;
  --blue: #4b7df0;
  --blue-soft: rgba(75, 125, 240, 0.12);
  --green: #5a9362;
  --green-soft: rgba(90, 147, 98, 0.12);
  --orange: #c9892f;
  --orange-soft: rgba(201, 137, 47, 0.12);
  --red: #c55c5c;
  --red-soft: rgba(197, 92, 92, 0.12);
  --purple: #8a5cf6;
  --purple-soft: rgba(138, 92, 246, 0.14);
  --admin-line: var(--line);
  --admin-panel: var(--panel-bg);
  --admin-soft: var(--panel-soft);
  --admin-text: var(--text);
  --admin-muted: var(--muted);
  --shadow: 0 18px 42px rgba(32, 48, 72, 0.08);
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 14px;
}

.settings-signature-lab-card {
  display: grid;
  align-content: start;
  justify-items: start;
  gap: 16px;
  min-width: 0;
  padding: 36px clamp(28px, 3vw, 48px);
}

.settings-signature-lab-card > h2,
.settings-signature-lab-card > p {
  margin: 0;
}

.settings-signature-lab-card > p {
  max-width: 860px;
  line-height: 1.55;
}

@media (max-width: 720px) {
  .settings-signature-lab-card {
    padding: 28px 22px;
  }
}

.settings-privacy-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.settings-privacy-layout > .detail-card {
  min-width: 0;
}

.settings-privacy-mode-selector {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
  margin: 0;
  margin-top: 12px;
  padding: 0;
  border: 0;
}

.settings-privacy-mode-selector > legend {
  width: 100%;
  margin-bottom: 8px;
  padding: 0;
  color: var(--admin-text, #2b3645);
  font-size: 13px;
  font-weight: 850;
}

.settings-privacy-mode-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  min-width: 0;
  min-height: 92px;
  padding: 14px;
  border: 1px solid var(--admin-line, rgba(255, 255, 255, 0.12));
  border-radius: 14px;
  background: var(--admin-surface, #ffffff);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.settings-privacy-mode-card:hover {
  border-color: color-mix(in srgb, var(--admin-accent, #8555e8) 58%, var(--admin-line, #dce2ea));
  transform: translateY(-1px);
}

.settings-privacy-mode-card:has(input:checked) {
  border-color: var(--admin-accent, #8555e8);
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 9%, var(--admin-surface, #ffffff));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--admin-accent, #8555e8) 15%, transparent), 0 10px 22px rgba(79, 48, 139, 0.1);
}

.settings-privacy-mode-card:has(input:focus-visible) {
  outline: 3px solid color-mix(in srgb, var(--admin-accent, #8555e8) 34%, transparent);
  outline-offset: 2px;
}

.settings-privacy-mode-card > input {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  opacity: 0;
  pointer-events: none;
}

.settings-privacy-mode-card-copy {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.settings-privacy-mode-card-copy > strong {
  color: var(--admin-text, #2b3645);
  font-size: 13px;
}

.settings-privacy-mode-card-copy > span,
.settings-privacy-compliance-note span {
  color: var(--admin-muted, #a9a4af);
  font-size: 12px;
  line-height: 1.45;
}

.settings-privacy-mode-card-state {
  align-self: start;
  padding: 4px 8px;
  border-radius: 999px;
  background: var(--admin-accent, #8555e8);
  color: #ffffff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.04em;
  opacity: 0;
  transform: translateY(-2px);
  transition: opacity 160ms ease, transform 160ms ease;
}

.settings-privacy-mode-card:has(input:checked) .settings-privacy-mode-card-state {
  opacity: 1;
  transform: translateY(0);
}

.settings-privacy-mode-card:has(input:disabled) {
  cursor: not-allowed;
  opacity: 0.68;
}

.settings-privacy-compliance-note {
  display: grid;
  gap: 4px;
  margin-top: 12px;
  padding: 13px 14px;
  border: 1px solid rgba(255, 188, 72, 0.42);
  border-radius: 13px;
  background: rgba(255, 188, 72, 0.1);
}

.settings-privacy-inline-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

[data-privacy-swipe-settings] .settings-switch-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 70px;
  margin-bottom: 10px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-soft);
  cursor: pointer;
}
[data-privacy-swipe-settings] .settings-switch-row > span { display: grid; gap: 4px; }
[data-privacy-swipe-settings] .settings-switch-row small { color: var(--muted); font-size: 12px; line-height: 1.45; }
[data-privacy-swipe-settings] input[type="checkbox"] { flex: none; width: 20px; height: 20px; margin: 0; accent-color: var(--purple); }
[data-privacy-swipe-settings] .settings-field-row { display: grid; align-content: start; gap: 6px; }
[data-privacy-swipe-settings] .settings-field-row small { color: var(--muted); font-size: 12px; line-height: 1.45; }
[data-privacy-swipe-settings] .settings-privacy-inline-fields { margin-top: 18px; }

.settings-privacy-previews {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.settings-privacy-preview {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--admin-line, rgba(255, 255, 255, 0.12));
  border-radius: 16px;
  overflow: hidden;
  background: #f6f3ef;
  color: #151319;
}

.settings-privacy-preview.is-studio {
  background: #0d0c10;
  color: #ffffff;
}

.settings-privacy-preview > span {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.65;
}

.settings-privacy-preview-bar,
.settings-privacy-preview-cookie {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border-radius: 11px;
}

.settings-privacy-preview-bar {
  background: #8c62eb;
  color: #ffffff;
}

.settings-privacy-preview.is-studio .settings-privacy-preview-bar {
  background: #ddff62;
  color: #090909;
}

.settings-privacy-preview-cookie {
  flex-wrap: wrap;
  border: 1px solid rgba(12, 9, 16, 0.35);
  background: var(--settings-privacy-banner-color, #b993e8);
  color: var(--settings-privacy-banner-ink, #0c0910);
}

.settings-privacy-preview.is-studio .settings-privacy-preview-cookie {
  background: var(--settings-privacy-banner-color, #b993e8);
  color: var(--settings-privacy-banner-ink, #0c0910);
}

.settings-privacy-preview-bar strong,
.settings-privacy-preview-cookie strong {
  font-size: var(--settings-privacy-copy-size, 11px);
  font-weight: 900;
}

.settings-privacy-preview-bar span,
.settings-privacy-preview-cookie span {
  min-width: 120px;
  flex: 1 1 140px;
  font-size: 9px;
  opacity: 0.78;
}

.settings-privacy-preview button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: var(--settings-privacy-action-height, 28px);
  padding: 6px 9px;
  border: 1px solid var(--settings-privacy-action-bg, #09080c);
  border-radius: 999px;
  background: var(--settings-privacy-action-bg, #09080c);
  color: var(--settings-privacy-action-ink, #ffffff);
  font: inherit;
  font-size: var(--settings-privacy-action-size, 9px);
  font-weight: 850;
}

.settings-privacy-preview-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  color: var(--settings-privacy-action-icon, var(--settings-privacy-action-ink, #ffffff));
  opacity: 1 !important;
}

.settings-privacy-preview-action-icon svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-privacy-preview-action-label {
  min-width: 0 !important;
  flex: 0 1 auto !important;
  color: inherit !important;
  font-size: inherit !important;
  opacity: 1 !important;
}

.settings-privacy-preview-cookie {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 8px;
  padding: 7px 9px;
  border-radius: 0;
  min-height: var(--settings-privacy-banner-height, 64px);
}

.settings-privacy-preview-copy,
.settings-privacy-preview-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.settings-privacy-preview-actions {
  justify-content: center;
  flex-wrap: wrap;
}

.settings-privacy-preview-cookie[data-alignment="left"] .settings-privacy-preview-actions {
  justify-content: flex-start;
}

.settings-privacy-preview-cookie[data-alignment="right"] .settings-privacy-preview-actions {
  justify-content: flex-end;
}

.settings-privacy-preview-cookie .settings-privacy-preview-copy > span,
.settings-privacy-preview-cookie .settings-privacy-preview-copy > a {
  min-width: 0;
  flex: 0 1 auto;
  font-size: 8px;
  color: inherit;
  opacity: 0.74;
}

.settings-privacy-preview-info {
  width: 17px;
  height: 17px;
  display: inline-grid !important;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  line-height: 1;
}

.settings-privacy-preview-close {
  width: 27px;
  min-width: 27px;
  height: 27px;
  padding: 0 !important;
  border-radius: 50% !important;
  font-size: 16px !important;
}

.settings-switch-row.is-locked {
  opacity: 0.82;
}

.settings-privacy-color-field input[type="color"] {
  min-height: 48px;
  padding: 5px;
  cursor: pointer;
}

.settings-privacy-action-color-editor {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 16px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 5%, var(--admin-surface, #ffffff));
}

.settings-privacy-remind-hours-copy {
  display: block;
  margin-top: 5px;
  color: var(--admin-muted, #666b76);
  font-size: 11px;
  line-height: 1.35;
}

.settings-privacy-remind-hours-copy strong {
  color: var(--admin-accent, #7048cf);
}

.settings-privacy-remind-hours-copy[data-valid="false"] {
  color: var(--admin-danger, #ad3f52);
}

.settings-privacy-customize-disclosure {
  margin-top: 14px;
  border: 1px solid color-mix(in srgb, var(--admin-accent, #8555e8) 36%, var(--admin-line, #dce2ea));
  border-radius: 16px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 3%, var(--admin-surface, #ffffff));
  overflow: clip;
}

.settings-privacy-customize-disclosure > summary {
  padding: 15px 17px;
  color: var(--admin-accent, #7048cf);
  font-size: 14px;
  font-weight: 850;
  cursor: pointer;
  list-style-position: inside;
}

.settings-privacy-customize-disclosure[open] > summary {
  border-bottom: 1px solid var(--admin-line, #dce2ea);
}

.settings-privacy-customize-disclosure .settings-privacy-surface-profile-editor {
  margin-top: 0;
  border: 0;
  border-radius: 0;
}

.settings-privacy-customize-disclosure .settings-privacy-action-color-editor {
  margin: 0;
}

.settings-privacy-global-policy {
  display: grid;
  grid-template-columns: minmax(220px, 0.7fr) minmax(220px, 0.7fr) minmax(0, 2fr);
  gap: 10px;
  align-items: start;
}

.settings-privacy-surface-profile-card.is-global {
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 5%, var(--admin-surface, #ffffff));
}

.settings-privacy-contrast-note {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid color-mix(in srgb, var(--admin-accent, #8555e8) 22%, var(--admin-line, #dce2ea));
  border-radius: 14px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 8%, transparent);
  color: var(--admin-muted, #666b76);
  font-size: 12px;
  line-height: 1.4;
  transition: border-color 150ms ease, background 150ms ease, box-shadow 150ms ease;
}

.settings-privacy-contrast-note strong {
  color: var(--admin-text, #191721);
}

.settings-privacy-contrast-note-main {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.settings-privacy-force-action-colors {
  margin: 0;
  border: 1px solid color-mix(in srgb, var(--admin-accent, #8555e8) 20%, var(--admin-line, #dce2ea));
  border-radius: 11px;
  background: color-mix(in srgb, var(--admin-surface, #ffffff) 92%, var(--admin-accent, #8555e8));
}

.settings-privacy-force-action-colors input {
  accent-color: var(--admin-accent, #7657e8);
}

.settings-privacy-force-warning {
  display: none;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid #d79a31;
  border-radius: 11px;
  background: #fff7e6;
  color: #6f4910;
}

.settings-privacy-force-warning > span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #9b6417;
  color: #ffffff;
  font-size: 14px;
  font-weight: 950;
}

.settings-privacy-force-warning > div {
  display: grid;
  gap: 3px;
}

.settings-privacy-force-warning strong,
.settings-privacy-force-warning small {
  color: inherit;
}

.settings-privacy-contrast-note[data-force-active="true"] {
  border-color: #d79a31;
  background: color-mix(in srgb, #fff7e6 86%, var(--admin-surface, #ffffff));
  box-shadow: 0 0 0 3px color-mix(in srgb, #d79a31 10%, transparent);
}

.settings-privacy-contrast-note[data-force-active="true"] .settings-privacy-force-warning {
  display: grid;
}

.settings-privacy-surface-profile-editor {
  display: grid;
  gap: 12px;
  margin-top: 14px;
  padding: 14px;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 16px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 4%, var(--admin-surface, #ffffff));
}

.settings-privacy-profile-section-head,
.settings-privacy-profile-section-head span {
  display: grid;
  gap: 4px;
}

.settings-privacy-profile-section-head {
  padding-top: 2px;
}

.settings-privacy-profile-section-head:not(.is-intro) {
  padding-top: 5px;
  border-top: 1px solid color-mix(in srgb, var(--admin-line, #dce2ea) 72%, transparent);
}

.settings-privacy-profile-section-head span {
  color: var(--admin-muted, #666b76);
  font-size: 12px;
  line-height: 1.4;
}

.settings-privacy-surface-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.settings-privacy-domain-profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.settings-privacy-profile-disclosure {
  min-width: 0;
  margin: 0;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 13px;
  background: var(--admin-surface, #ffffff);
  overflow: clip;
}

.settings-privacy-profile-disclosure.is-domain {
  border-color: color-mix(in srgb, var(--admin-accent, #7657e8) 28%, var(--admin-border, #ded8e7));
  background: color-mix(in srgb, var(--admin-accent, #7657e8) 3%, var(--admin-surface, #fff));
}

.settings-privacy-profile-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  padding: 13px 14px;
  cursor: pointer;
  list-style: none;
  transition: background 160ms ease;
}

.settings-privacy-profile-disclosure > summary::-webkit-details-marker {
  display: none;
}

.settings-privacy-profile-disclosure > summary:hover {
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 6%, transparent);
}

.settings-privacy-profile-disclosure > summary:focus-visible {
  outline: 3px solid color-mix(in srgb, var(--admin-accent, #8555e8) 34%, transparent);
  outline-offset: -3px;
}

.settings-privacy-profile-disclosure > summary > span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-privacy-profile-disclosure > summary strong {
  color: var(--admin-text, #191721);
  font-size: 13px;
}

.settings-privacy-profile-disclosure > summary small {
  overflow: hidden;
  color: var(--admin-muted, #666b76);
  font-size: 11px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-privacy-profile-disclosure > summary > b {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 5px 9px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 11%, transparent);
  color: var(--admin-accent, #7048cf);
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
}

.settings-privacy-profile-disclosure > summary > b::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 160ms ease;
}

.settings-privacy-profile-disclosure[open] > summary {
  border-bottom: 1px solid var(--admin-line, #dce2ea);
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 6%, transparent);
}

.settings-privacy-profile-disclosure[open] > summary > b::after {
  transform: rotate(225deg) translate(-1px, -1px);
}

.settings-privacy-profile-disclosure > .settings-privacy-surface-profile-card {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.settings-privacy-surface-profile-card.is-domain {
  border-color: color-mix(in srgb, var(--admin-accent, #7657e8) 28%, var(--admin-border, #ded8e7));
  background: color-mix(in srgb, var(--admin-accent, #7657e8) 3%, var(--admin-surface, #fff));
}

.settings-privacy-domain-toggle {
  margin-bottom: 8px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--admin-accent, #7657e8) 6%, transparent);
}

.settings-privacy-surface-profile-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 13px;
}

.settings-privacy-profile-controls {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
}

.settings-privacy-profile-controls[data-inherited="true"] {
  opacity: 0.48;
}

.settings-privacy-profile-controls[data-inherited="true"] input,
.settings-privacy-profile-controls[data-inherited="true"] select,
.settings-privacy-profile-controls input:disabled {
  cursor: not-allowed;
}

.settings-privacy-independent-toggle {
  grid-column: 1 / -1;
  margin-bottom: 2px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 5%, transparent);
}

.settings-privacy-surface-profile-card legend {
  grid-column: 1 / -1;
  padding: 0 5px;
  font-size: 12px;
  font-weight: 850;
}

.settings-privacy-surface-theme-field {
  grid-column: 1 / -1;
}

.settings-privacy-profile-custom-colors {
  grid-column: 1 / -1;
  padding: 10px;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 11px;
}

.settings-privacy-profile-custom-colors summary {
  font-size: 12px;
  font-weight: 850;
  cursor: pointer;
}

.settings-privacy-profile-custom-colors > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}

.settings-privacy-profile-custom-colors fieldset {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  min-width: 0;
  margin: 0;
  padding: 8px;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 9px;
}

.settings-privacy-profile-custom-colors legend {
  grid-column: 1 / -1;
  padding: 0 4px;
  font-size: 10px;
  font-weight: 800;
  text-transform: capitalize;
}

.settings-privacy-action-color-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.settings-privacy-action-color-head > div,
.settings-privacy-action-color-head span {
  display: grid;
  gap: 4px;
}

.settings-privacy-action-color-head span {
  color: var(--admin-muted, #666b76);
  font-size: 12px;
  line-height: 1.4;
}

.settings-privacy-action-color-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.settings-privacy-action-color-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--admin-line, #dce2ea);
  border-radius: 13px;
}

.settings-privacy-action-color-card legend {
  grid-column: 1 / -1;
  width: calc(100% - 10px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 5px;
  font-size: 12px;
  font-weight: 850;
}

.settings-privacy-color-invert {
  appearance: none;
  min-height: 24px;
  padding: 2px 7px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--admin-accent, #7657e8);
  font: inherit;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
  transition: color 130ms ease, background 130ms ease, transform 130ms ease;
}

.settings-privacy-color-invert:hover,
.settings-privacy-color-invert:focus-visible {
  background: color-mix(in srgb, var(--admin-accent, #7657e8) 10%, transparent);
  color: color-mix(in srgb, var(--admin-accent, #7657e8) 82%, #24113d);
  transform: translateY(-1px);
}

.settings-privacy-color-invert:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--admin-accent, #7657e8) 38%, transparent);
  outline-offset: 1px;
}

.settings-privacy-color-invert:disabled {
  opacity: 0.42;
  cursor: not-allowed;
  transform: none;
}

.settings-privacy-action-contrast-status {
  grid-column: 1 / -1;
  min-height: 16px;
  color: var(--admin-muted, #666b76);
  font-size: 10px;
  line-height: 1.35;
}

.settings-privacy-action-color-card[data-contrast-valid="false"] {
  border-color: #bd3658;
  box-shadow: 0 0 0 2px color-mix(in srgb, #bd3658 12%, transparent);
}

.settings-privacy-action-color-card[data-contrast-valid="false"] .settings-privacy-action-contrast-status {
  color: #a52346;
  font-weight: 750;
}

.settings-privacy-action-color-card[data-contrast-valid="false"][data-contrast-forced="true"] {
  border-color: #d79a31;
  box-shadow: 0 0 0 2px color-mix(in srgb, #d79a31 14%, transparent);
}

.settings-privacy-action-color-card[data-contrast-valid="false"][data-contrast-forced="true"] .settings-privacy-action-contrast-status {
  color: #8a5810;
}

.settings-privacy-apply-row {
  position: sticky;
  bottom: 10px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--admin-accent, #8555e8) 34%, var(--admin-line, #d9dbe2));
  border-radius: 14px;
  background: color-mix(in srgb, var(--admin-surface, #ffffff) 94%, var(--admin-accent, #8555e8));
  box-shadow: 0 12px 28px rgba(24, 12, 45, 0.12);
}

.settings-privacy-apply-row > span {
  color: var(--admin-muted, #666b76);
  font-size: 12px;
  line-height: 1.4;
}

.settings-privacy-apply-row .admin-button {
  flex: 0 0 auto;
}

@media (max-width: 980px) {
  .settings-privacy-layout,
  .settings-privacy-previews,
  .settings-privacy-inline-fields,
  .settings-privacy-mode-selector {
    grid-template-columns: 1fr;
  }

  .settings-privacy-mode-card {
    min-height: 0;
  }

  .settings-privacy-apply-row {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-privacy-action-color-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .settings-privacy-surface-profile-grid {
    grid-template-columns: 1fr;
  }

  .settings-privacy-domain-profile-grid {
    grid-template-columns: 1fr;
  }

  .settings-privacy-global-policy {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .settings-privacy-profile-disclosure > summary {
    align-items: flex-start;
  }

  .settings-privacy-profile-disclosure > summary small {
    white-space: normal;
  }

  .settings-privacy-action-color-head {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-privacy-action-color-grid {
    grid-template-columns: 1fr;
  }

  .settings-privacy-surface-profile-grid {
    grid-template-columns: 1fr;
  }

  .settings-privacy-domain-profile-grid {
    grid-template-columns: 1fr;
  }

  .settings-privacy-profile-custom-colors > div {
    grid-template-columns: 1fr;
  }

  .settings-privacy-profile-custom-colors fieldset,
  .settings-privacy-action-color-card {
    grid-template-columns: 1fr;
  }

  .settings-privacy-profile-controls,
  .settings-privacy-surface-profile-card {
    grid-template-columns: 1fr;
  }

  .settings-privacy-contrast-note {
    align-items: stretch;
  }

  .settings-privacy-contrast-note-main {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Advertising Task 476: artwork source and contextual reach review */
.advertising-image-review {
  display: grid;
  gap: 0.65rem;
  padding: 1rem;
  border: 1px solid color-mix(in srgb, var(--admin-accent, #8555e8) 28%, var(--admin-line, #d9dbe2));
  border-radius: 18px;
  background: color-mix(in srgb, var(--admin-accent, #8555e8) 7%, var(--admin-surface, #fff));
}

.advertising-image-review header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 0.2rem 1rem;
}

.advertising-image-review header span,
.advertising-image-review p span {
  display: block;
  color: var(--admin-muted, #666b76);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.advertising-image-review header strong {
  grid-row: 1 / span 2;
  grid-column: 2;
  text-transform: capitalize;
}

.advertising-image-review header small,
.advertising-image-review p {
  margin: 0;
  color: var(--admin-muted, #666b76);
}

.advertising-image-review p {
  padding-top: 0.55rem;
  border-top: 1px solid color-mix(in srgb, var(--admin-line, #d9dbe2) 70%, transparent);
}

/* Advertising provider governance and destination evidence */
.advertising-music-provider-workspace,
.advertising-music-policy-form,
.advertising-music-plan-routing {
  min-width: 0;
  display: grid;
  gap: 18px;
}

.advertising-operation-gates {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.advertising-operation-gates > button {
  appearance: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--admin-line);
  border-left: 4px solid #9ea5b0;
  border-radius: 8px;
  background: var(--admin-panel);
  color: var(--admin-muted);
  font-size: 0.72rem;
  display: grid;
  gap: 3px;
  font-family: inherit;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.advertising-operation-gates > button:hover,
.advertising-operation-gates > button:focus-visible {
  border-color: color-mix(in srgb, var(--purple) 60%, var(--admin-line));
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--purple) 14%, transparent);
  outline: none;
  transform: translateY(-1px);
}

.advertising-operation-gates > button.is-enabled { border-left-color: #43b899; color: #187a62; }
.advertising-operation-gates > button > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.advertising-operation-gates > button > small { color: inherit; font-size: 0.72rem; }
.advertising-operation-gates strong { color: var(--admin-text); font-size: 0.76rem; }

.advertising-policy-inline-icon,
.advertising-policy-info-button {
  display: inline-grid;
  place-items: center;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  border: 1px solid color-mix(in srgb, var(--purple) 45%, var(--admin-line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--purple) 8%, var(--admin-panel));
  color: var(--purple);
  font-family: inherit;
  font-size: 0.67rem;
  font-weight: 900;
  line-height: 1;
  text-transform: none;
}

.advertising-policy-info-button {
  appearance: none;
  padding: 0;
  cursor: pointer;
}

.advertising-policy-info-button:hover,
.advertising-policy-info-button:focus-visible {
  border-color: var(--purple);
  background: var(--purple);
  color: #fff;
  outline: none;
}

.advertising-policy-overview-button {
  appearance: none;
  width: fit-content;
  margin-top: 8px;
  padding: 7px 10px;
  border: 1px solid color-mix(in srgb, var(--purple) 40%, var(--admin-line));
  border-radius: 999px;
  background: color-mix(in srgb, var(--purple) 7%, var(--admin-panel));
  color: var(--purple);
  cursor: pointer;
  font-family: inherit;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1;
}

.advertising-policy-overview-button:hover,
.advertising-policy-overview-button:focus-visible {
  border-color: var(--purple);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--purple) 12%, transparent);
  outline: none;
}

.advertising-music-policy-global {
  padding: 16px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  background: var(--admin-panel);
  display: grid;
  grid-template-columns: minmax(170px, .4fr) minmax(260px, 1fr) minmax(150px, .35fr);
  align-items: end;
  gap: 14px;
}

.advertising-music-policy-global > label:not(.advertising-music-policy-check),
.advertising-music-policy-global > div,
.advertising-music-provider-fields label {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.advertising-music-policy-global span,
.advertising-music-provider-fields span,
.advertising-music-plan-routing > header > span {
  color: var(--admin-muted);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.advertising-policy-field-label {
  min-width: 0;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.advertising-policy-field-label > span { min-width: 0; }

.advertising-music-policy-global select,
.advertising-music-provider-fields input,
.advertising-music-provider-fields select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 9px 10px;
  border: 1px solid var(--admin-line);
  border-radius: 6px;
  background: var(--admin-panel);
  color: var(--admin-text);
  font: inherit;
}

.advertising-music-policy-check,
.advertising-music-provider-checks label,
.advertising-music-plan-routing fieldset label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: var(--admin-text);
  font-size: 0.74rem;
  line-height: 1.4;
}

.advertising-music-policy-check-row {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.advertising-music-policy-check-row > label { min-width: 0; flex: 1 1 auto; }

.advertising-music-policy-check input,
.advertising-music-provider-checks input,
.advertising-music-plan-routing input {
  width: 18px;
  height: 18px;
  margin: 1px 0 0;
  flex: 0 0 auto;
  background: #fff;
  accent-color: var(--purple);
}

.advertising-music-provider-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.advertising-music-provider-card {
  min-width: 0;
  padding: 17px;
  border: 1px solid var(--admin-line);
  border-top: 4px solid #9ea5b0;
  border-radius: 8px;
  background: var(--admin-panel);
  display: grid;
  gap: 15px;
}

.advertising-music-provider-card.is-enabled { border-top-color: var(--purple); }
.advertising-music-provider-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.advertising-music-provider-card > header > div { min-width: 0; display: grid; gap: 3px; }
.advertising-music-provider-card > header > div > span { color: var(--purple); font-size: .67rem; font-weight: 900; text-transform: uppercase; }
.advertising-music-provider-card > header strong { overflow-wrap: anywhere; }
.advertising-music-provider-checks { display: grid; gap: 8px; }
.advertising-music-provider-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.advertising-music-provider-card > footer { display: flex; flex-wrap: wrap; gap: 6px; }
.advertising-music-provider-card > footer button {
  appearance: none;
  padding: 5px 7px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: var(--admin-soft);
  color: var(--admin-muted);
  cursor: pointer;
  font-family: inherit;
  font-size: .65rem;
  font-weight: 800;
  line-height: 1.2;
}

.advertising-music-provider-card > footer button:hover,
.advertising-music-provider-card > footer button:focus-visible {
  border-color: color-mix(in srgb, var(--purple) 45%, var(--admin-line));
  color: var(--purple);
  outline: none;
}

.advertising-music-plan-routing {
  padding: 17px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  background: var(--admin-panel);
}

.advertising-music-plan-routing > header { display: grid; gap: 4px; }
.advertising-music-plan-routing > header small { color: var(--admin-muted); line-height: 1.45; }
.advertising-music-plan-routing > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.advertising-music-plan-routing fieldset { min-width: 0; margin: 0; padding: 13px; border: 1px solid var(--admin-line); border-radius: 8px; display: grid; align-content: start; gap: 9px; }
.advertising-music-plan-routing legend { padding: 0 5px; font-size: .76rem; font-weight: 900; }
.advertising-music-plan-routing legend > span { vertical-align: middle; }
.advertising-music-plan-routing legend .advertising-policy-info-button { margin-left: 6px; vertical-align: middle; }

.advertising-music-policy-actions { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.advertising-music-policy-actions p { max-width: 760px; margin: 0; color: var(--admin-muted); font-size: .76rem; line-height: 1.45; }

.admin-dialog-card.is-advertising-policy-help-dialog { width: min(680px, calc(100vw - 32px)); }

.advertising-policy-help-dialog {
  display: grid;
  gap: 14px;
  color: var(--admin-text);
  outline: none;
}

.advertising-policy-help-dialog > p,
.advertising-policy-help-dialog > ul,
.advertising-policy-help-dialog > aside { margin: 0; }
.advertising-policy-help-dialog > p { color: var(--admin-text); font-size: 0.96rem; line-height: 1.55; }
.advertising-policy-help-dialog > ul { padding-left: 1.2rem; display: grid; gap: 9px; color: var(--admin-muted); font-size: 0.84rem; line-height: 1.5; }
.advertising-policy-help-dialog > ul li::marker { color: var(--purple); }
.advertising-policy-help-dialog > aside {
  padding: 11px 12px;
  border-left: 3px solid var(--purple);
  border-radius: 0 7px 7px 0;
  background: color-mix(in srgb, var(--purple) 7%, var(--admin-panel));
  color: var(--admin-muted);
  font-size: 0.78rem;
  line-height: 1.45;
}

.advertising-policy-help-current {
  padding: 10px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 7px;
  background: var(--admin-soft);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.advertising-policy-help-current span { color: var(--admin-muted); font-size: 0.7rem; font-weight: 850; text-transform: uppercase; }
.advertising-policy-help-current strong { color: var(--admin-text); }

.advertising-destination-review,
.advertising-music-review {
  margin-top: 18px;
  padding: 15px;
  border: 1px solid var(--admin-line);
  border-left: 4px solid #e4a344;
  border-radius: 8px;
  background: var(--admin-soft);
  display: grid;
  gap: 13px;
}

.advertising-destination-review.is-clear { border-left-color: #43b899; }
.advertising-destination-review > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.advertising-destination-review > header > div,
.advertising-music-review > header { min-width: 0; display: grid; gap: 3px; }
.advertising-destination-review > header span,
.advertising-music-review > header > span { color: var(--admin-muted); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.advertising-destination-review > header small,
.advertising-music-review > header small { overflow-wrap: anywhere; color: var(--admin-muted); font-size: .7rem; }
.advertising-destination-review > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.advertising-destination-review > div > span { padding: 9px; border: 1px solid var(--admin-line); border-radius: 6px; color: var(--admin-muted); font-size: .7rem; display: grid; gap: 2px; }
.advertising-destination-review > div strong { color: var(--admin-text); overflow-wrap: anywhere; }
.advertising-destination-review p { margin: 0; color: var(--red); font-size: .74rem; line-height: 1.4; }
.advertising-destination-review > button { width: fit-content; }

.advertising-music-review > div { display: grid; gap: 9px; }
.advertising-music-review article { min-width: 0; padding: 10px; border: 1px solid var(--admin-line); border-radius: 7px; background: var(--admin-panel); display: grid; gap: 7px; }
.advertising-music-review article.is-final { border-color: rgba(67, 184, 153, .55); }
.advertising-music-review article > span { color: var(--admin-text); font-size: .74rem; font-weight: 850; }
.advertising-music-review article audio { width: 100%; }
.advertising-music-review article small { color: var(--admin-muted); font-size: .68rem; line-height: 1.4; }

@media (max-width: 920px) {
  .advertising-operation-gates,
  .advertising-music-provider-grid,
  .advertising-music-plan-routing > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .advertising-music-policy-global { grid-template-columns: 1fr; align-items: stretch; }
}

@media (max-width: 620px) {
  .advertising-operation-gates,
  .advertising-music-provider-grid,
  .advertising-music-provider-fields,
  .advertising-music-plan-routing > div,
  .advertising-destination-review > div { grid-template-columns: 1fr; }
  .advertising-music-policy-actions,
  .advertising-destination-review > header { align-items: stretch; flex-direction: column; }
  .advertising-music-policy-actions .admin-button,
  .advertising-destination-review > button { width: 100%; }
}

.studio-eligibility-policy-card {
  background: linear-gradient(145deg, rgba(223, 255, 98, 0.2), rgba(145, 101, 255, 0.08));
}

.studio-eligibility-policy-facts {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 14px 0;
}

.studio-eligibility-policy-facts > span {
  align-items: flex-start;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(20, 20, 28, 0.1);
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  padding: 12px;
}

.studio-eligibility-policy-facts small,
.studio-eligibility-country-grid small {
  color: var(--muted, #777787);
}

.studio-eligibility-country-grid {
  border: 0;
  display: grid;
  gap: 9px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 14px 0;
  padding: 0;
}

.studio-eligibility-country-grid legend {
  color: var(--muted, #777787);
  font-size: 0.78rem;
  font-weight: 800;
  grid-column: 1 / -1;
  letter-spacing: 0.05em;
  margin-bottom: 4px;
  text-transform: uppercase;
}

.studio-eligibility-country-grid label {
  align-items: center;
  background: rgba(255, 255, 255, 0.74);
  border: 1px solid rgba(20, 20, 28, 0.1);
  border-radius: 12px;
  cursor: pointer;
  display: flex;
  gap: 10px;
  min-width: 0;
  padding: 10px 12px;
}

.studio-eligibility-country-grid label > span {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.studio-eligibility-custom-countries textarea {
  min-height: 104px;
  resize: vertical;
}

.studio-provider-strict-preset {
  align-items: center;
  background: rgba(223, 255, 98, 0.16);
  border: 1px solid rgba(185, 220, 56, 0.5);
  border-radius: 14px;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  margin: 12px 0;
  padding: 12px;
}

.studio-provider-strict-preset > span {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.studio-provider-strict-preset small {
  color: var(--muted, #777787);
  line-height: 1.4;
}

@media (max-width: 720px) {
  .advertising-admin-workspace,
  .advertising-admin-workspace > *,
  .advertising-voice-catalog,
  .advertising-voice-catalog > * {
    min-width: 0;
    max-width: 100%;
  }

  .studio-eligibility-policy-facts,
  .studio-eligibility-country-grid {
    grid-template-columns: 1fr;
  }

  .studio-provider-strict-preset {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Advertisement request review workspace */
.advertising-admin-workspace {
  min-width: 0;
}

.advertising-workspace-tabs {
  width: fit-content;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: flex;
  gap: 4px;
  background: var(--admin-soft);
}

.advertising-workspace-tabs button {
  min-height: 40px;
  padding: 8px 13px;
  border: 0;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--admin-muted);
  font: inherit;
  font-size: 0.8rem;
  font-weight: 900;
  cursor: pointer;
}

.advertising-workspace-tabs button.is-active {
  background: #17283f;
  color: #fff;
  box-shadow: 0 8px 18px rgba(23, 40, 63, 0.18);
}

.advertising-workspace-tabs button span {
  min-width: 22px;
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(138, 92, 246, 0.14);
  color: #7048cf;
  font-size: 0.65rem;
  text-align: center;
}

.advertising-workspace-tabs button.is-active span {
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
}

.advertising-voice-catalog {
  display: grid;
  gap: 18px;
}

.advertising-voice-catalog-header {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--admin-line);
}

.advertising-voice-catalog-header > div {
  flex: 0 1 760px;
  min-width: 0;
}

.advertising-voice-add-button {
  min-width: 148px;
  min-height: 44px;
}

.advertising-section-kicker {
  color: #7650d8;
  font-size: 0.68rem;
  font-weight: 950;
  text-transform: uppercase;
}

.advertising-voice-catalog-header h2 {
  margin: 5px 0 4px;
  font-size: 1.45rem;
}

.advertising-voice-catalog-header p {
  max-width: 760px;
  margin: 0;
  color: var(--admin-muted);
  line-height: 1.5;
}

.advertising-voice-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.advertising-voice-summary article {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  background: var(--admin-panel);
}

.advertising-voice-summary span,
.advertising-voice-summary small {
  color: var(--admin-muted);
  font-size: 0.7rem;
}

.advertising-voice-summary span {
  font-weight: 900;
  text-transform: uppercase;
}

.advertising-voice-summary strong {
  overflow-wrap: anywhere;
  font-size: 1.15rem;
}

.advertising-voice-pagination {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: var(--admin-panel);
}

.advertising-voice-pagination-status,
.advertising-voice-pagination label,
.advertising-voice-pagination-buttons {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--admin-muted);
  font-size: 0.72rem;
  font-weight: 750;
}

.advertising-voice-pagination select,
.advertising-voice-pagination input,
.advertising-voice-pagination button {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  background: var(--admin-panel);
  color: var(--admin-text);
  font: inherit;
}

.advertising-voice-search-field {
  flex: 1 1 230px;
  min-width: min(280px, 100%);
}

.advertising-voice-search-field input {
  width: 100%;
}

.advertising-voice-pagination button {
  cursor: pointer;
  font-weight: 800;
}

.advertising-voice-pagination button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.advertising-voice-control-fields {
  min-width: 0;
  display: flex;
  align-items: end;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

.advertising-voice-control-fields label {
  display: grid;
  align-items: start;
  gap: 3px;
}

.advertising-voice-control-fields label > span {
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.advertising-voice-bulk-toolbar {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: 10px;
  background: color-mix(in srgb, var(--admin-panel) 92%, #7650d8 8%);
}

.advertising-voice-select-visible {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 0.72rem;
  font-weight: 850;
}

.advertising-voice-select-visible input,
.advertising-voice-select input {
  width: 16px;
  height: 16px;
  accent-color: #7650d8;
  cursor: pointer;
}

.advertising-voice-bulk-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
}

.advertising-voice-bulk-toolbar button {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  background: var(--admin-panel);
  color: var(--admin-text);
  cursor: pointer;
  font: inherit;
  font-size: 0.68rem;
  font-weight: 850;
}

.advertising-voice-bulk-toolbar button:hover,
.advertising-voice-bulk-toolbar button:focus-visible {
  border-color: #7650d8;
  outline: 2px solid rgba(118, 80, 216, 0.16);
  outline-offset: 1px;
}

.advertising-voice-bulk-toolbar button:disabled {
  cursor: not-allowed;
  opacity: 0.4;
}

.advertising-voice-organize-access {
  margin-left: auto;
}

.advertising-voice-tier-filters {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.advertising-voice-tier-filters legend {
  margin: 0 0 3px;
  padding: 0;
  color: var(--admin-muted);
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.advertising-voice-tier-filters > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

.advertising-voice-tier-filters button {
  min-width: 34px;
  padding-inline: 8px;
  color: var(--admin-muted);
  font-weight: 900;
}

.advertising-voice-tier-filters button.is-active {
  border-color: #7650d8;
  background: #f1edff;
  color: #5736b2;
  box-shadow: inset 0 0 0 1px rgba(118, 80, 216, 0.08);
}

.advertising-voice-tier-filters button.is-starter.is-active {
  border-color: #4f86d9;
  background: #eaf3ff;
  color: #225da8;
}

.advertising-voice-tier-filters button.is-growth.is-active {
  border-color: #55a982;
  background: #e8f7ef;
  color: #247552;
}

.advertising-voice-tier-filters button.is-commercial.is-active,
.advertising-voice-tier-filters button.is-elarabeat.is-active {
  border-color: #7650d8;
  background: #eee8ff;
  color: #5736b2;
}

.advertising-voice-export-shell,
.advertising-voice-access-shell {
  position: relative;
}

.advertising-voice-export-trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  font-weight: 850;
}

.advertising-voice-export-trigger[aria-expanded="true"] {
  border-color: #7650d8;
  background: #f1edff;
  color: #5736b2;
}

.advertising-voice-menu.advertising-voice-export-menu {
  top: calc(100% + 8px);
  right: 0;
  width: 190px;
}

.advertising-voice-order-note {
  margin: -3px 0 0;
  color: var(--admin-muted);
  font-size: 0.68rem;
  text-align: right;
}

.advertising-voice-list {
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  overflow: visible;
  background: var(--admin-panel);
}

.advertising-voice-row {
  position: relative;
  min-width: 0;
  padding: 16px;
  border-bottom: 1px solid var(--admin-line);
  display: grid;
  grid-template-columns: 176px minmax(260px, 1fr) minmax(145px, 0.42fr) minmax(165px, 0.45fr) minmax(42px, auto);
  align-items: center;
  gap: 18px;
}

.advertising-voice-order {
  min-width: 0;
  display: grid;
  grid-template-columns: 18px minmax(40px, 1fr) 96px;
  align-items: center;
  gap: 7px;
}

.advertising-voice-select {
  display: grid;
  place-items: center;
}

.advertising-voice-order > span {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.advertising-voice-order small {
  color: var(--admin-muted);
  font-size: 0.56rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1.1;
  text-transform: uppercase;
}

.advertising-voice-order strong {
  font-size: 1.08rem;
}

.advertising-voice-position-value {
  width: fit-content;
  min-width: 30px;
  margin: 0;
  padding: 2px 5px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  cursor: text;
  font: inherit;
  font-size: 1.08rem;
  font-weight: 900;
  text-align: left;
}

.advertising-voice-position-value:hover,
.advertising-voice-position-value:focus-visible {
  border-color: #7650d8;
  background: rgba(118, 80, 216, 0.08);
  outline: 2px solid rgba(118, 80, 216, 0.14);
}

.advertising-voice-position-input {
  width: 54px;
  min-height: 32px;
  padding: 4px 6px;
  border: 1px solid #7650d8;
  border-radius: 7px;
  background: var(--admin-panel);
  color: var(--admin-text);
  font: inherit;
  font-weight: 900;
}

.advertising-voice-order > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3px;
  transition: opacity 140ms ease, transform 140ms ease;
}

.advertising-voice-order button {
  width: 100%;
  height: 25px;
  padding: 0;
  border: 1px solid var(--admin-line);
  border-radius: 7px;
  background: var(--admin-panel);
  color: var(--admin-text);
  cursor: pointer;
  font: inherit;
  font-weight: 950;
  line-height: 1;
}

.advertising-voice-order button.is-edge {
  font-size: 0.55rem;
  letter-spacing: 0.01em;
}

.advertising-voice-order button:hover,
.advertising-voice-order button:focus-visible {
  border-color: #7650d8;
  outline: 2px solid rgba(118, 80, 216, 0.16);
  outline-offset: 1px;
}

.advertising-voice-order button:disabled {
  cursor: not-allowed;
  opacity: 0.35;
}

.advertising-voice-row:last-child {
  border-bottom: 0;
}

.advertising-voice-row.is-enabled {
  box-shadow: inset 4px 0 0 #14161c;
}

.advertising-voice-row.is-company-only {
  background: rgba(118, 80, 216, 0.04);
  box-shadow: inset 4px 0 0 #7650d8;
}

.advertising-voice-row.is-company-default {
  box-shadow: inset 4px 0 0 #14161c;
}

.advertising-voice-row.is-unavailable {
  background: rgba(197, 92, 92, 0.045);
}

.advertising-voice-row.is-paused {
  background: rgba(180, 126, 34, 0.055);
  box-shadow: inset 4px 0 0 #b47e22;
}

.advertising-voice-row.is-selected {
  outline: 2px solid rgba(118, 80, 216, 0.28);
  outline-offset: -2px;
}

.advertising-voice-identity {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.advertising-voice-mark {
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  flex: 0 0 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #7058df, #5cc9c0);
  color: #fff;
  font-size: 1rem;
  font-weight: 950;
}

.advertising-voice-play-button {
  position: relative;
  cursor: pointer;
  transition: box-shadow 150ms ease, filter 150ms ease, transform 150ms ease;
}

.advertising-voice-play-button:hover,
.advertising-voice-play-button:focus-visible {
  box-shadow: 0 0 0 4px rgba(118, 80, 216, 0.16);
  filter: saturate(1.12);
  transform: translateY(-1px);
}

.advertising-voice-play-button:focus-visible {
  outline: 2px solid #14161c;
  outline-offset: 3px;
}

.advertising-voice-mark-play {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 22px;
  height: 22px;
  border: 2px solid #fff;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #14161c;
  color: #fff;
  box-shadow: 0 3px 9px rgba(20, 22, 28, 0.3);
  font-size: 0.61rem;
  line-height: 1;
  transform: translateX(1px);
  transition: background 130ms ease, box-shadow 130ms ease, transform 130ms ease;
}

.advertising-voice-play-button .advertising-voice-mark-play {
  color: #fff;
}

.advertising-voice-mark-initial {
  transition: transform 130ms ease;
}

.advertising-voice-play-button:not(:disabled):hover .advertising-voice-mark-play,
.advertising-voice-play-button:not(:disabled):focus-visible .advertising-voice-mark-play {
  background: #5736b2;
  box-shadow: 0 4px 12px rgba(87, 54, 178, 0.4);
  transform: translateX(1px) scale(1.12);
}

.advertising-voice-play-button:not(:disabled):hover .advertising-voice-mark-initial,
.advertising-voice-play-button:not(:disabled):focus-visible .advertising-voice-mark-initial {
  transform: scale(1.08);
}

.advertising-voice-play-button:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.advertising-voice-identity > div,
.advertising-voice-market-fit,
.advertising-voice-health {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.advertising-voice-market-fit small {
  color: var(--admin-muted);
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.advertising-voice-package-badge {
  width: max-content;
  max-width: 100%;
  padding: 5px 9px;
  border-radius: 999px;
  overflow: hidden;
  background: #14161c;
  color: #fff;
  font-size: 0.65rem;
  font-weight: 950;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advertising-voice-market-fit > span {
  overflow: hidden;
  color: #285ba4;
  font-size: 0.68rem;
  font-weight: 850;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advertising-voice-market-fit > .advertising-voice-gender {
  color: var(--admin-text);
  font-size: 0.64rem;
  font-weight: 800;
}

.advertising-voice-market-fit > .advertising-voice-gender.is-unset {
  color: var(--admin-muted);
  font-weight: 700;
}

.advertising-voice-usage {
  width: max-content;
  max-width: 100%;
  color: #285ba4;
  font-size: 0.68rem;
  font-weight: 900;
}

.advertising-voice-usage.is-unused {
  color: var(--admin-muted);
}

.advertising-voice-identity strong,
.advertising-voice-identity span,
.advertising-voice-identity code {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advertising-voice-positioning {
  max-width: 700px;
  margin: 1px 0 0;
  color: var(--admin-muted);
  font-size: 0.72rem;
  line-height: 1.45;
}

.advertising-voice-metadata {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.advertising-voice-metadata span {
  max-width: 100%;
  padding: 4px 7px;
  border: 1px solid rgba(138, 92, 246, 0.18);
  border-radius: 999px;
  overflow: hidden;
  background: rgba(138, 92, 246, 0.08);
  color: #6843c6;
  font-size: 0.62rem;
  font-weight: 850;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advertising-voice-metadata span.is-surcharge {
  border-color: rgba(219, 133, 33, 0.35);
  background: #fff3df;
  color: #9a5708;
}

.advertising-voice-metadata span.is-default {
  border-color: #14161c;
  background: #14161c;
  color: #fff;
}

.advertising-voice-metadata span.is-company-only {
  border-color: #6843c6;
  background: #6843c6;
  color: #fff;
}

.advertising-voice-metadata span.is-access {
  border-color: rgba(23, 128, 95, 0.3);
  background: #e4f6ef;
  color: #176c52;
}

.advertising-voice-metadata span.is-specialty {
  border-color: rgba(39, 94, 173, 0.28);
  background: #eaf2ff;
  color: #285ba4;
}

.advertising-voice-metadata span.is-language {
  border-color: rgba(34, 119, 138, 0.27);
  background: #e8f7f9;
  color: #226f7d;
}

.advertising-voice-metadata span.is-use-case {
  border-color: rgba(180, 113, 14, 0.28);
  background: #fff5db;
  color: #8d5a0e;
}

.advertising-voice-metadata span.is-notice,
.advertising-voice-metadata span.is-source {
  border-color: rgba(93, 103, 120, 0.24);
  background: #f0f2f5;
  color: #596273;
}

.advertising-voice-identity span,
.advertising-voice-identity code,
.advertising-voice-health small,
.advertising-voice-health > span:not(.advertising-status) {
  color: var(--admin-muted);
  font-size: 0.7rem;
}

.advertising-voice-health > span:not(.advertising-status) {
  color: var(--red);
  line-height: 1.35;
}

.advertising-voice-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.advertising-voice-attribute-group,
.advertising-voice-quick-actions {
  display: flex;
  align-items: center;
  gap: 5px;
}

.advertising-voice-attribute {
  width: 28px;
  height: 28px;
  border: 1px solid transparent;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 950;
  line-height: 1;
  cursor: pointer;
  font-family: inherit;
  transition: opacity 140ms ease, transform 140ms ease, box-shadow 140ms ease;
}

.advertising-voice-attribute.is-default {
  border-color: #14161c;
  background: #14161c;
}

.advertising-voice-attribute.is-company-only,
.advertising-voice-attribute.is-access-commercial,
.advertising-voice-attribute.is-access-elarabeat {
  border-color: #6843c6;
  background: #6843c6;
}

.advertising-voice-attribute.is-access-starter {
  border-color: #4f86d9;
  background: #4f86d9;
}

.advertising-voice-attribute.is-access-growth {
  border-color: #3d9b70;
  background: #3d9b70;
}

.advertising-voice-attribute.is-access {
  width: 30px;
  height: 30px;
}

.advertising-voice-attribute.is-access-starter,
.advertising-voice-attribute.is-access-growth {
  font-size: 0.58rem;
}

.advertising-voice-attribute.is-surcharge {
  border-color: #a66211;
  background: #fff1d8;
  color: #8a4c06;
}

.advertising-voice-attribute.is-inactive {
  border-color: #c8ced9;
  background: #eef1f5;
  color: #7f8795;
  opacity: 0.58;
}

.advertising-voice-attribute:not(:disabled):hover,
.advertising-voice-attribute:not(:disabled):focus-visible,
.advertising-voice-attribute[aria-expanded="true"] {
  opacity: 1;
  outline: 2px solid rgba(118, 80, 216, 0.2);
  outline-offset: 2px;
  box-shadow: 0 3px 10px rgba(31, 31, 45, 0.16);
  transform: translateY(-1px);
}

.advertising-voice-attribute:disabled {
  cursor: not-allowed;
}

.advertising-voice-menu.advertising-voice-access-menu {
  top: calc(100% + 8px);
  right: 0;
  width: 230px;
}

.advertising-voice-quick-actions {
  transition: opacity 140ms ease, transform 140ms ease;
}

.advertising-voice-quick-actions button {
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid var(--admin-line);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--admin-panel);
  color: #303544;
  cursor: pointer;
  font: inherit;
  font-size: 0.93rem;
  font-weight: 950;
  line-height: 1;
}

.advertising-voice-quick-actions button:hover,
.advertising-voice-quick-actions button:focus-visible {
  border-color: #7650d8;
  outline: 2px solid rgba(118, 80, 216, 0.16);
  outline-offset: 1px;
  background: #f1edff;
  color: #5736b2;
}

.advertising-voice-quick-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.42;
}

.advertising-voice-menu-shell {
  position: relative;
  width: 42px;
  min-width: 42px;
}

.advertising-voice-menu-trigger {
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid var(--admin-line);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #f1f3f6;
  color: #14161c;
  font: inherit;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  transition: opacity 140ms ease, transform 140ms ease, border-color 140ms ease, background 140ms ease;
}

.advertising-voice-menu-trigger:hover,
.advertising-voice-menu-trigger:focus-visible,
.advertising-voice-menu-trigger[aria-expanded="true"] {
  border-color: #14161c;
  background: #e7eaf0;
}

.advertising-voice-menu-trigger:focus-visible {
  outline: 2px solid #7650d8;
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  .advertising-voice-row .advertising-voice-order > div,
  .advertising-voice-row .advertising-voice-quick-actions,
  .advertising-voice-row .advertising-voice-menu-trigger {
    opacity: 0;
    pointer-events: none;
    transform: translateY(3px);
  }

  .advertising-voice-row:hover .advertising-voice-order > div,
  .advertising-voice-row:hover .advertising-voice-quick-actions,
  .advertising-voice-row:hover .advertising-voice-menu-trigger,
  .advertising-voice-row:focus-within .advertising-voice-order > div,
  .advertising-voice-row:focus-within .advertising-voice-quick-actions,
  .advertising-voice-row:focus-within .advertising-voice-menu-trigger,
  .advertising-voice-order button:focus-visible,
  .advertising-voice-quick-actions:focus-within,
  .advertising-voice-menu-trigger:focus-visible,
  .advertising-voice-menu-trigger[aria-expanded="true"] {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }
}

@media (hover: none) {
  .advertising-voice-quick-actions {
    display: none;
  }
}

.advertising-voice-menu {
  position: absolute;
  z-index: 40;
  top: calc(100% + 8px);
  right: 0;
  width: min(250px, calc(100vw - 32px));
  padding: 7px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: grid;
  gap: 2px;
  background: var(--admin-panel);
  box-shadow: 0 18px 45px rgba(31, 31, 45, 0.18);
}

.advertising-voice-menu[hidden] {
  display: none;
}

.advertising-voice-row:nth-last-child(-n + 2) .advertising-voice-menu {
  top: auto;
  bottom: calc(100% + 8px);
}

.advertising-voice-menu-item {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--admin-text);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.advertising-voice-menu-item:hover,
.advertising-voice-menu-item:focus-visible {
  outline: 0;
  background: #f1f3f6;
}

.advertising-voice-menu-item:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.advertising-voice-menu-item.is-danger {
  color: #b52f35;
}

.advertising-voice-menu-item.is-danger:hover,
.advertising-voice-menu-item.is-danger:focus-visible {
  background: #fff0f1;
}

.advertising-voice-pagination .advertising-voice-menu-item {
  width: 100%;
  min-height: 40px;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  text-align: left;
}

.advertising-voice-pagination .advertising-voice-menu-item:hover,
.advertising-voice-pagination .advertising-voice-menu-item:focus-visible {
  background: #f1f3f6;
}

.advertising-voice-menu-icon,
.advertising-voice-menu-check {
  display: grid;
  place-items: center;
  font-size: 0.86rem;
  font-weight: 950;
}

.advertising-voice-menu-check {
  color: #5736b2;
}

.advertising-voice-menu-divider {
  height: 1px;
  margin: 5px 4px;
  display: block;
  background: var(--admin-line);
}

.admin-dialog-card.is-advertising-voice-profile-dialog {
  width: min(100%, 860px);
}

.advertising-voice-profile-form,
.advertising-voice-positioning-field {
  display: grid;
  gap: 9px;
}

.advertising-voice-profile-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.advertising-voice-profile-grid > label,
.advertising-voice-gender-fieldset,
.advertising-voice-positioning-field {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 7px;
}

.advertising-voice-profile-grid > label > span:first-child,
.advertising-voice-gender-fieldset legend,
.advertising-voice-positioning-field > span:first-child,
.advertising-voice-quality-fieldset legend {
  color: var(--admin-text);
  font-size: 0.76rem;
  font-weight: 900;
}

.advertising-voice-gender-fieldset {
  margin: 0;
  padding: 11px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
}

.advertising-voice-gender-fieldset legend {
  padding: 0 4px;
}

.advertising-voice-gender-fieldset > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}

.advertising-voice-gender-fieldset label {
  position: relative;
  min-width: 0;
}

.advertising-voice-gender-fieldset input {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.advertising-voice-gender-fieldset label > span {
  min-height: 34px;
  padding: 7px 8px;
  border: 1px solid var(--admin-line);
  border-radius: 9px;
  display: grid;
  place-items: center;
  background: var(--admin-panel);
  color: var(--admin-muted);
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 850;
}

.advertising-voice-gender-fieldset input:checked + span {
  border-color: #7650d8;
  background: #eee8ff;
  color: #5736b2;
  box-shadow: inset 0 0 0 1px rgba(118, 80, 216, 0.08);
}

.advertising-voice-gender-fieldset input:focus-visible + span {
  outline: 3px solid rgba(118, 80, 216, 0.2);
  outline-offset: 2px;
}

.advertising-voice-gender-fieldset small {
  color: var(--admin-muted);
  font-size: 0.68rem;
  line-height: 1.4;
}

.advertising-voice-profile-grid select,
.advertising-voice-positioning-field textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
  background: var(--admin-panel);
  color: var(--admin-text);
  font: inherit;
}

.advertising-voice-positioning-field textarea {
  min-height: 92px;
  padding-right: 58px;
  resize: vertical;
  line-height: 1.45;
}

.advertising-voice-positioning-editor {
  position: relative;
  display: block;
  min-width: 0;
}

.advertising-voice-positioning-editor textarea {
  display: block;
}

.advertising-voice-positioning-editor button {
  position: absolute;
  z-index: 2;
  top: 10px;
  right: 10px;
  display: grid;
  width: 38px;
  height: 38px;
  padding: 0;
  place-items: center;
  border: 1px solid #c9bdf2;
  border-radius: 999px;
  color: #5d43bd;
  background: #f3efff;
  box-shadow: 0 7px 16px rgba(97, 72, 179, 0.14);
  cursor: pointer;
  transition: color 150ms ease, background 150ms ease, border-color 150ms ease, opacity 140ms ease, transform 150ms ease;
}

.advertising-voice-positioning-editor button svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.advertising-voice-positioning-editor button:hover,
.advertising-voice-positioning-editor button:focus-visible {
  border-color: #7650d8;
  color: #fff;
  background: #7650d8;
  outline: 0;
  transform: scale(1.04);
}

.advertising-voice-positioning-editor button:active {
  transform: scale(0.96);
}

.advertising-voice-positioning-field small[data-tone="success"] {
  color: #6543cf;
  font-weight: 800;
}

@media (hover: hover) and (pointer: fine) {
  .advertising-voice-positioning-editor button {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.9);
  }

  .advertising-voice-positioning-editor:hover button,
  .advertising-voice-positioning-editor:focus-within button,
  .advertising-voice-positioning-editor button:focus-visible {
    opacity: 1;
    pointer-events: auto;
    transform: scale(1);
  }
}

@media (max-width: 620px) {
  .advertising-voice-positioning-field textarea {
    min-height: 134px;
  }
}

.advertising-voice-profile-grid select:focus,
.advertising-voice-positioning-field textarea:focus {
  border-color: #7650d8;
  outline: 3px solid rgba(118, 80, 216, 0.16);
}

.advertising-voice-profile-grid small,
.advertising-voice-positioning-field small {
  color: var(--admin-muted);
  font-size: 0.68rem;
  line-height: 1.4;
}

.advertising-voice-default-field {
  padding: 12px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
  background: var(--admin-soft);
}

.advertising-voice-check-field,
.advertising-voice-quality-option {
  display: flex;
  align-items: center;
  gap: 8px;
}

.advertising-voice-check-field input,
.advertising-voice-quality-option input {
  width: 17px;
  height: 17px;
  accent-color: #7650d8;
}

.advertising-voice-quality-fieldset {
  min-width: 0;
  margin: 5px 0;
  padding: 13px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
}

.advertising-voice-quality-fieldset legend {
  padding: 0 5px;
}

.advertising-voice-quality-fieldset > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.advertising-voice-surcharge-fieldset {
  min-width: 0;
  margin: 5px 0 0;
  padding: 13px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
  display: grid;
  gap: 12px;
}

.advertising-voice-surcharge-fieldset legend,
.advertising-voice-surcharge-fieldset label > span:first-child,
.advertising-voice-surcharge-scan > span {
  color: var(--admin-text);
  font-size: 0.76rem;
  font-weight: 900;
}

.advertising-voice-surcharge-fieldset legend {
  padding: 0 5px;
}

.advertising-voice-surcharge-scan {
  margin: 0;
  padding: 11px 12px;
  border-radius: 9px;
  display: grid;
  gap: 3px;
  background: var(--admin-soft);
}

.advertising-voice-surcharge-scan strong {
  overflow-wrap: anywhere;
  font-size: 0.92rem;
}

.advertising-voice-surcharge-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.advertising-voice-surcharge-grid label,
.advertising-voice-surcharge-note-field {
  min-width: 0;
  display: grid;
  gap: 7px;
}

.advertising-voice-surcharge-grid select,
.advertising-voice-surcharge-grid input,
.advertising-voice-surcharge-note-field input {
  width: 100%;
  min-height: 46px;
  padding: 11px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 10px;
  background: var(--admin-panel);
  color: var(--admin-text);
  font: inherit;
}

.advertising-voice-surcharge-grid small,
.advertising-voice-surcharge-note-field small,
.advertising-voice-surcharge-scan small {
  color: var(--admin-muted);
  font-size: 0.68rem;
  line-height: 1.4;
}

.advertising-voice-quality-option {
  min-width: 0;
  padding: 8px 9px;
  border-radius: 8px;
  background: var(--admin-soft);
  font-size: 0.72rem;
  font-weight: 750;
}

.advertising-voice-default-button {
  min-width: 112px;
}

.advertising-voice-default-button.is-current,
.advertising-voice-default-button.is-current:disabled {
  border-color: #14161c;
  background: #14161c;
  color: #fff;
  opacity: 1;
}

.advertising-voice-company-toggle {
  min-width: 124px;
  min-height: 38px;
  padding: 6px 9px;
  border: 1px solid #7650d8;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: #f4f0ff;
  color: #5736b2;
  font: inherit;
  font-size: 0.68rem;
  cursor: pointer;
}

.advertising-voice-company-toggle > span {
  width: 30px;
  height: 18px;
  padding: 2px;
  border-radius: 999px;
  display: block;
  background: #d8cdf7;
}

.advertising-voice-company-toggle > span::after {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  display: block;
  background: #fff;
  content: "";
  transition: transform 160ms ease;
}

.advertising-voice-company-toggle.is-on {
  border-color: #7650d8;
  background: #7650d8;
  color: #fff;
}

.advertising-voice-company-toggle.is-on > span {
  background: rgba(255, 255, 255, 0.34);
}

.advertising-voice-company-toggle.is-on > span::after {
  transform: translateX(12px);
}

.advertising-voice-company-toggle:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.advertising-voice-toggle {
  min-width: 96px;
  min-height: 38px;
  padding: 6px 9px;
  border: 1px solid #14161c;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  background: #f1f3f6;
  color: #14161c;
  font: inherit;
  font-size: 0.68rem;
  cursor: pointer;
}

.advertising-voice-toggle > span {
  width: 30px;
  height: 18px;
  padding: 2px;
  border-radius: 999px;
  display: block;
  background: #cfd7e4;
}

.advertising-voice-toggle > span::after {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  display: block;
  background: #fff;
  content: "";
  transition: transform 160ms ease;
}

.advertising-voice-toggle.is-on {
  border-color: #d8dde6;
  background: #f1f3f6;
  color: #14161c;
}

.advertising-voice-toggle.is-on > span {
  background: #555b66;
}

.advertising-voice-toggle.is-on > span::after {
  transform: translateX(12px);
}

.advertising-voice-toggle:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.admin-app[data-theme="dark"] .advertising-voice-summary article,
.admin-app[data-theme="dark"] .advertising-voice-list,
.admin-app[data-theme="dark"] .advertising-voice-pagination {
  border-color: rgba(164, 176, 198, 0.26);
  background: #111927;
}

.admin-app[data-theme="dark"] .advertising-voice-row {
  border-color: rgba(164, 176, 198, 0.2);
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-order button,
.admin-app[data-theme="dark"] .advertising-voice-pagination select,
.admin-app[data-theme="dark"] .advertising-voice-pagination button,
.admin-app[data-theme="dark"] .advertising-voice-profile-grid select,
.admin-app[data-theme="dark"] .advertising-voice-positioning-field textarea {
  border-color: rgba(164, 176, 198, 0.35);
  background: #182235;
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-default-field,
.admin-app[data-theme="dark"] .advertising-voice-quality-option {
  border-color: rgba(164, 176, 198, 0.24);
  background: #182235;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-profile-grid > label > span:first-child,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-positioning-field > span:first-child,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-quality-fieldset legend,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-fieldset legend,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-fieldset label > span:first-child,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-scan > span,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-check-field,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-quality-option {
  color: #ebf1fc;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-profile-grid select,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-positioning-field textarea,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-grid select,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-grid input,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-note-field input {
  border-color: rgba(164, 176, 198, 0.35);
  background: #182235;
  color: #ebf1fc;
  color-scheme: dark;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-positioning-editor button {
  border-color: rgba(167, 139, 250, 0.52);
  color: #d8ccff;
  background: #2a2148;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-positioning-editor button:hover,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-positioning-editor button:focus-visible {
  color: #fff;
  background: #7650d8;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-default-field,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-quality-option,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-scan {
  border-color: rgba(164, 176, 198, 0.24);
  background: #182235;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-quality-fieldset {
  border-color: rgba(164, 176, 198, 0.35);
}

.admin-app[data-theme="dark"] .advertising-voice-tier-filters button.is-active,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-gender-fieldset input:checked + span {
  border-color: #9f86f0;
  background: rgba(118, 80, 216, 0.26);
  color: #e5ddff;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-gender-fieldset,
body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-gender-fieldset label > span {
  border-color: rgba(151, 157, 178, 0.3);
  background: #181a22;
  color: #c8cce0;
}

body[data-admin-theme="dark"] .admin-dialog-card.is-advertising-voice-profile-dialog .advertising-voice-surcharge-fieldset {
  border-color: rgba(164, 176, 198, 0.35);
}

.admin-app[data-theme="dark"] .advertising-voice-row.is-company-only {
  background: rgba(118, 80, 216, 0.12);
}

.admin-app[data-theme="dark"] .advertising-voice-summary strong,
.admin-app[data-theme="dark"] .advertising-voice-identity strong,
.admin-app[data-theme="dark"] .advertising-voice-identity code {
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-market-fit > span,
.admin-app[data-theme="dark"] .advertising-voice-usage.is-used {
  color: #a8cdff;
}

.admin-app[data-theme="dark"] .advertising-voice-package-badge {
  background: #f2f5fa;
  color: #14161c;
}

.admin-app[data-theme="dark"] .advertising-voice-attribute.is-inactive {
  border-color: rgba(164, 176, 198, 0.38);
  background: #243047;
  color: #aeb8c9;
}

.admin-app[data-theme="dark"] .advertising-voice-attribute.is-surcharge {
  border-color: rgba(255, 183, 84, 0.48);
  background: rgba(177, 96, 12, 0.28);
  color: #ffc87d;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span {
  border-color: rgba(183, 167, 255, 0.32);
  background: rgba(118, 80, 216, 0.18);
  color: #c9bbff;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-surcharge {
  border-color: rgba(255, 183, 84, 0.38);
  background: rgba(177, 96, 12, 0.2);
  color: #ffc87d;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-default {
  border-color: #f2f5fa;
  background: #f2f5fa;
  color: #14161c;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-company-only {
  border-color: #a995f2;
  background: #7650d8;
  color: #fff;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-access {
  border-color: rgba(96, 219, 174, 0.42);
  background: rgba(26, 129, 93, 0.22);
  color: #8ce2c1;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-specialty {
  border-color: rgba(107, 162, 240, 0.4);
  background: rgba(43, 92, 164, 0.24);
  color: #a8cdff;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-language {
  border-color: rgba(85, 193, 216, 0.4);
  background: rgba(24, 112, 132, 0.24);
  color: #98deea;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-use-case {
  border-color: rgba(255, 192, 85, 0.4);
  background: rgba(160, 100, 15, 0.22);
  color: #ffd58c;
}

.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-notice,
.admin-app[data-theme="dark"] .advertising-voice-metadata span.is-source {
  border-color: rgba(173, 183, 201, 0.3);
  background: rgba(122, 135, 157, 0.16);
  color: #c7cfdb;
}

.admin-app[data-theme="dark"] .advertising-voice-mark-play {
  border-color: #111927;
  background: #f2f5fa;
  color: #14161c;
}

.admin-app[data-theme="dark"] .advertising-voice-quick-actions button {
  border-color: rgba(164, 176, 198, 0.35);
  background: #182235;
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-quick-actions button:hover,
.admin-app[data-theme="dark"] .advertising-voice-quick-actions button:focus-visible {
  border-color: #a995f2;
  background: #2a2450;
  color: #d8ceff;
}

.admin-app[data-theme="dark"] .advertising-voice-company-toggle {
  border-color: #a995f2;
  background: #182235;
  color: #d8ceff;
}

.admin-app[data-theme="dark"] .advertising-voice-toggle {
  border-color: #aeb8c9;
  background: #182235;
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-toggle.is-on {
  border-color: #c7cfdb;
  background: #eef1f5;
  color: #14161c;
}

.admin-app[data-theme="dark"] .advertising-voice-menu-trigger {
  border-color: rgba(164, 176, 198, 0.35);
  background: #182235;
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-menu-trigger:hover,
.admin-app[data-theme="dark"] .advertising-voice-menu-trigger:focus-visible,
.admin-app[data-theme="dark"] .advertising-voice-menu-trigger[aria-expanded="true"] {
  border-color: #c7cfdb;
  background: #243047;
}

.admin-app[data-theme="dark"] .advertising-voice-menu {
  border-color: rgba(164, 176, 198, 0.35);
  background: #111927;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.42);
}

.admin-app[data-theme="dark"] .advertising-voice-menu-item {
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-menu-item:hover,
.admin-app[data-theme="dark"] .advertising-voice-menu-item:focus-visible {
  background: #243047;
}

.admin-app[data-theme="dark"] .advertising-voice-pagination .advertising-voice-menu-item {
  border: 0;
  background: transparent;
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .advertising-voice-pagination .advertising-voice-menu-item:hover,
.admin-app[data-theme="dark"] .advertising-voice-pagination .advertising-voice-menu-item:focus-visible {
  background: #243047;
}

.admin-app[data-theme="dark"] .advertising-voice-menu-item.is-danger {
  color: #ff9ba2;
}

.admin-app[data-theme="dark"] .advertising-voice-menu-item.is-danger:hover,
.admin-app[data-theme="dark"] .advertising-voice-menu-item.is-danger:focus-visible {
  background: rgba(197, 92, 92, 0.18);
}

.advertising-status.is-available { background: #dff6ef; color: #187a62; }
.advertising-status.is-unavailable { background: #ffe1e6; color: #ad2c40; }
.advertising-status.is-paused { background: #fff0d4; color: #7b520d; }

.advertising-voice-empty {
  border: 1px dashed var(--admin-line);
  border-radius: 8px;
}

.admin-dialog-card.is-advertising-voice-resolver-dialog {
  width: min(100%, 720px);
  border-radius: 8px;
}

.advertising-voice-resolver,
.advertising-voice-resolver label {
  min-width: 0;
  display: grid;
  gap: 9px;
}

.advertising-voice-resolver label > span {
  color: var(--admin-text);
  font-size: 0.82rem;
  font-weight: 900;
}

.advertising-voice-resolver-input-row {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
}

.advertising-voice-resolver-input-row input {
  width: 100%;
  min-width: 0;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--admin-line);
  border-radius: 6px;
  background: var(--admin-panel);
  color: var(--admin-text);
  font: inherit;
}

.advertising-voice-resolver-input-row input:focus {
  border-color: var(--purple);
  outline: 3px solid rgba(138, 92, 246, 0.14);
}

.advertising-voice-resolver-status {
  min-height: 22px;
  margin: 0;
  color: var(--admin-muted);
  font-size: 0.76rem;
  line-height: 1.45;
}

.advertising-voice-resolver-status[data-tone="searching"] {
  color: #7650d8;
}

.advertising-voice-resolver-status[data-tone="success"] {
  color: #187a62;
}

.advertising-voice-resolver-status[data-tone="error"] {
  color: var(--red);
}

.advertising-voice-resolver-status[data-tone="warning"],
.advertising-voice-resolver-found.is-existing {
  color: #a45b08;
}

.advertising-voice-resolver-result {
  padding: 15px;
  border: 1px solid rgba(67, 184, 153, 0.4);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  background: rgba(67, 184, 153, 0.07);
}

.advertising-voice-resolver-result-head {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
}

.advertising-voice-resolver-result-head > div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.advertising-voice-resolver-found {
  color: #187a62;
  font-size: 0.64rem;
  font-weight: 950;
  text-transform: uppercase;
}

.advertising-voice-resolver-result-head strong {
  overflow-wrap: anywhere;
  font-size: 1.08rem;
}

.advertising-voice-resolver-result-head p,
.advertising-voice-resolver-note {
  margin: 0;
  color: var(--admin-muted);
  font-size: 0.74rem;
  line-height: 1.45;
}

.advertising-voice-resolver-preview {
  width: 100%;
  height: 42px;
}

.advertising-admin-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.advertising-admin-summary article {
  min-height: 112px;
  padding: 18px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: grid;
  align-content: space-between;
  gap: 12px;
  background: var(--admin-panel);
}

.advertising-admin-summary article:nth-child(1) { border-top: 4px solid #8d62f2; }
.advertising-admin-summary article:nth-child(2) { border-top: 4px solid #43b899; }
.advertising-admin-summary article:nth-child(3) { border-top: 4px solid #e4a344; }
.advertising-admin-summary article:nth-child(4) { border-top: 4px solid #5a9fe6; }

.advertising-admin-summary span,
.advertising-review-facts span,
.advertising-review-copy > span,
.advertising-policy-proof span,
.advertising-latest-review > span {
  color: var(--admin-muted);
  font-size: 0.7rem;
  font-weight: 900;
  text-transform: uppercase;
}

.advertising-admin-summary strong {
  font-size: 1.75rem;
}

.advertising-admin-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.advertising-admin-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.advertising-admin-filters button {
  min-height: 38px;
  padding: 8px 13px;
  border: 1px solid var(--admin-line);
  border-radius: 999px;
  background: var(--admin-panel);
  color: var(--admin-muted);
  font: inherit;
  font-size: 0.76rem;
  font-weight: 850;
  cursor: pointer;
}

.advertising-admin-filters button.is-active {
  border-color: #8d62f2;
  background: #eee8ff;
  color: #6840c7;
}

.advertising-admin-grid {
  min-height: 640px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: grid;
  grid-template-columns: minmax(280px, 0.34fr) minmax(0, 0.66fr);
  overflow: hidden;
  background: var(--admin-panel);
}

.advertising-request-list {
  max-height: 820px;
  overflow-y: auto;
  border-right: 1px solid var(--admin-line);
  background: var(--admin-soft);
}

.advertising-request-button {
  width: 100%;
  padding: 17px;
  border: 0;
  border-bottom: 1px solid var(--admin-line);
  display: grid;
  gap: 9px;
  background: transparent;
  color: var(--admin-text);
  text-align: left;
  cursor: pointer;
}

.advertising-request-button:hover,
.advertising-request-button.is-active {
  background: var(--admin-panel);
}

.advertising-request-button.is-active {
  box-shadow: inset 4px 0 0 #8d62f2;
}

.advertising-request-button > span {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--admin-muted);
  font-size: 0.76rem;
}

.advertising-request-button > span small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.advertising-request-button > strong {
  overflow-wrap: anywhere;
  font-size: 0.95rem;
}

.advertising-status {
  width: fit-content;
  padding: 5px 8px;
  border-radius: 999px;
  background: #e9edf3;
  color: #5f6877;
  font-size: 0.64rem;
  font-weight: 950;
  text-transform: uppercase;
  white-space: nowrap;
}

.advertising-status.is-submitted { background: #eee8ff; color: #6840c7; }
.advertising-status.is-approved { background: #dff6ef; color: #187a62; }
.advertising-status.is-changes_requested { background: #fff0d4; color: #8a5c0d; }
.advertising-status.is-rejected { background: #ffe1e6; color: #ad2c40; }

.advertising-review-panel {
  min-width: 0;
  max-height: 820px;
  padding: 24px;
  overflow-y: auto;
}

.advertising-review-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.advertising-review-header > div {
  min-width: 0;
}

.advertising-review-header h2 {
  margin: 9px 0 4px;
  font-size: 1.45rem;
}

.advertising-review-header p,
.advertising-review-copy p,
.advertising-policy-proof p,
.advertising-latest-review p {
  color: var(--admin-muted);
  line-height: 1.5;
}

.advertising-review-header p {
  margin: 0;
}

.advertising-review-facts {
  margin-top: 22px;
  padding: 16px 0;
  border-top: 1px solid var(--admin-line);
  border-bottom: 1px solid var(--admin-line);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.advertising-review-facts div,
.advertising-policy-proof div {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.advertising-review-facts strong {
  overflow-wrap: anywhere;
  font-size: 0.86rem;
}

.advertising-review-copy {
  margin-top: 22px;
}

.advertising-review-copy p {
  margin: 7px 0 0;
}

.advertising-creative-stack {
  margin-top: 22px;
  display: grid;
  gap: 16px;
}

.advertising-creative-review {
  padding: 16px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  background: var(--admin-soft);
  color: #34384a;
}

.advertising-creative-heading {
  margin-bottom: 14px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.advertising-creative-heading > div {
  display: grid;
  gap: 3px;
}

.advertising-creative-heading span {
  color: #626779;
  font-size: 0.68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.advertising-creative-image {
  width: min(100%, 620px);
  max-height: 360px;
  border-radius: 6px;
  display: block;
  object-fit: contain;
  background: #11131a;
}

.advertising-creative-image-stage {
  width: min(100%, 620px);
  display: grid;
  gap: 8px;
}

.advertising-creative-image-stage a {
  width: fit-content;
  color: #6940c7;
  font-size: 0.72rem;
  font-weight: 900;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.advertising-creative-audio {
  width: min(100%, 620px);
  height: 46px;
}

.advertising-creative-pending {
  min-height: 110px;
  padding: 18px;
  border: 1px dashed var(--admin-line);
  border-radius: 6px;
  display: grid;
  align-content: center;
  gap: 6px;
  color: #5c6072;
}

.advertising-creative-review blockquote {
  margin: 14px 0 0;
  padding: 13px;
  border-left: 3px solid #8d62f2;
  background: var(--admin-panel);
  color: var(--admin-text);
  font-size: 0.86rem;
  line-height: 1.55;
}

.advertising-transcript-review {
  margin-top: 14px;
  padding: 13px;
  border: 1px solid var(--admin-line);
  border-radius: 7px;
  background: var(--admin-panel);
}

.advertising-transcript-review > header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 3px 12px;
}

.advertising-transcript-review > header span {
  color: #8d62f2;
  font-size: 0.68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.advertising-transcript-review > header strong { color: var(--admin-text); font-size: 0.8rem; }
.advertising-transcript-review > header small { grid-column: 1 / -1; color: #626779; font-size: 0.68rem; }
.advertising-transcript-review blockquote { margin-top: 10px; }
.advertising-transcript-review.is-missing { border-color: #c58a38; background: #fff8e8; }

.advertising-final-review-gate {
  margin-top: 14px;
  padding: 12px 13px;
  border-left: 4px solid #8d62f2;
  display: grid;
  gap: 4px;
  background: #f0e9ff;
}

.advertising-final-review-gate strong { color: #3f246f; font-size: 0.78rem; }
.advertising-final-review-gate span { color: #555a6d; font-size: 0.72rem; line-height: 1.45; }

.advertising-creative-meta {
  margin: 14px 0 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.advertising-creative-meta div {
  display: grid;
  gap: 3px;
}

.advertising-creative-meta dt {
  color: #626779;
  font-size: 0.66rem;
  font-weight: 850;
}

.advertising-creative-meta dd {
  margin: 0;
  color: #34384a;
  font-size: 0.78rem;
  font-weight: 800;
}

.advertising-creative-speakers {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.advertising-creative-speakers span {
  padding: 6px 8px;
  border: 1px solid var(--admin-line);
  border-radius: 999px;
  background: var(--admin-panel);
  color: #5c6072;
  font-size: 0.7rem;
}

.advertising-creative-speakers strong { margin-right: 5px; color: var(--admin-text); }

.advertising-creative-lines {
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 7px;
}

.advertising-creative-lines li {
  padding: 10px 11px;
  border: 1px solid var(--admin-line);
  border-radius: 7px;
  background: var(--admin-panel);
  display: grid;
  grid-template-columns: minmax(80px, 0.22fr) minmax(0, 1fr) auto;
  gap: 9px;
  align-items: start;
}

.advertising-creative-lines span { color: #8d62f2; font-size: 0.7rem; font-weight: 900; }
.advertising-creative-lines p { margin: 0; color: #34384a; font-size: 0.78rem; line-height: 1.5; }
.advertising-creative-lines small { color: #5c6072; font-size: 0.66rem; }

.advertising-creative-review-actions {
  margin-top: 14px;
  padding-top: 13px;
  border-top: 1px solid var(--admin-line);
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.advertising-policy-proof,
.advertising-latest-review {
  margin-top: 20px;
  padding: 15px;
  border: 1px solid var(--admin-line);
  border-radius: 8px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.advertising-policy-proof p,
.advertising-latest-review p {
  grid-column: 1 / -1;
  margin: 0;
  font-size: 0.78rem;
}

.advertising-latest-review {
  border-left: 4px solid #8d62f2;
  grid-template-columns: 1fr auto;
}

.advertising-review-actions {
  margin-top: 22px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.advertising-admin-empty {
  min-height: 220px;
  padding: 24px;
  display: grid;
  place-content: center;
  gap: 7px;
  color: var(--admin-muted);
  text-align: center;
}

.advertising-verification-workspace { display: grid; gap: 18px; }
.advertising-verification-notice { padding: 17px 19px; border: 1px solid #e5c773; border-radius: 8px; background: #fff8de; display: grid; gap: 5px; }
.advertising-verification-notice strong { color: #543c00; }
.advertising-verification-notice span { color: #6d5b29; font-size: .8rem; line-height: 1.5; }
.advertising-verification-list { display: grid; gap: 14px; }
.advertising-verification-card { padding: 20px; border: 1px solid var(--admin-line); border-left: 4px solid #8d62f2; border-radius: 8px; background: var(--admin-panel); display: grid; gap: 16px; }
.advertising-verification-card.is-approved { border-left-color: #43b899; }
.advertising-verification-card.is-rejected { border-left-color: #d9586c; }
.advertising-verification-card.is-reverification_required { border-left-color: #d79b37; }
.advertising-verification-card header,
.advertising-verification-card footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.advertising-verification-card header > div { min-width: 0; display: grid; gap: 4px; }
.advertising-verification-card header span,
.advertising-verification-card section > span,
.advertising-verification-facts span { color: var(--admin-muted); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.advertising-verification-card h3 { margin: 0; overflow-wrap: anywhere; font-size: 1.15rem; }
.advertising-verification-card header small,
.advertising-verification-card footer small,
.advertising-verification-facts small { color: var(--admin-muted); line-height: 1.4; }
.advertising-verification-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.advertising-verification-facts > div { min-width: 0; padding: 12px; border: 1px solid var(--admin-line); border-radius: 7px; display: grid; gap: 4px; background: var(--admin-soft); }
.advertising-verification-facts strong { overflow-wrap: anywhere; font-size: .8rem; }
.advertising-verification-card section { padding: 13px 15px; border: 1px solid var(--admin-line); border-radius: 7px; background: var(--admin-soft); }
.advertising-verification-card section p { margin: 5px 0 0; overflow-wrap: anywhere; color: var(--admin-text); line-height: 1.5; }
.advertising-verification-checklist { display: grid; gap: 12px; }
.advertising-verification-checklist > div { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.advertising-verification-checklist label { min-width: 0; display: grid; gap: 6px; }
.advertising-verification-checklist label > span { color: var(--admin-muted); font-size: .66rem; font-weight: 900; text-transform: uppercase; }
.advertising-verification-checklist select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--admin-line); border-radius: 6px; background: var(--admin-panel); color: var(--admin-text); font: inherit; font-size: .75rem; font-weight: 750; }
.advertising-verification-checklist > small { color: var(--admin-muted); line-height: 1.45; }
.advertising-verification-card footer { align-items: center; }
.advertising-verification-card footer > div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }

@media (max-width: 1120px) {
  .advertising-admin-grid {
    grid-template-columns: 1fr;
  }

  .advertising-request-list {
    max-height: 360px;
    border-right: 0;
    border-bottom: 1px solid var(--admin-line);
  }

  .advertising-review-panel {
    max-height: none;
  }

  .advertising-voice-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .advertising-voice-pagination {
    align-items: stretch;
    flex-direction: column;
  }

  .advertising-voice-pagination-status,
  .advertising-voice-pagination label,
  .advertising-voice-pagination-buttons {
    justify-content: space-between;
  }

  .advertising-voice-control-fields {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .advertising-voice-control-fields select,
  .advertising-voice-export-trigger {
    width: 100%;
  }

  .advertising-voice-row {
    grid-template-columns: 164px minmax(230px, 1fr) minmax(130px, 0.38fr) minmax(150px, 0.42fr) minmax(42px, auto);
    gap: 12px;
  }
}

@media (max-width: 720px) {
  .advertising-admin-summary,
  .advertising-review-facts,
  .advertising-creative-meta,
  .advertising-policy-proof,
  .advertising-latest-review {
    grid-template-columns: 1fr 1fr;
  }

  .advertising-admin-toolbar,
  .advertising-review-header,
  .advertising-review-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .advertising-review-actions .admin-button {
    width: 100%;
  }

  .advertising-creative-lines li { grid-template-columns: 1fr; }
  .advertising-creative-review-actions { flex-direction: column; }
  .advertising-creative-review-actions .admin-button { width: 100%; }

  .advertising-workspace-tabs {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(138px, max-content);
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .advertising-workspace-tabs button {
    width: auto;
    justify-content: center;
  }

  .advertising-verification-facts { grid-template-columns: 1fr 1fr; }
  .advertising-verification-checklist > div { grid-template-columns: 1fr 1fr; }
  .advertising-verification-card header,
  .advertising-verification-card footer { align-items: stretch; flex-direction: column; }
  .advertising-verification-card footer > div { justify-content: stretch; }
  .advertising-verification-card footer .admin-button { width: 100%; }

  .advertising-voice-catalog-header {
    align-items: stretch;
  }

  .advertising-voice-catalog-header {
    flex-direction: column;
  }

  .advertising-voice-catalog-header .admin-button,
  .advertising-voice-summary {
    width: 100%;
  }

  .advertising-voice-summary {
    grid-template-columns: 1fr;
  }

  .advertising-voice-control-fields {
    grid-template-columns: 1fr;
  }

  .advertising-voice-bulk-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .advertising-voice-bulk-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .advertising-voice-organize-access {
    width: 100%;
    margin-left: 0;
  }

  .advertising-voice-order-note {
    text-align: left;
  }

  .advertising-voice-row {
    align-items: start;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
  }

  .advertising-voice-order {
    grid-column: 1 / -1;
    grid-row: 1;
    grid-template-columns: 18px minmax(42px, 1fr) minmax(96px, 132px);
  }

  .advertising-voice-identity {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .advertising-voice-health {
    grid-column: 1 / -1;
    grid-row: 4;
  }

  .advertising-voice-market-fit {
    grid-column: 1 / -1;
    grid-row: 3;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    column-gap: 8px;
  }

  .advertising-voice-market-fit small {
    grid-column: 1 / -1;
  }

  .advertising-voice-actions {
    grid-column: 2;
    grid-row: 1;
  }

  .advertising-voice-profile-grid,
  .advertising-voice-quality-fieldset > div,
  .advertising-voice-surcharge-grid {
    grid-template-columns: 1fr;
  }
}

.settings-rights-documentation-card {
  display: grid;
  gap: 18px;
}

.settings-rights-documentation-count,
.settings-rights-documentation-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.settings-rights-documentation-limit {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 14px;
  padding: 16px;
  border-radius: 16px;
  background: var(--admin-surface-subtle, #f5f2ed);
}

.settings-rights-documentation-limit > label {
  grid-column: 1;
  grid-row: 1;
}

.settings-rights-documentation-limit > p {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
}

.settings-rights-documentation-limit > .admin-button {
  grid-column: 2;
  grid-row: 1;
}

.settings-rights-documentation-guidance {
  display: grid;
  gap: 5px;
  padding: 14px 16px;
  border-left: 4px solid #7a4bd5;
  border-radius: 0 14px 14px 0;
  color: var(--admin-text-muted, #675f69);
  background: rgba(122, 75, 213, .08);
  font-size: .82rem;
  line-height: 1.5;
}

.settings-rights-documentation-guidance strong {
  color: var(--admin-text, #201c24);
}

.settings-rights-documentation-queue,
.settings-rights-documentation-history > div {
  display: grid;
  gap: 12px;
}

.settings-rights-documentation-item {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-left: 4px solid #c78621;
  border-radius: 0 15px 15px 0;
  background: var(--admin-surface-subtle, #f7f4ef);
}

.settings-rights-documentation-item[data-status="approved"] {
  border-left-color: #27836e;
}

.settings-rights-documentation-item[data-status="rejected"] {
  border-left-color: #b23a4b;
}

.settings-rights-documentation-item-head,
.settings-rights-documentation-file {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.settings-rights-documentation-item-head > span,
.settings-rights-documentation-file > span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-rights-documentation-item-head small,
.settings-rights-documentation-file small {
  overflow-wrap: anywhere;
  color: var(--admin-text-muted, #716873);
  font-size: .75rem;
}

.settings-rights-documentation-file strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-rights-documentation-item textarea.admin-text-input {
  min-height: 76px;
  padding: 10px 12px;
  resize: vertical;
}

.settings-rights-documentation-empty {
  display: grid;
  gap: 4px;
  padding: 18px;
  border-radius: 14px;
  color: var(--admin-text-muted, #716873);
  background: var(--admin-surface-subtle, #f7f4ef);
}

.settings-rights-documentation-empty strong {
  color: var(--admin-text, #201c24);
}

.settings-rights-documentation-history {
  border-top: 1px solid var(--admin-line, #ded8df);
}

.settings-rights-documentation-history > summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 0;
  font-weight: 800;
  cursor: pointer;
}

.settings-rights-documentation-history > summary b {
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--admin-surface-subtle, #f0ece7);
  font-size: .75rem;
}

@media (max-width: 820px) {
  .settings-rights-documentation-limit {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .settings-rights-documentation-limit > label,
  .settings-rights-documentation-limit > p,
  .settings-rights-documentation-limit > .admin-button {
    grid-column: 1;
    grid-row: auto;
  }

  .settings-rights-documentation-limit .admin-button {
    width: 100%;
  }

  .settings-rights-documentation-item-head,
  .settings-rights-documentation-file {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-rights-documentation-file .admin-button,
  .settings-rights-documentation-actions .admin-button {
    width: 100%;
  }
}

/* Studio activity appearance */
.settings-studio-activity-card {
  overflow: hidden;
}

.settings-studio-activity-form {
  gap: 22px;
}

.settings-studio-activity-options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.settings-studio-activity-option {
  position: relative;
  min-width: 0;
  min-height: 112px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.035);
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.settings-studio-activity-option:hover {
  border-color: rgba(154, 92, 255, 0.6);
  background: rgba(154, 92, 255, 0.07);
  transform: translateY(-1px);
}

.settings-studio-activity-option:has(input:checked) {
  border-color: var(--purple);
  background: rgba(154, 92, 255, 0.12);
  box-shadow: inset 0 0 0 1px rgba(154, 92, 255, 0.26);
}

.settings-studio-activity-option:has(input:focus-visible) {
  outline: 3px solid rgba(154, 92, 255, 0.28);
  outline-offset: 3px;
}

.settings-studio-activity-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.settings-studio-activity-option-control {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 2px solid #666675;
  border-radius: 50%;
  background: #16161d;
}

.settings-studio-activity-option:has(input:checked) .settings-studio-activity-option-control {
  border-color: #dfff3f;
}

.settings-studio-activity-option:has(input:checked) .settings-studio-activity-option-control::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #dfff3f;
}

.settings-studio-activity-option > span:last-child {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, auto) auto;
  gap: 4px 8px;
  align-items: center;
}

.settings-studio-activity-option strong {
  min-width: 0;
  color: var(--text);
  font-size: 0.84rem;
  line-height: 1.25;
}

.settings-studio-activity-option small {
  justify-self: start;
  padding: 3px 7px;
  border-radius: 999px;
  background: #dfff3f;
  color: #09090b;
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.settings-studio-activity-option em {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.7rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.45;
}

.settings-studio-activity-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 14px;
}

.settings-studio-activity-preview {
  --studio-activity-preview-accent: #32bb91;
  --studio-activity-preview-ink: #111116;
  --studio-activity-preview-muted: #706d75;
  --studio-activity-preview-shell: #f7f5f0;
  --studio-activity-preview-panel: #fffdfa;
  --studio-activity-preview-item: #eff8f4;
  --studio-activity-preview-line: #d7d2c9;
  position: relative;
  min-width: 0;
  display: grid;
  justify-items: center;
  gap: 12px;
  padding: 21px 16px 18px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #f3f0ea;
  color: var(--studio-activity-preview-ink);
  transition: opacity 180ms ease, filter 180ms ease, transform 180ms ease;
}

.settings-studio-activity-preview.is-dark {
  --studio-activity-preview-accent: #dfff3f;
  --studio-activity-preview-ink: #f7f7fa;
  --studio-activity-preview-muted: #aaa9b1;
  --studio-activity-preview-shell: #0d0d0f;
  --studio-activity-preview-panel: #111114;
  --studio-activity-preview-item: #181a11;
  --studio-activity-preview-line: #38383c;
  background: #202026;
}

.settings-studio-activity-form:has(input[value="light"]:checked) .settings-studio-activity-preview.is-dark,
.settings-studio-activity-form:has(input[value="dark"]:checked) .settings-studio-activity-preview.is-light {
  opacity: 0.4;
  filter: saturate(0.6);
  transform: scale(0.985);
}

.settings-studio-activity-preview-label {
  position: absolute;
  top: 10px;
  left: 12px;
  color: #74717a;
  font-size: 0.57rem;
  font-weight: 950;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.settings-studio-activity-preview.is-dark .settings-studio-activity-preview-label {
  color: var(--studio-activity-preview-accent);
}

.settings-studio-activity-mini-compact {
  width: min(250px, 88%);
  min-height: 54px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  margin-top: 12px;
  padding: 8px 10px;
  border: 1px solid var(--studio-activity-preview-line);
  border-radius: 999px;
  background: var(--studio-activity-preview-shell);
  box-shadow: 0 11px 24px rgba(10, 10, 13, 0.16);
}

.settings-studio-activity-mini-compact > span:nth-child(2),
.settings-studio-activity-mini-item > span:nth-child(2) {
  min-width: 0;
  display: grid;
}

.settings-studio-activity-mini-compact small,
.settings-studio-activity-mini-panel header small {
  color: var(--studio-activity-preview-accent);
  font-size: 0.49rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.settings-studio-activity-mini-compact strong {
  overflow: hidden;
  font-size: 0.76rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-studio-activity-mini-ring {
  position: relative;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(var(--studio-activity-preview-accent) 0 75%, #000 75% 100%);
}

.settings-studio-activity-preview.is-light .settings-studio-activity-mini-ring {
  background: conic-gradient(var(--studio-activity-preview-accent) 0 75%, #d8d4cd 75% 100%);
}

.settings-studio-activity-mini-ring::before {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: var(--studio-activity-preview-shell);
}

.settings-studio-activity-mini-ring b {
  position: relative;
  z-index: 1;
  font-size: 0.72rem;
}

.settings-studio-activity-mini-count {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(127, 124, 132, 0.18);
  font-size: 0.68rem;
}

.settings-studio-activity-mini-panel {
  position: relative;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--studio-activity-preview-line);
  border-top: 4px solid var(--studio-activity-preview-accent);
  border-radius: 18px;
  background: var(--studio-activity-preview-shell);
  box-shadow: 0 13px 28px rgba(10, 10, 13, 0.17);
}

.settings-studio-activity-mini-panel header,
.settings-studio-activity-mini-panel footer {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
}

.settings-studio-activity-mini-panel header {
  border-bottom: 1px solid var(--studio-activity-preview-line);
}

.settings-studio-activity-mini-panel header > span {
  display: grid;
}

.settings-studio-activity-mini-panel header strong {
  font-size: 0.9rem;
  font-weight: 950;
  letter-spacing: -0.03em;
}

.settings-studio-activity-mini-panel header > b {
  width: 25px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(127, 124, 132, 0.17);
  font-size: 0.85rem;
}

.settings-studio-activity-mini-item {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 9px;
  align-items: center;
  margin: 9px;
  padding: 10px;
  border: 1px solid var(--studio-activity-preview-line);
  border-radius: 13px;
  background: var(--studio-activity-preview-item);
}

.settings-studio-activity-preview.is-dark .settings-studio-activity-mini-item {
  margin-right: 34px;
}

.settings-studio-activity-mini-item strong {
  overflow: hidden;
  font-size: 0.66rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-studio-activity-mini-item small,
.settings-studio-activity-mini-item em {
  color: var(--studio-activity-preview-muted);
  font-size: 0.53rem;
  font-style: normal;
  font-weight: 750;
}

.settings-studio-activity-mini-item small {
  color: var(--studio-activity-preview-accent);
}

.settings-studio-activity-mini-item button {
  padding: 6px 8px;
  border: 0;
  border-radius: 6px;
  background: var(--studio-activity-preview-accent);
  color: #09090b;
  font-size: 0.53rem;
  font-weight: 950;
  white-space: nowrap;
  pointer-events: none;
}

.settings-studio-activity-mini-panel footer {
  border-top: 1px solid var(--studio-activity-preview-line);
  color: var(--studio-activity-preview-muted);
  font-size: 0.5rem;
  font-weight: 800;
}

.settings-studio-activity-mini-panel footer strong {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--studio-activity-preview-ink);
}

.settings-studio-activity-mini-panel footer b {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--studio-activity-preview-accent);
  color: #09090b;
  font-size: 0.9rem;
}

.settings-studio-activity-mini-geometry {
  position: absolute;
  z-index: 0;
  top: 62px;
  right: -24px;
  width: 62px;
  height: 112px;
  pointer-events: none;
}

.settings-studio-activity-mini-geometry i {
  position: absolute;
  display: block;
  background: var(--studio-activity-preview-accent);
}

.settings-studio-activity-mini-geometry i:nth-child(1) {
  top: 0;
  left: 0;
  width: 58px;
  height: 58px;
  border: 10px solid var(--studio-activity-preview-accent);
  border-right-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  background: transparent;
  transform: rotate(-22deg);
}

.settings-studio-activity-mini-geometry i:nth-child(2) {
  top: 54px;
  left: 18px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.settings-studio-activity-mini-geometry i:nth-child(3) {
  top: 84px;
  left: 7px;
  width: 40px;
  height: 27px;
  border-radius: 3px;
}

.settings-studio-activity-footnote {
  margin: -4px 0 0;
}

@media (max-width: 900px) {
  .settings-studio-activity-options,
  .settings-studio-activity-preview-grid {
    grid-template-columns: 1fr;
  }

  .settings-studio-activity-option {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .settings-studio-activity-preview {
    padding-inline: 10px;
  }

  .settings-studio-activity-mini-item {
    grid-template-columns: auto minmax(0, 1fr);
  }

  .settings-studio-activity-mini-item button {
    grid-column: 2;
    justify-self: start;
  }
}

/* Studio Builder generated product preview colors */
.settings-studio-builder-card {
  overflow: hidden;
  container-type: inline-size;
  container-name: studio-builder-card;
}

.settings-studio-builder-form {
  gap: 22px;
}

.settings-studio-builder-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.72fr) minmax(390px, 1.28fr);
  gap: 18px;
  align-items: stretch;
}

.settings-studio-builder-controls,
.settings-studio-builder-color-grid {
  display: grid;
  gap: 10px;
}

.settings-studio-builder-position {
  display: grid;
  gap: 10px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel-soft);
}

.settings-studio-builder-position > span {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
}

.settings-studio-builder-position strong {
  color: var(--text);
  font-size: 0.78rem;
}

.settings-studio-builder-position code {
  color: var(--muted);
  font-family: inherit;
  font-size: 0.7rem;
  font-weight: 900;
}

.settings-studio-builder-position input {
  width: 100%;
  accent-color: #8c62f6;
}

.settings-studio-builder-position em {
  color: var(--muted);
  font-size: 0.66rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
}

.settings-studio-builder-preview {
  --studio-builder-preview-top: #ffffff;
  --studio-builder-preview-middle: #343434;
  --studio-builder-preview-bottom: #000000;
  --studio-builder-preview-middle-position: 58%;
  --studio-builder-preview-top-ink: #09090b;
  --studio-builder-preview-top-muted: rgba(9, 9, 11, 0.66);
  --studio-builder-preview-top-line: rgba(9, 9, 11, 0.2);
  --studio-builder-preview-top-accent: #315f50;
  --studio-builder-preview-middle-ink: #f8f7f4;
  --studio-builder-preview-middle-muted: rgba(248, 247, 244, 0.68);
  --studio-builder-preview-middle-line: rgba(248, 247, 244, 0.18);
  --studio-builder-preview-middle-accent: #86e0bf;
  --studio-builder-preview-bottom-ink: #f8f7f4;
  --studio-builder-preview-bottom-muted: rgba(248, 247, 244, 0.68);
  --studio-builder-preview-bottom-line: rgba(248, 247, 244, 0.18);
  --studio-builder-preview-bottom-accent: #86e0bf;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(150px, 0.84fr) minmax(180px, 1.16fr);
  grid-template-areas:
    "head head"
    "cover brief"
    "cover meta"
    "cover direction";
  gap: 13px 18px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 0 22px 22px 22px;
  background:
    radial-gradient(circle at 100% 0, rgba(140, 98, 246, 0.1), transparent 13rem),
    linear-gradient(
      180deg,
      var(--studio-builder-preview-top) 0%,
      var(--studio-builder-preview-middle) var(--studio-builder-preview-middle-position),
      var(--studio-builder-preview-bottom) 100%
    );
  box-shadow: 0 20px 38px rgba(10, 10, 13, 0.16);
}

.settings-studio-builder-preview-head {
  grid-area: head;
  display: flex;
  gap: 16px;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--studio-builder-preview-top-line);
  color: var(--studio-builder-preview-top-ink);
}

.settings-studio-builder-preview-head > span:first-child {
  display: grid;
  gap: 3px;
}

.settings-studio-builder-preview-head b,
.settings-studio-builder-preview-head small {
  font-size: 0.56rem;
  font-weight: 950;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.settings-studio-builder-preview-head small {
  color: var(--studio-builder-preview-top-accent);
}

.settings-studio-builder-preview-mode {
  display: flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--studio-builder-preview-top-line);
  border-radius: 10px;
  background: color-mix(in srgb, var(--studio-builder-preview-top) 72%, transparent);
}

.settings-studio-builder-preview-mode i,
.settings-studio-builder-preview-mode b {
  padding: 7px 10px;
  border-radius: 7px;
  font-size: 0.58rem;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
}

.settings-studio-builder-preview-mode i {
  color: var(--studio-builder-preview-top-muted);
}

.settings-studio-builder-preview-mode b {
  background: var(--studio-builder-preview-top-ink);
  color: var(--studio-builder-preview-top);
}

.settings-studio-builder-preview-cover {
  grid-area: cover;
  min-height: 250px;
  display: grid;
  align-content: space-between;
  padding: 16px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 16px;
  color: #fff;
  background:
    linear-gradient(180deg, rgba(4, 7, 10, 0.08), rgba(4, 7, 10, 0.76)),
    radial-gradient(circle at 25% 27%, #ce6f2b 0 11%, transparent 12%),
    linear-gradient(142deg, #73817c 0 34%, #273b3d 34% 63%, #11171a 63%);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.24);
}

.settings-studio-builder-preview-cover span {
  color: #84e3bd;
  font-size: 0.53rem;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.settings-studio-builder-preview-cover strong {
  font-size: clamp(1.15rem, 2.2cqi, 1.8rem);
  font-weight: 950;
  letter-spacing: -0.04em;
  line-height: 0.92;
  text-transform: uppercase;
}

.settings-studio-builder-preview-brief {
  grid-area: brief;
  display: grid;
  gap: 4px;
  align-content: end;
  color: var(--studio-builder-preview-middle-ink);
}

.settings-studio-builder-preview-brief small,
.settings-studio-builder-preview-direction small {
  color: var(--studio-builder-preview-middle-accent);
  font-size: 0.53rem;
  font-weight: 950;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.settings-studio-builder-preview-brief strong {
  font-size: 1.35rem;
  letter-spacing: -0.035em;
  line-height: 1;
}

.settings-studio-builder-preview-brief span {
  color: var(--studio-builder-preview-middle-muted);
  font-size: 0.72rem;
}

.settings-studio-builder-preview-meta {
  grid-area: meta;
  margin: 0;
  color: var(--studio-builder-preview-middle-ink);
}

.settings-studio-builder-preview-meta div {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 7px 0;
  border-top: 1px solid var(--studio-builder-preview-middle-line);
}

.settings-studio-builder-preview-meta dt,
.settings-studio-builder-preview-meta dd {
  font-size: 0.59rem;
}

.settings-studio-builder-preview-meta dt {
  color: var(--studio-builder-preview-middle-muted);
}

.settings-studio-builder-preview-meta dd {
  margin: 0;
  font-weight: 900;
}

.settings-studio-builder-preview-direction {
  grid-area: direction;
  padding-top: 10px;
  border-top: 1px solid var(--studio-builder-preview-bottom-line);
  color: var(--studio-builder-preview-bottom-ink);
}

.settings-studio-builder-preview-direction small {
  color: var(--studio-builder-preview-bottom-accent);
}

.settings-studio-builder-preview-direction p {
  margin: 7px 0 12px;
  color: var(--studio-builder-preview-bottom-muted);
  font-size: 0.61rem;
  font-weight: 700;
  line-height: 1.45;
}

.settings-studio-builder-preview-direction button {
  padding: 8px 11px;
  border: 0;
  border-radius: 7px;
  background: #8c62f6;
  color: #09090b;
  font: inherit;
  font-size: 0.58rem;
  font-weight: 950;
  pointer-events: none;
}

.settings-studio-builder-footnote {
  margin: -4px 0 0;
}

@container studio-builder-card (max-width: 820px) {
  .settings-studio-builder-layout {
    grid-template-columns: 1fr;
  }
}

@container studio-builder-card (max-width: 520px) {
  .settings-studio-builder-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-studio-builder-heading .admin-button {
    width: 100%;
  }

  .settings-studio-builder-preview {
    grid-template-columns: 1fr;
    grid-template-areas:
      "head"
      "cover"
      "brief"
      "meta"
      "direction";
  }

  .settings-studio-builder-preview-cover {
    min-height: 220px;
  }
}

/* Studio Releases hero colors */
.settings-studio-releases-card {
  overflow: hidden;
  container-type: inline-size;
  container-name: studio-releases-card;
}

.settings-studio-releases-form {
  gap: 22px;
}

.settings-studio-releases-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.7fr) minmax(420px, 1.3fr);
  gap: 18px;
  align-items: stretch;
}

.settings-studio-releases-color-grid {
  display: grid;
  gap: 10px;
}

.settings-studio-releases-color-field {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 88px;
  gap: 8px 12px;
  align-items: center;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel-soft);
}

.settings-studio-releases-color-field > span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.settings-studio-releases-color-field strong {
  color: var(--text);
  font-size: 0.78rem;
}

.settings-studio-releases-color-field code {
  color: var(--muted);
  font-family: inherit;
  font-size: 0.64rem;
  font-weight: 850;
  letter-spacing: 0.06em;
}

.settings-studio-releases-color-field .settings-color-input {
  width: 88px;
  height: 42px;
}

.settings-studio-releases-color-field em {
  grid-column: 1 / -1;
  color: var(--muted);
  font-size: 0.66rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.4;
}

.settings-studio-releases-preview {
  --studio-releases-preview-bg: #050507;
  --studio-releases-preview-primary: #ff7d66;
  --studio-releases-preview-accent: #70dced;
  --studio-releases-preview-ink: #f8f7f4;
  --studio-releases-preview-muted: rgba(248, 247, 244, 0.68);
  --studio-releases-preview-line: rgba(248, 247, 244, 0.18);
  min-width: 0;
  min-height: 290px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(180px, 0.7fr);
  gap: 28px;
  align-items: end;
  padding: 32px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--studio-releases-preview-bg);
  color: var(--studio-releases-preview-ink);
  box-shadow: 0 20px 38px rgba(10, 10, 13, 0.16);
  transition: background-color 180ms ease, color 180ms ease;
}

.settings-studio-releases-preview-title {
  min-width: 0;
  display: grid;
  gap: 12px;
}

.settings-studio-releases-preview-title small {
  color: var(--studio-releases-preview-accent);
  font-size: 0.58rem;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.settings-studio-releases-preview-title strong {
  display: grid;
  font-size: clamp(2rem, 3.2vw, 3.8rem);
  font-weight: 950;
  letter-spacing: -0.07em;
  line-height: 0.86;
}

.settings-studio-releases-preview-title strong span {
  width: fit-content;
  padding-right: 0.08em;
  color: var(--studio-releases-preview-primary);
  background: linear-gradient(102deg, var(--studio-releases-preview-primary) 18%, var(--studio-releases-preview-accent) 52%, var(--studio-releases-preview-primary) 84%);
  background-size: 220% 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: settings-studio-releases-motion-preview 3.4s ease-in-out infinite;
}

.settings-studio-releases-preview-side {
  min-width: 0;
  display: grid;
  gap: 14px;
  color: var(--studio-releases-preview-muted);
}

.settings-studio-releases-preview-side p {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.5;
}

.settings-studio-releases-preview-side > span {
  display: grid;
  gap: 3px;
  padding-top: 12px;
  border-top: 1px solid var(--studio-releases-preview-line);
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.settings-studio-releases-preview-side b {
  color: var(--studio-releases-preview-ink);
  font-size: 1.35rem;
}

.settings-studio-releases-preview-side i {
  justify-self: start;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--studio-releases-preview-primary);
  color: #09090b;
  font-size: 0.55rem;
  font-style: normal;
  font-weight: 950;
  text-transform: uppercase;
}

.settings-studio-releases-footnote {
  margin: -4px 0 0;
}

@keyframes settings-studio-releases-motion-preview {
  0%, 100% { background-position: 100% 50%; }
  50% { background-position: 0% 50%; }
}

@media (max-width: 1040px) {
  .settings-studio-releases-layout {
    grid-template-columns: 1fr;
  }
}

@container studio-releases-card (max-width: 820px) {
  .settings-studio-releases-layout {
    grid-template-columns: 1fr;
  }

  .settings-studio-releases-preview {
    min-height: 260px;
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 24px;
  }

  .settings-studio-releases-preview-title strong {
    font-size: clamp(2.5rem, 12cqi, 4rem);
  }
}

@container studio-releases-card (max-width: 480px) {
  .settings-studio-releases-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-studio-releases-heading .admin-button {
    width: 100%;
  }

  .settings-studio-releases-color-field {
    grid-template-columns: minmax(0, 1fr) 74px;
  }

  .settings-studio-releases-color-field .settings-color-input {
    width: 74px;
  }
}

@media (max-width: 620px) {
  .settings-studio-releases-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-studio-releases-heading .admin-button {
    width: 100%;
  }

  .settings-studio-releases-preview {
    min-height: 260px;
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 24px;
  }

  .settings-studio-releases-preview-title strong {
    font-size: clamp(2.5rem, 14vw, 4rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .settings-studio-releases-preview-title strong span {
    animation: none;
  }
}

@media (max-width: 820px) {
  .cost-profit-summary,
  .cost-profit-controls {
    align-items: stretch;
    flex-direction: column;
  }

  .cost-profit-summary-meta {
    justify-content: space-between;
  }

  .cost-profit-model-tabs {
    align-self: stretch;
  }

  .cost-profit-model-tab {
    flex: 1 1 0;
  }

  .cost-profit-tier-filters {
    flex-wrap: wrap;
  }

  .cost-profit-tier-filters legend {
    width: 100%;
  }

  .cost-profit-model-select {
    grid-template-columns: 1fr;
    width: 100%;
    min-width: 0;
  }

  .cost-profit-model-select select,
  .cost-profit-model-select small {
    grid-column: 1;
    width: 100%;
  }

  .cost-profit-table-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .cost-profit-empty-filter,
  .cost-profit-visible-note {
    margin-right: 2px;
    text-align: left;
  }
}

.settings-library-restore-point-toolbar{
  display:flex;
  justify-content:flex-end;
  margin:.65rem 0;
}

.settings-library-restore-point-list{
  display:grid;
  gap:.55rem;
}

.settings-library-restore-point{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  padding:.7rem;
  border:1px solid rgba(124,92,255,.14);
  border-radius:12px;
  background:rgba(255,255,255,.58);
}

.settings-library-restore-point strong,
.settings-library-restore-point small{
  display:block;
}

.settings-library-restore-point small{
  margin-top:.15rem;
  color:var(--muted);
}

.settings-library-restore-point-actions{
  display:flex;
  align-items:center;
  gap:.4rem;
  flex-wrap:wrap;
  justify-content:flex-end;
}

body[data-admin-theme="dark"] {
  background: #0e141d;
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] {
  --page-bg: #0e141d;
  --panel-bg: #141b27;
  --panel-soft: #101722;
  --panel-muted: #1b2433;
  --rail-bg: #090d14;
  --rail-muted: #a8b3c7;
  --rail-active: #1a2434;
  --line: #273346;
  --line-strong: #35445a;
  --text: #ebf1fc;
  --muted: #97a5bd;
  --blue: #7aa7ff;
  --blue-soft: rgba(122, 167, 255, 0.16);
  --green: #84c48f;
  --green-soft: rgba(132, 196, 143, 0.16);
  --orange: #e0a652;
  --orange-soft: rgba(224, 166, 82, 0.16);
  --red: #ef8181;
  --red-soft: rgba(239, 129, 129, 0.16);
  --purple: #b093ff;
  --purple-soft: rgba(176, 147, 255, 0.18);
  --shadow: 0 24px 48px rgba(0, 0, 0, 0.34);
  color-scheme: dark;
  background: var(--page-bg);
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--page-bg);
  color: var(--text);
  font-family: "Segoe UI", "Helvetica Neue", sans-serif;
}

body {
  min-height: 100vh;
}

a {
  color: inherit;
}

button,
input,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

[hidden] {
  display: none !important;
}

.admin-app {
  --rail-width: 108px;
  display: grid;
  grid-template-columns: var(--rail-width) minmax(0, 1fr);
  min-height: 100vh;
}

.admin-app[data-rail-collapsed="true"] {
  --rail-width: 76px;
}

.admin-rail {
  display: flex;
  flex-direction: column;
  gap: 24px;
  padding: 18px 12px 20px;
  background: var(--rail-bg);
  color: var(--rail-muted);
}

.admin-rail-top,
.admin-rail-bottom {
  display: grid;
  justify-items: center;
  gap: 14px;
}

.admin-rail-collapse {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  gap: 4px;
  border: 0;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.06);
  color: #f3f4f8;
}

.admin-rail-collapse span {
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.admin-brand {
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: linear-gradient(135deg, #ffffff, #dfe7ff);
  color: #223252;
  text-decoration: none;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.admin-rail-nav {
  display: grid;
  gap: 10px;
}

.admin-rail-button,
.admin-rail-link {
  width: 100%;
  min-height: 84px;
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 10px;
  padding: 10px 8px;
  border: 0;
  border-radius: 22px;
  background: transparent;
  color: inherit;
  text-decoration: none;
  text-align: center;
}

.admin-rail-button.is-active {
  background: var(--rail-active);
  color: #ffffff;
}

.admin-rail-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
}

.admin-rail-icon svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-rail-label {
  font-size: 0.92rem;
  line-height: 1.15;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-button,
.admin-app[data-rail-collapsed="true"] .admin-rail-link {
  min-height: 64px;
  border-radius: 18px;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-label,
.admin-app[data-rail-collapsed="true"] .admin-rail-link {
  font-size: 0;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-link::before {
  content: "A";
  font-size: 0.8rem;
  font-weight: 800;
}

.admin-workspace {
  min-width: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.admin-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  padding: 22px 28px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(12px);
}

.admin-header-copy {
  flex: 1 1 420px;
  min-width: 0;
  display: grid;
  gap: 6px;
}

.admin-kicker {
  color: var(--blue);
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 800;
}

.admin-header-copy .admin-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.admin-kicker-label {
  display: inline-flex;
  align-items: center;
}

.admin-version-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(138, 92, 246, 0.24);
  background: var(--purple-soft);
  color: var(--purple);
  font-size: 0.72rem;
  letter-spacing: 0;
  text-transform: none;
  font-weight: 900;
}

.admin-version-button {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 11px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.88);
  color: var(--text);
  font: inherit;
  font-size: 0.72rem;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  font-weight: 850;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(32, 48, 72, 0.08);
}

.admin-version-button:hover,
.admin-version-button:focus-visible {
  border-color: rgba(138, 92, 246, 0.38);
  background: #ffffff;
  outline: none;
}

.admin-app[data-theme="dark"] .admin-version-button {
  background: rgba(20, 27, 39, 0.9);
}

.admin-app[data-theme="dark"] .admin-version-button:hover,
.admin-app[data-theme="dark"] .admin-version-button:focus-visible {
  background: rgba(27, 36, 51, 0.95);
}

.admin-title {
  margin: 0;
  font-size: clamp(1.95rem, 3vw, 2.8rem);
  line-height: 0.98;
}

.admin-subtitle {
  margin: 0;
  color: var(--muted);
  max-width: 64ch;
  line-height: 1.55;
}

.admin-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.admin-header-actions.is-users-search-hidden {
  justify-content: flex-end;
}

.admin-header-actions.is-users-search-hidden .admin-search-shell,
.admin-header-actions.is-users-search-hidden #workspace-search-button {
  display: none;
}

.maintenance-countdown-pill {
  min-height: 52px;
  max-width: min(100%, 390px);
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 8px 14px;
  border-radius: 18px;
  border: 1px solid rgba(236, 177, 89, 0.45);
  background: linear-gradient(135deg, rgba(255, 248, 238, 0.98), rgba(255, 255, 255, 0.95));
  color: var(--text);
  box-shadow: 0 16px 32px rgba(151, 105, 42, 0.1);
}

.maintenance-countdown-pill[hidden] {
  display: none;
}

.maintenance-countdown-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #e8a13c;
  box-shadow: 0 0 0 6px rgba(232, 161, 60, 0.14);
}

.maintenance-countdown-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.maintenance-countdown-label {
  color: #9b6715;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.maintenance-countdown-note {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.maintenance-countdown-value {
  color: var(--text);
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 1.08rem;
  font-weight: 900;
  letter-spacing: 0;
  white-space: nowrap;
}

.maintenance-countdown-pill[data-state="active"] {
  border-color: rgba(230, 95, 116, 0.46);
  background: linear-gradient(135deg, rgba(255, 241, 244, 0.98), rgba(255, 255, 255, 0.95));
  box-shadow: 0 16px 32px rgba(171, 61, 80, 0.12);
}

.maintenance-countdown-pill[data-state="active"] .maintenance-countdown-dot {
  background: #e85a77;
  box-shadow: 0 0 0 6px rgba(232, 90, 119, 0.14);
}

.maintenance-countdown-pill[data-state="active"] .maintenance-countdown-label {
  color: #c84061;
}

.admin-theme-toggle {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 7px 14px 7px 10px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--text);
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.admin-theme-toggle:hover {
  transform: translateY(-1px);
}

.admin-theme-toggle-track {
  width: 52px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 3px;
  border-radius: 999px;
  background: #d7deea;
  transition: background-color 0.18s ease;
}

.admin-theme-toggle-thumb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 4px 12px rgba(43, 54, 69, 0.16);
  transition: transform 0.18s ease;
}

.admin-theme-toggle-copy {
  display: grid;
  gap: 2px;
  text-align: left;
}

.admin-theme-toggle-label {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-theme-toggle-state {
  color: var(--muted);
  font-size: 0.92rem;
  font-weight: 700;
}

.admin-theme-toggle.is-active .admin-theme-toggle-track {
  background: rgba(75, 125, 240, 0.34);
}

.admin-theme-toggle.is-active .admin-theme-toggle-thumb {
  transform: translateX(22px);
}

.admin-search-shell {
  position: relative;
  min-width: min(420px, calc(100vw - 220px));
}

.admin-search-icon {
  position: absolute;
  top: 50%;
  left: 16px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  color: var(--muted);
}

.admin-search-icon svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
}

.admin-search-shell input,
.admin-text-input,
.admin-textarea {
  width: 100%;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--text);
}

.admin-search-shell input {
  min-height: 48px;
  padding: 0 16px 0 46px;
}

.admin-button {
  min-height: 46px;
  padding: 0 16px;
  border-radius: 14px;
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background-color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.admin-button:hover {
  transform: translateY(-1px);
}

.admin-button.primary {
  background: var(--blue);
  color: #ffffff;
}

.admin-button.ghost {
  background: #ffffff;
  color: var(--text);
  border-color: var(--line);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.admin-button.subtle {
  background: var(--panel-soft);
  color: var(--text);
  border-color: var(--line);
}

.admin-button.warning {
  background: var(--orange-soft);
  color: #855c18;
  border-color: rgba(201, 137, 47, 0.24);
}

.admin-button.success {
  background: var(--green-soft);
  color: #456f4a;
  border-color: rgba(90, 147, 98, 0.24);
}

.admin-button.dark {
  background: #14161c;
  color: #ffffff;
}

.admin-button.danger {
  background: #c94a4a;
  color: #ffffff;
}

.admin-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

body[data-admin-dialog-open] {
  overflow: hidden;
}

.admin-dialog-shell {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: grid;
  place-items: center;
  padding: 24px;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable both-edges;
}

.admin-dialog-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 21, 33, 0.54);
  backdrop-filter: blur(8px);
}

.admin-dialog-card {
  position: relative;
  z-index: 1;
  width: min(100%, 640px);
  display: grid;
  gap: 18px;
  padding: 28px;
  border-radius: 28px;
  border: 1px solid rgba(199, 207, 219, 0.9);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 248, 251, 0.98));
  box-shadow: 0 32px 80px rgba(20, 31, 48, 0.28);
}

.admin-dialog-head {
  display: grid;
  gap: 10px;
}

.admin-dialog-title {
  margin: 0;
}

.admin-dialog-copy {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.admin-dialog-field {
  display: grid;
  gap: 10px;
}

.admin-dialog-custom {
  display: grid;
  gap: 16px;
}

.admin-dialog-card.is-recovery-handoff-dialog {
  box-sizing: border-box;
  min-width: 0;
  width: min(100%, 760px);
  max-height: calc(100dvh - 48px);
  overflow-y: auto;
  overscroll-behavior: contain;
  align-content: start;
  grid-auto-rows: max-content;
}
.is-recovery-handoff-dialog > *, .recovery-handoff-instructions, .recovery-handoff-steps li { min-width: 0; }
.is-recovery-handoff-dialog [hidden] { display: none !important; }
.recovery-handoff-steps { display: grid; gap: 16px; margin: 0; padding-left: 26px; }
.recovery-handoff-steps li { padding-left: 6px; color: var(--text); }
.recovery-handoff-steps li::marker { color: var(--primary); font-weight: 900; }
.recovery-handoff-steps strong, .recovery-handoff-steps span { display: block; }
.recovery-handoff-steps span { margin-top: 5px; line-height: 1.5; }
.recovery-handoff-steps code, .recovery-handoff-steps span, .recovery-transfer-signal small,
.is-recovery-handoff-dialog .admin-dialog-helper { overflow-wrap: anywhere; }
.recovery-archive-policy { color: var(--muted); line-height: 1.5; font-size: .86rem; }
.recovery-transfer-signal { display: grid; gap: 8px; padding: 18px; margin: 12px 0; border: 1px solid var(--line); border-left: 5px solid var(--primary); border-radius: 16px; background: rgba(124,100,255,.08); color: var(--text); }
.recovery-transfer-signal strong { font-size: 1.06rem; }
.recovery-transfer-signal p { margin: 0; line-height: 1.5; }
.recovery-transfer-signal small { color: var(--muted); }
.recovery-transfer-signal progress { width: 100%; height: 18px; accent-color: var(--primary); }
.storage-recovery-dial > span { max-width: 100%; }
.recovery-transfer-signal.is-verified { border-left-color: #228365; }
.recovery-transfer-signal.is-failed { border-left-color: #c44949; }
body[data-admin-theme="dark"] .recovery-handoff-steps li,
body[data-admin-theme="dark"] .recovery-transfer-signal { color: #ebf1fc; }
body[data-admin-theme="dark"] .recovery-archive-policy,
body[data-admin-theme="dark"] .recovery-transfer-signal small { color: #a7b4cb; }
body[data-admin-theme="dark"] .storage-recovery-live-metrics > div,
body[data-admin-theme="dark"] .storage-recovery-verification-grid > div,
body[data-admin-theme="dark"] .storage-recovery-help { background: #222a3b; border-color: #48536b; color: #ebf1fc; }
body[data-admin-theme="dark"] .storage-recovery-live-metrics strong,
body[data-admin-theme="dark"] .storage-recovery-verification-grid strong,
body[data-admin-theme="dark"] .storage-recovery-help summary { color: #ebf1fc; }
body[data-admin-theme="dark"] .storage-recovery-dial { background: radial-gradient(circle at center, #222a3b 0 57%, transparent 58%), conic-gradient(#9e8bff calc(var(--recovery-progress) * 1%), #363356 0); }
body[data-admin-theme="dark"] .storage-recovery-dial span { color: #ebf1fc; }
.is-recovery-handoff-dialog .admin-dialog-actions { flex-wrap: wrap; }
@media (max-width: 540px) {
  .admin-dialog-card.is-recovery-handoff-dialog { padding: 20px; max-height: calc(100dvh - 32px); }
  .is-recovery-handoff-dialog .admin-dialog-actions { flex-direction: column-reverse; flex-wrap: nowrap; }
  .is-recovery-handoff-dialog .admin-dialog-actions .admin-button { box-sizing: border-box; flex: 0 0 auto; width: 100%; white-space: normal; }
}

.media-takedown-dialog-field {
  display: grid;
  gap: 8px;
  font-weight: 800;
}

.media-takedown-dialog-select,
.media-takedown-dialog-note {
  width: 100%;
  padding: 13px 14px;
  border: 1px solid rgba(172, 181, 196, 0.9);
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  font: inherit;
}

.media-takedown-dialog-select { min-height: 48px; }
.media-takedown-dialog-note { min-height: 124px; resize: vertical; line-height: 1.5; }
.media-takedown-dialog-select:focus,
.media-takedown-dialog-note:focus { border-color: #845bff; outline: 3px solid rgba(132, 91, 255, 0.18); }
.media-takedown-dialog-help { margin: -4px 0 0; color: var(--muted); line-height: 1.5; }

.admin-dialog-card.is-admin-version-dialog {
  width: min(100%, 560px);
}

.admin-version-list-shell {
  display: grid;
  gap: 12px;
}

.admin-version-current-section {
  display: grid;
}

.admin-version-older-panel {
  display: grid;
  gap: 10px;
}

.admin-version-older-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(141, 155, 184, 0.16);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.66);
}

.admin-version-older-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.admin-version-older-copy strong {
  color: var(--text);
  font-size: 0.88rem;
  font-weight: 920;
}

.admin-version-older-copy span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.3;
}

.admin-version-older-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-version-control-button {
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid rgba(132, 111, 255, 0.24);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--accent-strong);
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease;
}

.admin-version-control-button:hover,
.admin-version-control-button:focus-visible {
  border-color: rgba(132, 111, 255, 0.42);
  background: #ffffff;
  transform: translateY(-1px);
}

.admin-version-control-button:focus-visible {
  outline: 3px solid rgba(132, 111, 255, 0.22);
  outline-offset: 2px;
}

.admin-version-control-button.is-danger {
  border-color: rgba(211, 94, 94, 0.24);
  color: #c05656;
}

.admin-version-control-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  transform: none;
}

.admin-dialog-card.is-media-profile-preview-dialog {
  width: min(100%, 760px);
}

.admin-version-list {
  display: grid;
  gap: 10px;
  max-height: min(58vh, 420px);
  overflow: auto;
  padding-right: 4px;
}

.admin-version-list.is-older {
  max-height: min(44vh, 340px);
}

.admin-version-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(124, 100, 255, 0.06);
}

.admin-version-row.is-current {
  border-color: rgba(138, 92, 246, 0.34);
  background: rgba(138, 92, 246, 0.1);
}

.admin-version-row-copy {
  min-width: 0;
}

.admin-version-row strong,
.admin-version-row span {
  display: block;
}

.admin-version-row strong {
  color: var(--text);
  font-size: 0.94rem;
  line-height: 1.25;
}

.admin-version-row span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.35;
}

.admin-version-row em {
  flex: 0 0 auto;
  align-self: flex-start;
  padding: 5px 8px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue);
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-version-empty {
  padding: 12px 14px;
  border: 1px dashed rgba(141, 155, 184, 0.22);
  border-radius: 14px;
  background: rgba(247, 249, 252, 0.72);
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.4;
}

.admin-dialog-recipient-card {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(124, 100, 255, 0.06);
}

.admin-dialog-recipient-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.admin-dialog-recipient-head span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-dialog-recipient-head strong {
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admin-dialog-recipient-list {
  display: grid;
  gap: 6px;
}

.admin-dialog-recipient-row {
  display: grid;
  grid-template-columns: minmax(72px, max-content) minmax(0, 1fr);
  gap: 12px;
  align-items: baseline;
}

.admin-dialog-recipient-row span {
  color: var(--muted);
  font-size: 0.82rem;
}

.admin-dialog-recipient-row strong {
  min-width: 0;
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.media-report-clear-option {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border: 1px solid rgba(54, 200, 160, 0.28);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(54, 200, 160, 0.12), rgba(77, 167, 255, 0.08));
  cursor: pointer;
}

.media-report-clear-option input {
  width: 18px;
  height: 18px;
  margin: 3px 0 0;
  accent-color: #35c8a0;
  cursor: pointer;
}

.media-report-clear-option span {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.media-report-clear-option strong {
  color: var(--text);
  font-size: 0.92rem;
  font-weight: 900;
}

.media-report-clear-option small {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.45;
}

.admin-dialog-ai-card {
  display: grid;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid rgba(132, 91, 255, 0.22);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(132, 91, 255, 0.1), rgba(245, 239, 255, 0.78));
}

.admin-dialog-ai-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  text-transform: uppercase;
}

.admin-dialog-ai-head span,
.admin-dialog-ai-head strong {
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.admin-dialog-ai-head span {
  color: #845bff;
}

.admin-dialog-ai-head strong {
  color: var(--text);
}

.admin-dialog-ai-copy {
  margin: 0;
  color: var(--text);
  font-size: 0.94rem;
  font-weight: 750;
  line-height: 1.52;
  white-space: pre-line;
}

.admin-dialog-label {
  font-weight: 700;
  letter-spacing: 0.02em;
}

.admin-dialog-input {
  min-height: 148px;
  padding: 14px 16px;
  resize: vertical;
}

.title-revision-decision-fields { display: grid; gap: 10px; }
.title-revision-decision-fields > label:first-child { font-weight: 700; }
.title-revision-decision-fields textarea { box-sizing: border-box; width: 100%; min-height: 100px; padding: 12px 14px; border: 1px solid #aeb5c4; border-radius: 12px; background: #fff; color: #222938; font: inherit; resize: vertical; }
.title-revision-decision-fields textarea:focus-visible { outline: 3px solid #a887ff; outline-offset: 2px; }
.title-revision-standard-choice { display: flex; align-items: flex-start; gap: 9px; font-weight: 700; }
.title-revision-standard-choice input { margin-top: 4px; accent-color: #7953dc; }
.title-revision-decision-fields small { color: var(--muted); line-height: 1.4; }
body[data-admin-theme="dark"] .title-revision-decision-fields textarea { background: #191723; color: #f6f2ff; border-color: #756b87; }

.admin-dialog-helper {
  margin: 0;
  min-height: 1.3em;
  color: var(--muted);
}

.admin-dialog-helper.is-error {
  color: var(--red);
}

.admin-dialog-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
}

.admin-dialog-actions .admin-button {
  min-width: 124px;
}

.admin-dialog-card.is-server-directory-dialog {
  width: min(96vw, 1480px);
  max-height: min(92vh, 980px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 20px;
}

.admin-dialog-card.is-server-directory-dialog .admin-dialog-custom {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 6px;
}

.admin-dialog-card.is-workspace-verify-dialog {
  width: min(100%, 560px);
  gap: 22px;
  padding: 34px 34px 30px;
  border-radius: 32px;
  background:
    radial-gradient(circle at top left, rgba(113, 148, 255, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(246, 248, 252, 0.98));
}

.admin-dialog-card.is-workspace-verify-dialog .admin-dialog-head {
  gap: 12px;
}

.admin-dialog-card.is-workspace-verify-dialog .admin-dialog-title {
  font-size: clamp(2rem, 4vw, 2.7rem);
  line-height: 1.04;
}

.admin-dialog-card.is-workspace-verify-dialog .admin-dialog-copy {
  max-width: 36ch;
  font-size: 1.04rem;
}

.workspace-verify-card {
  display: grid;
  gap: 22px;
  padding: 8px 0 0;
}

.workspace-verify-icon {
  display: grid;
  place-items: center;
  width: 66px;
  height: 66px;
  border-radius: 20px;
  border: 1px solid rgba(195, 203, 216, 0.95);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 252, 0.98));
  color: #a1a8b7;
  box-shadow: 0 18px 34px rgba(59, 77, 111, 0.12);
}

.workspace-verify-icon svg {
  width: 34px;
  height: 34px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.45;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.workspace-verify-destination {
  display: grid;
  gap: 8px;
}

.workspace-verify-destination-label {
  color: var(--muted);
  font-size: 0.95rem;
  letter-spacing: 0.02em;
}

.workspace-verify-destination-value {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  max-width: min(100%, 320px);
  min-height: 42px;
  padding: 10px 14px;
  border-radius: 16px;
  border: 1px solid rgba(214, 220, 232, 0.95);
  background: rgba(250, 251, 255, 0.98);
  font-size: 1rem;
  letter-spacing: 0.01em;
  color: var(--text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.workspace-verify-digits {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

.workspace-verify-digit {
  width: 100%;
  min-width: 0;
  aspect-ratio: 0.72 / 1;
  border-radius: 999px;
  border: 2px solid rgba(161, 169, 184, 0.78);
  background: rgba(255, 255, 255, 0.98);
  color: var(--text);
  text-align: center;
  font-size: clamp(1.75rem, 3vw, 2.15rem);
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 10px 24px rgba(76, 94, 130, 0.08);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.workspace-verify-digit:hover {
  border-color: rgba(125, 137, 160, 0.92);
}

.workspace-verify-digit:focus {
  outline: none;
  border-color: rgba(81, 143, 255, 0.94);
  box-shadow:
    0 0 0 4px rgba(84, 146, 255, 0.16),
    0 14px 26px rgba(49, 80, 145, 0.16);
  transform: translateY(-1px);
}

.workspace-verify-actions-row {
  display: flex;
  justify-content: flex-end;
}

.workspace-verify-actions-row .admin-button {
  min-width: 148px;
}

.admin-dialog-card.is-workspace-expiry-dialog {
  width: min(100%, 560px);
  gap: 22px;
  padding: 32px 32px 28px;
  border-radius: 30px;
  background:
    radial-gradient(circle at top left, rgba(133, 116, 255, 0.12), transparent 32%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(246, 248, 252, 0.98));
}

.admin-dialog-card.is-dashboard-insight-dialog {
  width: min(96vw, 1100px);
  max-height: min(90vh, 960px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.admin-dialog-card.is-dashboard-insight-dialog .admin-dialog-custom {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding-right: 8px;
}

.admin-dialog-card.is-media-tracklist-dialog {
  width: min(96vw, 900px);
  max-height: min(90vh, 880px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.admin-dialog-card.is-media-inspector-dialog {
  width: min(96vw, 1280px);
  max-height: min(92vh, 980px);
}

.admin-dialog-card.is-media-inspector-dialog .admin-dialog-custom {
  overflow: hidden;
  padding-right: 0;
}

.admin-dialog-card.is-media-tracklist-dialog .admin-dialog-custom {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 4px;
}

.media-tracklist-dialog {
  display: grid;
  gap: 16px;
}

.media-tracklist-album {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 16px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(248, 250, 252, 0.82);
}

.media-tracklist-album.has-owner-action {
  grid-template-columns: 92px minmax(0, 1fr) auto;
}

.media-tracklist-album-action {
  align-self: start;
  justify-self: end;
}

.media-build-record-download {
  min-height: 42px;
  white-space: nowrap;
}

.media-tracklist-cover {
  width: 92px;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.82);
}

.media-tracklist-album-copy {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.media-tracklist-album-copy strong {
  color: var(--text);
  font-size: 1.05rem;
  font-weight: 900;
  line-height: 1.15;
}

.media-tracklist-album-copy span {
  min-width: 0;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.media-tracklist-rows {
  display: grid;
  gap: 12px;
}

.media-tracklist-row {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 14px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.88);
}

.media-tracklist-number {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(124, 92, 255, 0.1);
  color: #7c5cff;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.media-tracklist-main {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.media-tracklist-title-row {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.media-tracklist-title-row strong {
  color: var(--text);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.media-tracklist-title-row span {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.media-tracklist-tagline {
  margin: 0;
  color: #7c5cff;
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.media-tracklist-audio {
  width: 100%;
  min-width: 0;
}

.media-track-version-list {
  display: grid;
  gap: 8px;
  margin-top: 4px;
  padding: 10px;
  border: 1px solid rgba(124, 92, 255, 0.16);
  border-radius: 14px;
  background: rgba(124, 92, 255, 0.035);
}

.media-track-version-list-head,
.media-track-version-title,
.media-track-version-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}

.media-track-version-list-head {
  justify-content: space-between;
}

.media-track-version-list-head strong,
.media-track-version-title > strong {
  color: var(--text);
  font-size: 0.8rem;
  font-weight: 900;
}

.media-track-version-list-head > span,
.media-track-version-copy > span,
.media-track-version-copy > small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.35;
}

.media-track-version-row {
  display: grid;
  grid-template-columns: minmax(155px, 0.8fr) minmax(190px, 1.2fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
}

.media-track-version-row.is-removed {
  border-color: rgba(222, 140, 42, 0.3);
  background: rgba(255, 246, 232, 0.88);
}

.media-track-version-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.media-track-version-audio {
  width: 100%;
  min-width: 0;
  height: 34px;
}

.media-track-version-actions {
  justify-content: flex-end;
}

.media-track-version-actions .admin-button {
  min-height: 34px;
  padding: 0.52rem 0.68rem;
  font-size: 0.72rem;
}

@media (max-width: 840px) {
  .media-track-version-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .media-track-version-actions {
    justify-content: flex-start;
  }
}

.media-inspector-dialog {
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 16px;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.media-inspector-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(248, 250, 255, 0.82);
  position: relative;
  z-index: 2;
}

.media-inspector-tab {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.media-inspector-tab:hover,
.media-inspector-tab:focus-visible {
  color: var(--text);
  background: rgba(255, 255, 255, 0.88);
  border-color: rgba(199, 207, 219, 0.9);
  outline: none;
}

.media-inspector-tab.is-active {
  color: #ffffff;
  border-color: rgba(124, 92, 255, 0.28);
  background: linear-gradient(135deg, #7c5cff, #4da7ff);
  box-shadow: 0 14px 28px rgba(72, 100, 220, 0.18);
}

.media-inspector-panel[hidden] {
  display: none !important;
}

.media-inspector-panel {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  padding-right: 4px;
}

.media-inspector-moderation-layout {
  display: grid;
  grid-template-columns: minmax(300px, 0.86fr) minmax(0, 1.14fr);
  gap: 16px;
  align-items: start;
}

.media-inspector-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.media-inspector-section-head .admin-button {
  flex: 0 0 auto;
}

.media-inspector-action-row {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.media-inspector-control-card,
.media-inspector-progress-card {
  gap: 14px;
}

.media-inspector-inline-card {
  padding: 14px;
  border-radius: 18px;
  background: rgba(248, 250, 255, 0.7);
}

.mini-section-title {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.media-inspector-settings-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.media-inspector-setting-chip {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid rgba(220, 226, 234, 0.88);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
}

.media-inspector-setting-chip > span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.media-inspector-category-option {
  min-height: 0;
}

.media-inspector-progress {
  padding: 12px 14px;
  border: 1px solid rgba(220, 226, 234, 0.88);
  border-radius: 16px;
  background: rgba(248, 250, 255, 0.72);
}

.media-inspector-stage-list {
  display: grid;
  gap: 8px;
}

.media-inspector-stage {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(220, 226, 234, 0.9);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.82);
}

.media-inspector-stage-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #94a3b8;
  box-shadow: 0 0 0 4px rgba(148, 163, 184, 0.12);
}

.media-inspector-stage.is-blue .media-inspector-stage-dot {
  background: #4da7ff;
  box-shadow: 0 0 0 4px rgba(77, 167, 255, 0.14);
}

.media-inspector-stage.is-orange .media-inspector-stage-dot {
  background: #d59035;
  box-shadow: 0 0 0 4px rgba(213, 144, 53, 0.16);
}

.media-inspector-stage.is-red .media-inspector-stage-dot {
  background: #dc4c54;
  box-shadow: 0 0 0 4px rgba(220, 76, 84, 0.16);
}

.media-inspector-stage span:not(.media-inspector-stage-dot) {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.media-inspector-stage strong {
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 900;
  line-height: 1.2;
}

.media-inspector-stage small {
  min-width: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.media-inspector-result-card {
  display: grid;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid rgba(220, 226, 234, 0.92);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.84);
}

.media-inspector-result-card .community-sweep-result-main {
  grid-template-columns: minmax(0, 1fr) auto;
}

.media-inspector-details-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.media-inspector-details-grid .media-interaction-card {
  grid-column: 1 / -1;
}

.workspace-warning-card {
  display: grid;
  gap: 22px;
}

.workspace-warning-top {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.workspace-warning-icon {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 22px;
  border: 1px solid rgba(195, 203, 216, 0.95);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 252, 0.98));
  color: #8b95ab;
  box-shadow: 0 18px 34px rgba(59, 77, 111, 0.12);
}

.workspace-warning-icon svg {
  width: 38px;
  height: 38px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.workspace-warning-copy {
  display: grid;
  gap: 8px;
}

.workspace-warning-label {
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a62ff;
}

.workspace-warning-title {
  font-size: clamp(1.8rem, 3.6vw, 2.4rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  color: var(--text);
}

.workspace-warning-note {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.workspace-warning-countdown-shell {
  display: grid;
  gap: 10px;
  padding: 18px 20px;
  border-radius: 22px;
  border: 1px solid rgba(214, 220, 232, 0.95);
  background: rgba(252, 252, 255, 0.98);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.94);
}

.workspace-warning-countdown-label {
  font-size: 0.9rem;
  font-weight: 650;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--muted);
}

.workspace-warning-countdown-value {
  font-size: clamp(2.2rem, 4vw, 3rem);
  font-weight: 600;
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: -0.01em;
  line-height: 0.95;
  color: var(--text);
}

.server-directory-browser {
  display: grid;
  gap: 12px;
  min-height: 0;
  height: min(74vh, 760px);
}

.server-directory-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.9fr);
  gap: 14px;
  padding: 16px 18px;
  border-radius: 22px;
  background:
    radial-gradient(circle at top left, rgba(255, 255, 255, 0.16), transparent 38%),
    linear-gradient(140deg, #6984ff 0%, #6478f0 42%, #89a0ff 100%);
  box-shadow: 0 24px 50px rgba(63, 88, 185, 0.22);
  color: #ffffff;
  overflow: hidden;
}

.server-directory-hero-actions {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 1;
}

.server-directory-hero-copy,
.server-directory-hero-stats,
.server-directory-sidebar,
.server-directory-main,
.server-directory-root-grid,
.server-directory-toolbar-copy,
.server-directory-path-current,
.server-directory-list {
  display: grid;
  gap: 10px;
}

.server-directory-hero-title-row {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding-right: 134px;
}

.server-directory-hero-kicker {
  display: inline-flex;
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.server-directory-hero-title {
  margin: 0;
  font-size: clamp(1.35rem, 1.8vw, 1.9rem);
  line-height: 1.1;
  color: #ffffff;
}

.server-directory-hero-note {
  margin: 0;
  max-width: 52ch;
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.35;
}

.server-directory-browser.is-hero-collapsed .server-directory-hero {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
  padding: 14px 18px;
}

.server-directory-browser.is-hero-collapsed .server-directory-hero-copy {
  gap: 6px;
}

.server-directory-browser.is-hero-collapsed .server-directory-hero-title {
  font-size: clamp(1.05rem, 1.3vw, 1.25rem);
}

.server-directory-browser.is-hero-collapsed .server-directory-hero-note {
  display: none;
}

.server-directory-browser.is-hero-collapsed .server-directory-hero-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.server-directory-browser.is-hero-collapsed .server-directory-hero-stat {
  padding: 10px 12px;
  border-radius: 14px;
}

.server-directory-browser.is-hero-collapsed .server-directory-hero-stat span {
  margin-bottom: 4px;
}

.server-directory-hero-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-content: center;
}

.server-directory-hero-stat {
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(10px);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.server-directory-hero-stat span {
  display: block;
  margin-bottom: 6px;
  color: rgba(255, 255, 255, 0.74);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.server-directory-hero-stat strong {
  color: #ffffff;
  font-size: 1.05rem;
  line-height: 1.3;
}

.server-directory-layout {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: 12px;
}

.server-directory-preview-panel {
  grid-column: 1 / -1;
  min-width: 0;
}

.server-directory-sidebar,
.server-directory-main {
  min-height: 0;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(211, 219, 235, 0.94);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 248, 252, 0.98));
  box-shadow: 0 18px 36px rgba(29, 42, 65, 0.08);
}

.server-directory-sidebar {
  align-content: start;
}

.server-directory-root-grid {
  max-height: 100%;
  overflow: auto;
  padding-right: 8px;
  scrollbar-width: auto;
}

.server-directory-root-card {
  width: 100%;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid rgba(214, 220, 236, 0.92);
  background: rgba(255, 255, 255, 0.88);
  cursor: pointer;
  text-align: left;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.server-directory-root-card:hover {
  transform: translateY(-1px);
  border-color: rgba(104, 128, 255, 0.32);
  box-shadow: 0 16px 28px rgba(104, 128, 255, 0.12);
}

.server-directory-root-card.is-active {
  border-color: rgba(104, 128, 255, 0.38);
  background: linear-gradient(180deg, rgba(239, 243, 255, 0.98), rgba(246, 248, 255, 0.98));
  box-shadow: 0 18px 30px rgba(104, 128, 255, 0.14);
}

.server-directory-root-card-icon,
.server-directory-entry-icon {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: linear-gradient(180deg, rgba(120, 140, 255, 0.12), rgba(103, 123, 250, 0.06));
  color: #5f72df;
  box-shadow: inset 0 0 0 1px rgba(116, 130, 227, 0.12);
}

.server-directory-entry-icon.is-action {
  border: 0;
  cursor: pointer;
  font: inherit;
  padding: 0;
  transition: transform 140ms ease, box-shadow 140ms ease;
}

.server-directory-entry-icon.is-action:hover {
  transform: translateY(-1px);
  box-shadow: inset 0 0 0 1px rgba(86, 181, 163, 0.2), 0 10px 20px rgba(86, 181, 163, 0.14);
}

.server-directory-root-card-icon svg,
.server-directory-entry-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.server-directory-root-card-title,
.server-directory-entry-title {
  display: block;
  color: var(--text);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.3;
}

.server-directory-root-card-note,
.server-directory-entry-meta,
.server-directory-entry-path,
.server-directory-path-label {
  display: block;
  color: var(--muted);
}

.server-directory-root-card-note {
  line-height: 1.32;
  font-size: 0.82rem;
}

.server-directory-main {
  align-content: start;
  overflow: hidden;
}

.server-directory-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.server-directory-toolbar-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.server-directory-search-form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 10px;
  align-items: center;
}

.server-directory-path-strip {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(243, 246, 255, 0.96), rgba(248, 249, 252, 0.96));
  border: 1px solid rgba(216, 223, 240, 0.94);
}

.server-directory-path-value {
  color: var(--text);
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.84rem;
  line-height: 1.42;
  word-break: break-word;
}

.server-directory-path-meta {
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 8px;
}

.server-directory-path-meta div {
  min-width: 0;
  padding: 9px 11px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: inset 0 0 0 1px rgba(220, 226, 240, 0.86);
}

.server-directory-path-meta strong {
  display: block;
  color: var(--text);
  font-size: 0.95rem;
  line-height: 1.1;
}

.server-directory-path-meta span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.server-directory-breadcrumbs,
.server-directory-summary-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.server-directory-crumb-shell {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.server-directory-crumb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(216, 223, 240, 0.94);
  background: rgba(255, 255, 255, 0.88);
  color: var(--accent-strong);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.server-directory-crumb.is-current {
  background: rgba(150, 112, 255, 0.12);
  border-color: rgba(150, 112, 255, 0.28);
  cursor: default;
}

.server-directory-crumb-separator {
  color: var(--muted);
  font-weight: 700;
}

.server-directory-list {
  min-height: 0;
  height: 100%;
  overflow: auto;
  padding-right: 10px;
  scrollbar-width: auto;
}

.server-directory-root-grid::-webkit-scrollbar,
.server-directory-list::-webkit-scrollbar {
  width: 16px;
  height: 16px;
}

.server-directory-root-grid::-webkit-scrollbar-track,
.server-directory-list::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(220, 226, 234, 0.58);
}

.server-directory-root-grid::-webkit-scrollbar-thumb,
.server-directory-list::-webkit-scrollbar-thumb {
  border: 3px solid rgba(220, 226, 234, 0.2);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(76, 125, 240, 0.82), rgba(112, 160, 255, 0.92));
}

.server-directory-entry-card {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 11px;
  border-radius: 14px;
  border: 1px solid rgba(216, 223, 240, 0.92);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 10px 20px rgba(27, 40, 60, 0.045);
}

.server-directory-browser.is-compact-entries .server-directory-entry-card {
  grid-template-columns: 30px minmax(0, 1fr) auto;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 12px;
}

.server-directory-browser.is-compact-entries .server-directory-entry-icon {
  width: 30px;
  height: 30px;
  border-radius: 10px;
}

.server-directory-browser.is-compact-entries .server-directory-entry-icon svg {
  width: 18px;
  height: 18px;
}

.server-directory-browser.is-compact-entries .server-directory-entry-head {
  gap: 8px;
}

.server-directory-browser.is-compact-entries .server-directory-entry-title {
  font-size: 0.95rem;
}

.server-directory-browser.is-compact-entries .server-directory-entry-meta,
.server-directory-browser.is-compact-entries .server-directory-entry-path {
  font-size: 0.76rem;
  line-height: 1.35;
}

.server-directory-browser.is-compact-entries .server-directory-entry-actions .admin-button {
  min-height: 34px;
  padding: 0 12px;
}

.server-directory-entry-head {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.server-directory-entry-icon.tone-folder {
  color: #56b5a3;
  background: linear-gradient(180deg, rgba(86, 181, 163, 0.18), rgba(86, 181, 163, 0.08));
}

.server-directory-entry-icon.tone-file {
  color: #ff8b64;
  background: linear-gradient(180deg, rgba(255, 139, 100, 0.18), rgba(255, 139, 100, 0.08));
}

.server-directory-entry-icon.tone-link {
  color: #ab7dff;
  background: linear-gradient(180deg, rgba(171, 125, 255, 0.18), rgba(171, 125, 255, 0.08));
}

.server-directory-entry-path {
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.82rem;
  line-height: 1.5;
  word-break: break-word;
}

.server-directory-entry-actions {
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
}

.server-directory-empty {
  padding: 24px;
}

.server-directory-preview,
.storage-backup-preview-card {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(216, 223, 240, 0.94);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 10px 22px rgba(27, 40, 60, 0.06);
}

.server-directory-preview-grid,
.storage-backup-preview-grid {
  display: grid;
  gap: 12px;
}

.server-directory-preview-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.server-directory-preview-label {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.server-directory-preview-path,
.server-directory-preview-text {
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.82rem;
  line-height: 1.45;
}

.server-directory-preview-path {
  color: var(--muted);
  word-break: break-word;
}

.server-directory-preview-text {
  max-height: 240px;
  overflow: auto;
  margin: 0;
  padding: 12px;
  border-radius: 12px;
  background: #111827;
  color: #eef6ff;
  white-space: pre-wrap;
}

.server-directory-preview-note,
.storage-backup-preview-empty {
  padding: 12px;
  border-radius: 12px;
  background: rgba(244, 247, 252, 0.9);
  color: var(--muted);
  line-height: 1.45;
}

.server-directory-preview-actions,
.storage-backup-preview-head,
.storage-backup-preview-stats,
.storage-backup-preview-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.server-directory-preview-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
}

.storage-backup-preview-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 16px 0;
}

.storage-backup-preview-head {
  justify-content: space-between;
  align-items: flex-start;
}

.storage-backup-preview-stats {
  flex-wrap: wrap;
}

.storage-backup-preview-stats span {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(244, 247, 252, 0.92);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.storage-backup-preview-stats strong {
  color: var(--text);
}

.storage-backup-preview-list {
  display: grid;
  gap: 8px;
}

.storage-backup-preview-carousel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 58px;
  align-items: stretch;
  gap: 10px;
}

.storage-backup-preview-carousel-viewport {
  min-width: 0;
  overflow: hidden;
}

.storage-backup-preview-row.is-carousel-item {
  min-height: 168px;
  height: 100%;
}

.storage-backup-preview-carousel-controls {
  display: grid;
  grid-template-rows: 44px 1fr 44px;
  align-items: center;
  justify-items: center;
  gap: 8px;
}

.storage-backup-preview-nav {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text);
  cursor: pointer;
}

.storage-backup-preview-nav svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.storage-backup-preview-nav:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}

.storage-backup-preview-carousel-status {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.storage-backup-preview-row {
  justify-content: space-between;
  align-items: flex-start;
  padding: 9px 10px;
  border-radius: 12px;
  background: rgba(248, 250, 253, 0.92);
}

.storage-backup-preview-main {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.storage-backup-preview-row strong,
.storage-backup-preview-row span {
  display: block;
}

.storage-backup-preview-size {
  flex: 0 0 auto;
  text-align: right;
  white-space: nowrap;
}

.storage-backup-preview-row span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.admin-status-banner {
  position: fixed;
  right: clamp(16px, 3vw, 32px);
  bottom: 22px;
  z-index: 1200;
  width: min(520px, calc(100vw - 32px));
  margin: 0;
  padding: 14px 18px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: #ffffff;
  box-shadow: var(--shadow);
  pointer-events: none;
}

.admin-status-banner.tone-success {
  border-color: rgba(90, 147, 98, 0.2);
  background: #f5fbf6;
}

.admin-status-banner.tone-warning {
  border-color: rgba(201, 137, 47, 0.24);
  background: #fff8ef;
}

.admin-status-banner.tone-danger {
  border-color: rgba(197, 92, 92, 0.22);
  background: #fff5f5;
}

.admin-panels {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(280px, 330px) minmax(0, 1fr) minmax(350px, 413px);
  gap: 1px;
  background: var(--line);
}

.admin-panel {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  position: relative;
  background: var(--panel-bg);
}

.admin-panel-explorer,
.admin-panel-detail {
  background: var(--panel-soft);
}

.admin-panels.is-settings-layout .admin-panel-canvas,
.admin-panels.is-settings-layout .admin-panel-detail {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: hidden;
}

.admin-panels.is-settings-layout .admin-panel-detail {
  overflow: visible;
}

.admin-panels.is-users-layout .admin-panel-explorer {
  grid-column: 1 / span 2;
}

.admin-panels.is-users-layout .admin-panel-canvas {
  display: none;
}

.admin-panels.is-users-layout .admin-panel-detail {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: visible;
}

.admin-panels.is-inbox-layout {
  grid-template-columns: clamp(320px, var(--inbox-explorer-panel-width, 360px), 520px) minmax(0, 1fr) minmax(350px, 413px);
}

.admin-panels.is-inbox-layout .admin-panel-detail {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: visible;
}

.admin-panels.is-inbox-layout .admin-panel-explorer::after {
  content: "";
  position: absolute;
  top: 16px;
  right: 0;
  bottom: 16px;
  width: 14px;
  border-right: 1px solid rgba(150, 92, 255, 0.16);
  background: linear-gradient(90deg, transparent 0 42%, rgba(150, 92, 255, 0.12) 42% 58%, transparent 58% 100%);
  opacity: 0.96;
  pointer-events: none;
  transition: border-color 160ms ease, background 160ms ease, opacity 160ms ease;
}

.admin-panels.is-inbox-layout .admin-panel-explorer[data-resize-ready="true"]::after,
.admin-panels.is-inbox-layout.is-inbox-resizing .admin-panel-explorer::after {
  border-right-color: rgba(225, 29, 72, 0.26);
  background: linear-gradient(90deg, transparent 0 38%, rgba(225, 29, 72, 0.2) 38% 62%, transparent 62% 100%);
}

.admin-panels.is-inbox-explorer-collapsed .admin-panel-explorer::after {
  display: none;
}

.panel-stack,
.panel-section {
  display: grid;
  gap: 16px;
}

.panel-stack {
  padding: 22px;
}

.panel-section {
  padding: 22px 24px;
}

.workspace-collapse-shell {
  position: relative;
}

.users-workspace-collapse-shell {
  --explorer-width: clamp(280px, 26vw, 330px);
}

.users-workspace-collapse-shell.is-collapsed {
  --explorer-width: 74px;
}

.media-workspace-collapse-shell {
  --explorer-width: clamp(280px, 24vw, 320px);
}

.media-workspace-collapse-shell.is-compact {
  --explorer-width: 88px;
}

.media-workspace-collapse-shell.is-hidden {
  --explorer-width: 0px;
}

.workspace-collapse-shell.is-collapsed:not(.is-compact) {
  --explorer-width: 0px;
}

.workspace-collapse-toggle {
  width: 34px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.96);
  color: var(--accent-strong);
  box-shadow: var(--shadow);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.workspace-collapse-toggle:hover {
  transform: translateY(-50%) scale(1.02);
}

.workspace-collapse-toggle--edge {
  position: absolute;
  top: 50%;
  left: calc(var(--explorer-width, 300px) - 17px);
  z-index: 4;
  transform: translateY(-50%);
}

.workspace-collapse-shell.is-collapsed:not(.is-compact) .workspace-collapse-toggle--edge {
  left: 12px;
}

.media-workspace-collapse-shell.is-compact .workspace-collapse-toggle--edge {
  left: calc(var(--explorer-width, 88px) - 17px);
}

.media-workspace-collapse-shell.is-hidden .workspace-collapse-toggle--edge {
  left: 12px;
}

.workspace-collapse-toggle span {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
}

.panel-heading,
.section-title {
  margin: 0;
  font-size: 1.25rem;
}

.panel-note,
.section-note,
.muted-copy {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.chip-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.admin-info-pill-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(158px, 1fr));
  gap: 10px;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}

.admin-info-pill-grid.is-compact {
  grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
  gap: 8px;
}

.settings-platform-summary-rows {
  display: grid;
  gap: 10px;
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 8px;
  overscroll-behavior-inline: contain;
  scrollbar-color: #b9bab8 rgba(250, 250, 247, 0.96);
  scrollbar-gutter: stable;
  scrollbar-width: thin;
}

.settings-platform-summary-rows::-webkit-scrollbar {
  height: 12px;
}

.settings-platform-summary-rows::-webkit-scrollbar-track {
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255, 255, 253, 0.96), rgba(239, 240, 237, 0.9));
}

.settings-platform-summary-rows::-webkit-scrollbar-thumb {
  border: 2px solid rgba(250, 250, 247, 0.96);
  border-radius: 999px;
  background: linear-gradient(90deg, #b8b9b6, #f7f7f3, #c6c7c3);
}

.settings-platform-summary-row-shell {
  display: grid;
  grid-template-columns: minmax(92px, 128px) max-content;
  gap: 10px;
  align-items: stretch;
  width: max-content;
  min-width: 100%;
}

.settings-platform-summary-row-label {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid rgba(220, 226, 234, 0.88);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(250, 252, 254, 0.96), rgba(241, 245, 249, 0.86));
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  position: sticky;
  left: 0;
  z-index: 2;
}

.settings-platform-summary-row {
  grid-template-columns: none;
  grid-auto-flow: column;
  grid-auto-columns: minmax(148px, 210px);
  width: max-content;
  overflow: visible;
  padding-bottom: 0;
}

@media (max-width: 760px) {
  .settings-platform-summary-row-shell {
    grid-template-columns: minmax(96px, 128px) max-content;
  }

  .settings-platform-summary-row-label {
    justify-content: center;
  }
}

.website-visits-page { display: grid; gap: 18px; min-width: 0; }
.website-visits-heading { align-items: flex-start; gap: 12px; }
.website-visits-heading .section-note { max-width: 760px; }
.website-visits-filters { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.website-visits-filters > span { margin-left: auto; color: var(--text-muted, #9baac5); font-size: 12px; }
.website-visits-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.website-visits-metric { display: grid; align-content: start; gap: 5px; min-width: 0; }
.website-visits-metric > span { color: var(--text-muted, #9baac5); font-size: 12px; }
.website-visits-metric > strong { font-size: clamp(22px, 2.5vw, 31px); line-height: 1.1; font-variant-numeric: tabular-nums; }
.website-visits-metric > small { color: var(--text-muted, #9baac5); line-height: 1.4; }
.website-visits-note { padding: 10px 13px; border: 1px solid rgba(121,153,215,.25); border-radius: 11px; color: #c7d7ee; background: rgba(83,112,170,.11); font-size: 12px; line-height: 1.5; }
.website-visits-grid { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(230px, .85fr); gap: 14px; min-width: 0; }
.website-visits-table-card, .website-visits-side, .website-visits-side > article { min-width: 0; }
.website-visits-side { display: grid; gap: 14px; align-content: start; }
.website-visits-side .section-title { margin-bottom: 12px; }
.website-visits-table-wrap { overflow: auto; max-height: 620px; margin-top: 12px; }
.website-visits-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.website-visits-table th, .website-visits-table td { padding: 10px 8px; border-bottom: 1px solid rgba(145,170,211,.14); text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.website-visits-table th:first-child, .website-visits-table td:first-child { text-align: left; }
.website-visits-table th { position: sticky; top: 0; z-index: 1; background: #101b30; color: #aebfdb; }
.website-visits-page-link { border: 0; background: transparent; color: #9bc7ff; cursor: pointer; padding: 2px 0; text-align: left; font: inherit; }
.website-visits-page-link:hover, .website-visits-page-link:focus-visible { text-decoration: underline; }
.website-visits-list-row { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid rgba(145,170,211,.12); font-size: 13px; }
.website-visits-list-row > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.website-visits-list-row > strong { font-variant-numeric: tabular-nums; }
.website-visits-detail { min-width: 0; }
.website-visits-detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.website-visits-detail-grid h4, .website-visits-user-detail h4 { margin: 8px 0; font-size: 13px; }
.website-visits-users { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.website-visits-user { display: flex; justify-content: space-between; gap: 12px; align-items: center; text-align: left; min-width: 0; border: 1px solid rgba(145,170,211,.22); border-radius: 10px; background: rgba(83,112,170,.1); color: inherit; padding: 10px 12px; cursor: pointer; }
.website-visits-user.is-active { border-color: #80b9ff; background: rgba(96,146,225,.2); }
.website-visits-user span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.website-visits-user small { display: block; color: #9eb0cc; overflow: hidden; text-overflow: ellipsis; }
.website-visits-user strong { flex: none; font-size: 12px; }
.website-visits-user-detail { margin-top: 16px; }
body:not([data-admin-theme="dark"]) .website-visits-note { color: #33476a; background: #f2f6fd; }
body:not([data-admin-theme="dark"]) .website-visits-page-link { color: #164ea8; }
body:not([data-admin-theme="dark"]) .website-visits-user small { color: #5d6c86; }
body:not([data-admin-theme="dark"]) .website-visits-table th { background: #e7eef9; color: #35476a; }
@media (max-width: 1100px) { .website-visits-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .website-visits-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .website-visits-grid, .website-visits-users { grid-template-columns: 1fr; } .website-visits-filters > span { margin-left: 0; width: 100%; } }
@media (max-width: 440px) { .website-visits-metrics, .website-visits-detail-grid { grid-template-columns: 1fr; } .website-visits-heading { flex-wrap: wrap; } }

.admin-info-pill-card,
.media-inspector-setting-chip {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid rgba(220, 226, 234, 0.88);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  align-content: start;
}

.admin-info-pill-label,
.media-inspector-setting-chip > span {
  min-width: 0;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  line-height: 1.15;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.admin-info-pill-card .pill,
.media-inspector-setting-chip .pill {
  width: 100%;
  min-width: 0;
  justify-content: center;
  white-space: normal;
  text-align: center;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.admin-info-pill-download-button {
  border: 0;
  cursor: pointer;
  font: inherit;
  box-shadow: inset 0 0 0 1px rgba(124, 92, 255, 0.08);
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.admin-info-pill-download-button:hover,
.admin-info-pill-download-button:focus-visible {
  box-shadow: inset 0 0 0 1px rgba(124, 92, 255, 0.25), 0 10px 22px rgba(124, 92, 255, 0.16);
  transform: translateY(-1px);
}

.settings-visual-summary-grid {
  --settings-visual-summary-card-height: 102px;
  grid-template-columns: minmax(136px, 0.85fr) minmax(136px, 0.85fr) repeat(5, minmax(136px, 1fr));
  grid-auto-flow: row dense;
  max-height: calc((var(--settings-visual-summary-card-height) * 3) + 16px);
  padding-right: 6px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  align-content: start;
}

.settings-visual-summary-grid .admin-info-pill-card {
  min-height: var(--settings-visual-summary-card-height);
}

.settings-visual-summary-grid .admin-info-pill-card.is-status-on {
  grid-column: 1;
  border-color: rgba(31, 184, 127, 0.18);
  background: linear-gradient(180deg, rgba(238, 255, 248, 0.94), rgba(230, 250, 243, 0.82));
}

.settings-visual-summary-grid .admin-info-pill-card.is-status-off {
  grid-column: 2;
  border-color: rgba(172, 184, 202, 0.22);
  background: linear-gradient(180deg, rgba(249, 251, 253, 0.96), rgba(239, 244, 249, 0.86));
}

.settings-visual-summary-grid .admin-info-pill-card.is-auto-value {
  border-color: rgba(74, 143, 255, 0.16);
  background: linear-gradient(180deg, rgba(242, 248, 255, 0.96), rgba(232, 242, 255, 0.82));
}

.settings-visual-summary-grid .admin-info-pill-card.is-data-value {
  border-color: rgba(126, 108, 242, 0.14);
  background: linear-gradient(180deg, rgba(249, 246, 255, 0.96), rgba(241, 236, 255, 0.8));
}

.settings-visual-summary-grid .admin-info-pill-card.is-muted-value {
  border-color: rgba(172, 184, 202, 0.18);
  background: linear-gradient(180deg, rgba(250, 252, 254, 0.96), rgba(241, 245, 249, 0.82));
}

@media (max-width: 1280px) {
  .settings-visual-summary-grid {
    grid-template-columns: repeat(auto-fit, minmax(136px, 1fr));
  }

  .settings-visual-summary-grid .admin-info-pill-card.is-status-on,
  .settings-visual-summary-grid .admin-info-pill-card.is-status-off {
    grid-column: auto;
  }
}

.admin-info-pill-detail {
  min-width: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

.chip {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--muted);
}

.chip.is-active {
  border-color: rgba(75, 125, 240, 0.26);
  background: var(--blue-soft);
  color: var(--blue);
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 16px;
}

.metric-card,
.section-card,
.detail-card,
.list-card,
.toggle-card,
.message-card {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: var(--shadow);
}

.metric-card {
  padding: 18px;
  display: grid;
  gap: 8px;
  min-width: 0;
}

.metric-label {
  color: var(--muted);
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.metric-value {
  font-size: clamp(1.4rem, 2vw, 1.8rem);
  font-weight: 800;
  line-height: 1.05;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.metric-card-cost-split .metric-value-row {
  width: 100%;
}

.metric-currency-split {
  width: 100%;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 18px;
}

.metric-currency-symbol {
  color: var(--muted);
  font-weight: 400;
}

.metric-currency-amount {
  color: var(--text);
  font-weight: 800;
  text-align: right;
}

.metric-value-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.metric-status-indicator {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  border-radius: 999px;
  box-shadow: 0 0 0 4px rgba(43, 54, 69, 0.06);
}

.metric-status-indicator.tone-green {
  background: #39d98a;
  box-shadow:
    0 0 0 4px rgba(57, 217, 138, 0.14),
    0 0 18px rgba(57, 217, 138, 0.22);
}

.metric-status-indicator.tone-red {
  background: #ff6b6b;
  box-shadow:
    0 0 0 4px rgba(255, 107, 107, 0.14),
    0 0 18px rgba(255, 107, 107, 0.22);
}

.metric-status-indicator.tone-orange {
  background: #ffb347;
  box-shadow:
    0 0 0 4px rgba(255, 179, 71, 0.14),
    0 0 18px rgba(255, 179, 71, 0.2);
}

.metric-status-indicator.tone-muted {
  background: #a8b0c2;
  box-shadow:
    0 0 0 4px rgba(143, 154, 179, 0.14),
    0 0 18px rgba(143, 154, 179, 0.16);
}

.metric-meta {
  color: var(--muted);
  font-size: 0.9rem;
}

.metric-change {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid rgba(138, 151, 173, 0.18);
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.25;
}

.metric-change small {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.metric-change.is-up {
  color: #168a55;
}

.metric-change.is-down {
  color: #c64242;
}

.metric-change.is-flat,
.metric-change.is-muted {
  color: var(--muted);
}

.section-card,
.detail-card,
.toggle-card,
.message-card {
  padding: 18px;
  display: grid;
  gap: 16px;
}

.split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.users-directory-head {
  display: grid;
  gap: 10px;
}

.users-workspace-tabs {
  width: fit-content;
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 6px;
  margin-bottom: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(248, 246, 255, 0.86);
}

.users-workspace-tab {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  letter-spacing: 0;
}

.users-workspace-tab:hover,
.users-workspace-tab:focus-visible {
  color: var(--primary);
  border-color: rgba(124, 100, 255, 0.18);
  background: #ffffff;
}

.users-workspace-tab.is-active {
  color: #4d2bd0;
  border-color: rgba(124, 100, 255, 0.28);
  background: linear-gradient(135deg, #efe9ff, #fbf9ff);
  box-shadow: 0 12px 26px rgba(124, 100, 255, 0.18);
}

.users-workspace-tab-count {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  white-space: nowrap;
}

.users-workspace-tab.is-active .users-workspace-tab-count {
  color: #ffffff;
  background: #6f54e8;
  box-shadow: 0 6px 14px rgba(111, 84, 232, 0.22);
}

.users-tab-panel {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.users-tab-panel .users-limits-panel {
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: 0;
}

.users-limits-panel {
  display: grid;
  gap: 16px;
  padding-bottom: 22px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--line);
}

.users-limits-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

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

.users-limits-selected-user {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding-top: 20px;
  border-top: 1px solid var(--line);
}

.users-limits-selected-user-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
}

.users-limits-selected-user-head > div:first-child {
  min-width: 0;
}

.users-limits-tools-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  min-width: 0;
}

.users-limits-tool {
  min-width: 0;
}

.users-limits-tool.is-wide {
  grid-column: 1 / -1;
}

.users-detail-card.is-users-limits-card {
  width: 100%;
  height: 100%;
  min-width: 0;
}

.users-detail-card.is-users-limits-card.user-screen-name-card {
  padding: 22px;
}

.users-detail-card.is-users-limits-card.user-screen-name-card input:not([type="checkbox"]),
.users-detail-card.is-users-limits-card.user-screen-name-card select {
  width: 100%;
}

.users-detail-card.is-users-limits-card.user-screen-name-card .user-action-row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.users-detail-card.is-users-limits-card.user-screen-name-card .screen-name-stat-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.users-detail-card.is-users-limits-card.user-screen-name-card .settings-grid.two {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.users-detail-card.is-users-limits-card.users-holdings-card .users-holdings-stack {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.users-limit-card {
  min-width: 0;
  align-content: start;
}

.users-limit-card .settings-studio-limit-actions {
  justify-content: flex-end;
}

@media (max-width: 1480px) {
  .users-split-layout.is-tools-active {
    grid-template-columns: minmax(0, 1fr);
  }

  .users-detail-card.is-users-limits-card .users-detail-card-head {
    grid-template-columns: minmax(0, 1fr);
  }

  .users-detail-card.is-users-limits-card .users-detail-card-tools {
    justify-content: flex-start;
  }

  .users-limits-grid,
  .users-limits-tools-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .users-limits-tool.is-wide {
    grid-column: auto;
  }

  .users-detail-card.is-users-limits-card.user-screen-name-card .user-action-row,
  .users-detail-card.is-users-limits-card.user-screen-name-card .screen-name-stat-grid,
  .users-detail-card.is-users-limits-card.user-screen-name-card .settings-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .users-limit-card .settings-studio-limit-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 760px) {
  .users-limits-selected-user-head {
    align-items: stretch;
    flex-direction: column;
  }

  .users-detail-card.is-users-limits-card.user-screen-name-card .user-action-row,
  .users-detail-card.is-users-limits-card.user-screen-name-card .screen-name-stat-grid,
  .users-detail-card.is-users-limits-card.user-screen-name-card .settings-grid.two,
  .users-detail-card.is-users-limits-card.users-holdings-card .users-holdings-stack {
    grid-template-columns: minmax(0, 1fr);
  }
}

.users-directory-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.users-directory-segment-pills {
  align-items: center;
}

.users-export-menu {
  position: relative;
  justify-self: end;
}

.users-export-menu summary {
  list-style: none;
}

.users-export-menu summary::-webkit-details-marker {
  display: none;
}

.users-export-trigger {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #ffffff;
  color: var(--text);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
  cursor: pointer;
  font-weight: 800;
}

.users-export-trigger-icon,
.users-export-option-icon {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border-radius: 8px;
  color: var(--primary);
  background: rgba(124, 100, 255, 0.10);
  font-size: 0.72rem;
  font-weight: 900;
}

.users-export-trigger-icon svg {
  width: 16px;
  height: 16px;
}

.users-export-count {
  min-width: 24px;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(88, 211, 167, 0.16);
  color: #157852;
  font-size: 0.74rem;
  text-align: center;
}

.users-export-options {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 40;
  min-width: 160px;
  display: grid;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #ffffff;
  box-shadow: var(--shadow);
}

.users-export-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
  text-align: left;
}

.users-export-option:hover {
  background: rgba(124, 100, 255, 0.09);
}

.users-inline-search {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.users-inline-search .admin-search-shell {
  min-width: 0;
  flex: 1 1 420px;
}

.user-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.user-action-stack,
.user-action-row {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
}

.user-action-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.user-action-grid .admin-button,
.user-action-row .admin-button {
  width: 100%;
}

.admin-button.user-unlock-button {
  background: #eef2f1;
  color: #4d5d58;
  border-color: #d7e0dd;
}

.admin-button.user-unlock-button:not(:disabled):hover {
  background: #e5ece9;
  border-color: #c9d5d1;
  color: #34443e;
}

.admin-button.user-unlock-button:disabled {
  opacity: 1;
  cursor: not-allowed;
  background: #eef1f5;
  color: #9aa4b2;
  border-color: #dfe5ec;
}

.users-detail-shell {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: visible;
}

.users-detail-stack {
  grid-row: 1;
  grid-column: 1;
  min-width: 0;
  min-height: 0;
  align-content: start;
  overflow: auto;
  transition:
    opacity 160ms ease,
    visibility 160ms ease,
    transform 160ms ease;
}

.users-detail-card {
  min-width: 0;
}

.users-detail-card[data-user-detail-collapsed="1"] {
  gap: 0;
}

.users-detail-card[data-user-detail-collapsed="1"] > .users-detail-card-body {
  display: none;
}

.users-detail-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  min-width: 0;
}

.users-detail-card-tools {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}

.users-detail-pin-control {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.72);
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.users-detail-pin-control input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--purple);
  cursor: pointer;
}

.users-detail-pin-control:has(input:checked) {
  border-color: rgba(118, 83, 255, 0.4);
  background: rgba(118, 83, 255, 0.1);
  color: var(--purple);
}

.admin-app[data-theme="dark"] .users-detail-pin-control {
  border-color: rgba(143, 154, 179, 0.24);
  background: #0f1622;
  color: #c8d0df;
}

.admin-app[data-theme="dark"] .users-detail-pin-control:has(input:checked) {
  border-color: rgba(176, 147, 255, 0.46);
  background: rgba(118, 83, 255, 0.2);
  color: #e6dcff;
}

.admin-app[data-theme="dark"] .user-screen-name-card input:not([type="checkbox"]) {
  border-color: var(--line);
  background: #0f1622;
  color: var(--text);
}

.users-detail-card-heading {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.users-detail-card-heading .section-title {
  margin: 0;
  line-height: 1.15;
}

.users-detail-card-heading .detail-meta {
  margin: 0;
  line-height: 1.32;
}

.users-detail-card-badge {
  min-width: 0;
  display: inline-flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.users-detail-card-badge .pill {
  max-width: 180px;
  white-space: normal;
  text-align: center;
  line-height: 1.15;
}

.users-detail-card-body {
  display: grid;
  gap: inherit;
  min-width: 0;
}

.users-detail-collapse-toggle {
  margin-left: 0;
}

.user-screen-name-card {
  gap: 18px;
}

.user-screen-name-selected-form,
.user-screen-name-settings-form {
  display: grid;
  gap: 12px;
}

.screen-name-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.screen-name-chip-row .admin-button.compact {
  min-height: 36px;
  padding: 0 12px;
  font-size: 0.82rem;
}

.screen-name-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.screen-name-stat-grid .metric-card.compact {
  min-height: 0;
  padding: 16px;
}

.screen-name-stat-grid .metric-value {
  display: block;
  font-size: 1.2rem;
}

.screen-name-stat-grid .metric-label {
  display: block;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  text-transform: uppercase;
}

.user-screen-name-card .settings-grid.two {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.user-screen-name-card .toggle-line {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-weight: 800;
}

.user-screen-name-card input:not([type="checkbox"]) {
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text);
  font: inherit;
  font-weight: 800;
}

.credit-grant-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.credit-grant-card {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.78);
}

.credit-grant-title {
  font-weight: 800;
  letter-spacing: 0.01em;
}

.credit-grant-copy {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.5;
}

.credit-grant-input {
  min-height: 48px;
  padding: 0 14px;
  font: inherit;
  font-weight: 700;
}

.credit-grant-select {
  min-height: 48px;
}

.credit-grant-summary-card {
  gap: 8px;
}

.credit-grant-note {
  min-height: 120px;
  padding: 14px 16px;
  resize: vertical;
}

.users-workspace {
  padding: 22px;
  display: grid;
  gap: 18px;
}

.memberships-workspace {
  display: grid;
  gap: 22px;
}

.system-workspace {
  display: grid;
  gap: 22px;
}

.system-summary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.system-summary-grid.system-pager-summary-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
}

.system-summary-grid.system-core-summary-grid.is-three-telemetry-row {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.system-core-summary-grid.is-three-telemetry-row .system-visual-card {
  grid-column: span 3;
}

.system-core-summary-grid.is-three-telemetry-row .system-visual-card.is-telemetry-system-card {
  grid-column: span 2;
}

.system-pager-summary-grid .metric-card {
  min-height: 152px;
  align-content: space-between;
}

.system-pager-summary-grid .metric-value {
  font-size: clamp(1.45rem, 2.1vw, 2rem);
}

.system-pager-summary-grid .metric-meta {
  line-height: 1.35;
}

.system-summary-grid.system-email-summary-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

.system-email-summary-grid .metric-card {
  min-height: 118px;
  padding: 16px;
  align-content: space-between;
}

.system-email-summary-grid .metric-value {
  font-size: clamp(1.2rem, 1.45vw, 1.55rem);
}

.system-email-summary-grid .metric-meta {
  font-size: 0.84rem;
  line-height: 1.35;
}

.system-certificate-section {
  gap: 16px;
}

.system-certificate-control-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}

.system-certificate-control-grid .metric-card {
  min-height: 118px;
  padding: 16px;
  align-content: space-between;
}

.system-certificate-control-grid .metric-value {
  font-size: clamp(1.15rem, 1.45vw, 1.55rem);
}

.system-certificate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}

.system-certificate-card {
  min-width: 0;
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 14px 32px rgba(37, 28, 68, 0.08);
}

.system-certificate-card.tone-green {
  border-color: rgba(57, 217, 138, 0.24);
}

.system-certificate-card.tone-orange {
  border-color: rgba(255, 179, 71, 0.28);
}

.system-certificate-card.tone-red {
  border-color: rgba(255, 107, 107, 0.28);
}

.system-certificate-card.tone-muted {
  border-color: rgba(143, 154, 179, 0.24);
}

.system-certificate-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.system-certificate-card .metric-value {
  font-size: clamp(1.2rem, 1.7vw, 1.75rem);
}

.system-certificate-host-list {
  display: grid;
  gap: 9px;
}

.system-certificate-host-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0 0;
  border-top: 1px solid rgba(143, 154, 179, 0.16);
  min-width: 0;
}

.system-certificate-host-name {
  color: var(--text);
  font-weight: 800;
  overflow-wrap: anywhere;
}

.system-certificate-fingerprint {
  max-width: 100%;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(143, 154, 179, 0.10);
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  font-size: 0.72rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.system-certificate-note-list {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 14px;
  background: rgba(143, 154, 179, 0.08);
}
.system-visual-card {
  --system-color: #a67cff;
  --system-accent-start: #8f68ff;
  --system-accent-end: #bd6dff;
  grid-template-columns: minmax(0, 1.08fr) minmax(210px, 0.92fr);
  grid-template-areas:
    "label visual"
    "value visual"
    "meta visual";
  column-gap: 22px;
  row-gap: 8px;
  align-content: center;
  align-items: center;
  background:
    radial-gradient(circle at top left, rgba(166, 124, 255, 0.42), transparent 34%),
    radial-gradient(circle at bottom right, rgba(94, 62, 172, 0.52), transparent 42%),
    linear-gradient(135deg, #111827 0%, #18162d 46%, #352761 100%);
  border-color: rgba(164, 132, 255, 0.28);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 18px 38px rgba(34, 22, 69, 0.34);
  color: #edf4ff;
  min-height: 154px;
}

.system-visual-card .metric-label {
  grid-area: label;
  color: rgba(210, 220, 236, 0.72);
}

.system-visual-card .metric-value-row {
  grid-area: value;
}

.system-visual-card .metric-value {
  color: #f4f8ff;
  font-size: clamp(1.7rem, 2.6vw, 2.45rem);
}

.system-visual-card.is-unknown .metric-value {
  font-size: clamp(1.45rem, 2.2vw, 2.1rem);
}

.system-visual-card .metric-meta {
  grid-area: meta;
  color: rgba(210, 220, 236, 0.74);
  max-width: 34ch;
  line-height: 1.45;
}

.system-visual-card.tone-green {
  --system-color: #a67cff;
  --system-accent-start: #8f68ff;
  --system-accent-end: #bd6dff;
}

.system-visual-card.tone-orange {
  --system-color: #d9851f;
  --system-accent-start: #d9851f;
  --system-accent-end: #ffb14a;
}

.system-visual-card.tone-red {
  --system-color: #dc4c54;
  --system-accent-start: #dc4c54;
  --system-accent-end: #ff7680;
}

.system-visual-card.tone-purple {
  --system-color: #7c64ff;
  --system-accent-start: #7c5cff;
  --system-accent-end: #b164ff;
}

.system-visual-card.is-unknown {
  --system-color: #8f9ab3;
}

.system-visual-footer {
  grid-area: visual;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.system-visual-ring {
  position: relative;
  flex: 0 0 64px;
  width: 64px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background:
    conic-gradient(var(--system-accent-end) calc(var(--system-percent, 0) * 1%), rgba(143, 154, 179, 0.2) 0);
  box-shadow:
    0 12px 26px rgba(124, 92, 255, 0.28),
    0 0 20px rgba(189, 109, 255, 0.22);
}

.system-visual-ring::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: inherit;
  background: #f7f9fc;
}

.system-visual-ring span {
  position: relative;
  z-index: 1;
  color: #283344;
  font-size: 0.68rem;
  font-weight: 900;
  line-height: 1;
}

.system-visual-bar {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  gap: 6px;
}

.system-visual-bar-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  color: rgba(210, 220, 236, 0.7);
  font-size: 0.76rem;
  font-weight: 800;
}

.system-visual-bar-head strong {
  color: #f4f8ff;
  font-size: 0.78rem;
  white-space: nowrap;
}

.system-visual-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(210, 220, 236, 0.16);
}

.system-visual-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--system-accent-start), var(--system-accent-end));
  box-shadow: 0 0 18px rgba(177, 100, 255, 0.32);
}

.system-memory-mini-card {
  overflow: hidden;
}

.system-memory-mini-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
}

.system-memory-mini-copy {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.system-mini-memory-ring-card {
  --system-mini-memory-color: #4b7df0;
  display: grid;
  justify-items: center;
  gap: 5px;
  min-width: 70px;
  color: var(--muted);
}

.system-mini-memory-ring-card.is-green {
  --system-mini-memory-color: #1aa46f;
}

.system-mini-memory-ring-card.is-orange {
  --system-mini-memory-color: #d9851f;
}

.system-mini-memory-ring-card.is-red {
  --system-mini-memory-color: #dc4c54;
}

.system-mini-memory-ring-card.is-purple {
  --system-mini-memory-color: #7c64ff;
}

.system-mini-memory-ring {
  position: relative;
  width: 58px;
  aspect-ratio: 1;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background:
    conic-gradient(
      var(--system-mini-memory-color) calc(var(--system-mini-memory-percent, 0) * 1%),
      rgba(142, 153, 178, 0.18) 0
    );
  box-shadow: 0 10px 18px rgba(35, 45, 67, 0.1);
}

.system-mini-memory-ring::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: inherit;
  background: #ffffff;
}

.system-mini-memory-ring span {
  position: relative;
  z-index: 1;
  color: var(--text);
  font-size: 0.66rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}

.system-mini-memory-ring-label {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.system-connection-table,
.system-note-list {
  display: grid;
  gap: 12px;
}

.system-connection-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.82);
}

.system-connection-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.system-address {
  font-weight: 700;
  color: var(--text);
  word-break: break-word;
}

.system-connection-value {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.system-scroll-card .scroll-region {
  max-height: 420px;
}

.membership-hero-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}

.membership-hero-card {
  border-radius: 24px;
  padding: 18px 20px;
  color: #ffffff;
  display: grid;
  gap: 12px;
  box-shadow: 0 22px 44px rgba(41, 56, 92, 0.18);
}

.membership-hero-card.is-indigo {
  background: linear-gradient(135deg, #2a4dff, #4f7cff);
}

.membership-hero-card.is-magenta {
  background: linear-gradient(135deg, #ff2e8d, #ff6482);
}

.membership-hero-card.is-cyan {
  background: linear-gradient(135deg, #27c4df, #3f8cff);
}

.membership-hero-card.is-sunrise {
  background: linear-gradient(135deg, #ffb37b, #ff7f98);
}

.membership-hero-card.is-emerald {
  background: linear-gradient(135deg, #0d9f79, #35c99d);
}

.membership-hero-card-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.membership-hero-icon {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.16);
}

.membership-hero-action {
  padding: 0;
  border: 0;
  color: inherit;
  cursor: pointer;
  appearance: none;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.membership-hero-action:hover,
.membership-hero-action:focus-visible {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.24);
  box-shadow: 0 10px 22px rgba(34, 28, 62, 0.16);
}

.membership-hero-action:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.82);
  outline-offset: 2px;
}

.membership-hero-icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.membership-hero-label {
  font-size: 0.85rem;
  font-weight: 700;
  opacity: 0.9;
}

.membership-hero-value {
  font-size: clamp(2rem, 2.6vw, 2.5rem);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1;
}

.membership-hero-meta {
  font-size: 0.92rem;
  line-height: 1.45;
  opacity: 0.92;
}

.membership-insight-actions {
  margin-top: 6px;
}

.membership-chart-card {
  gap: 16px;
}

.membership-chart-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.membership-chart-mode-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.membership-chart-body {
  min-width: 0;
}

.membership-table-card {
  gap: 18px;
  padding: 24px;
}

.memberships-toolbar {
  align-items: center;
}

.memberships-control-stack {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 12px 24px;
}

.memberships-chip-row {
  align-items: center;
  flex: 0 1 auto;
}

.memberships-chip-label {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  min-width: 52px;
  padding-right: 4px;
}

.membership-tier-filter-label {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.membership-tier-info {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.membership-tier-info-button {
  width: 21px;
  height: 21px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(143, 154, 179, 0.28);
  border-radius: 999px;
  background: rgba(143, 124, 255, 0.12);
  color: var(--accent-strong);
  cursor: help;
  font: inherit;
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1;
}

.membership-tier-info-button:hover,
.membership-tier-info-button:focus-visible {
  background: rgba(143, 124, 255, 0.2);
  outline: 2px solid rgba(143, 124, 255, 0.26);
  outline-offset: 2px;
}

.membership-tier-info-popover {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  z-index: 40;
  width: min(430px, calc(100vw - 56px));
  display: grid;
  gap: 0;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: var(--panel-bg);
  box-shadow: 0 20px 46px rgba(29, 35, 56, 0.18);
  color: var(--text);
  opacity: 0;
  pointer-events: none;
  text-align: left;
  text-transform: none;
  letter-spacing: 0;
  transform: translateY(-4px);
  transition: opacity 140ms ease, transform 140ms ease;
}

.membership-tier-info:hover .membership-tier-info-popover,
.membership-tier-info:focus-within .membership-tier-info-popover {
  opacity: 1;
  transform: translateY(0);
}

.membership-tier-info-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 12px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(143, 154, 179, 0.16);
  font-size: 0.84rem;
  line-height: 1.35;
}

.membership-tier-info-row:last-child {
  border-bottom: 0;
}

.membership-tier-info-row strong {
  color: var(--text);
  font-weight: 900;
}

.membership-tier-info-row span {
  color: var(--muted);
}
.memberships-page-size-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.memberships-page-size-control .admin-select {
  min-width: 104px;
}

.memberships-table-shell {
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--panel-bg);
  overflow: hidden;
}

.memberships-table th,
.memberships-table td {
  vertical-align: middle;
}

.memberships-table {
  min-width: 1560px;
}

.memberships-table th:last-child,
.memberships-table td:last-child {
  width: 1%;
  white-space: nowrap;
}

.membership-plan-name {
  font-weight: 700;
  color: var(--text);
}

.membership-plan-note {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

@media (max-width: 860px) {
  .memberships-chip-label {
    width: 100%;
    min-width: 100%;
    padding-right: 0;
  }
}

.membership-open-button {
  min-width: 92px;
}

.membership-action-group {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: nowrap;
  margin-left: auto;
  min-width: max-content;
}

.membership-cancel-button {
  min-width: 168px;
}

.dashboard-feed-card,
.storage-scroll-card,
.storage-table-card,
.settings-audit-log-card {
  align-content: start;
  min-height: 0;
}

.settings-audit-toolbar {
  display: grid;
  gap: 16px;
  margin-bottom: 18px;
}

.settings-audit-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.settings-audit-header-actions .users-export-menu {
  justify-self: auto;
}

.settings-canvas-header .settings-audit-toolbar {
  margin-top: 18px;
  margin-bottom: 0;
}

.settings-audit-search {
  align-items: stretch;
  display: grid;
  gap: 14px;
}

.settings-audit-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 12px;
  align-items: center;
}

.settings-audit-search-row .admin-search-shell {
  min-width: 0;
}

.settings-audit-range-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.settings-audit-inline-field {
  display: grid;
  grid-template-columns: auto minmax(150px, 220px);
  gap: 10px;
  align-items: center;
}

.settings-audit-date-field {
  grid-template-columns: auto minmax(190px, 260px);
}

.settings-audit-filter-bar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.settings-audit-control-group {
  display: grid;
  gap: 8px;
}

.settings-audit-control-label {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.storage-summary-grid,
.media-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.media-summary-card {
  align-content: start;
  grid-template-rows: auto auto auto 1fr;
  min-height: 204px;
  padding-block: 22px;
}

.media-summary-card .metric-meta {
  min-height: 38px;
  line-height: 1.35;
}

.media-summary-breakdown {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  align-self: end;
  padding-top: 10px;
  border-top: 1px solid rgba(143, 154, 179, 0.16);
}

.media-summary-breakdown-item,
.media-engagement-summary-value {
  --media-summary-accent: #8f9ab3;
  display: grid;
  min-width: 0;
  gap: 3px;
}

.media-summary-breakdown-item::before,
.media-engagement-summary-value::before {
  content: "";
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: var(--media-summary-accent);
}

.media-summary-breakdown-item span,
.media-engagement-summary-value span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
}

.media-summary-breakdown-item strong,
.media-engagement-summary-value strong {
  color: var(--text);
  font-size: 0.94rem;
  font-variant-numeric: tabular-nums;
}

.media-summary-breakdown-item.tone-orange,
.media-engagement-summary-value.tone-orange {
  --media-summary-accent: #d9851f;
}

.media-summary-breakdown-item.tone-purple,
.media-engagement-summary-value.tone-purple {
  --media-summary-accent: #7c64ff;
}

.media-summary-breakdown-item.tone-pink,
.media-engagement-summary-value.tone-pink {
  --media-summary-accent: #e85d8a;
}

.media-summary-breakdown-item.tone-blue,
.media-engagement-summary-value.tone-blue {
  --media-summary-accent: #4b7df0;
}

.media-summary-breakdown-item.tone-green,
.media-engagement-summary-value.tone-green {
  --media-summary-accent: #1aa46f;
}

.media-engagement-summary-card {
  align-content: stretch;
  grid-template-rows: auto minmax(76px, 1fr) auto;
}

.media-engagement-summary-values {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-self: stretch;
}

.media-engagement-summary-value {
  align-content: center;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(247, 249, 255, 0.9);
}

.media-engagement-summary-value strong {
  font-size: clamp(1.25rem, 1.6vw, 1.6rem);
  line-height: 1.05;
}

.storage-toolbar,
.media-toolbar {
  align-items: center;
}

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

.storage-callout {
  display: grid;
  gap: 10px;
}

.storage-callout strong {
  color: var(--text);
}

.storage-backups-table .admin-button {
  min-height: 40px;
}

.storage-backups-table .backup-remove-button {
  min-width: 148px;
}

.storage-backups-table .backup-pending-button {
  min-width: 148px;
  opacity: 1;
  cursor: default;
}

.storage-backups-table .detail-meta.is-pending-delete {
  color: #c97821;
  font-weight: 700;
}

.storage-table-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin-bottom: 18px;
}

.storage-backup-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}

.storage-collapsible-card {
  display: grid;
  gap: 18px;
}

.storage-collapsible-card.is-collapsed {
  gap: 14px;
}

.storage-collapsible-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.storage-collapsible-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.storage-card-toggle {
  min-width: 104px;
}

.storage-compact-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.storage-compact-summary-grid > div {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(247, 249, 252, 0.72);
}

.storage-compact-summary-grid span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.storage-compact-summary-grid strong {
  min-width: 0;
  color: var(--text);
  font-size: 0.98rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.storage-backup-scheduler-card form {
  display: grid;
  gap: 18px;
}

.storage-scheduler-status-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.storage-scheduler-export-card .admin-button {
  min-height: 34px;
  margin-top: 6px;
}

.storage-scheduler-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.storage-scheduler-field {
  align-content: start;
  gap: 10px;
}

.storage-scheduler-field .admin-text-input,
.storage-scheduler-field .admin-select {
  width: 100%;
}

.storage-scheduler-toggle-row {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(240px, 0.6fr);
  gap: 14px;
}

.storage-scheduler-toggle-row.has-retention-card {
  grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(230px, 0.55fr));
}

.storage-scheduler-enable-card,
.storage-scheduler-updated-card,
.storage-scheduler-retention-card {
  min-height: 116px;
}

.storage-scheduler-updated-card,
.storage-scheduler-retention-card {
  display: grid;
  gap: 8px;
}

.storage-scheduler-retention-card.is-pending {
  border-color: rgba(124, 100, 255, 0.3);
  background: linear-gradient(145deg, rgba(124, 100, 255, 0.08), rgba(88, 196, 255, 0.04));
}

.storage-scheduler-retention-card strong {
  overflow-wrap: anywhere;
}

.storage-scheduler-retention-card .muted-copy {
  min-width: 0;
  overflow-wrap: anywhere;
}

.storage-scheduler-scopes {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.storage-scheduler-scope-card {
  align-content: start;
  min-height: 156px;
}

.storage-scheduler-scope-card.is-disabled {
  opacity: 0.68;
}

.storage-scheduler-errors {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid rgba(201, 120, 33, 0.22);
  border-radius: 8px;
  background: rgba(255, 177, 93, 0.08);
}

.storage-recovery-owner-note {
  padding: 14px 16px;
  border: 1px solid rgba(124, 100, 255, 0.2);
  border-radius: 10px;
  color: var(--muted);
  background: rgba(124, 100, 255, 0.05);
}

.storage-recovery-console {
  display: grid;
  gap: 18px;
  padding: 20px;
  border: 1px solid rgba(124, 100, 255, 0.2);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(124, 100, 255, 0.08), rgba(88, 196, 255, 0.04));
}

.storage-recovery-console.is-active {
  border-color: rgba(124, 100, 255, 0.42);
  box-shadow: 0 14px 34px rgba(84, 65, 170, 0.1);
}

.storage-recovery-console-head,
.storage-recovery-console-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.storage-recovery-console-head h3 {
  margin: 5px 0 4px;
  font-size: clamp(1.12rem, 1.7vw, 1.42rem);
}

.storage-recovery-console-head p,
.storage-recovery-console-toggle-row span {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.storage-recovery-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.storage-recovery-help {
  border: 1px solid rgba(124, 100, 255, 0.18);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.58);
}

.storage-recovery-help summary {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}

.storage-recovery-help summary::-webkit-details-marker {
  display: none;
}

.storage-recovery-help summary span {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: #6d55e8;
  font-family: Georgia, serif;
  font-size: 0.86rem;
}

.storage-recovery-help-body {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  padding: 2px 14px 14px;
  color: var(--muted);
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.storage-recovery-help-body > div,
.storage-recovery-help-body dl,
.storage-recovery-help-body dl div {
  min-width: 0;
}

.storage-recovery-help-body > p {
  grid-column: 1 / -1;
  margin: 0;
}

.storage-recovery-help-body strong,
.storage-recovery-help-body dt {
  color: var(--text);
}

.storage-recovery-help-body dl,
.storage-recovery-help-body ol {
  margin: 8px 0 0;
}

.storage-recovery-help-body dl {
  display: grid;
  gap: 9px;
}

.storage-recovery-help-body dl div {
  display: grid;
  gap: 2px;
}

.storage-recovery-help-body dd {
  margin: 0;
}

.storage-recovery-help-body li + li {
  margin-top: 5px;
}

.storage-recovery-progress-grid {
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  align-items: center;
  gap: 22px;
}

.storage-recovery-dial {
  --recovery-progress: 0;
  position: relative;
  width: 108px;
  aspect-ratio: 1;
  display: grid;
  place-content: center;
  justify-items: center;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, #fff 0 57%, transparent 58%),
    conic-gradient(#7c64ff calc(var(--recovery-progress) * 1%), rgba(124, 100, 255, 0.13) 0);
  box-shadow: inset 0 0 0 1px rgba(124, 100, 255, 0.12);
}

.storage-recovery-dial span {
  color: var(--text);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  overflow-wrap: normal;
}

.storage-recovery-dial small {
  margin-top: 5px;
  color: var(--muted);
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.storage-recovery-live-metrics {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 7px;
}

.storage-recovery-verification-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.storage-recovery-live-metrics > div,
.storage-recovery-verification-grid > div {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 12px 14px;
  border: 1px solid rgba(45, 51, 73, 0.09);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.76);
}

.storage-recovery-live-metrics > div {
  gap: 3px;
  padding: 8px 10px;
}

.storage-recovery-live-metrics span,
.storage-recovery-verification-grid span {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.storage-recovery-live-metrics strong,
.storage-recovery-verification-grid strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.storage-recovery-run-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.storage-recovery-destination-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.storage-recovery-destination-actions .admin-button {
  flex: 0 0 auto;
}

.storage-recovery-console-toggle-row {
  padding-top: 4px;
}

.storage-recovery-event-console {
  max-height: 260px;
  overflow: auto;
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 10px;
  color: #eef0ff;
  background: #171823;
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.78rem;
}

.storage-recovery-event-row {
  display: grid;
  grid-template-columns: 160px 150px minmax(0, 1fr);
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.storage-recovery-event-row time,
.storage-recovery-event-row span {
  color: #b8bdd3;
}

.storage-toolbar-field {
  min-width: 180px;
  display: grid;
  gap: 8px;
}

.storage-toolbar-field span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.storage-toolbar-count {
  margin-left: auto;
  align-self: center;
}

.storage-backups-table .cost-sort-button {
  min-height: 30px;
  border-radius: 5px;
  text-align: left;
}
.storage-backups-table .cost-sort-button:hover,
.storage-backups-table .cost-sort-button.is-active {
  color: var(--admin-accent, #8060ed);
}
.storage-backup-refresh-status { margin: -6px 0 14px; }

.storage-backups-table th:nth-child(5),
.storage-backups-table td:nth-child(5) {
  min-width: 320px;
}

.storage-backups-table th:nth-child(4),
.storage-backups-table td:nth-child(4),
.storage-files-table th:nth-child(5),
.storage-files-table td:nth-child(5) {
  min-width: 260px;
}

.storage-files-table th:nth-child(2),
.storage-files-table td:nth-child(2) {
  min-width: 175px;
}

.storage-files-table .detail-meta.is-pending-delete {
  color: #c97821;
  font-weight: 700;
}

.storage-path-cell {
  min-width: 320px;
  max-width: 440px;
  color: var(--muted);
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.85rem;
  line-height: 1.5;
  word-break: break-word;
}

.inline-action-row {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}

.storage-destructive-action-pair {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: nowrap;
}

.checkbox-line {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-weight: 600;
}

.checkbox-line input {
  width: 18px;
  height: 18px;
  accent-color: #7c64ff;
}

.list-card.is-priority-action {
  border-color: rgba(201, 137, 47, 0.3);
  box-shadow: 0 0 0 1px rgba(201, 137, 47, 0.08) inset;
}

.storage-chart-grid,
.storage-detail-grid,
.storage-media-breakdown-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.storage-media-breakdown-card { display: grid; align-content: start; gap: 18px; }
.storage-media-breakdown-card > .detail-row { align-items: flex-start; }
.storage-media-breakdown-card > .detail-row .pill { white-space: nowrap; }
.storage-media-types-heading { margin: 8px 0 0; font-size: 1rem; color: var(--text); }
.storage-root-info {
  position: relative;
  z-index: 3;
  display: inline-grid;
  place-items: center;
  width: 19px;
  height: 19px;
  margin-left: 7px;
  padding: 0;
  border: 1px solid #9e8cdf;
  border-radius: 50%;
  color: #654dc5;
  background: #f5f1ff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
  cursor: help;
}
.storage-root-info::after {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  width: min(290px, 72vw);
  padding: 10px 12px;
  border-radius: 10px;
  color: #fff;
  background: #182943;
  box-shadow: 0 10px 24px rgba(24, 41, 67, .22);
  content: attr(data-definition);
  font: 500 12px/1.4 Arial, sans-serif;
  text-align: left;
  white-space: normal;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.storage-root-info:hover::after,
.storage-root-info:focus-visible::after { opacity: 1; visibility: visible; }
.storage-root-info:focus-visible { outline: 3px solid #9b7fdb; outline-offset: 3px; }
.storage-root-breakdowns { display: grid; gap: 8px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); }
.storage-root-breakdowns h3 { margin: 0; font-size: 1rem; color: var(--text); }
.storage-root-breakdown-list { display: grid; gap: 2px; margin-top: 4px; }
.storage-root-breakdown-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 0.89rem; }
.storage-root-breakdown-row:last-child { border-bottom: 0; }
.storage-root-breakdown-row span { color: var(--muted); text-align: right; }

.storage-meter {
  display: grid;
  gap: 12px;
  margin-bottom: 18px;
}

.storage-meter-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  color: var(--muted);
  font-weight: 700;
}

.storage-meter-head strong {
  color: var(--text);
}

.storage-meter-track {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.12);
  overflow: hidden;
}

.storage-meter-fill {
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #7c64ff, #58c4ff);
}

.storage-meter-note {
  color: var(--muted);
  font-size: 0.92rem;
}

.storage-usage-card .donut-summary {
  gap: 28px;
}

.storage-capacity-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.storage-capacity-cleanup-button {
  width: 38px;
  height: 38px;
  min-width: 38px;
  border-radius: 14px;
  background: #16191f;
  border-color: rgba(22, 25, 31, 0.22);
  color: #ffffff;
}

.storage-capacity-cleanup-button:hover {
  background: #0f1218;
  color: #ffffff;
}

.storage-capacity-cleanup-button svg {
  width: 20px;
  height: 20px;
}

.storage-usage-card .donut-ring {
  width: clamp(220px, 24vw, 298px);
  height: clamp(220px, 24vw, 298px);
}

.storage-usage-card .donut-ring-hole {
  width: clamp(132px, 15vw, 168px);
  height: clamp(132px, 15vw, 168px);
  gap: 8px;
  padding: 0 16px;
}

.storage-usage-card .donut-ring-hole strong {
  font-size: clamp(1.75rem, 2vw, 2.3rem);
  line-height: 1;
}

.storage-usage-card .donut-ring-hole span {
  max-width: 110px;
  font-size: 0.96rem;
  line-height: 1.2;
}

.media-workspace {
  display: grid;
  gap: 22px;
}

.media-stats-auto-region {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-width: 0;
  overflow-anchor: none;
  transition:
    grid-template-rows 460ms cubic-bezier(0.22, 1, 0.36, 1),
    margin-bottom 460ms cubic-bezier(0.22, 1, 0.36, 1);
}

.media-stats-auto-region-inner {
  display: grid;
  gap: 22px;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transform-origin: top center;
  transition:
    opacity 260ms ease,
    transform 460ms cubic-bezier(0.22, 1, 0.36, 1),
    gap 460ms cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0s;
}

.media-stats-auto-region.is-auto-collapsed {
  grid-template-rows: minmax(0, 0fr);
  margin-bottom: -22px;
  pointer-events: none;
}

.media-stats-auto-region.is-auto-collapsed .media-stats-auto-region-inner {
  gap: 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-34px);
  transition-delay: 0s, 0s, 0s, 460ms;
}

@media (prefers-reduced-motion: reduce) {
  .media-stats-auto-region,
  .media-stats-auto-region-inner,
  .media-item-figure canvas[data-media-image-state="loading"] {
    transition-duration: 1ms;
    animation: none;
  }

  .media-stats-auto-region.is-auto-collapsed .media-stats-auto-region-inner {
    transition-delay: 0s;
  }
}

.media-workspace-tabs {
  display: inline-flex;
  width: max-content;
  max-width: 100%;
  margin: 0;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow);
  overflow-x: auto;
  scrollbar-width: thin;
}

.media-workspace-tabs button {
  position: relative;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 10px 16px;
  border: 0;
  border-radius: 999px;
  background-clip: padding-box;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  isolation: isolate;
  overflow: hidden;
  flex: 0 0 auto;
  white-space: nowrap;
}

.media-workspace-tabs button[aria-pressed="true"] {
  z-index: 1;
  color: #fff;
  background: #182943;
  box-shadow: 0 10px 22px rgba(24, 41, 67, 0.14);
}

.media-workspace-tabs button[aria-pressed="true"]::before,
.media-workspace-tabs button[aria-pressed="true"]::after {
  content: none;
}

.media-workspace-tabs button span {
  display: inline-grid;
  min-width: 24px;
  height: 24px;
  place-items: center;
  border-radius: 999px;
  background: rgba(140, 98, 246, 0.14);
  font-size: 0.75rem;
}

.media-workspace-tabs button[aria-pressed="true"] span {
  background: rgba(255, 255, 255, 0.18);
}

.media-workspace-tabs .media-workspace-approval-tab.has-count {
  color: #3568c7;
}

.media-workspace-tabs .media-workspace-approval-tab.has-count span {
  color: #2f5fb8;
  background: #e7efff;
}

.media-workspace-tabs .media-workspace-approval-tab.has-count[aria-pressed="true"] {
  color: #fff;
  background: linear-gradient(135deg, #3268cf, #5c91f0);
  box-shadow: 0 12px 26px rgba(50, 104, 207, 0.24);
}

.media-workspace-tabs .media-workspace-issue-tab.has-count {
  color: #b23b50;
}

.media-workspace-tabs .media-workspace-issue-tab.has-count span {
  color: #a53247;
  background: #ffe8ec;
}

.media-workspace-tabs .media-workspace-issue-tab.has-count[aria-pressed="true"] {
  color: #fff;
  background: linear-gradient(135deg, #b6374d, #e26779);
  box-shadow: 0 12px 26px rgba(182, 55, 77, 0.24);
}

.admin-approvals-workspace {
  padding-inline: clamp(14px, 1.4vw, 24px);
}

.admin-approvals-head,
.admin-approvals-head-actions,
.admin-approval-toolbar,
.admin-approval-filter-group,
.admin-approval-sort-group,
.admin-approval-actions {
  display: flex;
  align-items: center;
}

.admin-approvals-head {
  gap: 24px;
  justify-content: space-between;
  flex-wrap: wrap;
}

.admin-approvals-head > div:first-child {
  flex: 1 1 420px;
  max-width: 760px;
}

.admin-approvals-head-actions {
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-approvals-eyebrow {
  color: #a23b63;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.admin-approvals-summary .metric-card:first-child {
  border-color: rgba(183, 68, 112, 0.24);
  background: linear-gradient(145deg, #fff, #fff2f6);
}

.admin-artist-policy-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.8fr) minmax(420px, 1.2fr);
  gap: 16px;
}

.admin-artist-policy-card,
.admin-artist-denied-card {
  display: grid;
  align-content: start;
  gap: 16px;
  min-width: 0;
}

.admin-artist-policy-card {
  border-color: rgba(130, 98, 232, 0.2);
  background: linear-gradient(145deg, #fff 0%, #f8f5ff 100%);
}

.admin-artist-policy-number,
.admin-artist-denied-form label {
  display: grid;
  gap: 7px;
  color: #283750;
  font-size: 0.8rem;
  font-weight: 900;
}

.admin-artist-policy-number input,
.admin-artist-denied-form input {
  width: 100%;
  min-height: 44px;
  padding: 10px 12px;
  border: 1px solid rgba(24, 41, 67, 0.16);
  border-radius: 12px;
  color: #182943;
  background: rgba(255, 255, 255, 0.92);
  font: inherit;
  font-weight: 800;
}

.admin-artist-policy-number small,
.admin-artist-policy-check small {
  color: var(--muted);
  font-weight: 700;
}

.admin-artist-policy-check {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 11px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(130, 98, 232, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}

.admin-artist-policy-check input {
  width: 19px;
  height: 19px;
  margin: 2px 0 0;
  accent-color: #8262e8;
}

.admin-artist-policy-check span {
  display: grid;
  gap: 3px;
}

.admin-artist-denied-card {
  border-color: rgba(183, 68, 112, 0.2);
  background: linear-gradient(145deg, #fff 0%, #fff7fa 100%);
}

.admin-artist-denied-head {
  display: flex;
  gap: 16px;
  align-items: start;
  justify-content: space-between;
}

.admin-artist-denied-head > strong {
  display: grid;
  min-width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 15px;
  color: #a23b63;
  background: #ffe6ee;
  font-size: 1.05rem;
}

.admin-artist-denied-form {
  display: grid;
  grid-template-columns: minmax(150px, 0.7fr) minmax(230px, 1.3fr) auto;
  gap: 10px;
  align-items: end;
}

.admin-artist-denied-list {
  display: grid;
  gap: 8px;
  max-height: 330px;
  overflow: auto;
  padding-right: 4px;
}

.admin-artist-denied-list article {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
  padding: 11px;
  border: 1px solid rgba(183, 68, 112, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.86);
}

.admin-artist-denied-list article > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.admin-artist-denied-list article small,
.admin-artist-denied-list article em {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.75rem;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-artist-denied-mark {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 12px;
  color: #fff;
  background: #bd4b70;
  font-weight: 1000;
}

.admin-approval-queue-card {
  overflow: visible;
}

.admin-approval-toolbar {
  gap: 14px;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.admin-approval-filter-group,
.admin-approval-sort-group {
  gap: 6px;
  flex-wrap: wrap;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #f8f7fb;
}

.admin-approval-filter-group button,
.admin-approval-sort-group button {
  border: 0;
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--muted);
  background: transparent;
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 900;
}

.admin-approval-filter-group button[aria-pressed="true"],
.admin-approval-sort-group button[aria-pressed="true"] {
  color: #fff;
  background: #182943;
  box-shadow: 0 7px 16px rgba(24, 41, 67, 0.14);
}

.admin-approval-table-head,
.admin-approval-row {
  display: grid;
  grid-template-columns: minmax(190px, 1.25fr) minmax(160px, 0.9fr) minmax(240px, 1.5fr) minmax(150px, 0.8fr) minmax(210px, auto);
  gap: 16px;
  align-items: center;
}

.admin-approval-table-head {
  padding: 16px 64px 10px;
  color: var(--muted);
  font-size: 0.73rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admin-approval-list {
  display: grid;
  gap: 10px;
}

.admin-approval-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 4px;
  color: var(--muted);
  font-size: 0.83rem;
  font-weight: 800;
}

.admin-approval-pagination label,
.admin-approval-page-buttons {
  display: flex;
  align-items: center;
  gap: 9px;
}

.admin-approval-pagination .admin-select {
  width: auto;
  min-width: 74px;
  padding: 7px 9px;
}

.admin-approval-timing-menu {
  position: relative;
}

.admin-approval-timing-menu summary {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  list-style: none;
  cursor: pointer;
  white-space: nowrap;
}

.admin-approval-timing-menu summary::-webkit-details-marker { display: none; }

.admin-approval-timing-menu[open] { z-index: 5; }

.admin-approval-timing-options {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 6;
  display: grid;
  width: min(310px, calc(100vw - 44px));
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(24, 41, 67, 0.18);
}

.admin-approval-timing-options button {
  display: grid;
  gap: 3px;
  padding: 11px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #182943;
  text-align: left;
  cursor: pointer;
}

.admin-approval-timing-options button:hover,
.admin-approval-timing-options button:focus-visible { background: #f1edff; outline: none; }

.admin-approval-timing-options button small { color: var(--muted); }

.admin-approval-row {
  position: relative;
  grid-template-columns: 38px minmax(190px, 1.25fr) minmax(160px, 0.9fr) minmax(240px, 1.5fr) minmax(150px, 0.8fr) minmax(210px, auto);
  padding: 16px;
  border: 1px solid rgba(24, 41, 67, 0.1);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 9px 24px rgba(24, 41, 67, 0.05);
}

.admin-approval-row.is-held {
  border-color: rgba(218, 143, 39, 0.25);
  background: linear-gradient(105deg, #fff9ed 0%, #fff 34%);
}

.admin-approval-row.is-disputed {
  border-color: rgba(183, 68, 112, 0.25);
  background: linear-gradient(105deg, #fff0f5 0%, #fff 34%);
}

.admin-approval-row.is-scheduled {
  border-color: rgba(64, 156, 123, 0.22);
  background: linear-gradient(105deg, #effbf6 0%, #fff 34%);
}

.admin-issue-row.is-error {
  border-color: rgba(183, 68, 112, 0.24);
  background: linear-gradient(105deg, #fff0f5 0%, #fff 34%);
}

.admin-issue-row.is-review {
  border-color: rgba(218, 143, 39, 0.25);
  background: linear-gradient(105deg, #fff9ed 0%, #fff 34%);
}

.admin-approval-status-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 13px;
  color: #fff;
  background: #8262e8;
  font-size: 1.1rem;
  font-weight: 1000;
}

.admin-approval-row.is-held .admin-approval-status-icon { background: #d9962d; }
.admin-approval-row.is-disputed .admin-approval-status-icon { background: #bb466e; }
.admin-approval-row.is-scheduled .admin-approval-status-icon { background: #409c7b; }
.admin-issue-row.is-error .admin-approval-status-icon { background: #bb466e; }
.admin-issue-row.is-review .admin-approval-status-icon { background: #d9962d; }

.admin-approval-primary,
.admin-approval-owner,
.admin-approval-state,
.admin-approval-timing {
  min-width: 0;
}

.admin-approval-primary,
.admin-approval-owner,
.admin-approval-timing {
  display: grid;
  gap: 4px;
}

.admin-approval-primary strong,
.admin-approval-owner strong,
.admin-approval-timing strong {
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-approval-primary small,
.admin-approval-owner small,
.admin-approval-timing small,
.admin-approval-state p {
  color: var(--muted);
}

.admin-approval-state p {
  margin: 7px 0;
  font-size: 0.83rem;
  line-height: 1.4;
}

.admin-approval-actions {
  gap: 7px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-issue-reference {
  display: grid;
  justify-items: stretch;
  gap: 5px;
}

.admin-issue-reference code {
  max-width: 240px;
  overflow: hidden;
  padding: 6px 8px;
  border: 1px solid rgba(24, 41, 67, 0.1);
  border-radius: 8px;
  color: #35435a;
  background: rgba(247, 249, 253, 0.92);
  font-size: 0.7rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-tooltip-action {
  position: relative;
}

.admin-tooltip-action::after {
  position: absolute;
  z-index: 20;
  right: 0;
  bottom: calc(100% + 9px);
  width: max-content;
  max-width: 240px;
  padding: 7px 10px;
  border-radius: 8px;
  color: #fff;
  background: #182943;
  box-shadow: 0 8px 20px rgba(24, 41, 67, 0.2);
  content: attr(data-tooltip);
  font-size: 0.72rem;
  line-height: 1.25;
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity 140ms ease, transform 140ms ease;
}

.admin-tooltip-action:hover::after,
.admin-tooltip-action:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1320px) {
  .admin-artist-policy-grid {
    grid-template-columns: 1fr;
  }

  .admin-approval-table-head {
    display: none;
  }

  .admin-approval-row {
    grid-template-columns: 38px minmax(180px, 1fr) minmax(180px, 1fr);
  }

  .admin-approval-primary {
    grid-column: 2;
  }

  .admin-approval-owner {
    grid-column: 3;
  }

  .admin-approval-state {
    grid-column: 2 / span 2;
  }

  .admin-approval-timing {
    grid-column: 2;
  }

  .admin-approval-actions {
    grid-column: 3;
  }
}

@media (max-width: 760px) {
  .admin-artist-denied-form {
    grid-template-columns: 1fr;
  }

  .admin-artist-denied-list article {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .admin-artist-denied-list article .admin-button {
    grid-column: 2;
    justify-self: start;
  }
}

@media (max-width: 760px) {
  .admin-approvals-head-actions,
  .admin-approvals-head-actions .media-workspace-tabs,
  .admin-approvals-head-actions .admin-button,
  .admin-approval-filter-group,
  .admin-approval-sort-group {
    width: 100%;
  }

  .admin-approval-filter-group,
  .admin-approval-sort-group {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    border-radius: 16px;
  }

  .admin-approval-row {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .admin-approval-primary,
  .admin-approval-owner,
  .admin-approval-state,
  .admin-approval-timing,
  .admin-approval-actions {
    grid-column: 2;
  }

  .admin-approval-actions {
    justify-content: flex-start;
  }

  .admin-approval-pagination { align-items: flex-start; }

  .admin-approval-page-buttons { width: 100%; justify-content: space-between; }

  .admin-approval-timing-options { right: auto; left: 0; }
}

.media-workspace-tab-row {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 20px;
  min-width: 0;
}

.media-workspace-tab-row--standalone {
  padding-inline: clamp(14px, 1.4vw, 24px);
}

.studio-cover-reference-head {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding-inline: clamp(14px, 1.4vw, 24px);
}

.studio-cover-reference-copy {
  flex: 1 1 520px;
  min-width: min(100%, 320px);
}

.studio-cover-reference-eyebrow {
  color: #8b5cf6;
  font-weight: 950;
  letter-spacing: 0.08em;
}

.studio-cover-reference-head .section-note {
  max-width: 760px;
}

.studio-cover-reference-actions-row {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin-left: auto;
}

.studio-cover-reference-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.studio-cover-reference-settings,
.studio-cover-reference-upload {
  display: grid;
  gap: 15px;
  align-content: start;
}

.studio-cover-reference-settings > label:not(.studio-cover-reference-check),
.studio-cover-reference-upload > label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
}

.studio-cover-reference-settings select,
.studio-cover-reference-upload input {
  width: 100%;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--ink);
  background: #fff;
  font: inherit;
}

.studio-cover-reference-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.studio-cover-reference-check input {
  width: 18px;
  height: 18px;
  margin-top: 2px;
}

.studio-cover-reference-check span {
  display: grid;
  gap: 2px;
}

.studio-cover-reference-check small {
  color: var(--muted);
  line-height: 1.4;
}

.studio-cover-reference-library {
  overflow: hidden;
}

.studio-cover-reference-library-toolbar,
.studio-cover-reference-pagination {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.studio-cover-reference-library-title {
  display: grid;
  gap: 4px;
  min-width: min(100%, 260px);
}

.studio-cover-reference-library-controls {
  display: flex;
  align-items: end;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.studio-cover-reference-control {
  display: grid;
  gap: 7px;
  min-width: 140px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 850;
}

.studio-cover-reference-control > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.studio-cover-reference-control strong {
  color: #8b5cf6;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.studio-cover-reference-size-control {
  min-width: 230px;
}

.studio-cover-reference-size-control input {
  accent-color: #8b5cf6;
  cursor: pointer;
}

.studio-cover-reference-pagination {
  align-items: center;
  margin-top: 14px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.studio-cover-reference-pagination > div {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.studio-cover-reference-scroll {
  max-height: min(72vh, 920px);
  overflow: auto;
  padding: 2px 6px 2px 0;
  scrollbar-gutter: stable;
}

.studio-cover-reference-grid {
  --reference-card-min: 210px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--reference-card-min), 1fr));
  gap: 14px;
  margin-top: 18px;
}

.studio-cover-reference-grid--small {
  --reference-card-min: 160px;
}

.studio-cover-reference-grid--medium {
  --reference-card-min: 210px;
}

.studio-cover-reference-grid--large {
  --reference-card-min: 280px;
}

.studio-cover-reference-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
}

.studio-cover-reference-card.is-disabled,
.studio-cover-reference-card.is-archived {
  background: #f5f3ef;
}

.studio-cover-reference-card.is-disabled img,
.studio-cover-reference-card.is-archived img {
  filter: grayscale(1);
  opacity: 0.58;
}

.studio-cover-reference-card > img {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 10px;
  object-fit: cover;
  background: #ece9e3;
}

.studio-cover-reference-card-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.studio-cover-reference-card strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-cover-reference-card small {
  color: var(--muted);
}

.studio-cover-reference-card-meta {
  display: flex;
  gap: 4px 10px;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
}

.studio-cover-reference-card-meta small {
  min-width: 0;
}

.studio-cover-reference-filename {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-cover-reference-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.studio-cover-reference-actions .admin-button {
  flex: 1 1 auto;
}

.studio-cover-reference-grid--compact {
  --reference-card-min: 260px;
}

.studio-cover-reference-grid--compact.studio-cover-reference-grid--small {
  --reference-card-min: 220px;
}

.studio-cover-reference-grid--compact.studio-cover-reference-grid--large {
  --reference-card-min: 320px;
}

.studio-cover-reference-grid--compact .studio-cover-reference-card {
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: center;
}

.studio-cover-reference-grid--compact .studio-cover-reference-card > img {
  width: 76px;
  height: 76px;
}

.studio-cover-reference-grid--compact.studio-cover-reference-grid--small .studio-cover-reference-card {
  grid-template-columns: 64px minmax(0, 1fr);
}

.studio-cover-reference-grid--compact.studio-cover-reference-grid--small .studio-cover-reference-card > img {
  width: 64px;
  height: 64px;
}

.studio-cover-reference-grid--compact.studio-cover-reference-grid--large .studio-cover-reference-card {
  grid-template-columns: 96px minmax(0, 1fr);
}

.studio-cover-reference-grid--compact.studio-cover-reference-grid--large .studio-cover-reference-card > img {
  width: 96px;
  height: 96px;
}

.studio-cover-reference-grid--compact .studio-cover-reference-actions {
  grid-column: 1 / -1;
}

.studio-cover-reference-grid--details {
  grid-template-columns: 1fr;
}

.studio-cover-reference-grid--details .studio-cover-reference-card {
  grid-template-columns: 88px minmax(0, 1fr) minmax(170px, auto);
  align-items: center;
}

.studio-cover-reference-grid--details.studio-cover-reference-grid--small .studio-cover-reference-card {
  grid-template-columns: 72px minmax(0, 1fr) minmax(170px, auto);
}

.studio-cover-reference-grid--details.studio-cover-reference-grid--large .studio-cover-reference-card {
  grid-template-columns: 112px minmax(0, 1fr) minmax(170px, auto);
}

.studio-cover-reference-grid--details .studio-cover-reference-card > img {
  width: 88px;
  height: 88px;
}

.studio-cover-reference-grid--details.studio-cover-reference-grid--small .studio-cover-reference-card > img {
  width: 72px;
  height: 72px;
}

.studio-cover-reference-grid--details.studio-cover-reference-grid--large .studio-cover-reference-card > img {
  width: 112px;
  height: 112px;
}

.studio-cover-reference-grid--details .studio-cover-reference-actions {
  justify-content: flex-end;
}

.generated-artwork-workspace {
  gap: 18px;
  min-width: 0;
}

.generated-artwork-workspace > * {
  min-width: 0;
  max-width: 100%;
}

.generated-artwork-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
  padding-inline: clamp(14px, 1.4vw, 24px);
}

.generated-artwork-head > div:first-child {
  flex: 1 1 440px;
  min-width: min(100%, 280px);
}

.generated-artwork-eyebrow {
  color: var(--purple);
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.generated-artwork-head .section-note {
  max-width: 760px;
}

.generated-artwork-head-actions {
  display: flex;
  min-width: 0;
  max-width: 100%;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin-left: auto;
}

.generated-artwork-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.generated-artwork-summary-card {
  display: grid;
  min-width: 0;
  gap: 5px;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(145deg, var(--panel-bg), var(--panel-muted));
}

.generated-artwork-summary-card span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.generated-artwork-summary-card strong {
  color: var(--text);
  font-size: clamp(1.25rem, 2vw, 1.7rem);
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.generated-artwork-summary-card small {
  color: var(--muted);
  line-height: 1.35;
}

.generated-artwork-toolbar {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(150px, 190px) minmax(140px, 180px);
  align-items: end;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-bg);
}

.generated-artwork-toolbar .users-inline-search {
  min-width: 0;
}

.generated-artwork-control {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 850;
}

.generated-artwork-results-head,
.generated-artwork-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 850;
}

.generated-artwork-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(290px, 1fr));
  grid-auto-flow: row dense;
  align-items: start;
  gap: 14px;
  padding: 2px 0;
}

.generated-artwork-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-bg);
  box-shadow: 0 10px 26px rgba(37, 29, 78, 0.06);
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

.generated-artwork-card.is-expanded {
  border-color: rgba(124, 92, 255, 0.36);
  box-shadow: 0 18px 40px rgba(58, 42, 126, 0.12);
}

.generated-artwork-primary {
  appearance: none;
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
}

.generated-artwork-primary:disabled {
  cursor: default;
}

.generated-artwork-primary:focus-visible,
.generated-artwork-folder-toggle:focus-visible,
.generated-artwork-owner-link:focus-visible,
.generated-artwork-subimage:focus-visible {
  outline: 3px solid rgba(124, 92, 255, 0.28);
  outline-offset: -3px;
}

.generated-artwork-preview,
.generated-artwork-image,
.generated-artwork-preview .media-item-placeholder {
  width: 100%;
  aspect-ratio: 1;
}

.generated-artwork-image,
.generated-artwork-preview .media-item-placeholder {
  display: grid;
  place-items: center;
  object-fit: cover;
  background: var(--panel-muted);
}

.generated-artwork-preview {
  position: relative;
  display: block;
  overflow: hidden;
}

.generated-artwork-image {
  transition: transform 260ms ease, filter 260ms ease;
}

.generated-artwork-primary:not(:disabled):hover .generated-artwork-image {
  filter: saturate(1.05);
  transform: scale(1.025);
}

.generated-artwork-current-badge,
.generated-artwork-folder-count {
  position: absolute;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  color: #ffffff;
  background: rgba(17, 23, 35, 0.88);
  box-shadow: 0 6px 18px rgba(17, 23, 35, 0.2);
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1;
  backdrop-filter: blur(8px);
}

.generated-artwork-current-badge {
  left: 11px;
  bottom: 11px;
}

.generated-artwork-folder-count {
  top: 11px;
  right: 11px;
  background: rgba(112, 76, 236, 0.92);
}

.generated-artwork-copy {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
  padding: 14px;
}

.generated-artwork-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  min-width: 0;
  gap: 10px;
}

.generated-artwork-copy h3 {
  min-width: 0;
  margin: 0;
  color: var(--text);
  font-size: 1rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
  white-space: normal;
}

.generated-artwork-artist {
  color: var(--muted);
  font-size: 0.82rem;
  overflow-wrap: anywhere;
}

.generated-artwork-meta {
  color: var(--muted);
}

.generated-artwork-owner-link {
  appearance: none;
  justify-self: start;
  max-width: 100%;
  padding: 0;
  border: 0;
  color: var(--purple);
  background: transparent;
  font: inherit;
  font-size: 0.82rem;
  text-align: left;
  overflow-wrap: anywhere;
  cursor: pointer;
}

.generated-artwork-owner-link:hover strong {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.generated-artwork-meta {
  display: grid;
  gap: 2px;
  margin-top: 5px;
  font-size: 0.75rem;
  line-height: 1.4;
}

.generated-artwork-folder-toggle {
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 40px;
  margin-top: 5px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--text);
  background: var(--panel-muted);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 850;
  text-align: left;
  cursor: pointer;
}

.generated-artwork-folder-toggle:disabled {
  color: var(--muted);
  cursor: default;
}

.generated-artwork-folder-toggle svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  transition: transform 200ms ease;
}

.generated-artwork-card.is-expanded .generated-artwork-folder-toggle svg {
  transform: rotate(180deg);
}

.generated-artwork-folder {
  display: grid;
  grid-column: 1 / -1;
  grid-template-rows: 0fr;
  min-width: 0;
  opacity: 0;
  transition: grid-template-rows 260ms ease, opacity 180ms ease;
}

.generated-artwork-card.is-expanded .generated-artwork-folder {
  grid-template-rows: 1fr;
  opacity: 1;
}

.generated-artwork-folder-inner {
  min-height: 0;
  overflow: hidden;
}

.generated-artwork-card.is-expanded .generated-artwork-folder-inner {
  border-top: 1px solid var(--line);
}

.generated-artwork-folder-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 10px;
}

.generated-artwork-folder-head strong {
  color: var(--text);
  font-size: 0.86rem;
}

.generated-artwork-folder-head span {
  color: var(--muted);
  font-size: 0.72rem;
}

.generated-artwork-subgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: 10px;
  padding: 0 14px 14px;
}

.generated-artwork-subimage {
  appearance: none;
  display: grid;
  min-width: 0;
  gap: 5px;
  padding: 7px;
  border: 1px solid var(--line);
  border-radius: 10px;
  color: var(--text);
  background: var(--panel-bg);
  font: inherit;
  text-align: left;
  cursor: zoom-in;
  transition: border-color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.generated-artwork-subimage:hover {
  border-color: rgba(124, 92, 255, 0.42);
  box-shadow: 0 8px 20px rgba(58, 42, 126, 0.1);
  transform: translateY(-2px);
}

.generated-artwork-subimage img,
.generated-artwork-subimage .media-item-placeholder {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 7px;
  object-fit: cover;
  background: var(--panel-muted);
}

.generated-artwork-subimage span,
.generated-artwork-subimage small {
  overflow-wrap: anywhere;
  white-space: normal;
}

.generated-artwork-subimage span {
  font-size: 0.74rem;
  font-weight: 850;
  line-height: 1.3;
}

.generated-artwork-subimage small {
  color: var(--muted);
  font-size: 0.68rem;
}

.admin-dialog-card.is-generated-artwork-preview-dialog {
  width: min(96vw, 980px);
  max-height: min(94vh, 980px);
}

.generated-artwork-dialog-preview {
  display: grid;
  gap: 14px;
}

.generated-artwork-dialog-preview > img {
  width: 100%;
  max-height: min(68vh, 720px);
  border-radius: 12px;
  object-fit: contain;
  background: #10131b;
}

.generated-artwork-dialog-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 16px;
}

.generated-artwork-dialog-meta span {
  display: grid;
  min-width: 0;
  gap: 2px;
  color: var(--muted);
  font-size: 0.8rem;
  overflow-wrap: anywhere;
}

.generated-artwork-dialog-meta strong {
  color: var(--text);
  font-size: 0.72rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.generated-artwork-empty {
  grid-column: 1 / -1;
}

.generated-artwork-pagination {
  justify-content: flex-end;
  flex-wrap: wrap;
}

@media (min-width: 821px) {
  .generated-artwork-card.is-expanded {
    grid-column: span 2;
    grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1fr);
  }

  .generated-artwork-card.is-expanded .generated-artwork-primary {
    grid-column: 1;
    grid-row: 1;
  }

  .generated-artwork-card.is-expanded .generated-artwork-copy {
    grid-column: 2;
    grid-row: 1;
    align-self: stretch;
  }
}

@media (max-width: 820px) {
  .studio-cover-reference-settings-grid {
    grid-template-columns: 1fr;
  }

  .studio-cover-reference-head {
    align-items: stretch;
    flex-direction: column;
  }

  .studio-cover-reference-actions-row {
    justify-content: flex-start;
    width: 100%;
  }

  .studio-cover-reference-library-controls {
    justify-content: flex-start;
  }

  .studio-cover-reference-control,
  .studio-cover-reference-size-control {
    min-width: min(100%, 220px);
  }

  .studio-cover-reference-grid--details .studio-cover-reference-card,
  .studio-cover-reference-grid--compact .studio-cover-reference-card {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .studio-cover-reference-grid--details .studio-cover-reference-card > img,
  .studio-cover-reference-grid--compact .studio-cover-reference-card > img {
    width: 72px;
    height: 72px;
  }

  .studio-cover-reference-grid--details .studio-cover-reference-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }

  .media-workspace-tabs {
    display: flex;
    width: max-content;
    border-radius: 999px;
  }

  .media-workspace-tabs button {
    justify-content: center;
  }

  .media-workspace-tab-row {
    justify-content: stretch;
  }

  .generated-artwork-head {
    align-items: stretch;
    flex-direction: column;
  }

  .generated-artwork-head > div:first-child {
    flex: 0 1 auto;
  }

  .generated-artwork-head-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .generated-artwork-toolbar {
    grid-template-columns: 1fr 1fr;
  }

  .generated-artwork-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .generated-artwork-toolbar .users-inline-search {
    grid-column: 1 / -1;
  }
}

@media (max-width: 540px) {
  .generated-artwork-toolbar {
    grid-template-columns: 1fr;
  }

  .generated-artwork-toolbar .users-inline-search {
    grid-column: auto;
  }

  .generated-artwork-grid {
    grid-template-columns: 1fr;
  }

  .generated-artwork-folder-head,
  .generated-artwork-dialog-meta {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .generated-artwork-folder-head {
    flex-direction: column;
  }

  .generated-artwork-results-head,
  .generated-artwork-pagination {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 380px) {
  .generated-artwork-summary {
    grid-template-columns: 1fr;
  }
}

.media-stats-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-inline: clamp(14px, 1.4vw, 24px);
}

.media-stats-heading {
  flex: 1 1 300px;
  min-width: min(100%, 280px);
}

.media-stats-toolbar {
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
  margin-left: auto;
  min-width: 0;
  position: relative;
  z-index: 2;
}

.media-stats-auto-region .media-summary-grid[hidden] {
  display: none;
}

.media-date-range-control {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  max-width: 100%;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow);
}

.media-date-range-button {
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 900;
  padding: 8px 12px;
  white-space: nowrap;
}

.media-date-range-button.is-active {
  background: linear-gradient(135deg, #16233a, #2d4165);
  color: #ffffff;
  box-shadow: 0 10px 22px rgba(20, 33, 61, 0.16);
}

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

.media-stats-grid.is-detail-stack {
  grid-template-columns: 1fr;
  gap: 12px;
}

.media-stats-grid.is-detail-stack .media-stat-card {
  min-height: 176px;
  padding: 16px;
  box-shadow: none;
}

.media-stats-grid.is-detail-stack .media-stat-card-head {
  min-height: auto;
}

.media-stats-grid.is-detail-stack .media-stat-total {
  font-size: clamp(1.65rem, 2vw, 2.05rem);
}

.media-stat-card {
  display: grid;
  grid-template-rows: auto 1fr;
  gap: 16px;
  padding: 18px;
  min-height: 202px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: var(--shadow);
}

.media-stat-card-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  min-height: 86px;
}

.media-stat-title-row {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  align-items: start;
  gap: 9px;
  min-height: 34px;
}

.media-stat-title-row .metric-label {
  line-height: 1.35;
}

.media-stat-title-dot {
  width: 10px;
  height: 10px;
  margin-top: 3px;
  border-radius: 999px;
  background: #4b7df0;
  box-shadow: 0 0 0 4px rgba(75, 125, 240, 0.12);
}

.media-stat-title-dot.tone-green {
  background: #1aa46f;
  box-shadow: 0 0 0 4px rgba(26, 164, 111, 0.12);
}

.media-stat-title-dot.tone-orange {
  background: #d9851f;
  box-shadow: 0 0 0 4px rgba(217, 133, 31, 0.14);
}

.media-stat-title-dot.tone-purple {
  background: #7c64ff;
  box-shadow: 0 0 0 4px rgba(124, 100, 255, 0.13);
}

.media-stat-total {
  margin-top: 8px;
  color: var(--text);
  font-size: clamp(1.8rem, 2.5vw, 2.3rem);
  font-weight: 900;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.media-stat-badge {
  flex: 0 0 auto;
  min-width: 76px;
  max-width: 118px;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.1);
  color: var(--accent-strong);
  font-size: 0.74rem;
  font-weight: 900;
  text-align: center;
  white-space: nowrap;
}

.media-stat-progress-stack {
  display: grid;
  gap: 10px;
  align-self: end;
}

.media-stat-progress-row {
  --media-stat-color: #4b7df0;
  display: grid;
  gap: 6px;
}

.media-stat-progress-row.tone-green {
  --media-stat-color: #1aa46f;
}

.media-stat-progress-row.tone-orange {
  --media-stat-color: #d9851f;
}

.media-stat-progress-row.tone-purple {
  --media-stat-color: #7c64ff;
}

.media-stat-progress-row.tone-pink {
  --media-stat-color: #e85d8a;
}

.media-stat-progress-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(58px, auto);
  align-items: baseline;
  gap: 10px;
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
}

.media-stat-progress-head span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-stat-progress-head strong {
  color: var(--text);
  font-size: 0.86rem;
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

.media-stat-progress-track {
  height: 9px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(143, 154, 179, 0.16);
}

.media-stat-progress-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: var(--media-stat-color);
}

.media-chart-card {
  display: grid;
  gap: 16px;
}

.media-chart-card.is-collapsed {
  gap: 0;
  padding-block: 14px;
}

.media-chart-card-head {
  align-items: flex-start;
}

.media-chart-card.is-collapsed .media-chart-card-head {
  display: grid;
  grid-template-columns: minmax(180px, auto) minmax(300px, 1fr) auto;
  align-items: center;
  gap: 16px;
}

.media-chart-card-heading {
  min-width: 0;
}

.media-chart-card.is-collapsed .media-chart-card-heading .section-title {
  margin: 0;
}

.media-chart-card.is-expanded .media-chart-collapsed-summary {
  display: none;
}

.media-chart-card.is-collapsed .media-chart-card-note,
.media-chart-card.is-collapsed .media-grouped-category-filters,
.media-chart-card.is-collapsed .media-chart-view-toggle,
.media-chart-card.is-collapsed .media-chart-card-body {
  display: none;
}

.media-chart-card-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.media-stats-auto-toggle {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-bg);
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
  cursor: pointer;
}

.media-stats-auto-toggle input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #7457ec;
}

.media-summary-cards-toggle {
  white-space: nowrap;
}

.media-chart-card-toggle {
  min-width: 98px;
}

.media-chart-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.media-grouped-category-filters {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.media-grouped-category-button {
  --category-accent: #4b7df0;
  --category-soft: rgba(75, 125, 240, 0.12);
  --category-border: rgba(75, 125, 240, 0.22);
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--category-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  cursor: pointer;
  transition: opacity 0.18s ease, border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.media-grouped-category-button:hover,
.media-grouped-category-button:focus-visible {
  border-color: var(--category-border);
  background: var(--category-soft);
  transform: translateY(-1px);
}

.media-grouped-category-button.is-active {
  border-color: var(--category-border);
  background: var(--category-soft);
}

.media-grouped-category-button.is-muted {
  opacity: 0.44;
}

.media-grouped-category-button.is-category-streaming {
  --category-accent: #4b7df0;
  --category-soft: rgba(75, 125, 240, 0.14);
  --category-border: rgba(75, 125, 240, 0.24);
}

.media-grouped-category-button.is-category-albums {
  --category-accent: #8a5cf6;
  --category-soft: rgba(138, 92, 246, 0.14);
  --category-border: rgba(138, 92, 246, 0.24);
}

.media-grouped-category-button.is-category-tracks {
  --category-accent: #1aa46f;
  --category-soft: rgba(26, 164, 111, 0.14);
  --category-border: rgba(26, 164, 111, 0.26);
}

.media-grouped-category-button.is-category-images {
  --category-accent: #d9851f;
  --category-soft: rgba(217, 133, 31, 0.14);
  --category-border: rgba(217, 133, 31, 0.26);
}

.media-grouped-category-icon {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.media-grouped-category-icon svg {
  width: 26px;
  height: 26px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-chart-collapsed-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.media-chart-collapsed-chip {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 12px;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 14px;
  background: rgba(247, 250, 255, 0.76);
}

.media-chart-collapsed-chip span {
  min-width: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-chart-collapsed-chip strong {
  color: var(--text);
  font-size: 0.95rem;
  font-variant-numeric: tabular-nums;
  font-weight: 900;
}

.media-chart-collapsed-chip.is-empty {
  grid-column: 1 / -1;
}

.media-chart-card.is-collapsed .media-chart-card-actions {
  flex-wrap: wrap;
}

.media-grouped-chart {
  min-width: 0;
}

.media-grouped-chart-stage {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  min-height: 304px;
  padding: 16px 14px 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(143, 154, 179, 0.12) 1px, transparent 1px) 0 0 / 100% 25%,
    rgba(255, 255, 255, 0.72);
}

.media-grouped-chart-group {
  min-width: 0;
  display: grid;
  grid-template-rows: minmax(214px, 1fr) auto auto;
  gap: 8px;
}

.media-grouped-chart-bars {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 12px;
  min-height: 214px;
}

.media-grouped-chart-bar {
  width: min(42px, 35%);
  min-width: 22px;
  border-radius: 10px 10px 4px 4px;
  background: #4b7df0;
  box-shadow: 0 12px 24px rgba(43, 54, 69, 0.14);
}

.media-grouped-chart-bar.tone-green {
  background: linear-gradient(180deg, #42c993, #1aa46f);
}

.media-grouped-chart-bar.tone-orange {
  background: linear-gradient(180deg, #ffc05a, #d9851f);
}

.media-grouped-chart-bar.tone-purple {
  background: linear-gradient(180deg, #a790ff, #7c64ff);
}

.media-grouped-chart-bar.tone-pink {
  background: linear-gradient(180deg, #ff92b4, #e85d8a);
}

.media-grouped-chart-bar.tone-blue {
  background: linear-gradient(180deg, #79a0ff, #4b7df0);
}

.media-grouped-chart-label {
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 900;
  text-align: center;
}

.media-grouped-chart-meta {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
}

.media-grouped-graph {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.media-grouped-graph-stage {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(143, 154, 179, 0.12) 1px, transparent 1px) 0 0 / 100% 25%,
    rgba(255, 255, 255, 0.72);
}

.media-grouped-graph-svg {
  display: block;
  width: 100%;
  min-height: 320px;
}

.media-grouped-graph-grid line {
  stroke: rgba(143, 154, 179, 0.16);
  stroke-width: 1;
}

.media-grouped-graph-area-fill {
  fill: var(--media-graph-color);
  opacity: 0.1;
  mix-blend-mode: multiply;
}

.media-grouped-graph-series-line,
.media-grouped-graph-line {
  fill: none;
  stroke: var(--media-graph-color, #4b7df0);
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 7px 14px rgba(75, 125, 240, 0.14));
}

.media-grouped-graph-point circle {
  fill: var(--media-graph-color);
  stroke: #ffffff;
  stroke-width: 3;
  filter: drop-shadow(0 7px 12px rgba(43, 54, 69, 0.16));
}

.media-grouped-graph-point text,
.media-grouped-graph-axis-label text,
.media-grouped-graph-line-label text {
  fill: var(--text);
  font-weight: 900;
}

.media-grouped-graph-point text {
  text-anchor: end;
  font-size: 0.72rem;
}

.media-grouped-graph-axis-label text,
.media-grouped-graph-line-label text {
  fill: var(--muted);
  font-size: 0.68rem;
}

.media-grouped-graph-axis-label text {
  text-anchor: middle;
}

.media-grouped-graph-line-label text {
  text-anchor: start;
}

.media-grouped-graph-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 18px;
  color: var(--muted);
  font-weight: 800;
  text-align: center;
}

.media-grouped-graph-legend {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.media-grouped-graph-legend-item {
  min-width: 0;
  min-height: 34px;
  padding: 5px 8px;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  font: inherit;
  font-size: 0.7rem;
  font-weight: 850;
  cursor: pointer;
  transition: opacity 0.18s ease, border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}

.media-grouped-graph-legend-item:hover {
  transform: translateY(-1px);
  border-color: rgba(75, 125, 240, 0.26);
  background: rgba(247, 250, 255, 0.96);
}

.media-grouped-graph-legend-item.is-muted {
  opacity: 0.48;
  background: rgba(244, 247, 251, 0.72);
}

.media-grouped-graph-legend-item span:not(.media-grouped-graph-swatch) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-grouped-graph-legend-item strong {
  color: var(--text);
  font-size: 0.7rem;
  font-variant-numeric: tabular-nums;
}

.media-grouped-graph-swatch {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(143, 154, 179, 0.1);
}

.media-split-layout {
  display: grid;
  grid-template-columns: var(--explorer-width, clamp(280px, 24vw, 320px)) minmax(0, 1fr);
  gap: 20px;
}

.media-split-layout.is-explorer-compact {
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 12px;
}

.media-split-layout.is-explorer-compact .media-sidebar-panel {
  min-width: 0;
  padding: 16px 10px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  background: var(--panel-soft);
}

.media-split-layout.is-explorer-hidden {
  grid-template-columns: 0 minmax(0, 1fr);
  gap: 0;
}

.media-split-layout.is-explorer-hidden .media-sidebar-panel {
  min-width: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
}

.media-split-layout.is-explorer-hidden .media-sidebar-panel > * {
  display: none;
}

.media-sidebar-panel.is-collapsed-rail {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 16px 10px;
  background: var(--panel-soft);
}

.media-collapsed-filter-rail {
  display: grid;
  gap: 14px;
  width: 100%;
  align-content: start;
}

.media-collapsed-section {
  display: grid;
  gap: 8px;
}

.media-collapsed-section-title {
  margin: 0;
  text-align: center;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.media-collapsed-button-stack {
  display: grid;
  gap: 8px;
}

.media-collapsed-action-button {
  --shortcut-accent: var(--purple, #8a5cf6);
  --shortcut-soft: rgba(138, 92, 246, 0.12);
  --shortcut-border: rgba(138, 92, 246, 0.22);
  position: relative;
  width: 100%;
  min-height: 60px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.86);
  color: var(--shortcut-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.72);
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease, box-shadow 160ms ease;
}

.media-collapsed-action-button:hover {
  border-color: var(--shortcut-border);
  background: var(--shortcut-soft);
  transform: translateX(1px);
}

.media-collapsed-action-button.is-active {
  border-color: var(--shortcut-border);
  background: var(--shortcut-soft);
  color: var(--shortcut-accent);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82), 0 10px 24px rgba(82, 58, 145, 0.08);
}

.media-collapsed-action-icon {
  display: inline-flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
}

.media-collapsed-action-icon svg {
  width: 28px;
  height: 28px;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-collapsed-action-count {
  position: absolute;
  top: 7px;
  right: 7px;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--shortcut-soft);
  color: var(--shortcut-accent);
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 24px;
  text-align: center;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.media-collapsed-action-button.is-group-albums,
.media-collapsed-action-button.is-state-all,
.media-collapsed-action-button.is-view-grid {
  --shortcut-accent: #8a5cf6;
  --shortcut-soft: rgba(138, 92, 246, 0.14);
  --shortcut-border: rgba(138, 92, 246, 0.24);
}

.media-collapsed-action-button.is-group-tracks,
.media-collapsed-action-button.is-view-list,
.media-collapsed-action-button.is-state-private {
  --shortcut-accent: #4b7df0;
  --shortcut-soft: rgba(75, 125, 240, 0.14);
  --shortcut-border: rgba(75, 125, 240, 0.24);
}

.media-collapsed-action-button.is-group-images {
  --shortcut-accent: #c9892f;
  --shortcut-soft: rgba(201, 137, 47, 0.14);
  --shortcut-border: rgba(201, 137, 47, 0.26);
}

.media-collapsed-action-button.is-sort-newest {
  --shortcut-accent: #8a5cf6;
  --shortcut-soft: rgba(138, 92, 246, 0.14);
  --shortcut-border: rgba(138, 92, 246, 0.24);
}

.media-collapsed-action-button.is-sort-oldest {
  --shortcut-accent: #5f7be8;
  --shortcut-soft: rgba(95, 123, 232, 0.14);
  --shortcut-border: rgba(95, 123, 232, 0.24);
}

.media-collapsed-action-button.is-state-live {
  --shortcut-accent: #1fbf70;
  --shortcut-soft: rgba(31, 191, 112, 0.16);
  --shortcut-border: rgba(31, 191, 112, 0.28);
}

.media-collapsed-action-button.is-state-review {
  --shortcut-accent: #d18a26;
  --shortcut-soft: rgba(209, 138, 38, 0.16);
  --shortcut-border: rgba(209, 138, 38, 0.26);
}

.media-collapsed-action-button.is-state-flagged {
  --shortcut-accent: #de4a68;
  --shortcut-soft: rgba(222, 74, 104, 0.16);
  --shortcut-border: rgba(222, 74, 104, 0.28);
}

.media-collapsed-action-button.is-state-hidden {
  --shortcut-accent: #7f8a9c;
  --shortcut-soft: rgba(127, 138, 156, 0.16);
  --shortcut-border: rgba(127, 138, 156, 0.24);
}

.media-collapsed-action-button.is-state-taken_down,
.media-collapsed-action-button.is-state-takedown {
  --shortcut-accent: #de4a68;
  --shortcut-soft: rgba(222, 74, 104, 0.16);
  --shortcut-border: rgba(222, 74, 104, 0.28);
}

.media-group-stack {
  display: grid;
  gap: 10px;
}

.media-group-button {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.72);
  color: var(--text);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.media-group-button strong {
  color: var(--accent-strong);
}

.media-group-button.is-active {
  border-color: rgba(150, 112, 255, 0.34);
  background: rgba(150, 112, 255, 0.12);
}

.media-filter-section {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}

.media-filter-title {
  margin: 0;
  color: var(--text);
  font-size: 0.92rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.media-sort-chip-row {
  gap: 12px;
}

.media-sort-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-inline: 16px;
  font-weight: 700;
}

.media-sort-chip-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  color: inherit;
}

.media-sort-chip-icon svg {
  width: 16px;
  height: 16px;
  display: block;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-sidebar-note {
  margin-top: 18px;
}

.media-collection-panel {
  align-content: start;
  gap: 14px;
}

.media-load-status {
  min-height: 1.5em;
  line-height: 1.5;
  color: var(--muted);
}

.media-collection-panel .users-directory-head {
  gap: 6px;
}

.media-collection-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.media-collection-view-controls {
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(76px, auto));
  gap: 4px;
  flex: 0 0 auto;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(247, 249, 255, 0.9);
}

.media-collection-view-button {
  min-height: 36px;
  padding: 7px 12px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #43516a;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 850;
  cursor: pointer;
}

.media-collection-view-button[aria-pressed="true"] {
  background: #182943;
  color: #fff;
  box-shadow: 0 8px 18px rgba(24, 41, 67, 0.2);
}

.media-collection-view-button:focus-visible {
  outline: 2px solid #7653e8;
  outline-offset: 2px;
}

.media-collection-panel .section-note {
  line-height: 1.38;
}

.media-collection-panel .media-toolbar {
  margin: 0;
}

.media-results-head {
  margin: 0;
}

.media-collection-grid {
  display: grid;
  gap: 14px;
}

.media-collection-grid.is-grid {
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.media-collection-grid.is-compact {
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.media-item-card {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.media-item-card[data-media-select] {
  cursor: pointer;
}

.media-item-card.is-active {
  border-color: rgba(122, 97, 255, 0.34);
  box-shadow: 0 18px 36px rgba(122, 97, 255, 0.12);
}

.media-item-card.is-list {
  grid-template-columns: 92px minmax(0, 1fr) minmax(220px, auto);
  align-items: center;
}

.media-item-card.is-grid {
  grid-template-columns: 1fr;
}

.media-item-card.is-compact {
  grid-template-columns: 64px minmax(0, 1fr) minmax(220px, auto);
  align-items: center;
  gap: 12px;
  min-height: 84px;
  padding: 10px 12px;
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(43, 54, 69, 0.06);
}

.media-item-card.is-compact .media-item-figure {
  width: 64px;
  height: 64px;
  border-radius: 12px;
}

.media-item-card.is-compact .media-item-copy {
  display: flex;
  align-items: center;
  gap: 7px 12px;
  flex-wrap: wrap;
}

.media-item-card.is-compact .list-card-title,
.media-item-card.is-compact .detail-meta,
.media-item-card.is-compact .list-card-copy {
  margin: 0;
}

.media-item-card.is-compact .list-card-title {
  flex: 0 1 auto;
}

.media-item-card.is-compact .detail-meta,
.media-item-card.is-compact .list-card-copy {
  padding-left: 12px;
  border-left: 1px solid rgba(143, 154, 179, 0.24);
  white-space: nowrap;
}

.media-item-card.is-compact .chip-row {
  gap: 6px;
}

.media-item-card.is-compact .media-item-side {
  min-width: 220px;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.media-item-card.is-compact .media-item-status,
.media-item-card.is-compact .media-item-actions {
  gap: 6px;
}

.media-item-card.is-compact .admin-button {
  min-height: 38px;
}

.media-item-card.is-grid .media-item-side {
  min-width: 0;
  justify-items: start;
}

.media-item-card.is-grid .media-item-status,
.media-item-card.is-grid .media-item-actions {
  justify-content: flex-start;
}

.media-item-figure {
  width: 92px;
  height: 92px;
  border-radius: 22px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(124, 100, 255, 0.16), rgba(88, 196, 255, 0.16));
  box-shadow: inset 0 0 0 1px rgba(124, 100, 255, 0.12);
}

.media-item-card.is-grid .media-item-figure {
  width: 100%;
  height: 188px;
}

.media-item-figure img,
.media-item-figure canvas {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.media-item-figure canvas[data-media-image-state="loading"] {
  background: linear-gradient(110deg, rgba(124, 100, 255, 0.08) 8%, rgba(255, 255, 255, 0.78) 18%, rgba(124, 100, 255, 0.08) 33%);
  background-size: 220% 100%;
  animation: media-protected-image-loading 1.1s linear infinite;
}

@keyframes media-protected-image-loading {
  to { background-position-x: -220%; }
}

.media-item-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: var(--accent-strong);
  font-size: 2rem;
  font-weight: 900;
}

.media-placeholder-card {
  border: 1px solid var(--line);
}

.media-detail-placeholder {
  min-height: 320px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: rgba(246, 247, 255, 0.8);
  font-size: 3rem;
}

.media-item-copy {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.media-item-side {
  min-width: 220px;
  display: grid;
  align-content: center;
  justify-items: end;
  gap: 14px;
}

.media-item-status {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  width: 100%;
}

.media-item-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.media-download-icon-button {
  width: 46px;
  min-width: 46px;
  padding: 0;
  overflow: hidden;
}

.media-report-message-icon-button {
  width: 46px;
  min-width: 46px;
  padding: 0;
}

.media-download-action-button {
  gap: 8px;
}

.media-download-icon {
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
}

.media-download-icon svg {
  width: 20px;
  height: 20px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-download-icon svg circle {
  fill: currentColor;
  stroke: none;
}

.media-download-icon-image-shell {
  width: 26px;
  height: 26px;
}

.media-download-symbol-image {
  display: block;
  width: 26px;
  height: 26px;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

.media-download-button-label {
  font-weight: 850;
  white-space: nowrap;
}

.media-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 4px;
}

@media (max-width: 1320px) {
  .media-item-card.is-list {
    grid-template-columns: 92px minmax(0, 1fr);
  }

  .media-item-side {
    grid-column: 2;
    min-width: 0;
    justify-items: start;
  }

  .media-item-status,
  .media-item-actions {
    justify-content: flex-start;
  }

  .media-collection-head {
    align-items: stretch;
    flex-direction: column;
  }

  .media-collection-view-controls {
    width: fit-content;
  }
}

@media (max-width: 720px) {
  .media-collection-view-controls {
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .media-item-card.is-compact {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .media-item-card.is-compact .media-item-figure {
    width: 52px;
    height: 52px;
  }

  .media-item-card.is-compact .media-item-side {
    grid-column: 1 / -1;
  }
}

.media-preview-card {
  gap: 18px;
}

.media-detail-stack .user-action-grid {
  grid-template-columns: 1fr;
}

.media-detail-stack .user-action-grid .admin-button {
  width: 100%;
  min-height: 48px;
  white-space: normal;
  line-height: 1.18;
  text-align: center;
}

.media-interaction-card .donut-summary {
  gap: 18px;
}

.media-preview-shell {
  display: grid;
  gap: 14px;
}

.media-detail-artwork {
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 360px;
  object-fit: cover;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.9);
}

.media-detail-artwork-link {
  position: relative;
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  border-radius: 22px;
  color: inherit;
  cursor: pointer;
  overflow: hidden;
  font: inherit;
  text-align: inherit;
  text-decoration: none;
}

.media-detail-artwork-link .media-detail-artwork {
  display: block;
  transition: transform 180ms ease, filter 180ms ease;
}

.media-detail-artwork-action {
  position: absolute;
  inset: auto 14px 14px auto;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 12px;
  border: 1px solid rgba(255, 255, 255, 0.44);
  border-radius: 999px;
  background: rgba(17, 24, 39, 0.72);
  color: #ffffff;
  font-size: 0.78rem;
  font-weight: 850;
  line-height: 1;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 160ms ease, transform 160ms ease;
  pointer-events: none;
  box-shadow: 0 12px 26px rgba(15, 23, 42, 0.22);
}

.media-detail-artwork-link:hover .media-detail-artwork,
.media-detail-artwork-link:focus-visible .media-detail-artwork {
  filter: saturate(1.06) brightness(0.94);
  transform: scale(1.015);
}

.media-detail-artwork-link:hover .media-detail-artwork-action,
.media-detail-artwork-link:focus-visible .media-detail-artwork-action {
  opacity: 1;
  transform: translateY(0);
}

.media-detail-artwork-link:focus-visible {
  outline: 3px solid rgba(124, 100, 255, 0.32);
  outline-offset: 4px;
}

.media-detail-artwork.is-image {
  object-fit: contain;
  background: rgba(246, 247, 255, 0.8);
}

.media-protected-image-viewer[hidden] {
  display: none;
}

.media-protected-image-viewer {
  position: fixed;
  inset: 0;
  z-index: 2400;
  display: grid;
  place-items: center;
  padding: clamp(18px, 4vw, 54px);
  background: rgba(12, 17, 29, 0.72);
  backdrop-filter: blur(12px);
}

.media-protected-image-viewer-card {
  display: grid;
  gap: 16px;
  width: min(960px, 100%);
  max-height: calc(100vh - clamp(36px, 8vw, 108px));
  padding: clamp(18px, 2.4vw, 30px);
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: var(--panel);
  box-shadow: 0 30px 90px rgba(5, 9, 20, 0.34);
}

.media-protected-image-viewer-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.media-protected-image-viewer-canvas {
  display: block;
  width: 100%;
  height: min(68vh, 760px);
  min-height: 320px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #f6f7ff;
}

.has-media-protected-image-viewer {
  overflow: hidden;
}

@media (max-width: 720px) {
  .media-protected-image-viewer {
    padding: 10px;
  }

  .media-protected-image-viewer-card {
    max-height: calc(100vh - 20px);
    border-radius: 18px;
  }

  .media-protected-image-viewer-canvas {
    min-height: 240px;
    height: min(58vh, 540px);
  }
}

.media-preview-audio {
  width: 100%;
}

.media-review-hold-warning {
  color: #ff7cc8;
  font-weight: 800;
  line-height: 1.45;
}

.media-review-hold-row {
  align-items: flex-start;
}

.media-review-hold-row .detail-meta {
  padding-top: 8px;
}

.media-review-hold-content {
  display: grid;
  justify-items: stretch;
  flex: 1 1 240px;
  width: min(100%, 420px);
  min-width: 0;
  max-width: 100%;
  gap: 8px;
  text-align: left;
}

.media-review-hold-text {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  max-height: 168px;
  color: var(--text);
  text-overflow: clip;
  white-space: normal;
}

.media-review-hold-row.is-expanded .media-review-hold-text {
  overflow: visible;
  max-height: none;
  text-overflow: clip;
  white-space: normal;
}

.media-review-hold-overview {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid rgba(216, 79, 145, 0.22);
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255, 244, 249, 0.98), rgba(255, 235, 244, 0.82));
}

.media-review-hold-eyebrow,
.media-review-context-heading {
  color: #9f2d63;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.1;
  text-transform: uppercase;
}

.media-review-hold-title {
  color: #b91c5c;
  font-size: 0.96rem;
  font-weight: 800;
  line-height: 1.22;
}

.media-review-hold-extra {
  display: grid;
  gap: 8px;
}

.media-review-hold-row:not(.is-expanded) .media-review-hold-extra {
  display: none;
}

.media-review-signal-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.media-review-signal {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 9px;
  border-radius: 999px;
  background: rgba(216, 79, 145, 0.1);
  color: #b91c5c;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.1;
}

.media-review-context-list {
  display: grid;
  gap: 8px;
  padding-top: 2px;
}

.media-review-context-item {
  display: grid;
  gap: 5px;
  padding: 10px 12px;
  border-left: 3px solid #d84f91;
  border-radius: 12px;
  background: rgba(248, 250, 252, 0.92);
}

.media-review-context-label {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.1;
  text-transform: uppercase;
}

.media-review-context-text {
  color: var(--text);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.media-review-context-finding {
  display: flex;
  align-items: baseline;
  gap: 6px;
  color: #dc2626;
  font-size: 0.8rem;
  line-height: 1.25;
}

.media-review-context-finding span,
.media-review-context-note {
  color: var(--muted);
  font-weight: 700;
}

.media-review-context-finding strong {
  color: #dc2626;
  font-weight: 800;
}

.media-review-context-note {
  font-size: 0.78rem;
  line-height: 1.25;
}

.media-review-incidents-content {
  display: grid;
  gap: 10px;
  flex: 1 1 240px;
  width: min(100%, 420px);
  min-width: 0;
}

.media-review-incidents-toggle {
  appearance: none;
  border: 1px solid rgba(124, 92, 255, 0.2);
  border-radius: 999px;
  background: rgba(124, 92, 255, 0.08);
  color: #7c5cff;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  justify-self: start;
  max-width: 100%;
  padding: 9px 13px;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.media-review-incidents-count {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.media-review-incidents-row:not(.is-expanded) .media-review-incidents-list {
  display: none;
}

.media-review-incidents-row.is-expanded .media-review-incidents-toggle {
  border-color: rgba(216, 79, 145, 0.26);
  background: rgba(216, 79, 145, 0.08);
  color: #b91c5c;
}

.media-review-hold-toggle {
  display: none;
  appearance: none;
  border: 0;
  background: transparent;
  color: #7c5cff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0;
  cursor: pointer;
  justify-self: end;
}

.media-review-hold-row.is-overflowing .media-review-hold-toggle {
  display: inline-flex;
}

.media-dispute-response-row {
  align-items: flex-start;
}

.media-dispute-response-row strong {
  max-width: 100%;
  text-align: right;
  line-height: 1.35;
  white-space: normal;
}

.media-report-note-row {
  align-items: flex-start;
}

.media-report-note-row strong {
  display: grid;
  justify-items: end;
  gap: 6px;
  min-width: 0;
  max-width: 100%;
  text-align: right;
  line-height: 1.35;
  font-weight: 400;
}

.media-report-note-text {
  color: #dc2626;
  font-weight: 400;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-report-note-row.is-expanded .media-report-note-text {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

.media-report-note-toggle {
  display: none;
  appearance: none;
  border: 0;
  background: transparent;
  color: #7c5cff;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0;
  cursor: pointer;
}

.media-report-note-row.is-overflowing .media-report-note-toggle {
  display: inline-flex;
}

.media-report-reply-row {
  display: grid;
  grid-template-columns: minmax(92px, max-content) minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}

.media-report-reply-row strong {
  justify-self: stretch;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.media-report-reply-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: 100%;
  max-width: 100%;
  gap: 8px;
}

.media-report-reply-actions.media-single-reply-action {
  grid-template-columns: minmax(0, 1fr);
}

.media-report-reply-actions .admin-button {
  width: 100%;
  min-height: 46px;
  min-width: 0;
  justify-content: center;
  padding: 8px 10px;
  line-height: 1.12;
  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
}

.media-empty-state {
  grid-column: 1 / -1;
}

.users-engagement-card {
  padding: 20px 22px;
}

.users-engagement-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.users-engagement-head-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  margin-left: auto;
}

.users-engagement-carousel-controls {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.users-engagement-carousel-controls[hidden] {
  display: none;
}

.users-engagement-carousel-status {
  min-width: 92px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 700;
  text-align: right;
}

.users-engagement-carousel-arrow {
  width: 40px;
  height: 40px;
  border-radius: 12px;
}

.users-engagement-carousel-viewport {
  --users-engagement-gap: 16px;
  --users-engagement-visible-columns: 1;
  overflow-x: auto;
  overflow-y: visible;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

.users-engagement-carousel-viewport::-webkit-scrollbar {
  display: none;
}

.users-engagement-grid {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - ((var(--users-engagement-visible-columns, 1) - 1) * var(--users-engagement-gap, 16px))) / var(--users-engagement-visible-columns, 1));
  grid-template-rows: repeat(2, minmax(142px, auto));
  gap: var(--users-engagement-gap);
}

.users-engagement-metric-card {
  min-height: 142px;
  scroll-snap-align: start;
}

.users-holdings-card {
    display: grid;
    gap: 16px;
    align-content: start;
    padding: 20px 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(124, 100, 255, 0.08), rgba(88, 196, 255, 0.06)),
    #ffffff;
  box-shadow: var(--shadow);
}

.users-holdings-head {
  display: grid;
  gap: 8px;
}

.users-holdings-title {
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.2;
  color: var(--text);
}

.users-holdings-stack {
  display: grid;
  gap: 12px;
}

.users-holdings-stat {
  display: grid;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(124, 100, 255, 0.08);
}

.users-holdings-stat-label {
  color: var(--muted);
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 800;
}

.users-holdings-stat-value {
  color: var(--text);
  font-size: 2rem;
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.users-holdings-stat-meta {
  color: var(--muted);
  font-size: 0.92rem;
  line-height: 1.45;
}

.credit-progress-stack {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.credit-progress-row {
  display: grid;
  gap: 5px;
}

.credit-progress-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 10px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.credit-progress-label {
  min-width: 0;
  white-space: nowrap;
}

.credit-progress-head strong {
  flex: 0 0 auto;
  color: var(--text);
  font-size: 0.8rem;
  line-height: inherit;
  text-align: right;
  white-space: nowrap;
}

.credit-progress-track {
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(143, 154, 179, 0.18);
}

.credit-progress-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #4b7df0, #79a0ff);
}

.credit-progress-row.tone-green .credit-progress-fill {
  background: linear-gradient(90deg, #1aa46f, #42c993);
}

.credit-progress-row.tone-purple .credit-progress-fill {
  background: linear-gradient(90deg, #7c64ff, #a790ff);
}

.credit-progress-meta {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
}

.users-holdings-detail-list {
  display: grid;
  gap: 10px;
}

.users-holdings-detail-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding-top: 10px;
  border-top: 1px solid rgba(143, 154, 179, 0.18);
  color: var(--muted);
  font-size: 0.94rem;
}

.users-holdings-detail-row strong {
  color: var(--text);
  font-weight: 700;
  text-align: right;
  max-width: 58%;
}

.users-split-layout {
  display: grid;
  grid-template-columns: var(--explorer-width, clamp(280px, 26vw, 330px)) minmax(0, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: var(--shadow);
}

.users-split-layout.is-explorer-collapsed {
  grid-template-columns: 74px minmax(0, 1fr);
}

.users-split-layout > .panel-section {
  min-width: 0;
  background: #ffffff;
}

.users-split-layout > .panel-section:first-child {
  background: var(--panel-soft);
}

.users-split-layout.is-explorer-collapsed .users-segments-panel {
  min-width: 0;
  padding: 0;
  overflow: hidden;
}

.users-split-layout.is-explorer-collapsed .users-segments-panel:not(.is-collapsed-rail) > * {
  display: none;
}

.users-segments-panel.is-collapsed-rail {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 8px 6px 10px;
  background: var(--panel-soft);
}

.collapsed-filter-rail {
  display: grid;
  gap: 10px;
  width: 100%;
}

.collapsed-filter-button {
  width: 100%;
  min-height: 54px;
  border-radius: 18px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.86);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
  font: inherit;
  font-weight: 700;
  letter-spacing: 0.01em;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.collapsed-filter-button:hover {
  border-color: rgba(118, 83, 255, 0.26);
  color: var(--text);
  transform: translateX(1px);
}

.collapsed-filter-button.is-active {
  border-color: rgba(118, 83, 255, 0.26);
  background: rgba(150, 112, 255, 0.16);
  color: var(--accent-strong);
}

.collapsed-filter-button:disabled,
.admin-button:disabled {
  cursor: wait;
  opacity: 0.66;
}

.collapsed-filter-button--icon {
  min-height: 58px;
  padding: 8px;
}

.collapsed-filter-button-icon-shell {
  display: inline-grid;
  place-items: center;
}

.collapsed-filter-button--icon .collapsed-filter-button-label {
  display: none;
}

.collapsed-filter-button-icon {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
}

.collapsed-filter-button-icon svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-rail {
  justify-items: center;
  align-content: start;
  grid-auto-rows: max-content;
  gap: 8px;
  padding-top: 2px;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--icon {
  width: 54px;
  min-width: 54px;
  min-height: 62px;
  padding: 8px 6px;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 14px 28px rgba(58, 48, 112, 0.08);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--icon:hover {
  transform: translateY(-1px);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button-icon-shell {
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: rgba(124, 100, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(124, 100, 255, 0.08);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button-icon {
  width: 24px;
  height: 24px;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button-icon svg {
  width: 22px;
  height: 22px;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--all {
  color: #6c5cff;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--all .collapsed-filter-button-icon-shell {
  background: rgba(108, 92, 255, 0.12);
  box-shadow: inset 0 0 0 1px rgba(108, 92, 255, 0.16);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--paid {
  color: #4d79ff;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--paid .collapsed-filter-button-icon-shell {
  background: rgba(77, 121, 255, 0.12);
  box-shadow: inset 0 0 0 1px rgba(77, 121, 255, 0.16);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--free {
  color: #26bfa0;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--free .collapsed-filter-button-icon-shell {
  background: rgba(38, 191, 160, 0.12);
  box-shadow: inset 0 0 0 1px rgba(38, 191, 160, 0.16);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--admins {
  color: #c7862f;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--admins .collapsed-filter-button-icon-shell {
  background: rgba(199, 134, 47, 0.12);
  box-shadow: inset 0 0 0 1px rgba(199, 134, 47, 0.16);
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--refresh {
  margin-top: 4px;
  color: #7f8a9c;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--refresh .collapsed-filter-button-icon-shell {
  background: rgba(127, 138, 156, 0.14);
  box-shadow: inset 0 0 0 1px rgba(127, 138, 156, 0.2);
}

.collapsed-filter-button.is-loading .collapsed-filter-button-icon,
.users-sidebar-refresh-button.is-loading .users-sidebar-refresh-icon {
  animation: admin-refresh-spin 900ms linear infinite;
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--icon.is-active {
  background: linear-gradient(180deg, rgba(150, 112, 255, 0.18), rgba(255, 255, 255, 0.96));
}

.users-segments-panel.is-collapsed-rail .collapsed-filter-button--icon.is-active .collapsed-filter-button-icon-shell {
  transform: scale(1.03);
}

.collapsed-filter-button-label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  line-height: 1;
  white-space: nowrap;
}

.users-segments-group {
  display: grid;
  gap: 16px;
}

.users-matches-scroll-list {
  max-height: min(58vh, 760px);
  overflow-y: auto;
  padding-right: 8px;
  align-content: start;
}

.users-sidebar-refresh-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #7f8a9c;
}

.users-sidebar-refresh-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
}

.users-sidebar-refresh-icon svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

@keyframes admin-refresh-spin {
  to {
    transform: rotate(360deg);
  }
}

.list-card {
  padding: 14px 16px;
  display: grid;
  gap: 10px;
}

.list-card.is-active,
.table-row.is-selected-row {
  border-color: rgba(75, 125, 240, 0.26);
  background: linear-gradient(135deg, rgba(75, 125, 240, 0.1), rgba(75, 125, 240, 0.02));
}

.list-card-title {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.list-card-name {
  font-weight: 700;
}

.list-card-meta,
.list-card-copy,
.detail-meta {
  color: var(--muted);
  line-height: 1.45;
}

.user-feedback-rating-cell {
  min-width: 0;
}

.user-feedback-rating-stars {
  display: inline-flex;
  gap: 2px;
  color: rgba(148, 163, 184, 0.7);
  font-size: 0.86rem;
  line-height: 1;
  white-space: nowrap;
}

.user-feedback-rating-stars .is-filled {
  color: #f2a833;
}

.mini-list,
.activity-list,
.detail-list {
  display: grid;
  gap: 12px;
}

.inbox-explorer-shell {
  position: relative;
  min-height: 100%;
}

.inbox-explorer-shell .workspace-collapse-toggle--edge {
  left: auto;
  right: 12px;
  top: 22px;
  transform: none;
}

.inbox-explorer-shell .workspace-collapse-toggle:hover {
  transform: scale(1.02);
}

.inbox-explorer-shell.is-collapsed {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 100%;
  padding: 84px 10px 24px;
}

.settings-explorer-shell {
  position: relative;
  min-height: 100%;
}

.settings-explorer-shell > .panel-stack {
  padding-top: 28px;
  padding-right: 60px;
}

.settings-groups-header {
  gap: 0;
}

.settings-groups-header-copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-groups-toggle-button {
  position: absolute;
  top: 22px;
  right: 12px;
  z-index: 5;
  width: 42px;
  height: 52px;
  border-radius: 18px;
  box-shadow:
    0 16px 28px rgba(58, 48, 112, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
  transform: none;
}

.settings-groups-toggle-button:hover {
  transform: translateX(1px) scale(1.02);
}

.settings-groups-toggle-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  transition: transform 160ms ease;
}

.settings-groups-toggle-icon svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-groups-toggle-button.is-expanded .settings-groups-toggle-icon {
  transform: rotate(180deg);
}

.settings-detail-collapse-toggle {
  position: sticky;
  top: calc(50vh - 26px);
  grid-row: 1;
  grid-column: 1;
  align-self: start;
  justify-self: start;
  z-index: 12;
  width: 44px;
  height: 56px;
  margin: 22px 0 0 -23px;
  border: 1px solid rgba(132, 111, 255, 0.22);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--accent-strong);
  box-shadow:
    0 18px 34px rgba(58, 48, 112, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease;
}

.admin-panels.is-settings-layout .settings-detail-stack {
  grid-row: 1;
  grid-column: 1;
}

.settings-detail-collapse-toggle:hover {
  transform: translateX(-1px) scale(1.02);
  border-color: rgba(132, 111, 255, 0.38);
  background: #ffffff;
}

.settings-detail-collapse-icon {
  display: inline-flex;
  width: 19px;
  height: 19px;
  align-items: center;
  justify-content: center;
  transition: transform 160ms ease;
}

.settings-detail-collapse-icon svg {
  width: 19px;
  height: 19px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-detail-collapse-toggle.is-collapsed .settings-detail-collapse-icon {
  transform: rotate(180deg);
}

.admin-panels.is-settings-detail-collapsed .admin-panel-detail {
  background:
    linear-gradient(180deg, rgba(246, 242, 255, 0.92), rgba(255, 255, 255, 0.82)),
    var(--panel-soft);
}

.admin-panels.is-settings-detail-collapsed .settings-detail-stack {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(18px);
}

.inbox-detail-shell {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: visible;
}

.inbox-detail-stack {
  grid-row: 1;
  grid-column: 1;
  min-width: 0;
  min-height: 0;
  align-content: start;
  overflow: auto;
  transition:
    opacity 160ms ease,
    visibility 160ms ease,
    transform 160ms ease;
}

.inbox-detail-collapse-toggle {
  position: sticky;
  top: calc(50vh - 26px);
  grid-row: 1;
  grid-column: 1;
  align-self: start;
  justify-self: start;
  z-index: 12;
  width: 44px;
  height: 56px;
  margin: 22px 0 0 -23px;
  border: 1px solid rgba(132, 111, 255, 0.22);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  color: #27334f;
  box-shadow:
    0 18px 34px rgba(58, 48, 112, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    background 160ms ease,
    box-shadow 160ms ease;
}

.inbox-detail-collapse-toggle:hover {
  transform: translateX(-1px) scale(1.02);
  border-color: rgba(132, 111, 255, 0.38);
  background: #ffffff;
}

.inbox-detail-collapse-toggle:focus-visible {
  outline: 3px solid rgba(132, 111, 255, 0.24);
  outline-offset: 3px;
}

.inbox-detail-collapse-icon {
  display: inline-flex;
  width: 19px;
  height: 19px;
  align-items: center;
  justify-content: center;
}

.inbox-detail-collapse-icon svg {
  width: 19px;
  height: 19px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-panels.is-inbox-detail-collapsed .admin-panel-detail {
  background:
    linear-gradient(180deg, rgba(246, 242, 255, 0.92), rgba(255, 255, 255, 0.82)),
    var(--panel-soft);
}

.admin-panels.is-inbox-detail-collapsed .inbox-detail-stack {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(18px);
}

.admin-panels.is-users-detail-collapsed .admin-panel-detail {
  background:
    linear-gradient(180deg, rgba(246, 242, 255, 0.92), rgba(255, 255, 255, 0.82)),
    var(--panel-soft);
}

.admin-panels.is-users-detail-collapsed .users-detail-stack {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(18px);
}

.settings-explorer-shell.is-collapsed {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 100%;
  padding: 18px 10px 24px;
}

.settings-group-card {
  position: relative;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
  padding: 16px 18px;
  border-radius: 24px;
  text-align: left;
  overflow: hidden;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(248, 245, 255, 0.92));
  box-shadow:
    0 18px 36px rgba(58, 48, 112, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.settings-group-card::before {
  content: "";
  position: absolute;
  inset: 12px auto 12px 12px;
  width: 4px;
  border-radius: 999px;
  background: var(--settings-group-accent, rgba(118, 83, 255, 0.22));
  opacity: 0.92;
}

.settings-group-card-icon-shell {
  position: relative;
  z-index: 1;
  display: inline-flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 18px;
  color: var(--settings-group-accent-strong, var(--accent-strong));
  background: var(--settings-group-soft, rgba(118, 83, 255, 0.1));
  box-shadow:
    inset 0 0 0 1px var(--settings-group-line, rgba(118, 83, 255, 0.12)),
    0 10px 18px rgba(58, 48, 112, 0.08);
}

.settings-group-card-icon {
  display: inline-flex;
  width: 26px;
  height: 26px;
  align-items: center;
  justify-content: center;
}

.settings-group-card-icon svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-group-card-body {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-group-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.settings-group-card-state {
  flex: none;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--settings-group-soft, rgba(118, 83, 255, 0.1));
  color: var(--settings-group-accent-strong, var(--accent-strong));
  box-shadow: inset 0 0 0 1px var(--settings-group-line, rgba(118, 83, 255, 0.12));
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.settings-group-card.is-active {
  border-color: rgba(118, 83, 255, 0.24);
  background: linear-gradient(135deg, rgba(118, 83, 255, 0.14), rgba(255, 255, 255, 0.98));
}

.settings-group-card.is-active .settings-group-card-icon-shell {
  transform: translateY(-1px);
  box-shadow:
    inset 0 0 0 1px rgba(118, 83, 255, 0.18),
    0 14px 26px rgba(118, 83, 255, 0.16);
}

.settings-group-card.is-active .settings-group-card-state {
  background: rgba(118, 83, 255, 0.16);
  color: #5d3dd8;
}

.settings-group-card--billing {
  --settings-group-accent: #7a5cff;
  --settings-group-accent-strong: #6b4dff;
  --settings-group-soft: rgba(122, 92, 255, 0.12);
  --settings-group-line: rgba(122, 92, 255, 0.16);
}

.settings-group-card--admins {
  --settings-group-accent: #4a8fff;
  --settings-group-accent-strong: #377ef0;
  --settings-group-soft: rgba(74, 143, 255, 0.12);
  --settings-group-line: rgba(74, 143, 255, 0.16);
}

.settings-group-card--ai {
  --settings-group-accent: #28c7b2;
  --settings-group-accent-strong: #11a995;
  --settings-group-soft: rgba(40, 199, 178, 0.14);
  --settings-group-line: rgba(40, 199, 178, 0.18);
}

.settings-group-card--limits {
  --settings-group-accent: #2f9a72;
  --settings-group-accent-strong: #23835f;
  --settings-group-soft: rgba(47, 154, 114, 0.14);
  --settings-group-line: rgba(47, 154, 114, 0.18);
}

.settings-group-card--maintenance {
  --settings-group-accent: #d44f68;
  --settings-group-accent-strong: #b93550;
  --settings-group-soft: rgba(212, 79, 104, 0.14);
  --settings-group-line: rgba(212, 79, 104, 0.2);
}

.settings-group-card--storage {
  --settings-group-accent: #d89a2b;
  --settings-group-accent-strong: #b97c11;
  --settings-group-soft: rgba(216, 154, 43, 0.14);
  --settings-group-line: rgba(216, 154, 43, 0.18);
}

.settings-group-card--visuals {
  --settings-group-accent: #ff8c7e;
  --settings-group-accent-strong: #f36d57;
  --settings-group-soft: rgba(255, 140, 126, 0.14);
  --settings-group-line: rgba(255, 140, 126, 0.18);
}

.settings-group-card--audit {
  --settings-group-accent: #7e6cf2;
  --settings-group-accent-strong: #6a56e9;
  --settings-group-soft: rgba(126, 108, 242, 0.14);
  --settings-group-line: rgba(126, 108, 242, 0.18);
}

.settings-groups-panel.is-collapsed-rail {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding: 48px 0 10px;
  border: 1px solid rgba(118, 83, 255, 0.08);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(246, 242, 255, 0.94), rgba(255, 255, 255, 0.82));
  box-shadow:
    0 18px 36px rgba(58, 48, 112, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.settings-groups-panel.is-collapsed-rail::before {
  content: "";
  position: absolute;
  top: 18px;
  left: 50%;
  width: 42px;
  height: 4px;
  border-radius: 999px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, rgba(118, 83, 255, 0.58), rgba(118, 83, 255, 0.14));
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-rail {
  justify-items: center;
  gap: 10px;
  padding-top: 0;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--icon {
  position: relative;
  width: 68px;
  min-width: 68px;
  min-height: 84px;
  padding: 10px 6px 12px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 244, 255, 0.92));
  box-shadow:
    0 16px 30px rgba(58, 48, 112, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--icon:hover {
  transform: translateY(-2px);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button-icon-shell {
  width: 42px;
  height: 42px;
  border-radius: 16px;
  background: rgba(124, 100, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(124, 100, 255, 0.1);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button-icon {
  width: 24px;
  height: 24px;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button-icon svg {
  width: 22px;
  height: 22px;
}

.settings-collapsed-group-button::after {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 50%;
  width: 34px;
  height: 3px;
  border-radius: 999px;
  transform: translateX(-50%) scaleX(0.45);
  transform-origin: center;
  background: currentColor;
  opacity: 0;
  transition: transform 160ms ease, opacity 160ms ease;
}

.settings-collapsed-group-button.is-active::after {
  opacity: 0.92;
  transform: translateX(-50%) scaleX(1);
}

.settings-collapsed-group-button.is-active .collapsed-filter-button-icon-shell {
  transform: scale(1.04);
}

.settings-collapsed-group-button {
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}

.settings-collapsed-group-label {
  display: block;
  max-width: 100%;
  color: currentColor;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
  opacity: 0.76;
}

.settings-collapsed-group-button.is-active .settings-collapsed-group-label {
  opacity: 1;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--billing {
  color: #7a5cff;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--billing .collapsed-filter-button-icon-shell {
  background: rgba(122, 92, 255, 0.12);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--admins {
  color: #4a8fff;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--admins .collapsed-filter-button-icon-shell {
  background: rgba(74, 143, 255, 0.12);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--ai {
  color: #28c7b2;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--ai .collapsed-filter-button-icon-shell {
  background: rgba(40, 199, 178, 0.12);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--storage {
  color: #d89a2b;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--storage .collapsed-filter-button-icon-shell {
  background: rgba(216, 154, 43, 0.12);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--visuals {
  color: #ff8c7e;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--visuals .collapsed-filter-button-icon-shell {
  background: rgba(255, 140, 126, 0.12);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--audit {
  color: #7e6cf2;
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--audit .collapsed-filter-button-icon-shell {
  background: rgba(126, 108, 242, 0.12);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--icon.is-active {
  border-color: rgba(118, 83, 255, 0.3);
  background: linear-gradient(180deg, rgba(244, 238, 255, 0.96), rgba(234, 226, 255, 0.92));
  box-shadow:
    0 18px 32px rgba(118, 83, 255, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.settings-groups-panel.is-collapsed-rail .collapsed-filter-button--icon.is-active .collapsed-filter-button-icon-shell {
  background: rgba(118, 83, 255, 0.16);
  box-shadow: inset 0 0 0 1px rgba(118, 83, 255, 0.14);
}

.settings-canvas-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 18px;
  min-height: var(--settings-panel-height, calc(100vh - 220px));
  height: var(--settings-panel-height, auto);
  max-height: var(--settings-panel-height, none);
  box-sizing: border-box;
  overflow: hidden;
}

.settings-section-room-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 250, 253, 0.82)),
    #ffffff;
  box-shadow: 0 12px 28px rgba(31, 37, 52, 0.06);
}

.settings-section-room-handle {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px dashed rgba(118, 83, 255, 0.34);
  border-radius: 14px;
  background: rgba(246, 242, 255, 0.72);
  color: #344154;
  cursor: ns-resize;
  touch-action: none;
  user-select: none;
  transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.settings-section-room-handle:hover,
.settings-section-room-handle:focus-visible,
.settings-section-room-handle.is-resizing {
  border-color: rgba(118, 83, 255, 0.68);
  background: rgba(239, 234, 255, 0.96);
  box-shadow:
    0 0 0 3px rgba(118, 83, 255, 0.1),
    0 14px 30px rgba(118, 83, 255, 0.12);
  transform: translateY(-1px);
}

.settings-section-room-handle:focus-visible {
  outline: 3px solid rgba(118, 83, 255, 0.2);
  outline-offset: 2px;
}

.settings-section-room-grip {
  display: grid;
  gap: 3px;
  width: 22px;
}

.settings-section-room-grip::before,
.settings-section-room-grip::after {
  content: "";
  display: block;
  height: 3px;
  border-radius: 999px;
  background: rgba(118, 83, 255, 0.62);
}

.settings-section-room-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-section-room-copy strong {
  color: #2f3748;
  font-size: 0.82rem;
  font-weight: 950;
}

.settings-section-room-copy span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 760;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-section-room-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 78px;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(118, 83, 255, 0.12);
  color: #6b4dff;
  font-size: 0.78rem;
  font-weight: 950;
  white-space: nowrap;
}

.settings-section-room-reset {
  min-height: 42px;
  white-space: nowrap;
}

@media (max-width: 740px) {
  .settings-section-room-control,
  .settings-section-room-handle {
    grid-template-columns: 1fr;
  }

  .settings-section-room-copy span {
    white-space: normal;
  }

  .settings-section-room-value {
    justify-content: flex-start;
    width: fit-content;
  }
}

.settings-canvas-header {
  align-content: start;
}

.settings-category-nav {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  overflow-x: auto;
  padding: 4px 2px 8px;
  scrollbar-width: thin;
}

.settings-category-nav-button {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 999px;
  background: rgba(247, 250, 255, 0.88);
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.settings-category-nav-button:hover,
.settings-category-nav-button:focus-visible {
  border-color: rgba(118, 83, 255, 0.3);
  color: var(--accent-strong);
  transform: translateY(-1px);
}

.settings-category-nav-button.is-active {
  border-color: rgba(118, 83, 255, 0.34);
  background: linear-gradient(135deg, rgba(118, 83, 255, 0.18), rgba(224, 216, 255, 0.92));
  color: #6b4dff;
  box-shadow: inset 0 0 0 1px rgba(118, 83, 255, 0.08);
}

.is-settings-category-hidden[hidden],
.settings-canvas-grid [hidden] {
  display: none !important;
}

.settings-canvas-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  align-items: start;
}

.settings-canvas-grid > * {
  min-width: 0;
}

.settings-grid-span-full {
  grid-column: 1 / -1;
}

.settings-vertical-card-list {
  display: grid;
  gap: 16px;
  align-items: stretch;
  grid-template-columns: 1fr;
  width: 100%;
  min-width: 0;
}

.settings-vertical-card-list > * {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.settings-vertical-card-list .detail-row > * {
  min-width: 0;
}

.settings-storage-grid {
  display: grid;
  gap: 16px;
  align-items: start;
  grid-template-columns: minmax(320px, 0.9fr) minmax(520px, 1.6fr);
}

.settings-storage-grid .settings-card-pair-inline {
  grid-template-columns: 1fr;
  align-items: start;
}

.settings-storage-grid .settings-card-pair-inline > * {
  height: auto;
}

.settings-storage-list {
  display: grid;
  gap: 16px;
  align-items: stretch;
  grid-template-columns: 1fr;
  width: 100%;
  min-width: 0;
}

.settings-storage-list > * {
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.settings-storage-list .settings-card-pair-inline {
  grid-template-columns: 1fr;
  align-items: stretch;
}

.settings-storage-list .settings-card-pair-inline > * {
  width: 100%;
  min-width: 0;
  height: auto;
}

.settings-storage-list #settings-backup-retention-form .split-grid,
.settings-storage-list #settings-storage-alert-form .split-grid {
  grid-template-columns: 1fr;
}

.settings-storage-list #settings-backup-retention-form .detail-row > *,
.settings-storage-list #settings-storage-alert-form .detail-row > * {
  min-width: 0;
}

#settings-backup-retention-form,
#settings-storage-alert-form {
  padding: 0;
}

#settings-backup-retention-form .detail-row,
#settings-storage-alert-form .detail-row {
  align-items: flex-start;
}

#settings-backup-retention-form .admin-button,
#settings-storage-alert-form .admin-button {
  flex: 0 0 auto;
  white-space: nowrap;
}

#settings-backup-retention-form .split-grid,
#settings-storage-alert-form .split-grid {
  grid-template-columns: minmax(220px, 0.75fr) minmax(280px, 1.25fr);
}

.settings-maintenance-card {
  align-content: start;
}

.settings-maintenance-status-card .detail-row,
.settings-maintenance-card .detail-row {
  align-items: flex-start;
}

.settings-maintenance-time-grid,
.settings-maintenance-alert-grid {
  display: grid;
  gap: 14px;
}

.settings-maintenance-time-grid {
  grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.settings-maintenance-alert-grid {
  grid-template-columns: minmax(180px, 0.55fr) minmax(180px, 0.55fr) minmax(260px, 1fr);
  align-items: stretch;
}

.settings-maintenance-countdown-display {
  display: grid;
  gap: 6px;
  padding: 18px;
  border-radius: 18px;
  border: 1px solid rgba(236, 177, 89, 0.36);
  background: linear-gradient(135deg, rgba(255, 248, 238, 0.96), rgba(255, 255, 255, 0.92));
  box-shadow: 0 18px 36px rgba(151, 105, 42, 0.1);
}

.settings-maintenance-countdown-display[hidden] {
  display: none;
}

.settings-maintenance-countdown-display span {
  color: #9b6715;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.settings-maintenance-countdown-display strong {
  color: var(--text);
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: clamp(2rem, 6vw, 4rem);
  line-height: 0.95;
  font-weight: 900;
  letter-spacing: 0;
}

.settings-maintenance-countdown-display small {
  color: var(--muted);
  font-weight: 800;
}

.settings-maintenance-countdown-display[data-state="active"] {
  border-color: rgba(230, 95, 116, 0.42);
  background: linear-gradient(135deg, rgba(255, 241, 244, 0.98), rgba(255, 255, 255, 0.94));
}

.settings-maintenance-quick-card {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(260px, 360px);
  align-items: center;
  gap: 16px;
  border-color: rgba(212, 79, 104, 0.18);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 246, 249, 0.94));
}

.settings-maintenance-quick-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(112px, 1fr));
  gap: 8px;
  justify-self: end;
  width: min(100%, 360px);
}

.settings-maintenance-quick-actions .admin-button {
  width: 100%;
  min-height: 46px;
  border-color: rgba(212, 79, 104, 0.18);
}

.settings-maintenance-card .admin-text-input,
.settings-maintenance-card .admin-textarea {
  width: 100%;
}

.settings-maintenance-message {
  min-height: 118px;
  resize: vertical;
}

.settings-card-pair {
  display: grid;
  gap: 16px;
  align-items: stretch;
  min-width: 0;
  grid-template-columns: minmax(250px, 0.82fr) minmax(0, 1.8fr);
}

.settings-card-pair-full {
  grid-column: 1 / -1;
}

.settings-card-pair > * {
  min-width: 0;
  height: 100%;
}

.settings-card-pair-control,
.settings-card-pair-detail {
  align-content: start;
}

.settings-card-pair-control .toggle-row {
  align-items: center;
}

.settings-platform-card {
  align-content: start;
  min-width: 0;
}

.settings-platform-card > form,
.settings-platform-tier-card {
  min-width: 0;
}

.settings-platform-plan-grid,
.settings-platform-two-up {
  display: grid;
  gap: 16px;
  align-items: start;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
}

.settings-platform-field-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
}

.settings-field-help-label {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
}

.settings-field-help-button {
  appearance: none;
  display: inline-grid;
  place-items: center;
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  padding: 0;
  border: 1px solid color-mix(in srgb, var(--purple) 45%, var(--admin-line));
  border-radius: 50%;
  background: color-mix(in srgb, var(--purple) 8%, var(--admin-panel));
  color: var(--purple);
  font: inherit;
  font-size: 0.67rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.settings-field-help-button:hover,
.settings-field-help-button:focus-visible {
  border-color: var(--purple);
  background: var(--purple);
  color: #fff;
  outline: 2px solid color-mix(in srgb, var(--purple) 34%, transparent);
  outline-offset: 2px;
}

.settings-reward-directory {
  display: grid;
  gap: 16px;
  min-width: 0;
  max-width: 100%;
  padding: 18px;
  border: 1px solid rgba(121, 91, 220, 0.18);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(128, 100, 232, 0.08), rgba(90, 210, 198, 0.07));
}

.settings-reward-directory-tabs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  min-width: 0;
  padding: 8px;
  border: 1px solid rgba(121, 91, 220, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.7);
}

.settings-reward-directory-tab {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
  padding: 13px 14px;
  border: 0;
  border-radius: 13px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 900;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
}

.settings-reward-directory-tab span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.settings-reward-directory-tab strong {
  display: grid;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  background: rgba(128, 100, 232, 0.12);
  color: var(--accent-strong);
  font-size: 0.8rem;
}

.settings-reward-directory-tab:hover,
.settings-reward-directory-tab:focus-visible {
  background: rgba(128, 100, 232, 0.1);
  outline: none;
}

.settings-reward-directory-tab:focus-visible {
  box-shadow: 0 0 0 3px rgba(128, 100, 232, 0.22);
}

.settings-reward-directory-tab.is-active {
  background: linear-gradient(135deg, #8064e8, #6347d0);
  color: #fff;
  box-shadow: 0 12px 28px rgba(92, 64, 188, 0.2);
}

.settings-reward-directory-tab.is-active strong {
  background: #fff;
  color: #6347d0;
}

.settings-reward-directory-panel {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(121, 91, 220, 0.16);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.74);
}

.settings-reward-directory-panel[hidden] {
  display: none;
}

.settings-reward-directory-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.settings-reward-directory-panel-head > div {
  display: grid;
  gap: 5px;
}

.settings-reward-directory-panel-head h4 {
  margin: 0;
  color: var(--text);
  font-size: 1.12rem;
  line-height: 1.35;
}

.settings-reward-directory-panel-head > strong {
  flex: 0 0 auto;
  color: var(--accent-strong);
  font-size: 0.82rem;
}

body[data-admin-theme="dark"] .settings-reward-directory-tabs,
body[data-admin-theme="dark"] .settings-reward-directory-panel {
  border-color: rgba(166, 143, 244, 0.25);
  background: rgba(24, 21, 32, 0.82);
}

.settings-reward-event-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-reward-event-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-soft);
}

.settings-reward-event-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}

.settings-reward-event-head > .detail-meta:first-child {
  color: var(--text);
  font-weight: 900;
}

.settings-reward-event-cap {
  flex: 0 0 auto;
  max-width: 48%;
  color: var(--accent-strong);
  font-size: 0.75rem;
  font-weight: 900;
  line-height: 1.3;
  text-align: right;
}

@media (max-width: 1180px) {
  .settings-reward-event-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.settings-reward-event-input-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-reward-event-input-grid label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.settings-reward-event-detail {
  line-height: 1.45;
}

.settings-platform-card .detail-row {
  align-items: flex-start;
}

.settings-platform-card .admin-button {
  flex-shrink: 0;
}

.settings-chat-card-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.settings-chat-card-stack > .detail-card {
  min-width: 0;
}

.settings-guest-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(min(100%, 360px), 1fr));
  gap: 18px;
  align-items: stretch;
}

.settings-guest-card {
  display: grid;
  gap: 18px;
  align-content: start;
  min-height: 0;
  padding: 22px 24px;
}

.settings-guest-master-card {
  min-height: 148px;
}

.settings-guest-toggle-row,
.settings-guest-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.settings-guest-card-copy,
.settings-guest-toggle-row .toggle-copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-guest-enable {
  flex: 0 0 auto;
  margin-top: 2px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(248, 247, 255, 0.76);
}

.settings-guest-field-grid {
  grid-template-columns: repeat(2, minmax(min(100%, 220px), 1fr));
  align-items: end;
}

.settings-guest-card .support-hours-field {
  min-width: 0;
}

@media (max-width: 1180px) {
  .settings-guest-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .settings-guest-toggle-row,
  .settings-guest-card-head {
    flex-direction: column;
    align-items: stretch;
  }

  .settings-guest-enable {
    justify-self: start;
  }

  .settings-guest-field-grid {
    grid-template-columns: 1fr;
  }
}

.settings-studio-limit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
  align-items: center;
}

.settings-studio-trial-summary {
  display: grid;
  grid-template-columns: minmax(240px, 0.75fr) minmax(280px, 1.25fr);
  gap: 18px;
  align-items: stretch;
}

.settings-studio-trial-summary > * {
  min-width: 0;
}

.settings-studio-trial-exposure {
  display: grid;
  align-content: center;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(124, 100, 255, 0.16);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(248, 247, 255, 0.95), rgba(241, 252, 248, 0.95));
}

.settings-studio-trial-progress {
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(31, 37, 51, 0.1);
}

.settings-studio-trial-progress > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2ed39f, #8066ff);
  transition: width 0.2s ease;
}

.settings-studio-trial-toggle-copy {
  display: grid;
  gap: 0.18rem;
}

.settings-field-hint {
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.4;
}

.settings-studio-trial-budget-preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 13px 15px;
  border: 1px solid rgba(124, 100, 255, 0.16);
  border-radius: 14px;
  background: rgba(248, 247, 255, 0.74);
  transition: border-color 0.18s ease, background 0.18s ease;
}

.settings-studio-trial-budget-copy {
  display: grid;
  gap: 2px;
}

.settings-studio-trial-budget-copy > strong {
  color: var(--ink);
  font-size: 1.05rem;
}

.settings-studio-trial-exposure-flag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(199, 57, 65, 0.28);
  border-radius: 999px;
  color: #a4242c;
  background: rgba(255, 238, 239, 0.96);
  font-size: 0.78rem;
  font-weight: 850;
}

.settings-studio-trial-exposure-flag[hidden] {
  display: none;
}

.settings-studio-trial-budget-preview.is-high-exposure {
  border-color: rgba(199, 57, 65, 0.32);
  background: rgba(255, 245, 246, 0.9);
}

.settings-studio-trial-confirm-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.settings-studio-trial-confirm-summary > span {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 11px;
  border: 1px solid rgba(124, 100, 255, 0.14);
  border-radius: 12px;
  background: rgba(248, 247, 255, 0.8);
}

.settings-studio-trial-confirm-summary strong {
  overflow-wrap: anywhere;
}

.admin-dialog-custom:has(.settings-studio-trial-confirm-summary) {
  display: grid;
  gap: 14px;
}

@media (max-width: 760px) {
  .settings-studio-trial-summary {
    grid-template-columns: 1fr;
  }

  .settings-studio-trial-budget-preview {
    align-items: flex-start;
    flex-direction: column;
  }

  .settings-studio-trial-confirm-summary {
    grid-template-columns: 1fr;
  }
}

body[data-admin-theme="dark"] .settings-studio-trial-budget-preview,
body[data-admin-theme="dark"] .settings-studio-trial-confirm-summary > span {
  border-color: rgba(166, 144, 255, 0.26);
  background: rgba(24, 22, 36, 0.82);
}

body[data-admin-theme="dark"] .settings-studio-trial-budget-preview.is-high-exposure {
  border-color: rgba(255, 116, 125, 0.46);
  background: rgba(65, 25, 31, 0.72);
}

body[data-admin-theme="dark"] .settings-studio-trial-exposure-flag {
  border-color: rgba(255, 116, 125, 0.44);
  color: #ffb0b6;
  background: rgba(96, 30, 38, 0.82);
}

.settings-model-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px;
  border: 1px solid rgba(124, 100, 255, 0.18);
  border-radius: 999px;
  background: rgba(248, 247, 255, 0.96);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.settings-plan-toggle {
  flex-wrap: wrap;
  max-width: 100%;
}

.settings-model-toggle-button {
  border: 0;
  border-radius: 999px;
  padding: 9px 16px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  transition: background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.settings-model-toggle-button.is-active {
  background: linear-gradient(135deg, #2ed39f, #73ebc9);
  color: #08231c;
  box-shadow: 0 10px 24px rgba(46, 211, 159, 0.22);
}

.settings-model-toggle-button:focus-visible {
  outline: 3px solid rgba(46, 211, 159, 0.35);
  outline-offset: 2px;
}

.settings-platform-card .admin-text-input,
.settings-platform-card .admin-select {
  width: 100%;
  min-width: 0;
}

.settings-platform-format-grid {
  grid-template-columns: repeat(2, minmax(300px, 1fr));
}

.settings-format-card {
  align-content: start;
  min-width: 0;
}

.settings-format-option.toggle-card {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 88px;
  padding: 16px 18px;
  gap: 14px;
}

.settings-format-option.is-inactive {
  background: #f8f8fc;
  border-color: rgba(124, 100, 255, 0.18);
}

.settings-format-option.is-inactive input[type="checkbox"] {
  opacity: 0.72;
}

.settings-format-option input[type="checkbox"] {
  align-self: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: #7c64ff;
}

.settings-format-option span {
  min-width: 0;
  line-height: 1.35;
}

.settings-format-option strong {
  color: var(--text);
}

.settings-native-load-status {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(124, 100, 255, 0.2);
  background: #f6f3ff;
  color: #4b3ea4;
  font-weight: 700;
  line-height: 1.4;
}

.settings-native-load-status.is-inactive {
  border-color: rgba(242, 137, 30, 0.28);
  background: #fff7ed;
  color: #8a4b11;
}

.settings-native-load-status.is-active {
  border-color: rgba(54, 181, 126, 0.28);
  background: #effaf5;
  color: #20704e;
}

.settings-visuals-controls-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: stretch;
  min-width: 0;
}

.settings-visuals-controls-stack > .toggle-card {
  min-width: 0;
}

.settings-page-elements-card {
  display: grid;
  gap: 20px;
}

.settings-page-elements-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
}

.settings-page-elements-group {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(248, 247, 255, 0.52);
}

.settings-plan-flow-form {
  gap: 22px;
}

.settings-plan-flow-groups {
  display: grid;
  gap: 20px;
}

.settings-plan-flow-group {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding-top: 18px;
  border-top: 1px solid rgba(142, 123, 192, 0.18);
}

.settings-plan-flow-group-pattern {
  padding-top: 0;
  border-top: 0;
}

.settings-plan-flow-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.settings-plan-flow-grid,
.settings-plan-flow-switch-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
  gap: 16px;
}

.settings-plan-flow-grid > .support-hours-field,
.settings-plan-flow-grid > .settings-platform-tier-card,
.settings-plan-flow-switch-grid > .settings-platform-tier-card {
  min-width: 0;
  grid-column: span 3;
}

.settings-plan-flow-switch-grid > .settings-platform-tier-card {
  grid-column: span 4;
}

.settings-plan-flow-pattern-field {
  max-width: 260px;
}

.settings-plan-flow-random-grid,
.settings-plan-flow-random-selects {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.settings-plan-flow-random-selects {
  grid-template-columns: repeat(3, minmax(0, 260px));
}

.settings-plan-flow-random-option {
  min-width: 0;
}

.settings-plan-flow-number-control {
  position: relative;
  display: block;
  min-height: 46px;
}

.settings-plan-flow-number-control .admin-text-input {
  display: block;
  min-height: 46px;
  height: 46px;
  padding-right: 44px;
}

#settings-community-plan-flow-form .settings-plan-flow-pattern-field .admin-text-input {
  min-height: 46px;
  height: 46px;
}

.settings-plan-flow-number-control input[type="number"] {
  appearance: textfield;
  -moz-appearance: textfield;
}

.settings-plan-flow-number-control input[type="number"]::-webkit-outer-spin-button,
.settings-plan-flow-number-control input[type="number"]::-webkit-inner-spin-button {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
}

.settings-plan-flow-stepper {
  position: absolute;
  top: 5px;
  right: 8px;
  bottom: 5px;
  display: grid;
  width: 28px;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border-radius: 9px;
  border: 1px solid rgba(118, 83, 255, 0.16);
  background: rgba(118, 83, 255, 0.08);
  pointer-events: auto;
  z-index: 1;
}

.settings-plan-flow-stepper-button {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  height: 18px;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(101, 86, 142, 0.84);
  cursor: pointer;
  line-height: 0;
}

.settings-plan-flow-stepper-button + .settings-plan-flow-stepper-button {
  border-top: 1px solid rgba(118, 83, 255, 0.14);
}

.settings-plan-flow-stepper-button:hover,
.settings-plan-flow-stepper-button:focus-visible {
  background: rgba(118, 83, 255, 0.18);
  color: #6e45e8;
}

.settings-plan-flow-stepper-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.settings-plan-flow-stepper-button::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translate(-50%, -50%) rotate(var(--plan-flow-stepper-arrow-rotation, 225deg));
}

.settings-plan-flow-stepper-button.is-up::before {
  --plan-flow-stepper-arrow-rotation: 225deg;
}

.settings-plan-flow-stepper-button.is-down::before {
  --plan-flow-stepper-arrow-rotation: 45deg;
}

@media (max-width: 1180px) {
  .settings-plan-flow-grid,
  .settings-plan-flow-switch-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .settings-plan-flow-grid > .support-hours-field,
  .settings-plan-flow-grid > .settings-platform-tier-card,
  .settings-plan-flow-switch-grid > .settings-platform-tier-card {
    grid-column: span 3;
  }

  .settings-plan-flow-random-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .settings-plan-flow-grid,
  .settings-plan-flow-switch-grid {
    grid-template-columns: 1fr;
  }

  .settings-plan-flow-grid > .support-hours-field,
  .settings-plan-flow-grid > .settings-platform-tier-card,
  .settings-plan-flow-switch-grid > .settings-platform-tier-card {
    grid-column: 1 / -1;
  }

  .settings-plan-flow-random-grid,
  .settings-plan-flow-random-selects {
    grid-template-columns: 1fr;
  }
}

.settings-plan-flow-preview {
  display: flex;
  align-items: end;
  gap: 7px;
  min-height: 88px;
  padding: 18px 20px 14px;
  border: 1px solid rgba(118, 83, 255, 0.2);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(20, 17, 34, 0.96), rgba(38, 27, 76, 0.72)),
    radial-gradient(circle at 50% 100%, rgba(144, 92, 255, 0.34), transparent 62%);
  overflow: hidden;
}

.settings-plan-flow-preview span {
  width: 18px;
  height: calc(34px + var(--plan-flow-bar, 0.6) * 42px);
  border-radius: 9px 9px 3px 3px;
  background: linear-gradient(180deg, #b591ff, #8f55f4);
  box-shadow: 0 0 18px rgba(145, 88, 255, 0.48);
}

.settings-plan-flow-preview.is-bar-glow-off span {
  box-shadow: none;
}

.settings-plan-flow-preview.is-lake-line-glow-off {
  background: linear-gradient(180deg, rgba(20, 17, 34, 0.96), rgba(38, 27, 76, 0.72));
}

.settings-plan-flow-preview.is-rounded span {
  border-radius: 999px 999px 5px 5px;
}

.settings-plan-flow-preview.is-flat span {
  border-radius: 5px 5px 2px 2px;
}

.settings-page-elements-group-head {
  display: grid;
  gap: 6px;
}

.settings-page-elements-stack {
  display: grid;
  gap: 12px;
}

.settings-page-elements-stack > .toggle-card {
  min-width: 0;
}

.settings-page-elements-stack > .toggle-card.is-disabled {
  background: rgba(255, 255, 255, 0.72);
}

.settings-page-elements-stack > .toggle-card.is-disabled .admin-range-input {
  filter: grayscale(0.18);
}

[data-library-scrollbar-wheel-step-field].is-disabled {
  opacity: 0.62;
}

.settings-footer-social-form,
.settings-footer-social-list {
  display: grid;
  gap: 14px;
}

.settings-footer-social-appearance {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid rgba(216, 223, 240, 0.94);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(250, 251, 255, 0.96), rgba(244, 247, 252, 0.94));
}

.settings-footer-social-preview-strip {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  width: fit-content;
  max-width: 100%;
  padding: 13px;
  border-radius: 18px;
  background: #141414;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}

.settings-footer-social-style-fields {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(140px, 0.8fr) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
}

.settings-footer-social-row {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
}

.settings-footer-social-head,
.settings-footer-social-upload {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.settings-footer-social-upload {
  grid-template-columns: minmax(0, 1fr) auto;
}

.settings-footer-social-icon-preview {
  --settings-footer-social-circle-fill: #2f2f2f;
  --settings-footer-social-icon-color: #ffffff;
  --settings-footer-social-brand-color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: var(--settings-footer-social-circle-fill);
  color: var(--settings-footer-social-icon-color);
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(36, 40, 65, 0.16);
}

.settings-footer-social-preview-strip .settings-footer-social-icon-preview {
  width: 56px;
  height: 56px;
}

.settings-footer-social-icon-preview.is-brand-icons {
  color: var(--settings-footer-social-brand-color);
}

.settings-footer-social-icon-preview.is-monochrome-icons {
  color: var(--settings-footer-social-icon-color);
}

.settings-footer-social-icon-preview.is-twitter:not(.is-monochrome-icons) {
  color: #ffffff;
}

.settings-footer-social-icon-preview.is-facebook:not(.is-monochrome-icons) {
  color: #1877f2;
}

.settings-footer-social-icon-preview.is-instagram:not(.is-monochrome-icons) {
  color: #e4405f;
}

.settings-footer-social-icon-preview.is-youtube:not(.is-monochrome-icons) {
  color: #ff0000;
}

.settings-footer-social-icon-preview svg {
  width: 23px;
  height: 23px;
}

.settings-footer-social-icon-preview svg * {
  fill: currentColor;
  stroke: none;
}

.settings-footer-social-icon-preview.is-instagram svg rect,
.settings-footer-social-icon-preview.is-instagram svg circle {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
}

.settings-footer-social-icon-preview .settings-footer-youtube-play {
  fill: #ffffff;
}

.settings-footer-social-icon-preview.is-monochrome-icons .settings-footer-youtube-play {
  fill: var(--settings-footer-social-circle-fill);
}

.settings-footer-social-icon-preview img {
  display: block;
  width: 26px;
  height: 26px;
  object-fit: contain;
}

.settings-footer-social-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-footer-social-copy strong {
  color: var(--text);
}

.settings-footer-social-toggle {
  justify-self: end;
}

.settings-favorites-library-form {
  display: grid;
  gap: 16px;
}

.settings-favorites-library-tabbed-surface {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.settings-favorites-library-tabs-card {
  gap: 16px;
  position: sticky;
  top: 0;
  z-index: 8;
  border-color: rgba(220, 226, 234, 0.96);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(249, 250, 253, 0.96)),
    rgba(255, 255, 255, 0.98);
  box-shadow: 0 14px 26px rgba(31, 37, 52, 0.08);
}

.settings-favorites-library-tabs-head {
  align-items: flex-start;
}

.settings-favorites-library-tabs-head > div:first-child {
  min-width: min(100%, 620px);
}

.settings-favorites-library-header-actions {
  display: flex;
  flex: 1 1 320px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 260px;
}

.settings-favorites-library-header-actions[hidden] {
  display: none !important;
}

.settings-favorites-library-header-actions .admin-button {
  white-space: nowrap;
}

@media (max-width: 860px) {
  .settings-favorites-library-header-actions {
    justify-content: flex-start;
    width: 100%;
  }
}

.settings-favorites-library-subtabs {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 4px 2px 8px;
  scrollbar-color: #c8c9c6 rgba(250, 250, 247, 0.96);
  scrollbar-width: thin;
}

.settings-favorites-library-subtabs::-webkit-scrollbar {
  height: 10px;
}

.settings-favorites-library-subtabs::-webkit-scrollbar-track {
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255, 255, 253, 0.96), rgba(241, 242, 239, 0.9));
}

.settings-favorites-library-subtabs::-webkit-scrollbar-thumb {
  border: 2px solid rgba(250, 250, 247, 0.96);
  border-radius: 999px;
  background: linear-gradient(90deg, #c7c8c5, #fbfbf7, #d2d3cf);
}

.settings-favorites-library-subtab {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 16px;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 999px;
  background: rgba(247, 250, 255, 0.88);
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.settings-favorites-library-subtab:hover,
.settings-favorites-library-subtab:focus-visible {
  border-color: rgba(118, 83, 255, 0.3);
  color: var(--accent-strong);
  transform: translateY(-1px);
}

.settings-favorites-library-subtab.is-active {
  border-color: rgba(118, 83, 255, 0.34);
  background: linear-gradient(135deg, rgba(118, 83, 255, 0.18), rgba(224, 216, 255, 0.92));
  color: #6b4dff;
  box-shadow: inset 0 0 0 1px rgba(118, 83, 255, 0.08);
}

.settings-favorites-library-tab-panel {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.settings-favorites-library-tab-panel[hidden] {
  display: none !important;
}

.settings-panel-color-visual-editor {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: 16px;
  align-items: start;
  min-width: 0;
}

.settings-favorites-library-all-workspace {
  display: grid;
  min-width: 0;
}

.settings-panel-color-visual-editor.is-all-workspace {
  --favorites-all-preview-scale: 1.05;
  grid-template-columns: minmax(560px, 1.48fr) minmax(300px, 0.52fr);
  gap: 14px;
}

.settings-panel-color-preview-card,
.settings-panel-color-property-shell {
  display: grid;
  gap: 16px;
  min-width: 0;
  padding: 18px;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 250, 253, 0.78)),
    #ffffff;
  box-shadow: 0 18px 42px rgba(31, 37, 52, 0.08);
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-preview-card,
.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-shell {
  border-radius: 16px;
}

.settings-panel-color-preview-head,
.settings-panel-color-property-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
}

.settings-panel-color-preview-head > div:first-child,
.settings-panel-color-property-head > div:first-child {
  min-width: 0;
}

.settings-panel-color-preview-status {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
}

.settings-panel-layout-ratio-chip {
  display: grid;
  gap: 2px;
  min-height: 42px;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 14px;
  background: rgba(247, 249, 255, 0.9);
  color: var(--text);
  font-size: 0.82rem;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.settings-panel-layout-ratio-chip strong {
  white-space: nowrap;
}

.settings-panel-color-selected-chip,
.settings-panel-color-property-meta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.78);
  color: var(--text);
  font-size: 0.84rem;
  font-weight: 900;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.72);
}

.settings-panel-color-selected-chip > span:last-child {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.settings-panel-color-selected-chip strong {
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-panel-color-property-meta {
  flex-wrap: wrap;
  justify-content: flex-end;
  color: var(--muted);
}

.settings-panel-color-preview-swatch {
  display: inline-block;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  box-shadow:
    0 0 0 1px rgba(31, 37, 52, 0.16),
    0 8px 18px rgba(31, 37, 52, 0.12);
}

.settings-all-preview-size-control {
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.78);
}

.settings-all-preview-size-control .admin-range-input {
  min-width: 0;
}

.settings-panel-color-browser-frame {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(143, 154, 179, 0.22);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(243, 246, 251, 0.98), rgba(255, 255, 255, 0.86)),
    #f8fafc;
}

.settings-panel-color-browser-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  height: 18px;
}

.settings-panel-color-browser-bar > span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #d1d8e4;
}

.settings-panel-color-browser-bar > span:nth-child(1) {
  background: #ff8f7d;
}

.settings-panel-color-browser-bar > span:nth-child(2) {
  background: #f8c75d;
}

.settings-panel-color-browser-bar > span:nth-child(3) {
  background: #55caa3;
}

.settings-panel-color-browser-bar .settings-library-all-limit-hotspot {
  flex: 0 0 auto;
  margin-left: auto;
}

.settings-panel-color-browser-layout {
  display: grid;
  grid-template-columns:
    minmax(150px, var(--favorites-panel-preview-one, 20fr))
    minmax(230px, var(--favorites-panel-preview-two, 60fr))
    minmax(158px, var(--favorites-panel-preview-three, 20fr));
  gap: 12px;
  min-height: 370px;
  min-width: 0;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-browser-layout {
  grid-template-columns:
    minmax(170px, var(--favorites-panel-preview-one, 20fr))
    minmax(310px, var(--favorites-panel-preview-two, 60fr))
    minmax(176px, var(--favorites-panel-preview-three, 20fr));
  gap: 12px;
  min-height: 430px;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-browser-frame {
  padding: 10px;
  overflow: auto;
}

.settings-library-all-stage {
  position: relative;
  display: grid;
  gap: 8px;
  min-width: 880px;
  min-height: 620px;
  color: #14223a;
  --favorites-all-panel2-active-foreground-fill: var(--favorites-all-panel2-album-foreground-fill, rgba(255, 255, 255, 0.88));
  --favorites-all-panel2-active-foreground-solid: var(--favorites-all-panel2-album-foreground-solid, #05080c);
  transform-origin: top left;
  zoom: var(--favorites-all-preview-scale);
}

.settings-library-all-stage[data-favorites-all-panel2-mode="artists"],
.settings-library-all-stage[data-favorites-all-panel2-mode="artistDirectory"] {
  --favorites-all-panel2-active-foreground-fill: var(--favorites-all-panel2-artist-foreground-fill, var(--favorites-all-panel2-foreground-fill));
  --favorites-all-panel2-active-foreground-solid: var(--favorites-all-panel2-artist-foreground-solid, var(--favorites-all-panel2-foreground-solid));
}

.settings-library-all-stage[data-favorites-all-panel2-mode="albums"],
.settings-library-all-stage[data-favorites-all-panel2-mode="albumDirectory"] {
  --favorites-all-panel2-active-foreground-fill: var(--favorites-all-panel2-album-foreground-fill, var(--favorites-all-panel2-foreground-fill));
  --favorites-all-panel2-active-foreground-solid: var(--favorites-all-panel2-album-foreground-solid, var(--favorites-all-panel2-foreground-solid));
}

.settings-library-all-stage[data-favorites-all-panel2-mode="playlists"] {
  --favorites-all-panel2-active-foreground-fill: var(--favorites-all-panel2-playlist-foreground-fill, var(--favorites-all-panel2-foreground-fill));
  --favorites-all-panel2-active-foreground-solid: var(--favorites-all-panel2-playlist-foreground-solid, var(--favorites-all-panel2-foreground-solid));
}

.settings-library-all-stage[data-favorites-all-panel2-mode="likes"] {
  --favorites-all-panel2-active-foreground-fill: var(--favorites-all-panel2-playlist-foreground-fill, var(--favorites-all-panel2-foreground-fill));
  --favorites-all-panel2-active-foreground-solid: var(--favorites-all-panel2-playlist-foreground-solid, var(--favorites-all-panel2-foreground-solid));
}

.settings-library-all-topbar,
.settings-library-all-player,
.settings-library-all-sidebar,
.settings-library-all-content,
.settings-library-all-rail,
.settings-library-all-sidebar-head,
.settings-library-all-sidebar-card,
.settings-library-all-banner,
.settings-library-all-card-shelf,
.settings-library-all-rail-card,
.settings-library-all-rail-mode {
  position: relative;
  min-width: 0;
  border: 1px solid rgba(121, 127, 152, 0.22);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.38),
    0 12px 28px rgba(17, 24, 39, 0.08);
}

.settings-library-all-topbar,
.settings-library-all-player {
  color: #f8fbff;
  border-color: rgba(142, 163, 244, 0.42);
  background: #0c1833;
}

.settings-library-all-topbar {
  display: grid;
  grid-template-columns: auto minmax(260px, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: var(--favorites-all-topbar-min-height, 58px);
  height: var(--favorites-all-topbar-height, auto);
  padding: 10px 14px;
  border-radius: 16px 16px 8px 8px;
}

.settings-library-all-brand,
.settings-library-all-topbar nav,
.settings-library-all-search-shell,
.settings-library-all-search,
.settings-library-all-topbar-actions,
.settings-library-all-player {
  position: relative;
  z-index: 2;
}

.settings-library-all-brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.04em;
}

.settings-library-all-logo,
.settings-library-all-avatar,
.settings-library-all-mini-cover {
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  background:
    linear-gradient(135deg, rgba(111, 91, 255, 0.98), rgba(76, 205, 255, 0.86)),
    #6d5dfc;
  color: #ffffff;
  font-size: 0.68rem;
  font-weight: 950;
}

.settings-library-all-logo {
  width: 34px;
  height: 34px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.settings-library-all-logo:hover,
.settings-library-all-logo:focus-visible,
.settings-library-all-logo.is-selected {
  outline: none;
  border-color: rgba(126, 231, 219, 0.55);
  box-shadow: 0 0 0 4px rgba(126, 231, 219, 0.12);
  transform: translateY(-1px);
}

.settings-library-all-avatar {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  background:
    linear-gradient(135deg, #f8c75d, #f26e7d 52%, #5968ff),
    #111827;
}

.settings-library-all-topbar nav {
  display: flex;
  gap: 12px;
  align-items: center;
  min-width: 0;
  overflow: hidden;
  color: rgba(248, 251, 255, 0.78);
  font-size: 0.7rem;
  white-space: nowrap;
}

.settings-library-all-topbar nav button {
  min-width: 0;
  padding: 3px 6px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
}

.settings-library-all-topbar nav button:hover,
.settings-library-all-topbar nav button:focus-visible,
.settings-library-all-topbar nav button.is-selected {
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  outline: none;
}

.settings-library-all-search-shell {
  --favorites-all-search-column-width: clamp(112px, calc(220px * var(--favorites-all-search-width-scale, 1)), 430px);
  display: grid;
  grid-template-columns: auto auto minmax(96px, var(--favorites-all-search-column-width)) auto auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-topbar-icon {
  --favorites-all-topbar-icon-base-size: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  min-width: 38px;
  height: var(--favorites-all-topbar-icon-height, 38px);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(248, 251, 255, 0.86);
  cursor: pointer;
  transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
}

.settings-library-all-topbar-icon svg,
.settings-library-all-topbar-icon img {
  width: calc(var(--favorites-all-topbar-icon-base-size, 21px) * var(--favorites-all-topbar-icon-scale, 1));
  height: calc(var(--favorites-all-topbar-icon-base-size, 21px) * var(--favorites-all-topbar-icon-scale, 1));
}

.settings-library-all-topbar-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-library-all-topbar-icon img {
  display: block;
  object-fit: contain;
}

.settings-library-all-topbar-icon.is-back {
  --favorites-all-topbar-icon-base-size: 20px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06));
}

.settings-library-all-topbar-icon.is-back svg {
  stroke-width: 2.45;
}

.settings-library-all-topbar-icon.is-dynamic {
  width: clamp(32px, calc(38px * var(--favorites-all-topbar-icon-scale, 1)), 68px);
  min-width: clamp(32px, calc(38px * var(--favorites-all-topbar-icon-scale, 1)), 68px);
  height: var(--favorites-all-topbar-icon-height, clamp(32px, calc(38px * var(--favorites-all-topbar-icon-scale, 1)), 68px));
}

.settings-library-all-topbar-icon.is-genres {
  --favorites-all-topbar-icon-base-size: 30px;
  width: 54px;
  min-width: 54px;
  border-radius: 999px;
}

.settings-library-all-topbar-icon.is-genres svg {
  stroke-width: 1.55;
}

.settings-library-all-topbar-icon.is-genres.is-dynamic {
  width: clamp(46px, calc(54px * var(--favorites-all-topbar-icon-scale, 1)), 88px);
  min-width: clamp(46px, calc(54px * var(--favorites-all-topbar-icon-scale, 1)), 88px);
  height: var(--favorites-all-topbar-icon-height, clamp(36px, calc(38px * var(--favorites-all-topbar-icon-scale, 1)), 68px));
}

.settings-library-all-search {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  width: 100%;
  min-width: 0;
  min-height: var(--favorites-all-search-height, 36px);
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--favorites-all-search-idle-outline, var(--favorites-all-search-highlight, #7c5cff)) 24%, rgba(255, 255, 255, 0.12));
  border-radius: 999px;
  background: var(--favorites-all-search-background, rgba(255, 255, 255, 0.12));
  color: var(--favorites-all-search-placeholder, rgba(248, 251, 255, 0.76));
  cursor: pointer;
  font: inherit;
  font-family: var(--favorites-all-search-font-family, inherit);
  font-weight: var(--favorites-all-search-font-weight, 800);
  font-style: var(--favorites-all-search-font-style, normal);
  font-size: calc(0.72rem * var(--favorites-all-search-text-scale, 1));
  text-align: left;
  justify-self: center;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 0 0 0 color-mix(in srgb, var(--favorites-all-search-highlight, #7c5cff) 0%, transparent);
}

.settings-library-all-search-icon {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-library-all-search span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-mini-row.is-text-entry {
  grid-template-columns: minmax(92px, 0.42fr) minmax(0, 1fr) auto;
}

.settings-library-all-mini-row.is-text-entry .admin-text-input {
  min-width: 0;
}

.settings-library-all-topbar-icon-editor {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(122, 111, 255, 0.18);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(246, 248, 255, 0.92)),
    rgba(255, 255, 255, 0.86);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.82);
}

.settings-library-all-topbar-icon-editor-head,
.settings-library-all-topbar-icon-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-topbar-icon-editor-head span:not(.settings-library-all-topbar-icon-preview) {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-library-all-topbar-icon-editor-head strong {
  color: #253047;
  font-weight: 900;
}

.settings-library-all-topbar-icon-editor-head small,
.settings-library-all-fine-print {
  color: #7b8498;
  font-size: 0.78rem;
  font-weight: 800;
}

.settings-library-all-topbar-icon-preview {
  --favorites-all-topbar-icon-base-size: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  border: 1px solid rgba(111, 101, 247, 0.24);
  border-radius: 999px;
  background: #05080f;
  color: #eef3ff;
  box-shadow: 0 12px 22px rgba(73, 64, 190, 0.12);
}

.settings-library-all-topbar-icon-preview svg,
.settings-library-all-topbar-icon-preview img {
  width: calc(var(--favorites-all-topbar-icon-base-size, 24px) * var(--favorites-all-topbar-icon-scale, 1));
  height: calc(var(--favorites-all-topbar-icon-base-size, 24px) * var(--favorites-all-topbar-icon-scale, 1));
}

.settings-library-all-topbar-icon-preview svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-library-all-topbar-icon-preview .settings-library-all-alert-bubble-svg {
  --favorites-all-topbar-icon-base-size: 30px;
}

.settings-library-all-topbar-icon-preview .settings-library-all-alert-bubble-shape,
.settings-library-all-topbar-action-icon .settings-library-all-alert-bubble-shape {
  fill: rgba(255, 255, 255, 0.06);
  stroke: rgba(173, 211, 255, 0.2);
  stroke-width: 1.6;
}

.settings-library-all-topbar-icon-preview .settings-library-all-alert-bubble-line,
.settings-library-all-topbar-action-icon .settings-library-all-alert-bubble-line {
  fill: currentColor;
  stroke: none;
}

.settings-library-all-topbar-icon-preview img {
  display: block;
  object-fit: contain;
}

.settings-library-all-icon-undo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  min-width: 34px;
  height: 34px;
  margin-left: auto;
  border: 1px solid rgba(117, 103, 255, 0.18);
  border-radius: 999px;
  background: #fff;
  color: #6b5cff;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 900;
  box-shadow: 0 8px 18px rgba(88, 72, 196, 0.12);
}

.settings-library-all-icon-undo:disabled {
  cursor: not-allowed;
  opacity: 0.42;
  box-shadow: none;
}

.settings-library-all-icon-upload-button {
  position: relative;
  overflow: hidden;
}

.settings-library-all-icon-upload-button input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}

.settings-library-all-icon-upload-button input:disabled {
  cursor: not-allowed;
}

.settings-library-all-topbar-icon:hover,
.settings-library-all-topbar-icon:focus-visible,
.settings-library-all-topbar-icon.is-selected,
.settings-library-all-topbar-action-icon:hover,
.settings-library-all-topbar-action-icon:focus-visible,
.settings-library-all-topbar-action-icon.is-selected,
.settings-library-all-search:hover,
.settings-library-all-search:focus-visible,
.settings-library-all-search.is-selected {
  outline: none;
  border-color: color-mix(in srgb, var(--favorites-all-search-focus-outline, var(--favorites-all-search-highlight, #7c5cff)) 72%, rgba(255, 255, 255, 0.24));
  color: var(--favorites-all-search-focus-text, var(--favorites-all-search-text, #ffffff));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 0 0 3px color-mix(in srgb, var(--favorites-all-search-focus-outline, var(--favorites-all-search-highlight, #7c5cff)) 32%, transparent);
  transform: translateY(-1px);
}

.settings-library-all-search:hover,
.settings-library-all-search:focus-visible,
.settings-library-all-search.is-selected {
  background: var(--favorites-all-search-focus-background, var(--favorites-all-search-background, rgba(255, 255, 255, 0.12)));
}

.settings-library-all-search:hover span[data-favorites-all-search-text],
.settings-library-all-search:focus-visible span[data-favorites-all-search-text] {
  color: var(--favorites-all-search-focus-placeholder, currentColor);
  opacity: var(--favorites-all-search-focus-placeholder-opacity, 0);
}

.settings-library-all-search.is-selected span[data-favorites-all-search-text] {
  color: var(--favorites-all-search-focus-placeholder, currentColor);
  opacity: 1;
}

.settings-library-all-topbar-actions {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-menu-plus-pill,
.settings-library-all-account-chip,
.settings-library-all-topbar-action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: inherit;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16);
}

.settings-library-all-upgrade-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  max-width: 142px;
  padding: 0 14px;
  border-radius: 999px;
  background: #ffffff;
  color: #07131d;
  font-size: 0.68rem;
  font-weight: 950;
  white-space: nowrap;
}

.settings-library-all-topbar-action-icon {
  --favorites-all-topbar-icon-base-size: 23px;
  position: relative;
  width: 34px;
  min-width: 34px;
  height: var(--favorites-all-topbar-action-height, 34px);
  border-color: transparent;
  background: transparent;
  color: rgba(248, 251, 255, 0.82);
  padding: 0;
  box-shadow: none;
}

.settings-library-all-topbar-action-icon svg {
  width: calc(var(--favorites-all-topbar-icon-base-size, 23px) * var(--favorites-all-topbar-icon-scale, 1));
  height: calc(var(--favorites-all-topbar-icon-base-size, 23px) * var(--favorites-all-topbar-icon-scale, 1));
  fill: none;
  stroke: currentColor;
  stroke-width: 2.05;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-library-all-topbar-action-icon .settings-library-all-alert-bubble-svg {
  --favorites-all-topbar-icon-base-size: 29px;
}

.settings-library-all-topbar-action-icon.is-dynamic {
  width: clamp(30px, calc(34px * var(--favorites-all-topbar-icon-scale, 1)), 62px);
  min-width: clamp(30px, calc(34px * var(--favorites-all-topbar-icon-scale, 1)), 62px);
  height: var(--favorites-all-topbar-action-height, clamp(30px, calc(34px * var(--favorites-all-topbar-icon-scale, 1)), 62px));
}

.settings-library-all-alert-dot {
  position: absolute;
  top: 7px;
  right: 7px;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--favorites-all-alert-indicator-idle-color, #4f9dff);
  box-shadow: 0 0 0 2px rgba(8, 19, 30, 0.95);
}

.settings-library-all-alert-color-control {
  display: grid;
  gap: 10px;
  padding-top: 4px;
}

.settings-library-all-alert-color-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.settings-library-all-alert-color-swatch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  padding: 5px 7px;
  border: 1px solid rgba(111, 101, 247, 0.14);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #6f7890;
  font-size: 0.62rem;
  font-weight: 850;
  line-height: 1;
}

.settings-library-all-alert-color-swatch i {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: var(--favorites-all-alert-swatch, #4f9dff);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--favorites-all-alert-swatch, #4f9dff) 18%, transparent);
}

.settings-library-all-alert-color-swatch em {
  overflow: hidden;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-alert-color-grid {
  display: grid;
  gap: 9px;
}

.settings-library-all-menu-plus-pill {
  gap: 6px;
  min-width: min(78px, var(--favorites-all-menu-plus-width, 420px));
  min-height: var(--favorites-all-menu-plus-height, 30px);
  padding: 0 10px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--favorites-all-menu-plus-bg, #08131e) 78%, transparent);
  color: var(--favorites-all-menu-plus-text, #f5f7fb);
  font-size: calc(0.64rem * var(--favorites-all-menu-plus-scale, 1));
  font-weight: var(--favorites-all-menu-plus-weight, 900);
  white-space: nowrap;
}

.settings-library-all-menu-plus-pill i {
  display: inline-grid;
  place-items: center;
  width: 15px;
  height: 15px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-style: normal;
  line-height: 1;
}

.settings-library-all-account-chip {
  width: 34px;
  height: var(--favorites-all-topbar-account-height, 34px);
  border-radius: 999px;
  background:
    linear-gradient(135deg, #9eece4, #76d5c9),
    var(--favorites-all-account-menu-bg, #050505);
  color: #07131d;
  font-size: calc(0.78rem * var(--favorites-all-account-menu-scale, 1));
}

.settings-library-all-menu-plus-pill:hover,
.settings-library-all-menu-plus-pill:focus-visible,
.settings-library-all-menu-plus-pill.is-selected,
.settings-library-all-account-chip:hover,
.settings-library-all-account-chip:focus-visible,
.settings-library-all-account-chip.is-selected,
.settings-library-all-topbar-action-icon:hover,
.settings-library-all-topbar-action-icon:focus-visible,
.settings-library-all-topbar-action-icon.is-selected {
  outline: none;
  border-color: rgba(126, 231, 219, 0.72);
  box-shadow: 0 0 0 3px rgba(126, 231, 219, 0.16), 0 12px 24px rgba(0, 0, 0, 0.18);
}

.settings-library-all-floating-menu-layer {
  position: absolute;
  top: 70px;
  right: 12px;
  z-index: 8;
  pointer-events: none;
}

.settings-library-all-floating-menu {
  display: none;
  gap: 8px;
  min-width: 220px;
  max-width: 360px;
  max-height: 230px;
  padding: 12px;
  border: 1px solid rgba(126, 231, 219, 0.24);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 22px 52px rgba(0, 0, 0, 0.28);
}

.settings-library-all-floating-menu.is-menu-plus {
  width: min(var(--favorites-all-menu-plus-width, 420px), 360px);
  background: var(--favorites-all-menu-plus-bg, #08131e);
  color: var(--favorites-all-menu-plus-text, #f5f7fb);
  font-size: calc(0.76rem * var(--favorites-all-menu-plus-scale, 1));
}

.settings-library-all-floating-menu.is-account-menu {
  width: min(var(--favorites-all-account-menu-width, 360px), 360px);
  background: var(--favorites-all-account-menu-bg, #050505);
  color: var(--favorites-all-account-menu-text, #f5f7fb);
  font-size: calc(0.76rem * var(--favorites-all-account-menu-scale, 1));
}

.settings-library-all-stage.is-menu-plus-dynamic-width .settings-library-all-floating-menu.is-menu-plus,
.settings-library-all-stage.is-account-menu-dynamic-width .settings-library-all-floating-menu.is-account-menu {
  width: max-content;
}

.settings-library-all-floating-menu.is-selected {
  display: grid;
}

.settings-library-all-floating-menu strong,
.settings-library-all-floating-menu small,
.settings-library-all-floating-menu-items span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-floating-menu strong {
  font-weight: 950;
}

.settings-library-all-floating-menu small {
  opacity: 0.62;
  font-weight: 800;
}

.settings-library-all-floating-menu-items {
  display: grid;
  gap: 5px;
  min-width: 0;
  max-height: 168px;
  overflow: hidden;
}

.settings-library-all-floating-menu-items span {
  min-height: 24px;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.06);
  font-weight: 850;
}

.settings-library-all-floating-menu.is-menu-plus strong,
.settings-library-all-floating-menu.is-menu-plus small,
.settings-library-all-floating-menu.is-menu-plus .settings-library-all-floating-menu-items span {
  font-weight: var(--favorites-all-menu-plus-weight, 900);
}

.settings-library-all-main-shell {
  position: relative;
  display: grid;
  grid-template-columns:
    minmax(160px, var(--favorites-panel-preview-one, 20fr))
    minmax(430px, var(--favorites-panel-preview-two, 60fr))
    minmax(180px, var(--favorites-panel-preview-three, 20fr));
  gap: 8px;
  height: 470px;
  min-height: 470px;
  align-items: stretch;
  overflow: visible;
}

.settings-library-all-panel-edge-pills {
  position: absolute;
  z-index: 34;
  top: 0;
  right: 0;
  left: 0;
  display: grid;
  grid-template-columns: minmax(160px, 0.78fr) minmax(430px, 1.7fr) minmax(180px, 0.88fr);
  gap: 8px;
  pointer-events: none;
}

.settings-library-all-panel-edge-cell {
  min-width: 0;
  display: flex;
  justify-content: center;
  pointer-events: none;
  transform: translateY(-50%);
}

.settings-library-all-panel-edge-cell > * {
  pointer-events: auto;
}

.settings-library-all-panel-edge-pills .settings-library-all-hotspot,
.settings-library-all-panel-edge-pills .settings-library-all-selector-pill {
  position: static;
  top: auto;
  left: auto;
  transform: none;
}

.settings-library-all-panel-edge-pills .settings-library-all-hotspot {
  min-height: 30px;
  padding: 5px 12px;
  background: rgba(255, 255, 255, 0.92);
  color: #111827;
}

.settings-library-all-panel-edge-pills .settings-library-all-selector-pill {
  min-height: 30px;
  background: rgba(255, 255, 255, 0.92);
  color: #111827;
}

.settings-library-all-panel-edge-pills .settings-library-all-selector-pill select {
  max-width: 154px;
}

.settings-library-all-sidebar,
.settings-library-all-content,
.settings-library-all-rail {
  min-height: 0;
  max-height: 470px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  border-radius: 12px;
  background: var(--favorites-panel-fill, rgba(255, 255, 255, 0.88));
  scrollbar-color: color-mix(in srgb, var(--favorites-all-scroll-thumb, #8a7bff) 78%, transparent) rgba(255, 255, 255, 0.14);
  scrollbar-gutter: stable;
  scrollbar-width: auto;
}

.settings-library-all-sidebar::-webkit-scrollbar,
.settings-library-all-content::-webkit-scrollbar,
.settings-library-all-rail::-webkit-scrollbar {
  width: var(--favorites-all-scrollbar-width, 16px);
}

.settings-library-all-sidebar::-webkit-scrollbar-track,
.settings-library-all-content::-webkit-scrollbar-track,
.settings-library-all-rail::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.14);
}

.settings-library-all-sidebar::-webkit-scrollbar-thumb,
.settings-library-all-content::-webkit-scrollbar-thumb,
.settings-library-all-rail::-webkit-scrollbar-thumb {
  border: 2px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  background: color-mix(in srgb, var(--favorites-all-scroll-thumb, #8a7bff) 78%, transparent);
}

.settings-library-all-stage [data-favorites-all-scroll-target].is-scrollbar-selected {
  outline: 2px solid rgba(109, 93, 252, 0.58);
  outline-offset: -2px;
  box-shadow:
    inset calc(var(--favorites-all-scrollbar-width, 16px) * -0.68) 0 0 color-mix(in srgb, var(--favorites-all-scroll-thumb, #8a7bff) 74%, transparent),
    inset 0 0 0 1px rgba(255, 255, 255, 0.42),
    0 12px 28px rgba(17, 24, 39, 0.08);
}

.settings-library-all-content {
  background: var(--favorites-all-panel2-active-foreground-fill, var(--favorites-panel-fill, rgba(255, 255, 255, 0.88)));
}

.settings-library-all-sidebar {
  --favorites-all-panel1-chip-width: 224px;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 44px 10px 10px;
}

.settings-library-all-sidebar-head,
.settings-library-all-sidebar-card {
  z-index: 1;
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 11px;
  background: var(--favorites-panel-fill, rgba(255, 255, 255, 0.72));
}

.settings-library-all-sidebar-head {
  grid-template-columns: 1fr auto;
  align-items: center;
  color: #26324a;
  font-size: 0.78rem;
  text-transform: uppercase;
}

.settings-library-all-sidebar button,
.settings-library-all-section-head button {
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: rgba(109, 93, 252, 0.08);
  color: #26324a;
  cursor: pointer;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  text-align: left;
}

.settings-library-all-sidebar-head button {
  width: auto;
  padding: 5px 8px;
  text-align: center;
}

.settings-library-all-sidebar-card > span {
  color: rgba(38, 50, 74, 0.62);
  font-size: 0.66rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.settings-library-all-sidebar-pills {
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  padding: 7px 10px 8px 12px;
}

.settings-library-all-sidebar-pills button {
  min-height: 24px;
  border-radius: 999px;
  text-align: center;
}

.settings-library-all-panel1-filter-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: fit-content;
  max-width: 100%;
  min-height: 31px;
  padding: 6px 14px;
  border: 1px solid rgba(109, 93, 252, 0.32);
  border-radius: 999px;
  background: #ffffff;
  color: #172237;
  font-size: 0.72rem;
  font-weight: 950;
  line-height: 1.1;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.54),
    0 10px 22px rgba(68, 80, 140, 0.14);
  white-space: nowrap;
}

.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-filter-buttons-chip {
  min-height: 28px;
  padding: 5px 10px;
  border: 1px solid rgba(109, 93, 252, 0.28);
  background: rgba(255, 255, 255, 0.78);
  color: #26324a;
  font-size: 0.64rem;
  font-weight: 950;
  box-shadow: 0 8px 18px rgba(68, 80, 140, 0.1);
}

.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-text-properties-chip {
  justify-self: start;
  margin: 2px 0 8px 12px;
  min-height: 28px;
  padding: 5px 11px;
  border: 1px solid rgba(109, 93, 252, 0.28);
  background: rgba(255, 255, 255, 0.84);
  color: #172237;
  font-size: 0.64rem;
  font-weight: 950;
  box-shadow: 0 8px 18px rgba(68, 80, 140, 0.1);
}

.settings-library-all-sidebar .settings-library-all-hotspot.is-sidebar-header-chip,
.settings-library-all-sidebar .settings-library-all-hotspot.is-sidebar-outer-chip,
.settings-library-all-sidebar .settings-library-all-hotspot.is-panel-control,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-filter-buttons-chip,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-text-properties-chip {
  width: var(--favorites-all-panel1-chip-width);
  max-width: calc(100% - 24px);
  justify-content: flex-start;
  overflow: hidden;
  text-overflow: ellipsis;
}

.settings-library-all-panel1-filter-chip:hover,
.settings-library-all-panel1-filter-chip:focus-visible,
.settings-library-all-panel1-filter-chip.is-selected {
  border-color: rgba(109, 93, 252, 0.78);
  background: #ffffff;
  outline: none;
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 10px 24px rgba(68, 80, 140, 0.16);
}

.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-filter-buttons-chip:hover,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-filter-buttons-chip:focus-visible,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-filter-buttons-chip.is-selected,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-text-properties-chip:hover,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-text-properties-chip:focus-visible,
.settings-library-all-sidebar .settings-library-all-hotspot.settings-library-all-panel1-filter-chip.is-panel1-text-properties-chip.is-selected {
  border-color: rgba(109, 93, 252, 0.78);
  background: rgba(255, 255, 255, 0.96);
  color: #111827;
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 10px 24px rgba(68, 80, 140, 0.16);
}

.settings-library-all-panel1-filter-chip-dot {
  display: inline-block;
  width: 11px;
  height: 11px;
  flex: 0 0 11px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: #05070a;
  box-shadow: 0 0 0 1px rgba(17, 24, 39, 0.26);
}

.settings-library-all-panel1-filter-chip-dot.is-panel1-text-color-dot {
  background: var(--favorites-all-panel1-text-color, #05070a);
}

.settings-library-all-panel1-playlist-segment {
  min-width: 0;
  min-height: 24px;
  display: inline-flex;
  align-items: stretch;
  border-radius: 999px;
  overflow: hidden;
  background: transparent;
  box-shadow: none;
}

.settings-library-all-panel1-playlist-segment .settings-library-all-panel1-pill {
  min-width: 0;
  flex: 1 1 55%;
  border-radius: 999px;
  border-right: 0;
}

.settings-library-all-panel1-playlist-scope {
  max-width: 0;
  min-width: 0;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0 999px 999px 0;
  background: rgba(226, 228, 232, 0.92);
  color: #111820;
  font-size: 0.58rem;
  font-weight: 850;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translateX(-5px) scaleX(0.88);
  transform-origin: left center;
}

.settings-library-all-panel1-playlist-segment:hover,
.settings-library-all-panel1-playlist-segment:focus-within,
.settings-library-all-panel1-playlist-segment.is-scope-selected {
  background: rgba(226, 228, 232, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.62);
}

.settings-library-all-panel1-playlist-segment:hover .settings-library-all-panel1-pill,
.settings-library-all-panel1-playlist-segment:focus-within .settings-library-all-panel1-pill,
.settings-library-all-panel1-playlist-segment.is-scope-selected .settings-library-all-panel1-pill {
  border-radius: 999px 0 0 999px;
}

.settings-library-all-panel1-playlist-segment:hover .settings-library-all-panel1-playlist-scope,
.settings-library-all-panel1-playlist-segment:focus-within .settings-library-all-panel1-playlist-scope,
.settings-library-all-panel1-playlist-segment.is-scope-selected .settings-library-all-panel1-playlist-scope {
  max-width: 54px;
  min-width: 42px;
  padding: 0 8px;
  opacity: 1;
  pointer-events: auto;
  transform: none;
}

.settings-library-all-panel1-playlist-segment.is-scope-selected .settings-library-all-panel1-pill {
  background: rgba(226, 228, 232, 0.92);
  color: #111820;
}

.settings-library-all-panel1-playlist-segment.is-scope-selected .settings-library-all-panel1-playlist-scope {
  background: rgba(250, 251, 253, 0.98);
  color: #05070a;
}

.settings-library-all-sidebar-toolbar {
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 3px 2px;
}

.settings-library-all-panel1-search {
  min-width: 0;
  overflow: hidden;
  color: rgba(38, 50, 74, 0.6);
  font-size: 0.62rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-panel1-category-button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 26px;
  padding: 0 9px;
  border-radius: 999px;
}

.settings-library-all-view-glyph {
  display: grid;
  grid-template-columns: repeat(2, 4px);
  grid-auto-rows: 4px;
  gap: 3px;
  flex: 0 0 auto;
  width: 11px;
  color: currentColor;
}

.settings-library-all-view-glyph i {
  display: block;
  border-radius: 2px;
  background: currentColor;
  opacity: 0.82;
}

.settings-library-all-view-glyph[data-favorites-all-panel1-view-glyph="list"],
.settings-library-all-view-glyph[data-favorites-all-panel1-view-glyph="compact-list"] {
  grid-template-columns: 12px;
  grid-auto-rows: 2px;
  gap: 3px;
  width: 12px;
}

.settings-library-all-view-glyph[data-favorites-all-panel1-view-glyph="list"] i:nth-child(n+4),
.settings-library-all-view-glyph[data-favorites-all-panel1-view-glyph="compact-list"] i:nth-child(n+4) {
  display: none;
}

.settings-library-all-view-glyph[data-favorites-all-panel1-view-glyph="compact-list"] {
  grid-auto-rows: 1px;
}

.settings-library-all-sidebar-card.is-library-preview-list {
  gap: 7px;
}

.settings-library-all-panel1-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.settings-library-all-panel1-section-head.is-albums {
  margin-top: 5px;
}

.settings-library-all-panel1-section-head.is-playlists {
  margin-top: 6px;
}

.settings-library-all-panel1-section-label {
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.settings-library-all-panel1-section-count {
  min-width: 0;
  color: #6d5dfc;
  text-align: right;
}

.settings-library-all-panel1-group {
  margin-top: 2px;
}

.settings-library-all-panel1-row {
  position: relative;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 4px 38px 4px 6px;
}

.settings-library-all-panel1-row.is-text-sample-row {
  grid-template-columns: minmax(0, 1fr);
  min-height: 24px;
  padding: 3px 38px 3px 8px;
}

.settings-library-all-panel1-row > span:last-child,
.settings-library-all-panel1-row > span:nth-child(2) {
  min-width: 0;
  display: grid;
  gap: 1px;
}

.settings-library-all-panel1-row strong,
.settings-library-all-panel1-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-panel1-row small {
  color: rgba(38, 50, 74, 0.62);
}

.settings-library-all-panel1-dot,
.settings-library-all-panel1-cover {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: linear-gradient(135deg, #c34df0, #1423a8);
}

.settings-library-all-panel1-dot.is-cyan {
  background: linear-gradient(135deg, #6ee7d1, #3278ff);
}

.settings-library-all-panel1-dot.is-green {
  background: linear-gradient(135deg, #89e76e, #3278ff);
}

.settings-library-all-panel1-cover {
  border-radius: 5px;
  background: linear-gradient(135deg, #41b7ff, #743cff 54%, #ff5ca8);
}

.settings-library-all-panel1-row.is-empty-playlist-preview {
  grid-template-columns: 26px minmax(0, 1fr);
}

.settings-library-all-empty-playlist-preview {
  width: 24px;
  height: 24px;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  border: var(--favorites-all-empty-playlist-outline-width, 1px) solid color-mix(in srgb, var(--favorites-all-empty-playlist-outline-color, #aeb7c5) var(--favorites-all-empty-playlist-outline-opacity, 72%), transparent);
  border-radius: 6px;
  background: rgba(8, 10, 14, 0.68);
}

.settings-library-all-empty-playlist-preview svg {
  width: 62%;
  height: 62%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.55;
}

.settings-library-all-stage.is-empty-playlist-outline-disabled .settings-library-all-empty-playlist-preview,
.settings-library-all-stage.is-empty-playlist-outline-hide-selected .settings-library-all-panel1-row.is-empty-playlist-preview.is-selected .settings-library-all-empty-playlist-preview {
  border-color: transparent;
}

.settings-library-all-panel1-title {
  font-family: var(--favorites-all-panel1-header-title-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-header-title-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-header-title-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-header-title-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-header-title-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.78);
}

.settings-library-all-panel1-create {
  font-family: var(--favorites-all-panel1-create-action-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-create-action-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-create-action-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-create-action-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-create-action-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.72);
}

.settings-library-all-panel1-pill {
  border-color: color-mix(in srgb, var(--favorites-all-panel1-mode-pill-selected-bg, #f6f8fb) 72%, transparent);
  background: var(--favorites-all-panel1-mode-pill-selected-bg, #f6f8fb);
  font-family: var(--favorites-all-panel1-mode-pills-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-mode-pills-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-mode-pills-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-mode-pill-selected-color, #05070a);
  font-size: calc(var(--favorites-all-panel1-mode-pills-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.68);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.58), 0 10px 22px rgba(0, 0, 0, 0.12);
}

.settings-library-all-stage:not(.is-panel1-mode-pills-static) .settings-library-all-panel1-pill:not([aria-pressed="true"]) {
  border-color: color-mix(in srgb, var(--favorites-all-panel1-mode-pill-idle-bg, #05070a) 72%, transparent);
  background: var(--favorites-all-panel1-mode-pill-idle-bg, #05070a);
  color: var(--favorites-all-panel1-mode-pill-idle-color, #ffffff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 8px 18px rgba(0, 0, 0, 0.18);
}

.settings-library-all-stage.is-panel1-mode-pills-static .settings-library-all-panel1-pill {
  border-color: color-mix(in srgb, var(--favorites-all-panel1-mode-pill-idle-bg, #05070a) 72%, transparent);
  background: var(--favorites-all-panel1-mode-pill-idle-bg, #05070a);
  color: var(--favorites-all-panel1-mode-pill-idle-color, #ffffff);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 8px 18px rgba(0, 0, 0, 0.18);
}

.settings-library-all-panel1-category-button {
  font-family: var(--favorites-all-panel1-category-button-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-category-button-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-category-button-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-category-button-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-category-button-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.7);
}

.settings-library-all-panel1-search {
  font-family: var(--favorites-all-panel1-search-text-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-search-text-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-search-text-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-search-text-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-search-text-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.62);
}

.settings-library-all-panel1-section-label {
  font-family: var(--favorites-all-panel1-section-labels-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-section-labels-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-section-labels-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-section-labels-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-section-labels-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.66);
}

.settings-library-all-panel1-section-count {
  font-family: var(--favorites-all-panel1-section-counts-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-section-counts-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-section-counts-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-section-counts-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-section-counts-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.62);
}

.settings-library-all-panel1-group {
  font-family: var(--favorites-all-panel1-category-groups-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-category-groups-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-category-groups-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-category-groups-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-category-groups-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.72);
}

.settings-library-all-panel1-row strong {
  font-family: var(--favorites-all-panel1-item-titles-family, var(--favorites-all-panel1-text-family, inherit));
  font-weight: var(--favorites-all-panel1-item-titles-weight, var(--favorites-all-panel1-text-weight, inherit));
  font-style: var(--favorites-all-panel1-item-titles-style, var(--favorites-all-panel1-text-style, normal));
  color: var(--favorites-all-panel1-item-titles-color, var(--favorites-all-panel1-text-color, currentColor));
  font-size: calc(var(--favorites-all-panel1-item-titles-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.68);
}

.settings-library-all-panel1-row small {
  font-family: var(--favorites-all-panel1-item-subtitles-family, var(--favorites-all-panel1-item-meta-family, var(--favorites-all-panel1-text-family, inherit)));
  font-weight: var(--favorites-all-panel1-item-subtitles-weight, var(--favorites-all-panel1-item-meta-weight, var(--favorites-all-panel1-text-weight, inherit)));
  font-style: var(--favorites-all-panel1-item-subtitles-style, var(--favorites-all-panel1-item-meta-style, var(--favorites-all-panel1-text-style, normal)));
  color: var(--favorites-all-panel1-item-subtitles-color, var(--favorites-all-panel1-item-meta-color, var(--favorites-all-panel1-text-color, currentColor)));
  font-size: var(--favorites-all-panel1-item-subtitles-size, var(--favorites-all-panel1-item-meta-size, 0.58rem));
}

.settings-library-all-panel1-count-badge {
  position: absolute;
  top: 4px;
  right: 5px;
  z-index: 2;
  min-width: 20px;
  height: 18px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  border: 1px solid color-mix(in srgb, var(--favorites-all-panel1-count-badge-outline-color, #adcfff) 42%, transparent);
  border-radius: 999px;
  background: var(--favorites-all-panel1-count-badge-fill-color, #050d18);
  color: var(--favorites-all-panel1-count-badge-text-color, #ffffff);
  font-family: var(--favorites-all-panel1-section-counts-family, var(--favorites-all-panel1-text-family, inherit));
  font-size: calc(var(--favorites-all-panel1-section-counts-size, var(--favorites-all-panel1-text-size, 1rem)) * 0.56);
  font-style: var(--favorites-all-panel1-section-counts-style, var(--favorites-all-panel1-text-style, normal));
  font-weight: var(--favorites-all-panel1-count-badge-font-weight, 900);
  line-height: 1;
  box-shadow: 0 6px 14px rgba(15, 23, 42, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.settings-library-all-panel1-count-badge-card {
  border-color: color-mix(in srgb, var(--favorites-all-panel1-count-badge-outline-color, #adcfff) 24%, rgba(143, 154, 179, 0.14));
}

.settings-library-all-panel1-count-badge-demo-row {
  position: relative;
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 9px 44px 9px 12px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.72);
  color: #303a52;
  font-size: 0.74rem;
  font-weight: 850;
}

.settings-library-all-panel1-count-badge-demo-row .settings-library-all-panel1-count-badge {
  top: 10px;
  right: 12px;
}

.settings-library-all-panel1-plan-card {
  z-index: 1;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 5px 8px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(126, 91, 255, 0.3);
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(96, 43, 163, 0.52), rgba(19, 36, 91, 0.68));
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.settings-library-all-panel1-plan-card[hidden] {
  display: none;
}

.settings-library-all-panel1-plan-icon {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  color: rgba(245, 251, 255, 0.96);
  font-size: 1.1rem;
  font-weight: 950;
}

.settings-library-all-panel1-plan-card strong,
.settings-library-all-panel1-plan-card small,
.settings-library-all-panel1-plan-card button {
  min-width: 0;
  font-family: var(--favorites-all-panel1-item-titles-family, var(--favorites-all-panel1-text-family, inherit));
}

.settings-library-all-panel1-plan-card strong {
  overflow: hidden;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-panel1-plan-card small {
  grid-column: 2;
  color: rgba(194, 210, 232, 0.92);
  font-size: 0.56rem;
  line-height: 1.25;
}

.settings-library-all-panel1-plan-card button {
  grid-column: 1 / -1;
  min-height: 24px;
  margin-top: 3px;
  border-radius: 8px;
  background: linear-gradient(100deg, #a715f4 0%, #6540ff 48%, #25a8ff 100%);
  color: #fff;
  font-size: 0.64rem;
  font-weight: 950;
  text-align: center;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar {
  gap: 0;
  padding-inline: 0;
  border-color: transparent;
  border-radius: 6px;
  background: var(--favorites-all-panel1-seamless-fill, var(--favorites-panel-fill, rgba(32, 36, 45, 0.96)));
  box-shadow: none;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar-head,
.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar-card {
  gap: 0;
  margin: 0;
  border-color: transparent;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-hotspot,
.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar .settings-library-all-hotspot {
  border-color: rgba(109, 93, 252, 0.42);
  background: rgba(255, 255, 255, 0.94);
  color: #162033;
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.08),
    0 8px 18px rgba(0, 0, 0, 0.18);
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar-head {
  padding-inline: 10px;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar-card {
  padding: 2px 10px;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar button:not(.settings-library-all-hotspot) {
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar .settings-library-all-panel1-filter-chip {
  border: 1px solid rgba(109, 93, 252, 0.34);
  border-radius: 999px;
  background: #ffffff;
  color: #172237;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.58),
    0 10px 22px rgba(17, 24, 39, 0.16);
}

.settings-library-all-content {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 16px 18px 16px 16px;
}

.settings-library-all-banner {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 82px;
  padding: 12px;
  border-radius: 13px;
  background:
    linear-gradient(135deg, rgba(45, 199, 255, 0.16), rgba(136, 94, 255, 0.18)),
    rgba(255, 255, 255, 0.58);
}

.settings-library-all-banner[data-favorites-all-banner-text-context="artist"] {
  --favorites-all-banner-active-family: var(--favorites-all-banner-text-artist-family, inherit);
  --favorites-all-banner-active-weight: var(--favorites-all-banner-text-artist-weight, inherit);
  --favorites-all-banner-active-style: var(--favorites-all-banner-text-artist-style, inherit);
  --favorites-all-banner-active-color: var(--favorites-all-banner-text-artist-color, #1c2738);
  --favorites-all-banner-active-scale: var(--favorites-all-banner-text-artist-scale, 1);
}

.settings-library-all-banner[data-favorites-all-banner-text-context="album"] {
  --favorites-all-banner-active-family: var(--favorites-all-banner-text-album-family, inherit);
  --favorites-all-banner-active-weight: var(--favorites-all-banner-text-album-weight, inherit);
  --favorites-all-banner-active-style: var(--favorites-all-banner-text-album-style, inherit);
  --favorites-all-banner-active-color: var(--favorites-all-banner-text-album-color, #1c2738);
  --favorites-all-banner-active-scale: var(--favorites-all-banner-text-album-scale, 1);
}

.settings-library-all-banner[data-favorites-all-banner-text-context="playlist"] {
  --favorites-all-banner-active-family: var(--favorites-all-banner-text-playlist-family, inherit);
  --favorites-all-banner-active-weight: var(--favorites-all-banner-text-playlist-weight, inherit);
  --favorites-all-banner-active-style: var(--favorites-all-banner-text-playlist-style, inherit);
  --favorites-all-banner-active-color: var(--favorites-all-banner-text-playlist-color, #1c2738);
  --favorites-all-banner-active-scale: var(--favorites-all-banner-text-playlist-scale, 1);
}

.settings-library-all-banner[data-favorites-all-banner-text-context="empty-playlist"] {
  --favorites-all-banner-active-family: var(--favorites-all-banner-text-empty-playlist-family, inherit);
  --favorites-all-banner-active-weight: var(--favorites-all-banner-text-empty-playlist-weight, inherit);
  --favorites-all-banner-active-style: var(--favorites-all-banner-text-empty-playlist-style, inherit);
  --favorites-all-banner-active-color: var(--favorites-all-banner-text-empty-playlist-color, #1c2738);
  --favorites-all-banner-active-scale: var(--favorites-all-banner-text-empty-playlist-scale, 1);
}

.settings-library-all-banner[data-favorites-all-banner-text-context="likes"] {
  --favorites-all-banner-active-family: var(--favorites-all-banner-text-likes-family, inherit);
  --favorites-all-banner-active-weight: var(--favorites-all-banner-text-likes-weight, inherit);
  --favorites-all-banner-active-style: var(--favorites-all-banner-text-likes-style, inherit);
  --favorites-all-banner-active-color: var(--favorites-all-banner-text-likes-color, #1c2738);
  --favorites-all-banner-active-scale: var(--favorites-all-banner-text-likes-scale, 1);
}

.settings-library-all-banner-art {
  display: var(--favorites-all-banner-art-display, block);
  width: 64px;
  height: 50px;
  border-radius: 12px;
  background:
    linear-gradient(135deg, #39d2ff, #7a5cff 48%, #ff6eae),
    #6d5dfc;
  background-position: center;
  background-size: var(--favorites-all-banner-fit, cover);
  box-shadow: 0 12px 26px rgba(37, 55, 91, 0.18);
}

.settings-library-all-banner-copy,
.settings-library-all-banner-badges {
  display: grid;
  gap: 4px;
  min-width: 0;
  color: var(--favorites-all-banner-active-color, #1c2738);
  font-family: var(--favorites-all-banner-active-family, inherit);
  font-style: var(--favorites-all-banner-active-style, normal);
  font-weight: var(--favorites-all-banner-active-weight, inherit);
}

.settings-library-all-banner-copy strong {
  overflow: hidden;
  color: currentColor;
  font-family: inherit;
  font-size: calc(0.86rem * var(--favorites-all-banner-active-scale, 1));
  font-style: inherit;
  font-weight: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-banner-copy span {
  color: color-mix(in srgb, currentColor 70%, transparent);
  font-family: inherit;
  font-size: calc(0.66rem * var(--favorites-all-banner-active-scale, 1));
  font-style: inherit;
  font-weight: inherit;
}

.settings-library-all-banner-badges {
  justify-items: end;
}

.settings-library-all-banner-badges span {
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(109, 93, 252, 0.12);
  color: currentColor;
  font-family: inherit;
  font-size: calc(0.62rem * var(--favorites-all-banner-active-scale, 1));
  font-style: inherit;
  font-weight: inherit;
}

.settings-library-all-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
}

.settings-library-all-section-head strong {
  color: #1c2738;
  font-size: 0.84rem;
  font-weight: 950;
}

.settings-library-all-section-head span {
  color: rgba(38, 50, 74, 0.68);
  font-size: 0.7rem;
  font-weight: 800;
}

.settings-library-all-view-toggle {
  display: inline-grid;
  grid-template-columns: repeat(2, 18px);
  gap: 4px;
  padding: 4px;
  border: 1px solid transparent;
  border-radius: 9px;
  background: rgba(109, 93, 252, 0.12);
  color: inherit;
  cursor: pointer;
  font: inherit;
  transition:
    border-color 0.16s ease,
    background 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.settings-library-all-view-toggle span {
  display: block;
  height: 18px;
  border-radius: 5px;
  background: rgba(109, 93, 252, 0.64);
}

.settings-library-all-album-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.settings-library-all-card-shelf {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--favorites-all-panel2-active-foreground-solid, #05080c) 44%, transparent);
}

.settings-library-all-card-shelf[data-favorites-all-panel2-section-key="albumMoreByVisible"] {
  background: var(--favorites-all-album-more-by-card-background, color-mix(in srgb, var(--favorites-all-panel2-active-foreground-solid, #05080c) 44%, transparent));
}

.settings-library-all-card-shelf[data-favorites-all-panel2-section-key="albumPeopleAlsoAddedVisible"] {
  background: var(--favorites-all-album-people-card-background, color-mix(in srgb, var(--favorites-all-panel2-active-foreground-solid, #05080c) 44%, transparent));
}

.settings-library-all-card-shelf[data-favorites-all-panel2-section-key="albumNewPopularVisible"] {
  background: var(--favorites-all-album-new-popular-card-background, color-mix(in srgb, var(--favorites-all-panel2-active-foreground-solid, #05080c) 44%, transparent));
}

.settings-library-all-album-section-card-picker {
  display: grid;
  gap: 12px;
}

.settings-library-all-album-section-card-stack {
  display: grid;
  gap: 12px;
}

.settings-library-all-album-section-card-control {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.56);
}

.settings-library-all-album-section-card-control.is-disabled {
  background: rgba(248, 250, 255, 0.28);
}

.settings-library-all-album-section-card-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  min-height: 56px;
  padding: 10px 12px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.74);
}

.settings-library-all-album-section-card-toggle.is-disabled {
  background: rgba(244, 247, 252, 0.66);
}

.settings-library-all-album-section-card-title {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-library-all-album-section-card-title strong {
  min-width: 0;
  overflow: hidden;
  color: #2f384f;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.16;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-album-section-card-title em {
  color: #6d5dfc;
  font-size: 0.76rem;
  font-style: normal;
  font-weight: 850;
  line-height: 1.1;
}

.settings-library-all-album-section-card-toggle.is-disabled .settings-library-all-album-section-card-title em {
  color: rgba(72, 82, 111, 0.66);
}

.settings-library-all-album-section-card-toggle .settings-toggle-control {
  flex: 0 0 auto;
  margin-left: auto;
}

.settings-library-all-card-shelf[data-favorites-all-panel2-section-draggable] {
  cursor: grab;
  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    opacity 0.16s ease,
    transform 0.16s ease;
}

.settings-library-all-card-shelf[data-favorites-all-panel2-section-draggable]::after {
  content: "::";
  position: absolute;
  top: 9px;
  right: 12px;
  color: rgba(92, 105, 132, 0.74);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 2px;
  pointer-events: none;
}

.settings-library-all-card-shelf.is-panel2-section-dragging {
  cursor: grabbing;
  opacity: 0.56;
  transform: scale(0.985);
}

.settings-library-all-card-shelf.is-panel2-section-drop-target {
  box-shadow:
    inset 0 0 0 2px rgba(109, 93, 252, 0.74),
    0 12px 32px rgba(109, 93, 252, 0.18);
}

.settings-library-all-footer-wrap {
  min-width: 0;
}

.settings-library-all-footer-wrap[hidden] {
  display: none;
}

.settings-library-all-footer-preview {
  position: relative;
  display: grid;
  gap: 16px;
  min-width: 0;
  margin-top: 2px;
  padding: 20px 18px 14px;
  border: 1px solid rgba(123, 132, 166, 0.2);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(5, 8, 12, 0.94), rgba(11, 16, 24, 0.9)),
    #05080c;
  color: rgba(240, 246, 255, 0.92);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 14px 30px rgba(4, 9, 18, 0.16);
}

.settings-library-all-footer-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 16px;
  min-width: 0;
}

.settings-library-all-footer-grid section {
  display: grid;
  align-content: start;
  gap: 6px;
  min-width: 0;
}

.settings-library-all-footer-grid strong {
  overflow: hidden;
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-footer-grid span,
.settings-library-all-footer-copy {
  overflow-wrap: anywhere;
}

.settings-library-all-footer-grid section > span {
  color: rgba(198, 211, 229, 0.84);
  font-size: 0.62rem;
  font-weight: 780;
}

.settings-library-all-footer-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
}

.settings-library-all-footer-policy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 0 14px;
  border: var(--favorites-all-footer-policy-border-width, 1px) solid var(--favorites-all-footer-policy-border-color, rgba(255, 255, 255, 0.22));
  border-radius: 999px;
  background: var(--favorites-all-footer-policy-bg, transparent);
  color: var(--favorites-all-footer-policy-color, #ffffff);
  font-size: 0.66rem;
  font-weight: 950;
  box-shadow: var(--favorites-all-footer-policy-shadow, none);
}

.settings-library-all-footer-copy {
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: var(--favorites-all-footer-copy-color, #b1c6e0);
  font-size: var(--favorites-all-footer-copy-size, 1rem);
  font-weight: 800;
}

.settings-library-all-footer-copy[hidden] {
  display: none;
}

.settings-library-all-footer-preview .settings-footer-social-icon-preview {
  width: 28px;
  height: 28px;
  box-shadow: none;
}

.settings-library-all-hotspot.is-footer-chip {
  position: absolute;
  top: -13px;
  left: 18px;
}

.settings-library-all-footer-divider {
  height: 1px;
  margin: 2px 0;
  background: linear-gradient(90deg, transparent, rgba(143, 154, 179, 0.22), transparent);
}

.settings-library-all-footer-social-list,
.settings-library-all-footer-social-row {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-footer-social-appearance {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) repeat(2, minmax(78px, 0.72fr));
  gap: 8px;
  min-width: 0;
}

.settings-library-all-footer-social-appearance label,
.settings-library-all-footer-social-url {
  display: grid;
  gap: 6px;
  min-width: 0;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 850;
}

.settings-library-all-footer-social-row {
  padding: 10px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.68);
}

.settings-library-all-footer-social-row .settings-library-all-menu-item-toggle {
  width: 100%;
}

.settings-library-all-footer-social-row .settings-library-all-menu-item-action {
  width: 34px;
  height: 34px;
}

.settings-library-all-footer-social-row .settings-footer-social-icon-preview {
  width: 28px;
  height: 28px;
}

.settings-library-all-panel2-foreground-surface,
.settings-library-all-panel2-per-type {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.68);
}

.settings-library-all-panel2-foreground-surface.is-disabled {
  opacity: 0.58;
}

.settings-library-all-panel2-per-type.is-global {
  background: rgba(248, 250, 255, 0.42);
}

.settings-library-all-section-visibility-group,
.settings-library-all-panel2-section-group {
  display: grid;
  gap: 10px;
}

.settings-library-all-panel2-section-group + .settings-library-all-panel2-section-group {
  margin-top: 12px;
}

.settings-library-all-stage[data-favorites-all-panel2-mode="albums"] [data-favorites-all-panel2-section]:not([data-favorites-all-panel2-section="albums"]),
.settings-library-all-stage[data-favorites-all-panel2-mode="albumDirectory"] [data-favorites-all-panel2-section]:not([data-favorites-all-panel2-section="albumDirectory"]),
.settings-library-all-stage[data-favorites-all-panel2-mode="artists"] [data-favorites-all-panel2-section]:not([data-favorites-all-panel2-section="artists"]),
.settings-library-all-stage[data-favorites-all-panel2-mode="artistDirectory"] [data-favorites-all-panel2-section]:not([data-favorites-all-panel2-section="artistDirectory"]),
.settings-library-all-stage[data-favorites-all-panel2-mode="playlists"] [data-favorites-all-panel2-section]:not([data-favorites-all-panel2-section="playlists"]),
.settings-library-all-stage[data-favorites-all-panel2-mode="likes"] [data-favorites-all-panel2-section]:not([data-favorites-all-panel2-section="likes"]) {
  display: none;
}

.settings-library-all-album-card {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.settings-library-all-cover {
  display: block;
  aspect-ratio: 1;
  border-radius: 10px;
  background:
    linear-gradient(135deg, #25d0ff, #7c55ff 48%, #ff5d9e),
    #6d5dfc;
  box-shadow: 0 10px 22px rgba(37, 55, 91, 0.16);
}

.settings-library-all-cover.is-gold {
  background: linear-gradient(135deg, #ffe28a, #43ba8e 52%, #245d7c);
}

.settings-library-all-cover.is-sunset {
  background: linear-gradient(135deg, #ff6d7d, #873fff 52%, #25d0ff);
}

.settings-library-all-cover.is-cyan {
  background: linear-gradient(135deg, #1ed4ff, #2c4b8f 52%, #06172a);
}

.settings-library-all-cover.is-violet {
  background: linear-gradient(135deg, #744dff, #0d2754 52%, #f46cff);
}

.settings-library-all-artist-strip,
.settings-library-all-playlist-list {
  display: grid;
  gap: 8px;
}

.settings-library-all-artist-strip {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.settings-library-all-artist-strip article,
.settings-library-all-playlist-list article {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 10px;
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.58);
  box-shadow: inset 0 0 0 1px rgba(123, 132, 166, 0.12);
}

.settings-library-all-artist-strip .settings-library-all-avatar {
  width: 38px;
  height: 38px;
  border-radius: 13px;
}

.settings-library-all-avatar.is-blue {
  background: linear-gradient(135deg, #39d2ff, #6d5dfc);
}

.settings-library-all-avatar.is-green {
  background: linear-gradient(135deg, #7de2aa, #277c6a);
}

.settings-library-all-avatar.is-pink {
  background: linear-gradient(135deg, #ff72a8, #7357ff);
}

.settings-library-all-artist-strip strong,
.settings-library-all-artist-strip small,
.settings-library-all-playlist-list strong,
.settings-library-all-playlist-list span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-artist-strip strong,
.settings-library-all-playlist-list strong {
  color: #1c2738;
  font-size: 0.7rem;
  font-weight: 950;
}

.settings-library-all-artist-strip small,
.settings-library-all-playlist-list span {
  color: rgba(38, 50, 74, 0.62);
  font-size: 0.62rem;
  font-weight: 800;
}

.settings-library-all-album-card strong,
.settings-library-all-album-card span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-album-card strong {
  color: #1c2738;
  font-size: 0.66rem;
  font-weight: 950;
}

.settings-library-all-album-card span {
  color: rgba(38, 50, 74, 0.68);
  font-size: 0.62rem;
  font-weight: 750;
}

.settings-library-all-top-tracks {
  position: relative;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 0;
  align-content: start;
  min-width: 0;
  min-height: 282px;
  margin-top: 8px;
  padding: 0;
  border: 1px solid rgba(123, 132, 166, 0.18);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.64), rgba(245, 248, 255, 0.5)),
    rgba(255, 255, 255, 0.54);
  overflow: visible;
  isolation: isolate;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.58),
    0 18px 34px rgba(37, 55, 91, 0.12);
}

.settings-library-all-top-tracks::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 0;
  height: 86px;
  border-radius: 14px 14px 10px 10px;
  background: var(--favorites-all-track-header-fill, rgba(255, 255, 255, 0.54));
  pointer-events: none;
  box-shadow:
    inset 0 -1px 0 var(--favorites-all-track-separator-color, rgba(123, 132, 166, 0.2)),
    0 14px 28px rgba(17, 24, 39, 0.12);
}

.settings-library-all-top-tracks > * {
  position: relative;
  z-index: 1;
}

.settings-library-all-top-tracks .settings-library-all-section-head {
  min-height: 70px;
  padding: 22px 16px 12px;
  align-items: end;
}

.settings-library-all-hotspot.is-menu-options-chip {
  top: -22px;
  left: 108px;
  z-index: 4;
  border-color: rgba(255, 255, 255, 0.9);
  background: #ffffff;
  color: #1c2738;
  box-shadow: 0 10px 24px rgba(37, 55, 91, 0.2);
}

.settings-library-all-hotspot.is-menu-options-chip::before {
  background: #1c2738;
}

.settings-library-all-track-menu-dots {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  background: rgba(5, 8, 14, 0.32);
  color: #fff;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(6, 10, 18, 0.18);
}

.settings-library-all-track-menu-dots span {
  display: inline-flex;
  gap: 4px;
  align-items: center;
}

.settings-library-all-track-menu-dots i {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: currentColor;
}

.settings-library-all-track-menu-dots:hover,
.settings-library-all-track-menu-dots.is-selected {
  border-color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.18);
}

.settings-library-all-track-preview-title-stack {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-library-all-top-tracks .settings-library-all-section-head strong {
  color: var(--favorites-all-track-primary-label-color, #f8fbff);
  font-family: var(--favorites-all-track-primary-label-family, inherit);
  font-size: var(--favorites-all-track-primary-label-size, 0.92rem);
  font-style: var(--favorites-all-track-primary-label-style, normal);
  font-weight: var(--favorites-all-track-primary-label-weight, 950);
  letter-spacing: 0;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.28);
}

.settings-library-all-track-preview-title-stack em {
  color: var(--favorites-all-track-secondary-label-color, rgba(180, 255, 245, 0.88));
  font-family: var(--favorites-all-track-secondary-label-family, inherit);
  font-size: var(--favorites-all-track-secondary-label-size, 0.56rem);
  font-style: var(--favorites-all-track-secondary-label-style, normal);
  font-weight: var(--favorites-all-track-secondary-label-weight, 950);
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.22);
}

.settings-library-all-top-tracks [data-favorites-all-track-count-summary] {
  color: var(--favorites-all-track-count-summary-color, rgba(248, 251, 255, 0.78));
  font-family: var(--favorites-all-track-count-summary-family, inherit);
  font-size: var(--favorites-all-track-count-summary-size, 0.62rem);
  font-style: var(--favorites-all-track-count-summary-style, normal);
  font-weight: var(--favorites-all-track-count-summary-weight, 900);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.22);
}

.settings-library-all-track-head,
.settings-library-all-track-row {
  display: grid;
  grid-template-columns: 24px 34px minmax(140px, 1fr) minmax(80px, 0.58fr) 42px;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.settings-library-all-track-head {
  color: var(--favorites-all-track-table-header-color, rgba(38, 50, 74, 0.58));
  font-family: var(--favorites-all-track-table-header-family, inherit);
  font-size: var(--favorites-all-track-table-header-size, 0.62rem);
  font-style: var(--favorites-all-track-table-header-style, normal);
  font-weight: var(--favorites-all-track-table-header-weight, 950);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 10px 14px 8px;
  border-bottom: var(--favorites-all-track-separator-size, 1px) solid var(--favorites-all-track-separator-color, rgba(123, 132, 166, 0.2));
  background: rgba(248, 250, 255, 0.42);
}

.settings-library-all-track-table {
  display: grid;
  grid-auto-rows: minmax(38px, auto);
  min-width: 0;
  min-height: 190px;
  margin: 0 14px 14px;
  border: 1px solid rgba(123, 132, 166, 0.16);
  border-radius: 10px;
  overflow: hidden;
  background: rgba(248, 250, 255, 0.52);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    0 12px 24px rgba(37, 55, 91, 0.1);
}

.settings-library-all-track-row {
  position: relative;
  min-height: 38px;
  padding: 6px 10px;
  border: 0;
  border-bottom: 1px solid rgba(123, 132, 166, 0.14);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.46);
  color: #1c2738;
  cursor: pointer;
  font: inherit;
  isolation: isolate;
  overflow: hidden;
  text-align: left;
}

.settings-library-all-track-row > * {
  position: relative;
  z-index: 1;
}

.settings-library-all-track-row::before,
.settings-library-all-track-row::after {
  content: "";
  position: absolute;
  inset: 2px;
  z-index: 0;
  border-radius: var(--favorites-all-track-row-hover-radius, 10px);
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 0.18s ease,
    background 0.18s ease,
    border-color 0.18s ease,
    border-radius 0.18s ease;
}

.settings-library-all-track-row::before {
  background:
    linear-gradient(135deg, var(--favorites-all-track-row-glass-fill, rgba(159, 220, 255, 0)), rgba(255, 255, 255, 0.08) 44%, rgba(255, 255, 255, 0) 78%),
    radial-gradient(circle at 12% 0%, var(--favorites-all-track-row-glow-top, rgba(165, 92, 255, 0.2)), transparent 48%),
    radial-gradient(circle at 42% 4%, var(--favorites-all-track-row-glow-mid, rgba(72, 184, 255, 0.16)), transparent 52%),
    linear-gradient(180deg, rgba(255, 255, 255, 0), var(--favorites-all-track-row-glow-bottom, rgba(255, 255, 255, 0.075)) 28%, rgba(255, 255, 255, 0) 82%);
}

.settings-library-all-track-row::after {
  border: var(--favorites-all-track-row-hover-border-width, 1px) solid var(--favorites-all-track-row-hover-border-color, rgba(219, 246, 255, 0.18));
  background: var(--favorites-all-track-row-hover-background, linear-gradient(135deg, rgba(159, 220, 255, 0.18), rgba(255, 255, 255, 0.04) 42%, rgba(255, 255, 255, 0) 78%));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    0 10px 22px rgba(37, 55, 91, 0.12);
}

.settings-library-all-track-row:last-child {
  border-bottom: 0;
}

.settings-library-all-track-row:hover,
.settings-library-all-track-row.is-selected,
.settings-library-all-track-row.is-featured {
  background: rgba(255, 255, 255, 0.52);
  box-shadow: inset 0 0 0 1px rgba(109, 93, 252, 0.2);
}

.settings-library-all-track-row.is-featured::before {
  opacity: var(--favorites-all-track-row-glow-opacity, 0.88);
}

.settings-library-all-track-row:hover::after,
.settings-library-all-track-row:focus-visible::after {
  opacity: var(--favorites-all-track-row-hover-opacity, 0.18);
}

.settings-library-all-track-row.is-selected::after {
  border: var(--favorites-all-track-row-selected-border-width, 1px) solid var(--favorites-all-track-row-selected-border-color, rgba(219, 246, 255, 0.24));
  border-radius: var(--favorites-all-track-row-selected-radius, 10px);
  background: var(--favorites-all-track-row-selected-background, linear-gradient(135deg, rgba(159, 220, 255, 0.32), rgba(255, 255, 255, 0.08) 42%, rgba(255, 255, 255, 0) 78%));
  opacity: var(--favorites-all-track-row-selected-opacity, 0.32);
}

.settings-library-all-track-play {
  color: rgba(38, 50, 74, 0.76);
  font-size: 0.66rem;
  font-weight: 900;
}

.settings-library-all-track-number {
  color: var(--favorites-all-track-number-color, rgba(38, 50, 74, 0.76));
  font-family: var(--favorites-all-track-number-family, inherit);
  font-size: var(--favorites-all-track-number-size, 0.66rem);
  font-style: var(--favorites-all-track-number-style, normal);
  font-weight: var(--favorites-all-track-number-weight, 900);
}

.settings-library-all-track-time {
  color: var(--favorites-all-track-duration-color, rgba(38, 50, 74, 0.76));
  font-family: var(--favorites-all-track-duration-family, inherit);
  font-size: var(--favorites-all-track-duration-size, 0.66rem);
  font-style: var(--favorites-all-track-duration-style, normal);
  font-weight: var(--favorites-all-track-duration-weight, 900);
}

.settings-library-all-track-title {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-library-all-track-title strong,
.settings-library-all-track-title small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-track-title strong {
  color: var(--favorites-all-track-title-color, #1c2738);
  font-family: var(--favorites-all-track-title-family, inherit);
  font-size: var(--favorites-all-track-title-size, 0.7rem);
  font-style: var(--favorites-all-track-title-style, normal);
  font-weight: var(--favorites-all-track-title-weight, 950);
}

.settings-library-all-track-title small {
  color: var(--favorites-all-track-artist-color, rgba(38, 50, 74, 0.58));
  font-family: var(--favorites-all-track-artist-family, inherit);
  font-size: var(--favorites-all-track-artist-size, 0.58rem);
  font-style: var(--favorites-all-track-artist-style, normal);
  font-weight: var(--favorites-all-track-artist-weight, 800);
}

.settings-library-all-stage.is-panel2-track-artist-name-hidden .settings-library-all-track-title {
  gap: 0;
}

.settings-library-all-stage.is-panel2-track-artist-name-hidden .settings-library-all-track-title small {
  display: none;
}

.settings-library-all-stage.is-panel2-track-title-hidden .settings-library-all-track-title strong,
.settings-library-all-stage.is-panel2-track-number-hidden .settings-library-all-track-number,
.settings-library-all-stage.is-panel2-track-number-hidden .settings-library-all-track-head span:nth-child(2),
.settings-library-all-stage.is-panel2-track-popularity-hidden .settings-library-all-popularity,
.settings-library-all-stage.is-panel2-track-popularity-hidden .settings-library-all-track-head span:nth-child(4) {
  display: none;
}

.settings-library-all-stage.is-panel2-track-primary-hidden [data-favorites-all-track-primary-label],
.settings-library-all-stage.is-panel2-track-secondary-hidden [data-favorites-all-track-secondary-label],
.settings-library-all-stage.is-panel2-track-count-hidden [data-favorites-all-track-count-summary],
.settings-library-all-stage.is-panel2-track-table-hidden .settings-library-all-track-head,
.settings-library-all-stage.is-panel2-track-duration-hidden .settings-library-all-track-time,
.settings-library-all-stage.is-panel2-track-wave-hidden .settings-library-all-popularity {
  display: none;
}

.settings-library-all-stage.is-panel2-track-glass-hidden .settings-library-all-track-row::before,
.settings-library-all-stage.is-panel2-track-hover-glass-hidden .settings-library-all-track-row::after {
  display: none;
  opacity: 0;
}

.settings-library-all-stage.is-panel2-track-dividers-hidden .settings-library-all-track-row {
  border-bottom-color: transparent;
}

.settings-library-all-stage.is-panel2-track-backplate-removed .settings-library-all-top-tracks,
.settings-library-all-stage.is-panel2-track-backplate-removed .settings-library-all-track-table {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

.settings-library-all-popularity {
  display: flex;
  gap: 2px;
  align-items: center;
}

.settings-library-all-popularity i {
  display: block;
  width: 4px;
  height: 13px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--favorites-all-track-popularity-color, #8a73ff), #31cfff);
}

.settings-library-all-popularity i:nth-child(2n) {
  height: 9px;
}

.settings-library-all-popularity i:nth-child(5),
.settings-library-all-popularity i:nth-child(6) {
  opacity: 0.28;
}

.settings-library-all-rail {
  display: grid;
  align-content: stretch;
  gap: 8px;
  padding: 12px;
}

.settings-library-all-rail-card {
  z-index: 1;
  display: grid;
  min-height: 320px;
  padding: 10px;
  border-radius: 12px;
  background: var(--favorites-panel-fill, rgba(255, 255, 255, 0.7));
}

.settings-library-all-rail-mode {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 12px;
  border-radius: 11px;
  background: var(--favorites-panel-fill, rgba(255, 255, 255, 0.7));
}

.settings-library-all-stage[data-favorites-all-panel3-mode="detail"] [data-favorites-all-panel3-section]:not([data-favorites-all-panel3-section="detail"]),
.settings-library-all-stage[data-favorites-all-panel3-mode="queue"] [data-favorites-all-panel3-section]:not([data-favorites-all-panel3-section="queue"]),
.settings-library-all-stage[data-favorites-all-panel3-mode="friends"] [data-favorites-all-panel3-section]:not([data-favorites-all-panel3-section="friends"]),
.settings-library-all-stage[data-favorites-all-panel3-mode="recents"] [data-favorites-all-panel3-section]:not([data-favorites-all-panel3-section="recents"]),
.settings-library-all-stage[data-favorites-all-panel3-mode="fullView"] [data-favorites-all-panel3-section]:not([data-favorites-all-panel3-section="fullView"]) {
  display: none;
}

.settings-library-all-rail-mode.is-full-view-mode {
  place-items: start end;
  min-height: 120px;
}

.settings-library-all-full-view-button {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.88);
  color: rgba(235, 239, 247, 0.9);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
  cursor: pointer;
}

.settings-library-all-full-view-glyph {
  position: relative;
  display: block;
  width: 20px;
  height: 20px;
}

.settings-library-all-full-view-glyph::before,
.settings-library-all-full-view-glyph::after {
  position: absolute;
  width: 10px;
  height: 10px;
  content: "";
}

.settings-library-all-full-view-glyph::before {
  top: 0;
  right: 0;
  border-top: 3px solid currentColor;
  border-right: 3px solid currentColor;
}

.settings-library-all-full-view-glyph::after {
  bottom: 0;
  left: 0;
  border-bottom: 3px solid currentColor;
  border-left: 3px solid currentColor;
}

.settings-library-all-rail-mode p {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  color: #26324a;
  font-size: 0.66rem;
  font-weight: 850;
}

.settings-library-all-rail-mode p span {
  color: rgba(38, 50, 74, 0.62);
  font-size: 0.62rem;
}

.settings-library-all-detail-stack {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-detail-cover {
  display: block;
  width: 100%;
  aspect-ratio: 1.55;
  border-radius: 12px;
  background:
    linear-gradient(135deg, #39d2ff, #6d5dfc 48%, #f46cff),
    #6d5dfc;
}

.settings-library-all-detail-cover.is-violet {
  background: linear-gradient(135deg, #744dff, #0d2754 52%, #f46cff);
}

.settings-library-all-detail-stack strong {
  color: #1c2738;
  font-size: 0.78rem;
  font-weight: 950;
}

.settings-library-all-detail-stack p {
  display: block;
  color: rgba(38, 50, 74, 0.62);
  font-size: 0.62rem;
  line-height: 1.35;
}

.settings-library-all-rail-mode[data-favorites-all-panel3-section="detail"] .settings-library-all-section-head strong {
  font-family: var(--favorites-all-detail-rail-card-title-family, var(--favorites-all-detail-rail-text-family, inherit));
  font-weight: var(--favorites-all-detail-rail-card-title-weight, var(--favorites-all-detail-rail-text-weight, 950));
  font-style: var(--favorites-all-detail-rail-card-title-style, var(--favorites-all-detail-rail-text-style, normal));
  color: var(--favorites-all-detail-rail-card-title-color, var(--favorites-all-detail-rail-text-color, #1c2738));
  font-size: var(--favorites-all-detail-rail-card-title-size, 0.84rem);
}

.settings-library-all-rail-mode[data-favorites-all-panel3-section="detail"] .settings-library-all-section-head span {
  font-family: var(--favorites-all-detail-rail-meta-family, var(--favorites-all-detail-rail-text-family, inherit));
  font-weight: var(--favorites-all-detail-rail-meta-weight, var(--favorites-all-detail-rail-text-weight, 800));
  font-style: var(--favorites-all-detail-rail-meta-style, var(--favorites-all-detail-rail-text-style, normal));
  color: var(--favorites-all-detail-rail-meta-color, var(--favorites-all-detail-rail-text-color, rgba(38, 50, 74, 0.68)));
  font-size: var(--favorites-all-detail-rail-meta-size, 0.7rem);
}

.settings-library-all-rail-mode[data-favorites-all-panel3-section="detail"] .settings-library-all-detail-stack strong {
  font-family: var(--favorites-all-detail-rail-title-family, var(--favorites-all-detail-rail-text-family, inherit));
  font-weight: var(--favorites-all-detail-rail-title-weight, var(--favorites-all-detail-rail-text-weight, 950));
  font-style: var(--favorites-all-detail-rail-title-style, var(--favorites-all-detail-rail-text-style, normal));
  color: var(--favorites-all-detail-rail-title-color, var(--favorites-all-detail-rail-text-color, #1c2738));
  font-size: var(--favorites-all-detail-rail-title-size, 0.78rem);
}

.settings-library-all-rail-mode[data-favorites-all-panel3-section="detail"] .settings-library-all-detail-stack p {
  font-family: var(--favorites-all-detail-rail-description-family, var(--favorites-all-detail-rail-text-family, inherit));
  font-weight: var(--favorites-all-detail-rail-description-weight, var(--favorites-all-detail-rail-text-weight, 700));
  font-style: var(--favorites-all-detail-rail-description-style, var(--favorites-all-detail-rail-text-style, normal));
  color: var(--favorites-all-detail-rail-description-color, var(--favorites-all-detail-rail-text-color, rgba(38, 50, 74, 0.62)));
  font-size: var(--favorites-all-detail-rail-description-size, 0.62rem);
}

.settings-library-all-detail-line {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: rgba(38, 50, 74, 0.14);
}

.settings-library-all-detail-line.is-short {
  width: 68%;
}

.settings-library-all-detail-action-preview {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-detail-share-preview {
  position: relative;
  display: inline-flex;
  width: 28px;
  height: 28px;
  color: rgba(38, 50, 74, 0.62);
}

.settings-library-all-detail-share-preview::before,
.settings-library-all-detail-share-preview::after {
  content: "";
  position: absolute;
  left: 9px;
  width: 15px;
  height: 3px;
  border-radius: 999px;
  background: currentColor;
  transform-origin: left center;
}

.settings-library-all-detail-share-preview::before {
  top: 11px;
  transform: rotate(-27deg);
}

.settings-library-all-detail-share-preview::after {
  top: 16px;
  transform: rotate(27deg);
}

.settings-library-all-detail-share-preview i {
  position: absolute;
  z-index: 1;
  width: 12px;
  height: 12px;
  border: 3px solid currentColor;
  border-radius: 999px;
  background: rgba(245, 247, 252, 0.9);
  box-sizing: border-box;
}

.settings-library-all-detail-share-preview i:nth-child(1) {
  left: 0;
  top: 8px;
}

.settings-library-all-detail-share-preview i:nth-child(2) {
  right: 0;
  top: 0;
}

.settings-library-all-detail-share-preview i:nth-child(3) {
  right: 0;
  bottom: 0;
}

.settings-library-all-detail-check-preview {
  width: var(--favorites-all-detail-rail-check-circle-size, 44px);
  min-width: var(--favorites-all-detail-rail-check-circle-size, 44px);
  height: var(--favorites-all-detail-rail-check-circle-size, 44px);
  min-height: var(--favorites-all-detail-rail-check-circle-size, 44px);
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: var(--favorites-all-detail-rail-check-circle-color, #70ee92);
  color: var(--favorites-all-detail-rail-check-mark-color, #06140d);
  box-shadow: 0 0 0 1px rgba(112, 238, 146, 0.24), 0 12px 24px rgba(42, 218, 120, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.34);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: inherit;
  font-size: 1.42rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.settings-library-all-detail-check-preview:hover,
.settings-library-all-detail-check-preview:focus-visible,
.settings-library-all-detail-check-preview.is-selected {
  outline: none;
  box-shadow: 0 0 0 3px rgba(132, 120, 255, 0.26), 0 14px 28px rgba(42, 218, 120, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transform: translateY(-1px);
}

.settings-library-all-detail-follow-preview {
  justify-self: end;
  width: min(var(--favorites-all-detail-rail-follow-button-width, 132px), 100%);
  min-width: min(var(--favorites-all-detail-rail-follow-button-width, 132px), 100%);
  min-height: var(--favorites-all-detail-rail-follow-button-height, 45px);
  padding: 0 24px;
  border: var(--favorites-all-detail-rail-follow-button-border-width, 1px) solid var(--favorites-all-detail-rail-follow-button-border-color, #ffffff);
  border-radius: 999px;
  background: var(--favorites-all-detail-rail-follow-button-bg, #05070a);
  color: var(--favorites-all-detail-rail-follow-button-color, #ffffff);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
  font: inherit;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.settings-library-all-detail-follow-preview span + span {
  display: none;
}

.settings-library-all-detail-follow-preview:hover,
.settings-library-all-detail-follow-preview:focus-visible {
  outline: none;
  background: var(--favorites-all-detail-rail-follow-button-hover-bg, #ffffff);
  border-color: var(--favorites-all-detail-rail-follow-button-hover-border-color, #ffffff);
  color: var(--favorites-all-detail-rail-follow-button-hover-color, #07111d);
  transform: translateY(-1px);
}

.settings-library-all-detail-follow-preview:hover span:first-child,
.settings-library-all-detail-follow-preview:focus-visible span:first-child {
  display: none;
}

.settings-library-all-detail-follow-preview:hover span + span,
.settings-library-all-detail-follow-preview:focus-visible span + span {
  display: inline;
}

.settings-library-all-player {
  display: grid;
  grid-template-columns: minmax(210px, 0.95fr) minmax(190px, 1fr) auto minmax(210px, 0.75fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 72px;
  padding: 10px 12px 10px 18px;
  border-radius: 8px 8px 16px 16px;
  background: #000000;
}

.settings-library-all-player-identity {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.settings-library-all-player-cover {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  border-radius: 4px;
  background:
    radial-gradient(circle at 35% 25%, rgba(255, 120, 186, 0.85), transparent 38%),
    linear-gradient(135deg, #183453, #0b111f 46%, #5b2cff);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
}

.settings-library-all-player-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-library-all-player-title {
  min-width: 0;
  overflow: hidden;
  color: var(--favorites-all-bottom-player-title-color, var(--favorites-all-bottom-player-text-color, #ffffff));
  font-family: var(--favorites-all-bottom-player-title-family, inherit);
  font-size: var(--favorites-all-bottom-player-title-size, calc(0.72rem * var(--favorites-all-bottom-player-text-scale, 1)));
  font-style: var(--favorites-all-bottom-player-title-style, normal);
  font-weight: var(--favorites-all-bottom-player-title-weight, var(--favorites-all-bottom-player-text-weight, 900));
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-player-subtitle {
  min-width: 0;
  overflow: hidden;
  color: var(--favorites-all-bottom-player-subtitle-color, var(--favorites-all-bottom-player-text-color, rgba(248, 251, 255, 0.76)));
  font-family: var(--favorites-all-bottom-player-subtitle-family, inherit);
  font-size: var(--favorites-all-bottom-player-subtitle-size, calc(0.56rem * var(--favorites-all-bottom-player-text-scale, 1)));
  font-style: var(--favorites-all-bottom-player-subtitle-style, normal);
  font-weight: var(--favorites-all-bottom-player-subtitle-weight, 700);
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-player-check {
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #ff5fba;
  color: #070912;
  font-size: 0.72rem;
  font-weight: 950;
}

.settings-library-all-player.is-bottom-player-title-hidden .settings-library-all-player-title,
.settings-library-all-player.is-bottom-player-subtitle-hidden .settings-library-all-player-subtitle,
.settings-library-all-player.is-bottom-player-time-hidden .settings-library-all-player-time {
  display: none;
}

.settings-library-all-player-progress-row,
.settings-library-all-player-main-controls,
.settings-library-all-player-utilities {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-width: 0;
}

.settings-library-all-player-progress-row {
  gap: 8px;
  justify-self: stretch;
}

.settings-library-all-player-main-controls {
  gap: 18px;
  justify-content: center;
}

.settings-library-all-player-utilities {
  gap: 14px;
  justify-content: flex-end;
}

.settings-library-all-player-time {
  color: var(--favorites-all-bottom-player-time-color, var(--favorites-all-bottom-player-text-color, rgba(248, 251, 255, 0.76)));
  font-family: var(--favorites-all-bottom-player-time-family, inherit);
  font-size: var(--favorites-all-bottom-player-time-size, calc(0.64rem * var(--favorites-all-bottom-player-text-scale, 1)));
  font-style: var(--favorites-all-bottom-player-time-style, normal);
  font-weight: var(--favorites-all-bottom-player-time-weight, var(--favorites-all-bottom-player-text-weight, 850));
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.settings-library-all-player-icon {
  width: 17px;
  height: 17px;
  display: inline-grid;
  place-items: center;
  color: var(--favorites-all-bottom-player-control-color, rgba(226, 234, 247, 0.82));
  line-height: 1;
}

.settings-library-all-player-icon::before {
  content: "";
  display: block;
}

.settings-library-all-player-icon.is-shuffle::before { content: "><"; }
.settings-library-all-player-icon.is-prev::before { content: "|<"; }
.settings-library-all-player-icon.is-next::before { content: ">|"; }
.settings-library-all-player-icon.is-repeat::before { content: "[]"; color: var(--favorites-all-bottom-player-control-active-color, #65dfbe); }
.settings-library-all-player-icon.is-wave::before { content: "C"; font-size: 1rem; }
.settings-library-all-player-icon.is-history::before { content: "@"; }
.settings-library-all-player-icon.is-list::before { content: "||"; }
.settings-library-all-player-icon.is-volume::before { content: "<"; }
.settings-library-all-player-icon.is-screen::before { content: "[]"; }
.settings-library-all-player-icon.is-fullscreen::before { content: "[ ]"; }

.settings-library-all-player-play {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: var(--favorites-all-idle-play-background, #393641);
  color: var(--favorites-all-idle-play-color, #ffffff);
  border: 0;
  box-shadow: var(--favorites-all-idle-play-ring, 0 0 0 4px rgba(177, 171, 193, .22));
}

.settings-library-all-player-play::before {
  content: "";
  width: 0;
  height: 0;
  margin-left: 3px;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 13px solid currentColor;
}

.settings-library-all-progress {
  flex: 1 1 auto;
  min-width: 120px;
  display: block;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.32);
}

.settings-library-all-progress i {
  display: block;
  width: 54%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #8f73ff, #39d2ff);
}

.settings-library-all-player-volume {
  width: 64px;
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(248, 251, 255, 0.85) 0 62%, rgba(248, 251, 255, 0.22) 62% 100%);
}

.settings-library-all-chatbot-launcher {
  position: relative;
  z-index: 6;
  width: var(--settings-chatbot-launcher-size, 62px);
  height: var(--settings-chatbot-launcher-size, 62px);
  display: inline-grid;
  place-items: center;
  overflow: visible;
  border: 1px solid rgba(124, 85, 255, 0.82);
  border-radius: 999px;
  outline: 0 solid transparent;
  background: var(--settings-chatbot-launcher-bg, #050711);
  color: var(--settings-chatbot-launcher-icon-color, #ffffff);
  box-shadow:
    inset 0 0 0 2px rgba(124, 85, 255, 0.78),
    inset 0 0 18px rgba(124, 85, 255, 0.14),
    0 14px 28px rgba(0, 0, 0, 0.38);
  cursor: pointer;
  transition:
    transform 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease;
  -webkit-tap-highlight-color: transparent;
}

.settings-library-all-chatbot-launcher:hover,
.settings-library-all-chatbot-launcher:focus,
.settings-library-all-chatbot-launcher:focus-visible,
.settings-library-all-chatbot-launcher:active,
.settings-library-all-chatbot-launcher.is-selected {
  outline: 0 solid transparent;
  border-color: rgba(151, 113, 255, 0.98);
  box-shadow:
    inset 0 0 0 2px rgba(124, 85, 255, 0.95),
    inset 0 0 18px rgba(124, 85, 255, 0.2),
    0 0 0 4px rgba(124, 85, 255, 0.18),
    0 14px 28px rgba(0, 0, 0, 0.38);
}

.settings-library-all-chatbot-launcher:hover {
  transform: translateY(-1px);
}

.settings-library-all-chatbot-launcher:active {
  transform: translateY(0);
}

.settings-library-all-chatbot-dot,
.settings-chatbot-preview-launcher-dot {
  position: absolute;
  right: 4px;
  top: 4px;
  width: 13px;
  height: 13px;
  border-radius: 999px;
  background: #57e6b6;
  box-shadow:
    0 0 0 3px #050711,
    0 0 12px rgba(87, 230, 182, 0.32);
}

.settings-library-all-hotspot {
  position: relative;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid rgba(109, 93, 252, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #2a3760;
  cursor: pointer;
  font: inherit;
  font-size: 0.64rem;
  font-weight: 950;
  line-height: 1.1;
  text-align: left;
  box-shadow: 0 8px 18px rgba(68, 80, 140, 0.1);
}

.settings-library-all-hotspot:hover,
.settings-library-all-hotspot:focus-visible,
.settings-library-all-hotspot.is-selected {
  border-color: rgba(109, 93, 252, 0.78);
  background: rgba(255, 255, 255, 0.94);
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 10px 24px rgba(68, 80, 140, 0.16);
}

.settings-library-all-hotspot span {
  color: inherit;
}

.settings-library-all-sidebar .settings-library-all-hotspot {
  width: fit-content;
  max-width: calc(100% - 20px);
  padding: 4px 8px;
  border: 1px solid rgba(109, 93, 252, 0.28);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #26324a;
  box-shadow: 0 8px 18px rgba(68, 80, 140, 0.1);
  text-align: left;
  white-space: nowrap;
}

.settings-library-all-sidebar .settings-library-all-hotspot:hover,
.settings-library-all-sidebar .settings-library-all-hotspot:focus-visible,
.settings-library-all-sidebar .settings-library-all-hotspot.is-selected {
  border-color: rgba(109, 93, 252, 0.78);
  background: rgba(255, 255, 255, 0.96);
  color: #111827;
}

.settings-library-all-sidebar .settings-library-all-hotspot span:last-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-sidebar .settings-library-all-hotspot {
  min-height: 28px;
  padding: 5px 10px;
  border-radius: 999px;
}

.settings-library-all-hotspot.is-sidebar-outer-chip {
  justify-self: start;
  margin-left: 12px;
}

.settings-library-all-stage.is-panel1-seamless .settings-library-all-hotspot.is-sidebar-outer-chip {
  margin: 6px 0 6px 12px;
}

.settings-panel-color-browser-frame.is-all-selectable-shell {
  cursor: pointer;
}

.settings-panel-color-browser-frame.is-all-selectable-shell.is-selected {
  border-color: rgba(109, 93, 252, 0.46);
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 18px 38px rgba(68, 80, 140, 0.14);
}

.settings-panel-color-browser-frame.is-all-selectable-shell .settings-panel-color-browser-bar {
  cursor: pointer;
}

.settings-library-all-selector-pill {
  position: absolute;
  z-index: 7;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  max-width: min(220px, calc(100% - 24px));
  min-height: 28px;
  padding: 4px 7px 4px 10px;
  border: 1px solid rgba(109, 93, 252, 0.36);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: #2a3760;
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.1),
    0 10px 22px rgba(68, 80, 140, 0.14);
}

.settings-library-all-selector-pill span {
  flex: 0 0 auto;
  font-size: 0.64rem;
  font-weight: 950;
  line-height: 1;
}

.settings-library-all-selector-pill select {
  min-width: 0;
  max-width: 138px;
  border: 0;
  background: transparent;
  color: #2a3760;
  cursor: pointer;
  font: inherit;
  font-size: 0.64rem;
  font-weight: 900;
  outline: 0;
}

.settings-library-all-selector-pill:hover,
.settings-library-all-selector-pill:focus-within {
  border-color: rgba(109, 93, 252, 0.78);
  background: #ffffff;
}

.settings-library-all-hotspot.is-topbar,
.settings-library-all-hotspot.is-bottombar {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.settings-library-all-hotspot.is-topbar {
  top: -13px;
}

.settings-library-all-hotspot.is-bottombar {
  top: -13px;
}

.settings-library-all-hotspot.is-sidebar-header-chip,
.settings-library-all-hotspot.is-panel-one-chip,
.settings-library-all-hotspot.is-panel-two-chip,
.settings-library-all-hotspot.is-panel-three-chip,
.settings-library-all-hotspot.is-banner-chip,
.settings-library-all-hotspot.is-tracks-chip {
  position: absolute;
}

.settings-library-all-hotspot.is-sidebar-header-chip {
  top: 48px;
  left: 12px;
}

.settings-library-all-hotspot.is-panel-one-chip {
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
}

.settings-library-all-hotspot.is-panel-two-chip {
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
}

.settings-library-all-selector-pill.is-panel-two-chip {
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
}

.settings-library-all-hotspot.is-panel-three-chip,
.settings-library-all-selector-pill.is-panel-three-chip {
  top: 10px;
  left: 12px;
}

.settings-library-all-hotspot.is-banner-chip {
  top: -13px;
  left: 18px;
}

.settings-library-all-hotspot.is-tracks-chip {
  z-index: 9;
  top: -17px;
  left: 18px;
}

.settings-library-all-hotspot .settings-panel-color-preview-swatch {
  width: 11px;
  height: 11px;
  flex-basis: 11px;
}

.settings-library-all-stage [data-favorites-all-preview-area]:not(.settings-library-all-hotspot):not(.settings-library-all-track-row) {
  transition:
    outline-color 0.16s ease,
    box-shadow 0.16s ease,
    filter 0.16s ease;
}

.settings-library-all-stage [data-favorites-all-preview-area]:not(.settings-library-all-hotspot):not(.settings-library-all-track-row):hover,
.settings-library-all-stage [data-favorites-all-preview-area]:not(.settings-library-all-hotspot):not(.settings-library-all-track-row).is-selected {
  outline: 2px solid rgba(109, 93, 252, 0.5);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(109, 93, 252, 0.08);
  filter: saturate(1.05);
}

.settings-library-all-stage .settings-library-all-limit-hotspot[data-favorites-all-preview-area]:hover,
.settings-library-all-stage .settings-library-all-limit-hotspot[data-favorites-all-preview-area]:focus-visible,
.settings-library-all-stage .settings-library-all-limit-hotspot[data-favorites-all-preview-area].is-selected,
.settings-panel-color-browser-bar .settings-library-all-limit-hotspot[data-favorites-all-preview-area]:hover,
.settings-panel-color-browser-bar .settings-library-all-limit-hotspot[data-favorites-all-preview-area]:focus-visible,
.settings-panel-color-browser-bar .settings-library-all-limit-hotspot[data-favorites-all-preview-area].is-selected {
  border-color: rgba(109, 93, 252, 0.62);
  background: rgba(255, 255, 255, 0.8);
  outline: 0;
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 8px 20px rgba(68, 80, 140, 0.14);
  transform: translateY(-1px);
}

.settings-library-all-property-subtabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-property-subtab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 7px 12px;
  border: 1px solid rgba(143, 154, 179, 0.22);
  border-radius: 999px;
  background: rgba(248, 250, 255, 0.84);
  color: #58637a;
  cursor: pointer;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 950;
}

.settings-library-all-property-subtab:hover,
.settings-library-all-property-subtab:focus-visible,
.settings-library-all-property-subtab.is-active {
  border-color: rgba(109, 93, 252, 0.5);
  background: linear-gradient(180deg, rgba(238, 233, 255, 0.98), rgba(224, 216, 255, 0.9));
  color: #6855ff;
  box-shadow: 0 8px 18px rgba(109, 93, 252, 0.14);
}

.settings-library-all-property-subpanels,
.settings-library-all-property-subpanel {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.settings-library-all-property-subpanel[hidden] {
  display: none !important;
}

.settings-library-all-property-hint {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.74);
}

.settings-library-all-property-hint strong {
  color: #2e384d;
  font-size: 0.82rem;
  font-weight: 950;
}

.settings-library-all-property-hint span {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 750;
  line-height: 1.45;
}

.settings-panel-color-preview-surface {
  position: relative;
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(54, 66, 92, 0.16);
  border-radius: 16px;
  background: var(--favorites-panel-fill, rgba(255, 255, 255, 0.86));
  color: #222b3d;
  overflow: hidden;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.54),
    0 10px 24px rgba(31, 37, 52, 0.08);
}

.settings-panel-color-preview-surface::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 42%),
    radial-gradient(circle at 82% 12%, rgba(255, 255, 255, 0.22), transparent 26%);
}

.settings-panel-color-preview-surface.is-panel-one {
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 10px;
  padding: 10px;
}

.settings-panel-color-preview-surface.is-panel-two,
.settings-panel-color-preview-surface.is-panel-three {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px;
}

.settings-panel-color-preview-surface.is-panel-two {
  align-content: center;
}

.settings-panel-color-preview-surface.is-panel-one-header,
.settings-panel-color-preview-surface.is-panel-one-inner,
.settings-panel-color-preview-surface.is-panel-three-drawer {
  z-index: 1;
  display: grid;
  gap: 8px;
  padding: 10px;
  border-radius: 13px;
}

.settings-panel-color-preview-panel-divider {
  position: relative;
  z-index: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.78), transparent);
}

.settings-panel-color-preview-panel-body,
.settings-panel-color-preview-drawer-stack,
.settings-panel-color-preview-detail-lines,
.settings-panel-color-preview-album-grid {
  position: relative;
  z-index: 1;
}

.settings-panel-color-preview-panel-body {
  display: grid;
  align-content: start;
  gap: 10px;
}

.settings-panel-color-preview-area {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  width: fit-content;
  max-width: 100%;
  min-height: 30px;
  padding: 5px 9px 5px 6px;
  border: 1px solid rgba(31, 37, 52, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.72);
  color: #202938;
  cursor: pointer;
  font: inherit;
  text-align: left;
  white-space: nowrap;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.68),
    0 8px 18px rgba(31, 37, 52, 0.08);
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease, background 0.16s ease;
}

.settings-panel-color-preview-area::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid transparent;
  border-radius: inherit;
  pointer-events: none;
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.settings-panel-color-preview-area:hover,
.settings-panel-color-preview-area:focus-visible,
.settings-panel-color-preview-area.is-selected {
  border-color: rgba(51, 118, 240, 0.46);
  background: rgba(255, 255, 255, 0.86);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.64),
    0 12px 26px rgba(51, 118, 240, 0.16);
  transform: translateY(-1px);
}

.settings-panel-color-preview-area:hover::after,
.settings-panel-color-preview-area:focus-visible::after,
.settings-panel-color-preview-area.is-selected::after {
  border-color: rgba(84, 112, 255, 0.72);
  box-shadow: inset 0 0 0 999px rgba(84, 112, 255, 0.08);
}

.settings-panel-color-preview-area:focus-visible {
  outline: 3px solid rgba(54, 126, 240, 0.24);
  outline-offset: 2px;
}

.settings-panel-color-preview-area .settings-panel-color-preview-swatch {
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
  border-width: 2px;
  box-shadow: 0 0 0 1px rgba(21, 27, 38, 0.16);
}

.settings-panel-color-preview-pill-copy {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  max-width: 100%;
}

.settings-panel-color-preview-badge {
  color: #344154;
  font-size: 0.68rem;
  font-weight: 950;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.settings-panel-color-preview-divider {
  color: rgba(52, 65, 84, 0.52);
  font-size: 0.62rem;
  line-height: 1;
}

.settings-panel-color-preview-name {
  max-width: 118px;
  overflow: hidden;
  color: #1f2937;
  font-size: 0.78rem;
  font-weight: 950;
  line-height: 1.12;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-panel-color-preview-mini-line,
.settings-panel-color-preview-detail-lines span,
.settings-panel-color-preview-album-grid span {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.36);
}

.settings-panel-color-preview-mini-line.is-short {
  width: 72%;
}

.settings-panel-color-preview-detail-lines {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.settings-panel-color-preview-detail-lines span:nth-child(2) {
  width: 86%;
}

.settings-panel-color-preview-detail-lines span:nth-child(3) {
  width: 64%;
}

.settings-panel-color-preview-album-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 54px;
}

.settings-panel-color-preview-album-grid span {
  height: 58px;
  border-radius: 12px;
}

.settings-panel-color-preview-album-grid span:first-child {
  grid-column: 1 / -1;
  height: 38px;
}

.settings-panel-color-preview-drawer-stack {
  display: grid;
  gap: 8px;
  margin-top: auto;
}

.settings-panel-color-preview-surface.is-panel-three {
  min-height: 370px;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-preview-surface.is-panel-three {
  min-height: 430px;
}

.settings-panel-color-property-shell {
  position: sticky;
  top: 118px;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-shell.is-compact {
  align-self: start;
  max-height: calc(100vh - 132px);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 12px;
  scrollbar-color: rgba(124, 100, 255, 0.58) rgba(222, 226, 238, 0.72);
  scrollbar-width: thin;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-shell.is-compact::-webkit-scrollbar {
  width: 10px;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-shell.is-compact::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(222, 226, 238, 0.72);
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-shell.is-compact::-webkit-scrollbar-thumb {
  border: 2px solid rgba(222, 226, 238, 0.72);
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.64);
}

@supports not (zoom: 1) {
  .settings-library-all-stage {
    transform: scale(var(--favorites-all-preview-scale));
  }
}

.settings-panel-color-property-shell.is-compact {
  gap: 12px;
  padding: 14px;
  top: 96px;
}

.settings-panel-color-property-shell.is-compact .settings-panel-color-property-head {
  display: grid;
  gap: 10px;
}

.settings-panel-color-property-shell.is-compact .settings-panel-color-property-meta {
  justify-content: flex-start;
  width: fit-content;
  padding: 7px 10px;
}

.settings-panel-color-property-shell.is-compact .settings-page-elements-grid {
  gap: 10px;
}

.settings-panel-color-property-shell.is-compact .support-hours-field,
.settings-panel-color-property-shell.is-compact .toggle-card {
  padding: 12px;
  border-radius: 14px;
}

.settings-panel-color-property-shell.is-compact .list-card-name {
  font-size: 0.94rem;
}

.settings-panel-color-property-shell.is-compact .detail-meta,
.settings-panel-color-property-shell.is-compact .muted-copy {
  font-size: 0.82rem;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-head {
  display: none;
}

.settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-stack {
  display: none;
}

.settings-library-all-advanced-rail {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-rail-cardlet {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(250, 251, 255, 0.88)),
    #ffffff;
  box-shadow: 0 12px 26px rgba(31, 37, 52, 0.055);
}

.settings-library-all-rail-cardlet[hidden] {
  display: none !important;
}

.settings-library-all-rail-cardlet[data-favorites-all-rail-collapsed="1"] > :not(.settings-library-all-rail-title-row) {
  display: none !important;
}

.settings-library-all-rail-cardlet.is-selected {
  position: sticky;
  top: 0;
  z-index: 8;
  align-self: start;
  border-color: rgba(109, 93, 252, 0.22);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.99), rgba(248, 250, 255, 0.95)),
    #ffffff;
  box-shadow:
    0 16px 30px rgba(31, 37, 52, 0.08),
    0 10px 26px rgba(109, 93, 252, 0.1);
}

.settings-library-all-rail-cardlet.settings-chatbot-appearance-card {
  margin-top: 0;
}

.settings-library-all-directory-card {
  border-color: rgba(109, 93, 252, 0.24);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(246, 248, 255, 0.92)),
    #ffffff;
}

.settings-library-all-directory-tree {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-directory-group {
  overflow: hidden;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.78);
}

.settings-library-all-directory-group[hidden] {
  display: none !important;
}

.settings-library-all-directory-group summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 9px 11px;
  color: #253046;
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 950;
  list-style: none;
}

.settings-library-all-directory-group summary::-webkit-details-marker {
  display: none;
}

.settings-library-all-directory-group summary::before {
  content: "+";
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  grid-column: 2;
  grid-row: 1;
  border-radius: 999px;
  background: rgba(109, 93, 252, 0.1);
  color: #5d4ff0;
  font-size: 0.8rem;
  font-weight: 950;
}

.settings-library-all-directory-group[open] summary::before {
  content: "-";
}

.settings-library-all-directory-group summary span {
  min-width: 0;
  grid-column: 1;
  grid-row: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-directory-group summary em {
  display: none;
}

.settings-library-all-directory-items {
  display: grid;
  gap: 6px;
  padding: 0 9px 9px;
}

.settings-library-all-directory-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 34px;
  padding: 8px 9px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.82);
  color: #253046;
  cursor: pointer;
  font: inherit;
  text-align: left;
}

.settings-library-all-directory-item:hover,
.settings-library-all-directory-item:focus-visible,
.settings-library-all-directory-item.is-active {
  border-color: rgba(109, 93, 252, 0.34);
  background: #ffffff;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(109, 93, 252, 0.1);
}

.settings-library-all-directory-item.is-active {
  color: #4f46e5;
}

.settings-library-all-directory-item span,
.settings-library-all-directory-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-directory-item span {
  font-size: 0.76rem;
  font-weight: 950;
}

.settings-library-all-directory-item small {
  color: rgba(72, 82, 111, 0.68);
  font-size: 0.62rem;
  font-weight: 820;
}

.settings-library-all-rail-cardlet > .toggle-card {
  gap: 10px;
  padding: 10px;
  border-color: rgba(143, 154, 179, 0.16);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.76);
  box-shadow: none;
}

.settings-library-all-control-group {
  display: grid;
  gap: 7px;
  min-width: 0;
  margin-top: 2px;
  padding: 9px;
  border: 1px solid rgba(109, 93, 252, 0.12);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(246, 248, 255, 0.72)),
    rgba(248, 250, 255, 0.82);
}

.settings-library-all-control-group > strong {
  color: #303a52;
  font-size: 0.76rem;
  font-weight: 930;
  line-height: 1.2;
}

.settings-library-all-control-group .settings-library-all-toggle-grid {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.settings-library-all-rail-cardlet > .toggle-card.is-disabled {
  opacity: 0.72;
}

.settings-library-all-rail-cardlet > .toggle-card .toggle-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.settings-library-all-rail-cardlet > .toggle-card .toggle-row .toggle-copy {
  min-width: 0;
}

.settings-library-all-rail-cardlet > .toggle-card .toggle-row .toggle-switch,
.settings-library-all-rail-cardlet > .toggle-card .toggle-row > .detail-meta {
  justify-self: end;
}

.settings-library-all-rail-cardlet > .toggle-card .list-card-name {
  font-size: 0.76rem;
  line-height: 1.18;
}

.settings-library-all-rail-cardlet > .toggle-card .detail-meta {
  font-size: 0.68rem;
  line-height: 1.25;
}

.settings-library-all-rail-cardlet > .toggle-card .settings-spectrum-color-grid {
  gap: 8px;
}

.settings-library-all-rail-cardlet > .toggle-card .settings-color-input {
  height: 34px;
  border-radius: 10px;
}

.settings-library-all-panel1-plan-switch-card {
  gap: 10px;
}

.settings-library-all-panel1-plan-switch-card .settings-library-all-rail-title-row {
  align-items: center;
  gap: 8px;
}

.settings-library-all-panel1-plan-switch-card .settings-library-all-rail-title-row strong {
  flex: 1 1 auto;
  min-width: min(100%, 170px);
  white-space: normal;
}

.settings-library-all-panel1-plan-switch-card .settings-library-all-rail-title-row > span:not(.settings-library-all-rail-dot) {
  flex: 0 0 auto;
  width: auto;
  padding: 4px 9px;
  border: 1px solid rgba(226, 84, 151, 0.18);
  border-radius: 999px;
  background: rgba(255, 242, 248, 0.86);
  color: #d84289;
  font-size: 0.62rem;
  line-height: 1;
  white-space: nowrap;
}

.settings-library-all-panel1-plan-switch-card > .toggle-card {
  border-color: rgba(109, 93, 252, 0.16);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(248, 250, 255, 0.84)),
    #ffffff;
}

.settings-library-all-panel1-plan-switch-card > .toggle-card .list-card-name {
  color: #263046;
  font-weight: 930;
}

.settings-library-all-panel1-plan-switch-card > .toggle-card .detail-meta {
  color: rgba(63, 75, 99, 0.72);
  font-weight: 720;
}

.settings-library-all-rail-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"] > .settings-library-all-rail-title-row {
  padding-bottom: 1px;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"][data-favorites-all-rail-collapsed="1"] {
  gap: 0;
  padding: 10px 12px;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"][data-favorites-all-rail-collapsed="1"] > .settings-library-all-rail-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px 28px;
  grid-template-rows: auto auto;
  align-items: center;
  min-height: 42px;
  gap: 3px 8px;
  padding-bottom: 0;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"][data-favorites-all-rail-collapsed="1"] > .settings-library-all-rail-title-row strong {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"][data-favorites-all-rail-collapsed="1"] > .settings-library-all-rail-title-row > span:not(.settings-library-all-rail-dot) {
  grid-column: 1;
  grid-row: 2;
  min-width: 0;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"][data-favorites-all-rail-collapsed="1"] > .settings-library-all-rail-title-row .settings-library-all-collapse-toggle {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: center;
  margin-left: 0;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"][data-favorites-all-rail-collapsed="1"] > .settings-library-all-rail-title-row .settings-library-all-drag-handle {
  grid-column: 3;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: center;
  margin-left: 0;
}

.settings-library-all-advanced-rail.is-full-shell-directory-mode .settings-library-all-rail-cardlet[data-favorites-all-rail-collapsible="1"] {
  cursor: default;
}

.settings-library-all-rail-cardlet.is-full-shell-card-dragging {
  opacity: 0.54;
}

.settings-library-all-rail-cardlet.is-full-shell-card-drop-target {
  border-color: rgba(109, 93, 252, 0.54);
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 16px 30px rgba(31, 37, 52, 0.08);
}

.settings-library-all-rail-title-row strong {
  flex: 1 1 128px;
  min-width: 0;
  color: #253046;
  font-size: 0.86rem;
  font-weight: 950;
  line-height: 1.16;
}

.settings-library-all-rail-title-row > span:not(.settings-library-all-rail-dot) {
  min-width: 0;
  flex: 1 1 100%;
  overflow: visible;
  color: #6d5dfc;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.24;
  text-align: left;
  text-overflow: clip;
  white-space: normal;
}

.settings-library-all-rail-title-row .settings-library-all-link-button,
.settings-library-all-rail-title-row .settings-library-all-collapse-toggle,
.settings-library-all-rail-title-row .settings-library-all-drag-handle {
  margin-left: auto;
}

.settings-library-all-drag-handle {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: rgba(72, 82, 111, 0.78);
  cursor: grab;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 950;
  line-height: 1;
}

.settings-library-all-drag-handle:hover,
.settings-library-all-drag-handle:focus-visible {
  border-color: rgba(109, 93, 252, 0.42);
  color: #5d4ff0;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(109, 93, 252, 0.1);
}

.settings-library-all-drag-handle:active {
  cursor: grabbing;
}

.settings-library-all-collapse-toggle {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border: 1px solid rgba(109, 93, 252, 0.18);
  border-radius: 999px;
  background: rgba(248, 250, 255, 0.92);
  color: #5d4ff0;
  cursor: pointer;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 950;
  line-height: 1;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68);
}

.settings-library-all-collapse-toggle:hover,
.settings-library-all-collapse-toggle:focus-visible {
  border-color: rgba(109, 93, 252, 0.52);
  background: #ffffff;
  outline: 0;
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.settings-library-all-rail-dot {
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 999px;
  box-shadow: 0 0 0 3px rgba(109, 93, 252, 0.12);
}

.settings-library-all-rail-cardlet p,
.settings-library-all-fine-print {
  margin: 0;
  color: rgba(72, 82, 111, 0.72);
  font-size: 0.74rem;
  font-weight: 720;
  line-height: 1.38;
}

.settings-library-all-panel1-stack {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-panel1-surface {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.72);
}

.settings-library-all-panel1-surface-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-panel1-surface-head strong {
  overflow: hidden;
  color: #303a52;
  font-size: 0.78rem;
  font-weight: 930;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-panel1-surface-head span {
  flex: 0 0 auto;
  color: #6d5dfc;
  font-size: 0.66rem;
  font-weight: 900;
}

.settings-library-all-panel1-surface p {
  font-size: 0.66rem;
  line-height: 1.28;
}

.settings-library-all-active-toggle,
.settings-library-all-toggle-chip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 10px;
  background: rgba(248, 250, 255, 0.74);
}

.settings-library-all-active-toggle > span:first-child,
.settings-library-all-toggle-chip > span:first-child {
  flex: 1 1 128px;
  min-width: 0;
  overflow: visible;
  color: #3a455c;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.2;
  text-overflow: clip;
  white-space: normal;
}

.settings-library-all-active-toggle .settings-toggle-control,
.settings-library-all-toggle-chip .settings-toggle-control {
  flex: 0 0 auto;
  margin-left: auto;
  order: 2;
}

.settings-library-all-field-row {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 10px;
  background: rgba(248, 250, 255, 0.74);
}

.settings-library-all-field-row > span:first-child {
  color: #3a455c;
  font-size: 0.72rem;
  font-weight: 850;
  line-height: 1.2;
}

.settings-library-all-field-row .admin-select {
  width: 100%;
  min-height: 36px;
}

.settings-library-all-field-row > em {
  color: rgba(72, 82, 111, 0.7);
  font-size: 0.66rem;
  font-style: normal;
  font-weight: 720;
  line-height: 1.28;
}

.settings-library-all-toggle-chip > small {
  order: 3;
  flex: 1 1 100%;
  min-width: 0;
  padding-right: 70px;
  color: rgba(72, 82, 111, 0.7);
  font-size: 0.66rem;
  font-weight: 720;
  line-height: 1.28;
}

.settings-library-all-toggle-chip.is-disabled {
  opacity: 0.68;
}

.settings-library-all-staged-actions {
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(109, 93, 252, 0.24);
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(109, 93, 252, 0.1), rgba(102, 166, 255, 0.08));
  box-shadow: 0 12px 24px rgba(109, 93, 252, 0.12);
}

.settings-library-all-staged-actions[hidden] {
  display: none !important;
}

.settings-library-all-apply-button {
  width: 100%;
  justify-content: center;
  min-height: 38px;
  box-shadow: 0 12px 24px rgba(109, 93, 252, 0.22);
}

.settings-library-all-selected-apply-button {
  width: 100%;
  justify-content: center;
  min-height: 40px;
  box-shadow: 0 12px 24px rgba(109, 93, 252, 0.22);
}

.settings-library-all-selected-apply-strip {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 9px;
  border: 1px solid rgba(109, 93, 252, 0.24);
  border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(245, 247, 255, 0.86)),
    rgba(109, 93, 252, 0.06);
}

.settings-library-all-selected-apply-strip span {
  color: rgba(64, 72, 98, 0.78);
  font-size: 0.68rem;
  font-weight: 760;
  line-height: 1.28;
}

.settings-library-all-staged-actions span {
  color: rgba(64, 72, 98, 0.78);
  font-size: 0.68rem;
  font-weight: 760;
  line-height: 1.28;
}

.settings-library-all-mini-row,
.settings-library-all-scroll-row,
.settings-library-all-range-row {
  display: grid;
  grid-template-columns: auto minmax(64px, 1fr) auto;
  gap: 7px;
  align-items: center;
  min-width: 0;
}

.settings-library-all-mini-row > span,
.settings-library-all-scroll-row > span,
.settings-library-all-range-row > span {
  overflow: visible;
  color: #3f4b63;
  font-size: 0.72rem;
  font-weight: 780;
  line-height: 1.22;
  text-overflow: clip;
  white-space: normal;
}

.settings-library-all-mini-row > span,
.settings-library-all-scroll-row > span {
  grid-column: 1 / -1;
}

.settings-library-all-range-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.settings-library-all-range-row input {
  grid-column: 1 / -1;
}

.settings-library-all-mini-color {
  width: 32px;
  height: 25px;
  padding: 2px;
  border: 1px solid rgba(143, 154, 179, 0.24);
  border-radius: 8px;
  background: #ffffff;
}

.settings-library-all-mini-row code,
.settings-library-all-scroll-row code {
  min-width: 0;
  padding: 5px 7px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 7px;
  background: rgba(248, 250, 255, 0.78);
  color: #68738d;
  font-size: 0.68rem;
  font-weight: 850;
  text-align: center;
}

.settings-library-all-track-type-stack {
  display: grid;
  gap: 9px;
  min-width: 0;
}

.settings-library-all-track-type-card {
  display: grid;
  gap: 9px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.72);
}

.settings-library-all-track-type-head {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-library-all-track-type-head strong {
  overflow: hidden;
  color: #303a52;
  font-size: 0.76rem;
  font-weight: 930;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-track-type-head span {
  color: rgba(63, 75, 99, 0.64);
  font-size: 0.64rem;
  font-weight: 720;
  line-height: 1.25;
}

.settings-library-all-track-type-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  min-width: 0;
}

.settings-library-all-track-type-grid label {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-library-all-track-type-grid label > span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-width: 0;
  color: #3f4b63;
  font-size: 0.64rem;
  font-weight: 850;
}

.settings-library-all-track-type-grid label > span strong {
  flex: 0 0 auto;
  color: #6d5dfc;
  font-size: 0.64rem;
  font-weight: 900;
}

.settings-library-all-track-type-grid .admin-select,
.settings-library-all-track-type-grid .admin-text-input {
  width: 100%;
  min-width: 0;
  min-height: 30px;
  padding: 5px 8px;
  font-size: 0.66rem;
}

.settings-library-all-track-type-grid .settings-library-all-mini-color {
  width: 100%;
  min-width: 0;
  height: 30px;
}

.settings-library-all-track-type-grid .is-wide {
  grid-column: 1 / -1;
}

.settings-library-all-default-grid {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-default-stack {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-library-all-default-section {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(109, 93, 252, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.58);
}

.settings-library-all-default-section-head {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.settings-library-all-default-section-head strong {
  color: #202a3f;
  font-size: 0.82rem;
  font-weight: 900;
}

.settings-library-all-default-section-head span {
  color: rgba(63, 75, 99, 0.72);
  font-size: 0.64rem;
  font-weight: 760;
  line-height: 1.3;
}

.settings-library-all-default-grid .settings-library-all-mini-row {
  grid-template-columns: auto minmax(64px, 1fr) auto;
}

.settings-library-all-mini-row.is-text-entry {
  grid-template-columns: minmax(0, 1fr) auto;
}

.settings-library-all-select-row {
  grid-template-columns: minmax(0, 1fr) minmax(64px, auto) auto;
}

.settings-library-all-mini-row.is-text-entry .admin-text-input {
  grid-column: 1;
  width: 100%;
  min-width: 0;
}

.settings-library-all-mini-row.is-text-entry code[data-favorites-all-advanced-value] {
  display: none;
}

.settings-library-all-mini-row.is-text-entry .settings-library-all-undo-button {
  grid-column: 2;
}

.settings-library-all-select-row select {
  width: 100%;
  min-width: 0;
}

.settings-library-all-mini-row.is-text-entry.settings-library-all-playlist-prompt-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.settings-library-all-mini-row.is-text-entry.settings-library-all-playlist-prompt-row .admin-text-input {
  min-height: 52px;
  padding: 0 18px;
  border-radius: 18px;
  font-size: 1rem;
  font-weight: 650;
}

.settings-library-all-default-grid .settings-library-all-toggle-grid {
  grid-template-columns: 1fr;
}

.settings-library-all-text-target-row {
  padding: 8px;
  border: 1px solid rgba(109, 93, 252, 0.12);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.62);
}

.settings-library-all-search-prompt-card {
  padding: 9px;
  border: 1px solid rgba(109, 93, 252, 0.16);
  border-radius: 10px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(248, 250, 255, 0.72)),
    #ffffff;
}

.settings-library-all-search-prompt-card > span strong {
  min-width: 0;
  overflow: hidden;
  color: #202a3f;
  font-size: 0.7rem;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-search-prompt-card > span small {
  flex: 0 0 auto;
  padding: 3px 7px;
  border: 1px solid rgba(226, 84, 151, 0.18);
  border-radius: 999px;
  background: rgba(255, 242, 248, 0.84);
  color: #d84289;
  font-size: 0.58rem;
  font-weight: 900;
}

.settings-library-all-search-prompt-card em {
  display: block;
  color: rgba(63, 75, 99, 0.68);
  font-size: 0.63rem;
  font-style: normal;
  font-weight: 720;
  line-height: 1.3;
}

.settings-library-all-text-target-row em {
  display: block;
  color: rgba(63, 75, 99, 0.66);
  font-size: 0.63rem;
  font-style: normal;
  font-weight: 720;
  line-height: 1.28;
}

.settings-library-all-track-text-target-row,
.settings-library-all-discography-text-target-row {
  display: grid;
  gap: 6px;
  margin-bottom: 10px;
}

.settings-library-all-track-text-target-row select,
.settings-library-all-discography-text-target-row select {
  width: 100%;
}

.settings-library-all-select-row select {
  min-width: 0;
  width: 100%;
  height: 30px;
  padding: 4px 22px 4px 8px;
  font-size: 0.68rem;
}

.settings-library-all-menu-control {
  display: grid;
  gap: 9px;
  min-width: 0;
}

.settings-library-all-menu-control-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-menu-control-head strong {
  overflow: hidden;
  color: #303a52;
  font-size: 0.78rem;
  font-weight: 930;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-menu-control-head span {
  flex: 0 0 auto;
  color: #6d5dfc;
  font-size: 0.66rem;
  font-weight: 900;
}

.settings-library-all-menu-items {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding-top: 2px;
}

.settings-library-all-menu-item-toggle {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
  min-height: 38px;
  padding: 7px 8px 7px 10px;
  border: 1px solid rgba(126, 231, 219, 0.18);
  border-radius: 10px;
  background: rgba(248, 250, 255, 0.82);
  cursor: pointer;
}

.settings-library-all-menu-item-toggle.is-removed {
  border-color: rgba(143, 154, 179, 0.16);
  background: rgba(241, 245, 249, 0.64);
  opacity: 0.72;
}

.settings-library-all-menu-item-checkbox,
.settings-library-all-menu-item-separator-checkbox {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.settings-library-all-menu-item-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.settings-library-all-menu-item-copy strong {
  color: #2c364c;
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
  white-space: normal;
}

.settings-library-all-menu-item-copy em {
  color: rgba(63, 75, 99, 0.62);
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 760;
  line-height: 1.25;
  overflow-wrap: anywhere;
  white-space: normal;
}

.settings-library-all-menu-item-action {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid rgba(109, 93, 252, 0.34);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: #6d5dfc;
  cursor: pointer;
  font: inherit;
  font-size: 0.88rem;
  font-weight: 950;
  line-height: 1;
}

.settings-library-all-menu-item-toggle.is-removed .settings-library-all-menu-item-action {
  border-color: rgba(126, 231, 219, 0.48);
  color: #15a58f;
}

.settings-library-all-menu-item-position {
  display: grid;
  gap: 2px;
  min-width: 54px;
}

.settings-library-all-menu-item-position > span {
  color: rgba(63, 75, 99, 0.58);
  font-size: 0.54rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.settings-library-all-menu-item-position .admin-select {
  min-height: 28px;
  padding: 3px 22px 3px 8px;
  font-size: 0.68rem;
}

.settings-library-all-action-menu-item {
  grid-template-columns: 26px minmax(0, 1fr);
  grid-template-areas:
    "drag copy"
    "controls controls";
  min-height: 64px;
  row-gap: 8px;
  cursor: default;
  transition:
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    transform 0.18s ease,
    opacity 0.18s ease;
}

.settings-library-all-action-menu-item .settings-library-all-drag-handle {
  grid-area: drag;
  position: relative;
  width: 24px;
  height: 24px;
  margin-left: 0;
  color: transparent;
  font-size: 0.66rem;
}

.settings-library-all-action-menu-item .settings-library-all-drag-handle::before {
  content: "";
  width: 3px;
  height: 3px;
  border-radius: 999px;
  background: rgba(72, 82, 111, 0.74);
  box-shadow:
    7px 0 0 rgba(72, 82, 111, 0.74),
    0 7px 0 rgba(72, 82, 111, 0.74),
    7px 7px 0 rgba(72, 82, 111, 0.74);
}

.settings-library-all-action-menu-item .settings-library-all-menu-item-copy {
  grid-area: copy;
  align-self: center;
}

.settings-library-all-menu-item-controls {
  grid-area: controls;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  padding-left: 34px;
}

.settings-library-all-menu-item-move,
.settings-library-all-menu-item-separator-toggle {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(143, 154, 179, 0.2);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: rgba(72, 82, 111, 0.78);
  cursor: pointer;
  font: inherit;
  font-size: 0.62rem;
  font-weight: 950;
  line-height: 1;
}

.settings-library-all-menu-item-separator-toggle {
  grid-template-columns: auto auto;
  gap: 4px;
  width: auto;
  min-width: 54px;
  padding: 0 8px;
  color: rgba(72, 82, 111, 0.82);
}

.settings-library-all-menu-item-separator-toggle i {
  display: block;
  width: 12px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.settings-library-all-menu-item-separator-toggle span {
  font-size: 0.56rem;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
}

.settings-library-all-menu-item-separator-toggle.is-active {
  border-color: rgba(109, 93, 252, 0.45);
  background: rgba(109, 93, 252, 0.12);
  color: #5d4ff0;
}

.settings-library-all-menu-item-move:hover,
.settings-library-all-menu-item-move:focus-visible,
.settings-library-all-menu-item-separator-toggle:hover,
.settings-library-all-menu-item-separator-toggle:focus-visible,
.settings-library-all-menu-item-action:hover,
.settings-library-all-menu-item-action:focus-visible {
  border-color: rgba(109, 93, 252, 0.46);
  color: #5d4ff0;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(109, 93, 252, 0.1);
}

.settings-library-all-menu-item-move:disabled,
.settings-library-all-menu-item-separator-toggle:disabled,
.settings-library-all-menu-item-action:disabled,
.settings-library-all-action-menu-item .settings-library-all-drag-handle:disabled {
  opacity: 0.42;
  cursor: not-allowed;
  box-shadow: none;
}

.settings-library-all-action-menu-item .settings-library-all-menu-item-position {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 74px;
  min-height: 22px;
  padding: 4px 8px;
  border: 1px solid rgba(143, 154, 179, 0.18);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: rgba(63, 75, 99, 0.66);
  font-size: 0.56rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.settings-library-all-menu-item-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 4px 8px;
  border: 1px solid rgba(126, 231, 219, 0.28);
  border-radius: 999px;
  background: rgba(126, 231, 219, 0.12);
  color: rgba(33, 109, 98, 0.82);
  font-size: 0.56rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.settings-library-all-action-menu-item.is-removed .settings-library-all-menu-item-status {
  border-color: rgba(143, 154, 179, 0.22);
  background: rgba(143, 154, 179, 0.12);
  color: rgba(72, 82, 111, 0.66);
}

.settings-library-all-action-menu-item.is-position-locked {
  border-color: rgba(109, 93, 252, 0.48);
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.1),
    0 12px 24px rgba(31, 37, 52, 0.08);
  transform: translateY(-1px);
}

.settings-library-all-action-menu-item.is-action-menu-item-dragging {
  opacity: 0.54;
}

.settings-library-all-action-menu-item.is-action-menu-item-drop-target {
  border-color: rgba(109, 93, 252, 0.54);
  box-shadow:
    0 0 0 3px rgba(109, 93, 252, 0.12),
    0 16px 30px rgba(31, 37, 52, 0.08);
}

.settings-library-all-menu-separator {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  padding: 3px 6px;
}

.settings-library-all-menu-separator i {
  display: block;
  height: 1px;
  border-radius: 999px;
  background: rgba(63, 75, 99, 0.2);
}

.settings-library-all-menu-separator strong {
  color: rgba(63, 75, 99, 0.5);
  font-size: 0.54rem;
  font-weight: 950;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.settings-library-all-action-menu-control {
  display: grid;
  gap: 12px;
  min-width: 0;
}

.settings-library-all-menu-options-intro {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(109, 93, 252, 0.16);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
}

.settings-library-all-menu-options-intro strong,
.settings-library-all-menu-options-intro em {
  display: block;
}

.settings-library-all-menu-options-intro strong {
  color: #1c2738;
  font-size: 0.78rem;
  font-weight: 950;
}

.settings-library-all-menu-options-intro em {
  color: rgba(63, 75, 99, 0.68);
  font-size: 0.64rem;
  font-style: normal;
  font-weight: 760;
  line-height: 1.35;
}

.settings-library-all-menu-options-dot {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #111827;
  color: #fff;
}

.settings-library-all-menu-options-dot i {
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: currentColor;
}

.settings-library-all-action-menu-group {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.58);
}

.settings-library-all-action-menu-group .settings-library-all-menu-control-head {
  align-items: center;
}

.settings-library-all-menu-control-head .settings-library-all-action-menu-group-title {
  display: grid;
  flex: 1 1 auto;
  gap: 1px;
  min-width: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
}

.settings-library-all-action-menu-group-title strong {
  overflow: hidden;
  color: #303a52;
  font-size: 0.78rem;
  font-weight: 930;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-action-menu-group-title em {
  overflow: hidden;
  color: #6d5dfc;
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 880;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-library-all-action-menu-group-body {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-library-all-action-menu-group.is-collapsed .settings-library-all-action-menu-group-body {
  display: none;
}

.settings-library-all-scroll-row i {
  width: 24px;
  height: 22px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 7px;
  background: #eeeafa;
}

.settings-library-all-undo-button,
.settings-library-all-link-button {
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(143, 154, 179, 0.16);
  background: rgba(255, 255, 255, 0.82);
  color: #6d5dfc;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
}

.settings-library-all-undo-button {
  width: 26px;
  height: 26px;
  border-radius: 999px;
  font-size: 0.8rem;
}

.settings-library-all-link-button {
  min-height: 28px;
  padding: 5px 10px;
  border-color: rgba(255, 95, 176, 0.22);
  border-radius: 999px;
  background: rgba(255, 95, 176, 0.08);
  color: #d8348c;
  font-size: 0.7rem;
}

.settings-library-all-undo-button:hover,
.settings-library-all-undo-button:focus-visible,
.settings-library-all-link-button:hover,
.settings-library-all-link-button:focus-visible {
  border-color: rgba(109, 93, 252, 0.42);
  box-shadow: 0 8px 18px rgba(109, 93, 252, 0.12);
}

.settings-library-all-toggle-grid,
.settings-library-all-limit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
  min-width: 0;
}

.settings-library-all-limit-tile {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(64px, 82px) auto;
  gap: 7px;
  align-items: center;
  min-width: 0;
  padding: 7px;
  border-radius: 10px;
  background: rgba(255, 95, 176, 0.08);
}

.settings-library-all-limit-tile > .settings-library-all-limit-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
  overflow: hidden;
  color: #3f4b63;
  text-overflow: clip;
  white-space: normal;
}

.settings-library-all-limit-copy small,
.settings-library-all-limit-copy strong,
.settings-library-all-limit-copy em {
  display: block;
  min-width: 0;
  overflow: visible;
  line-height: 1.16;
  text-overflow: clip;
  white-space: normal;
}

.settings-library-all-limit-copy small {
  color: #d8348c;
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 950;
  letter-spacing: 0;
  text-transform: uppercase;
}

.settings-library-all-limit-copy strong {
  color: #313b52;
  font-size: 0.72rem;
  font-weight: 900;
}

.settings-library-all-limit-copy em {
  color: rgba(63, 75, 99, 0.62);
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 760;
}

.settings-library-all-limit-tile input {
  min-width: 0;
  height: 30px;
  padding: 4px 6px;
  text-align: center;
}

.settings-panel-color-property-stack,
.settings-panel-color-group {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.settings-panel-color-group[hidden] {
  display: none !important;
}

.settings-panel-color-group {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

@media (max-width: 1160px) {
  .settings-panel-color-visual-editor {
    grid-template-columns: minmax(0, 1fr);
  }

  .settings-panel-color-visual-editor.is-all-workspace {
    grid-template-columns: minmax(0, 1fr);
  }

  .settings-panel-color-property-shell {
    position: static;
  }

  .settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-property-shell.is-compact {
    max-height: none;
    overflow: visible;
    padding-right: 14px;
  }
}

@media (max-width: 740px) {
  .settings-panel-color-preview-head,
  .settings-panel-color-property-head {
    display: grid;
  }

  .settings-panel-color-selected-chip,
  .settings-panel-color-preview-status,
  .settings-panel-color-property-meta {
    justify-content: flex-start;
  }

  .settings-panel-color-browser-layout {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  .settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-browser-layout {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0;
  }

  .settings-library-all-stage {
    min-width: 720px;
  }

  .settings-library-all-main-shell {
    grid-template-columns:
      minmax(140px, var(--favorites-panel-preview-one, 20fr))
      minmax(330px, var(--favorites-panel-preview-two, 60fr))
      minmax(160px, var(--favorites-panel-preview-three, 20fr));
  }

  .settings-library-all-topbar {
    grid-template-columns: auto minmax(170px, 1fr) auto;
  }

  .settings-library-all-topbar nav {
    display: none;
  }

  .settings-library-all-album-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .settings-panel-color-preview-surface.is-panel-three {
    min-height: 0;
  }

  .settings-panel-color-visual-editor.is-all-workspace .settings-panel-color-preview-surface.is-panel-three {
    min-height: 0;
  }

  .settings-all-preview-size-control {
    grid-template-columns: 1fr;
  }
}

.settings-artist-badge-artwork-card {
  display: grid;
  gap: 18px;
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background:
    radial-gradient(circle at top right, rgba(105, 223, 196, 0.14), transparent 32%),
    rgba(248, 247, 255, 0.52);
}

.settings-artist-badge-artwork-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.settings-artist-badge-artwork-grid {
  gap: 16px;
}

.settings-spectrum-color-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.settings-spectrum-color-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-color-input {
  width: 100%;
  min-width: 0;
  height: 44px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #ffffff;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(78, 86, 112, 0.04);
}

.settings-fonts-card {
  display: grid;
  gap: 20px;
}

.settings-typography-form,
.settings-favorites-typography-form {
  display: grid;
  gap: 18px;
}

.settings-typography-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: stretch;
}

.settings-typography-card {
  display: grid;
  gap: 16px;
  min-width: 0;
  width: 100%;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(248, 247, 255, 0.62));
}

.settings-typography-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.settings-typography-card-head > div {
  min-width: 0;
}

.settings-typography-card-head .admin-button.compact {
  min-height: 38px;
  padding: 8px 14px;
}

.settings-typography-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.settings-typography-fields .support-hours-field,
.settings-typography-fields .admin-select,
.settings-typography-fields .admin-text-input {
  width: 100%;
  max-width: 100%;
}

.settings-typography-color-field {
  align-content: start;
}

.settings-auth-login-property-card {
  gap: 16px;
}

.settings-auth-login-tabbed-card {
  display: grid;
  gap: 0;
  min-width: 0;
  overflow: visible;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(248, 247, 255, 0.52);
}

.admin-app[data-theme="dark"] .settings-auth-login-tabbed-card {
  background: rgba(15, 22, 34, 0.92);
  border-color: rgba(139, 113, 255, 0.24);
}

.settings-auth-login-editor-shell {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 560px);
  align-items: start;
  min-width: 0;
}

.settings-auth-login-editor-main {
  display: grid;
  min-width: 0;
  border-right: 1px solid rgba(166, 174, 203, 0.22);
}

.settings-auth-login-preview-pane {
  display: grid;
  min-width: 0;
  max-height: calc(100vh - 150px);
  overflow: auto;
  padding: 18px;
  position: sticky;
  top: 18px;
  background: rgba(255, 255, 255, 0.42);
}

.admin-app[data-theme="dark"] .settings-auth-login-editor-main {
  border-right-color: rgba(139, 113, 255, 0.18);
}

.admin-app[data-theme="dark"] .settings-auth-login-preview-pane {
  background: rgba(9, 14, 24, 0.34);
}

.settings-auth-login-panel-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: center;
  gap: 0;
  min-width: 0;
  overflow: visible;
  padding: 0 18px;
  border-bottom: 1px solid rgba(166, 174, 203, 0.26);
  background: rgba(255, 255, 255, 0.46);
}

.settings-auth-login-panel-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 58px;
  padding: 0 12px;
  border: 0;
  border-bottom: 4px solid transparent;
  border-radius: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
  white-space: normal;
  transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.settings-auth-login-panel-tab:hover,
.settings-auth-login-panel-tab:focus-visible {
  background: rgba(124, 92, 255, 0.08);
  color: var(--accent-strong);
}

.settings-auth-login-panel-tab.is-active {
  border-bottom-color: #7c5cff;
  background: rgba(124, 92, 255, 0.1);
  color: #6b4dff;
  box-shadow: inset 0 -1px 0 rgba(124, 92, 255, 0.16);
}

.settings-auth-login-panel-tab + .settings-auth-login-panel-tab {
  border-left: 1px solid rgba(166, 174, 203, 0.18);
}

.admin-app[data-theme="dark"] .settings-auth-login-panel-tab {
  background: transparent;
  color: rgba(226, 232, 246, 0.76);
}

.admin-app[data-theme="dark"] .settings-auth-login-panel-tab:hover,
.admin-app[data-theme="dark"] .settings-auth-login-panel-tab:focus-visible {
  background: rgba(139, 113, 255, 0.12);
  color: #d9d2ff;
}

.admin-app[data-theme="dark"] .settings-auth-login-panel-tab.is-active {
  border-bottom-color: #9b82ff;
  background: rgba(139, 113, 255, 0.16);
  color: #f2efff;
}

.admin-app[data-theme="dark"] .settings-auth-login-panel-tabs {
  border-bottom-color: rgba(139, 113, 255, 0.24);
  background: rgba(9, 14, 24, 0.42);
}

.admin-app[data-theme="dark"] .settings-auth-login-panel-tab + .settings-auth-login-panel-tab {
  border-left-color: rgba(139, 113, 255, 0.18);
}

.settings-auth-login-tab-panels,
.settings-auth-login-tab-panel,
.settings-auth-login-panel-body {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.settings-auth-login-tab-panel[hidden] {
  display: none !important;
}

.settings-auth-login-tab-panels {
  padding: 18px;
}

.settings-auth-login-panel-note {
  margin: 0;
}

.settings-auth-login-target-row {
  display: grid;
  grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
  gap: 14px;
  align-items: end;
}

.settings-auth-login-property-panels,
.settings-auth-login-property-panel,
.settings-auth-login-property-block {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.settings-auth-login-property-block .detail-label {
  margin: 0;
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0;
}

.settings-auth-login-property-panel[hidden] {
  display: none !important;
}

.settings-auth-login-copy-grid,
.settings-auth-login-typography-fields {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}

.settings-auth-login-copy-empty {
  padding: 12px 14px;
  border: 1px dashed rgba(166, 174, 203, 0.62);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.66);
}

.settings-auth-login-color-field {
  display: grid;
  grid-template-columns: minmax(0, max-content) auto;
  align-items: center;
  justify-content: start;
  gap: 8px 10px;
}

.settings-auth-login-tabbed-card .settings-auth-login-color-field .settings-color-input {
  width: 42px;
  min-width: 42px;
  height: 16px;
  min-height: 16px;
  justify-self: start;
  padding: 2px;
  border-radius: 7px;
}

.settings-auth-login-tabbed-card .settings-auth-login-color-field .settings-color-input::-webkit-color-swatch {
  border-radius: 5px;
}

.settings-auth-login-tabbed-card .settings-auth-login-color-field .settings-color-input::-moz-color-swatch {
  border-radius: 5px;
}

.admin-app[data-theme="dark"] .settings-auth-login-copy-empty {
  background: rgba(15, 22, 34, 0.72);
  border-color: rgba(166, 174, 203, 0.28);
}

@media (max-width: 1280px) {
  .settings-auth-login-editor-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  .settings-auth-login-editor-main {
    border-right: 0;
  }

  .settings-auth-login-preview-pane {
    position: relative;
    top: auto;
    max-height: none;
    border-top: 1px solid rgba(166, 174, 203, 0.22);
  }

  .admin-app[data-theme="dark"] .settings-auth-login-preview-pane {
    border-top-color: rgba(139, 113, 255, 0.18);
  }
}

@media (max-width: 860px) {
  .settings-auth-login-panel-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 0 14px;
  }

  .settings-auth-login-panel-tab {
    min-height: 52px;
    padding-inline: 8px;
  }

  .settings-auth-login-panel-tab:nth-child(2n + 1) {
    border-left: 0;
  }

  .settings-auth-login-tab-panels {
    padding: 14px;
  }

  .settings-auth-login-target-row,
  .settings-auth-login-copy-grid,
  .settings-auth-login-typography-fields {
    grid-template-columns: minmax(0, 1fr);
  }
}

.settings-inline-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 800;
}

.settings-inline-check input {
  width: 18px;
  height: 18px;
  accent-color: var(--accent-strong);
}

.settings-typography-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.settings-color-input:disabled {
  cursor: not-allowed;
  opacity: 0.58;
  filter: grayscale(0.25);
}

.settings-color-input::-webkit-color-swatch-wrapper {
  padding: 0;
}

.settings-color-input::-webkit-color-swatch {
  border: 0;
  border-radius: 10px;
}

.settings-color-input::-moz-color-swatch {
  border: 0;
  border-radius: 10px;
}

.admin-range-input {
  -webkit-appearance: none;
  appearance: none;
  --admin-range-fill: 100%;
  width: 100%;
  min-width: 0;
  height: 32px;
  margin: 0;
  accent-color: var(--purple);
  background: transparent;
  cursor: pointer;
}

.admin-range-input:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.admin-range-input::-webkit-slider-runnable-track {
  height: 10px;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(138, 92, 246, 0.9), rgba(75, 125, 240, 0.82)) 0 0 / var(--admin-range-fill) 100% no-repeat,
    #ffffff;
  box-shadow: inset 0 0 0 1px rgba(78, 86, 112, 0.12);
}

.admin-range-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  margin-top: -7px;
  border-radius: 999px;
  border: 4px solid #ffffff;
  background: var(--purple);
  box-shadow: 0 8px 22px rgba(87, 64, 184, 0.22);
}

.admin-range-input::-moz-range-track {
  height: 10px;
  border: 0;
  border-radius: 999px;
  background: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(78, 86, 112, 0.12);
}

.admin-range-input::-moz-range-progress {
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(138, 92, 246, 0.9), rgba(75, 125, 240, 0.82));
}

.admin-range-input::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 4px solid #ffffff;
  background: var(--purple);
  box-shadow: 0 8px 22px rgba(87, 64, 184, 0.22);
}

.settings-favicon-card {
  --favicon-preview-zoom-scale: 1;
  min-width: 0;
}

.settings-favicon-card .detail-row {
  align-items: center;
}

.settings-favicon-preview-frame {
  flex: 0 0 auto;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: 18px;
  padding: 0;
  background: #071018;
  border: 1px solid rgba(124, 100, 255, 0.22);
  box-shadow: 0 16px 30px rgba(37, 47, 74, 0.16);
  overflow: hidden;
}

.settings-favicon-preview {
  display: block;
  width: 100%;
  height: 100%;
  image-rendering: auto;
  object-fit: contain;
  transform: scale(var(--favicon-preview-zoom-scale, 1));
  transform-origin: center;
}

.settings-favicon-preview-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 14px 0 4px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--purple) 16%, var(--line));
  border-radius: 16px;
  background: color-mix(in srgb, var(--purple) 3%, #ffffff);
}

.settings-favicon-preview-toolbar > div:first-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-favicon-zoom-control {
  display: grid;
  grid-template-columns: 40px minmax(180px, 260px) 40px auto;
  align-items: center;
  gap: 10px;
  min-width: min(100%, 390px);
}

.settings-favicon-zoom-tools {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  min-width: min(100%, 620px);
}

.settings-favicon-fit-toggle {
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--purple) 20%, var(--line));
  border-radius: 14px;
  background: #ffffff;
}

.settings-favicon-fit-toggle .settings-toggle-state {
  min-width: auto;
  white-space: nowrap;
  font-size: 0.72rem;
  letter-spacing: 0.04em;
}

.settings-favicon-card.is-fit-to-sides .settings-favicon-generated-svg {
  transform: none;
}

.settings-favicon-adaptive-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 16px;
  margin: 12px 0 4px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--purple) 18%, var(--line));
  border-radius: 16px;
  background: color-mix(in srgb, var(--purple) 2%, #ffffff);
}

.settings-favicon-adaptive-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-favicon-adaptive-previews {
  display: flex;
  align-items: center;
  gap: 10px;
}

.settings-favicon-adaptive-preview {
  display: grid;
  grid-template-columns: 38px auto;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 10px 6px 6px;
  border: 1px solid var(--line);
  border-radius: 14px;
  color: var(--text);
  background: #ffffff;
  font-size: 0.72rem;
  font-weight: 900;
}

.settings-favicon-adaptive-preview.is-dark {
  color: #ffffff;
  background: #090b12;
}

.settings-favicon-adaptive-preview img {
  display: block;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  object-fit: contain;
}

.settings-favicon-adaptive-glyph {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  align-items: center;
  gap: 3px;
  width: 38px;
  height: 38px;
  padding: 7px;
  border-radius: 10px;
  background: #ffffff;
}

.settings-favicon-adaptive-preview.is-dark .settings-favicon-adaptive-glyph {
  background: #090b12;
}

.settings-favicon-adaptive-glyph span {
  display: block;
  width: 100%;
  border-radius: 999px;
  background: #ffffff;
}

.settings-favicon-adaptive-preview.is-light .settings-favicon-adaptive-glyph span {
  background: #050507;
}

.settings-favicon-adaptive-glyph span:nth-child(1),
.settings-favicon-adaptive-glyph span:nth-child(4) {
  height: 56%;
}

.settings-favicon-adaptive-glyph span:nth-child(2),
.settings-favicon-adaptive-glyph span:nth-child(5) {
  height: 76%;
}

.settings-favicon-adaptive-glyph span:nth-child(3) {
  height: 100%;
}

.settings-favicon-adaptive-preview small {
  font: inherit;
  text-transform: uppercase;
}

.settings-favicon-adaptive-toggle {
  min-height: 44px;
  padding: 0 12px;
  border: 1px solid color-mix(in srgb, var(--purple) 20%, var(--line));
  border-radius: 14px;
  background: #ffffff;
}

.settings-favicon-zoom-button {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  color: var(--purple);
}

.settings-favicon-zoom-value {
  min-width: 54px;
  text-align: right;
  color: var(--text);
  font-size: 0.9rem;
}

.settings-favicon-zoom-range {
  width: 100%;
}

.settings-favicon-upload-form {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.settings-favicon-generator-form {
  display: grid;
  gap: 14px;
  margin-top: 18px;
  padding: 16px;
  border: 1px solid color-mix(in srgb, var(--purple) 22%, var(--line));
  border-radius: 18px;
  background: color-mix(in srgb, var(--purple) 4%, #ffffff);
}

.settings-favicon-generator-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.settings-favicon-generated-preview {
  --favicon-generator-bar: #8b5cf6;
  --favicon-generator-bar-start: #8b5cf6;
  --favicon-generator-bar-center: #6f7cff;
  --favicon-generator-bar-end: #58d8d8;
  --favicon-generator-bg: #08070f;
  --favicon-generator-bg-opacity: 0;
  --favicon-generator-preview-radius: 18px;
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 72px;
  height: 72px;
  border-radius: var(--favicon-generator-preview-radius, 18px);
  border: 1px solid color-mix(in srgb, var(--purple) 24%, var(--line));
  background:
    linear-gradient(45deg, rgba(148, 163, 184, 0.18) 25%, transparent 25% 75%, rgba(148, 163, 184, 0.18) 75%),
    linear-gradient(45deg, rgba(148, 163, 184, 0.18) 25%, transparent 25% 75%, rgba(148, 163, 184, 0.18) 75%),
    #ffffff;
  background-position: 0 0, 6px 6px, 0 0;
  background-size: 12px 12px, 12px 12px, auto;
  overflow: hidden;
  box-shadow: 0 16px 30px rgba(37, 47, 74, 0.12);
}

.settings-favicon-generated-preview::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--favicon-generator-bg);
  opacity: var(--favicon-generator-bg-opacity);
}

.settings-favicon-generated-svg {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
  transform: scale(var(--favicon-preview-zoom-scale, 1));
  transform-origin: center;
}

.settings-favicon-generated-bg {
  fill: var(--favicon-generator-bg);
  opacity: var(--favicon-generator-bg-opacity);
}

.settings-favicon-generated-bars rect {
  shape-rendering: geometricPrecision;
}

.settings-favicon-generator-presets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.settings-favicon-generator-form [hidden] { display: none !important; }

.settings-favicon-individual-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
}

.settings-favicon-individual-head > div { display: grid; gap: 3px; }

.settings-favicon-individual-toggle { min-width: 126px; }

.settings-favicon-individual-panel {
  display: grid;
  gap: 15px;
  padding: 16px;
  border: 1px solid color-mix(in srgb, var(--purple) 24%, var(--line));
  border-radius: 17px;
  background: #fff;
}

.settings-favicon-bar-selectors { display: flex; gap: 12px; flex-wrap: wrap; }

.settings-favicon-bar-selector {
  display: grid;
  justify-items: center;
  gap: 5px;
  min-width: 66px;
  padding: 6px;
  border: 1px solid transparent;
  border-radius: 15px;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font: inherit;
  font-weight: 900;
}

.settings-favicon-bar-selector span {
  display: block;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  box-shadow: inset 0 1px 4px rgba(255, 255, 255, 0.35), 0 4px 10px rgba(24, 41, 67, 0.16);
}

.settings-favicon-bar-selector small { font-size: 0.74rem; }

.settings-favicon-bar-selector.is-active,
.settings-favicon-bar-selector:hover:not(:disabled) {
  border-color: color-mix(in srgb, var(--purple) 50%, var(--line));
  background: color-mix(in srgb, var(--purple) 7%, #fff);
  color: var(--text);
}

.settings-favicon-bar-selector:focus-visible { outline: 3px solid var(--purple); outline-offset: 2px; }

.settings-favicon-bar-selector:disabled { cursor: default; opacity: 0.6; }

.settings-favicon-bar-editor {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) repeat(2, minmax(140px, 1fr));
  align-items: end;
  gap: 12px;
  margin: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
}

.settings-favicon-bar-editor legend { padding: 0 6px; font-size: 0.84rem; font-weight: 900; }

.settings-favicon-bar-modes {
  display: flex;
  gap: 5px;
  min-height: 48px;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8f7fb;
}

.settings-favicon-bar-modes label { position: relative; flex: 1; min-width: 0; }

.settings-favicon-bar-modes input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }

.settings-favicon-bar-modes span {
  display: grid;
  place-items: center;
  height: 100%;
  padding: 5px 8px;
  border-radius: 9px;
  font-size: 0.78rem;
  font-weight: 900;
  text-align: center;
}

.settings-favicon-bar-modes input:checked + span { background: var(--purple); color: #fff; }

.settings-favicon-bar-modes input:focus-visible + span { outline: 3px solid var(--purple); outline-offset: 2px; }

.settings-favicon-generator-preset {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #ffffff;
  color: var(--text);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.settings-favicon-generator-preset .settings-favicon-generated-preview {
  width: 48px;
  height: 48px;
  border-radius: var(--favicon-generator-preview-radius, 14px);
}

.settings-favicon-generator-preset .settings-favicon-generated-svg {
  width: 44px;
  height: 44px;
  transform: none;
}

.settings-favicon-generator-preset:hover:not(:disabled),
.settings-favicon-generator-preset.is-active {
  border-color: color-mix(in srgb, var(--purple) 58%, var(--line));
  box-shadow: 0 14px 30px rgba(124, 92, 255, 0.12);
  transform: translateY(-1px);
}

.settings-favicon-generator-fields {
  display: grid;
  grid-template-columns: minmax(260px, 1.12fr) repeat(3, minmax(160px, 1fr)) minmax(170px, auto);
  gap: 12px;
  align-items: end;
}

.settings-favicon-shape-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.settings-favicon-shape-options {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
  min-height: 64px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #ffffff;
}

.settings-favicon-shape-option {
  position: relative;
  min-width: 0;
}

.settings-favicon-shape-input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

.settings-favicon-shape-option span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 10px;
  border-radius: 12px;
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 900;
  line-height: 1.05;
  text-align: center;
  background: color-mix(in srgb, var(--purple) 5%, #ffffff);
  transition: background-color 0.16s ease, color 0.16s ease, box-shadow 0.16s ease;
}

.settings-favicon-shape-input:checked + span {
  background: var(--purple);
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(124, 92, 255, 0.2);
}

.settings-favicon-shape-input:focus-visible + span {
  outline: 3px solid color-mix(in srgb, var(--purple) 30%, transparent);
  outline-offset: 2px;
}

.settings-favicon-shape-input:disabled + span {
  cursor: not-allowed;
  opacity: 0.58;
}

.settings-favicon-generator-toggle {
  align-self: stretch;
  justify-content: space-between;
  min-height: 64px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #ffffff;
}

.settings-favicon-generator-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.settings-favicon-slots-panel {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.settings-favicon-previous-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid color-mix(in srgb, var(--purple) 20%, var(--line));
  border-radius: 16px;
  background: color-mix(in srgb, var(--purple) 5%, #ffffff);
}

.settings-favicon-previous-copy {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.settings-favicon-previous-copy > span:last-child {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.settings-favicon-previous-copy small {
  color: var(--muted);
  font-weight: 700;
}

.settings-favicon-slots-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.settings-favicon-slot-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.settings-favicon-slot-upload-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: end;
}

.settings-favicon-slots-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 12px;
}

.settings-favicon-color-bars-row {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.settings-favicon-color-bars-row h5 { margin: 0 0 3px; font-size: 0.95rem; }

.settings-favicon-color-bars-row p { margin: 0; }

.settings-favicon-slots-grid.is-color-bars { grid-template-columns: repeat(3, minmax(120px, 1fr)); }

.settings-favicon-slot {
  position: relative;
  display: grid;
  gap: 10px;
  justify-items: center;
  min-width: 0;
  min-height: 176px;
  padding: 16px 12px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: color-mix(in srgb, var(--panel-bg) 88%, transparent);
  color: var(--text);
  cursor: pointer;
  text-align: center;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.settings-favicon-slot:hover:not(:disabled),
.settings-favicon-slot.is-selected {
  border-color: color-mix(in srgb, var(--purple) 58%, var(--line));
  box-shadow: 0 16px 38px rgba(124, 92, 255, 0.16);
  transform: translateY(-1px);
}

.settings-favicon-slot:disabled {
  cursor: default;
}

.settings-favicon-slot.is-empty {
  color: var(--muted);
  background: color-mix(in srgb, var(--panel-bg) 58%, transparent);
}

.settings-favicon-slot-preview {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: var(--panel-bg);
  overflow: hidden;
  font-weight: 800;
}

.settings-favicon-slot-preview img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(var(--favicon-preview-zoom-scale, 1));
  transform-origin: center;
}

.settings-favicon-slot-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
  font-size: 0.88rem;
}

.settings-favicon-slot-copy span {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.settings-favicon-slot-copy .settings-favicon-slot-recipe {
  color: var(--purple);
  font-size: 0.72rem;
  font-weight: 900;
}

.settings-favicon-slot-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  background: var(--green-soft);
  color: var(--green);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.settings-file-input {
  padding-top: 16px;
  padding-bottom: 16px;
}

.settings-file-input::file-selector-button {
  margin-right: 14px;
  border: 0;
  border-radius: 999px;
  padding: 10px 14px;
  font: inherit;
  font-weight: 800;
  color: #111827;
  background: linear-gradient(135deg, #69dfc4, #4eb8ff);
  cursor: pointer;
}

@media (max-width: 720px) {
  .settings-page-elements-grid,
  .settings-typography-fields {
    grid-template-columns: 1fr;
  }

  .settings-typography-grid {
    grid-template-columns: 1fr;
  }

  .settings-favicon-card .detail-row {
    align-items: flex-start;
  }

  .settings-favicon-upload-form {
    grid-template-columns: 1fr;
  }

  .settings-favicon-preview-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-favicon-zoom-tools {
    align-items: stretch;
    flex-direction: column;
    min-width: 0;
  }

  .settings-favicon-fit-toggle {
    justify-content: space-between;
    width: 100%;
  }

  .settings-favicon-zoom-control {
    grid-template-columns: 40px minmax(0, 1fr) 40px auto;
    min-width: 0;
  }

  .settings-favicon-adaptive-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .settings-favicon-adaptive-previews {
    flex-wrap: wrap;
  }

  .settings-favicon-adaptive-toggle {
    justify-content: space-between;
  }

  .settings-favicon-generator-head {
    align-items: flex-start;
  }

  .settings-favicon-generator-presets,
  .settings-favicon-generator-fields {
    grid-template-columns: 1fr;
  }

  .settings-favicon-individual-head { align-items: flex-start; flex-direction: column; }

  .settings-favicon-bar-selectors { justify-content: space-between; gap: 4px; }

  .settings-favicon-bar-selector { min-width: 48px; }

  .settings-favicon-bar-selector span { width: 38px; height: 38px; }

  .settings-favicon-bar-editor { grid-template-columns: 1fr; }

  .settings-favicon-generator-actions {
    justify-content: stretch;
  }

  .settings-favicon-generator-actions > .admin-button {
    flex: 1 1 160px;
  }

  .settings-favicon-previous-card {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-favicon-slot-upload-form {
    grid-template-columns: 1fr;
  }

  .settings-favicon-slots-head {
    align-items: stretch;
    flex-direction: column;
  }

  .settings-favicon-slot-actions {
    justify-content: stretch;
  }

  .settings-favicon-slot-actions > .admin-button {
    flex: 1 1 150px;
  }

  .settings-favicon-slots-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .settings-favicon-slots-grid.is-color-bars { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .settings-favicon-preview-frame {
    width: 64px;
    height: 64px;
  }

  .settings-footer-social-head,
  .settings-footer-social-style-fields,
  .settings-footer-social-upload {
    grid-template-columns: 1fr;
    justify-items: stretch;
  }

  .settings-footer-social-icon-preview,
  .settings-footer-social-toggle {
    justify-self: start;
  }
}

.settings-ai-layout {
  display: grid;
  gap: 20px;
}

.settings-ai-summary-carousel {
  display: grid;
  gap: 14px;
}

.settings-ai-summary-carousel.is-collapsed {
  gap: 0;
}

.settings-ai-summary-carousel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.settings-ai-summary-carousel-copy {
  display: grid;
  gap: 6px;
}

.settings-ai-summary-carousel-kicker {
  color: var(--accent-strong);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.settings-ai-summary-carousel-status {
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 700;
}

.settings-ai-summary-carousel-controls {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.settings-ai-summary-carousel-nav {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.settings-ai-summary-collapse-button {
  min-height: 44px;
  white-space: nowrap;
}

.settings-ai-summary-carousel-body {
  display: grid;
  gap: 14px;
}

.settings-ai-summary-carousel-body[hidden],
.settings-ai-summary-carousel-nav[hidden] {
  display: none;
}

.settings-ai-summary-board {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}

.settings-ai-summary-card {
  display: grid;
  gap: 12px;
  min-width: 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: linear-gradient(180deg, var(--panel-bg) 0%, var(--panel-soft) 100%);
  align-content: start;
}

.settings-ai-summary-carousel-dots {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.settings-ai-summary-dot {
  display: block;
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: rgba(132, 111, 255, 0.18);
  box-shadow: inset 0 0 0 1px rgba(132, 111, 255, 0.18);
  cursor: pointer;
}

.settings-ai-summary-dot.is-active {
  background: rgba(132, 111, 255, 0.95);
  box-shadow: 0 0 0 5px rgba(132, 111, 255, 0.12);
}

.settings-ai-summary-dot:focus-visible {
  outline: 2px solid rgba(132, 111, 255, 0.72);
  outline-offset: 5px;
}

.settings-ai-summary-header {
  display: grid;
  gap: 4px;
}

.settings-ai-summary-header strong {
  color: var(--text);
  font-size: 1rem;
  line-height: 1.3;
}

@media (max-width: 720px) {
  .settings-ai-summary-carousel-head {
    align-items: flex-start;
  }

  .settings-ai-summary-carousel-controls {
    width: 100%;
  }

  .settings-ai-summary-collapse-button {
    margin-left: auto;
  }
}

.settings-ai-summary-label,
.settings-ai-summary-carousel-kicker,
.settings-ai-section-kicker {
  display: inline-flex;
  align-self: start;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel-bg);
  color: var(--accent-strong);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.settings-ai-section {
  gap: 20px;
  padding: 22px;
  border-color: var(--line-strong);
  background: linear-gradient(180deg, var(--panel-soft) 0%, var(--panel-bg) 100%);
}

.settings-ai-controls-band {
  gap: 18px;
}

.settings-ai-section-header {
  display: grid;
  gap: 10px;
}

.settings-ai-toggle-grid {
  display: grid;
  gap: 16px;
  align-items: stretch;
  grid-template-columns: 1fr;
}

.settings-ai-toggle-grid > .toggle-card {
  min-width: 0;
  height: 100%;
  align-content: start;
}

.settings-ai-card-grid {
  display: grid;
  gap: 16px;
  align-items: stretch;
  grid-template-columns: 1fr;
}

.settings-ai-card-grid > * {
  min-width: 0;
  height: 100%;
}

.settings-ai-card-grid .detail-card,
.settings-ai-card-grid .toggle-card,
.settings-ai-card-grid .panel-stack,
.settings-ai-card-grid .settings-card-pair {
  align-content: start;
}

.settings-ai-card-grid .detail-row {
  align-items: flex-start;
}

.settings-ai-card-grid .detail-row > * {
  min-width: 0;
}

.settings-ai-card-grid .support-hours-grid {
  grid-template-columns: 1fr;
}

.settings-ai-card-grid .admin-select,
.settings-ai-card-grid .admin-text-input,
.settings-ai-card-grid .admin-textarea {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.settings-ai-card-form,
.settings-ai-card-grid form,
.settings-ai-card-grid label {
  min-width: 0;
}

.settings-chatbot-memory-editor {
  min-height: 280px;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.86rem;
  line-height: 1.45;
}

.settings-chatbot-appearance-card {
  margin-top: 16px;
}

.settings-chatbot-appearance-layout {
  display: grid;
  grid-template-columns: minmax(240px, 0.85fr) minmax(280px, 1.15fr);
  gap: 18px;
  align-items: start;
}

.settings-chatbot-preview-stage {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.settings-chatbot-dynamic-contrast-note {
  display: none;
  width: fit-content;
  max-width: 100%;
  padding: 5px 9px;
  border: 1px solid rgba(223, 255, 99, 0.42);
  border-radius: 999px;
  background: rgba(223, 255, 99, 0.11);
  color: #dfff63;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
}

.settings-chatbot-preview-stage.is-dynamic-contrast-enabled .settings-chatbot-dynamic-contrast-note {
  display: inline-flex;
}

.settings-chatbot-preview-stage.is-dynamic-contrast-enabled .settings-chatbot-preview-launcher,
.settings-library-all-stage.is-chatbot-dynamic-contrast-enabled .settings-library-all-chatbot-launcher {
  --settings-chatbot-launcher-bg: #dfff63;
  --settings-chatbot-launcher-icon-color: #0b0b0c;
  border-color: rgba(223, 255, 99, 0.82);
  box-shadow:
    inset 0 0 0 2px rgba(11, 11, 12, 0.7),
    0 0 0 5px rgba(223, 255, 99, 0.13),
    0 18px 38px rgba(0, 0, 0, 0.34);
}

.settings-chatbot-preview-stage.is-dynamic-contrast-enabled .settings-chatbot-preview-launcher .settings-chatbot-launcher-chat-line,
.settings-library-all-stage.is-chatbot-dynamic-contrast-enabled .settings-library-all-chatbot-launcher .settings-chatbot-launcher-chat-line {
  fill: #ffffff;
}

.settings-chatbot-preview-stage.is-dynamic-contrast-enabled .settings-chatbot-preview-launcher-dot,
.settings-library-all-stage.is-chatbot-dynamic-contrast-enabled .settings-library-all-chatbot-dot {
  background: #dfff63;
  box-shadow:
    0 0 0 3px #0b0b0c,
    0 0 0 5px rgba(223, 255, 99, 0.32);
}

.settings-chatbot-preview-window {
  position: relative;
  min-height: 280px;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, 0.2);
  border-radius: 18px;
  background:
    radial-gradient(circle at 18% 18%, rgba(109, 93, 252, 0.22), transparent 30%),
    linear-gradient(145deg, #070b12, #151923 58%, #090b10);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.settings-chatbot-preview-library {
  position: absolute;
  inset: 18px 18px 84px;
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  grid-template-rows: 44px 1fr;
  gap: 12px;
  opacity: 0.72;
}

.settings-chatbot-preview-library span {
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
}

.settings-chatbot-preview-library span:nth-child(1) {
  grid-column: 1 / -1;
}

.settings-chatbot-preview-library span:nth-child(2) {
  min-height: 140px;
}

.settings-chatbot-preview-library span:nth-child(3) {
  min-height: 140px;
}

.settings-chatbot-preview-launcher {
  position: absolute;
  right: 18px;
  bottom: 18px;
  width: var(--settings-chatbot-launcher-size, 62px);
  height: var(--settings-chatbot-launcher-size, 62px);
  display: inline-grid;
  place-items: center;
  overflow: visible;
  border: 1px solid rgba(124, 85, 255, 0.82);
  border-radius: 999px;
  outline: 0 solid transparent;
  background: var(--settings-chatbot-launcher-bg, #050711);
  color: var(--settings-chatbot-launcher-icon-color, #ffffff);
  box-shadow:
    inset 0 0 0 2px rgba(124, 85, 255, 0.78),
    inset 0 0 18px rgba(124, 85, 255, 0.14),
    0 18px 38px rgba(0, 0, 0, 0.34);
  cursor: pointer;
  transition:
    transform 0.14s ease,
    border-color 0.14s ease,
    box-shadow 0.14s ease;
  -webkit-tap-highlight-color: transparent;
}

.settings-chatbot-preview-launcher:hover,
.settings-chatbot-preview-launcher:focus,
.settings-chatbot-preview-launcher:focus-visible,
.settings-chatbot-preview-launcher:active {
  outline: 0 solid transparent;
  border-color: rgba(151, 113, 255, 0.98);
  box-shadow:
    inset 0 0 0 2px rgba(124, 85, 255, 0.95),
    inset 0 0 18px rgba(124, 85, 255, 0.2),
    0 0 0 4px rgba(124, 85, 255, 0.18),
    0 18px 38px rgba(0, 0, 0, 0.34);
}

.settings-chatbot-preview-launcher:hover {
  transform: translateY(-1px);
}

.settings-chatbot-preview-launcher:active {
  transform: translateY(0);
}

.settings-chatbot-logo-mark {
  --settings-chatbot-logo-mark-size: 38px;
  width: var(--settings-chatbot-logo-mark-size);
  height: var(--settings-chatbot-logo-mark-size);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: calc(var(--settings-chatbot-logo-mark-size) * 0.0789473684);
  color: var(--settings-chatbot-logo-bar, #ffffff);
}

.settings-chatbot-logo-mark span {
  display: block;
  width: calc(var(--settings-chatbot-logo-mark-size) * 0.1315789474);
  min-width: calc(var(--settings-chatbot-logo-mark-size) * 0.1315789474);
  border-radius: 999px;
  background: currentColor;
}

.settings-chatbot-logo-mark span:nth-child(1) {
  height: calc(var(--settings-chatbot-logo-mark-size) * 0.4736842105);
  background: var(--settings-chatbot-logo-bottom, currentColor);
}

.settings-chatbot-logo-mark span:nth-child(2) {
  height: calc(var(--settings-chatbot-logo-mark-size) * 0.7105263158);
  background: var(--settings-chatbot-logo-top, currentColor);
}

.settings-chatbot-logo-mark span:nth-child(3) {
  height: var(--settings-chatbot-logo-mark-size);
  background: var(--settings-chatbot-logo-mid, currentColor);
}

.settings-chatbot-logo-mark span:nth-child(4) {
  height: calc(var(--settings-chatbot-logo-mark-size) * 0.5);
  background: var(--settings-chatbot-logo-top, currentColor);
}

.settings-chatbot-logo-mark span:nth-child(5) {
  height: calc(var(--settings-chatbot-logo-mark-size) * 0.7105263158);
  background: var(--settings-chatbot-logo-bottom, currentColor);
}

.settings-chatbot-preview-launcher .settings-chatbot-logo-mark,
.settings-library-all-chatbot-launcher .settings-chatbot-logo-mark {
  --settings-chatbot-logo-mark-size: 34px;
}

.settings-chatbot-preview-launcher svg {
  width: 28px;
  height: 28px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.settings-chatbot-preview-launcher .settings-chatbot-launcher-chat-icon,
.settings-library-all-chatbot-launcher .settings-chatbot-launcher-chat-icon {
  width: var(--settings-chatbot-launcher-icon-size, 36px);
  height: var(--settings-chatbot-launcher-icon-size, 36px);
  display: block;
  overflow: visible;
  fill: none;
  stroke: none;
}

.settings-chatbot-preview-launcher .settings-chatbot-launcher-chat-icon *,
.settings-library-all-chatbot-launcher .settings-chatbot-launcher-chat-icon * {
  stroke: none;
}

.settings-chatbot-preview-launcher .settings-chatbot-launcher-chat-bubble,
.settings-library-all-chatbot-launcher .settings-chatbot-launcher-chat-bubble {
  fill: currentColor;
}

.settings-chatbot-preview-launcher .settings-chatbot-launcher-chat-line,
.settings-library-all-chatbot-launcher .settings-chatbot-launcher-chat-line {
  fill: var(--settings-chatbot-launcher-bg, #050711);
}

.settings-chatbot-preview-panel {
  position: absolute;
  right: 18px;
  bottom: 88px;
  width: min(78%, 286px);
  overflow: hidden;
  border-radius: 22px;
  background: var(--settings-chatbot-panel-bg, #ffffff);
  color: #242832;
  box-shadow: 0 24px 54px rgba(0, 0, 0, 0.32);
  opacity: 0;
  pointer-events: none;
  transform: translateY(10px) scale(0.97);
  transition: opacity 160ms ease, transform 160ms ease;
}

.settings-chatbot-preview-stage:hover .settings-chatbot-preview-panel,
.settings-chatbot-preview-stage:focus-within .settings-chatbot-preview-panel,
.settings-chatbot-preview-stage.is-open .settings-chatbot-preview-panel {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.settings-chatbot-preview-header {
  min-height: 54px;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  background: var(--settings-chatbot-header-bg, #a98bf5);
  color: #050711;
}

.settings-chatbot-preview-dots,
.settings-chatbot-preview-minimize {
  font-size: 1.2rem;
  line-height: 1;
}

.settings-chatbot-preview-avatar {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 0;
  background: transparent;
  font-weight: 900;
}

.settings-chatbot-preview-avatar .settings-chatbot-logo-mark {
  --settings-chatbot-logo-mark-size: 28px;
}

.settings-chatbot-preview-intro {
  display: grid;
  justify-items: center;
  gap: 6px;
  margin: 4px 0 6px;
  color: #2c2f36;
}

.settings-chatbot-preview-intro-avatar {
  width: 58px;
  height: 58px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: var(--settings-chatbot-logo-intro-bg, #a98bf5);
  color: var(--settings-chatbot-logo-bar, #ffffff);
  box-shadow: 0 12px 24px rgba(169, 139, 245, 0.18);
}

.settings-chatbot-preview-intro-avatar .settings-chatbot-logo-mark {
  --settings-chatbot-logo-mark-size: 36px;
}

.settings-chatbot-preview-agreement {
  max-width: 210px;
  margin: 0;
  color: #6e6e72;
  font-size: calc(0.7rem * var(--settings-chatbot-message-scale, 1));
  line-height: 1.32;
  text-align: center;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.settings-library-all-chatbot-property-preview .settings-chatbot-preview-window {
  min-height: 330px;
}

.settings-chatbot-preview-header strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.settings-chatbot-preview-body {
  display: grid;
  gap: 10px;
  padding: 16px 14px;
}

.settings-chatbot-preview-bubble {
  max-width: 82%;
  margin: 0;
  padding: 10px 12px;
  border-radius: 16px;
  font-size: calc(0.88rem * var(--settings-chatbot-message-scale, 1));
  line-height: 1.35;
}

.settings-chatbot-preview-bubble.is-ai {
  justify-self: start;
  background: var(--settings-chatbot-ai-bubble, #ffffff);
  color: var(--settings-chatbot-ai-text, #2c2f36);
  font-family: var(--settings-chatbot-ai-font-family, inherit);
  font-weight: var(--settings-chatbot-ai-font-weight, inherit);
}

.settings-chatbot-preview-bubble.is-user {
  justify-self: end;
  background: var(--settings-chatbot-user-bubble, #a98bf5);
  color: var(--settings-chatbot-user-text, #050711);
  font-family: var(--settings-chatbot-user-font-family, inherit);
  font-weight: var(--settings-chatbot-user-font-weight, inherit);
}

.settings-chatbot-preview-action {
  justify-self: start;
  min-height: 34px;
  max-width: 82%;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: var(--settings-chatbot-support-queue-button-bg, #a98bf5);
  color: var(--settings-chatbot-support-queue-button-text, #ffffff);
  font: inherit;
  font-size: calc(0.84rem * var(--settings-chatbot-message-scale, 1));
  font-weight: 800;
  line-height: 1.16;
  pointer-events: none;
  box-shadow: 0 10px 20px rgba(169, 139, 245, 0.16);
}

.settings-chatbot-preview-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin: 0 14px 14px;
  padding: 8px 8px 8px 14px;
  border: 1px solid var(--settings-chatbot-input-border, rgba(31, 41, 55, 0.14));
  border-radius: 999px;
  background: var(--settings-chatbot-input-bg, #ffffff);
  color: var(--settings-chatbot-input-text, #22252c);
  font-family: var(--settings-chatbot-input-font-family, inherit);
  font-size: calc(0.88rem * var(--settings-chatbot-message-scale, 1));
  font-weight: var(--settings-chatbot-input-font-weight, inherit);
}

.settings-chatbot-preview-input i {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  background: var(--settings-chatbot-send-bg, #7d7f84);
  color: #ffffff;
  font-style: normal;
  font-weight: 900;
}

.settings-chatbot-preview-input span {
  color: var(--settings-chatbot-input-placeholder, #6b7280);
}

.settings-chatbot-appearance-fields {
  align-items: stretch;
}

.settings-chatbot-apply-bar {
  position: sticky;
  top: 0;
  z-index: 4;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(109, 93, 252, 0.24);
  border-radius: 12px;
  background: rgba(249, 250, 255, 0.98);
  box-shadow: 0 14px 26px rgba(31, 37, 52, 0.08);
}

.settings-chatbot-apply-bar span {
  color: rgba(64, 72, 98, 0.78);
  font-size: 0.7rem;
  font-weight: 780;
  line-height: 1.32;
}

.settings-chatbot-apply-bar .admin-button {
  width: 100%;
  justify-content: center;
  min-height: 38px;
}

.settings-chatbot-apply-bar--advanced {
  margin-bottom: 2px;
}

.admin-app[data-theme="dark"] .settings-chatbot-apply-bar {
  border-color: rgba(169, 139, 245, 0.28);
  background: rgba(22, 26, 38, 0.96);
  box-shadow: 0 14px 26px rgba(0, 0, 0, 0.24);
}

.admin-app[data-theme="dark"] .settings-chatbot-apply-bar span {
  color: rgba(225, 230, 245, 0.72);
}

.settings-chatbot-agreement-textarea {
  min-height: 118px;
  line-height: 1.45;
}

.settings-chatbot-typography-field {
  gap: 10px;
}

.settings-chatbot-typography-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.settings-chatbot-typography-grid label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.settings-chatbot-typography-grid label > span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

@media (max-width: 720px) {
  .settings-chatbot-typography-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 980px) {
  .settings-chatbot-appearance-layout {
    grid-template-columns: minmax(0, 1fr);
  }
}

.settings-ai-runtime-grid,
.settings-ai-support-grid,
.settings-ai-moderation-grid {
  display: grid;
  gap: 16px;
  align-items: start;
}

.settings-ai-runtime-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.settings-ai-support-grid {
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
}

.settings-ai-moderation-grid {
  grid-template-columns: minmax(0, 1fr);
}

.settings-ai-stack,
.settings-ai-full-width {
  display: grid;
  gap: 16px;
  min-width: 0;
  align-content: start;
}

.settings-ai-section .detail-card,
.settings-ai-section .toggle-card,
.settings-ai-section .panel-stack,
.settings-ai-section .split-grid,
.settings-ai-section .settings-card-pair {
  min-width: 0;
}

@media (max-width: 1360px) {
  .settings-storage-grid {
    grid-template-columns: 1fr;
  }

  .settings-maintenance-alert-grid {
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

@media (max-width: 1080px) {
  .settings-card-pair {
    grid-template-columns: 1fr;
  }

  #settings-backup-retention-form .split-grid {
    grid-template-columns: 1fr;
  }

  .settings-maintenance-time-grid,
  .settings-maintenance-alert-grid {
    grid-template-columns: 1fr;
  }

  .settings-maintenance-quick-card {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .settings-maintenance-quick-actions {
    justify-self: stretch;
    width: 100%;
  }
}

.settings-ai-summary-card .chip-row,
.settings-ai-section .chip-row {
  gap: 8px;
}

.settings-ai-summary-card .admin-info-pill-grid {
  margin-top: 2px;
}

.settings-ai-summary-card .admin-info-pill-card,
.settings-ai-status-grid .admin-info-pill-card,
.settings-admin-summary-pill-grid .admin-info-pill-card {
  padding: 10px 11px;
}

.inbox-explorer-collapsed-mark {
  display: grid;
  gap: 12px;
  justify-items: center;
  align-content: start;
  width: 100%;
}

.inbox-explorer-collapsed-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(150, 112, 255, 0.12);
  color: var(--accent-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.inbox-explorer-collapsed-icon svg {
  width: 22px;
  height: 22px;
}

.inbox-explorer-collapsed-count {
  min-width: 34px;
  min-height: 34px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #ffffff;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
}

.inbox-explorer-collapsed-count.is-unread,
.inbox-thread-section-count.is-unread {
  border-color: #e11d48;
  background: #e11d48;
  color: #ffffff;
  box-shadow: 0 14px 32px rgba(225, 29, 72, 0.2);
}

.inbox-collapsed-nav,
.inbox-collapsed-message-pager,
.inbox-collapsed-message-list {
  display: grid;
  justify-items: center;
  gap: 8px;
  width: 100%;
}

.inbox-collapsed-nav {
  margin-top: 8px;
}

.inbox-collapsed-message-pager {
  margin-top: 2px;
}

.inbox-collapsed-section-button,
.inbox-collapsed-message-button,
.inbox-collapsed-page-button,
.inbox-collapsed-empty {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(210, 220, 236, 0.92);
  background: rgba(255, 255, 255, 0.94);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font: inherit;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(40, 55, 86, 0.08);
}

.inbox-collapsed-section-button,
.inbox-collapsed-message-button,
.inbox-collapsed-page-button {
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.inbox-collapsed-section-button:hover,
.inbox-collapsed-message-button:hover,
.inbox-collapsed-page-button:hover {
  transform: translateY(-1px);
  border-color: rgba(132, 111, 255, 0.32);
  box-shadow: 0 16px 34px rgba(40, 55, 86, 0.12);
}

.inbox-collapsed-section-button.is-active,
.inbox-collapsed-message-button.is-active {
  border-color: rgba(132, 111, 255, 0.4);
  background: linear-gradient(180deg, rgba(232, 224, 255, 0.98), rgba(221, 232, 255, 0.96));
  color: var(--accent-strong);
}

.inbox-collapsed-section-count {
  position: absolute;
  right: -7px;
  top: -7px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e11d48;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.72rem;
  line-height: 1;
  box-shadow: 0 10px 24px rgba(225, 29, 72, 0.24);
}

.inbox-collapsed-message-button svg {
  width: 20px;
  height: 20px;
}

.inbox-collapsed-message-button path,
.inbox-collapsed-message-button circle,
.inbox-collapsed-page-button path {
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.inbox-collapsed-message-button .status-dot {
  fill: #e11d48;
  stroke: none;
}

.inbox-collapsed-message-initial {
  position: absolute;
  right: -5px;
  bottom: -5px;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(210, 220, 236, 0.92);
  color: var(--text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.68rem;
  font-weight: 900;
}

.inbox-collapsed-page-button {
  width: 34px;
  height: 30px;
  border-radius: 12px;
}

.inbox-collapsed-page-button svg {
  width: 18px;
  height: 18px;
}

.inbox-collapsed-page-button[disabled] {
  opacity: 0.34;
  cursor: default;
  transform: none;
  box-shadow: none;
}

.inbox-collapsed-empty {
  color: var(--muted);
  opacity: 0.64;
}

.inbox-thread-sections {
  display: grid;
  gap: 12px;
}

.inbox-thread-sections.scroll-region.is-inbox-sidebar {
  max-height: calc(100vh - 280px);
}

.inbox-thread-tabs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 14px;
  width: 100%;
}

.inbox-thread-tab {
  border: 1px solid rgba(199, 210, 228, 0.88);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(248, 250, 255, 0.98), rgba(241, 246, 255, 0.94));
  color: var(--muted);
  min-height: 44px;
  width: 100%;
  padding: 6px 12px 6px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  font: inherit;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  box-shadow: 0 14px 34px rgba(40, 55, 86, 0.06);
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.inbox-thread-tab:hover {
  transform: translateY(-1px);
  border-color: rgba(132, 111, 255, 0.3);
  box-shadow: 0 16px 38px rgba(40, 55, 86, 0.1);
}

.inbox-thread-tab.is-active {
  border-color: rgba(132, 111, 255, 0.45);
  background: linear-gradient(180deg, rgba(232, 224, 255, 0.98), rgba(221, 232, 255, 0.96));
  color: var(--accent-strong);
}

.inbox-thread-section-panel {
  display: grid;
  gap: 12px;
}

.inbox-thread-section {
  display: grid;
  gap: 10px;
}

.inbox-thread-section-toggle {
  width: 100%;
  border: 1px solid rgba(199, 210, 228, 0.88);
  border-radius: 15px;
  background: linear-gradient(180deg, rgba(248, 250, 255, 0.96), rgba(240, 245, 255, 0.92));
  color: var(--text);
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font: inherit;
  font-weight: 800;
  box-shadow: 0 14px 34px rgba(40, 55, 86, 0.06);
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.inbox-thread-section-toggle:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 38px rgba(40, 55, 86, 0.1);
}

.inbox-thread-section-toggle.is-open {
  border-color: rgba(132, 111, 255, 0.32);
  background: linear-gradient(180deg, rgba(244, 240, 255, 0.98), rgba(237, 243, 255, 0.96));
}

.inbox-thread-section-left {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.inbox-thread-section-arrow {
  width: 20px;
  height: 20px;
  color: var(--accent-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.2s ease;
}

.inbox-thread-section-toggle.is-open .inbox-thread-section-arrow {
  transform: rotate(90deg);
}

.inbox-thread-section-arrow svg {
  width: 16px;
  height: 16px;
}

.inbox-thread-section-arrow path {
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.inbox-thread-section-count {
  min-width: 32px;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  background: #ffffff;
  color: var(--muted);
  border: 1px solid rgba(210, 220, 236, 0.9);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.95rem;
  font-weight: 900;
  flex: 0 0 auto;
}

.inbox-thread-section-body {
  display: grid;
  gap: 12px;
}

.inbox-thread-empty,
.inbox-history-empty {
  border: 1px solid rgba(219, 226, 237, 0.88);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.96);
  padding: 18px 16px;
  color: var(--muted);
  line-height: 1.6;
}

.inbox-chat-group {
  display: grid;
  gap: 8px;
}

.inbox-chat-item {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  border: 1px solid rgba(219, 226, 237, 0.94);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.98);
  padding: 12px 14px 12px 12px;
  box-shadow: 0 18px 42px rgba(40, 55, 86, 0.08);
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.inbox-chat-item:hover {
  transform: translateY(-1px);
  border-color: rgba(132, 111, 255, 0.26);
  box-shadow: 0 20px 48px rgba(40, 55, 86, 0.12);
}

.inbox-chat-item.is-active {
  border-color: rgba(95, 137, 255, 0.34);
  background: linear-gradient(180deg, rgba(243, 247, 255, 0.98), rgba(236, 243, 255, 0.96));
  box-shadow: 0 22px 52px rgba(76, 110, 182, 0.12);
}

.inbox-chat-item.is-history-collapsed {
  padding-top: 10px;
  padding-bottom: 10px;
}

.inbox-chat-item.is-history-collapsed .inbox-chat-main {
  gap: 0;
}

.inbox-chat-item.is-history-collapsed .inbox-chat-title-row {
  min-height: 34px;
  align-items: start;
}

.inbox-chat-item.is-history-collapsed .inbox-chat-preview,
.inbox-chat-item.is-history-collapsed .inbox-chat-meta {
  display: none;
}

.inbox-chat-expand-button {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(210, 220, 236, 0.92);
  border-radius: 9px;
  background: #ffffff;
  color: var(--accent-strong);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.inbox-chat-expand-button:hover {
  border-color: rgba(132, 111, 255, 0.28);
  background: rgba(248, 244, 255, 0.95);
}

.inbox-chat-expand-button.is-expanded {
  background: rgba(244, 239, 255, 0.96);
  border-color: rgba(132, 111, 255, 0.28);
}

.inbox-chat-expand-button.is-expanded svg {
  transform: rotate(90deg);
}

.inbox-chat-expand-button[disabled] {
  opacity: 0.42;
  cursor: default;
}

.inbox-chat-expand-button[disabled]:hover {
  border-color: rgba(210, 220, 236, 0.92);
  background: #ffffff;
}

.inbox-chat-expand-button svg {
  width: 14px;
  height: 14px;
  transition: transform 0.2s ease;
}

.inbox-chat-expand-button path,
.inbox-history-icon-button path,
.inbox-history-icon-button circle:not(.status-dot) {
  stroke: currentColor;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.inbox-history-icon-button .status-dot {
  fill: currentColor;
  stroke: none;
}

.inbox-chat-main {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.inbox-chat-avatar-shell {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
}

.inbox-chat-avatar-shell .message-avatar {
  width: 100%;
  height: 100%;
  flex: 0 0 auto;
}

.inbox-chat-presence {
  position: absolute;
  right: -1px;
  bottom: -1px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.94);
  box-shadow: 0 6px 14px rgba(25, 34, 50, 0.16);
}

.inbox-chat-presence.is-online {
  background: #39cf95;
  box-shadow: 0 0 0 4px rgba(57, 207, 149, 0.16);
}

.inbox-chat-presence.is-away {
  background: #f5c542;
  box-shadow: 0 0 0 4px rgba(245, 197, 66, 0.18);
}

.inbox-chat-presence.is-offline {
  background: #eb4a62;
  box-shadow: 0 0 0 4px rgba(235, 74, 98, 0.14);
}

.inbox-chat-title-row,
.inbox-history-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 6px 12px;
  min-width: 0;
}

.inbox-chat-name,
.inbox-history-title {
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
  line-height: 1.28;
  font-size: 1rem;
  color: var(--text);
}

.inbox-chat-name {
  font-weight: 400;
}

.inbox-history-title {
  font-weight: 800;
}

.inbox-chat-time,
.inbox-history-date {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 600;
}

.inbox-chat-preview {
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
  color: #5e6880;
  font-size: 0.95rem;
  line-height: 1.34;
}

.inbox-chat-meta,
.inbox-history-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 5px;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.34;
}

.inbox-chat-meta > span,
.inbox-history-meta > span {
  display: block;
  min-width: 0;
  overflow-wrap: anywhere;
}

.inbox-chat-side {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  justify-self: end;
  gap: 8px;
  flex-wrap: wrap;
}

.inbox-chat-side .inbox-history-icon-button {
  width: 36px;
  height: 36px;
  border-radius: 13px;
}

.inbox-thread-action-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
}

.inbox-thread-action-row .inbox-history-icon-button {
  width: 44px;
  height: 44px;
  border-radius: 14px;
}

.inbox-thread-action-row .inbox-history-icon-button svg {
  width: 18px;
  height: 18px;
}

.inbox-chat-unread {
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  background: #e11d48;
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  font-weight: 900;
  box-shadow: 0 10px 24px rgba(225, 29, 72, 0.24);
}

.inbox-chat-history {
  display: grid;
  gap: 8px;
  margin-left: 42px;
  padding-left: 12px;
  border-left: 2px solid rgba(223, 229, 239, 0.92);
}

.inbox-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  border: 1px solid rgba(222, 228, 238, 0.9);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.94);
  padding: 12px 14px;
  cursor: pointer;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.inbox-history-row:hover {
  border-color: rgba(132, 111, 255, 0.26);
  box-shadow: 0 12px 32px rgba(40, 55, 86, 0.08);
}

.inbox-history-row.is-active {
  border-color: rgba(95, 137, 255, 0.32);
  background: linear-gradient(180deg, rgba(242, 246, 255, 0.96), rgba(235, 242, 255, 0.96));
}

.inbox-history-copy {
  min-width: 0;
  display: grid;
  gap: 6px;
}

.inbox-history-title {
  font-size: 0.98rem;
}

.inbox-history-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  justify-self: end;
  flex-wrap: wrap;
  gap: 8px;
}

.inbox-history-icon-button {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid rgba(210, 220, 236, 0.92);
  background: #ffffff;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.inbox-history-icon-button:hover {
  transform: translateY(-1px);
}

.inbox-history-icon-button svg {
  width: 16px;
  height: 16px;
}

.inbox-history-icon-button.is-active,
.inbox-history-icon-button:hover {
  border-color: rgba(132, 111, 255, 0.28);
  background: rgba(246, 241, 255, 0.96);
  color: var(--accent-strong);
}

.inbox-history-icon-button.is-delete:hover {
  border-color: rgba(211, 76, 76, 0.24);
  background: rgba(255, 240, 240, 0.96);
  color: var(--red);
}

.inbox-history-icon-button.is-mark-read {
  border-color: rgba(31, 184, 127, 0.22);
  background: linear-gradient(180deg, rgba(239, 255, 248, 0.98), rgba(229, 252, 242, 0.96));
  color: #0d9a69;
  box-shadow: 0 12px 28px rgba(31, 184, 127, 0.14);
}

.inbox-history-icon-button.is-mark-read:hover {
  border-color: rgba(18, 160, 109, 0.28);
  background: linear-gradient(180deg, rgba(231, 255, 244, 1), rgba(221, 250, 238, 0.98));
  color: #0a875c;
}

.inbox-history-icon-button.is-mark-unread {
  border-color: rgba(116, 126, 148, 0.24);
  background: linear-gradient(180deg, rgba(249, 251, 253, 0.98), rgba(239, 243, 248, 0.96));
  color: #64748b;
  box-shadow: 0 12px 28px rgba(71, 85, 105, 0.1);
}

.inbox-history-icon-button.is-mark-unread:hover {
  border-color: rgba(100, 116, 139, 0.34);
  background: linear-gradient(180deg, rgba(245, 248, 252, 1), rgba(230, 236, 245, 0.98));
  color: #475569;
}

.inbox-sort-select {
  min-width: 150px;
}

.detail-row,
.key-value-row,
.toggle-row,
.composer-actions {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

.pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.tone-blue {
  background: var(--blue-soft);
  color: var(--blue);
}

.tone-green {
  background: var(--green-soft);
  color: var(--green);
}

.tone-orange {
  background: var(--orange-soft);
  color: #9a6a1f;
}

.tone-red {
  background: var(--red-soft);
  color: var(--red);
}

.tone-purple {
  background: var(--purple-soft);
  color: var(--purple);
}

.tone-black {
  background: #111111;
  color: #ffffff;
}

.tone-muted {
  background: #eef2f6;
  color: var(--muted);
}

.metric-card.system-visual-card {
  background:
    radial-gradient(circle at top left, rgba(166, 124, 255, 0.42), transparent 34%),
    radial-gradient(circle at bottom right, rgba(94, 62, 172, 0.52), transparent 42%),
    linear-gradient(135deg, #111827 0%, #18162d 46%, #352761 100%);
  color: #edf4ff;
}

.metric-card.system-visual-card.tone-green {
  --system-color: #a67cff;
  --system-accent-start: #8f68ff;
  --system-accent-end: #bd6dff;
}

.metric-card.system-visual-card .metric-status-indicator.tone-green {
  background: linear-gradient(135deg, #8f68ff, #bd6dff);
  box-shadow:
    0 0 0 4px rgba(143, 104, 255, 0.18),
    0 0 18px rgba(189, 109, 255, 0.28);
}

.metric-card.system-visual-card.tone-green .system-visual-ring {
  background:
    conic-gradient(var(--system-accent-end) calc(var(--system-percent, 0) * 1%), rgba(143, 154, 179, 0.2) 0);
}

.metric-card.system-visual-card.tone-green .system-visual-fill {
  background: linear-gradient(90deg, var(--system-accent-start), var(--system-accent-end));
  box-shadow: 0 0 18px rgba(189, 109, 255, 0.34);
}

.metric-card.system-visual-card .metric-label {
  color: rgba(210, 220, 236, 0.82);
}

.metric-card.system-visual-card .metric-meta,
.metric-card.system-visual-card .system-visual-bar-head {
  color: rgba(210, 220, 236, 0.78);
}

.metric-card.system-visual-card .metric-value,
.metric-card.system-visual-card .system-visual-bar-head strong {
  color: #f4f8ff;
}

.avatar {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #e8edf6;
  color: #40506a;
  font-weight: 800;
}

.media-source-badge {
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #e8edf6;
  color: #40506a;
  box-shadow: inset 0 0 0 1px rgba(143, 153, 180, 0.2);
}

.media-source-badge.is-compact {
  width: 28px;
  height: 28px;
}

.media-source-badge.is-elevenlabs {
  background: #101318;
  color: #ffffff;
}

.media-source-badge.is-google_studio {
  background: #ffffff;
  color: #4285f4;
}

.media-source-badge.is-user_upload {
  background: #e4fbf6;
  color: #1a9b8d;
}

.media-source-badge.is-generated_album {
  background: #eef2ff;
  color: #5b6ee1;
}

.media-source-logo {
  width: 24px;
  height: 24px;
  display: block;
}

.media-source-badge.is-compact .media-source-logo {
  width: 17px;
  height: 17px;
}

.media-source-badge.is-user_upload .media-source-logo,
.media-source-badge.is-generated_album .media-source-logo {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-source-fallback-letter {
  font-weight: 900;
  font-size: 1rem;
}

.media-owner-avatar {
  width: 56px;
  height: 56px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid rgba(143, 153, 180, 0.24);
  border-radius: 50%;
  background: var(--media-owner-avatar-bg, #eef2ff);
  color: var(--media-owner-avatar-fg, #4f63dc);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.35),
    0 10px 24px rgba(83, 102, 205, 0.12);
  cursor: default;
  overflow: hidden;
  transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

button.media-owner-avatar {
  cursor: pointer;
}

.media-owner-avatar.is-compact {
  width: 28px;
  height: 28px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.32);
}

.media-owner-avatar.has-profile-image {
  background: #e8edf6;
  color: transparent;
}

.media-owner-avatar-image {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: inherit;
  background-image: var(--media-owner-avatar-image);
  background-position: center;
  background-repeat: no-repeat;
  background-size: var(--media-owner-avatar-zoom, 100%);
}

.media-owner-avatar-art {
  display: block;
  width: var(--media-owner-avatar-art-size, 78%);
  height: var(--media-owner-avatar-art-size, 78%);
  overflow: visible;
  pointer-events: none;
}

.media-owner-avatar-art .avatar-art-fill { fill: currentColor; }
.media-owner-avatar-art .avatar-art-soft { fill: rgba(245, 245, 245, 0.42); }
.media-owner-avatar-art .avatar-art-accent { fill: color-mix(in srgb, var(--media-owner-avatar-bg, #a550f4) 42%, #f5f5f5); }
.media-owner-avatar-art .avatar-art-stroke { fill: none; stroke: currentColor; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
.media-owner-avatar-art .avatar-art-wide { stroke-width: 5; }

.media-owner-avatar-initials {
  font-size: 1rem;
  font-weight: 950;
  line-height: 1;
}

.media-owner-avatar:not(.is-compact) .media-owner-avatar-initials {
  font-size: 1.22rem;
}

.media-owner-avatar.is-avatar-small .media-owner-avatar-initials {
  font-size: 0.86rem;
}

.media-owner-avatar.is-avatar-large .media-owner-avatar-initials {
  font-size: 1.34rem;
}

.media-owner-avatar.is-compact .media-owner-avatar-initials {
  font-size: 0.78rem;
}

button.media-owner-avatar:hover,
button.media-owner-avatar:focus-visible {
  border-color: rgba(124, 100, 255, 0.38);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.42),
    0 14px 30px rgba(83, 102, 205, 0.18);
  transform: translateY(-1px) scale(1.03);
}

button.media-owner-avatar:focus-visible {
  outline: 3px solid rgba(124, 100, 255, 0.28);
  outline-offset: 3px;
}

.media-source-row {
  align-items: center;
}

.media-source-snapshot {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  text-align: right;
}

.media-source-snapshot span:last-child {
  min-width: 0;
}

.media-owner-snapshot {
  gap: 10px;
}

.media-owner-snapshot.is-text-only {
  gap: 0;
}

.media-owner-snapshot-copy {
  display: grid;
  justify-items: end;
  gap: 2px;
  min-width: 0;
}

.media-owner-snapshot-copy > span,
.media-owner-snapshot-copy > small {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-owner-snapshot-copy > small {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
}

.media-owner-value-with-action {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.media-owner-value-with-action > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-owner-view-user-button {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid rgba(124, 100, 255, 0.18);
  border-radius: 12px;
  background: rgba(248, 246, 255, 0.94);
  color: #6e4ff5;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.72),
    0 8px 18px rgba(99, 87, 190, 0.1);
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.media-owner-view-user-button svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.15;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.media-owner-view-user-button:hover,
.media-owner-view-user-button:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(124, 100, 255, 0.36);
  background: #ffffff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.84),
    0 12px 24px rgba(99, 87, 190, 0.16);
}

.media-owner-view-user-button:focus-visible {
  outline: 3px solid rgba(124, 100, 255, 0.26);
  outline-offset: 2px;
}

.media-profile-preview-dialog {
  display: grid;
  gap: 18px;
}

.media-profile-preview-stage {
  min-height: min(62vh, 520px);
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 28px);
  border: 1px solid rgba(143, 153, 180, 0.22);
  border-radius: 24px;
  background:
    linear-gradient(135deg, rgba(245, 247, 255, 0.95), rgba(255, 255, 255, 0.98)),
    #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.76);
}

.media-profile-preview-image {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: min(58vh, 480px);
  object-fit: contain;
  border-radius: 22px;
  box-shadow: 0 22px 52px rgba(32, 42, 64, 0.2);
}

.media-owner-avatar.is-preview-large {
  width: min(62vw, 280px);
  height: min(62vw, 280px);
  border-width: 2px;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.42),
    0 22px 52px rgba(83, 102, 205, 0.18);
}

.media-owner-avatar.is-preview-large .media-owner-avatar-initials {
  font-size: clamp(2.4rem, 10vw, 5.6rem);
}

.media-profile-preview-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.media-profile-preview-meta > div {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid rgba(143, 153, 180, 0.18);
  border-radius: 16px;
  background: rgba(248, 250, 255, 0.86);
}

.media-profile-preview-meta strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-profile-preview-pills {
  justify-content: flex-start;
}

.media-image-status-row {
  align-items: center;
}

.media-profile-image-block {
  display: grid;
  gap: 8px;
  width: 100%;
}

.media-profile-image-title {
  display: block;
}

.media-profile-image-file-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 9px;
  min-width: 0;
}

.media-profile-image-filename {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 850;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.media-profile-image-flags {
  justify-content: flex-end;
}

.media-creation-source-row {
  margin-top: 8px;
}

.media-image-status-copy {
  display: grid;
  justify-items: end;
  gap: 3px;
  min-width: 0;
  text-align: right;
}

.media-image-status-pills {
  justify-content: flex-end;
  gap: 6px;
}

.media-image-status-copy > small {
  max-width: 100%;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-shell {
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: auto;
  background: #ffffff;
  box-shadow: var(--shadow);
}

.scroll-region,
.scroll-table-shell {
  min-height: 0;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(76, 125, 240, 0.55) rgba(220, 226, 234, 0.45);
}

.scroll-region {
  overflow: auto;
  padding-right: 8px;
}

.scroll-region::-webkit-scrollbar,
.scroll-table-shell::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

.scroll-region::-webkit-scrollbar-track,
.scroll-table-shell::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(220, 226, 234, 0.45);
}

.scroll-region::-webkit-scrollbar-thumb,
.scroll-table-shell::-webkit-scrollbar-thumb {
  border: 3px solid rgba(220, 226, 234, 0.15);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(76, 125, 240, 0.75), rgba(112, 160, 255, 0.85));
}

.scroll-region.is-dashboard-feed {
  max-height: min(58vh, 640px);
}

.scroll-region.is-audit-log {
  max-height: min(72vh, 980px);
}

.scroll-region.is-users-matches {
  max-height: min(72vh, 960px);
}

.scroll-region.is-storage-roots,
.scroll-region.is-storage-filetypes {
  max-height: min(74vh, 920px);
}

.scroll-region.is-media-collection {
  max-height: min(72vh, 980px);
}

.media-detail-stack.scroll-region.is-media-detail {
  height: var(--media-detail-panel-height, 100%);
  min-height: var(--media-detail-panel-height, 100%);
  max-height: var(--media-detail-panel-height, none);
  box-sizing: border-box;
  align-content: start;
  padding-right: 12px;
  padding-bottom: 22px;
}

.scroll-region.is-settings-canvas {
  min-height: 0;
  max-height: var(--settings-panel-height, calc(100vh - 320px));
  padding-right: 10px;
}

.settings-detail-stack.scroll-region.is-settings-detail {
  height: 100%;
  max-height: 100%;
  min-height: 0;
  box-sizing: border-box;
  align-content: start;
  overflow-y: auto;
  padding-right: 12px;
  padding-bottom: 22px;
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
}

.scroll-table-shell.is-users-directory-table,
.scroll-table-shell.is-memberships-directory-table,
.scroll-table-shell.is-storage-backups-table,
.scroll-table-shell.is-storage-files-table {
  max-height: min(72vh, 980px);
}

.scroll-table-shell.is-users-directory-table.is-visible-row-capped {
  max-height: min(72vh, var(--users-directory-visible-cap, 980px));
  overflow-y: auto;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 1180px;
}

.users-directory-table {
  min-width: 2260px;
  table-layout: fixed;
}

.users-directory-table th {
  position: sticky;
}

.users-directory-table th,
.users-directory-table td {
  overflow: hidden;
}

.users-directory-table .is-numeric {
  font-variant-numeric: tabular-nums;
}

.user-age-cell {
  display: grid;
  gap: 4px;
  align-items: start;
}

.user-age-cell > strong {
  font-variant-numeric: tabular-nums;
}

.user-age-cell > small {
  color: var(--muted);
  font-size: .72rem;
}

.user-age-require-button {
  width: fit-content;
  max-width: 100%;
  padding: 3px 7px;
  border: 1px solid color-mix(in srgb, var(--purple) 38%, transparent);
  border-radius: 999px;
  color: var(--purple);
  background: color-mix(in srgb, var(--purple) 8%, var(--panel));
  font-size: .66rem;
  font-weight: 850;
  line-height: 1.2;
  cursor: pointer;
}

.user-age-require-button:hover,
.user-age-require-button:focus-visible {
  border-color: var(--purple);
  outline: none;
  background: color-mix(in srgb, var(--purple) 15%, var(--panel));
}

.users-directory-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 2px 2px;
}

.users-page-size-control {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-weight: 800;
}

.users-page-size-control .admin-select {
  min-width: 96px;
  min-height: 42px;
}

.users-pagination-status {
  color: var(--muted);
  font-weight: 700;
}

.users-pagination-buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.users-pagination-button {
  min-width: 38px;
  min-height: 38px;
  border: 1px solid rgba(210, 220, 236, 0.92);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--muted);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.users-pagination-button:hover {
  transform: translateY(-1px);
  border-color: rgba(132, 111, 255, 0.32);
  box-shadow: 0 14px 30px rgba(40, 55, 86, 0.08);
}

.users-pagination-button.is-active {
  border-color: rgba(132, 111, 255, 0.42);
  background: linear-gradient(180deg, rgba(232, 224, 255, 0.98), rgba(221, 232, 255, 0.96));
  color: var(--accent-strong);
}

.users-pagination-button[disabled] {
  opacity: 0.42;
  cursor: default;
  transform: none;
  box-shadow: none;
}

.data-table th,
.data-table td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.data-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f9fafc;
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.resizable-column-label {
  display: block;
  padding-right: 18px;
}

.users-directory-sort-button {
  width: 100%;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  padding: 0;
  text-align: left;
  text-transform: inherit;
  cursor: pointer;
}

.users-directory-sort-button.resizable-column-label {
  display: inline-flex;
  align-items: flex-start;
  gap: 7px;
  min-width: 0;
  margin: 0;
  padding: 0 18px 0 0;
}

.users-directory-sort-button:hover,
.users-directory-sort-button:focus-visible {
  color: var(--accent-strong);
}

.users-directory-sort-button:focus-visible {
  outline: 2px solid rgba(132, 111, 255, 0.24);
  outline-offset: 3px;
  border-radius: 8px;
}

.users-directory-sort-label {
  min-width: 0;
}

.users-directory-sort-indicator {
  flex: 0 0 auto;
  margin-top: 1px;
  color: rgba(132, 111, 255, 0.48);
  font-size: 0.72rem;
  line-height: 1.2;
}

.users-directory-sort-button.is-active .users-directory-sort-indicator,
.users-directory-sort-button:hover .users-directory-sort-indicator,
.users-directory-sort-button:focus-visible .users-directory-sort-indicator {
  color: var(--accent-strong);
}

.table-column-resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  width: 10px;
  height: 100%;
  cursor: col-resize;
  touch-action: none;
}

.table-column-resize-handle::after {
  content: "";
  position: absolute;
  top: 16px;
  right: 0;
  bottom: 16px;
  width: 1px;
  border-radius: 999px;
  background: rgba(132, 111, 255, 0.28);
  box-shadow: none;
  transition: background 0.18s ease, transform 0.18s ease;
}

.table-column-resize-handle:hover::after,
.table-column-resize-handle:focus-visible::after,
body.is-user-column-resizing .table-column-resize-handle::after {
  background: rgba(132, 111, 255, 0.7);
  transform: scaleY(1.08);
}

.data-table tbody tr:hover {
  background: rgba(75, 125, 240, 0.05);
}

.table-row {
  cursor: pointer;
}

.conversation-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: calc(100vh - 220px);
  height: calc(100vh - 220px);
  overflow: hidden;
  border: 1px solid rgba(141, 155, 184, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at top left, rgba(76, 125, 240, 0.1), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(246, 248, 252, 0.92));
}

.conversation-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
  padding: 18px 20px 16px;
  border-bottom: 1px solid var(--line);
}

.conversation-stream {
  display: grid;
  gap: 18px;
  align-content: start;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 20px;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(76, 125, 240, 0.55) rgba(220, 226, 234, 0.45);
}

.conversation-stream::-webkit-scrollbar {
  width: 12px;
}

.conversation-stream::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(220, 226, 234, 0.45);
}

.conversation-stream::-webkit-scrollbar-thumb {
  border: 3px solid rgba(220, 226, 234, 0.15);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(76, 125, 240, 0.75), rgba(112, 160, 255, 0.85));
}

.inbox-conversation-history-controls {
  position: sticky;
  top: 0;
  z-index: 5;
  justify-self: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 100%;
  padding: 3px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  box-shadow: 0 12px 28px rgba(38, 54, 78, 0.12), inset 0 0 0 1px rgba(141, 155, 184, 0.14);
  backdrop-filter: blur(12px);
}

.inbox-conversation-previous-toggle,
.inbox-conversation-history-jump,
.inbox-conversation-latest-jump {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 34px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  white-space: nowrap;
}

.inbox-conversation-previous-toggle,
.inbox-conversation-latest-jump {
  background: #ffffff;
  color: #243047;
  box-shadow: inset 0 0 0 1px rgba(141, 155, 184, 0.18);
}

.inbox-conversation-history-jump {
  background: rgba(132, 92, 246, 0.14);
  color: #5132b5;
  box-shadow: inset 0 0 0 1px rgba(132, 92, 246, 0.22);
}

.inbox-conversation-previous-toggle:hover,
.inbox-conversation-previous-toggle:focus-visible,
.inbox-conversation-history-jump:hover,
.inbox-conversation-history-jump:focus-visible,
.inbox-conversation-latest-jump:hover,
.inbox-conversation-latest-jump:focus-visible {
  outline: none;
  background: #8a5cf6;
  color: #ffffff;
  box-shadow: 0 12px 26px rgba(132, 92, 246, 0.22);
}

.inbox-conversation-history-arrow {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  border-radius: 1px;
}

.inbox-conversation-history-arrow.is-up {
  transform: rotate(225deg) translate(-1px, -1px);
}

.inbox-conversation-history-arrow.is-down {
  transform: rotate(45deg) translate(-1px, -1px);
}

.inbox-conversation-latest-jump-shell {
  position: sticky;
  bottom: 12px;
  z-index: 5;
  justify-self: center;
  display: flex;
  justify-content: center;
  max-width: 100%;
  margin-top: -2px;
  pointer-events: none;
}

.inbox-conversation-latest-jump {
  min-height: 38px;
  padding: 0 18px;
  border: 3px solid rgba(255, 255, 255, 0.92);
  box-shadow: 0 12px 30px rgba(38, 54, 78, 0.16), inset 0 0 0 1px rgba(141, 155, 184, 0.16);
  pointer-events: auto;
}

.message-row {
  display: grid;
  gap: 9px;
  justify-items: start;
}

.message-row.is-admin {
  justify-items: end;
}

.message-shell {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: min(880px, 100%);
}

.message-row.is-admin .message-shell {
  flex-direction: row-reverse;
}

.message-stack {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.message-label {
  max-width: min(760px, 100%);
  padding: 0 54px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.message-bubble {
  max-width: min(760px, 100%);
  padding: 18px 20px;
  border: 1px solid rgba(141, 155, 184, 0.2);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 252, 0.96)),
    #f2f4f8;
  color: #182235;
  line-height: 1.6;
  box-shadow: 0 16px 36px rgba(38, 54, 78, 0.1);
}

.message-bubble.is-typing {
  display: inline-flex;
  align-items: center;
  min-width: 76px;
  padding: 15px 18px;
}

.message-typing-dots {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.message-typing-dots span {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0.42;
  animation: messageTypingDotPulse 1.1s infinite ease-in-out;
}

.message-typing-dots span:nth-child(2) {
  animation-delay: 0.16s;
}

.message-typing-dots span:nth-child(3) {
  animation-delay: 0.32s;
}

@keyframes messageTypingDotPulse {
  0%,
  80%,
  100% {
    opacity: 0.32;
    transform: translateY(0);
  }

  40% {
    opacity: 1;
    transform: translateY(-3px);
  }
}

.message-row.is-admin .message-bubble {
  border-color: rgba(94, 128, 255, 0.36);
  background:
    linear-gradient(135deg, rgba(75, 125, 240, 0.98), rgba(92, 147, 255, 0.98)),
    #4b7df0;
  color: #ffffff;
  box-shadow: 0 18px 42px rgba(47, 102, 255, 0.2);
}

.message-row.is-ai .message-bubble {
  background:
    linear-gradient(180deg, rgba(255, 237, 248, 0.98), rgba(255, 229, 245, 0.98)),
    #ffe5f5;
  border: 1px dashed rgba(233, 156, 210, 0.7);
  color: #1f2430;
}

.message-row.is-system {
  justify-items: center;
}

.message-row.is-system .message-bubble {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(239, 243, 249, 0.94)),
    #f7f8fb;
  border: 1px dashed var(--line-strong);
}

.message-row.is-ai .message-label {
  color: #b06d95;
}

.message-avatar {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  overflow: hidden;
  font-weight: 900;
  font-size: 1rem;
  letter-spacing: 0.01em;
  border: 1px solid rgba(141, 155, 184, 0.18);
  background: #e9eef7;
  color: #344056;
  box-shadow: 0 10px 24px rgba(38, 54, 78, 0.08);
}

.message-avatar.has-profile-image {
  background: #101827;
}

.message-avatar.has-profile-avatar {
  background: var(--message-avatar-bg, #a550f4);
  color: var(--message-avatar-fg, #ffffff);
}

.message-avatar.has-profile-ring {
  border-color: var(--message-avatar-ring, rgba(141, 155, 184, 0.18));
}

.message-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(var(--message-avatar-image-scale, 1));
  transform-origin: center;
}

.message-avatar.is-user {
  background: linear-gradient(135deg, #dfe8fb, #eef2fb);
  color: #42506c;
}

.message-avatar.is-admin {
  background: linear-gradient(135deg, #4b7df0, #5d93ff);
  color: #ffffff;
}

.message-avatar.is-ai {
  background: linear-gradient(135deg, #ffd5ef, #ffc0e3);
  color: #1f2430;
}

.message-avatar.is-system {
  background: linear-gradient(135deg, #edf1f7, #e2e8f2);
  color: #55627d;
}

.message-avatar.has-profile-image,
.message-avatar.is-user.has-profile-image {
  background: #101827;
}

.message-avatar.has-profile-avatar,
.message-avatar.is-user.has-profile-avatar {
  background: var(--message-avatar-bg, #a550f4);
  color: var(--message-avatar-fg, #ffffff);
}

.message-avatar.has-profile-ring,
.message-avatar.is-user.has-profile-ring {
  border-color: var(--message-avatar-ring, rgba(141, 155, 184, 0.18));
}

.message-actions {
  display: grid;
  gap: 8px;
  align-content: start;
}

.message-action-button {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  background: linear-gradient(135deg, #2f66ff, #63a3ff);
  color: #ffffff;
  text-decoration: none;
  font-weight: 800;
  box-shadow: 0 12px 24px rgba(47, 102, 255, 0.18);
}

.message-action-button.is-secondary {
  background: #ffffff;
  color: var(--text);
  border: 1px solid var(--line-strong);
  box-shadow: none;
}

.message-action-note {
  margin: 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.rich-message-bubble {
  display: grid;
  gap: 10px;
}

.rich-message-bubble h3 {
  margin: 0;
  color: inherit;
  font-size: 1.06rem;
  line-height: 1.25;
}

.rich-message-kicker {
  width: fit-content;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(75, 125, 240, 0.12);
  color: #335fd0;
  font-size: 0.72rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.message-row.is-admin .rich-message-kicker {
  background: rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.88);
}

.rich-message-content {
  display: grid;
  gap: 10px;
  color: inherit;
}

.rich-message-content p,
.rich-message-content ul {
  margin: 0;
}

.rich-message-content ul {
  display: grid;
  gap: 7px;
  padding-left: 1.2rem;
}

.rich-message-content a {
  color: inherit;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.message-row:not(.is-admin) .rich-message-content a {
  color: #315ed8;
}

.message-attachment-card {
  display: grid;
  gap: 12px;
  width: min(520px, 100%);
  padding: 14px;
  border: 1px solid var(--line-strong);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 14px 30px rgba(58, 70, 94, 0.08);
}

.message-attachment-card.is-unavailable {
  background: rgba(243, 245, 249, 0.86);
  border-style: dashed;
}

.message-attachment-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.message-attachment-title {
  color: var(--text);
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.message-attachment-meta {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.4;
}

.message-attachment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.composer {
  display: grid;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.admin-textarea {
  min-height: 132px;
  padding: 14px 16px;
  resize: vertical;
}

.admin-text-input {
  min-height: 46px;
  padding: 0 14px;
}

.admin-select {
  min-height: 46px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text);
}

.assistant-shell {
  min-height: calc(100vh - 220px);
}

.assistant-composer textarea {
  min-height: 112px;
}

.assistant-message-input {
  min-height: 164px;
}

.assistant-note-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.assistant-note-item {
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.56);
  color: #8f4d77;
  font-size: 0.9rem;
  line-height: 1.5;
}

.admin-app.is-assistant-studio .admin-workspace {
  background: #070c14;
}

.admin-app.is-assistant-studio .admin-header {
  display: none;
}

.admin-panels.is-assistant-layout {
  display: block;
  padding: 0;
  background: #070c14;
  overflow: auto;
}

.admin-panels.is-assistant-layout .admin-panel-explorer {
  min-height: 100%;
  overflow: visible;
  background: transparent;
}

.admin-panels.is-assistant-layout .admin-panel-canvas,
.admin-panels.is-assistant-layout .admin-panel-detail {
  display: none;
}

.assistant-studio-shell {
  --studio-bg: #070c14;
  --studio-panel: rgba(18, 27, 42, 0.84);
  --studio-panel-strong: rgba(22, 32, 49, 0.94);
  --studio-line: rgba(194, 210, 238, 0.16);
  --studio-line-strong: rgba(143, 105, 255, 0.42);
  --studio-text: #f3f7ff;
  --studio-muted: #aab5ca;
  --studio-soft: #75829a;
  --studio-violet: #7a4cff;
  --studio-violet-2: #9a6cff;
  --studio-blue: #4d78ff;
  min-height: 100%;
  color: var(--studio-text);
  background:
    radial-gradient(circle at 76% 0%, rgba(116, 76, 255, 0.24), transparent 32%),
    radial-gradient(circle at 52% 86%, rgba(57, 137, 255, 0.08), transparent 36%),
    linear-gradient(135deg, #070c14 0%, #0d1421 56%, #070c14 100%);
}

.assistant-studio-topbar {
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 18px 28px;
  border-bottom: 1px solid rgba(188, 202, 227, 0.13);
  background: rgba(7, 12, 20, 0.84);
}

.assistant-studio-breadcrumb {
  margin-bottom: 8px;
  color: #94a4bd;
  font-size: 0.86rem;
  font-weight: 850;
}

.assistant-studio-breadcrumb strong,
.assistant-studio-topbar h2,
.assistant-studio-title-row h3,
.assistant-studio-card h3,
.assistant-studio-preview h3,
.assistant-campaign-preview-card h3,
.assistant-campaign-preview-card h4 {
  color: var(--studio-text);
}

.assistant-studio-topbar h2 {
  margin: 0;
  font-size: clamp(1.75rem, 2.6vw, 2.35rem);
  line-height: 1.05;
}

.assistant-studio-topbar p,
.assistant-studio-title-row p,
.assistant-studio-card p,
.assistant-studio-card-head p,
.assistant-campaign-preview-card p {
  margin: 6px 0 0;
  color: var(--studio-muted);
  line-height: 1.45;
}

.assistant-studio-actions,
.assistant-studio-card-head,
.assistant-studio-card-foot,
.assistant-studio-preview-head,
.assistant-studio-preview-head > div,
.assistant-template-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.assistant-studio-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.assistant-studio-save-state {
  color: #b8c4d8;
  font-size: 0.88rem;
  font-weight: 900;
  white-space: nowrap;
}

.assistant-studio-save-state::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 8px;
  border-radius: 999px;
  background: #35d59a;
  box-shadow: 0 0 0 6px rgba(53, 213, 154, 0.12);
}

.assistant-studio-button {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  border: 1px solid rgba(194, 207, 232, 0.16);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.055);
  color: #edf3ff;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 900;
  text-decoration: none;
  cursor: pointer;
}

.assistant-studio-button.is-primary,
.assistant-studio-ai-card .assistant-studio-button.is-primary {
  color: #ffffff;
  background: linear-gradient(135deg, #7a4cff, #526dff);
  border-color: rgba(157, 126, 255, 0.72);
  box-shadow: 0 18px 34px rgba(113, 77, 255, 0.22);
}

.assistant-studio-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  box-shadow: none;
}

.assistant-studio-layout {
  min-height: calc(100vh - 88px);
  display: grid;
  grid-template-columns: minmax(700px, 1fr) minmax(460px, 650px);
  gap: 28px;
  padding: 28px;
}

.assistant-studio-builder {
  min-width: 0;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 18px;
}

.assistant-studio-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.assistant-studio-title-row h3 {
  margin: 0;
  font-size: clamp(1.5rem, 2.4vw, 2.1rem);
  line-height: 1.08;
}

.assistant-studio-icon-button {
  width: 52px;
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(195, 208, 233, 0.15);
  background: rgba(255, 255, 255, 0.052);
  color: #dfe8fa;
  font-size: 1.25rem;
  font-weight: 950;
}

.assistant-studio-steps {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid var(--studio-line);
}

.assistant-studio-steps span,
.assistant-studio-step-button {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 0;
  background: transparent;
  color: #aeb8ca;
  font-family: inherit;
  font-size: 0.88rem;
  font-weight: 900;
  white-space: nowrap;
  cursor: pointer;
}

.assistant-studio-steps b,
.assistant-studio-step-button b {
  position: relative;
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid rgba(191, 207, 235, 0.22);
  color: #b9c3d5;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

.assistant-studio-steps b::after,
.assistant-studio-step-button b::after {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 999px;
  border: 1px solid rgba(139, 85, 255, 0.48);
  opacity: 0;
  transform: scale(0.88);
  transition: opacity 220ms ease, transform 220ms ease, border-color 220ms ease;
}

.assistant-studio-steps .is-active {
  color: #ffffff;
}

.assistant-studio-steps .is-active b,
.assistant-studio-step-button.is-active b {
  border-color: transparent;
  color: #ffffff;
  background: linear-gradient(135deg, #8b55ff, #5f6eff);
}

.assistant-studio-step-button.is-active b::after {
  opacity: 1;
  transform: scale(1);
  animation: assistantStepHalo 1800ms ease-in-out infinite;
}

.assistant-studio-step-button.is-complete {
  color: #d9e7ff;
}

.assistant-studio-step-button.is-complete b {
  border-color: rgba(126, 231, 219, 0.42);
  color: #7ee7db;
  background: rgba(126, 231, 219, 0.08);
  box-shadow: inset 0 0 0 1px rgba(126, 231, 219, 0.1);
}

.assistant-studio-step-button.is-complete b::after {
  opacity: 0.88;
  transform: scale(1);
  border-color: rgba(126, 231, 219, 0.42);
}

.assistant-studio-step-button.is-final-active {
  color: #eafff2;
}

.assistant-studio-step-button.is-final-active b {
  border-color: transparent;
  color: #03130a;
  background: linear-gradient(135deg, #63ef9b, #15b86b);
  box-shadow: 0 0 0 7px rgba(21, 184, 107, 0.12), 0 16px 34px rgba(21, 184, 107, 0.28);
}

.assistant-studio-step-button.is-final-active b::after {
  border-color: rgba(99, 239, 155, 0.72);
  animation: assistantStepFinalHalo 1700ms ease-in-out infinite;
}

.assistant-studio-step-button:focus-visible {
  outline: 3px solid rgba(139, 85, 255, 0.35);
  outline-offset: 4px;
}

.assistant-studio-steps i {
  position: relative;
  overflow: hidden;
  height: 4px;
  min-width: 16px;
  flex: 1 1 auto;
  background: rgba(186, 201, 225, 0.24);
  border-radius: 999px;
  box-shadow: inset 0 0 0 1px rgba(186, 201, 225, 0.08);
}

.assistant-studio-steps i::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, #8b55ff, #6b7bff 48%, #7ee7db);
  box-shadow: 0 0 20px rgba(126, 231, 219, 0.42);
}

.assistant-studio-steps i.is-next::after {
  width: 38%;
  opacity: 0.82;
  animation: assistantStepLinePreview 1800ms ease-in-out infinite;
}

.assistant-studio-steps i.is-complete::after {
  width: 100%;
  animation: assistantStepLineFill 520ms cubic-bezier(0.2, 0.78, 0.24, 1);
}

.assistant-studio-step-button.is-final-active ~ i::after,
.assistant-studio-steps i.is-complete:last-of-type::after {
  background: linear-gradient(90deg, #8b55ff, #7ee7db 54%, #15b86b);
}

@keyframes assistantStepLineFill {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}

@keyframes assistantStepLinePreview {
  0%, 100% {
    opacity: 0.45;
    width: 28%;
  }
  50% {
    opacity: 0.95;
    width: 48%;
  }
}

@keyframes assistantStepHalo {
  0%, 100% {
    opacity: 0.65;
    transform: scale(0.96);
  }
  50% {
    opacity: 1;
    transform: scale(1.08);
  }
}

@keyframes assistantStepFinalHalo {
  0%, 100% {
    opacity: 0.72;
    transform: scale(0.98);
  }
  50% {
    opacity: 1;
    transform: scale(1.12);
  }
}

@media (prefers-reduced-motion: reduce) {
  .assistant-studio-step-button.is-active b::after,
  .assistant-studio-step-button.is-final-active b::after,
  .assistant-studio-steps i.is-next::after,
  .assistant-studio-steps i.is-complete::after {
    animation: none;
  }
}

.assistant-studio-main-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.assistant-studio-stack {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.assistant-studio-hidden-form {
  display: none;
}

.assistant-studio-step-stack {
  min-height: 0;
}

.assistant-studio-card,
.assistant-studio-ai-card {
  border: 1px solid var(--studio-line);
  border-radius: 18px;
  background:
    radial-gradient(circle at 92% 0%, rgba(116, 76, 255, 0.14), transparent 32%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.028));
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.18);
}

.assistant-studio-card {
  padding: 22px;
}

.assistant-studio-card-head {
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
}

.assistant-studio-card h3 {
  margin: 0;
  font-size: 1.2rem;
  line-height: 1.15;
}

.assistant-studio-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.assistant-studio-form-grid label,
.assistant-studio-ai-card label {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.assistant-studio-form-grid label > span:first-child {
  color: #b9c3d5;
  font-size: 0.78rem;
  font-weight: 900;
}

.assistant-studio-form-grid .is-full {
  grid-column: 1 / -1;
}

.assistant-studio-phase-summary {
  min-height: 118px;
  display: grid;
  align-content: center;
  gap: 8px;
  padding: 16px;
  border: 1px solid rgba(191, 207, 235, 0.16);
  border-radius: 14px;
  background: rgba(8, 14, 24, 0.44);
}

.assistant-studio-phase-summary span,
.assistant-studio-review-grid span,
.assistant-studio-step-actions > span {
  color: #aebbd1;
  font-size: 0.82rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.assistant-studio-phase-summary strong {
  color: #ffffff;
  font-size: 2.1rem;
  line-height: 1;
}

.assistant-studio-phase-summary p {
  margin: 0;
  color: #b7c4d8;
  font-size: 0.94rem;
  font-weight: 760;
  line-height: 1.4;
}

.assistant-studio-step-actions {
  order: 9;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-top: 2px;
}

.assistant-studio-step-actions > div {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.assistant-studio-review-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.assistant-studio-review-grid > div,
.assistant-studio-review-grid > button {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 14px;
  border: 1px solid rgba(191, 207, 235, 0.16);
  border-radius: 14px;
  background: rgba(8, 14, 24, 0.44);
}

.assistant-studio-review-grid > button {
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: transform 150ms ease, border-color 150ms ease, background 150ms ease;
}

.assistant-studio-review-grid > button:hover,
.assistant-studio-review-grid > button:focus-visible {
  outline: none;
  transform: translateY(-1px);
  border-color: rgba(122, 255, 184, 0.44);
  background: rgba(80, 232, 141, 0.08);
}

.assistant-studio-review-grid > button:disabled {
  cursor: default;
  opacity: 0.72;
  transform: none;
}

.assistant-studio-review-grid > button.is-cleared {
  border-color: rgba(80, 232, 141, 0.26);
}

.assistant-studio-review-grid strong {
  color: #eef4ff;
}

.assistant-studio-input,
.assistant-studio-textarea,
.assistant-studio-prompt {
  width: 100%;
  border: 1px solid rgba(191, 207, 235, 0.2);
  border-radius: 10px;
  background: rgba(8, 14, 24, 0.72);
  color: #e9efff;
  font: inherit;
  font-weight: 780;
}

.assistant-studio-input {
  min-height: 48px;
  padding: 0 14px;
}

.assistant-studio-textarea {
  min-height: 104px;
  padding: 14px;
  resize: vertical;
}

.assistant-studio-prompt {
  min-height: 88px;
  margin-top: 12px;
  padding: 12px;
  resize: vertical;
}

.assistant-studio-input:disabled,
.assistant-studio-textarea:disabled,
.assistant-studio-prompt:disabled {
  opacity: 0.58;
}

.assistant-studio-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.assistant-studio-chip {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 13px;
  border-radius: 999px;
  border: 1px solid rgba(185, 201, 232, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: #b9c4d8;
  font-family: inherit;
  font-size: 0.82rem;
  font-weight: 900;
  cursor: pointer;
}

.assistant-studio-chip.is-active {
  color: #ffffff;
  border-color: rgba(158, 126, 255, 0.72);
  background: linear-gradient(135deg, rgba(122, 76, 255, 0.64), rgba(122, 76, 255, 0.22));
}

.assistant-template-grid,
.assistant-studio-draft-list {
  display: grid;
  gap: 10px;
}

.assistant-template-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.assistant-template-card,
.assistant-studio-draft-card {
  position: relative;
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 6px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid rgba(190, 204, 230, 0.14);
  background: rgba(6, 11, 19, 0.42);
  color: #dce5f7;
  text-align: left;
  font: inherit;
}

.assistant-template-select,
.assistant-studio-draft-select {
  min-width: 0;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.assistant-template-select {
  display: grid;
  gap: 6px;
  padding-right: 42px;
}

.assistant-studio-draft-select {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.assistant-template-select:focus-visible,
.assistant-studio-draft-select:focus-visible {
  outline: 2px solid rgba(126, 231, 219, 0.72);
  outline-offset: 4px;
  border-radius: 10px;
}

.assistant-template-delete,
.assistant-studio-draft-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 112, 112, 0.44);
  background: rgba(80, 20, 28, 0.72);
  color: #ffd6d6;
  font-family: inherit;
  font-weight: 950;
  line-height: 1;
  cursor: pointer;
  transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.assistant-template-delete:hover,
.assistant-template-delete:focus-visible,
.assistant-studio-draft-delete:hover,
.assistant-studio-draft-delete:focus-visible {
  outline: none;
  border-color: rgba(255, 128, 128, 0.82);
  background: rgba(185, 39, 55, 0.9);
  color: #ffffff;
  transform: translateY(-1px);
}

.assistant-template-delete {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
}

.assistant-studio-draft-delete {
  width: 34px;
  height: 34px;
  border-radius: 999px;
}

.assistant-template-card.is-active,
.assistant-studio-draft-card.is-active {
  border-color: rgba(150, 113, 255, 0.58);
  background: rgba(122, 76, 255, 0.18);
}

.assistant-template-card strong,
.assistant-studio-draft-card strong {
  color: #ffffff;
  font-weight: 950;
}

.assistant-template-card span,
.assistant-template-card small,
.assistant-studio-draft-card span,
.assistant-studio-draft-card small {
  color: #9ca9bd;
  line-height: 1.4;
  font-weight: 760;
}

.assistant-template-actions {
  margin-top: 14px;
  flex-wrap: wrap;
}

.assistant-studio-draft-card {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.assistant-studio-track-list {
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(193, 207, 233, 0.12);
  background: rgba(6, 11, 19, 0.36);
}

.assistant-studio-track,
.assistant-preview-track {
  min-width: 0;
  display: grid;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid rgba(184, 198, 222, 0.1);
}

.assistant-studio-track {
  min-height: 82px;
  grid-template-columns: 18px 58px 44px minmax(110px, 1fr) 78px minmax(118px, 180px) 28px;
  padding: 0 14px;
}

.assistant-preview-track {
  min-height: 68px;
  grid-template-columns: 52px 42px minmax(110px, 1fr) minmax(120px, 170px) 28px;
  padding: 0;
}

.assistant-studio-track:last-child,
.assistant-preview-track:last-child {
  border-bottom: 0;
}

.assistant-track-drag,
.assistant-track-menu,
.assistant-track-duration {
  color: #8d9ab0;
  font-size: 0.78rem;
  font-weight: 900;
}

.assistant-track-cover {
  width: 58px;
  height: 58px;
  border-radius: 9px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  background:
    radial-gradient(circle at 74% 24%, rgba(255, 210, 108, 0.92), transparent 13%),
    linear-gradient(145deg, rgba(235, 75, 153, 0.82), rgba(65, 94, 219, 0.78) 46%, rgba(10, 21, 39, 0.96));
  box-shadow: inset 0 -18px 24px rgba(0, 0, 0, 0.22);
}

.assistant-track-cover.has-image {
  overflow: hidden;
  background: #0c1423;
}

.assistant-track-cover img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.assistant-preview-track .assistant-track-cover {
  width: 52px;
  height: 52px;
}

.assistant-track-cover.is-two {
  background:
    radial-gradient(circle at 28% 24%, rgba(255, 248, 192, 0.86), transparent 12%),
    linear-gradient(160deg, #79d4f2, #2d3752 58%, #121823);
}

.assistant-track-cover.is-three {
  background:
    radial-gradient(circle at 62% 34%, rgba(255, 230, 162, 0.72), transparent 15%),
    linear-gradient(150deg, #c99a62, #54667c 46%, #171b23);
}

.assistant-track-cover.is-four {
  background:
    radial-gradient(circle at 38% 26%, rgba(255, 207, 118, 0.88), transparent 14%),
    linear-gradient(150deg, #df5f91, #7548d8 48%, #11182a);
}

.assistant-track-play {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid rgba(180, 197, 230, 0.28);
  background: rgba(255, 255, 255, 0.04);
  color: #ffffff;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 950;
  line-height: 0;
  cursor: pointer;
}

.assistant-play-icon {
  display: block;
  width: 18px;
  height: 18px;
  fill: currentColor;
  pointer-events: none;
  transform: translateX(1px);
}

.assistant-play-icon.is-pause {
  transform: none;
}

.assistant-track-play.is-active {
  border-color: transparent;
  background: linear-gradient(135deg, #7a4cff, #9a6cff);
}

.assistant-track-play:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.assistant-track-duration {
  display: grid;
  gap: 2px;
}

.assistant-track-duration small {
  color: #65738a;
  font-size: 0.7rem;
}

.assistant-track-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.assistant-track-copy strong {
  color: #ffffff;
  font-size: 0.9rem;
  line-height: 1.15;
}

.assistant-track-copy span {
  color: #98a5ba;
  font-size: 0.78rem;
  font-weight: 760;
}

.assistant-studio-wave {
  --assistant-wave-progress: 0;
  --assistant-wave-progress-percent: 0%;
  height: 38px;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  justify-content: center;
  padding: 0 6px;
  border: 1px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(90deg, rgba(255, 91, 196, 0.1), rgba(124, 89, 255, 0.14), rgba(48, 214, 255, 0.08)),
    linear-gradient(90deg, rgba(124, 89, 255, 0.14) var(--assistant-wave-progress-percent), transparent 0);
  color: inherit;
  cursor: pointer;
  touch-action: none;
  appearance: none;
  -webkit-appearance: none;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.assistant-studio-wave-bar {
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff70d8 0%, #8958ff 54%, #38d7ff 100%);
  transform-origin: 50% 50%;
  transition: background 160ms ease, opacity 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.assistant-studio-wave-bar.is-dim {
  background: linear-gradient(180deg, #6d778a, #3f4a5e);
  opacity: 0.72;
}

.assistant-studio-wave.is-live .assistant-studio-wave-bar {
  background: linear-gradient(180deg, #626d80, #323c4d);
  opacity: 0.62;
}

.assistant-studio-wave-bar.is-filled,
.assistant-studio-wave.is-live .assistant-studio-wave-bar.is-filled {
  background: linear-gradient(180deg, #ff72d7 0%, #8d57ff 48%, #37d9ff 100%);
  opacity: 1;
  box-shadow: 0 0 16px rgba(132, 87, 255, 0.5), 0 0 28px rgba(58, 215, 255, 0.18);
}

.assistant-studio-wave:hover,
.assistant-studio-wave.is-seeking {
  border-color: rgba(125, 92, 255, 0.42);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), 0 12px 28px rgba(70, 56, 160, 0.22);
}

.assistant-studio-wave:focus-visible {
  outline: 3px solid rgba(101, 117, 255, 0.34);
  outline-offset: 3px;
}

.assistant-studio-wave.is-live .assistant-studio-wave-bar.is-filled {
  animation: assistantWaveVibe 720ms ease-in-out infinite;
  animation-delay: calc(var(--assistant-wave-index, 0) * -46ms);
}

.assistant-studio-wave.is-live .assistant-studio-wave-bar:not(.is-filled) {
  animation: assistantWaveRest 1100ms ease-in-out infinite;
  animation-delay: calc(var(--assistant-wave-index, 0) * -34ms);
}

@keyframes assistantWaveVibe {
  0%, 100% {
    transform: scaleY(0.72);
  }
  45% {
    transform: scaleY(1.18);
  }
  70% {
    transform: scaleY(0.9);
  }
}

@keyframes assistantWaveRest {
  0%, 100% {
    transform: scaleY(0.92);
  }
  50% {
    transform: scaleY(1.05);
  }
}

.assistant-studio-card-foot {
  justify-content: space-between;
  margin-top: 14px;
  color: #a5b0c4;
  font-size: 0.86rem;
  font-weight: 850;
}

.assistant-demo-picker {
  margin-top: 14px;
  padding: 14px;
  border: 1px solid rgba(193, 207, 233, 0.14);
  border-radius: 16px;
  background: rgba(6, 11, 19, 0.46);
}

.assistant-demo-picker-head,
.assistant-demo-option {
  display: grid;
  align-items: center;
  gap: 12px;
}

.assistant-demo-picker-head {
  grid-template-columns: minmax(0, 1fr) auto;
  margin-bottom: 12px;
}

.assistant-demo-picker-head strong {
  display: block;
  color: #ffffff;
  font-size: 1rem;
}

.assistant-demo-picker-head span,
.assistant-demo-popularity,
.assistant-demo-empty {
  color: #99a7bd;
  font-size: 0.82rem;
  font-weight: 760;
}

.assistant-demo-picker-list {
  max-height: 420px;
  overflow: auto;
  display: grid;
  gap: 8px;
  padding-right: 4px;
}

.assistant-demo-option {
  grid-template-columns: 48px 38px minmax(0, 1fr) auto auto;
  padding: 10px;
  border: 1px solid rgba(192, 207, 235, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
}

.assistant-demo-option.is-selected {
  border-color: rgba(139, 92, 255, 0.38);
  background: rgba(122, 76, 255, 0.12);
}

.assistant-demo-option .assistant-track-cover {
  width: 48px;
  height: 48px;
  border-radius: 10px;
}

.assistant-demo-option .assistant-track-play {
  width: 38px;
  height: 38px;
}

.assistant-studio-shell.is-simple .assistant-demo-option .assistant-track-cover {
  width: 52px;
  height: 52px;
  border-radius: 11px;
}

.assistant-studio-shell.is-simple .assistant-demo-option .assistant-track-play {
  width: 42px;
  height: 42px;
}

.assistant-demo-option .assistant-studio-button {
  min-height: 38px;
  padding: 0 14px;
  border-radius: 12px;
  font-size: 0.82rem;
}

.assistant-demo-empty {
  padding: 18px;
  text-align: center;
}

.assistant-studio-ai-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  border-color: rgba(128, 83, 255, 0.4);
  background:
    radial-gradient(circle at 85% 24%, rgba(112, 73, 255, 0.34), transparent 42%),
    linear-gradient(135deg, rgba(122, 76, 255, 0.24), rgba(255, 255, 255, 0.035));
}

.assistant-studio-spark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: rgba(122, 76, 255, 0.13);
  color: #c9b5ff;
  font-size: 1.35rem;
  font-weight: 950;
}

.assistant-studio-ai-card strong {
  display: block;
  color: #ffffff;
  font-size: 1rem;
  margin-bottom: 5px;
}

.assistant-studio-ai-card span {
  color: #aeb8cd;
  font-size: 0.84rem;
  font-weight: 730;
}

.assistant-studio-note-list {
  display: grid;
  gap: 10px;
}

.assistant-safety-clearance {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255, 203, 90, 0.28);
  background: rgba(255, 203, 90, 0.08);
}

.assistant-safety-clearance strong,
.assistant-safety-clearance span {
  color: #ffe4a8;
  font-size: 0.86rem;
  font-weight: 900;
}

.assistant-safety-clearance span {
  color: #cdbb91;
}

.assistant-safety-clearance.is-cleared {
  border-color: rgba(80, 232, 141, 0.34);
  background: rgba(80, 232, 141, 0.09);
}

.assistant-safety-clearance.is-cleared strong {
  color: #bfffd4;
}

.assistant-safety-clearance.is-cleared span {
  color: #8fdcac;
}

.assistant-studio-note-list > .assistant-safety-note {
  width: 100%;
  min-height: 54px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255, 203, 90, 0.34);
  background: linear-gradient(180deg, rgba(255, 203, 90, 0.13), rgba(46, 38, 25, 0.72));
  color: #ffe4a8;
  font: inherit;
  font-size: 0.92rem;
  font-weight: 820;
  line-height: 1.42;
  text-align: left;
  cursor: pointer;
  transition: transform 150ms ease, border-color 150ms ease, background 150ms ease, color 150ms ease;
}

.assistant-studio-note-list > .assistant-safety-note:hover,
.assistant-studio-note-list > .assistant-safety-note:focus-visible {
  outline: none;
  transform: translateY(-1px);
  border-color: rgba(255, 221, 128, 0.62);
}

.assistant-safety-note-check {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  border: 1px solid rgba(255, 221, 128, 0.44);
  background: rgba(255, 203, 90, 0.16);
  color: #ffd36b;
  font-size: 0.9rem;
  font-weight: 950;
}

.assistant-safety-note small {
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 221, 128, 0.28);
  color: #ffd36b;
  background: rgba(255, 203, 90, 0.12);
  font-size: 0.76rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.assistant-studio-note-list > .assistant-safety-note.is-confirmed {
  border-color: rgba(80, 232, 141, 0.42);
  background: linear-gradient(180deg, rgba(80, 232, 141, 0.16), rgba(19, 49, 35, 0.74));
  color: #dfffe8;
}

.assistant-safety-note.is-confirmed .assistant-safety-note-check,
.assistant-safety-note.is-confirmed small {
  border-color: rgba(80, 232, 141, 0.5);
  color: #0c2b17;
  background: linear-gradient(135deg, #63ef9b, #15b86b);
}

.assistant-studio-note-list > .assistant-safety-note.is-static {
  cursor: default;
}

.assistant-offer-summary {
  display: grid;
  gap: 12px;
  padding: 18px;
  border: 1px solid rgba(191, 207, 235, 0.16);
  border-radius: 16px;
  background: rgba(8, 14, 24, 0.46);
}

.assistant-offer-summary strong {
  color: #ffffff;
  font-size: 1.1rem;
  line-height: 1.2;
}

.assistant-offer-summary p,
.assistant-offer-summary small {
  margin: 0;
  color: #aebbd1;
  font-weight: 720;
  line-height: 1.45;
}

.assistant-offer-summary div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.assistant-offer-summary div span {
  padding: 8px 10px;
  border: 1px solid rgba(126, 231, 219, 0.22);
  border-radius: 999px;
  color: #7ee7db;
  background: rgba(126, 231, 219, 0.08);
  font-size: 0.8rem;
  font-weight: 900;
}

.assistant-studio-preview {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 18px;
}

.assistant-studio-preview-head {
  min-height: 48px;
  justify-content: space-between;
}

.assistant-studio-preview-head h3 {
  margin: 0;
  font-size: 1.12rem;
}

.assistant-device-toggle {
  min-width: 52px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 1px solid rgba(192, 207, 235, 0.15);
  color: #aeb8ce;
  background: rgba(255, 255, 255, 0.04);
  font-size: 0.78rem;
  font-weight: 950;
}

.assistant-device-toggle.is-active {
  color: #d6c8ff;
  background: rgba(122, 76, 255, 0.2);
  border-color: rgba(150, 117, 255, 0.42);
}

.assistant-campaign-preview-card {
  min-height: 0;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid var(--studio-line-strong);
  background:
    radial-gradient(circle at 50% 0%, rgba(83, 55, 172, 0.42), transparent 40%),
    linear-gradient(180deg, #0b1220, #070c14 72%);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.38);
}

.assistant-campaign-hero {
  min-height: 300px;
  position: relative;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 12px;
  padding: 42px;
  text-align: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 28% 26%, rgba(218, 69, 193, 0.34), transparent 25%),
    radial-gradient(circle at 72% 18%, rgba(72, 83, 255, 0.42), transparent 27%),
    linear-gradient(180deg, rgba(26, 21, 72, 0.96), rgba(9, 15, 27, 0.28)),
    linear-gradient(140deg, #171044, #0a1021);
}

.assistant-campaign-hero::before {
  content: "";
  position: absolute;
  left: -8%;
  right: -8%;
  bottom: 0;
  height: 42%;
  background:
    radial-gradient(ellipse at 14% 100%, rgba(0, 0, 0, 0.76) 0 20%, transparent 21%),
    radial-gradient(ellipse at 28% 100%, rgba(0, 0, 0, 0.72) 0 16%, transparent 17%),
    radial-gradient(ellipse at 49% 100%, rgba(0, 0, 0, 0.78) 0 22%, transparent 23%),
    radial-gradient(ellipse at 68% 100%, rgba(0, 0, 0, 0.74) 0 16%, transparent 17%),
    radial-gradient(ellipse at 84% 100%, rgba(0, 0, 0, 0.78) 0 21%, transparent 22%);
  opacity: 0.75;
}

.assistant-campaign-hero > * {
  position: relative;
  z-index: 1;
}

.assistant-soundmark {
  height: 86px;
  width: min(100%, 1040px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  opacity: 0.92;
  overflow: visible;
}

.assistant-soundmark-wordmark {
  display: block;
  flex: 0 1 338px;
  width: min(29vw, 338px);
  max-width: calc(100% - 112px);
  height: auto;
  margin-right: 13px;
  object-fit: contain;
  filter: drop-shadow(0 8px 14px rgba(3, 7, 38, 0.52));
}

@media (max-width: 760px) {
  .assistant-soundmark {
    height: 64px;
    gap: 6px;
  }

  .assistant-soundmark-wordmark {
    flex-basis: 221px;
    width: min(35vw, 221px);
    max-width: calc(100% - 84px);
    margin-right: 7px;
  }
}

.assistant-soundmark i {
  width: 8px;
  border-radius: 999px;
  background: #b59cff;
  box-shadow: 0 0 16px rgba(149, 106, 255, 0.7);
}

.assistant-soundmark i:nth-of-type(1) { height: 28px; }
.assistant-soundmark i:nth-of-type(2) { height: 44px; }
.assistant-soundmark i:nth-of-type(3) { height: 66px; }
.assistant-soundmark i:nth-of-type(4) { height: 31px; }
.assistant-soundmark i:nth-of-type(5) { height: 44px; }

.assistant-campaign-hero > span {
  color: #b07cff;
  font-size: 0.82rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.assistant-campaign-hero h3 {
  max-width: 560px;
  margin: 0;
  font-size: clamp(2rem, 3vw, 2.8rem);
  line-height: 1.12;
}

.assistant-campaign-hero p {
  max-width: 620px;
  color: #e6ecff;
  font-size: 1rem;
  font-weight: 760;
}

.assistant-campaign-preview-body {
  display: grid;
  gap: 18px;
  padding: 22px 26px 26px;
}

.assistant-campaign-demo-box,
.assistant-campaign-offer-box,
.assistant-campaign-share-box {
  padding: 18px;
  border-radius: 16px;
  border: 1px solid rgba(196, 211, 238, 0.16);
  background: rgba(255, 255, 255, 0.045);
}

.assistant-campaign-demo-box h4,
.assistant-campaign-offer-box h4,
.assistant-campaign-share-box h4 {
  margin: 0 0 6px;
  font-size: 1.02rem;
}

.assistant-campaign-demo-box > p,
.assistant-campaign-offer-box p,
.assistant-campaign-share-box p {
  margin: 0 0 10px;
  color: #aeb8ca;
  font-size: 0.84rem;
  font-weight: 760;
}

.assistant-campaign-music-carousel {
  min-width: 0;
  padding: 18px;
  border-radius: 18px;
  border: 1px solid rgba(132, 95, 255, 0.28);
  background:
    radial-gradient(circle at 88% 8%, rgba(132, 95, 255, 0.28), transparent 30%),
    linear-gradient(180deg, rgba(18, 27, 42, 0.92), rgba(8, 13, 22, 0.96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.assistant-campaign-music-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.assistant-campaign-music-head h4 {
  margin: 0;
  color: #f4f7ff;
  font-size: 1.08rem;
}

.assistant-campaign-music-head p {
  margin: 4px 0 0;
  color: #9daac0;
  font-size: 0.82rem;
  font-weight: 760;
}

.assistant-campaign-music-controls {
  display: inline-flex;
  gap: 8px;
  flex: 0 0 auto;
}

.assistant-campaign-music-controls button {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(192, 207, 238, 0.2);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.07);
  font: inherit;
  font-size: 1.2rem;
  font-weight: 950;
}

.assistant-campaign-music-viewport {
  min-width: 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.assistant-campaign-music-viewport::-webkit-scrollbar {
  display: none;
}

.assistant-campaign-music-track {
  display: flex;
  gap: 14px;
}

.assistant-campaign-music-card {
  flex: 0 0 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(170px, 0.9fr) minmax(0, 1fr);
  gap: 16px;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(190, 204, 229, 0.14);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.02)),
    #121d2a;
  scroll-snap-align: start;
}

.assistant-campaign-music-art {
  position: relative;
  min-height: 220px;
  overflow: hidden;
  border-radius: 16px;
  background:
    radial-gradient(circle at 76% 18%, rgba(255, 225, 108, 0.62), transparent 10%),
    linear-gradient(135deg, #cc4b9d, #4261f1 48%, #162337);
}

.assistant-campaign-music-art.is-two {
  background:
    radial-gradient(circle at 28% 18%, rgba(168, 255, 236, 0.62), transparent 11%),
    linear-gradient(145deg, #72cee5, #182236 62%, #0b101a);
}

.assistant-campaign-music-art.is-three {
  background:
    radial-gradient(circle at 62% 28%, rgba(255, 248, 176, 0.48), transparent 10%),
    linear-gradient(145deg, #c59e69, #314055 55%, #0c121d);
}

.assistant-campaign-music-art.is-four {
  background:
    radial-gradient(circle at 30% 24%, rgba(255, 204, 106, 0.62), transparent 10%),
    linear-gradient(145deg, #e7687f, #7b45ff 52%, #17142b);
}

.assistant-campaign-music-art.has-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(1.05) contrast(1.04);
}

.assistant-campaign-music-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(5, 10, 18, 0.04), rgba(5, 10, 18, 0.42));
  pointer-events: none;
}

.assistant-campaign-music-badge {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 1;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  padding: 0 16px;
  border-radius: 999px;
  color: #081626;
  background: linear-gradient(135deg, #7dffc8, #46ef92);
  font-size: 0.78rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  box-shadow: 0 14px 28px rgba(66, 239, 146, 0.22);
}

.assistant-campaign-music-play {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  width: 62px;
  height: 62px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  color: #ffffff;
  background: rgba(5, 11, 18, 0.68);
  font: inherit;
  font-size: 1.2rem;
  font-weight: 950;
  line-height: 0;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.32);
}

.assistant-campaign-music-play .assistant-play-icon {
  width: 26px;
  height: 26px;
  transform: translateX(2px);
}

.assistant-campaign-music-play .assistant-play-icon.is-pause {
  transform: none;
}

.assistant-campaign-music-play:disabled {
  opacity: 0.52;
}

.assistant-campaign-music-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 8px 4px;
}

.assistant-campaign-music-copy > span {
  color: #79f4da;
  font-size: 0.82rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.assistant-campaign-music-copy h4 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.45rem, 2.8vw, 2.05rem);
  line-height: 1.05;
}

.assistant-campaign-music-copy p {
  margin: 0;
  color: #b7c3d4;
  font-size: 0.9rem;
  font-weight: 720;
  line-height: 1.45;
}

.assistant-campaign-music-copy small {
  color: #8f9db2;
  font-size: 0.8rem;
  font-weight: 820;
}

.assistant-campaign-music-dots {
  display: flex;
  justify-content: center;
  gap: 7px;
  margin-top: 12px;
}

.assistant-campaign-music-dots span {
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: rgba(179, 194, 220, 0.34);
}

.assistant-campaign-music-dots span.is-active {
  width: 24px;
  background: linear-gradient(135deg, #8658ff, #4d72ff);
}

.assistant-campaign-offer-box {
  border-color: rgba(228, 79, 148, 0.32);
  background:
    radial-gradient(circle at 85% 0%, rgba(231, 79, 148, 0.28), transparent 35%),
    linear-gradient(135deg, rgba(122, 76, 255, 0.16), rgba(255, 255, 255, 0.035));
}

.assistant-campaign-offer-box > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.assistant-campaign-offer-box span {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 0 12px;
  border-radius: 10px;
  color: #ff78b5;
  background: rgba(255, 120, 181, 0.12);
  border: 1px solid rgba(255, 120, 181, 0.42);
  font-size: 0.78rem;
  font-weight: 900;
  white-space: nowrap;
}

.assistant-campaign-offer-box button {
  width: 100%;
  min-height: 56px;
  border: 0;
  border-radius: 10px;
  color: #ffffff;
  background: linear-gradient(135deg, #833dff, #4a64ff);
  font: inherit;
  font-size: 1rem;
  font-weight: 950;
  box-shadow: 0 20px 46px rgba(98, 74, 255, 0.22);
}

.assistant-campaign-offer-box small {
  display: block;
  color: #aebbd1;
  font-size: 0.78rem;
  font-weight: 760;
  line-height: 1.4;
}

.assistant-campaign-share-box {
  border-color: rgba(120, 145, 255, 0.28);
  background:
    radial-gradient(circle at 8% 8%, rgba(88, 112, 255, 0.2), transparent 32%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.025));
}

.assistant-campaign-share-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 14px;
}

.assistant-campaign-share-head > span {
  flex: 0 0 auto;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border-radius: 999px;
  color: #c8d5ff;
  background: rgba(77, 120, 255, 0.14);
  border: 1px solid rgba(117, 145, 255, 0.32);
  font-size: 0.72rem;
  font-weight: 950;
  text-transform: uppercase;
}

.assistant-campaign-share-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.assistant-campaign-share-button {
  min-width: 0;
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 10px;
  border-radius: 14px;
  border: 1px solid rgba(194, 210, 238, 0.18);
  color: #f4f7ff;
  background: rgba(8, 14, 24, 0.74);
  font: inherit;
  font-size: 0.84rem;
  font-weight: 920;
}

.assistant-campaign-share-button:hover {
  border-color: rgba(140, 108, 255, 0.46);
  background: rgba(18, 27, 42, 0.94);
}

.assistant-share-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: #ffffff;
  background: linear-gradient(135deg, #7456ff, #4d78ff);
  font-size: 0.92rem;
  font-weight: 950;
  line-height: 1;
}

.assistant-share-icon.is-facebook {
  background: linear-gradient(135deg, #3f72ff, #2656c9);
  font-family: Arial, sans-serif;
  font-size: 1.18rem;
}

.assistant-share-icon.is-x {
  background: linear-gradient(135deg, #ffffff, #b8c4d8);
  color: #07101c;
}

.assistant-share-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.assistant-campaign-trust-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.assistant-campaign-trust-row span {
  min-width: 0;
  color: #b8c3d6;
  font-size: 0.76rem;
  font-weight: 780;
}

.assistant-campaign-trust-row b {
  display: block;
  color: #e6ecfb;
}

.assistant-email-copy-toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
  color: #dce7ff;
  font-weight: 850;
}

.assistant-email-copy-toggle input {
  width: 18px;
  height: 18px;
  accent-color: #6c7dff;
}

.assistant-delivery-channels {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid rgba(141, 155, 184, 0.18);
  border-radius: 8px;
  background: rgba(8, 17, 29, 0.5);
}

.assistant-delivery-channels.is-compact {
  margin-top: 10px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.assistant-delivery-heading {
  grid-column: 1 / -1;
  color: #cfdcff;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.assistant-delivery-channels label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(168, 187, 220, 0.16);
  border-radius: 8px;
  background: rgba(6, 14, 25, 0.64);
  color: #ecf4ff;
}

.assistant-delivery-channels input {
  width: 18px;
  height: 18px;
  accent-color: #76d8dc;
}

.assistant-delivery-channels b,
.assistant-delivery-channels small {
  display: block;
  min-width: 0;
}

.assistant-delivery-channels small {
  color: #aebed8;
  font-size: 0.75rem;
}

.assistant-delivery-channels label.is-disabled {
  opacity: 0.58;
}

.campaign-message-bubble {
  display: grid;
  gap: 12px;
  width: min(720px, 100%);
  padding: 18px;
  border: 1px solid rgba(115, 130, 255, 0.34);
  background:
    linear-gradient(180deg, rgba(36, 43, 88, 0.86), rgba(8, 17, 29, 0.96)),
    #0b1422;
}

.campaign-message-bubble h3,
.campaign-message-bubble p {
  margin: 0;
}

.campaign-message-eyebrow {
  width: fit-content;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(124, 94, 255, 0.22);
  color: #c8b9ff;
  font-size: 0.75rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.campaign-message-music-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.campaign-message-music-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(168, 187, 220, 0.18);
  border-radius: 8px;
  background: rgba(6, 14, 25, 0.72);
}

.campaign-message-music-card:is(a) {
  color: inherit;
  text-decoration: none;
}

.campaign-message-music-card:is(a):hover,
.campaign-message-music-card:is(a):focus-visible {
  border-color: rgba(126, 231, 219, 0.44);
  outline: none;
}

.campaign-message-music-card img,
.campaign-message-music-card > span {
  width: 54px;
  height: 54px;
  border-radius: 8px;
  object-fit: cover;
  display: grid;
  place-items: center;
  background: rgba(117, 72, 244, 0.2);
  color: #8ef0ff;
  font-weight: 950;
}

.campaign-message-music-card strong,
.campaign-message-music-card small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.campaign-message-music-card small {
  color: #adc0dc;
}

.campaign-message-summary {
  color: #b7c8e4;
  font-size: 0.86rem;
}

.assistant-studio-shell.is-simple .assistant-studio-layout {
  min-height: 100vh;
  grid-template-columns: minmax(650px, 1fr) minmax(500px, 600px);
  gap: 34px;
  padding: 24px;
}

.assistant-studio-shell.is-simple .assistant-studio-builder {
  display: block;
}

.assistant-studio-hero-row {
  min-height: 124px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 22px;
}

.assistant-studio-shell.is-simple .assistant-studio-hero-row > div:first-child {
  min-width: 0;
  max-width: 680px;
}

.assistant-studio-hero-row h2 {
  margin: 0;
  color: #ffffff;
  font-size: clamp(2.15rem, 4vw, 3.5rem);
  line-height: 0.98;
}

.assistant-studio-hero-row p {
  max-width: 760px;
  margin: 14px 0 0;
  color: #b8c4d9;
  font-size: clamp(1rem, 1.4vw, 1.18rem);
  font-weight: 760;
  line-height: 1.4;
}

.assistant-studio-shell.is-simple .assistant-studio-actions {
  padding-top: 0;
  flex: 0 0 auto;
  flex-wrap: wrap;
}

.assistant-studio-shell.is-simple .assistant-studio-button {
  min-height: 54px;
  padding: 0 24px;
  border-radius: 16px;
  font-size: 1rem;
}

.assistant-studio-shell.is-simple .assistant-studio-steps {
  min-height: 84px;
  margin-bottom: 28px;
  padding: 16px 20px;
  border-radius: 20px;
  background: rgba(13, 20, 33, 0.94);
  gap: 6px;
}

.assistant-studio-shell.is-simple .assistant-studio-steps span,
.assistant-studio-shell.is-simple .assistant-studio-step-button {
  gap: 7px;
  font-size: 0.92rem;
}

.assistant-studio-shell.is-simple .assistant-studio-steps b,
.assistant-studio-shell.is-simple .assistant-studio-step-button b {
  width: 42px;
  height: 42px;
  font-size: 1.08rem;
}

.assistant-studio-shell.is-simple .assistant-studio-steps i {
  min-width: 8px;
}

.assistant-studio-shell.is-simple .assistant-studio-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

.assistant-studio-shell.is-simple .assistant-studio-main-grid > .assistant-studio-stack {
  display: contents;
}

.assistant-studio-shell.is-simple .assistant-studio-form-card {
  order: 1;
}

.assistant-studio-shell.is-simple .assistant-studio-music-card {
  order: 2;
}

.assistant-studio-shell.is-simple .assistant-studio-ai-card {
  order: 3;
}

.assistant-studio-shell.is-simple .assistant-studio-secondary-card {
  order: 4;
}

.assistant-studio-shell.is-simple .assistant-studio-card {
  padding: 30px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 96% 10%, rgba(132, 78, 255, 0.16), transparent 28%),
    linear-gradient(180deg, rgba(19, 28, 44, 0.94), rgba(10, 17, 28, 0.94));
}

.assistant-studio-shell.is-simple .assistant-studio-card h3 {
  font-size: 1.6rem;
}

.assistant-studio-shell.is-simple .assistant-studio-card-head {
  margin-bottom: 24px;
}

.assistant-studio-shell.is-simple .assistant-studio-card-head p {
  color: #aebbd1;
  font-size: 1rem;
  font-weight: 760;
}

.assistant-studio-shell.is-simple .assistant-studio-form-grid {
  gap: 22px;
}

.assistant-studio-shell.is-simple .assistant-studio-form-grid label > span:first-child {
  color: #b8c6dd;
  font-size: 0.94rem;
}

.assistant-studio-shell.is-simple .assistant-studio-input {
  min-height: 58px;
  padding: 0 18px;
  border-radius: 14px;
  font-size: 1rem;
}

.assistant-studio-shell.is-simple .assistant-studio-textarea {
  min-height: 118px;
  padding: 18px;
  border-radius: 14px;
  font-size: 1rem;
}

.assistant-studio-shell.is-simple .assistant-studio-chip {
  min-height: 52px;
  padding: 0 22px;
  font-size: 1rem;
}

.assistant-studio-shell.is-simple .assistant-studio-track {
  min-height: 104px;
  grid-template-columns: 18px 68px 52px minmax(145px, 1fr) 88px minmax(96px, 170px) 24px;
  padding: 0 16px;
}

.assistant-studio-shell.is-simple .assistant-track-cover {
  width: 68px;
  height: 68px;
  border-radius: 12px;
}

.assistant-studio-shell.is-simple .assistant-track-play {
  width: 52px;
  height: 52px;
  font-size: 1rem;
}

.assistant-studio-shell.is-simple .assistant-track-copy strong {
  font-size: 1.02rem;
}

.assistant-studio-shell.is-simple .assistant-track-copy span,
.assistant-studio-shell.is-simple .assistant-track-duration {
  font-size: 0.92rem;
}

.assistant-studio-shell.is-simple .assistant-studio-wave {
  justify-content: flex-end;
  gap: 5px;
}

.assistant-studio-shell.is-simple .assistant-studio-wave-bar {
  width: 5px;
}

.assistant-studio-shell.is-simple .assistant-studio-ai-card {
  padding: 22px 24px;
  border-radius: 20px;
}

.assistant-studio-shell.is-simple .assistant-studio-preview {
  position: sticky;
  top: 24px;
  align-self: start;
}

.assistant-studio-shell.is-simple .assistant-studio-preview-head {
  min-height: 76px;
  align-items: flex-start;
}

.assistant-studio-shell.is-simple .assistant-studio-preview-head h3 {
  font-size: 1.8rem;
}

.assistant-studio-shell.is-simple .assistant-campaign-preview-card {
  max-height: calc(100vh - 124px);
  overflow: auto;
}

.assistant-studio-shell.is-simple .assistant-campaign-hero {
  min-height: 330px;
  align-content: center;
}

.assistant-studio-shell.is-simple .assistant-campaign-hero > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 28px;
  border-radius: 999px;
  background: rgba(10, 16, 28, 0.72);
  border: 1px solid rgba(198, 211, 238, 0.18);
}

.assistant-studio-shell.is-simple .assistant-campaign-demo-box h4,
.assistant-studio-shell.is-simple .assistant-campaign-offer-box h4 {
  font-size: 1.2rem;
}

.assistant-studio-shell.is-simple .assistant-preview-track {
  min-height: 86px;
  grid-template-columns: 66px 48px minmax(120px, 1fr) minmax(130px, 190px) 26px;
}

.assistant-studio-shell.is-simple .assistant-preview-track .assistant-track-cover {
  width: 66px;
  height: 66px;
}

.assistant-launch-actions {
  display: flex;
  gap: 12px;
}

.assistant-launch-actions .assistant-studio-button {
  flex: 1;
}

@media (max-width: 1500px) {
  .assistant-studio-layout {
    grid-template-columns: 1fr;
  }

  .assistant-studio-preview {
    min-height: 780px;
  }
}

@media (max-width: 1100px) {
  .assistant-studio-topbar,
  .assistant-studio-title-row,
  .assistant-studio-card-head,
  .assistant-studio-preview-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .assistant-studio-layout {
    padding: 18px;
  }

  .assistant-studio-form-grid,
  .assistant-studio-review-grid,
  .assistant-template-grid,
  .assistant-campaign-share-actions,
  .assistant-campaign-trust-row {
    grid-template-columns: 1fr;
  }

  .assistant-studio-step-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .assistant-studio-step-actions > div {
    justify-content: stretch;
  }

  .assistant-studio-step-actions .assistant-studio-button {
    flex: 1;
  }

  .assistant-campaign-music-card {
    grid-template-columns: 1fr;
  }

  .assistant-campaign-music-art {
    min-height: 260px;
  }

  .assistant-studio-steps {
    overflow-x: auto;
  }

  .assistant-studio-track {
    grid-template-columns: 58px 42px minmax(0, 1fr);
    padding: 12px;
  }

  .assistant-track-drag,
  .assistant-track-duration,
  .assistant-studio-track .assistant-studio-wave,
  .assistant-track-menu {
    display: none;
  }
}

.toggle-card {
  gap: 14px;
}

.toggle-copy {
  display: grid;
  gap: 4px;
}

.support-hours-grid {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 16px;
}

.support-hours-day-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.support-hours-day-option {
  min-height: 44px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: var(--panel-soft);
}

.support-hours-time-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.support-hours-field {
  display: grid;
  gap: 8px;
}

.settings-toggle-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.settings-toggle-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel-soft);
}

.settings-toggle-card > span:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

@media (max-width: 760px) {
  .settings-reward-directory {
    gap: 12px;
    padding: 12px;
    overflow: hidden;
  }

  .settings-reward-directory-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 100%;
    padding: 6px;
    overflow: hidden;
  }

  .settings-reward-directory-tab {
    width: 100%;
    padding: 11px 10px;
  }

  .settings-reward-directory-tab:last-child {
    grid-column: 1 / -1;
  }

  .settings-reward-directory-panel {
    padding: 14px;
  }

  .settings-reward-directory-panel-head {
    display: grid;
    gap: 8px;
  }

  .settings-reward-event-grid {
    grid-template-columns: 1fr;
  }

  .settings-reward-event-input-grid {
    grid-template-columns: 1fr;
  }

  .settings-toggle-grid {
    grid-template-columns: 1fr;
  }
}

.settings-publishing-duration {
  min-height: 20px;
  color: var(--accent-strong);
  font-size: 0.84rem;
  font-weight: 800;
}

.settings-publishing-duration.is-over-limit {
  color: #dc2626;
}

.settings-grace-duration-hint {
  min-height: 20px;
  color: #111827;
  font-size: 0.92rem;
  font-weight: 900;
  line-height: 1.35;
}

.toggle-switch {
  width: 56px;
  height: 32px;
  border-radius: 999px;
  background: #d6dde8;
  position: relative;
  flex: none;
  border: 0;
  transition: background 0.18s ease, box-shadow 0.18s ease;
}

.toggle-switch::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 4px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 4px 12px rgba(43, 54, 69, 0.16);
  transition: transform 0.18s ease;
}

.toggle-switch.is-on {
  background: rgba(75, 125, 240, 0.3);
}

.toggle-switch.is-on::after {
  transform: translateX(24px);
}

.settings-toggle-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: none;
}

.toggle-switch-input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  opacity: 0;
  overflow: hidden;
}

.toggle-switch-input + .toggle-switch {
  cursor: pointer;
}

.toggle-switch-input:checked + .toggle-switch {
  background: rgba(75, 125, 240, 0.3);
}

.toggle-switch-input:checked + .toggle-switch::after {
  transform: translateX(24px);
}

.toggle-switch-input:focus-visible + .toggle-switch {
  box-shadow:
    0 0 0 3px rgba(124, 100, 255, 0.18),
    inset 0 0 0 1px rgba(75, 125, 240, 0.24);
}

.admin-panels.is-settings-layout .toggle-switch.is-on,
.admin-panels.is-settings-layout .toggle-switch-input:checked + .toggle-switch {
  background: linear-gradient(135deg, rgba(151, 104, 255, 0.95), rgba(124, 92, 255, 0.9));
  box-shadow:
    0 12px 26px rgba(124, 92, 255, 0.24),
    inset 0 0 0 1px rgba(255, 255, 255, 0.28);
}

.admin-panels.is-settings-layout .toggle-switch-input:checked ~ .settings-toggle-state {
  color: #7c5cff;
}

.toggle-switch-input:disabled + .toggle-switch {
  opacity: 0.55;
  cursor: not-allowed;
}

.settings-toggle-state {
  min-width: 24px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.settings-toggle-state::before {
  content: attr(data-off);
}

.toggle-switch-input:checked ~ .settings-toggle-state {
  color: var(--accent-strong);
}

.toggle-switch-input:checked ~ .settings-toggle-state::before {
  content: attr(data-on);
}

.toggle-switch:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.empty-state,
.access-state {
  min-height: 320px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 28px;
}

.access-card,
.empty-card {
  width: min(620px, 100%);
  padding: 28px;
  border-radius: 24px;
  background: #ffffff;
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  display: grid;
  gap: 14px;
}

.bar-list {
  display: grid;
  gap: 12px;
}

.bar-row {
  display: grid;
  gap: 8px;
}

.bar-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

/* Keep each file count and its storage total together above their own bar. */
.is-storage-filetypes .bar-row {
  grid-template-columns: minmax(0, 1fr) auto;
  column-gap: 12px;
}

.is-storage-filetypes .bar-meta {
  display: contents;
}

.is-storage-filetypes .bar-meta > .list-card-name {
  grid-column: 1 / -1;
  grid-row: 1;
}

.is-storage-filetypes .bar-meta > .detail-meta {
  grid-column: 2;
  grid-row: 2;
  text-align: right;
}

.is-storage-filetypes .bar-row > .detail-meta {
  grid-column: 1;
  grid-row: 2;
}

.is-storage-filetypes .bar-track {
  grid-column: 1 / -1;
  grid-row: 3;
}

.bar-track {
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: #e8edf4;
  overflow: hidden;
}

.bar-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4b7df0, #79a0ff);
}

.community-sweep-category-card {
  gap: 12px;
}

.community-sweep-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
}

.community-sweep-category-option {
  align-items: flex-start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.82);
}

.community-sweep-category-option span {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.community-sweep-category-option strong {
  font-size: 0.92rem;
}

.community-sweep-category-option small {
  color: var(--muted);
  line-height: 1.35;
}

.community-sweep-progress {
  display: grid;
  gap: 8px;
}

.community-sweep-progress-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 800;
}

.community-sweep-progress-head strong {
  color: var(--text);
}

.community-sweep-progress-track {
  background: rgba(26, 164, 111, 0.14);
  box-shadow: inset 0 0 0 1px rgba(26, 164, 111, 0.14);
}

.community-sweep-progress-fill {
  min-width: 0;
  background: linear-gradient(90deg, #1aa46f, #42c993);
  transition: width 220ms ease;
}

.community-sweep-progress-foot {
  display: grid;
  align-items: stretch;
  gap: 8px;
  min-width: 0;
}

.community-sweep-progress.is-active .community-sweep-progress-fill {
  min-width: 0;
}

.community-sweep-progress.is-completed .community-sweep-progress-fill {
  background: linear-gradient(90deg, #1aa46f, #42c993);
}

.community-sweep-progress.is-failed .community-sweep-progress-fill {
  background: linear-gradient(90deg, #dc4c54, #f2777e);
}

.community-sweep-console {
  width: 100%;
  max-height: 280px;
  overflow: auto;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  border-radius: 8px;
  background: #ffffff;
  color: #111827;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.5;
  white-space: pre;
  word-break: normal;
}

.community-sweep-console span {
  display: block;
}

.community-sweep-console .is-detected-content {
  color: var(--red);
  font-weight: 900;
}

.community-sweep-console .is-error {
  color: var(--red);
  font-weight: 900;
}

.community-sweep-result-shell {
  align-content: start;
}

.community-sweep-result-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
}

.community-sweep-result-title {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.community-sweep-result-status {
  justify-self: end;
  max-width: 520px;
}

.community-sweep-summary-board {
  display: grid;
  gap: 14px;
}

.community-sweep-metric-group {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(220, 226, 234, 0.82);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.7);
}

.community-sweep-metric-group h4 {
  margin: 0;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.community-sweep-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 10px;
}

.community-sweep-metric-card {
  position: relative;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 12px 12px 12px 14px;
  overflow: hidden;
  border: 1px solid rgba(220, 226, 234, 0.9);
  border-radius: 12px;
  background: #ffffff;
}

.community-sweep-metric-card strong {
  color: var(--text);
  font-size: 1.2rem;
  line-height: 1.15;
}

.community-sweep-metric-label {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.community-sweep-metric-tone {
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: #cbd5e1;
}

.community-sweep-metric-tone.is-blue {
  background: #7c5cff;
}

.community-sweep-metric-tone.is-purple {
  background: #8b5cf6;
}

.community-sweep-metric-tone.is-green {
  background: #32c7b0;
}

.community-sweep-metric-tone.is-orange {
  background: #d59035;
}

.community-sweep-metric-tone.is-red {
  background: #e85d7d;
}

.community-sweep-run-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.community-sweep-run-meta span,
.community-sweep-filter-summary {
  border: 1px solid rgba(220, 226, 234, 0.82);
  border-radius: 12px;
  background: rgba(248, 250, 255, 0.72);
  color: var(--muted);
}

.community-sweep-run-meta span {
  padding: 9px 11px;
  font-weight: 800;
}

.community-sweep-filter-summary {
  display: grid;
  gap: 3px;
  padding: 11px 12px;
}

.community-sweep-filter-summary strong {
  color: var(--text);
  font-size: 0.95rem;
  line-height: 1.35;
}

.community-sweep-console-option {
  align-items: flex-start;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.82);
}

.community-sweep-results-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.community-sweep-results-scroll {
  display: grid;
  gap: 10px;
  max-height: min(42vh, 460px);
  padding: 2px 10px 2px 0;
}

.community-sweep-result-card {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid rgba(220, 226, 234, 0.92);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.82);
  box-shadow: 0 10px 24px rgba(33, 42, 68, 0.05);
}

.community-sweep-result-main {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.community-sweep-result-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  background: var(--panel-soft);
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
}

.community-sweep-result-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.community-sweep-result-state,
.community-sweep-result-issues {
  justify-content: flex-start;
}

.community-sweep-result-state {
  justify-content: flex-end;
}

.community-sweep-result-state.admin-info-pill-grid {
  grid-template-columns: repeat(2, minmax(112px, 1fr));
  justify-self: end;
  width: min(100%, 300px);
}

.community-sweep-result-issues.admin-info-pill-grid {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.community-sweep-result-notes {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.35;
}

.community-sweep-result-notes.is-detected-content {
  color: var(--red);
  font-weight: 800;
}

.timeline-shell {
  display: grid;
  gap: 16px;
}

.timeline-legend {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 0.88rem;
}

.timeline-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.timeline-legend-item.is-toggle {
  min-height: 30px;
  padding: 4px 8px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
  transition: background 0.18s ease, border-color 0.18s ease, opacity 0.18s ease;
}

.timeline-legend-item.is-toggle:hover,
.timeline-legend-item.is-toggle:focus-visible {
  border-color: rgba(91, 140, 255, 0.22);
  background: rgba(91, 140, 255, 0.08);
}

.timeline-legend-item.is-muted {
  opacity: 0.44;
}

.timeline-legend-swatch {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.area-chart-empty {
  min-height: 300px;
  display: grid;
  place-items: center;
  padding: 18px;
  border: 1px dashed rgba(141, 150, 176, 0.26);
  border-radius: 14px;
  color: var(--muted);
  font-weight: 800;
  text-align: center;
}

.timeline-columns {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(28px, 1fr);
  gap: 10px;
  align-items: end;
  overflow-x: auto;
  padding-bottom: 4px;
}

.timeline-column {
  display: grid;
  gap: 10px;
  align-items: end;
  min-width: 28px;
}

.timeline-bars {
  height: 180px;
  min-height: 180px;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 4px;
}

.timeline-bar {
  flex: 1 1 0;
  min-width: 6px;
  border-radius: 999px 999px 4px 4px;
  background: linear-gradient(180deg, #4b7df0, #79a0ff);
}

.timeline-column-label {
  min-height: 1.1rem;
  color: var(--muted);
  font-size: 0.76rem;
  text-align: center;
  white-space: nowrap;
}

.dashboard-monthly-comparison-chart {
  display: grid;
  gap: 16px;
}

.dashboard-monthly-comparison-columns {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(54px, 1fr);
  gap: 12px;
  align-items: end;
  overflow-x: auto;
  padding: 2px 2px 6px;
}

.dashboard-monthly-comparison-column {
  display: grid;
  grid-template-rows: minmax(1.1rem, auto) minmax(1rem, auto) 180px minmax(1.1rem, auto);
  gap: 7px;
  min-width: 54px;
  align-items: end;
}

.dashboard-monthly-total {
  min-height: 1.1rem;
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
  white-space: nowrap;
}

.dashboard-monthly-change {
  min-height: 1rem;
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1;
  padding: 4px 5px;
  text-align: center;
  white-space: nowrap;
}

.dashboard-monthly-change.is-up {
  background: rgba(46, 178, 122, 0.13);
  color: #247c59;
}

.dashboard-monthly-change.is-down {
  background: rgba(219, 83, 95, 0.13);
  color: #b93846;
}

.dashboard-monthly-change.is-flat {
  background: rgba(115, 124, 145, 0.12);
  color: var(--muted);
}

.dashboard-monthly-bars {
  height: 180px;
  min-height: 180px;
  display: flex;
  align-items: end;
  justify-content: center;
  gap: 5px;
}

.dashboard-monthly-bar {
  flex: 1 1 0;
  max-width: 22px;
  min-width: 10px;
  border-radius: 999px 999px 5px 5px;
  box-shadow: 0 10px 18px rgba(24, 32, 48, 0.12);
}

.dashboard-monthly-bar.is-current {
  background: linear-gradient(180deg, #ff9f84, #fb6f92);
}

.dashboard-monthly-bar.is-last-year {
  background: linear-gradient(180deg, #8f71ff, #6b55ea);
}

.chart-bar-blue {
  background: linear-gradient(180deg, #5c8cff, #3b68d6);
}

.chart-bar-green {
  background: linear-gradient(180deg, #7bc58a, #4e8f5c);
}

.chart-bar-orange {
  background: linear-gradient(180deg, #f1bf69, #c9892f);
}

.link-button {
  color: var(--blue);
  text-decoration: none;
  font-weight: 700;
}

.admin-app[data-theme="dark"] .admin-header {
  background: rgba(10, 16, 25, 0.88);
}

.admin-app[data-theme="dark"] .admin-brand {
  background: linear-gradient(135deg, #f5f8ff, #8eaef8);
  color: #16223a;
}

.admin-app[data-theme="dark"] .admin-search-shell input,
.admin-app[data-theme="dark"] .admin-text-input,
.admin-app[data-theme="dark"] .admin-select,
.admin-app[data-theme="dark"] .admin-textarea,
.admin-app[data-theme="dark"] .admin-button.ghost,
.admin-app[data-theme="dark"] .admin-button.subtle,
.admin-app[data-theme="dark"] .admin-theme-toggle,
.admin-app[data-theme="dark"] .users-export-trigger,
.admin-app[data-theme="dark"] .users-export-options,
.admin-app[data-theme="dark"] .chip {
  background: #0f1622;
  border-color: var(--line);
  color: var(--text);
}

.admin-app[data-theme="dark"] .users-export-option {
  color: var(--text);
}

.admin-app[data-theme="dark"] .users-export-option:hover {
  background: rgba(139, 113, 255, 0.16);
}

.admin-app[data-theme="dark"] .admin-button.warning {
  color: #ffcb83;
  border-color: rgba(224, 166, 82, 0.26);
}

.admin-app[data-theme="dark"] .storage-backups-table .backup-pending-button {
  opacity: 1;
}

.admin-app[data-theme="dark"] .storage-backups-table .detail-meta.is-pending-delete {
  color: #ffcb83;
}

.admin-app[data-theme="dark"] .list-card.is-priority-action {
  border-color: rgba(224, 166, 82, 0.28);
  box-shadow: 0 0 0 1px rgba(224, 166, 82, 0.1) inset;
}

.admin-app[data-theme="dark"] .admin-button.success {
  color: #b6e1bd;
  border-color: rgba(132, 196, 143, 0.26);
}

.admin-app[data-theme="dark"] .admin-button.user-unlock-button {
  background: #18212b;
  color: #c3ccd8;
  border-color: rgba(158, 170, 186, 0.26);
}

.admin-app[data-theme="dark"] .admin-button.user-unlock-button:not(:disabled):hover {
  background: #202b37;
  color: #eef4f8;
}

.admin-app[data-theme="dark"] .admin-button.user-unlock-button:disabled {
  opacity: 1;
  background: #121a24;
  color: #798492;
  border-color: rgba(126, 140, 158, 0.18);
}

.admin-app[data-theme="dark"] .admin-status-banner {
  background: #111927;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .admin-status-banner.tone-success {
  background: rgba(132, 196, 143, 0.11);
}

.admin-app[data-theme="dark"] .admin-status-banner.tone-warning {
  background: rgba(224, 166, 82, 0.12);
}

.admin-app[data-theme="dark"] .admin-status-banner.tone-danger {
  background: rgba(239, 129, 129, 0.11);
}

.admin-app[data-theme="dark"] .metric-card,
.admin-app[data-theme="dark"] .section-card,
.admin-app[data-theme="dark"] .detail-card,
.admin-app[data-theme="dark"] .list-card,
.admin-app[data-theme="dark"] .toggle-card,
.admin-app[data-theme="dark"] .message-card,
.admin-app[data-theme="dark"] .access-card,
.admin-app[data-theme="dark"] .empty-card,
.admin-app[data-theme="dark"] .table-shell {
  background: #111927;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .settings-model-toggle {
  background: rgba(15, 22, 34, 0.92);
  border-color: rgba(115, 235, 201, 0.18);
}

.admin-app[data-theme="dark"] .settings-model-toggle-button {
  color: var(--muted);
}

.admin-app[data-theme="dark"] .settings-model-toggle-button.is-active {
  color: #052017;
}

.admin-app[data-theme="dark"] .users-split-layout > .panel-section,
.admin-app[data-theme="dark"] .users-split-layout > .panel-section:first-child {
  background: #111927;
}

.admin-app[data-theme="dark"] .users-workspace-tabs {
  background: rgba(15, 22, 34, 0.88);
  border-color: rgba(143, 154, 179, 0.16);
}

.admin-app[data-theme="dark"] .users-workspace-tab:hover,
.admin-app[data-theme="dark"] .users-workspace-tab:focus-visible {
  background: rgba(20, 27, 39, 0.94);
}

.admin-app[data-theme="dark"] .users-workspace-tab.is-active {
  color: #f5f1ff;
  border-color: rgba(150, 126, 255, 0.34);
  background: linear-gradient(135deg, rgba(118, 83, 255, 0.34), rgba(80, 59, 160, 0.28));
  box-shadow: 0 14px 28px rgba(6, 10, 20, 0.28);
}

.admin-app[data-theme="dark"] .users-workspace-tab-count {
  background: rgba(143, 154, 179, 0.12);
}

.admin-app[data-theme="dark"] .users-workspace-tab.is-active .users-workspace-tab-count {
  color: #f7f2ff;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: none;
}

.admin-app[data-theme="dark"] .collapsed-filter-button {
  background: rgba(20, 27, 39, 0.9);
  border-color: rgba(143, 154, 179, 0.18);
}

.admin-app[data-theme="dark"] .collapsed-filter-button:hover {
  border-color: rgba(118, 83, 255, 0.34);
}

.admin-app[data-theme="dark"] .collapsed-filter-button.is-active {
  background: rgba(118, 83, 255, 0.22);
  border-color: rgba(118, 83, 255, 0.38);
}

.admin-app[data-theme="dark"] .users-segments-panel.is-collapsed-rail .collapsed-filter-button--icon {
  background: rgba(20, 27, 39, 0.96);
  box-shadow: 0 16px 30px rgba(4, 10, 20, 0.28);
}

.admin-app[data-theme="dark"] .users-segments-panel.is-collapsed-rail .collapsed-filter-button-icon-shell {
  background: rgba(255, 255, 255, 0.06);
}

.admin-app[data-theme="dark"] .settings-groups-panel.is-collapsed-rail .collapsed-filter-button--icon {
  background: linear-gradient(180deg, rgba(20, 27, 39, 0.96), rgba(17, 23, 34, 0.94));
  box-shadow: 0 16px 30px rgba(4, 10, 20, 0.28);
}

.admin-app[data-theme="dark"] .settings-group-card {
  background: linear-gradient(180deg, rgba(20, 27, 39, 0.96), rgba(17, 23, 34, 0.92));
  box-shadow:
    0 18px 34px rgba(4, 10, 20, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.admin-app[data-theme="dark"] .settings-group-card-icon-shell {
  box-shadow:
    inset 0 0 0 1px var(--settings-group-line, rgba(255, 255, 255, 0.1)),
    0 12px 20px rgba(4, 10, 20, 0.24);
}

.admin-app[data-theme="dark"] .settings-group-card-state {
  background: rgba(255, 255, 255, 0.06);
}

.admin-app[data-theme="dark"] .settings-group-card.is-active {
  background: linear-gradient(135deg, rgba(60, 41, 114, 0.82), rgba(18, 25, 38, 0.96));
  border-color: rgba(118, 83, 255, 0.36);
}

.admin-app[data-theme="dark"] .settings-group-card.is-active .settings-group-card-state {
  background: rgba(118, 83, 255, 0.28);
  color: #ebe4ff;
}

.admin-app[data-theme="dark"] .settings-category-nav-button {
  background: rgba(17, 25, 39, 0.82);
  border-color: rgba(148, 163, 184, 0.18);
  color: rgba(236, 240, 247, 0.74);
}

.admin-app[data-theme="dark"] .settings-category-nav-button:hover,
.admin-app[data-theme="dark"] .settings-category-nav-button:focus-visible {
  border-color: rgba(118, 83, 255, 0.36);
  color: #ebe4ff;
}

.admin-app[data-theme="dark"] .settings-category-nav-button.is-active {
  border-color: rgba(118, 83, 255, 0.42);
  background: linear-gradient(135deg, rgba(60, 41, 114, 0.84), rgba(29, 39, 58, 0.96));
  color: #ebe4ff;
}

.admin-app[data-theme="dark"] .settings-grace-duration-hint {
  color: #f8fafc;
}

.admin-app[data-theme="dark"] .settings-groups-toggle-button {
  box-shadow:
    0 16px 28px rgba(4, 10, 20, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.admin-app[data-theme="dark"] .settings-groups-panel.is-collapsed-rail {
  border-color: rgba(118, 83, 255, 0.14);
  background: linear-gradient(180deg, rgba(20, 27, 39, 0.98), rgba(17, 23, 34, 0.96));
  box-shadow:
    0 18px 34px rgba(4, 10, 20, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.admin-app[data-theme="dark"] .settings-groups-panel.is-collapsed-rail .collapsed-filter-button-icon-shell {
  background: rgba(255, 255, 255, 0.06);
}

.admin-app[data-theme="dark"] .settings-groups-panel.is-collapsed-rail .collapsed-filter-button--icon.is-active {
  background: linear-gradient(180deg, rgba(52, 36, 97, 0.92), rgba(38, 28, 72, 0.94));
  border-color: rgba(118, 83, 255, 0.36);
}

.admin-app[data-theme="dark"] .settings-collapsed-group-label {
  color: rgba(236, 240, 247, 0.82);
}

.admin-app[data-theme="dark"] .media-collapsed-action-button {
  background: rgba(20, 27, 39, 0.9);
  border-color: rgba(143, 154, 179, 0.18);
}

.admin-app[data-theme="dark"] .media-collapsed-action-button:hover {
  border-color: rgba(118, 83, 255, 0.34);
}

.admin-app[data-theme="dark"] .media-collapsed-action-button.is-active {
  background: rgba(118, 83, 255, 0.22);
  border-color: rgba(118, 83, 255, 0.38);
}

.admin-app[data-theme="dark"] .media-collapsed-action-count {
  background: rgba(118, 83, 255, 0.24);
}

.admin-app[data-theme="dark"] .users-holdings-card {
  background:
    linear-gradient(180deg, rgba(124, 100, 255, 0.16), rgba(88, 196, 255, 0.08)),
    #111927;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .users-holdings-stat {
  background: rgba(124, 100, 255, 0.14);
}

.admin-app[data-theme="dark"] .users-holdings-detail-row {
  border-top-color: rgba(143, 154, 179, 0.22);
}

.admin-app[data-theme="dark"] .list-card.is-active,
.admin-app[data-theme="dark"] .table-row.is-selected-row {
  background: linear-gradient(135deg, rgba(122, 167, 255, 0.17), rgba(122, 167, 255, 0.05));
}

.admin-app[data-theme="dark"] .tone-muted {
  background: #1c2635;
  color: #aab6ca;
}

.admin-app[data-theme="dark"] .avatar {
  background: #233147;
  color: #d9e5ff;
}

.admin-app[data-theme="dark"] .media-source-badge {
  box-shadow: inset 0 0 0 1px rgba(226, 232, 255, 0.14);
}

.admin-app[data-theme="dark"] .media-source-badge.is-google_studio {
  background: #f8fbff;
}

.admin-app[data-theme="dark"] .media-source-badge.is-user_upload {
  background: rgba(35, 204, 176, 0.18);
  color: #83f4df;
}

.admin-app[data-theme="dark"] .media-source-badge.is-generated_album {
  background: rgba(124, 100, 255, 0.22);
  color: #c5ccff;
}

.admin-app[data-theme="dark"] .media-owner-avatar {
  border-color: rgba(226, 232, 255, 0.16);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    0 12px 26px rgba(4, 10, 20, 0.26);
}

.admin-app[data-theme="dark"] button.media-owner-avatar:hover,
.admin-app[data-theme="dark"] button.media-owner-avatar:focus-visible {
  border-color: rgba(157, 132, 255, 0.48);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.12),
    0 16px 34px rgba(4, 10, 20, 0.34);
}

.admin-app[data-theme="dark"] .media-owner-view-user-button {
  border-color: rgba(166, 139, 255, 0.22);
  background: rgba(30, 36, 54, 0.94);
  color: #bba8ff;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28);
}

.admin-app[data-theme="dark"] .media-owner-view-user-button:hover,
.admin-app[data-theme="dark"] .media-owner-view-user-button:focus-visible {
  border-color: rgba(166, 139, 255, 0.48);
  background: rgba(42, 49, 74, 0.98);
}

.admin-app[data-theme="dark"] .media-owner-snapshot-copy > small {
  color: #97a5bb;
}

.admin-app[data-theme="dark"] .media-profile-preview-stage {
  border-color: rgba(140, 151, 184, 0.22);
  background:
    linear-gradient(135deg, rgba(21, 26, 39, 0.96), rgba(30, 36, 54, 0.98)),
    #151a27;
}

.admin-app[data-theme="dark"] .media-profile-preview-meta > div {
  border-color: rgba(140, 151, 184, 0.18);
  background: rgba(21, 26, 39, 0.86);
}

.admin-app[data-theme="dark"] .media-detail-artwork-action {
  border-color: rgba(226, 232, 255, 0.26);
  background: rgba(6, 12, 24, 0.76);
}

.admin-app[data-theme="dark"] .media-review-hold-overview {
  background: linear-gradient(180deg, rgba(89, 31, 63, 0.44), rgba(70, 24, 50, 0.34));
  border-color: rgba(255, 124, 200, 0.22);
}

.admin-app[data-theme="dark"] .media-review-hold-eyebrow,
.admin-app[data-theme="dark"] .media-review-context-heading {
  color: #ff9fd2;
}

.admin-app[data-theme="dark"] .media-review-hold-title,
.admin-app[data-theme="dark"] .media-review-signal {
  color: #ffb1d8;
}

.admin-app[data-theme="dark"] .media-review-signal {
  background: rgba(255, 124, 200, 0.13);
}

.admin-app[data-theme="dark"] .media-review-context-item {
  background: rgba(20, 27, 39, 0.76);
  border-left-color: #ff7cc8;
}

.admin-app[data-theme="dark"] .media-review-incidents-toggle {
  background: rgba(124, 92, 255, 0.14);
  border-color: rgba(180, 162, 255, 0.2);
  color: #b9a7ff;
}

.admin-app[data-theme="dark"] .media-review-incidents-row.is-expanded .media-review-incidents-toggle {
  background: rgba(255, 124, 200, 0.12);
  border-color: rgba(255, 124, 200, 0.25);
  color: #ff9fd2;
}

.admin-app[data-theme="dark"] .media-review-context-finding strong {
  color: #ff8a8a;
}

.admin-app[data-theme="dark"] .data-table th {
  background: #172131;
}

.admin-app[data-theme="dark"] .data-table tbody tr:hover {
  background: rgba(122, 167, 255, 0.08);
}

.admin-app[data-theme="dark"] .users-pagination-button {
  border-color: rgba(73, 88, 114, 0.82);
  background: rgba(10, 15, 25, 0.98);
  color: #aeb9cf;
}

.admin-app[data-theme="dark"] .users-pagination-button.is-active {
  border-color: rgba(132, 111, 255, 0.38);
  background: linear-gradient(180deg, rgba(39, 32, 68, 0.98), rgba(25, 29, 50, 0.98));
  color: #bdaeff;
}

.admin-app[data-theme="dark"] .dashboard-priority-sort-control {
  border-color: rgba(73, 88, 114, 0.82);
  background: rgba(10, 15, 25, 0.54);
}

.admin-app[data-theme="dark"] .message-bubble {
  border-color: rgba(143, 166, 220, 0.18);
  background:
    linear-gradient(180deg, rgba(29, 40, 59, 0.98), rgba(20, 30, 45, 0.98)),
    #1a2435;
  color: #edf4ff;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
}

.admin-app[data-theme="dark"] .conversation-shell {
  border-color: rgba(143, 166, 220, 0.14);
  background:
    radial-gradient(circle at top left, rgba(78, 111, 255, 0.14), transparent 32%),
    linear-gradient(180deg, rgba(12, 18, 29, 0.98), rgba(9, 14, 22, 0.98));
}

.admin-app[data-theme="dark"] .conversation-head {
  border-bottom-color: rgba(143, 166, 220, 0.16);
}

.admin-app[data-theme="dark"] .rich-message-kicker {
  background: rgba(112, 160, 255, 0.14);
  color: #9fc0ff;
}

.admin-app[data-theme="dark"] .message-row:not(.is-admin) .rich-message-content a {
  color: #9fc0ff;
}

.admin-app[data-theme="dark"] .message-attachment-card {
  background: #162235;
  border-color: #2b3850;
}

.admin-app[data-theme="dark"] .message-attachment-title {
  color: #f2f6ff;
}

.admin-app[data-theme="dark"] .message-action-button.is-secondary {
  background: #0f1622;
  color: #ebf1fc;
  border-color: #273346;
}

.admin-app[data-theme="dark"] .message-row.is-ai .message-bubble {
  background: linear-gradient(180deg, rgba(255, 225, 241, 0.98), rgba(255, 212, 234, 0.98));
  border-color: rgba(255, 143, 212, 0.34);
  color: #161c28;
}

.admin-app[data-theme="dark"] .message-row.is-ai .message-label {
  color: rgba(255, 185, 225, 0.88);
}

.admin-app[data-theme="dark"] .message-avatar {
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.3);
}

.admin-app[data-theme="dark"] .message-avatar.is-user {
  background: linear-gradient(135deg, #253249, #1d2839);
  color: #e4ebfb;
}

.admin-app[data-theme="dark"] .message-avatar.is-admin {
  background: linear-gradient(135deg, #4b7df0, #5d93ff);
  color: #ffffff;
}

.admin-app[data-theme="dark"] .message-avatar.is-ai {
  background: linear-gradient(135deg, #ffc8e7, #ffb4de);
  color: #161c28;
}

.admin-app[data-theme="dark"] .message-avatar.is-system {
  background: linear-gradient(135deg, #2b3443, #202937);
  color: #d8e1f3;
}

.admin-app[data-theme="dark"] .inbox-chat-presence {
  border-color: #161d2a;
}

.admin-app[data-theme="dark"] .conversation-stream,
.admin-app[data-theme="dark"] .scroll-region,
.admin-app[data-theme="dark"] .scroll-table-shell {
  scrollbar-color: rgba(112, 160, 255, 0.72) rgba(255, 255, 255, 0.08);
}

.admin-app[data-theme="dark"] .conversation-stream::-webkit-scrollbar-track,
.admin-app[data-theme="dark"] .scroll-region::-webkit-scrollbar-track,
.admin-app[data-theme="dark"] .scroll-table-shell::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.08);
}

.admin-app[data-theme="dark"] .conversation-stream::-webkit-scrollbar-thumb,
.admin-app[data-theme="dark"] .scroll-region::-webkit-scrollbar-thumb,
.admin-app[data-theme="dark"] .scroll-table-shell::-webkit-scrollbar-thumb {
  border-color: rgba(255, 255, 255, 0.06);
  background: linear-gradient(180deg, rgba(98, 142, 255, 0.8), rgba(133, 182, 255, 0.92));
}

.admin-app[data-theme="dark"] .inbox-conversation-history-controls {
  background: rgba(14, 21, 35, 0.86);
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.28), inset 0 0 0 1px rgba(167, 139, 250, 0.18);
}

.admin-app[data-theme="dark"] .inbox-conversation-previous-toggle,
.admin-app[data-theme="dark"] .inbox-conversation-latest-jump {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(238, 244, 255, 0.84);
  box-shadow: inset 0 0 0 1px rgba(196, 207, 227, 0.1);
}

.admin-app[data-theme="dark"] .inbox-conversation-history-jump {
  background: rgba(132, 92, 246, 0.24);
  color: #efe8ff;
  box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.28);
}

.admin-app[data-theme="dark"] .inbox-conversation-previous-toggle:hover,
.admin-app[data-theme="dark"] .inbox-conversation-previous-toggle:focus-visible,
.admin-app[data-theme="dark"] .inbox-conversation-history-jump:hover,
.admin-app[data-theme="dark"] .inbox-conversation-history-jump:focus-visible,
.admin-app[data-theme="dark"] .inbox-conversation-latest-jump:hover,
.admin-app[data-theme="dark"] .inbox-conversation-latest-jump:focus-visible {
  background: #ffffff;
  color: #07131d;
  box-shadow: 0 14px 28px rgba(255, 255, 255, 0.12);
}

.admin-app[data-theme="dark"] .message-row.is-system .message-bubble {
  background:
    linear-gradient(180deg, rgba(22, 31, 47, 0.96), rgba(15, 23, 36, 0.96)),
    #121a27;
  border-color: rgba(143, 166, 220, 0.18);
}

.admin-app[data-theme="dark"] .assistant-note-item {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 202, 233, 0.96);
}

.admin-app[data-theme="dark"] .toggle-switch {
  background: #253247;
}

.admin-app[data-theme="dark"] .storage-capacity-cleanup-button {
  background: #f4f6fb;
  border-color: rgba(244, 246, 251, 0.18);
  color: #111927;
}

.admin-app[data-theme="dark"] .storage-capacity-cleanup-button:hover {
  background: #ffffff;
  color: #111927;
}

.admin-app[data-theme="dark"] .toggle-switch::after {
  background: #eef3ff;
}

.admin-app[data-theme="dark"] .bar-track {
  background: #1c2737;
}

body[data-admin-theme="dark"] .admin-dialog-backdrop {
  background: rgba(3, 7, 13, 0.7);
}

body[data-admin-theme="dark"] .admin-dialog-card {
  border-color: rgba(53, 68, 90, 0.94);
  background: linear-gradient(180deg, rgba(20, 27, 39, 0.98), rgba(14, 20, 29, 0.98));
  color: #ebf1fc;
  box-shadow: 0 32px 84px rgba(0, 0, 0, 0.5);
}

body[data-admin-theme="dark"] .media-tracklist-album,
body[data-admin-theme="dark"] .media-tracklist-row,
body[data-admin-theme="dark"] .media-track-version-list,
body[data-admin-theme="dark"] .media-track-version-row,
body[data-admin-theme="dark"] .media-inspector-nav,
body[data-admin-theme="dark"] .media-inspector-inline-card,
body[data-admin-theme="dark"] .media-inspector-progress {
  background: rgba(15, 22, 34, 0.78);
  border-color: rgba(53, 68, 90, 0.94);
}

body[data-admin-theme="dark"] .media-track-version-row.is-removed {
  border-color: rgba(241, 174, 80, 0.34);
  background: rgba(62, 45, 27, 0.72);
}

body[data-admin-theme="dark"] .media-inspector-tab {
  color: #97a5bd;
}

body[data-admin-theme="dark"] .media-inspector-tab:hover,
body[data-admin-theme="dark"] .media-inspector-tab:focus-visible {
  color: #ebf1fc;
  background: rgba(22, 32, 47, 0.9);
  border-color: rgba(53, 68, 90, 0.94);
}

body[data-admin-theme="dark"] .admin-info-pill-card,
body[data-admin-theme="dark"] .media-inspector-setting-chip,
body[data-admin-theme="dark"] .media-inspector-stage,
body[data-admin-theme="dark"] .media-inspector-result-card {
  background: rgba(15, 22, 34, 0.78);
  border-color: rgba(53, 68, 90, 0.94);
}

body[data-admin-theme="dark"] .media-tracklist-cover {
  background: rgba(15, 22, 34, 0.86);
  border-color: rgba(53, 68, 90, 0.94);
}

body[data-admin-theme="dark"] .media-tracklist-number {
  background: rgba(124, 92, 255, 0.18);
  color: #b9a7ff;
}

body[data-admin-theme="dark"] .media-tracklist-tagline {
  color: #b9a7ff;
}

body[data-admin-theme="dark"] .admin-dialog-copy,
body[data-admin-theme="dark"] .admin-dialog-helper {
  color: #97a5bd;
}

body[data-admin-theme="dark"] .credit-grant-card {
  border-color: #273346;
  background: rgba(15, 22, 34, 0.9);
}

body[data-admin-theme="dark"] .admin-dialog-helper.is-error {
  color: #ef8181;
}

body[data-admin-theme="dark"] .admin-dialog-input,
body[data-admin-theme="dark"] .media-takedown-dialog-select,
body[data-admin-theme="dark"] .media-takedown-dialog-note,
body[data-admin-theme="dark"] .admin-dialog-card .admin-button.ghost {
  background: #0f1622;
  border-color: #273346;
  color: #ebf1fc;
}

body[data-admin-theme="dark"] .media-report-clear-option {
  border-color: rgba(77, 207, 176, 0.28);
  background: linear-gradient(135deg, rgba(45, 174, 145, 0.18), rgba(52, 95, 154, 0.12));
}

body[data-admin-theme="dark"] .media-report-clear-option small {
  color: #97a5bd;
}

body[data-admin-theme="dark"] .admin-dialog-ai-card {
  border-color: rgba(132, 91, 255, 0.28);
  background: linear-gradient(180deg, rgba(76, 55, 153, 0.34), rgba(30, 25, 54, 0.62));
}

body[data-admin-theme="dark"] .admin-dialog-ai-head span {
  color: #aa91ff;
}

body[data-admin-theme="dark"] .admin-dialog-ai-head strong,
body[data-admin-theme="dark"] .admin-dialog-ai-copy {
  color: #ebf1fc;
}

body[data-admin-theme="dark"] .admin-dialog-card .admin-button.warning {
  color: #ffcb83;
  border-color: rgba(224, 166, 82, 0.26);
}

body[data-admin-theme="dark"] .admin-dialog-card .admin-button.success {
  color: #b6e1bd;
  border-color: rgba(132, 196, 143, 0.26);
}

body[data-admin-theme="dark"] .admin-dialog-card.is-workspace-verify-dialog {
  border-color: rgba(54, 70, 95, 0.96);
  background:
    radial-gradient(circle at top left, rgba(103, 132, 250, 0.18), transparent 34%),
    linear-gradient(180deg, rgba(18, 24, 36, 0.985), rgba(12, 17, 27, 0.985));
}

body[data-admin-theme="dark"] .workspace-verify-icon {
  border-color: rgba(66, 82, 109, 0.92);
  background: linear-gradient(180deg, rgba(29, 39, 58, 0.98), rgba(20, 28, 43, 0.98));
  color: #b7c2d7;
  box-shadow: 0 18px 36px rgba(3, 7, 14, 0.34);
}

body[data-admin-theme="dark"] .workspace-verify-destination-label {
  color: #97a5bd;
}

body[data-admin-theme="dark"] .workspace-verify-destination-value {
  border-color: rgba(51, 66, 92, 0.98);
  background: rgba(14, 21, 33, 0.94);
  color: #eef3ff;
}

body[data-admin-theme="dark"] .workspace-verify-digit {
  border-color: rgba(81, 97, 123, 0.9);
  background: rgba(12, 18, 29, 0.98);
  color: #eff4ff;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.24);
}

body[data-admin-theme="dark"] .workspace-verify-digit:hover {
  border-color: rgba(109, 126, 154, 0.96);
}

body[data-admin-theme="dark"] .workspace-verify-digit:focus {
  border-color: rgba(111, 176, 255, 0.96);
  box-shadow:
    0 0 0 4px rgba(111, 176, 255, 0.17),
    0 16px 28px rgba(8, 14, 27, 0.42);
}

body[data-admin-theme="dark"] .admin-dialog-card.is-workspace-expiry-dialog {
  border-color: rgba(54, 70, 95, 0.96);
  background:
    radial-gradient(circle at top left, rgba(129, 112, 251, 0.2), transparent 34%),
    linear-gradient(180deg, rgba(18, 24, 36, 0.985), rgba(12, 17, 27, 0.985));
}

body[data-admin-theme="dark"] .workspace-warning-icon {
  border-color: rgba(66, 82, 109, 0.92);
  background: linear-gradient(180deg, rgba(29, 39, 58, 0.98), rgba(20, 28, 43, 0.98));
  color: #c0c9dd;
  box-shadow: 0 18px 36px rgba(3, 7, 14, 0.34);
}

body[data-admin-theme="dark"] .workspace-warning-label {
  color: #a685ff;
}

body[data-admin-theme="dark"] .workspace-warning-note,
body[data-admin-theme="dark"] .workspace-warning-countdown-label {
  color: #97a5bd;
}

body[data-admin-theme="dark"] .workspace-warning-countdown-shell {
  border-color: rgba(51, 66, 92, 0.98);
  background: rgba(14, 21, 33, 0.94);
}

body[data-admin-theme="dark"] .workspace-warning-countdown-value,
body[data-admin-theme="dark"] .workspace-warning-title {
  color: #eef3ff;
}

body[data-admin-theme="dark"] .inbox-thread-section-toggle {
  border-color: rgba(73, 88, 114, 0.72);
  background: linear-gradient(180deg, rgba(18, 25, 38, 0.98), rgba(13, 19, 31, 0.98));
  color: #edf3ff;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

body[data-admin-theme="dark"] .inbox-thread-tab {
  border-color: rgba(73, 88, 114, 0.72);
  background: linear-gradient(180deg, rgba(18, 25, 38, 0.98), rgba(13, 19, 31, 0.98));
  color: #aeb9cf;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.24);
}

body[data-admin-theme="dark"] .inbox-thread-tab.is-active {
  border-color: rgba(132, 111, 255, 0.38);
  background: linear-gradient(180deg, rgba(39, 32, 68, 0.98), rgba(25, 29, 50, 0.98));
  color: #bdaeff;
}

body[data-admin-theme="dark"] .inbox-thread-section-toggle.is-open {
  border-color: rgba(132, 111, 255, 0.34);
  background: linear-gradient(180deg, rgba(28, 31, 52, 0.98), rgba(19, 24, 39, 0.98));
}

body[data-admin-theme="dark"] .inbox-thread-section-count,
body[data-admin-theme="dark"] .inbox-chat-expand-button,
body[data-admin-theme="dark"] .inbox-history-icon-button {
  border-color: rgba(73, 88, 114, 0.82);
  background: rgba(10, 15, 25, 0.98);
  color: #aeb9cf;
}

body[data-admin-theme="dark"] .inbox-history-icon-button.is-mark-read {
  border-color: rgba(30, 180, 124, 0.26);
  background: linear-gradient(180deg, rgba(10, 41, 31, 0.98), rgba(8, 31, 24, 0.98));
  color: #67e7b3;
}

body[data-admin-theme="dark"] .inbox-history-icon-button.is-mark-unread {
  border-color: rgba(116, 132, 156, 0.34);
  background: linear-gradient(180deg, rgba(28, 37, 51, 0.98), rgba(17, 25, 38, 0.98));
  color: #c2cad8;
}

body[data-admin-theme="dark"] .inbox-history-icon-button.is-mark-unread:hover {
  border-color: rgba(148, 163, 184, 0.42);
  background: linear-gradient(180deg, rgba(35, 45, 61, 0.98), rgba(22, 31, 46, 0.98));
  color: #e2e8f0;
}

body[data-admin-theme="dark"] .inbox-thread-empty,
body[data-admin-theme="dark"] .inbox-history-empty,
body[data-admin-theme="dark"] .inbox-chat-item,
body[data-admin-theme="dark"] .inbox-history-row {
  border-color: rgba(68, 83, 108, 0.72);
  background: linear-gradient(180deg, rgba(16, 22, 35, 0.98), rgba(12, 18, 29, 0.98));
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24);
}

body[data-admin-theme="dark"] .inbox-chat-item.is-active,
body[data-admin-theme="dark"] .inbox-history-row.is-active {
  border-color: rgba(108, 154, 255, 0.38);
  background: linear-gradient(180deg, rgba(27, 38, 61, 0.98), rgba(18, 27, 45, 0.98));
}

body[data-admin-theme="dark"] .inbox-chat-name,
body[data-admin-theme="dark"] .inbox-history-title {
  color: #eef3ff;
}

body[data-admin-theme="dark"] .inbox-chat-preview,
body[data-admin-theme="dark"] .inbox-chat-time,
body[data-admin-theme="dark"] .inbox-history-date,
body[data-admin-theme="dark"] .inbox-chat-meta,
body[data-admin-theme="dark"] .inbox-history-meta {
  color: #97a5bd;
}

body[data-admin-theme="dark"] .inbox-chat-history {
  border-left-color: rgba(73, 88, 114, 0.9);
}

:root {
  --page-bg: #f5eff8;
  --panel-bg: #ffffff;
  --panel-soft: #faf6ff;
  --panel-muted: #f1ebfb;
  --line: #e7deef;
  --line-strong: #d8cae7;
  --text: #34384a;
  --muted: #8c90a6;
  --blue: #965cff;
  --blue-soft: rgba(150, 92, 255, 0.14);
  --green: #35c8b2;
  --green-soft: rgba(53, 200, 178, 0.14);
  --orange: #f2aa66;
  --orange-soft: rgba(242, 170, 102, 0.16);
  --red: #e5638c;
  --red-soft: rgba(229, 99, 140, 0.14);
  --shadow: 0 24px 56px rgba(132, 103, 171, 0.12);
}

.admin-app {
  --rail-width: 284px;
}

.admin-app[data-rail-collapsed="true"] {
  --rail-width: 92px;
}

.admin-rail {
  position: sticky;
  top: 0;
  height: 100vh;
  min-height: 100vh;
  gap: 16px;
  padding: 18px 16px 18px 18px;
  background:
    radial-gradient(circle at top right, rgba(150, 92, 255, 0.2), transparent 34%),
    radial-gradient(circle at bottom left, rgba(53, 200, 178, 0.14), transparent 28%),
    linear-gradient(180deg, #0f141d 0%, #0b1018 48%, #090c12 100%);
  border-right: 1px solid rgba(177, 196, 231, 0.08);
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.03);
  color: #afbad0;
  overflow: hidden;
  isolation: isolate;
}

.admin-rail::before {
  content: "";
  position: absolute;
  inset: 10px 10px 10px 8px;
  border-radius: 30px;
  border: 1px solid rgba(255, 255, 255, 0.04);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.admin-rail > * {
  position: relative;
  z-index: 1;
}

.admin-rail-top {
  justify-items: stretch;
  gap: 14px;
}

.admin-rail-bottom {
  justify-items: stretch;
  gap: 12px;
}

.admin-rail-collapse {
  width: 44px;
  height: 44px;
  justify-self: start;
  border-radius: 14px;
  border: 1px solid rgba(195, 213, 245, 0.12);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.04));
  color: #eef4ff;
  box-shadow: 0 10px 24px rgba(1, 5, 12, 0.22);
}

.admin-brand {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(18, 24, 35, 0.96), rgba(12, 17, 24, 0.98));
  border: 1px solid rgba(196, 214, 246, 0.1);
  color: #d3a7ff;
  text-decoration: none;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.2);
}

.admin-brand-mark {
  position: relative;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(150, 92, 255, 0.22), rgba(84, 153, 255, 0.14));
  box-shadow: inset 0 0 0 1px rgba(150, 92, 255, 0.26), 0 12px 26px rgba(55, 30, 96, 0.24);
}

.admin-brand-mark span {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 2px solid currentColor;
  border-radius: 10px;
}

.admin-brand-mark span:nth-child(1) {
  width: 22px;
  height: 16px;
  transform: translate(calc(-50% - 2px), calc(-50% - 3px));
}

.admin-brand-mark span:nth-child(2) {
  width: 18px;
  height: 14px;
  transform: translate(calc(-50% + 4px), calc(-50% + 2px));
  opacity: 0.7;
}

.admin-brand-mark span:nth-child(3) {
  width: 14px;
  height: 10px;
  transform: translate(calc(-50% - 6px), calc(-50% + 7px));
  opacity: 0.45;
}

.admin-brand-copy {
  display: grid;
  gap: 3px;
}

.admin-brand-word {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 1;
  color: #f6f8fd;
}

.admin-brand-sub {
  color: #8f9db7;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.admin-rail-profile {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 16px 14px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(18, 24, 35, 0.94), rgba(11, 16, 23, 0.98));
  border: 1px solid rgba(196, 214, 246, 0.1);
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.18);
}

.admin-profile-avatar,
.admin-session-avatar {
  width: 50px;
  height: 50px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(135deg, #8b60ff, #42d5c4);
  color: #ffffff;
  font-weight: 900;
  font-size: 1.15rem;
  box-shadow: 0 16px 28px rgba(64, 157, 191, 0.22);
}

.admin-profile-copy,
.admin-session-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.admin-profile-name {
  font-weight: 800;
  color: #f4f7fe;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-session-name {
  display: block;
  max-width: 100%;
  font-weight: 800;
  color: #223252;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-profile-meta {
  color: #97a5be;
  font-size: 0.88rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-session-meta {
  color: #7484a0;
  font-size: 0.88rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.admin-profile-status {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #3ed39f;
  box-shadow: 0 0 0 5px rgba(62, 211, 159, 0.16);
}

.admin-rail-nav-shell {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
}

.admin-rail-nav-shell::before,
.admin-rail-nav-shell::after {
  content: "";
  position: absolute;
  left: 1px;
  right: 5px;
  height: 34px;
  border-radius: 24px;
  pointer-events: none;
  z-index: 2;
  opacity: 0;
  transition: opacity 180ms ease;
}

.admin-rail-nav-shell::before {
  top: 1px;
  background: linear-gradient(180deg, rgba(11, 16, 24, 0.92), rgba(11, 16, 24, 0));
}

.admin-rail-nav-shell::after {
  bottom: 1px;
  background: linear-gradient(0deg, rgba(11, 16, 24, 0.94), rgba(11, 16, 24, 0));
}

.admin-rail-nav-shell[data-show-up="true"]::before,
.admin-rail-nav-shell[data-show-down="true"]::after {
  opacity: 1;
}

.admin-rail-nav {
  flex: 1 1 auto;
  min-height: 0;
  gap: 10px;
  padding: 10px 10px 12px 6px;
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.015));
  border: 1px solid rgba(196, 214, 246, 0.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(149, 171, 212, 0.34) transparent;
  scroll-behavior: smooth;
  scroll-snap-type: y proximity;
  scroll-padding-block: 10px;
}

.admin-rail-nav::-webkit-scrollbar {
  width: 10px;
}

.admin-rail-nav::-webkit-scrollbar-track {
  background: transparent;
}

.admin-rail-nav::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(150, 92, 255, 0.56), rgba(84, 153, 255, 0.44));
  background-clip: padding-box;
}

.admin-rail-nav-arrow {
  position: absolute;
  left: 50%;
  z-index: 3;
  width: 26px;
  height: 26px;
  display: none;
  place-items: center;
  border: 1px solid rgba(196, 214, 246, 0.18);
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(25, 32, 44, 0.96), rgba(11, 16, 24, 0.98));
  color: #dce6fb;
  box-shadow: 0 12px 22px rgba(0, 0, 0, 0.22);
  transform: translateX(-50%);
}

.admin-rail-nav-arrow.is-up {
  top: 8px;
}

.admin-rail-nav-arrow.is-down {
  bottom: 8px;
}

.admin-rail-nav-arrow svg {
  width: 13px;
  height: 13px;
  stroke: currentColor;
  stroke-width: 2.6;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-rail-button,
.admin-rail-link {
  position: relative;
  min-height: 58px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  justify-items: start;
  align-content: center;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid transparent;
  border-radius: 20px;
  text-align: left;
  font-weight: 700;
  background: rgba(255, 255, 255, 0.02);
  transition:
    transform 180ms ease,
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    color 180ms ease;
  scroll-snap-align: start;
}

.admin-rail-button::before {
  content: "";
  position: absolute;
  inset: 10px auto 10px 8px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(150, 92, 255, 0.92), rgba(84, 153, 255, 0.78));
  opacity: 0;
  transform: scaleY(0.3);
  transition: opacity 180ms ease, transform 180ms ease;
}

.admin-rail-link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 16px;
  border-color: rgba(196, 214, 246, 0.12);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025));
  color: #eef4ff;
}

.admin-rail-button:hover,
.admin-rail-link:hover {
  transform: translateX(2px);
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(150, 92, 255, 0.18);
  box-shadow: 0 14px 28px rgba(6, 10, 18, 0.2);
  color: #ffffff;
}

.admin-rail-button.is-active {
  background: linear-gradient(180deg, rgba(22, 29, 41, 0.98), rgba(18, 24, 34, 0.98));
  border-color: rgba(122, 167, 255, 0.22);
  color: #ffffff;
  box-shadow: 0 18px 34px rgba(4, 8, 18, 0.24), inset 0 0 0 1px rgba(122, 167, 255, 0.12);
}

.admin-rail-button.is-active::before {
  opacity: 1;
  transform: scaleY(1);
}

.admin-rail-icon {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.03));
  border: 1px solid rgba(196, 214, 246, 0.1);
  color: #dce6fb;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.admin-rail-icon svg {
  width: 24px;
  height: 24px;
  stroke-width: 2.15;
}

.admin-rail-label {
  font-size: 1rem;
  line-height: 1.2;
  letter-spacing: -0.01em;
}

.admin-rail-button.is-active .admin-rail-icon {
  background: linear-gradient(135deg, rgba(150, 92, 255, 0.26), rgba(84, 153, 255, 0.16));
  border-color: rgba(150, 92, 255, 0.24);
  color: #ffffff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 12px 20px rgba(84, 153, 255, 0.16);
}

.admin-rail-cta {
  margin-top: auto;
}

.admin-rail-cta-button {
  width: 100%;
  min-height: 50px;
  border: 1px solid rgba(196, 214, 246, 0.12);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(27, 36, 51, 0.98), rgba(16, 23, 34, 1));
  color: #ffffff;
  font-weight: 800;
  box-shadow: 0 18px 30px rgba(4, 8, 16, 0.2);
}

.admin-workspace {
  background: linear-gradient(180deg, #fcf9ff 0%, #f5eff8 220px, #f5eff8 100%);
}

.admin-header {
  gap: 24px;
  padding: 18px 28px;
  background: rgba(255, 255, 255, 0.88);
  border-bottom: 1px solid rgba(231, 222, 239, 0.9);
}

.admin-title {
  font-size: clamp(1.8rem, 3vw, 2.35rem);
  letter-spacing: -0.04em;
}

.admin-header-actions {
  justify-content: flex-end;
}

.admin-search-shell input,
.admin-text-input,
.admin-textarea,
.admin-button.ghost,
.admin-button.subtle,
.admin-theme-toggle,
.chip {
  background: rgba(255, 255, 255, 0.92);
}

.admin-button.primary {
  background: linear-gradient(135deg, #a76bff, #7c54ff);
  box-shadow: 0 16px 32px rgba(140, 95, 232, 0.2);
}

.admin-button.dark {
  background: #16191f;
}

.admin-header-quick-icons {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.admin-icon-button {
  position: relative;
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  color: var(--muted);
}

.admin-icon-button svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-icon-dot {
  position: absolute;
  top: 9px;
  right: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.admin-icon-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--blue);
  color: #ffffff;
  font-size: 0.72rem;
  font-weight: 800;
}

.admin-icon-badge.subtle {
  background: #ff7f9e;
}

.admin-session-pill {
  min-height: 52px;
  min-width: 0;
  max-width: min(100%, 360px);
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 0 16px 0 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow);
}

.admin-session-avatar {
  width: 38px;
  height: 38px;
}

.admin-status-banner {
  border-radius: 20px;
}

.admin-panels.is-dashboard-layout,
.admin-panels.is-payments-layout,
.admin-panels.is-analytics-layout,
.admin-panels.is-storage-layout,
.admin-panels.is-memberships-layout,
.admin-panels.is-system-layout,
.admin-panels.is-advertising-layout {
  display: block;
  padding: 26px 28px 34px;
  background: transparent;
}

.admin-panels.is-dashboard-layout .admin-panel-explorer,
.admin-panels.is-payments-layout .admin-panel-explorer,
.admin-panels.is-analytics-layout .admin-panel-explorer,
.admin-panels.is-storage-layout .admin-panel-explorer,
.admin-panels.is-memberships-layout .admin-panel-explorer,
.admin-panels.is-system-layout .admin-panel-explorer,
.admin-panels.is-advertising-layout .admin-panel-explorer {
  overflow: visible;
  background: transparent;
}

.admin-panels.is-dashboard-layout .admin-panel-canvas,
.admin-panels.is-dashboard-layout .admin-panel-detail,
.admin-panels.is-payments-layout .admin-panel-canvas,
.admin-panels.is-payments-layout .admin-panel-detail,
.admin-panels.is-analytics-layout .admin-panel-canvas,
.admin-panels.is-analytics-layout .admin-panel-detail,
.admin-panels.is-storage-layout .admin-panel-canvas,
.admin-panels.is-storage-layout .admin-panel-detail,
.admin-panels.is-memberships-layout .admin-panel-canvas,
.admin-panels.is-memberships-layout .admin-panel-detail,
.admin-panels.is-system-layout .admin-panel-canvas,
.admin-panels.is-system-layout .admin-panel-detail,
.admin-panels.is-advertising-layout .admin-panel-canvas,
.admin-panels.is-advertising-layout .admin-panel-detail {
  display: none;
}

.dashboard-workspace,
.payments-workspace,
.analytics-workspace,
.storage-workspace,
.memberships-workspace,
.system-workspace,
.advertising-admin-workspace {
  display: grid;
  gap: 22px;
}

.admin-panels.is-media-layout .admin-panel-explorer {
  grid-column: 1 / span 2;
}

.admin-panels.is-media-layout .admin-panel-detail {
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: hidden;
}

.admin-panels.is-media-layout .admin-panel-canvas {
  display: none;
}

.admin-panels.is-media-layout.is-media-wide-layout {
  grid-template-columns: minmax(0, 1fr);
}

.admin-panels.is-media-layout.is-media-wide-layout .admin-panel-explorer {
  grid-column: 1;
  overflow-x: hidden;
  scrollbar-gutter: stable;
}

.admin-panels.is-media-layout.is-media-wide-layout .admin-panel-detail {
  display: none;
}

.admin-panels.is-inbox-explorer-collapsed {
  grid-template-columns: 76px minmax(0, 1fr) minmax(350px, 413px);
}

.admin-panels.is-inbox-detail-collapsed {
  grid-template-columns: clamp(320px, var(--inbox-explorer-panel-width, 360px), 520px) minmax(0, 1fr) 52px;
}

.admin-panels.is-inbox-explorer-collapsed.is-inbox-detail-collapsed {
  grid-template-columns: 76px minmax(0, 1fr) 52px;
}

.admin-panels.is-inbox-explorer-collapsed .admin-panel-explorer {
  overflow: visible;
}

.admin-panels.is-settings-explorer-collapsed {
  grid-template-columns: 108px minmax(0, 1fr) minmax(350px, 413px);
}

.admin-panels.is-settings-explorer-collapsed .admin-panel-explorer {
  overflow: visible;
}

.admin-panels.is-settings-detail-collapsed {
  grid-template-columns: minmax(280px, 330px) minmax(0, 1fr) 52px;
}

.admin-panels.is-settings-explorer-collapsed.is-settings-detail-collapsed {
  grid-template-columns: 108px minmax(0, 1fr) 52px;
}

.admin-panels.is-users-detail-collapsed {
  grid-template-columns: minmax(280px, 330px) minmax(0, 1fr) 52px;
}

.dashboard-promo-banner,
.dashboard-card,
.analytics-card,
.analytics-toolbar,
.analytics-summary-card,
.analytics-footer-card {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow);
}

.dashboard-promo-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 24px 28px;
}

.dashboard-promo-copy {
  display: grid;
  gap: 8px;
}

.dashboard-promo-title {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--text);
}

.dashboard-promo-note {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.dashboard-section-head,
.dashboard-section-title-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.dashboard-section-title-wrap {
  justify-content: flex-start;
}

.dashboard-section-actions,
.dashboard-date-range-control {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.dashboard-section-actions {
  margin-left: auto;
}

.dashboard-date-range-control {
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}

.dashboard-date-range-button {
  min-width: 70px;
  white-space: nowrap;
}

.dashboard-priority-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.dashboard-priority-sort-control {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}

.dashboard-priority-sort-button {
  min-width: 76px;
  white-space: nowrap;
}

.dashboard-home-chip {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(135deg, #b36bff, #8758ff);
  color: #ffffff;
  box-shadow: 0 16px 30px rgba(135, 88, 255, 0.24);
}

.dashboard-home-chip svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dashboard-overview-link {
  border: 0;
  background: transparent;
  color: var(--text);
  font-weight: 700;
}

.dashboard-hero-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.dashboard-metric-carousel-card {
  display: grid;
  gap: 18px;
}

.dashboard-metric-carousel-head {
  align-items: center;
}

.dashboard-metric-carousel-copy {
  display: grid;
  gap: 6px;
}

.dashboard-metric-carousel-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.dashboard-metric-carousel-status {
  min-width: 120px;
  text-align: right;
  color: var(--muted);
  font-size: 0.88rem;
  font-weight: 700;
}

.dashboard-carousel-arrow {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.9);
  color: var(--text);
  font-size: 1.1rem;
  font-weight: 800;
  box-shadow: var(--shadow);
}

.dashboard-carousel-arrow:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  box-shadow: none;
}

.dashboard-metric-carousel-viewport {
  --dashboard-metric-gap: 16px;
  --dashboard-metric-visible: 1;
  overflow-x: auto;
  overflow-y: visible;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
}

.dashboard-metric-carousel-viewport::-webkit-scrollbar {
  display: none;
}

.dashboard-metric-carousel-track {
  display: flex;
  gap: var(--dashboard-metric-gap);
}

.dashboard-metric-carousel-item {
  flex: 0 0 calc((100% - ((var(--dashboard-metric-visible, 1) - 1) * var(--dashboard-metric-gap, 16px))) / var(--dashboard-metric-visible, 1));
  min-width: 0;
  min-height: 178px;
  align-content: start;
  scroll-snap-align: start;
}

.dashboard-metric-carousel-card.is-static .dashboard-metric-carousel-status {
  opacity: 0.78;
}

.dashboard-hero-card {
  position: relative;
  min-height: 252px;
  padding: 28px 28px 26px;
  overflow: hidden;
  border-radius: 20px;
  color: #ffffff;
  box-shadow: 0 22px 46px rgba(117, 98, 170, 0.2);
}

.dashboard-hero-card::before,
.dashboard-hero-card::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
}

.dashboard-hero-card::before {
  width: 160px;
  height: 160px;
  right: -32px;
  top: -18px;
}

.dashboard-hero-card::after {
  width: 190px;
  height: 190px;
  right: 34px;
  bottom: -94px;
  background: rgba(255, 255, 255, 0.14);
}

.dashboard-hero-card.tone-peach {
  background: linear-gradient(135deg, #ffb085, #ff7396);
}

.dashboard-hero-card.tone-blue {
  background: linear-gradient(135deg, #7bb7ff, #3691ed);
}

.dashboard-hero-card.tone-teal {
  background: linear-gradient(135deg, #5bd5cb, #2bc8a9);
}

.payments-ribbon {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 22px;
  border-radius: 24px;
  color: #ffffff;
  background: linear-gradient(92deg, #3475ff, #7c4dff);
  box-shadow: 0 18px 34px rgba(84, 79, 190, 0.24);
}

.payments-ribbon-copy,
.payments-toolbar-brand,
.payments-overview-column,
.payments-spotlight-card,
.payments-context-body {
  display: grid;
  gap: 8px;
}

.payments-ribbon-title {
  font-size: 1.03rem;
  font-weight: 800;
}

.payments-ribbon-note {
  margin: 0;
  max-width: 760px;
  color: rgba(255, 255, 255, 0.82);
  line-height: 1.55;
}

.payments-ribbon-actions,
.payments-toolbar-actions,
.payments-nav-row,
.payments-nav-links,
.payments-nav-meta,
.payments-greeting-row,
.payments-view-toggle,
.payments-spotlight-foot,
.payments-context-footer {
  display: flex;
  align-items: center;
  gap: 12px;
}

.payments-toolbar,
.payments-highlight-card,
.payments-summary-card,
.payments-insight-card,
.payments-context-card {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: var(--shadow);
}

.payments-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 22px;
}

.payments-toolbar-search {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 420px;
  max-width: 470px;
}

.payments-toolbar-search .admin-search-shell {
  flex: 1 1 auto;
  min-width: 0;
}

.payments-toolbar-brand {
  justify-items: center;
  text-align: center;
  min-width: 220px;
}

.payments-toolbar-wordmark {
  font-size: 1.95rem;
  font-weight: 900;
  letter-spacing: -0.05em;
  color: #58d3a7;
}

.payments-toolbar-meta {
  color: var(--muted);
  font-size: 0.88rem;
}

.payments-toolbar-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.payments-toolbar-chip,
.payments-nav-link {
  border: 1px solid rgba(124, 100, 255, 0.14);
  border-radius: 12px;
  background: rgba(124, 100, 255, 0.08);
  color: #6d5bd0;
  font: inherit;
  font-weight: 700;
  padding: 10px 14px;
  cursor: pointer;
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.payments-toolbar-user {
  color: var(--text);
  font-weight: 800;
  padding-left: 8px;
}

.payments-nav-row {
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 4px 2px 0;
}

.payments-nav-links {
  flex-wrap: wrap;
}

.payments-nav-link {
  background: #ffffff;
  color: var(--muted);
}

.payments-nav-link:hover,
.payments-nav-link:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(88, 211, 167, 0.28);
  color: var(--text);
  box-shadow: 0 12px 24px rgba(43, 54, 69, 0.08);
}

.payments-nav-link:focus-visible {
  outline: 2px solid rgba(88, 211, 167, 0.25);
  outline-offset: 3px;
}

.payments-nav-link.is-active {
  border-color: transparent;
  background: transparent;
  color: var(--text);
  box-shadow: inset 0 -3px 0 #58d3a7;
}

.payments-greeting-row {
  justify-content: space-between;
  flex-wrap: wrap;
}

.payments-view-button {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--muted);
  font: inherit;
  font-size: 0.9rem;
  font-weight: 900;
  padding: 8px 13px 8px 10px;
  box-shadow: var(--shadow);
  transition: transform 0.18s ease, border-color 0.18s ease, background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.payments-view-button:hover,
.payments-view-button:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(88, 211, 167, 0.38);
  color: var(--text);
  box-shadow: 0 14px 30px rgba(43, 54, 69, 0.12);
}

.payments-view-button:focus-visible {
  outline: 2px solid rgba(88, 211, 167, 0.28);
  outline-offset: 3px;
}

.payments-view-icon {
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  display: grid;
  place-content: center;
  border-radius: 10px;
  background: rgba(127, 140, 171, 0.12);
}

.payments-view-icon span {
  display: block;
  border-radius: 999px;
  background: #7f8cab;
}

.payments-view-icon--dashboard {
  grid-template-columns: repeat(2, 8px);
  gap: 4px;
}

.payments-view-icon--dashboard span {
  width: 8px;
  height: 8px;
}

.payments-view-icon--rows {
  gap: 4px;
}

.payments-view-icon--rows span {
  width: 16px;
  height: 4px;
}

.payments-view-button.is-active {
  border-color: rgba(88, 211, 167, 0.34);
  background: rgba(88, 211, 167, 0.12);
  color: var(--text);
}

.payments-view-button.is-active .payments-view-icon {
  background: rgba(88, 211, 167, 0.16);
}

.payments-view-button.is-active .payments-view-icon span {
  background: #58d3a7;
}

.payments-dashboard-view:not(.is-active) {
  display: none;
}

.payments-tab-view {
  display: grid;
  gap: 22px;
}

.payments-tab-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 22px;
  align-items: end;
  padding: 24px;
  overflow: hidden;
  border: 1px solid rgba(124, 100, 255, 0.12);
  border-radius: 28px;
  background:
    radial-gradient(circle at top right, rgba(88, 211, 167, 0.2), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(244, 247, 255, 0.94));
  box-shadow: var(--shadow);
}

.payments-tab-hero--memberships {
  background:
    radial-gradient(circle at top right, rgba(124, 100, 255, 0.2), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(243, 239, 255, 0.94));
}

.payments-tab-hero--charts {
  background:
    radial-gradient(circle at top right, rgba(76, 125, 240, 0.2), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(238, 246, 255, 0.94));
}

.payments-tab-hero--costs {
  background:
    radial-gradient(circle at top right, rgba(255, 157, 97, 0.22), transparent 34%),
    radial-gradient(circle at bottom left, rgba(88, 211, 167, 0.18), transparent 38%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(247, 244, 255, 0.94));
}

.payments-tab-hero--customers {
  background:
    radial-gradient(circle at top right, rgba(255, 157, 97, 0.22), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 247, 238, 0.94));
}

.payments-tab-hero--documentation {
  background:
    radial-gradient(circle at top right, rgba(88, 211, 167, 0.2), transparent 34%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(238, 255, 250, 0.94));
}

.payments-tab-hero-copy {
  display: grid;
  gap: 8px;
}

.payments-tab-eyebrow {
  color: var(--accent-strong);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.payments-tab-title {
  margin: 0;
  color: var(--text);
  font-size: 2.65rem;
  font-weight: 950;
  letter-spacing: 0;
  line-height: 0.98;
}

.payments-tab-note {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.55;
}

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

.payments-tab-stat {
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
}

.payments-tab-stat span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.payments-tab-stat strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 1.15rem;
  font-weight: 950;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.payments-tab-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
  align-items: stretch;
}

.payments-tab-card {
  min-width: 0;
  align-self: stretch;
}

.payments-tab-card--wide {
  grid-column: span 2;
}

.payments-tab-card--full {
  grid-column: 1 / -1;
}

.payments-customer-list {
  display: grid;
  gap: 12px;
}

.payments-customer-row {
  display: grid;
  grid-template-columns: minmax(210px, 1.15fr) minmax(240px, 1.35fr) minmax(180px, auto) minmax(130px, auto);
  gap: 16px;
  align-items: center;
  padding: 15px 16px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.76);
}

.payments-customer-name,
.payments-customer-plan {
  color: var(--text);
  font-weight: 900;
}

.payments-customer-meta,
.payments-customer-renewal span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.payments-customer-pill-group {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.payments-customer-renewal {
  display: grid;
  gap: 3px;
  text-align: right;
}

.payments-customer-renewal strong {
  color: var(--text);
  font-weight: 950;
}

.payments-doc-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.payments-doc-card {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 20px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: var(--shadow);
}

.payments-doc-card--wide {
  grid-column: span 2;
}

.payments-doc-card span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.payments-doc-card strong {
  color: var(--text);
  font-size: 1.2rem;
  font-weight: 950;
}

.payments-doc-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.payments-highlight-card.cost-overview-card {
  padding: 0;
  overflow: hidden;
}

.cost-overview-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.cost-overview-metric {
  position: relative;
  display: grid;
  min-width: 0;
  align-content: start;
  gap: 8px;
  padding: 20px;
  border-left: 1px solid rgba(143, 154, 179, 0.16);
  background: transparent;
}

.cost-overview-metric:first-child {
  border-left: 0;
}

.cost-overview-metric::after {
  content: "";
  position: absolute;
  right: 20px;
  bottom: 0;
  left: 20px;
  height: 3px;
  border-radius: 999px;
  background: rgba(143, 154, 179, 0.22);
}

.cost-overview-metric.is-coral::after {
  background: linear-gradient(90deg, #ff8a7a, #ff7396);
}

.cost-overview-metric.is-blue::after {
  background: linear-gradient(90deg, #4c7df0, #7c64ff);
}

.cost-overview-metric.is-green::after {
  background: linear-gradient(90deg, #58d3a7, #48c6c8);
}

.cost-overview-metric.is-gold::after,
.cost-overview-metric--job::after {
  background: linear-gradient(90deg, #ffc35a, #ff9a63);
}

.cost-overview-metric > span,
.cost-overview-metric-heading > span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.cost-overview-metric > strong,
.cost-overview-metric--job > div > strong {
  color: var(--text);
  font-size: clamp(1.35rem, 1.5vw, 1.85rem);
  font-weight: 950;
  letter-spacing: -0.03em;
}

.cost-overview-metric p,
.cost-overview-notes p {
  margin: 0;
  color: var(--muted);
  font-size: 0.8rem;
  line-height: 1.5;
}

.cost-overview-metric-heading {
  display: grid;
  gap: 8px;
}

.cost-overview-metric-heading .pill {
  width: fit-content;
  min-height: 24px;
  padding: 3px 8px;
  font-size: 0.66rem;
}

.cost-overview-metric--job > div:not(.cost-overview-metric-heading) {
  display: grid;
  gap: 3px;
}

.cost-overview-metric--job small {
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.35;
}

.cost-overview-notes {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.6fr);
  gap: 12px 24px;
  padding: 14px 20px;
  border-top: 1px solid rgba(143, 154, 179, 0.14);
  background: rgba(247, 244, 255, 0.42);
}

.cost-table-scroll {
  width: 100%;
  margin-top: 16px;
  overflow-x: auto;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 18px;
}

.cost-profit-section {
  padding: 0;
  overflow: hidden;
}

.cost-profit-summary {
  display: flex;
  gap: 20px;
  align-items: center;
  justify-content: space-between;
  min-height: 94px;
  padding: 20px 24px;
  cursor: pointer;
  list-style: none;
}

.cost-profit-margin-summary {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto auto;
  gap: 18px;
}

.cost-profit-summary-copy {
  min-width: 0;
}

.cost-profit-type-filters {
  display: flex;
  flex: 0 0 auto;
  gap: 6px;
  align-items: center;
  padding: 4px;
  border: 1px solid rgba(143, 154, 179, 0.14);
  border-radius: 999px;
  background: rgba(247, 244, 255, 0.72);
}

.cost-profit-type-filter {
  min-height: 32px;
  padding: 6px 11px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.76rem;
  font-weight: 900;
  cursor: pointer;
}

.cost-profit-type-filter.is-active {
  box-shadow: 0 6px 14px rgba(31, 38, 56, 0.1);
}

.cost-profit-type-filter.is-all.is-active {
  background: #202636;
  color: #ffffff;
}

.cost-profit-type-filter.is-purple.is-active {
  background: var(--purple-soft);
  color: var(--purple);
}

.cost-profit-type-filter.is-neutral.is-active {
  background: rgba(91, 101, 119, 0.14);
  color: #4b5568;
}

.cost-profit-type-filter.is-blue.is-active {
  background: var(--blue-soft);
  color: var(--blue);
}

.cost-profit-type-filter.is-orange.is-active {
  background: var(--orange-soft);
  color: #9a6a1f;
}

.cost-profit-type-filter:focus-visible {
  outline: 2px solid rgba(124, 100, 255, 0.38);
  outline-offset: 2px;
}

.cost-profit-summary::-webkit-details-marker {
  display: none;
}

.cost-profit-summary:focus-visible {
  outline: 3px solid rgba(124, 100, 255, 0.26);
  outline-offset: -4px;
}

.cost-profit-summary-meta,
.cost-profit-collapse-label,
.cost-profit-model-tabs,
.cost-profit-tier-filters,
.cost-profit-tier-filter {
  display: flex;
  align-items: center;
}

.cost-profit-summary-meta {
  flex: 0 0 auto;
  gap: 12px;
}

.cost-profit-collapse-label {
  gap: 8px;
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 900;
}

.cost-profit-label-closed {
  display: none;
}

.cost-profit-section:not([open]) .cost-profit-label-open {
  display: none;
}

.cost-profit-section:not([open]) .cost-profit-label-closed {
  display: inline;
}

.cost-profit-chevron {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-content: center;
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.1);
  color: #6d5bd0;
  font-size: 1rem;
  transform: rotate(180deg);
  transition: transform 0.18s ease;
}

.cost-profit-chevron::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}

.cost-profit-section:not([open]) .cost-profit-chevron {
  transform: rotate(0deg);
}

.cost-profit-body {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  contain: inline-size;
  padding: 0 24px 24px;
}

.cost-profit-margin-body {
  display: grid;
  gap: 14px;
}

.cost-profit-type-panel {
  min-width: 0;
  padding-top: 18px;
  border-top: 1px solid rgba(143, 154, 179, 0.16);
}

.cost-profit-type-panel[hidden] {
  display: none;
}

.cost-profit-type-heading {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0 2px 2px 14px;
  border-left: 3px solid var(--purple);
}

.cost-profit-type-panel--track .cost-profit-type-heading {
  border-left-color: var(--blue);
}

.cost-profit-type-panel--image .cost-profit-type-heading {
  border-left-color: #e9952c;
}

.cost-profit-type-heading h3 {
  margin: 0;
  color: var(--text);
  font-size: 1rem;
  font-weight: 950;
}

.cost-profit-type-heading p {
  max-width: 980px;
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.45;
}

.cost-profit-type-panel--album .cost-profit-model-tab.is-active {
  background: #7257e8;
}

.cost-profit-type-panel--track .cost-profit-model-tab.is-active {
  background: #386fd6;
}

.cost-profit-controls {
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 14px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 18px;
  background: rgba(247, 244, 255, 0.72);
}

.cost-profit-model-select {
  display: grid;
  grid-template-columns: auto minmax(220px, 360px);
  gap: 4px 10px;
  align-items: center;
  min-width: min(100%, 430px);
  color: var(--text);
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.cost-profit-model-select select {
  min-width: 0;
  min-height: 40px;
  padding: 8px 34px 8px 11px;
  border: 1px solid rgba(124, 100, 255, 0.2);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--text);
  font: inherit;
  font-size: 0.86rem;
  font-weight: 850;
  text-transform: none;
}

.cost-profit-model-select small {
  grid-column: 2;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.35;
  text-transform: none;
}

.cost-profit-model-select select:focus-visible {
  outline: 2px solid rgba(124, 100, 255, 0.36);
  outline-offset: 2px;
}

.cost-profit-unified-note {
  margin: 0 2px;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
}

.cost-profit-unified-note strong {
  color: var(--text);
}

.cost-profit-shared-note {
  display: flex;
  gap: 10px 18px;
  align-items: center;
  justify-content: space-between;
  padding: 13px 15px;
  border: 1px solid rgba(88, 211, 167, 0.2);
  border-radius: 16px;
  background: rgba(88, 211, 167, 0.1);
}

.cost-profit-shared-note strong {
  color: #138a68;
  font-size: 0.82rem;
  font-weight: 950;
  text-transform: uppercase;
}

.cost-profit-shared-note span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
  text-align: right;
}

.cost-profit-model-tabs {
  flex: 0 0 auto;
  gap: 4px;
  padding: 4px;
  border-radius: 14px;
  background: rgba(22, 28, 40, 0.07);
}

.cost-profit-model-tab {
  min-height: 38px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-size: 0.82rem;
  font-weight: 900;
  padding: 8px 13px;
  cursor: pointer;
}

.cost-profit-model-tab.is-active {
  background: #121722;
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(18, 23, 34, 0.15);
}

.cost-profit-model-tab:focus-visible,
.cost-profit-tier-filter:has(input:focus-visible) {
  outline: 2px solid rgba(124, 100, 255, 0.35);
  outline-offset: 2px;
}

.cost-profit-tier-filters {
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.cost-profit-tier-filters legend {
  margin-right: 3px;
  color: var(--muted);
  font-size: 0.75rem;
  font-weight: 900;
  text-transform: uppercase;
}

.cost-profit-tier-filter {
  gap: 7px;
  min-height: 38px;
  padding: 7px 11px;
  border: 1px solid rgba(124, 100, 255, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.82);
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 850;
  cursor: pointer;
}

.cost-profit-tier-filter input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #7c64ff;
}

.cost-table-scroll--profit {
  min-width: 0;
  max-width: 100%;
  max-height: 590px;
  overflow: auto;
  scrollbar-gutter: stable;
}

.cost-table-scroll--profit .cost-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f4f1ff;
  box-shadow: 0 1px 0 rgba(143, 154, 179, 0.16);
}

.cost-profit-unified-table {
  min-width: 1260px;
}

.cost-profit-unified-table tr[hidden] {
  display: none;
}

.cost-profit-unified-table td:first-child {
  box-shadow: inset 4px 0 0 transparent;
}

.cost-profit-unified-table .cost-profit-row--album td:first-child {
  box-shadow: inset 4px 0 0 #7c64ff;
}

.cost-profit-unified-table .cost-profit-row--track td:first-child {
  box-shadow: inset 4px 0 0 #697386;
}

.cost-profit-unified-table .cost-profit-row--image td:first-child {
  box-shadow: inset 4px 0 0 #e9952c;
}

.cost-profit-type-cell {
  min-width: 112px;
}

.cost-profit-type-badge {
  display: inline-flex;
  min-width: 72px;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 950;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.cost-profit-type-badge--album {
  background: var(--purple-soft);
  color: var(--purple);
}

.cost-profit-type-badge--track {
  background: rgba(91, 101, 119, 0.13);
  color: #4b5568;
}

.cost-profit-type-badge--image {
  background: var(--orange-soft);
  color: #9a6a1f;
}

.cost-profit-model-identity {
  display: grid;
  gap: 4px;
  min-width: 150px;
}

.cost-profit-model-identity strong {
  color: #6b52d8;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.78rem;
  overflow-wrap: anywhere;
}

.cost-profit-model-identity small {
  color: var(--muted);
  font-size: 0.74rem;
}

.cost-profit-model-group {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.cost-profit-model-group code,
.cost-model-id,
.admin-ai-model-id {
  width: fit-content;
  max-width: 100%;
  padding: 2px 6px;
  border-radius: 7px;
  background: rgba(124, 100, 255, 0.1);
  color: #6b52d8;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.72rem;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.cost-profit-table-footer {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: flex-end;
}

.cost-profit-empty-filter {
  margin: 10px auto 0 2px;
  color: var(--muted);
  font-size: 0.82rem;
}

.cost-profit-visible-note {
  margin: 10px 2px 0;
  color: var(--muted);
  font-size: 0.82rem;
  text-align: right;
}

.cost-table {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
  background: rgba(255, 255, 255, 0.7);
}

.cost-table[data-cost-table="provider"] {
  min-width: 1120px;
}

.cost-table-scroll--provider {
  max-height: calc((96px * 10) + 46px);
  max-height: var(--cost-provider-scroll-height, calc((96px * 10) + 46px));
  overflow: auto;
  scrollbar-gutter: stable;
}

.cost-table-scroll--provider .cost-table th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #f4f1ff;
  box-shadow: 0 1px 0 rgba(143, 154, 179, 0.16);
}

.cost-provider-models,
.cost-model-average-list {
  display: grid;
  gap: 4px;
  margin-top: 7px;
}

.cost-provider-models code,
.cost-model-average-list code,
.cost-provider-configuration {
  width: fit-content;
  max-width: 220px;
  overflow-wrap: anywhere;
  color: #6b52d8;
  font-size: 0.72rem;
}

.cost-provider-configuration {
  width: fit-content;
  padding: 2px 6px;
  border-radius: 7px;
  background: rgba(124, 100, 255, 0.1);
  font-weight: 800;
}

.cost-model-breakdown {
  display: grid;
  gap: 0;
  margin-top: 7px;
}

.cost-model-breakdown-line {
  display: flex;
  min-height: 42px;
  flex-direction: column;
  justify-content: center;
  padding: 6px 0;
  border-top: 1px solid rgba(143, 154, 179, 0.12);
}

.cost-provider-models .cost-model-breakdown-line {
  align-items: flex-start;
}

.cost-model-breakdown-line b {
  color: var(--text);
  font-size: 0.76rem;
  white-space: nowrap;
}

.cost-model-breakdown-line small {
  margin-top: 2px !important;
  font-size: 0.7rem !important;
}

.cost-operation-model-cell > strong {
  display: block;
}

.cost-average-details {
  margin-top: 9px;
}

.cost-average-details > summary {
  width: fit-content;
  padding: 5px 8px;
  border-radius: 9px;
  background: rgba(124, 100, 255, 0.08);
  color: #6d5bd0;
  font-size: 0.72rem;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.cost-average-details > summary::-webkit-details-marker {
  display: none;
}

.cost-average-label-open {
  display: none;
}

.cost-average-details[open] .cost-average-label-closed {
  display: none;
}

.cost-average-details[open] .cost-average-label-open {
  display: inline;
}

.cost-average-details > summary:focus-visible {
  outline: 2px solid rgba(124, 100, 255, 0.38);
  outline-offset: 2px;
}

.cost-table .cost-model-average-list > span {
  display: grid;
  grid-template-columns: minmax(100px, 1fr) auto;
  gap: 8px;
  align-items: baseline;
  padding-top: 3px;
  border-top: 1px solid rgba(143, 154, 179, 0.12);
}

.cost-table .cost-model-average-list .cost-model-average-heading {
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.cost-model-average-heading b {
  text-align: right;
}

.cost-model-average-list b {
  color: var(--text);
  font-size: 0.72rem;
  white-space: nowrap;
}

.cost-average-cell {
  min-width: 190px;
}

.payments-cost-stack > .payments-tab-card,
.payments-cost-stack > .cost-profit-section {
  grid-column: 1 / -1;
}

.payments-web-safety-bottom {
  margin-top: 0;
}

.cost-table th,
.cost-table td {
  padding: 13px 15px;
  border-bottom: 1px solid rgba(143, 154, 179, 0.14);
  color: var(--text);
  text-align: left;
  vertical-align: middle;
}

.cost-table th {
  background: rgba(124, 100, 255, 0.06);
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cost-table tr:last-child td {
  border-bottom: 0;
}

.cost-table td span,
.cost-table td small,
.cost-user-table td small {
  display: block;
}

.cost-table td small,
.cost-user-table td small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.cost-positive {
  color: #138a68;
}

.cost-negative {
  color: #d7425c;
}

.cost-assessment-list,
.cost-rate-list,
.cost-event-list {
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.cost-rate-list {
  max-height: 620px;
  padding-right: 3px;
  overflow: auto;
  scrollbar-gutter: stable;
}

.cost-assessment-list > div,
.cost-event-row {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 15px;
  background: rgba(255, 255, 255, 0.68);
}

.cost-assessment-list span {
  color: var(--text);
  font-weight: 850;
}

.cost-rate-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.68);
}

.cost-rate-row > div,
.cost-event-row > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.cost-rate-copy {
  position: relative;
}

.cost-rate-title {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.cost-rate-model-line {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.cost-rate-model-line > span {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.cost-rate-model-line code {
  padding: 3px 7px;
  border-radius: 8px;
  background: rgba(124, 100, 255, 0.1);
  color: #6b52d8;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.75rem;
  font-weight: 900;
}

.cost-rate-copy small b,
.admin-ai-rate-component {
  color: #6b52d8;
  font-weight: 950;
}

.cost-rate-source a {
  color: #6553c7;
  font-weight: 850;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.cost-rate-info {
  position: relative;
  display: inline-flex;
}

.cost-rate-info > summary {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(124, 100, 255, 0.24);
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.08);
  color: #6553c7;
  font-size: 0.72rem;
  font-weight: 950;
  cursor: pointer;
  list-style: none;
}

.cost-rate-info > summary::-webkit-details-marker {
  display: none;
}

.cost-rate-info[open] > div {
  position: absolute;
  z-index: 8;
  top: 28px;
  left: 0;
  width: min(360px, 72vw);
  padding: 12px;
  border: 1px solid rgba(124, 100, 255, 0.2);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: 0 14px 36px rgba(29, 25, 54, 0.18);
}

.cost-rate-info p {
  margin: 7px 0 0;
  color: var(--muted);
  font-size: 0.74rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.cost-rate-row strong,
.cost-event-row strong {
  color: var(--text);
  font-weight: 900;
}

.cost-rate-row small,
.cost-event-row small {
  color: var(--muted);
  font-size: 0.78rem;
}

.cost-rate-row label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(143, 154, 179, 0.28);
  border-radius: 12px;
  background: var(--surface);
}

.cost-rate-row label span {
  padding: 0 8px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
}

.cost-rate-row input[type="number"] {
  width: 100%;
  min-width: 0;
  padding: 9px;
  border: 0;
  border-left: 1px solid rgba(143, 154, 179, 0.2);
  background: transparent;
  color: var(--text);
  font: inherit;
}

.cost-event-row > div:last-child {
  flex: 0 0 auto;
  text-align: right;
}

.cost-table-toolbar {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  margin-top: 16px;
  padding: 13px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 16px;
  background: rgba(247, 244, 255, 0.72);
}

.cost-table-toolbar .cost-table-group-toggle {
  align-content: start;
}

.cost-table-group-choice {
  display: flex;
  min-height: 40px;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid rgba(143, 154, 179, 0.24);
  border-radius: 11px;
  background: var(--surface);
  color: var(--text) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.cost-table-group-choice input {
  width: 17px !important;
  min-width: 17px !important;
  min-height: 17px !important;
  padding: 0 !important;
  accent-color: #7c64ff;
}

.cost-table-group-toggle > small {
  color: var(--muted);
  font-size: 0.68rem;
  line-height: 1.3;
}

.cost-table-toolbar label {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.cost-table-toolbar label > span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.cost-table-toolbar select,
.cost-table-toolbar input {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 40px;
  padding: 9px 11px;
  border: 1px solid rgba(143, 154, 179, 0.24);
  border-radius: 11px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.84rem;
}

.cost-table-toolbar select:focus-visible,
.cost-table-toolbar input:focus-visible,
.cost-sort-button:focus-visible {
  outline: 2px solid rgba(124, 100, 255, 0.38);
  outline-offset: 2px;
}

.cost-sort-button {
  display: inline-flex;
  gap: 7px;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: inherit;
  cursor: pointer;
}

.cost-sort-button > span {
  position: relative;
  width: 8px;
  height: 14px;
  color: rgba(124, 100, 255, 0.42);
}

.cost-sort-button > span::before,
.cost-sort-button > span::after {
  position: absolute;
  left: 1px;
  font-size: 8px;
  line-height: 1;
}

.cost-sort-button > span::before {
  content: "\25B2";
  top: 0;
}

.cost-sort-button > span::after {
  content: "\25BC";
  bottom: 0;
}

.cost-sort-button[data-sort-direction="asc"] > span::before,
.cost-sort-button[data-sort-direction="desc"] > span::after {
  color: #6d5bd0;
}

.cost-sort-button[data-sort-direction="asc"] > span::after,
.cost-sort-button[data-sort-direction="desc"] > span::before {
  opacity: 0.25;
}

.cost-table-scroll--users {
  max-height: calc((66px * 20) + 44px);
  overflow: auto;
  scrollbar-gutter: stable;
}

.cost-table-scroll--users .cost-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: 0 1px 0 rgba(143, 154, 179, 0.16);
}

.cost-table-visible-note {
  margin: 10px 2px 0;
  color: var(--muted);
  font-size: 0.82rem;
  line-height: 1.45;
  text-align: right;
}

.cost-rate-heading {
  align-items: flex-start;
}

.cost-rate-heading .admin-button {
  flex: 0 0 auto;
}

.cost-rate-verification {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
  border: 1px solid rgba(124, 100, 255, 0.2);
  border-radius: 16px;
  background: rgba(124, 100, 255, 0.07);
}

.cost-rate-verification .detail-row small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.cost-rate-verification-list {
  display: grid;
  gap: 9px;
}

.cost-rate-verification-subhead {
  display: grid;
  gap: 3px;
  margin-top: 5px;
  padding-top: 11px;
  border-top: 1px solid rgba(124, 100, 255, 0.16);
}

.cost-rate-verification-subhead small {
  color: var(--muted);
  font-size: 0.76rem;
}

.cost-rate-verification-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 11px;
  border: 1px solid rgba(143, 154, 179, 0.16);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.76);
}

.cost-rate-verification-row > div:first-child {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.cost-rate-verification-row small,
.cost-rate-verification-row a {
  color: var(--muted);
  font-size: 0.76rem;
  line-height: 1.4;
}

.cost-rate-verification-row a {
  color: #6553c7;
  overflow-wrap: anywhere;
}

.cost-rate-verification-action {
  display: grid;
  gap: 8px;
  justify-items: end;
}

.cost-event-list--scroll {
  max-height: 620px;
  padding-right: 3px;
  overflow: auto;
  scrollbar-gutter: stable;
}

@media (max-width: 760px) {
  .cost-table-toolbar,
  .cost-table-toolbar--users {
    grid-template-columns: 1fr;
  }

  .cost-profit-summary {
    align-items: flex-start;
  }

  .cost-profit-summary-meta {
    flex-direction: column;
    align-items: flex-end;
  }

  .cost-rate-heading,
  .cost-rate-verification-row {
    display: grid;
    grid-template-columns: 1fr;
  }

  .cost-rate-heading {
    align-items: stretch;
  }

  .cost-rate-heading .admin-button {
    width: 100%;
  }

  .cost-rate-verification-action {
    justify-items: start;
  }
}

.payments-workspace.is-rows-layout .payments-summary-grid,
.payments-workspace.is-rows-layout .payments-highlight-grid,
.payments-workspace.is-rows-layout .payments-bottom-grid,
.payments-workspace.is-rows-layout .payments-tab-grid,
.payments-workspace.is-rows-layout .payments-doc-grid {
  grid-template-columns: 1fr;
}

.payments-workspace.is-rows-layout .payments-highlight-stack,
.payments-workspace.is-rows-layout .payments-spotlight-stack {
  display: grid;
  gap: 22px;
}

.payments-workspace.is-rows-layout .payments-highlight-grid .payments-membership-class-card,
.payments-workspace.is-rows-layout .payments-highlight-grid .payments-spotlight-card--primary,
.payments-workspace.is-rows-layout .payments-highlight-grid .payments-revenue-breakout-card,
.payments-workspace.is-rows-layout .payments-highlight-grid .payments-context-card:not(.payments-spotlight-mini-card),
.payments-workspace.is-rows-layout .payments-highlight-grid .payments-insight-card,
.payments-workspace.is-rows-layout .payments-highlight-grid .payments-spotlight-mini-card,
.payments-workspace.is-rows-layout .payments-tab-card--wide,
.payments-workspace.is-rows-layout .payments-doc-card--wide {
  grid-column: auto;
  grid-row: auto;
  height: auto;
}

.payments-workspace.is-rows-layout .payments-summary-card {
  min-height: 0;
  grid-template-columns: minmax(160px, 0.36fr) minmax(150px, 0.24fr) minmax(240px, 1fr);
  align-items: center;
  column-gap: 18px;
}

.payments-workspace.is-rows-layout .payments-summary-label {
  align-self: center;
}

.payments-workspace.is-rows-layout .payments-summary-meta {
  align-self: center;
}

.payments-workspace.is-rows-layout .payments-summary-accent,
.payments-workspace.is-rows-layout .payments-summary-progress {
  grid-column: 1 / -1;
  margin-top: 2px;
}

.payments-highlight-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(320px, 1fr);
  gap: 22px;
  align-items: stretch;
}

.payments-highlight-stack {
  display: contents;
  min-width: 0;
}

.payments-highlight-card,
.payments-insight-card,
.payments-context-card {
  padding: 22px;
  display: grid;
  gap: 18px;
}

.payments-highlight-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.payments-highlight-columns--duo {
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
  align-items: start;
}

.payments-spotlight-stack {
  display: contents;
  min-width: 0;
}

.payments-highlight-grid .payments-membership-class-card {
  grid-column: 1 / span 2;
  grid-row: 1;
}

.payments-highlight-grid .payments-spotlight-card--primary {
  grid-column: 3;
  grid-row: 1;
}

.payments-highlight-grid .payments-revenue-breakout-card {
  grid-column: 1 / span 2;
  grid-row: 2;
}

.payments-highlight-grid .payments-context-card:not(.payments-spotlight-mini-card) {
  grid-column: 3;
  grid-row: 2;
}

.payments-highlight-grid .payments-insight-card {
  grid-column: 1 / span 2;
  grid-row: 3;
}

.payments-highlight-grid .payments-spotlight-mini-card {
  grid-column: 3;
  grid-row: 3;
}

.payments-highlight-grid .payments-highlight-card,
.payments-highlight-grid .payments-spotlight-card,
.payments-highlight-grid .payments-context-card,
.payments-highlight-grid .payments-insight-card {
  height: 100%;
  align-self: stretch;
}

.payments-column-title {
  margin: 0;
  color: var(--text);
  font-size: 1.05rem;
  font-weight: 800;
}

.payments-column-note,
.payments-difference-meta,
.payments-stat-meta,
.payments-stat-foot,
.payments-summary-meta {
  color: var(--muted);
  line-height: 1.55;
  font-size: 0.9rem;
}

.payments-difference-list,
.payments-stat-list,
.payments-rank-list,
.payments-side-stack {
  display: grid;
  gap: 14px;
}

.payments-difference-row,
.payments-rank-row,
.payments-stat-row {
  display: grid;
  gap: 8px;
}

.payments-difference-head,
.payments-rank-head,
.payments-stat-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.payments-difference-label,
.payments-rank-label,
.payments-stat-label {
  color: var(--text);
  font-weight: 800;
}

.payments-difference-value,
.payments-rank-value,
.payments-stat-value {
  color: var(--text);
  font-weight: 900;
}

.payments-difference-track,
.payments-rank-track,
.payments-stat-track,
.payments-summary-progress {
  height: 10px;
  border-radius: 999px;
  background: rgba(121, 135, 165, 0.16);
  overflow: hidden;
}

.payments-difference-fill,
.payments-rank-fill,
.payments-stat-fill,
.payments-summary-progress-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
}

.payments-rank-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.payments-rank-note,
.payments-rank-meta {
  color: var(--muted);
  line-height: 1.5;
  font-size: 0.9rem;
}

.payments-rank-track {
  height: 12px;
}

.payments-rank-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.payments-rank-share {
  color: var(--text);
  font-weight: 900;
}

.payments-difference-fill.tone-0,
.payments-summary-accent.is-blue,
.payments-summary-progress-fill.is-blue {
  background: linear-gradient(90deg, #4d5cff, #7a63ff);
}

.payments-difference-fill.tone-1 {
  background: linear-gradient(90deg, #44c4ff, #60a8ff);
}

.payments-difference-fill.tone-2,
.payments-summary-accent.is-coral,
.payments-summary-progress-fill.is-coral {
  background: linear-gradient(90deg, #ff8c73, #ff6c96);
}

.payments-difference-fill.tone-3,
.payments-summary-accent.is-green,
.payments-summary-progress-fill.is-green {
  background: linear-gradient(90deg, #58d3a7, #43c7c4);
}

.payments-stat-fill.is-monthly {
  background: linear-gradient(90deg, #6585ff, #4769ff);
}

.payments-stat-fill.is-yearly {
  background: linear-gradient(90deg, #58d3a7, #42c49d);
}

.payments-stat-fill.is-free,
.payments-summary-accent.is-gold,
.payments-summary-progress-fill.is-gold {
  background: linear-gradient(90deg, #ffc85d, #ff9d61);
}

.payments-membership-snapshot-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.payments-membership-snapshot-card {
  display: grid;
  gap: 6px;
  padding: 16px 16px 14px;
  border-radius: 18px;
  border: 1px solid rgba(124, 100, 255, 0.12);
  background: linear-gradient(180deg, rgba(124, 100, 255, 0.06), rgba(255, 255, 255, 0.96));
}

.payments-membership-snapshot-card.is-monthly {
  border-color: rgba(83, 111, 255, 0.16);
  background: linear-gradient(180deg, rgba(83, 111, 255, 0.08), rgba(255, 255, 255, 0.98));
}

.payments-membership-snapshot-card.is-yearly {
  border-color: rgba(88, 211, 167, 0.18);
  background: linear-gradient(180deg, rgba(88, 211, 167, 0.08), rgba(255, 255, 255, 0.98));
}

.payments-membership-snapshot-card.is-free {
  border-color: rgba(255, 173, 93, 0.2);
  background: linear-gradient(180deg, rgba(255, 200, 93, 0.12), rgba(255, 255, 255, 0.98));
}

.payments-membership-snapshot-card.is-hybrid {
  border-color: rgba(167, 119, 255, 0.18);
  background: linear-gradient(180deg, rgba(167, 119, 255, 0.1), rgba(255, 255, 255, 0.98));
}

.payments-membership-snapshot-label {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.payments-membership-snapshot-value {
  color: var(--text);
  font-size: 1.55rem;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.payments-membership-snapshot-meta,
.payments-membership-snapshot-note {
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.45;
}

.payments-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.payments-summary-card {
  position: relative;
  min-height: 152px;
  padding: 20px 20px 18px;
  display: grid;
  gap: 10px;
  overflow: hidden;
}

.payments-summary-card.is-gradient-indigo {
  color: #ffffff;
  border: 0;
  background: linear-gradient(135deg, #4b54ff, #6a45f5);
  box-shadow: 0 18px 38px rgba(84, 82, 228, 0.26);
}

.payments-summary-card.is-gradient-indigo .payments-summary-meta,
.payments-summary-card.is-gradient-indigo .payments-summary-label {
  color: rgba(255, 255, 255, 0.84);
}

.payments-summary-label {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--muted);
}

.payments-summary-value {
  color: var(--text);
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.payments-summary-card.is-gradient-indigo .payments-summary-value {
  color: #ffffff;
}

.payments-summary-accent {
  width: 100%;
  height: 4px;
  margin-top: auto;
  border-radius: 999px;
}

.payments-bottom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(320px, 0.9fr);
  gap: 22px;
}

.payments-bottom-grid.is-single {
  grid-template-columns: minmax(0, 1fr);
}

.payments-spotlight-card {
  position: relative;
  min-height: 0;
  padding: 26px 24px;
  color: #ffffff;
  overflow: hidden;
  border-radius: 24px;
  background: linear-gradient(135deg, #57dbc6, #7de0c8);
  box-shadow: 0 22px 42px rgba(60, 178, 162, 0.22);
}

.payments-spotlight-card--primary {
  min-height: 260px;
}

.payments-spotlight-card::before,
.payments-spotlight-card::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
}

.payments-spotlight-card::before {
  width: 160px;
  height: 160px;
  top: -50px;
  right: -36px;
}

.payments-spotlight-card::after {
  width: 180px;
  height: 180px;
  bottom: -92px;
  left: -40px;
  background: rgba(255, 255, 255, 0.12);
}

.payments-spotlight-badge,
.payments-context-location {
  font-size: 0.86rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.payments-spotlight-title {
  margin: 0;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1.05;
}

.payments-spotlight-metric,
.payments-context-temp {
  font-size: 2.35rem;
  font-weight: 900;
  letter-spacing: -0.05em;
}

.payments-spotlight-note,
.payments-context-weather,
.payments-context-time {
  margin: 0;
  color: rgba(255, 255, 255, 0.86);
  line-height: 1.6;
}

.payments-spotlight-foot {
  justify-content: space-between;
  color: rgba(255, 255, 255, 0.84);
  font-size: 0.9rem;
  flex-wrap: wrap;
}

.payments-spotlight-mini-card {
  align-content: start;
  gap: 16px;
}

.payments-mini-title {
  margin: 4px 0 0;
  color: var(--text);
  font-size: 1.15rem;
  font-weight: 800;
}

.payments-mini-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.payments-mini-stat {
  display: grid;
  gap: 6px;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(124, 100, 255, 0.08);
  border: 1px solid rgba(124, 100, 255, 0.12);
}

.payments-mini-stat-label {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.payments-mini-stat-value {
  color: var(--text);
  font-size: 1.65rem;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.payments-spotlight-mini-card .payments-spotlight-foot {
  margin-top: 2px;
  color: var(--muted);
}

.payments-context-card {
  align-content: start;
}

.payments-context-body {
  min-height: 160px;
  align-content: start;
}

.payments-context-time {
  color: var(--muted);
}

.payments-context-temp {
  color: var(--text);
}

.payments-context-temp small {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
}

.payments-context-weather {
  color: var(--muted);
}

.payments-context-footer {
  gap: 1px;
  margin-top: auto;
  overflow: hidden;
  border-radius: 18px;
  background: rgba(88, 97, 210, 0.08);
}

.payments-context-stat {
  flex: 1 1 0;
  display: grid;
  gap: 4px;
  padding: 18px 16px;
  text-align: center;
  color: #ffffff;
  background: linear-gradient(135deg, #4b54ff, #6b49f4);
}

.payments-context-stat strong {
  font-size: 1.75rem;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.payments-context-stat span {
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.88rem;
}

.dashboard-hero-top,
.dashboard-hero-icon,
.dashboard-chart-legend,
.dashboard-legend-item,
.donut-legend-copy,
.analytics-breadcrumbs,
.analytics-links,
.analytics-toolbar,
.analytics-toolbar-segment,
.analytics-chart-tabs,
.analytics-summary-card {
  display: flex;
  align-items: center;
}

.dashboard-hero-top {
  justify-content: space-between;
  gap: 16px;
}

.dashboard-hero-label {
  font-size: 1.05rem;
  font-weight: 700;
}

.dashboard-hero-value {
  position: relative;
  z-index: 1;
  margin-top: 26px;
  font-size: clamp(2rem, 3vw, 2.55rem);
  font-weight: 900;
  letter-spacing: -0.04em;
}

.dashboard-hero-meta {
  position: relative;
  z-index: 1;
  margin-top: 30px;
  font-weight: 700;
  opacity: 0.96;
}

.dashboard-hero-icon {
  position: relative;
  z-index: 1;
  width: 34px;
  height: 34px;
  justify-content: center;
}

.dashboard-hero-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  color: inherit;
  cursor: pointer;
  transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.dashboard-hero-action:hover,
.dashboard-hero-action:focus-visible {
  transform: translateY(-1px);
  background: rgba(255, 255, 255, 0.18);
  box-shadow: 0 10px 22px rgba(34, 28, 62, 0.14);
}

.dashboard-hero-action:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.78);
  outline-offset: 2px;
}

.dashboard-hero-icon svg {
  width: 26px;
  height: 26px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dashboard-insight-stack {
  display: grid;
  gap: 18px;
}

.dashboard-insight-metric-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.dashboard-insight-card {
  align-content: start;
}

.analytics-insight-metric-card {
  min-height: 154px;
}

.analytics-insight-metric-label {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-bottom: 10px;
}

.analytics-insight-metric-value {
  font-size: clamp(2rem, 3vw, 2.6rem);
  font-weight: 800;
  color: var(--text);
  line-height: 1;
  margin-bottom: 10px;
}

.dashboard-insight-split-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.dashboard-order-source-chart {
  display: grid;
  gap: 14px;
}

.dashboard-order-source-row {
  display: grid;
  gap: 7px;
}

.dashboard-order-source-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text);
  font-size: 0.92rem;
}

.dashboard-order-source-label {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  color: var(--muted);
  font-weight: 800;
}

.dashboard-order-source-swatch {
  width: 11px;
  height: 11px;
  flex: 0 0 11px;
  border-radius: 50%;
}

.dashboard-order-source-track {
  height: 12px;
  border-radius: 999px;
  background: rgba(141, 150, 176, 0.14);
  overflow: hidden;
}

.dashboard-order-source-fill {
  display: block;
  height: 100%;
  min-width: 8px;
  border-radius: inherit;
  box-shadow: 0 8px 18px rgba(42, 51, 72, 0.12);
}

.dashboard-order-source-meta {
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.35;
}

.dashboard-insight-table-wrap {
  overflow: auto;
  border: 1px solid rgba(220, 226, 234, 0.9);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.88);
}

.dashboard-insight-table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
}

.dashboard-insight-table th,
.dashboard-insight-table td {
  padding: 14px 16px;
  border-bottom: 1px solid rgba(220, 226, 234, 0.88);
  text-align: left;
  vertical-align: top;
}

.dashboard-insight-table th {
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  background: rgba(246, 248, 252, 0.92);
}

.dashboard-insight-table td {
  color: var(--text);
  font-weight: 600;
}

.dashboard-insight-table tbody tr:last-child td {
  border-bottom: 0;
}

.dashboard-insight-table .is-right {
  text-align: right;
}

.dashboard-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(320px, 0.92fr);
  gap: 20px;
}

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

.dashboard-card,
.analytics-card {
  padding: 22px 24px;
}

.dashboard-chart-card {
  display: flex;
  flex-direction: column;
}

.dashboard-chart-card .timeline-shell {
  margin-top: auto;
}

.dashboard-chart-legend,
.dashboard-legend-item {
  gap: 10px;
}

.dashboard-chart-legend {
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 0.88rem;
}

.dashboard-legend-swatch,
.donut-legend-swatch {
  display: inline-block;
  border-radius: 50%;
}

.dashboard-legend-swatch {
  width: 12px;
  height: 12px;
}

.dashboard-legend-swatch.is-purple {
  background: linear-gradient(180deg, #7c64ff, #9b74ff);
}

.dashboard-legend-swatch.is-coral {
  background: linear-gradient(180deg, #ff9180, #fb6f92);
}

.dashboard-legend-swatch.is-blue {
  background: linear-gradient(180deg, #64c4ff, #4792ff);
}

.donut-summary {
  display: grid;
  gap: 24px;
  justify-items: center;
}

.donut-ring {
  width: 192px;
  height: 192px;
  display: grid;
  place-items: center;
  border-radius: 50%;
}

.donut-ring-hole {
  width: 110px;
  height: 110px;
  display: grid;
  place-items: center;
  gap: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text);
  text-align: center;
  box-shadow: inset 0 0 0 1px rgba(231, 222, 239, 0.7);
}

.donut-ring-hole strong {
  font-size: 1.3rem;
}

.donut-ring-hole span {
  color: var(--muted);
  font-size: 0.82rem;
}

.donut-legend {
  width: 100%;
  display: grid;
  gap: 12px;
}

.donut-legend-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.donut-legend-row.is-toggle {
  width: 100%;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: inherit;
  cursor: pointer;
  font: inherit;
  padding: 7px 8px;
  text-align: left;
  transition: border-color 160ms ease, background 160ms ease, opacity 160ms ease;
}

.donut-legend-row.is-toggle:hover,
.donut-legend-row.is-toggle:focus-visible {
  border-color: var(--line);
  background: rgba(124, 100, 255, 0.08);
  outline: none;
}

.donut-legend-row.is-muted {
  opacity: 0.48;
}

.donut-legend-row.is-muted .donut-legend-copy span:last-child {
  text-decoration: line-through;
}

.donut-legend-copy {
  gap: 10px;
  color: var(--muted);
}

.donut-legend-swatch {
  width: 11px;
  height: 11px;
}

.analytics-subnav,
.analytics-toolbar,
.analytics-main-grid,
.analytics-metric-footer {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
}

.analytics-subnav {
  padding: 0 6px;
}

.analytics-breadcrumbs,
.analytics-links {
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 0.94rem;
}

.analytics-breadcrumb-button {
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: color 180ms ease, text-decoration-color 180ms ease;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
  text-decoration-color: transparent;
}

.analytics-breadcrumb-button:hover,
.analytics-breadcrumb-button:focus-visible {
  color: var(--text);
  text-decoration-color: currentColor;
}

.analytics-breadcrumb-button.is-active {
  color: var(--text);
  font-weight: 800;
  text-decoration-color: currentColor;
}

.analytics-link-button,
.analytics-toolbar-link {
  border: 0;
  background: transparent;
  color: inherit;
  font-weight: 700;
}

.analytics-link-button.is-active {
  color: var(--text);
}

.analytics-toolbar {
  flex-wrap: wrap;
  padding: 14px 18px;
}

.analytics-toolbar-pill,
.analytics-toolbar-export,
.analytics-window-button {
  min-height: 42px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #f4f7fb;
  color: var(--text);
  font-weight: 700;
}

.analytics-toolbar-export {
  background: #eef3f8;
}

.analytics-toolbar-segment,
.analytics-chart-tabs {
  gap: 8px;
  flex-wrap: wrap;
}

.analytics-window-button.is-active {
  background: linear-gradient(135deg, #7db6ff, #4794ff);
  border-color: transparent;
  color: #ffffff;
}

.analytics-window-button.is-compact {
  min-height: 34px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 0.84rem;
}

.analytics-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 18px;
}

.analytics-metric-footer {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 18px;
}

.analytics-summary-card {
  justify-content: space-between;
  gap: 14px;
  padding: 18px 18px 16px;
}

.analytics-summary-card::before {
  content: "";
  width: 5px;
  align-self: stretch;
  border-radius: 999px;
  background: #5b8cff;
}

.analytics-summary-card.tone-purple::before {
  background: #8a63ff;
}

.analytics-summary-card.tone-green::before {
  background: #35c8a0;
}

.analytics-summary-card.tone-teal::before {
  background: #34c8b0;
}

.analytics-summary-card.tone-coral::before {
  background: #ff8f7d;
}

.analytics-summary-copy {
  display: grid;
  gap: 6px;
}

.analytics-summary-value {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.analytics-summary-label {
  color: #5790ff;
  font-weight: 800;
}

.analytics-summary-card.tone-purple .analytics-summary-label {
  color: #8a63ff;
}

.analytics-summary-card.tone-green .analytics-summary-label {
  color: #27b592;
}

.analytics-summary-card.tone-teal .analytics-summary-label {
  color: #28ba9f;
}

.analytics-summary-card.tone-coral .analytics-summary-label {
  color: #ff8b78;
}

.analytics-summary-delta {
  color: var(--muted);
  font-size: 0.88rem;
}

.analytics-summary-spark {
  min-width: 132px;
}

.analytics-sparkline {
  width: 132px;
  height: 44px;
}

.analytics-sparkline-empty {
  color: var(--muted);
  font-size: 0.84rem;
}

.analytics-main-grid {
  align-items: stretch;
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.9fr);
}

.analytics-data-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.analytics-catalog-card {
  display: grid;
  gap: 18px;
}

.analytics-catalog-head {
  align-items: flex-start;
  gap: 16px;
}

.analytics-catalog-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.12);
  color: #7c64ff;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.analytics-catalog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.analytics-catalog-groups {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.96fr);
  gap: 18px;
}

.analytics-catalog-group {
  display: grid;
  gap: 16px;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(247, 244, 255, 0.72));
}

.analytics-catalog-group-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.analytics-catalog-group-title {
  margin: 0;
  color: var(--text);
  font-size: 1rem;
  font-weight: 800;
}

.analytics-catalog-group-note {
  margin: 6px 0 0;
  color: var(--muted);
  line-height: 1.55;
}

.analytics-catalog-group-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.1);
  color: #7c64ff;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.analytics-catalog-grid--engagement,
.analytics-catalog-grid--moderation {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.analytics-catalog-metric {
  position: relative;
  min-height: 0;
  overflow: hidden;
  border-color: rgba(136, 145, 175, 0.18);
  background: rgba(255, 255, 255, 0.9);
}

.analytics-catalog-metric::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.26);
}

.analytics-catalog-metric .analytics-footer-value,
.analytics-catalog-metric .analytics-footer-label {
  color: var(--text);
}

.analytics-catalog-metric.is-pink {
  border-color: rgba(234, 94, 162, 0.2);
  background: linear-gradient(180deg, rgba(255, 240, 247, 0.88), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-pink::before {
  background: linear-gradient(180deg, #f2619f, #e24887);
}

.analytics-catalog-metric.is-pink .analytics-footer-value,
.analytics-catalog-metric.is-pink .analytics-footer-label {
  color: #df4c8c;
}

.analytics-catalog-metric.is-blue {
  border-color: rgba(82, 134, 255, 0.2);
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.9), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-blue::before {
  background: linear-gradient(180deg, #5f87ff, #4a6df0);
}

.analytics-catalog-metric.is-blue .analytics-footer-value,
.analytics-catalog-metric.is-blue .analytics-footer-label {
  color: #4f6ff0;
}

.analytics-catalog-metric.is-green {
  border-color: rgba(62, 197, 153, 0.22);
  background: linear-gradient(180deg, rgba(236, 255, 248, 0.92), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-green::before {
  background: linear-gradient(180deg, #3cc9a0, #23ae86);
}

.analytics-catalog-metric.is-green .analytics-footer-value,
.analytics-catalog-metric.is-green .analytics-footer-label {
  color: #25ad86;
}

.analytics-catalog-metric.is-gold {
  border-color: rgba(232, 163, 61, 0.2);
  background: linear-gradient(180deg, rgba(255, 249, 237, 0.92), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-gold::before {
  background: linear-gradient(180deg, #efb34f, #df8d2e);
}

.analytics-catalog-metric.is-gold .analytics-footer-value,
.analytics-catalog-metric.is-gold .analytics-footer-label {
  color: #b0741c;
}

.analytics-catalog-metric.is-purple {
  border-color: rgba(124, 100, 255, 0.18);
  background: linear-gradient(180deg, rgba(245, 241, 255, 0.92), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-purple::before {
  background: linear-gradient(180deg, #8f71ff, #6b55ea);
}

.analytics-catalog-metric.is-purple .analytics-footer-value,
.analytics-catalog-metric.is-purple .analytics-footer-label {
  color: #705ae7;
}

.analytics-catalog-metric.is-orange {
  border-color: rgba(231, 146, 48, 0.22);
  background: linear-gradient(180deg, rgba(255, 246, 235, 0.92), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-orange::before {
  background: linear-gradient(180deg, #efad4b, #de7f20);
}

.analytics-catalog-metric.is-orange .analytics-footer-value,
.analytics-catalog-metric.is-orange .analytics-footer-label {
  color: #b26a18;
}

.analytics-catalog-metric.is-red {
  border-color: rgba(225, 82, 111, 0.2);
  background: linear-gradient(180deg, rgba(255, 240, 244, 0.92), rgba(255, 255, 255, 0.98));
}

.analytics-catalog-metric.is-red::before {
  background: linear-gradient(180deg, #ef5f7d, #de4868);
}

.analytics-catalog-metric.is-red .analytics-footer-value,
.analytics-catalog-metric.is-red .analytics-footer-label {
  color: #d34d6b;
}

.analytics-area-card,
.analytics-radar-card {
  display: grid;
  gap: 18px;
}

.analytics-radar-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.analytics-radar-head .section-note {
  max-width: 520px;
}

.analytics-radar-tabs {
  justify-content: flex-end;
  flex-wrap: nowrap;
}

.analytics-area-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.analytics-data-metrics {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.analytics-area-highlight,
.analytics-footer-value {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.area-chart-shell {
  display: grid;
  gap: 14px;
}

.area-chart {
  width: 100%;
  height: 300px;
}

.area-chart-plot.has-y-axis {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  gap: 10px;
  align-items: stretch;
}

.area-chart-y-axis {
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  padding: 2px 0 32px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1;
  text-align: right;
}

.area-chart-grid {
  stroke: rgba(141, 150, 176, 0.24);
  stroke-width: 1;
}

.area-chart-axis {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 8px;
  color: var(--muted);
  font-size: 0.8rem;
  text-align: center;
}

.area-chart-axis.has-y-axis {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  grid-auto-flow: row;
  grid-auto-columns: auto;
  gap: 10px;
}

.area-chart-axis-values {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  gap: 8px;
}

.area-chart-axis-values span {
  min-width: 0;
}

.radar-shell {
  display: grid;
  gap: 16px;
  justify-items: center;
}

.radar-chart {
  width: 100%;
  max-width: 320px;
  aspect-ratio: 1;
}

.radar-grid,
.radar-axis {
  fill: none;
  stroke: rgba(141, 150, 176, 0.24);
  stroke-width: 1;
}

.radar-label {
  fill: var(--muted);
  font-size: 12px;
  font-family: "Segoe UI", "Helvetica Neue", sans-serif;
}

.analytics-footer-card {
  padding: 18px 18px 16px;
  display: grid;
  gap: 8px;
}

.analytics-footer-label {
  color: var(--text);
  font-weight: 800;
}

.analytics-footer-meta {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.5;
}

.analytics-page-view {
  display: grid;
  gap: 18px;
}

.analytics-user-growth-toolbar {
  align-items: center;
}

.analytics-user-growth-date-toolbar {
  gap: 12px;
  align-items: center;
}

.analytics-user-growth-range-pill {
  min-width: 70px;
  text-align: center;
}

.analytics-user-growth-range-segment {
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
}

.analytics-user-growth-range-button {
  min-width: 70px;
  white-space: nowrap;
}

.analytics-user-growth-advanced-label {
  margin-inline: auto;
  color: var(--text);
  font-weight: 900;
  white-space: nowrap;
}

.analytics-user-growth-date-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-left: auto;
}

.analytics-user-growth-search {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: min(520px, 100%);
}

.analytics-user-growth-search input {
  width: min(420px, 100%);
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--text);
  font: inherit;
}

.analytics-user-growth-summary {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  align-items: stretch;
}

.analytics-user-growth-metric {
  position: relative;
  min-height: 148px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  border-color: rgba(124, 100, 255, 0.14);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9));
  box-shadow: 0 18px 36px rgba(71, 57, 121, 0.1);
}

.analytics-user-growth-metric .analytics-summary-copy {
  position: relative;
  z-index: 1;
  padding-left: 34px;
}

.analytics-user-growth-metric .analytics-summary-value {
  font-size: 2.1rem;
  line-height: 1;
}

.analytics-user-growth-metric .analytics-summary-delta {
  max-width: 26ch;
  line-height: 1.35;
}

.analytics-user-growth-metric-accent {
  position: absolute;
  left: 20px;
  top: 20px;
  bottom: 20px;
  width: 5px;
  border-radius: 999px;
  background: linear-gradient(180deg, #8f71ff, #6b55ea);
  box-shadow: 0 12px 28px rgba(124, 100, 255, 0.3);
}

.analytics-user-growth-metric.tone-blue .analytics-user-growth-metric-accent {
  background: linear-gradient(180deg, #4b9cff, #7db6ff);
  box-shadow: 0 12px 28px rgba(75, 156, 255, 0.24);
}

.analytics-user-growth-metric.tone-green .analytics-user-growth-metric-accent,
.analytics-user-growth-metric.tone-teal .analytics-user-growth-metric-accent {
  background: linear-gradient(180deg, #35c8a0, #58d3a7);
  box-shadow: 0 12px 28px rgba(53, 200, 160, 0.22);
}

.analytics-user-growth-metric.tone-coral .analytics-user-growth-metric-accent {
  background: linear-gradient(180deg, #ff8f7a, #fb6f92);
  box-shadow: 0 12px 28px rgba(251, 111, 146, 0.22);
}

.analytics-user-growth-grid {
  align-items: stretch;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, 0.82fr);
}

.analytics-user-growth-story {
  display: grid;
  gap: 22px;
}

.analytics-user-growth-timeline-card,
.analytics-user-growth-media-card {
  display: grid;
  gap: 18px;
}

.analytics-user-growth-timeline-card {
  min-height: 470px;
}

.analytics-user-growth-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}

.analytics-user-growth-card-head > div:first-child {
  min-width: 0;
}

.analytics-user-growth-signal-pills {
  display: flex;
  align-items: stretch;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
  max-width: 560px;
}

.analytics-user-growth-signal-pill {
  min-width: 112px;
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid rgba(124, 100, 255, 0.16);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.86);
}

.analytics-user-growth-signal-pill span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  text-transform: uppercase;
}

.analytics-user-growth-signal-pill strong {
  color: var(--text);
  font-size: 1.15rem;
  font-weight: 900;
}

.analytics-user-growth-signal-pill.is-blue {
  border-color: rgba(75, 156, 255, 0.22);
}

.analytics-user-growth-signal-pill.is-green {
  border-color: rgba(53, 200, 160, 0.22);
}

.analytics-user-growth-signal-pill.is-coral {
  border-color: rgba(251, 111, 146, 0.22);
}

.analytics-user-growth-chart-shell {
  min-height: 360px;
}

.analytics-user-growth-timeline-card .area-chart {
  height: 340px;
}

.analytics-user-growth-timeline-card .area-chart-y-axis {
  min-height: 340px;
}

.analytics-user-growth-timeline-card .timeline-legend {
  padding: 10px 12px;
  border: 1px solid rgba(141, 150, 176, 0.14);
  border-radius: 14px;
  background: rgba(248, 250, 255, 0.72);
}

.analytics-user-growth-card-head--media {
  align-items: center;
}

.analytics-genre-nav {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex: 0 0 auto;
}

.analytics-genre-nav-status {
  min-width: 96px;
  padding: 8px 10px;
  border: 1px solid rgba(141, 150, 176, 0.18);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(248, 250, 255, 0.84);
  font-size: 0.78rem;
  font-weight: 900;
  text-align: center;
}

.analytics-genre-nav-button {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(124, 100, 255, 0.2);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.92);
  color: #6b55ea;
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, opacity 0.16s ease;
}

.analytics-genre-nav-button:hover,
.analytics-genre-nav-button:focus-visible {
  border-color: rgba(124, 100, 255, 0.38);
  background: rgba(124, 100, 255, 0.08);
  transform: translateY(-1px);
}

.analytics-genre-nav-button:disabled {
  cursor: default;
  opacity: 0.42;
  transform: none;
}

.analytics-genre-nav-button svg {
  width: 20px;
  height: 20px;
}

.analytics-genre-nav-button path {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.analytics-empty-note {
  display: flex;
  align-items: center;
  min-height: 92px;
  padding: 16px;
  border: 1px dashed rgba(141, 150, 176, 0.34);
  border-radius: 14px;
  color: var(--muted);
  background: rgba(244, 247, 251, 0.62);
  line-height: 1.55;
}

.analytics-bar-list,
.analytics-genre-matrix,
.analytics-track-list {
  display: grid;
  gap: 12px;
}

.analytics-user-growth-media-card .analytics-genre-matrix {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.analytics-user-growth-media-card .analytics-genre-carousel {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 28px) / 3);
  grid-template-columns: none;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 0 2px 10px;
  scroll-padding-inline: 2px;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-color: rgba(124, 100, 255, 0.34) rgba(244, 247, 251, 0.82);
  scrollbar-width: thin;
  touch-action: pan-x;
  -webkit-overflow-scrolling: touch;
}

.analytics-user-growth-media-card .analytics-genre-carousel:focus-visible {
  outline: 3px solid rgba(124, 100, 255, 0.22);
  outline-offset: 4px;
}

.analytics-user-growth-media-card .analytics-genre-carousel::-webkit-scrollbar {
  height: 9px;
}

.analytics-user-growth-media-card .analytics-genre-carousel::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(244, 247, 251, 0.82);
}

.analytics-user-growth-media-card .analytics-genre-carousel::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(124, 100, 255, 0.34);
}

.analytics-bar-row,
.analytics-genre-row,
.analytics-track-row {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(141, 150, 176, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.78);
}

.analytics-user-growth-media-card .analytics-genre-row {
  min-height: 236px;
  align-content: start;
  gap: 14px;
  padding: 16px;
  border-color: rgba(124, 100, 255, 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.86);
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.analytics-genre-row-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.analytics-genre-row-head > div {
  min-width: 0;
}

.analytics-genre-total {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.analytics-genre-leader {
  flex: 0 0 auto;
  padding: 7px 9px;
  border-radius: 999px;
  color: #6b55ea;
  background: rgba(124, 100, 255, 0.1);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.analytics-genre-leader.is-blue {
  color: #3c79d8;
  background: rgba(75, 156, 255, 0.12);
}

.analytics-genre-leader.is-coral {
  color: #d85a78;
  background: rgba(251, 111, 146, 0.12);
}

.analytics-genre-leader.is-green {
  color: #22997b;
  background: rgba(53, 200, 160, 0.14);
}

.analytics-bar-copy,
.analytics-track-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.analytics-bar-copy span,
.analytics-genre-name,
.analytics-track-row strong {
  color: var(--text);
  font-weight: 800;
}

.analytics-bar-copy strong,
.analytics-track-row em {
  color: var(--muted);
  font-style: normal;
  font-weight: 800;
  white-space: nowrap;
}

.analytics-bar-track,
.analytics-genre-bar {
  position: relative;
  overflow: hidden;
  min-height: 10px;
  border-radius: 999px;
  background: rgba(141, 150, 176, 0.16);
}

.analytics-bar-track span,
.analytics-genre-bar span {
  display: block;
  min-height: inherit;
  border-radius: inherit;
  background: linear-gradient(90deg, #7c64ff, #58d3a7);
}

.analytics-genre-bars {
  display: grid;
  gap: 10px;
}

.analytics-genre-bar {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) 56px;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  padding: 0 10px 0 0;
  background: rgba(141, 150, 176, 0.1);
}

.analytics-genre-bar span {
  grid-column: 2;
  grid-row: 1;
  height: 12px;
}

.analytics-genre-bar em,
.analytics-genre-bar strong {
  position: relative;
  z-index: 1;
  color: var(--muted);
  font-size: 0.76rem;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}

.analytics-genre-bar em {
  padding-left: 12px;
}

.analytics-genre-bar strong {
  justify-self: end;
  padding-right: 10px;
}

.analytics-genre-bar.is-blue span {
  background: linear-gradient(90deg, #4b9cff, #7db6ff);
}

.analytics-genre-bar.is-coral span {
  background: linear-gradient(90deg, #ff8f7a, #fb6f92);
}

.analytics-genre-bar.is-green span {
  background: linear-gradient(90deg, #35c8a0, #58d3a7);
}

.analytics-user-list-card {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.analytics-user-list-toggle {
  width: 100%;
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 18px;
  border: 1px solid rgba(124, 100, 255, 0.22);
  border-radius: 14px;
  background: rgba(124, 100, 255, 0.08);
  color: var(--text);
  font: inherit;
  font-weight: 900;
  cursor: pointer;
}

.analytics-user-list-toggle strong {
  color: #7c64ff;
}

.analytics-user-table-shell {
  overflow-x: auto;
}

.analytics-user-growth-table {
  min-width: 1160px;
}

.analytics-user-growth-table tr.is-selected td {
  background: rgba(124, 100, 255, 0.08);
}

.analytics-user-row-button {
  display: grid;
  gap: 4px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.analytics-user-row-button span {
  color: var(--muted);
  font-size: 0.82rem;
}

.analytics-user-detail-card {
  display: grid;
  gap: 18px;
}

.analytics-user-detail-metrics {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.analytics-user-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.analytics-user-detail-grid section {
  display: grid;
  gap: 10px;
  min-width: 0;
}

.analytics-section-kicker {
  margin: 0;
  color: var(--text);
  font-size: 0.86rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.analytics-track-row div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.analytics-track-row span {
  color: var(--muted);
  font-size: 0.84rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-app[data-theme="dark"] .analytics-user-growth-search input,
.admin-app[data-theme="dark"] .analytics-bar-row,
.admin-app[data-theme="dark"] .analytics-genre-row,
.admin-app[data-theme="dark"] .analytics-track-row {
  background: rgba(22, 26, 38, 0.86);
  border-color: rgba(255, 255, 255, 0.1);
}

.admin-app[data-theme="dark"] .analytics-user-growth-metric {
  border-color: rgba(143, 113, 255, 0.2);
  background: linear-gradient(180deg, rgba(24, 28, 42, 0.96), rgba(16, 19, 29, 0.94));
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.22);
}

.admin-app[data-theme="dark"] .analytics-user-growth-signal-pill,
.admin-app[data-theme="dark"] .analytics-user-growth-timeline-card .timeline-legend,
.admin-app[data-theme="dark"] .analytics-user-growth-range-segment,
.admin-app[data-theme="dark"] .analytics-genre-nav-status,
.admin-app[data-theme="dark"] .analytics-genre-nav-button {
  background: rgba(22, 26, 38, 0.84);
  border-color: rgba(255, 255, 255, 0.1);
}

.admin-app[data-theme="dark"] .analytics-genre-nav-button {
  color: #a98bf5;
}

.admin-app[data-theme="dark"] .analytics-genre-nav-button:hover,
.admin-app[data-theme="dark"] .analytics-genre-nav-button:focus-visible {
  border-color: rgba(169, 139, 245, 0.34);
  background: rgba(169, 139, 245, 0.12);
}

.admin-app[data-theme="dark"] .analytics-user-growth-media-card .analytics-genre-row {
  background: rgba(22, 26, 38, 0.86);
}

.admin-app[data-theme="dark"] .analytics-user-growth-media-card .analytics-genre-carousel {
  scrollbar-color: rgba(169, 139, 245, 0.42) rgba(22, 26, 38, 0.72);
}

.admin-app[data-theme="dark"] .analytics-user-growth-media-card .analytics-genre-carousel::-webkit-scrollbar-track {
  background: rgba(22, 26, 38, 0.72);
}

.admin-app[data-theme="dark"] .analytics-user-growth-media-card .analytics-genre-carousel::-webkit-scrollbar-thumb {
  background: rgba(169, 139, 245, 0.42);
}

.admin-app[data-theme="dark"] .analytics-genre-leader {
  background: rgba(169, 139, 245, 0.14);
}

.admin-app[data-theme="dark"] .analytics-empty-note {
  background: rgba(22, 26, 38, 0.7);
  border-color: rgba(255, 255, 255, 0.14);
}

.admin-app[data-theme="dark"] .analytics-user-list-toggle {
  background: rgba(124, 100, 255, 0.16);
  border-color: rgba(143, 113, 255, 0.34);
}

@media (max-width: 1100px) {
  .analytics-user-growth-grid,
  .analytics-user-detail-grid {
    grid-template-columns: 1fr;
  }

  .analytics-user-growth-media-card .analytics-genre-matrix {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .analytics-user-growth-media-card .analytics-genre-carousel {
    grid-auto-columns: calc((100% - 14px) / 2);
    grid-template-columns: none;
  }

  .analytics-user-detail-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .analytics-user-growth-card-head,
  .analytics-user-growth-card-head--media {
    align-items: stretch;
    flex-direction: column;
  }

  .analytics-user-growth-signal-pills,
  .analytics-genre-nav {
    justify-content: flex-start;
  }

  .analytics-user-growth-media-card .analytics-genre-matrix {
    grid-template-columns: 1fr;
  }

  .analytics-user-growth-media-card .analytics-genre-carousel {
    grid-auto-columns: minmax(260px, 86%);
    grid-template-columns: none;
  }

  .analytics-user-growth-search,
  .analytics-user-growth-date-toolbar,
  .analytics-user-growth-date-actions,
  .analytics-user-list-toggle {
    align-items: stretch;
    flex-direction: column;
  }

  .analytics-user-growth-range-segment,
  .analytics-user-growth-date-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .analytics-user-growth-advanced-label {
    margin-inline: 0;
  }

  .analytics-user-growth-search input {
    width: 100%;
  }

  .analytics-user-detail-metrics {
    grid-template-columns: 1fr;
  }
}

.chart-bar-purple {
  background: linear-gradient(180deg, #8f71ff, #6b55ea);
}

.chart-bar-coral {
  background: linear-gradient(180deg, #ff9f84, #fb6f92);
}

.admin-app[data-rail-collapsed="true"] .admin-brand-copy,
.admin-app[data-rail-collapsed="true"] .admin-profile-copy,
.admin-app[data-rail-collapsed="true"] .admin-profile-status,
.admin-app[data-rail-collapsed="true"] .admin-rail-cta {
  display: none;
}

.admin-app[data-rail-collapsed="true"] .admin-brand {
  justify-content: center;
  padding: 12px;
  border-radius: 20px;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-profile {
  grid-template-columns: 1fr;
  justify-items: center;
  padding: 12px 8px;
  border-radius: 20px;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-button,
.admin-app[data-rail-collapsed="true"] .admin-rail-link {
  grid-template-columns: 1fr;
  justify-items: center;
  text-align: center;
  padding: 10px 8px;
  border-radius: 18px;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-nav {
  padding: 38px 4px 38px 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-nav::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-nav-shell {
  border-radius: 26px;
  overflow: hidden;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-nav-arrow:not([hidden]) {
  display: grid;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-link {
  min-height: 56px;
  font-size: 0;
}

.admin-app[data-rail-collapsed="true"] .admin-rail-link::before {
  content: "AC";
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.admin-app[data-theme="dark"] .admin-rail {
  background:
    radial-gradient(circle at top right, rgba(146, 94, 255, 0.16), transparent 32%),
    radial-gradient(circle at bottom left, rgba(53, 200, 178, 0.1), transparent 28%),
    linear-gradient(180deg, #0d121b 0%, #0b1018 50%, #091019 100%);
  border-right-color: var(--line);
  color: #a8b3c7;
}

.admin-app[data-theme="dark"] .admin-brand {
  color: #c39aff;
}

.admin-app[data-theme="dark"] .admin-brand-mark,
.admin-app[data-theme="dark"] .admin-rail-profile,
.admin-app[data-theme="dark"] .admin-rail-link,
.admin-app[data-theme="dark"] .dashboard-promo-banner,
.admin-app[data-theme="dark"] .dashboard-card,
.admin-app[data-theme="dark"] .payments-toolbar,
.admin-app[data-theme="dark"] .payments-highlight-card,
.admin-app[data-theme="dark"] .payments-summary-card,
.admin-app[data-theme="dark"] .payments-insight-card,
.admin-app[data-theme="dark"] .payments-context-card,
.admin-app[data-theme="dark"] .membership-table-card,
.admin-app[data-theme="dark"] .memberships-table-shell,
.admin-app[data-theme="dark"] .analytics-card,
.admin-app[data-theme="dark"] .analytics-toolbar,
.admin-app[data-theme="dark"] .analytics-summary-card,
.admin-app[data-theme="dark"] .analytics-footer-card,
.admin-app[data-theme="dark"] .media-group-button,
.admin-app[data-theme="dark"] .media-item-card,
.admin-app[data-theme="dark"] .donut-ring-hole {
  background: #111927;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .dashboard-insight-table-wrap {
  background: #111927;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .dashboard-insight-table th {
  background: #0f1622;
}

.admin-app[data-theme="dark"] .analytics-catalog-status {
  background: rgba(124, 100, 255, 0.18);
  color: #b7a7ff;
}

.admin-app[data-theme="dark"] .admin-rail-collapse,
.admin-app[data-theme="dark"] .admin-rail-button.is-active {
  background: rgba(122, 167, 255, 0.12);
  color: var(--blue);
}

.admin-app[data-theme="dark"] .admin-rail-button:hover,
.admin-app[data-theme="dark"] .admin-rail-link:hover {
  background: rgba(122, 167, 255, 0.08);
}

.admin-app[data-theme="dark"] .admin-rail-nav {
  border-color: rgba(168, 179, 199, 0.1);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
}

.admin-app[data-theme="dark"] .admin-rail-cta-button,
.admin-app[data-theme="dark"] .admin-button.primary {
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.26);
}

.admin-app[data-theme="dark"] .admin-workspace {
  background: linear-gradient(180deg, #0f1622 0%, #0e141d 220px, #0e141d 100%);
}

.admin-app[data-theme="dark"] .dashboard-overview-link,
.admin-app[data-theme="dark"] .payments-toolbar-user,
.admin-app[data-theme="dark"] .analytics-link-button.is-active,
.admin-app[data-theme="dark"] .dashboard-promo-title,
.admin-app[data-theme="dark"] .analytics-footer-label {
  color: var(--text);
}

.admin-app[data-theme="dark"] .payments-toolbar-chip,
.admin-app[data-theme="dark"] .payments-nav-link {
  background: rgba(124, 100, 255, 0.14);
  border-color: rgba(124, 100, 255, 0.18);
}

.admin-app[data-theme="dark"] .payments-nav-link.is-active {
  background: transparent;
  color: var(--text);
}

.admin-app[data-theme="dark"] .payments-view-button {
  background: #0f1622;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .payments-view-button.is-active {
  background: rgba(88, 211, 167, 0.14);
  border-color: rgba(88, 211, 167, 0.32);
}

.admin-app[data-theme="dark"] .payments-view-icon {
  background: rgba(148, 163, 184, 0.14);
}

.admin-app[data-theme="dark"] .payments-view-button.is-active .payments-view-icon {
  background: rgba(88, 211, 167, 0.18);
}

.admin-app[data-theme="dark"] .payments-tab-hero,
.admin-app[data-theme="dark"] .payments-tab-stat,
.admin-app[data-theme="dark"] .payments-customer-row,
.admin-app[data-theme="dark"] .payments-doc-card,
.admin-app[data-theme="dark"] .cost-table,
.admin-app[data-theme="dark"] .cost-table-toolbar,
.admin-app[data-theme="dark"] .cost-assessment-list > div,
.admin-app[data-theme="dark"] .cost-rate-row,
.admin-app[data-theme="dark"] .cost-event-row,
.admin-app[data-theme="dark"] .cost-rate-verification-row {
  background: rgba(15, 22, 34, 0.9);
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .cost-rate-verification {
  background: rgba(124, 100, 255, 0.11);
  border-color: rgba(124, 100, 255, 0.24);
}

.admin-app[data-theme="dark"] .cost-table-scroll--profit .cost-table th,
.admin-app[data-theme="dark"] .cost-table-scroll--provider .cost-table th {
  background: #171426;
}

.admin-app[data-theme="dark"] .cost-profit-model-group code,
.admin-app[data-theme="dark"] .cost-model-id,
.admin-app[data-theme="dark"] .admin-ai-model-id,
.admin-app[data-theme="dark"] .cost-rate-model-line code,
.admin-app[data-theme="dark"] .cost-provider-configuration {
  background: rgba(148, 128, 255, 0.18);
  color: #b8a9ff;
}

.admin-app[data-theme="dark"] .payments-tab-title,
.admin-app[data-theme="dark"] .payments-tab-stat strong,
.admin-app[data-theme="dark"] .payments-customer-name,
.admin-app[data-theme="dark"] .payments-customer-plan,
.admin-app[data-theme="dark"] .payments-customer-renewal strong,
.admin-app[data-theme="dark"] .payments-doc-card strong {
  color: var(--text);
}

.admin-app[data-theme="dark"] .payments-summary-value,
.admin-app[data-theme="dark"] .payments-difference-label,
.admin-app[data-theme="dark"] .payments-difference-value,
.admin-app[data-theme="dark"] .payments-stat-label,
.admin-app[data-theme="dark"] .payments-stat-value,
.admin-app[data-theme="dark"] .payments-context-temp {
  color: var(--text);
}

.admin-app[data-theme="dark"] .payments-difference-track,
.admin-app[data-theme="dark"] .payments-stat-track,
.admin-app[data-theme="dark"] .payments-summary-progress,
.admin-app[data-theme="dark"] .payments-context-footer {
  background: rgba(148, 163, 184, 0.12);
}

.admin-app[data-theme="dark"] .payments-toolbar-wordmark {
  color: #7ce3c7;
}

.admin-app[data-theme="dark"] .storage-meter-track {
  background: rgba(124, 100, 255, 0.2);
}

.admin-app[data-theme="dark"] .storage-compact-summary-grid > div {
  background: rgba(15, 23, 42, 0.7);
  border-color: rgba(148, 163, 184, 0.18);
}

.admin-app[data-theme="dark"] .system-visual-ring::after {
  background: #111927;
}

.admin-app[data-theme="dark"] .system-visual-ring span {
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .system-visual-track {
  background: rgba(148, 163, 184, 0.14);
}

.admin-app[data-theme="dark"] .system-mini-memory-ring {
  background:
    conic-gradient(
      var(--system-mini-memory-color) calc(var(--system-mini-memory-percent, 0) * 1%),
      rgba(148, 163, 184, 0.16) 0
    );
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.18);
}

.admin-app[data-theme="dark"] .system-mini-memory-ring::after {
  background: #111927;
}

.admin-app[data-theme="dark"] .system-mini-memory-ring span {
  color: #ebf1fc;
}

.admin-app[data-theme="dark"] .media-date-range-control,
.admin-app[data-theme="dark"] .media-stat-card {
  background: #111927;
  border-color: var(--line);
}

.admin-app[data-theme="dark"] .media-stat-progress-track {
  background: rgba(148, 163, 184, 0.14);
}

.admin-app[data-theme="dark"] .media-engagement-summary-value,
.admin-app[data-theme="dark"] .media-collection-view-controls {
  background: rgba(15, 23, 42, 0.72);
  border-color: rgba(148, 163, 184, 0.2);
}

.admin-app[data-theme="dark"] .media-collection-view-button {
  color: #d6deea;
}

.admin-app[data-theme="dark"] .media-collection-view-button[aria-pressed="true"] {
  background: #b9a6ff;
  color: #111927;
}

.admin-app[data-theme="dark"] .media-grouped-chart-stage {
  background:
    linear-gradient(180deg, rgba(148, 163, 184, 0.12) 1px, transparent 1px) 0 0 / 100% 25%,
    rgba(15, 23, 42, 0.68);
  border-color: rgba(148, 163, 184, 0.18);
}

.admin-app[data-theme="dark"] .media-chart-collapsed-chip {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(17, 25, 39, 0.76);
}

.admin-app[data-theme="dark"] .media-grouped-category-button {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(17, 25, 39, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.admin-app[data-theme="dark"] .media-grouped-category-button:hover,
.admin-app[data-theme="dark"] .media-grouped-category-button:focus-visible,
.admin-app[data-theme="dark"] .media-grouped-category-button.is-active {
  border-color: var(--category-border);
  background: var(--category-soft);
}

.admin-app[data-theme="dark"] .media-grouped-graph-stage {
  background:
    linear-gradient(180deg, rgba(148, 163, 184, 0.12) 1px, transparent 1px) 0 0 / 100% 25%,
    rgba(15, 23, 42, 0.68);
  border-color: rgba(148, 163, 184, 0.18);
}

.admin-app[data-theme="dark"] .media-grouped-graph-point circle {
  stroke: #111927;
}

.admin-app[data-theme="dark"] .media-grouped-graph-area-fill {
  opacity: 0.13;
  mix-blend-mode: screen;
}

.admin-app[data-theme="dark"] .media-grouped-graph-legend-item {
  border-color: rgba(148, 163, 184, 0.18);
  background: rgba(17, 25, 39, 0.82);
}

.admin-app[data-theme="dark"] .media-grouped-graph-legend-item:hover {
  border-color: rgba(124, 100, 255, 0.32);
  background: rgba(24, 34, 52, 0.96);
}

.admin-app[data-theme="dark"] .media-grouped-graph-legend-item.is-muted {
  background: rgba(15, 23, 42, 0.62);
}

.admin-app[data-theme="dark"] .community-sweep-category-option {
  background: rgba(15, 22, 34, 0.88);
}

.admin-app[data-theme="dark"] .community-sweep-progress-track {
  background: rgba(148, 163, 184, 0.12);
}

.admin-app[data-theme="dark"] .analytics-toolbar-pill,
.admin-app[data-theme="dark"] .analytics-toolbar-export,
.admin-app[data-theme="dark"] .analytics-window-button,
.admin-app[data-theme="dark"] .dashboard-carousel-arrow,
.admin-app[data-theme="dark"] .storage-backup-preview-nav,
.admin-app[data-theme="dark"] .admin-icon-button,
.admin-app[data-theme="dark"] .maintenance-countdown-pill,
.admin-app[data-theme="dark"] .admin-session-pill {
  background: #0f1622;
  border-color: var(--line);
  color: var(--text);
}

.admin-app[data-theme="dark"] .maintenance-countdown-pill {
  background: linear-gradient(135deg, rgba(45, 34, 22, 0.94), rgba(15, 22, 34, 0.96));
  border-color: rgba(194, 132, 51, 0.36);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.24);
}

.admin-app[data-theme="dark"] .maintenance-countdown-pill[data-state="active"] {
  background: linear-gradient(135deg, rgba(58, 24, 34, 0.94), rgba(15, 22, 34, 0.96));
  border-color: rgba(230, 95, 116, 0.38);
}

.admin-app[data-theme="dark"] .maintenance-countdown-label {
  color: #ffc266;
}

.admin-app[data-theme="dark"] .maintenance-countdown-pill[data-state="active"] .maintenance-countdown-label {
  color: #ff8fa3;
}

.admin-app[data-theme="dark"] .storage-backup-preview-row {
  background: rgba(15, 22, 34, 0.78);
}

.admin-app[data-theme="dark"] .admin-session-name {
  color: var(--text);
}

.admin-app[data-theme="dark"] .admin-session-meta {
  color: #98a7bf;
}

.admin-app[data-theme="dark"] .workspace-collapse-toggle,
.admin-app[data-theme="dark"] .inbox-explorer-collapsed-count {
  background: #111927;
  border-color: var(--line);
  color: var(--text);
}

.admin-app[data-theme="dark"] .inbox-explorer-collapsed-count.is-unread,
body[data-admin-theme="dark"] .inbox-thread-section-count.is-unread {
  border-color: #e11d48;
  background: #e11d48;
  color: #ffffff;
}

.admin-app[data-theme="dark"] .inbox-explorer-collapsed-icon {
  border-color: rgba(124, 100, 255, 0.24);
  background: rgba(124, 100, 255, 0.18);
  color: #bba7ff;
}

.admin-app[data-theme="dark"] .inbox-collapsed-section-button,
.admin-app[data-theme="dark"] .inbox-collapsed-message-button,
.admin-app[data-theme="dark"] .inbox-collapsed-page-button,
.admin-app[data-theme="dark"] .inbox-collapsed-empty {
  border-color: rgba(73, 88, 114, 0.82);
  background: rgba(17, 25, 39, 0.96);
  color: #aeb9cf;
}

.admin-app[data-theme="dark"] .inbox-collapsed-section-button.is-active,
.admin-app[data-theme="dark"] .inbox-collapsed-message-button.is-active {
  border-color: rgba(132, 111, 255, 0.38);
  background: linear-gradient(180deg, rgba(39, 32, 68, 0.98), rgba(25, 29, 50, 0.98));
  color: #bdaeff;
}

.admin-app[data-theme="dark"] .inbox-collapsed-message-initial {
  border-color: rgba(73, 88, 114, 0.82);
  background: #111927;
  color: #edf3ff;
}

.admin-app[data-theme="dark"] .donut-ring-hole {
  box-shadow: inset 0 0 0 1px rgba(39, 51, 70, 0.8);
}

.admin-app[data-theme="dark"] .media-detail-artwork.is-image {
  background: rgba(9, 14, 24, 0.86);
}

.admin-app[data-theme="dark"] .area-chart-grid,
.admin-app[data-theme="dark"] .radar-grid,
.admin-app[data-theme="dark"] .radar-axis {
  stroke: rgba(151, 165, 189, 0.2);
}

.admin-app[data-theme="dark"] .timeline-legend-item.is-toggle:hover,
.admin-app[data-theme="dark"] .timeline-legend-item.is-toggle:focus-visible {
  border-color: rgba(122, 167, 255, 0.24);
  background: rgba(122, 167, 255, 0.1);
}

.admin-app[data-theme="dark"] .area-chart-empty {
  border-color: rgba(151, 165, 189, 0.24);
}

@media (max-width: 640px) {
  .media-profile-preview-stage {
    min-height: 320px;
  }

  .media-profile-preview-meta {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1480px) {
  .admin-panels {
    grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) minmax(325px, 375px);
  }

  .admin-panels.is-inbox-layout {
    grid-template-columns: clamp(320px, var(--inbox-explorer-panel-width, 360px), 520px) minmax(0, 1fr) minmax(325px, 375px);
  }

  .admin-panels.is-inbox-explorer-collapsed {
    grid-template-columns: 76px minmax(0, 1fr) minmax(325px, 375px);
  }

  .admin-panels.is-inbox-detail-collapsed {
    grid-template-columns: clamp(320px, var(--inbox-explorer-panel-width, 360px), 520px) minmax(0, 1fr) 52px;
  }

  .admin-panels.is-inbox-explorer-collapsed.is-inbox-detail-collapsed {
    grid-template-columns: 76px minmax(0, 1fr) 52px;
  }

  .admin-panels.is-settings-explorer-collapsed {
    grid-template-columns: 108px minmax(0, 1fr) minmax(325px, 375px);
  }

  .admin-panels.is-settings-detail-collapsed {
    grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) 52px;
  }

  .admin-panels.is-settings-explorer-collapsed.is-settings-detail-collapsed {
    grid-template-columns: 108px minmax(0, 1fr) 52px;
  }

  .admin-panels.is-users-detail-collapsed {
    grid-template-columns: minmax(260px, 300px) minmax(0, 1fr) 52px;
  }

  .payments-highlight-stack {
    display: grid;
    gap: 22px;
  }

  .payments-spotlight-stack {
    display: grid;
    gap: 18px;
    align-content: start;
  }

  .payments-highlight-grid .payments-membership-class-card,
  .payments-highlight-grid .payments-spotlight-card--primary,
  .payments-highlight-grid .payments-revenue-breakout-card,
  .payments-highlight-grid .payments-context-card:not(.payments-spotlight-mini-card),
  .payments-highlight-grid .payments-insight-card,
  .payments-highlight-grid .payments-spotlight-mini-card {
    grid-column: auto;
    grid-row: auto;
    height: auto;
  }

  .membership-hero-grid,
  .dashboard-main-grid,
  .payments-highlight-grid,
  .payments-bottom-grid,
  .analytics-main-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1200px) {
  .split-grid {
    grid-template-columns: 1fr;
  }

  .support-hours-grid,
  .support-hours-time-grid,
  .support-hours-day-grid {
    grid-template-columns: 1fr;
  }

  .users-holdings-card {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .membership-hero-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .payments-membership-snapshot-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

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

  .cost-overview-metric:nth-child(4) {
    border-left: 0;
  }

  .cost-overview-metric:nth-child(n + 4) {
    border-top: 1px solid rgba(143, 154, 179, 0.16);
  }

  .cost-profit-margin-summary {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .cost-profit-type-filters {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: start;
  }

  .payments-tab-hero,
  .payments-tab-grid,
  .payments-doc-grid {
    grid-template-columns: 1fr;
  }

  .payments-tab-card--wide,
  .payments-doc-card--wide {
    grid-column: auto;
  }

  .payments-customer-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .payments-highlight-columns {
    grid-template-columns: 1fr;
  }

  .users-split-layout,
  .media-split-layout,
  .storage-callout-grid,
  .storage-chart-grid,
  .storage-detail-grid,
  .storage-media-breakdown-grid,
  .storage-scheduler-form-grid,
  .storage-scheduler-toggle-row,
  .storage-scheduler-toggle-row.has-retention-card {
    grid-template-columns: 1fr;
  }

  .user-action-grid {
    grid-template-columns: 1fr;
  }

  .users-inline-search .admin-search-shell {
    flex-basis: 100%;
  }

  .dashboard-hero-grid,
  .dashboard-secondary-grid,
  .storage-summary-grid,
  .storage-backup-summary-grid,
  .media-summary-grid,
  .media-stats-grid,
  .payments-summary-grid,
  .system-summary-grid,
  .analytics-summary-grid,
  .analytics-metric-footer,
  .analytics-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .storage-scheduler-status-grid,
  .storage-compact-summary-grid,
  .storage-scheduler-scopes,
  .storage-recovery-verification-grid,
  .media-grouped-chart-stage {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .storage-recovery-live-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .system-summary-grid.system-core-summary-grid.is-three-telemetry-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .system-core-summary-grid.is-three-telemetry-row .system-visual-card,
  .system-core-summary-grid.is-three-telemetry-row .system-visual-card.is-telemetry-system-card {
    grid-column: auto;
  }
}

@media (max-width: 1080px) {
  .admin-search-shell {
    min-width: 100%;
  }

  .media-summary-card {
    min-height: 184px;
    padding-block: 18px;
  }

  .admin-theme-toggle {
    width: 100%;
    justify-content: space-between;
  }

  .maintenance-countdown-pill {
    width: 100%;
    max-width: 100%;
  }

  .admin-header {
    align-items: start;
    flex-direction: column;
  }

  .admin-header-copy {
    flex-basis: auto;
    width: 100%;
  }

  .admin-header-actions {
    width: 100%;
  }

  .admin-panels {
    grid-template-columns: 1fr;
  }

  .admin-panels.is-inbox-explorer-collapsed {
    grid-template-columns: 1fr;
  }

  .admin-panels.is-inbox-detail-collapsed,
  .admin-panels.is-inbox-explorer-collapsed.is-inbox-detail-collapsed {
    grid-template-columns: 1fr;
  }

  .admin-panels.is-settings-explorer-collapsed {
    grid-template-columns: 1fr;
  }

  .admin-panels.is-settings-detail-collapsed,
  .admin-panels.is-settings-explorer-collapsed.is-settings-detail-collapsed {
    grid-template-columns: 1fr;
  }

  .admin-panels.is-users-detail-collapsed {
    grid-template-columns: 1fr;
  }

  .admin-panels.is-dashboard-layout,
  .admin-panels.is-payments-layout,
  .admin-panels.is-analytics-layout,
  .admin-panels.is-storage-layout,
  .admin-panels.is-memberships-layout,
  .admin-panels.is-system-layout {
    padding: 20px 18px 28px;
  }

  .admin-panels.is-users-layout .admin-panel-explorer,
  .admin-panels.is-media-layout .admin-panel-explorer {
    grid-column: auto;
  }

  .admin-panels.is-media-layout .admin-panel-detail {
    display: block;
    overflow: auto;
  }

  .admin-panels.is-users-layout .admin-panel-detail {
    display: block;
    overflow: auto;
  }

  .admin-panels.is-settings-layout .admin-panel-canvas,
  .admin-panels.is-settings-layout .admin-panel-detail {
    display: block;
    overflow: auto;
  }

  .admin-panels.is-inbox-layout .admin-panel-detail {
    display: block;
    overflow: auto;
  }

  .inbox-detail-collapse-toggle {
    display: none;
  }

  .admin-panels.is-inbox-detail-collapsed .inbox-detail-stack {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }

  .users-detail-rail-collapse-toggle {
    display: none;
  }

  .admin-panels.is-users-detail-collapsed .users-detail-stack {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }

  .settings-detail-collapse-toggle {
    display: none;
  }

  .admin-panels.is-settings-detail-collapsed .settings-detail-stack {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
  }

  .settings-canvas-shell {
    min-height: auto;
    height: auto;
    max-height: none;
  }

  .scroll-region.is-settings-canvas {
    max-height: none;
  }

  .settings-detail-stack.scroll-region.is-settings-detail {
    height: auto;
    max-height: none;
    padding-bottom: 0;
  }

  .conversation-shell {
    min-height: auto;
    height: auto;
  }

  .conversation-stream {
    max-height: 60vh;
  }

  .system-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .analytics-catalog-groups {
    grid-template-columns: 1fr;
  }

  .settings-audit-filter-bar {
    align-items: flex-start;
    flex-direction: column;
  }

  .dashboard-promo-banner,
  .payments-ribbon,
  .payments-toolbar,
  .payments-nav-row,
  .payments-greeting-row,
  .dashboard-section-head,
  .analytics-subnav,
  .analytics-toolbar,
  .media-stats-head,
  .storage-collapsible-head,
  .storage-meter-head,
  .media-pagination {
    align-items: flex-start;
    flex-direction: column;
  }

  .analytics-toolbar {
    justify-content: flex-start;
  }

  .dashboard-section-actions,
  .dashboard-date-range-control,
  .media-stats-toolbar,
  .media-date-range-control {
    width: 100%;
    justify-content: flex-start;
  }

  .media-stats-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .payments-toolbar {
    align-items: flex-start;
  }

  .settings-ai-section .split-grid,
  .settings-ai-section .support-hours-grid,
  .settings-ai-section .support-hours-time-grid {
    grid-template-columns: 1fr;
  }

  .settings-platform-format-grid {
    grid-template-columns: repeat(2, minmax(300px, 1fr));
  }
}

@media (max-width: 720px) {
  .admin-app {
    grid-template-columns: 1fr;
    min-width: 0;
    max-width: 100%;
  }

  .media-summary-card {
    min-height: 0;
  }

  .admin-workspace,
  .admin-header,
  .admin-panels {
    min-width: 0;
    max-width: 100%;
  }

  .settings-platform-format-grid {
    grid-template-columns: 1fr;
  }

  .admin-rail {
    position: static;
    top: auto;
    height: auto;
    min-height: 0;
    min-width: 0;
    max-width: 100vw;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    padding: 12px;
    gap: 12px;
    overflow-x: hidden;
    overflow-y: hidden;
  }

  .admin-rail-nav-shell {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
  }

  .admin-rail-top,
  .admin-rail-bottom {
    display: none;
  }

  .admin-rail-profile,
  .admin-rail-cta {
    display: none;
  }

  .users-directory-title-row,
  .users-export-menu,
  .users-export-trigger {
    width: 100%;
  }

  .users-export-trigger {
    justify-content: space-between;
  }

  .users-export-options {
    left: 0;
    right: 0;
  }

  .admin-rail-nav {
    width: max-content;
    min-width: 100%;
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(84px, max-content);
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    scrollbar-width: auto;
    scroll-snap-type: none;
  }

  .admin-rail-nav-shell::before,
  .admin-rail-nav-shell::after,
  .admin-rail-nav-arrow {
    display: none !important;
  }

  .admin-rail-button {
    min-height: 72px;
    gap: 8px;
    transform: none;
  }

  .admin-rail-label,
  .admin-app[data-rail-collapsed="true"] .admin-rail-label {
    display: block;
    font-size: 0.8rem;
  }

  .panel-stack,
  .panel-section {
    padding: 18px;
  }

  .users-workspace {
    padding: 18px;
  }

  .membership-hero-grid,
  .storage-summary-grid,
  .storage-backup-summary-grid,
  .storage-compact-summary-grid,
  .storage-scheduler-status-grid,
  .storage-scheduler-scopes,
  .storage-recovery-live-metrics,
  .storage-recovery-verification-grid,
  .system-summary-grid,
  .media-stats-grid,
  .media-grouped-chart-stage,
  .media-summary-grid {
    grid-template-columns: 1fr;
  }

  .storage-recovery-console-head,
  .storage-recovery-console-toggle-row {
    align-items: stretch;
    flex-direction: column;
  }

  .storage-recovery-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .storage-recovery-progress-grid {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .storage-recovery-live-metrics {
    width: 100%;
    grid-template-columns: 1fr;
  }

  .storage-recovery-destination-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .storage-recovery-help-body {
    grid-template-columns: 1fr;
  }

  .storage-recovery-help-body > p {
    grid-column: auto;
  }

  .storage-recovery-event-row {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .system-visual-card {
    grid-template-columns: 1fr;
    grid-template-areas:
      "label"
      "value"
      "meta"
      "visual";
    min-height: 168px;
  }

  .system-certificate-host-row {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .system-visual-card .metric-meta {
    max-width: none;
  }

  .system-summary-grid.system-core-summary-grid.is-three-telemetry-row {
    grid-template-columns: 1fr;
  }

  .media-grouped-graph-legend {
    grid-template-columns: 1fr;
  }

  .media-chart-card-actions,
  .media-grouped-category-filters,
  .media-chart-view-toggle {
    width: 100%;
    justify-content: flex-start;
  }

  .media-chart-collapsed-summary {
    grid-template-columns: 1fr;
  }

  .media-chart-card.is-collapsed .media-chart-card-head {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
  }

  .media-chart-card.is-collapsed .media-chart-collapsed-summary {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .media-chart-card.is-collapsed .media-chart-card-actions {
    width: auto;
    justify-content: flex-end;
  }

  .media-chart-card.is-collapsed .media-chart-card-toggle {
    min-width: 84px;
  }

  .users-holdings-card {
    grid-column: auto;
    grid-row: auto;
  }

  .dashboard-hero-grid,
  .dashboard-secondary-grid,
  .payments-summary-grid,
  .payments-tab-stat-strip,
  .payments-membership-snapshot-grid,
  .analytics-summary-grid,
  .analytics-metric-footer,
  .analytics-area-metrics,
  .analytics-catalog-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-metric-carousel-head,
  .dashboard-metric-carousel-controls {
    flex-wrap: wrap;
  }

  .dashboard-metric-carousel-controls {
    width: 100%;
    justify-content: flex-end;
  }

  .dashboard-metric-carousel-status {
    min-width: 0;
    text-align: left;
    margin-right: auto;
  }

  .dashboard-priority-actions,
  .dashboard-priority-sort-control {
    width: 100%;
    justify-content: stretch;
  }

  .dashboard-priority-sort-button {
    flex: 1 1 0;
    min-width: 0;
  }

  .inbox-thread-action-row {
    width: 100%;
    flex-wrap: wrap;
  }

  .users-engagement-head-actions,
  .users-engagement-carousel-controls {
    width: 100%;
    align-items: flex-end;
  }

  .users-engagement-carousel-status {
    min-width: 0;
    margin-right: auto;
    text-align: left;
  }

  .dashboard-card,
  .payments-toolbar,
  .payments-highlight-card,
  .payments-summary-card,
  .payments-insight-card,
  .payments-context-card,
  .analytics-card,
  .analytics-summary-card,
  .analytics-footer-card,
  .dashboard-promo-banner {
    padding: 18px;
  }

  .payments-highlight-columns,
  .payments-ribbon-actions,
  .payments-toolbar-search,
  .payments-toolbar-actions,
  .payments-nav-links,
  .payments-context-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .payments-customer-row,
  .payments-doc-grid,
  .cost-rate-row {
    grid-template-columns: 1fr;
  }

  .cost-overview-grid,
  .cost-overview-notes {
    grid-template-columns: 1fr;
  }

  .cost-overview-metric,
  .cost-overview-metric:nth-child(4) {
    border-top: 1px solid rgba(143, 154, 179, 0.16);
    border-left: 0;
  }

  .cost-overview-metric:first-child {
    border-top: 0;
  }

  .cost-profit-margin-summary {
    display: flex;
    align-items: stretch;
  }

  .cost-profit-type-filters {
    flex-wrap: wrap;
    align-self: flex-start;
    border-radius: 16px;
  }

  .cost-profit-summary-meta {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .cost-profit-type-heading {
    flex-direction: column;
  }

  .cost-rate-row .admin-button {
    width: 100%;
  }

  .payments-workspace.is-rows-layout .payments-summary-card {
    grid-template-columns: 1fr;
  }

  .payments-tab-title {
    font-size: 2rem;
  }

  .payments-customer-renewal {
    text-align: left;
  }

  .payments-spotlight-foot {
    align-items: flex-start;
    flex-direction: column;
  }

  .payments-mini-stat-grid {
    grid-template-columns: 1fr;
  }

  .admin-dialog-shell {
    padding: 16px;
  }

  .admin-dialog-card {
    padding: 22px;
    border-radius: 24px;
  }

  .admin-dialog-card.is-server-directory-dialog {
    width: min(98vw, 1120px);
    max-height: min(92vh, 940px);
    padding: 16px;
  }

  .admin-dialog-card.is-workspace-verify-dialog {
    width: min(100%, 480px);
    padding: 26px 22px 22px;
    border-radius: 26px;
  }

  .admin-dialog-card.is-dashboard-insight-dialog {
    width: min(100%, 96vw);
  }

  .admin-dialog-card.is-media-tracklist-dialog {
    width: min(100%, 96vw);
  }

  .admin-dialog-card.is-advertising-voice-resolver-dialog {
    width: 100%;
    padding: 20px 16px;
  }

  .advertising-voice-resolver-input-row {
    grid-template-columns: 1fr;
  }

  .advertising-voice-resolver-input-row .admin-button {
    width: 100%;
  }

  .media-tracklist-album,
  .media-tracklist-row {
    grid-template-columns: 1fr;
  }

  .media-tracklist-album.has-owner-action {
    grid-template-columns: 1fr;
  }

  .media-tracklist-album-action {
    justify-self: start;
  }

  .media-inspector-moderation-layout,
  .media-inspector-details-grid {
    grid-template-columns: 1fr;
  }

  .media-inspector-section-head,
  .media-inspector-result-card .community-sweep-result-main {
    grid-template-columns: 1fr;
    display: grid;
  }

  .media-inspector-section-head .admin-button,
  .media-inspector-action-row {
    width: 100%;
  }

  .media-inspector-action-row {
    justify-content: stretch;
  }

  .media-inspector-stage {
    grid-template-columns: 12px minmax(0, 1fr);
  }

  .media-inspector-stage .pill {
    justify-self: start;
    grid-column: 2;
  }

  .media-tracklist-cover {
    width: min(100%, 180px);
  }

  .admin-dialog-card.is-media-inspector-dialog .media-tracklist-album.has-owner-action {
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 10px;
    padding: 10px;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-tracklist-cover {
    grid-column: 1;
    grid-row: 1;
    width: 64px;
    border-radius: 12px;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-tracklist-album-copy {
    grid-column: 2;
    grid-row: 1;
    gap: 3px;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-tracklist-album-copy strong {
    font-size: 0.95rem;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-tracklist-album-copy span {
    font-size: 0.78rem;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-tracklist-album-action {
    grid-column: 2;
    grid-row: 2;
    justify-self: start;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-inspector-nav {
    flex-wrap: nowrap;
    gap: 4px;
    padding: 4px;
  }

  .admin-dialog-card.is-media-inspector-dialog .media-inspector-tab {
    flex: 1 1 0;
    min-width: 0;
    min-height: 38px;
    padding: 8px 5px;
    font-size: 0.78rem;
    white-space: nowrap;
  }

  .workspace-verify-digits {
    gap: 10px;
  }

  .server-directory-hero,
  .server-directory-layout,
  .server-directory-path-strip,
  .server-directory-preview-grid,
  .storage-backup-preview-grid {
    grid-template-columns: 1fr;
  }

  .storage-backup-preview-carousel {
    grid-template-columns: 1fr;
  }

  .storage-backup-preview-carousel-controls {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    grid-template-rows: auto;
  }

  .storage-backup-preview-carousel-status {
    writing-mode: horizontal-tb;
    transform: none;
    text-align: center;
  }

  .server-directory-hero-actions {
    position: static;
  }

  .server-directory-hero-title-row {
    padding-right: 0;
  }

  .server-directory-hero-stats,
  .server-directory-path-meta {
    grid-template-columns: 1fr;
  }

  .server-directory-toolbar,
  .server-directory-toolbar-actions,
  .server-directory-search-form,
  .server-directory-entry-card {
    grid-template-columns: 1fr;
  }

  .server-directory-toolbar,
  .server-directory-toolbar-actions,
  .server-directory-search-form {
    display: grid;
  }

  .server-directory-entry-actions {
    justify-content: flex-start;
  }

  .server-directory-browser.is-hero-collapsed .server-directory-hero-stats {
    grid-template-columns: 1fr;
  }

  .credit-grant-form-grid,
  .user-action-row {
    grid-template-columns: 1fr;
  }

  .admin-dialog-actions {
    flex-direction: column-reverse;
  }

  .admin-dialog-actions .admin-button {
    width: 100%;
  }

  .dashboard-insight-split-grid {
    grid-template-columns: 1fr;
  }

  .dashboard-insight-table {
    min-width: 560px;
  }
}
.studio-provider-enforcement-toggle {
  margin: 14px 0;
  border-color: color-mix(in srgb, var(--admin-accent, #785cf5) 45%, #d8d4e8);
  background: color-mix(in srgb, var(--admin-accent, #785cf5) 7%, #fff);
}

.studio-provider-rights-card {
  margin-top: 12px;
  overflow: clip;
  border: 1px solid #ded9e9;
  border-radius: 18px;
  background: #fff;
}

.studio-provider-rights-card > summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  cursor: pointer;
  list-style: none;
}

.studio-provider-rights-card > summary::-webkit-details-marker { display: none; }
.studio-provider-rights-card > summary span { display: grid; gap: 3px; }
.studio-provider-rights-card > summary small { color: #767084; font-weight: 500; }
.studio-provider-rights-card > summary b {
  padding: 6px 10px;
  border-radius: 999px;
  background: #f0edf7;
  color: #625a70;
  font-size: .72rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.studio-provider-rights-card > summary b[data-provider-status="verified"] { background: #e4f7e9; color: #176530; }
.studio-provider-rights-card > summary b[data-provider-status="expired"],
.studio-provider-rights-card > summary b[data-provider-status="revoked"] { background: #fdebea; color: #8c2d28; }

.studio-provider-rights-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 18px 16px;
}
.studio-provider-field-wide { grid-column: 1 / -1; }
.studio-provider-scope-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 12px;
  border: 1px solid #e2deea;
  border-radius: 14px;
}
.studio-provider-scope-grid legend { padding: 0 6px; color: #6e6678; font-size: .76rem; font-weight: 800; text-transform: uppercase; }
.studio-provider-scope-grid label { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: .84rem; }
.studio-provider-control-grid label { align-items: flex-start; }
.studio-provider-control-grid label > span { display: grid; gap: 2px; min-width: 0; }
.studio-provider-control-grid small { color: #777083; font-weight: 500; line-height: 1.35; }
.studio-provider-control-grid input:disabled + span { opacity: .62; }
.studio-provider-separation-note {
  display: grid;
  gap: 4px;
  margin: 0 18px 14px;
  padding: 12px 14px;
  border: 1px solid color-mix(in srgb, var(--admin-accent, #785cf5) 24%, #e5e1ec);
  border-radius: 14px;
  background: color-mix(in srgb, var(--admin-accent, #785cf5) 5%, #fff);
  color: #6f6879;
  font-size: .82rem;
  line-height: 1.45;
}
.studio-provider-separation-note strong { color: #3f394a; }
.studio-provider-review-copy { display: block; padding: 0 18px 16px; }

@media (max-width: 720px) {
  .studio-provider-rights-fields,
  .studio-provider-scope-grid { grid-template-columns: 1fr; }
  .studio-provider-field-wide { grid-column: auto; }
  .studio-provider-rights-card > summary { grid-template-columns: 1fr; }
  .studio-provider-rights-card > summary b { justify-self: start; }
}

/* Advertising questions and Campaign of the Week controls */
.advertising-subview-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 24px;
  border: 1px solid var(--admin-line);
  border-radius: 20px;
  background: var(--admin-panel);
}
.advertising-subview-header > div { display: grid; gap: 6px; }
.advertising-subview-header span { color: var(--purple); font-size: .72rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.advertising-subview-header h2 { margin: 0; font-size: clamp(1.7rem, 3vw, 2.7rem); letter-spacing: -.04em; }
.advertising-subview-header p { max-width: 760px; margin: 0; color: var(--admin-muted); line-height: 1.5; }

.advertising-inquiries-workspace,
.advertising-showcase-workspace { display: grid; gap: 18px; }
.advertising-delivery-master { padding: 18px; border: 1px solid var(--admin-line); border-left: 4px solid var(--purple); border-radius: 16px; background: var(--admin-panel); display: grid; grid-template-columns: minmax(0, 1fr) minmax(380px, .9fr) auto; align-items: center; gap: 18px; }
.advertising-delivery-master > div:first-child { display: grid; gap: 4px; }
.advertising-delivery-master > div:first-child > span { color: var(--purple); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.advertising-delivery-master h3,
.advertising-delivery-master p { margin: 0; }
.advertising-delivery-master p { color: var(--admin-muted); font-size: .75rem; line-height: 1.4; }
.advertising-delivery-master-switches { display: grid; gap: 8px; }
.advertising-delivery-master-switches label { padding: 10px; border: 1px solid var(--admin-line); border-radius: 10px; display: flex; align-items: flex-start; gap: 10px; cursor: pointer; }
.advertising-delivery-master-switches input { width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--purple); }
.advertising-delivery-master-switches span { display: grid; gap: 2px; }
.advertising-delivery-master-switches small { color: var(--admin-muted); }
.advertising-inquiry-list { display: grid; gap: 14px; }
.advertising-inquiry-card { padding: 20px; border: 1px solid var(--admin-line); border-radius: 18px; background: var(--admin-panel); display: grid; gap: 14px; }
.advertising-inquiry-card > header { display: flex; justify-content: space-between; gap: 16px; }
.advertising-inquiry-card > header > div { display: grid; gap: 5px; }
.advertising-inquiry-card > header strong { font-size: 1.05rem; }
.advertising-inquiry-card > header span:not(.advertising-status),
.advertising-inquiry-card > header small { color: var(--admin-muted); }
.advertising-inquiry-meta { display: flex; flex-wrap: wrap; gap: 7px; }
.advertising-inquiry-meta span { padding: 5px 8px; border-radius: 999px; background: rgba(122, 87, 225, .1); color: var(--purple); font-size: .7rem; font-weight: 800; }
.advertising-inquiry-card blockquote { margin: 0; padding: 15px 17px; border-left: 3px solid var(--purple); border-radius: 0 12px 12px 0; background: rgba(122, 87, 225, .07); line-height: 1.55; }
.advertising-inquiry-response { display: grid; grid-template-columns: minmax(180px, .28fr) minmax(0, 1fr) auto; align-items: end; gap: 12px; }
.advertising-inquiry-response label { display: grid; gap: 6px; }
.advertising-inquiry-response label > span { color: var(--admin-muted); font-size: .72rem; font-weight: 850; }
.advertising-inquiry-response select,
.advertising-inquiry-response textarea { width: 100%; min-width: 0; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-soft); color: var(--admin-text); padding: 10px 11px; }
.advertising-inquiry-response textarea { resize: vertical; line-height: 1.45; }

.advertising-showcase-layout { display: grid; grid-template-columns: minmax(360px, .72fr) minmax(0, 1.28fr); align-items: start; gap: 18px; }
.advertising-showcase-preview { position: sticky; top: 16px; padding: 26px; border: 1px solid var(--admin-line); border-radius: 20px; background: var(--advertising-showcase-preview-bg, #a550f4); }
.advertising-showcase-preview-card { overflow: hidden; border: 2px solid #07070a; border-radius: 22px; background: #07070a; color: #fff; box-shadow: 14px 15px 0 rgba(7, 7, 10, .18); }
.advertising-showcase-preview-card header { position: relative; min-height: 120px; padding: 22px; display: grid; align-content: end; }
.advertising-showcase-preview-card header strong { font-size: clamp(2.4rem, 5vw, 4.4rem); letter-spacing: -.065em; line-height: .85; }
.advertising-showcase-preview-card header span { color: #c3beca; font-weight: 800; }
.advertising-showcase-preview-card header small { position: absolute; top: 18px; right: 18px; color: #d9ff5a; font-size: .58rem; font-weight: 900; text-transform: uppercase; }
.advertising-showcase-preview-image { position: relative; aspect-ratio: 1; overflow: hidden; background: #07070a; }
.advertising-showcase-preview-image img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(var(--advertising-showcase-frame-scale, 1)); }
.advertising-showcase-preview-image span { position: absolute; z-index: 2; right: 12px; bottom: 12px; padding: 6px 9px; border-radius: 999px; background: rgba(7, 7, 10, .76); color: #fff; font-size: .62rem; font-weight: 850; backdrop-filter: blur(8px); }
.advertising-showcase-preview-empty { aspect-ratio: 1; display: grid; place-items: center; color: #aaa4b2; }
.advertising-showcase-preview-card footer { padding: 13px 16px; color: #bbb5c2; font-size: .6rem; font-weight: 900; letter-spacing: .035em; text-transform: uppercase; }
.advertising-showcase-controls { display: grid; gap: 14px; }
.advertising-showcase-appearance { padding: 18px; border: 1px solid var(--admin-line); border-radius: 18px; background: var(--admin-panel); display: grid; grid-template-columns: minmax(220px, 1fr) minmax(140px, .45fr) auto; align-items: end; gap: 12px; }
.advertising-showcase-appearance .is-wide { grid-column: 1 / -1; }
.advertising-showcase-appearance label,
.advertising-showcase-slot label { display: grid; gap: 6px; }
.advertising-showcase-appearance label > span,
.advertising-showcase-slot label > span { color: var(--admin-muted); font-size: .72rem; font-weight: 850; }
.advertising-showcase-appearance label > div { display: grid; grid-template-columns: 48px 1fr; gap: 8px; }
.advertising-showcase-appearance input,
.advertising-showcase-appearance textarea,
.advertising-showcase-slot input { width: 100%; min-width: 0; min-height: 42px; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-soft); color: var(--admin-text); padding: 8px 10px; }
.advertising-showcase-appearance input[type="color"] { padding: 3px; }
.advertising-showcase-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.advertising-showcase-slot { min-width: 0; padding: 14px; border: 1px solid var(--admin-line); border-radius: 17px; background: var(--admin-panel); display: grid; align-content: start; gap: 11px; }
.advertising-showcase-slot.is-enabled { box-shadow: inset 0 0 0 2px rgba(122, 87, 225, .16); }
.advertising-showcase-slot.is-default { box-shadow: inset 0 0 0 2px rgba(122, 87, 225, .28); }
.advertising-showcase-slot.is-local-preview { border-color: rgba(122, 87, 225, .7); }
.advertising-showcase-slot > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.advertising-showcase-slot > header > span { font-weight: 900; }
.advertising-showcase-default-badge,
.advertising-showcase-preview-badge { display: inline-flex; min-height: 24px; align-items: center; padding: 4px 9px; border-radius: 999px; font-size: .62rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.advertising-showcase-default-badge { background: #e8ffd0; color: #285600; }
.advertising-showcase-preview-badge { background: #efe9ff; color: #5737b9; }
.advertising-showcase-slot-image { overflow: hidden; aspect-ratio: 1; border-radius: 13px; background: var(--admin-soft); display: grid; place-items: center; }
.advertising-showcase-slot-image img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--advertising-showcase-frame-scale, 1)); }
.advertising-showcase-slot-image span { color: var(--admin-muted); font-size: .72rem; }
.advertising-showcase-framing { margin: 0; padding: 11px; border: 1px solid var(--admin-line); border-radius: 13px; display: grid; gap: 9px; }
.advertising-showcase-framing legend { padding: 0 6px; color: var(--admin-text); font-size: .72rem; font-weight: 900; }
.advertising-showcase-framing > p { margin: 0; color: var(--admin-muted); font-size: .67rem; line-height: 1.35; }
.advertising-showcase-framing label > span { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.advertising-showcase-framing output { color: var(--purple); font-size: .68rem; font-weight: 900; }
.advertising-showcase-framing input[type="range"] { min-height: 20px; padding: 0; border: 0; border-radius: 0; background: transparent; accent-color: var(--purple); cursor: ew-resize; }
.advertising-showcase-framing > div { display: flex; flex-wrap: wrap; gap: 7px; }
.advertising-showcase-framing > div .admin-button { min-height: 34px; flex: 1 1 92px; padding: 7px 10px; font-size: .69rem; }
.advertising-showcase-framing:disabled { opacity: .5; }
.advertising-showcase-file input { padding: 7px; font-size: .72rem; }
.advertising-showcase-file-state { min-height: 32px; margin: 0; color: var(--admin-muted); font-size: .69rem; line-height: 1.4; }
.advertising-showcase-default-choice { grid-template-columns: auto 1fr; align-items: center; padding: 9px 10px; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-soft); }
.advertising-showcase-default-choice input { width: 18px; min-height: 18px; margin: 0; padding: 0; accent-color: var(--purple); }
.advertising-showcase-default-choice > span { color: var(--admin-text) !important; font-size: .72rem !important; }
.advertising-showcase-slot-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.advertising-showcase-slot-actions .admin-button { flex: 1 1 116px; }
.advertising-showcase-slot-actions .admin-button:disabled { border-color: #ded9e4; background: #efedf2; color: #9a94a3; box-shadow: none; opacity: 1; cursor: not-allowed; }

.advertising-visual-campaign-admin { padding: 20px; border: 1px solid var(--admin-line); border-radius: 20px; background: var(--admin-panel); display: grid; gap: 16px; }
.advertising-visual-campaign-admin > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.advertising-visual-campaign-admin > header > div:first-child { display: grid; gap: 4px; }
.advertising-visual-campaign-admin > header > div:first-child > span { color: var(--purple); font-size: .7rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.advertising-visual-campaign-admin h3,
.advertising-visual-campaign-admin p { margin: 0; }
.advertising-visual-campaign-admin h3 { font-size: 1.35rem; }
.advertising-visual-campaign-admin p { color: var(--admin-muted); font-size: .75rem; line-height: 1.45; }
.advertising-visual-campaign-admin > header > div:last-child { display: grid; grid-template-columns: minmax(120px, 1fr) 90px auto; align-items: end; gap: 9px; }
.advertising-visual-campaign-admin label { min-width: 0; display: grid; gap: 5px; }
.advertising-visual-campaign-admin label > span { color: var(--admin-muted); font-size: .69rem; font-weight: 850; }
.advertising-visual-campaign-admin input,
.advertising-visual-campaign-admin select,
.advertising-visual-campaign-admin textarea { box-sizing: border-box; width: 100%; min-width: 0; min-height: 40px; border: 1px solid var(--admin-line); border-radius: 10px; background: var(--admin-soft); color: var(--admin-text); padding: 8px 9px; font: inherit; }
.advertising-visual-campaign-admin textarea { resize: vertical; }
.advertising-visual-campaign-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.advertising-visual-campaign-slots > article { min-width: 0; padding: 14px; border: 1px solid var(--admin-line); border-radius: 16px; background: var(--admin-soft); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 10px; }
.advertising-visual-campaign-slots > article.is-enabled { box-shadow: inset 0 0 0 2px rgba(122,87,225,.15); }
.advertising-visual-campaign-slots article > header,
.advertising-visual-campaign-slots article > footer,
.advertising-visual-campaign-slots article > .is-wide,
.advertising-visual-campaign-image { grid-column: 1 / -1; }
.advertising-visual-campaign-slots article > header,
.advertising-visual-campaign-slots article > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.advertising-visual-campaign-image { height: 150px; overflow: hidden; border-radius: 12px; background: linear-gradient(135deg, #ee35ad, #5142ff); display: grid; place-items: center; }
.advertising-visual-campaign-image img { width: 100%; height: 100%; object-fit: cover; }
.advertising-visual-campaign-image span { color: #fff; font-size: .72rem; font-weight: 850; }
.advertising-visual-campaign-slots footer > label { grid-template-columns: 20px 1fr; align-items: center; }
.advertising-visual-campaign-slots footer input[type="checkbox"] { width: 20px; min-height: 20px; accent-color: var(--purple); }

.advertising-contract-narration-admin { margin-top: 18px; border: 1px solid var(--admin-line); border-radius: 22px; background: var(--admin-panel); overflow: hidden; }
.advertising-contract-narration-admin > summary { padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 18px; cursor: pointer; list-style: none; }
.advertising-contract-narration-admin > summary::-webkit-details-marker { display: none; }
.advertising-contract-narration-admin > summary > span { display: grid; gap: 3px; }
.advertising-contract-narration-admin > summary strong { font-size: 1rem; }
.advertising-contract-narration-admin > summary small { color: var(--admin-muted); line-height: 1.4; }
.advertising-contract-narration-admin > summary > b { flex: 0 0 auto; padding: 6px 9px; border-radius: 999px; background: var(--admin-soft); font-size: .7rem; }
.advertising-contract-narration-workspace { padding: 0 18px 18px; display: grid; gap: 12px; }
.advertising-contract-narration-topics { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 7px; }
.advertising-contract-narration-topics button { position: relative; min-width: 0; min-height: 58px; padding: 9px 8px 11px; border: 1px solid var(--admin-line); border-radius: 13px; background: var(--admin-soft); color: var(--admin-muted); display: grid; justify-items: start; align-content: center; gap: 3px; text-align: left; cursor: pointer; }
.advertising-contract-narration-topics button:hover,
.advertising-contract-narration-topics button:focus-visible { border-color: rgba(122,87,225,.55); color: var(--admin-ink); }
.advertising-contract-narration-topics button.is-active { border-color: var(--purple); background: rgba(122,87,225,.09); color: var(--admin-ink); box-shadow: inset 0 0 0 1px rgba(122,87,225,.18); }
.advertising-contract-narration-topics button b { font-size: .62rem; letter-spacing: .08em; color: var(--admin-muted); }
.advertising-contract-narration-topics button span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .68rem; font-weight: 850; }
.advertising-contract-narration-topics button i { position: absolute; right: 8px; top: 8px; width: 7px; height: 7px; border-radius: 50%; background: #c8c3ce; }
.advertising-contract-narration-topics button i.is-saved { background: #43ad7b; box-shadow: 0 0 0 2px rgba(67,173,123,.12); }
.advertising-contract-narration-topics button i.is-muted { background: #d7963c; box-shadow: 0 0 0 2px rgba(215,150,60,.13); }
.advertising-contract-narration-workspace > article { min-width: 0; padding: 17px; border: 1px solid var(--admin-line); border-radius: 17px; background: var(--admin-soft); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 12px; }
.advertising-contract-narration-workspace > article.is-saved { box-shadow: inset 0 0 0 2px rgba(86,177,124,.14); }
.advertising-contract-narration-workspace > article.is-muted { box-shadow: inset 0 0 0 2px rgba(215,150,60,.14); }
.advertising-contract-narration-workspace article > header { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.advertising-contract-narration-workspace article > header > span:first-child { display: flex; align-items: center; gap: 8px; }
.advertising-contract-narration-workspace article > header b { color: var(--admin-muted); font-size: .68rem; }
.advertising-contract-narration-state { display: flex; align-items: center; gap: 8px; }
.advertising-contract-narration-state em { color: var(--admin-muted); font-size: .66rem; font-style: normal; font-weight: 750; }
.advertising-contract-narration-workspace label { min-width: 0; display: grid; gap: 6px; font-size: .74rem; font-weight: 800; }
.advertising-contract-narration-workspace label.advertising-contract-narration-topic-picker { display: none !important; }
.advertising-contract-narration-workspace label.is-wide,
.advertising-contract-narration-workspace fieldset.is-wide,
.advertising-contract-narration-workspace audio,
.advertising-contract-narration-workspace article > p,
.advertising-contract-narration-actions { grid-column: 1 / -1; }
.advertising-contract-narration-workspace select,
.advertising-contract-narration-workspace textarea,
.advertising-contract-narration-workspace input { box-sizing: border-box; width: 100%; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-panel); color: var(--admin-ink); padding: 9px 10px; font: inherit; font-weight: 500; }
.advertising-contract-narration-workspace textarea { resize: vertical; line-height: 1.45; }
.advertising-contract-narration-workspace audio { width: 100%; }
.advertising-contract-narration-workspace label > small { color: var(--admin-muted); font-size: .66rem; font-weight: 600; line-height: 1.4; }
.advertising-contract-narration-workspace article > p { margin: 0; color: var(--admin-muted); font-size: .72rem; line-height: 1.4; }
.advertising-contract-narration-cues { min-width: 0; margin: 0; padding: 14px; border: 1px solid var(--admin-line); border-radius: 15px; background: var(--admin-panel); display: grid; gap: 12px; }
.advertising-contract-narration-cues > legend { padding: 0 7px; color: var(--admin-ink); font-size: .74rem; font-weight: 900; }
.advertising-contract-narration-cue-head { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(170px, .6fr); align-items: end; gap: 12px; }
.advertising-contract-narration-global-toggle { min-height: 48px; padding: 10px 11px; border: 1px solid var(--admin-line); border-radius: 12px; background: var(--admin-soft); grid-template-columns: 20px minmax(0, 1fr); align-items: start; }
.advertising-contract-narration-global-toggle input { width: 18px; min-height: 18px; margin: 1px 0 0; padding: 0; accent-color: var(--purple); }
.advertising-contract-narration-global-toggle > span { display: grid; gap: 3px; }
.advertising-contract-narration-global-toggle small { color: var(--admin-muted); font-weight: 600; line-height: 1.35; }
.advertising-contract-narration-cue-grid { display: grid; gap: 8px; }
.advertising-contract-narration-cue-grid > article { min-width: 0; padding: 10px; border: 1px solid var(--admin-line); border-radius: 12px; background: var(--admin-soft); display: grid; grid-template-columns: minmax(150px, 1fr) minmax(105px, .45fr) minmax(155px, .65fr); align-items: end; gap: 10px; }
.advertising-contract-narration-cue-grid > article > span { align-self: center; min-width: 0; display: flex; align-items: center; gap: 8px; }
.advertising-contract-narration-cue-grid > article > span b { flex: 0 0 auto; color: var(--purple); font-size: .62rem; letter-spacing: .08em; }
.advertising-contract-narration-cue-grid > article > span strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; }
.advertising-contract-narration-workspace .advertising-contract-narration-mute { padding: 12px 13px; border: 1px solid var(--admin-line); border-radius: 13px; background: var(--admin-panel); grid-template-columns: 20px minmax(0, 1fr); align-items: start; }
.advertising-contract-narration-workspace .advertising-contract-narration-mute input { width: 18px; min-height: 18px; margin: 1px 0 0; padding: 0; accent-color: var(--purple); }
.advertising-contract-narration-mute > span { display: grid; gap: 3px; }
.advertising-contract-narration-mute small { color: var(--admin-muted); font-weight: 600; line-height: 1.4; }
.advertising-contract-narration-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.advertising-contract-narration-actions .advertising-contract-narration-generate-all { margin-left: auto; border-color: rgba(122,87,225,.45); color: var(--purple); }
.advertising-contract-narration-note { margin: 0; padding: 0 20px 18px; color: var(--admin-muted); font-size: .72rem; line-height: 1.45; }
.advertising-status.is-new,
.advertising-status.is-enabled { background: #dff6ef; color: #187a62; }
.advertising-status.is-in_progress { background: #eee8ff; color: #6840c7; }
.advertising-status.is-answered { background: #dfeeff; color: #245e96; }
.advertising-status.is-closed,
.advertising-status.is-disabled { background: #ece9ef; color: #66606c; }

@media (max-width: 1180px) {
  .advertising-delivery-master { grid-template-columns: 1fr; align-items: stretch; }
  .advertising-showcase-layout { grid-template-columns: 1fr; }
  .advertising-showcase-preview { position: static; width: min(100%, 620px); }
}

@media (max-width: 820px) {
  .advertising-subview-header,
  .advertising-inquiry-card > header { flex-direction: column; }
  .advertising-inquiry-response,
  .advertising-showcase-appearance,
  .advertising-visual-campaign-slots,
  .advertising-contract-narration-topics { display: none; }
  .advertising-showcase-slots { grid-template-columns: 1fr; }
  .advertising-contract-narration-workspace label.advertising-contract-narration-topic-picker { display: grid !important; gap: 6px; font-size: .74rem; font-weight: 800; }
  .advertising-contract-narration-topic-picker select { box-sizing: border-box; width: 100%; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-panel); color: var(--admin-ink); padding: 10px; font: inherit; }
  .advertising-contract-narration-workspace > article { grid-template-columns: 1fr; }
  .advertising-contract-narration-workspace article > header,
  .advertising-contract-narration-workspace label.is-wide,
  .advertising-contract-narration-workspace fieldset.is-wide,
  .advertising-contract-narration-workspace audio,
  .advertising-contract-narration-workspace article > p,
  .advertising-contract-narration-actions { grid-column: auto; }
  .advertising-contract-narration-cue-head,
  .advertising-contract-narration-cue-grid > article { grid-template-columns: 1fr; }
  .advertising-visual-campaign-admin > header { align-items: stretch; flex-direction: column; }
  .advertising-visual-campaign-admin > header > div:last-child { grid-template-columns: 1fr; }
  .advertising-visual-campaign-slots > article { grid-template-columns: 1fr; }
  .advertising-visual-campaign-slots article > header,
  .advertising-visual-campaign-slots article > footer,
  .advertising-visual-campaign-slots article > .is-wide,
  .advertising-visual-campaign-image { grid-column: auto; }
  .advertising-showcase-preview { padding: 16px; }
  .advertising-delivery-master > .admin-button { width: 100%; }
}

/* Advertising generated-audio inventory */
.advertising-generated-audio-workspace { display: grid; gap: 18px; }
.advertising-generated-audio-hold {
  padding: 14px 15px;
  border: 1px solid #b9caf7;
  border-left: 5px solid #557bd8;
  border-radius: 14px;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 38px;
  align-items: start;
  gap: 12px;
  background: linear-gradient(135deg, #eef4ff, #f6f3ff);
  color: #364a78;
}
.advertising-generated-audio-hold > div { min-width: 0; display: grid; gap: 4px; }
.advertising-generated-audio-hold strong { color: #17283f; }
.advertising-generated-audio-hold span { line-height: 1.5; }
.advertising-generated-audio-hold-icon { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #557bd8; color: #fff; font-weight: 950; }
.advertising-generated-audio-hold > button { width: 36px; height: 36px; border: 1px solid rgba(85, 123, 216, .3); border-radius: 50%; background: rgba(255, 255, 255, .72); color: #364a78; font: inherit; font-size: 1.25rem; cursor: pointer; }
.advertising-generated-audio-hold > button:hover { border-color: #557bd8; background: #fff; }
.advertising-generated-audio-policy-review { width: fit-content; min-height: 38px; padding: 7px 12px; border: 1px solid rgba(122, 87, 225, .28); border-radius: 999px; display: inline-flex; align-items: center; gap: 8px; background: rgba(122, 87, 225, .07); color: var(--purple); font: inherit; font-size: .76rem; font-weight: 900; cursor: pointer; }
.advertising-generated-audio-policy-review span { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--purple); color: #fff; }
.advertising-generated-audio-search { max-width: 760px; display: grid; gap: 7px; }
.advertising-generated-audio-search > span { color: var(--admin-muted); font-size: .72rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.advertising-generated-audio-search input { min-height: 46px; padding: 10px 13px; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-panel); color: var(--admin-text); font: inherit; }
.advertising-generated-audio-search input:focus-visible { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(122, 87, 225, .14); outline: 0; }
.advertising-generated-audio-filters { display: grid; grid-template-columns: minmax(280px, 1.4fr) repeat(5, minmax(130px, .45fr)); align-items: end; gap: 12px; }
.advertising-generated-audio-filters > label { min-width: 0; display: grid; gap: 7px; }
.advertising-generated-audio-filters > label > span { color: var(--admin-muted); font-size: .72rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.advertising-generated-audio-filters select { box-sizing: border-box; width: 100%; min-height: 46px; padding: 10px 13px; border: 1px solid var(--admin-line); border-radius: 11px; background: var(--admin-panel); color: var(--admin-text); font: inherit; }
.advertising-generated-audio-filters select:focus-visible { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(122, 87, 225, .14); outline: 0; }
.advertising-generated-audio-control-shelf { padding: 10px 12px; border: 1px solid var(--admin-line); border-radius: 14px; display: grid; grid-template-columns: auto minmax(390px, 1fr) auto; align-items: end; gap: 12px; background: var(--admin-soft); }
.advertising-generated-audio-control-group { min-width: 0; display: grid; align-content: end; gap: 6px; }
.advertising-generated-audio-control-group > span { min-height: 16px; color: var(--admin-text); font-size: .68rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.advertising-generated-audio-control-group > span small { margin-left: 4px; color: var(--admin-muted); font-size: .62rem; font-weight: 700; letter-spacing: 0; text-transform: none; }
.advertising-generated-audio-access-filters { display: flex; flex-wrap: nowrap; justify-content: flex-end; gap: 5px; }
.advertising-generated-audio-access-filters button { min-height: 34px; padding: 6px 10px; border: 1px solid var(--admin-line); border-radius: 999px; background: var(--admin-panel); color: var(--admin-muted); font: inherit; font-size: .7rem; font-weight: 900; cursor: pointer; }
.advertising-generated-audio-access-filters button.is-active { border-color: var(--purple); background: rgba(122, 87, 225, .1); color: var(--purple); box-shadow: 0 0 0 2px rgba(122, 87, 225, .08); }
.advertising-generated-audio-access-filters button.is-clear { border-style: dashed; }
.advertising-generated-audio-access-filters button:disabled { opacity: .45; cursor: default; }
.advertising-generated-audio-toolbar { display: flex; align-items: end; justify-content: flex-start; gap: 14px; }
.advertising-generated-audio-summary { display: grid; gap: 3px; }
.advertising-generated-audio-result { margin: 0; color: var(--admin-text); font-size: .78rem; font-weight: 900; }
.advertising-generated-audio-summary > p:last-child { margin: 0; color: var(--admin-muted); font-size: .72rem; font-weight: 750; }
.advertising-generated-audio-view-switcher { padding: 3px; border: 1px solid var(--admin-line); border-radius: 11px; display: inline-flex; gap: 3px; background: var(--admin-panel); }
.advertising-generated-audio-view-switcher button { min-height: 34px; padding: 6px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--admin-muted); font: inherit; font-size: .7rem; font-weight: 900; cursor: pointer; }
.advertising-generated-audio-view-switcher button.is-active { background: var(--admin-soft); color: var(--purple); box-shadow: 0 3px 10px rgba(36, 30, 60, .09); }
.advertising-generated-audio-subtabs { width: fit-content; max-width: 100%; padding: 3px; border: 1px solid var(--admin-line); border-radius: 11px; display: flex; flex-wrap: nowrap; gap: 3px; background: var(--admin-panel); }
.advertising-generated-audio-subtabs button { min-height: 34px; padding: 6px 8px; border: 0; border-radius: 8px; display: inline-flex; align-items: center; gap: 6px; background: transparent; color: var(--admin-muted); font: inherit; font-size: .7rem; font-weight: 900; cursor: pointer; white-space: nowrap; }
.advertising-generated-audio-subtabs button span { min-width: 24px; padding: 3px 6px; border-radius: 999px; background: rgba(122, 87, 225, .12); color: var(--purple); font-size: .68rem; text-align: center; }
.advertising-generated-audio-subtabs button.is-active { background: #17283f; color: #fff; box-shadow: 0 7px 18px rgba(23, 40, 63, .16); }
.advertising-generated-audio-subtabs button.is-active span { background: #d9ff5a; color: #17283f; }
.advertising-generated-audio-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.advertising-generated-audio-list[data-view="compact"],
.advertising-generated-audio-list[data-view="details"] { grid-template-columns: 1fr; gap: 9px; }
.advertising-generated-audio-card { min-width: 0; padding: 18px; border: 1px solid var(--admin-line); border-radius: 18px; display: grid; align-content: start; gap: 14px; background: var(--admin-panel); box-shadow: var(--shadow); }
.advertising-generated-audio-card[hidden] { display: none; }
.advertising-generated-audio-card > header { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto auto; align-items: start; gap: 12px; }
.advertising-generated-audio-media,
.advertising-generated-audio-card > header .advertising-generated-audio-media img,
.advertising-generated-audio-mark { width: 58px; height: 58px; border-radius: 14px; object-fit: cover; }
.advertising-generated-audio-media { position: relative; padding: 0; border: 0; display: block; overflow: hidden; background: transparent; color: inherit; }
button.advertising-generated-audio-media { cursor: pointer; }
.advertising-generated-audio-mark { display: grid; place-items: center; background: linear-gradient(135deg, #17283f, #7a57e1); color: #d9ff5a; font-size: 1.5rem; }
.advertising-generated-audio-mark.is-voice { background: linear-gradient(135deg, #251f38, #a550f4); color: #fff; }
.advertising-generated-audio-play-icon { position: absolute; inset: 50% auto auto 50%; width: 31px; height: 31px; border: 1px solid rgba(255, 255, 255, .65); border-radius: 50%; display: grid; place-items: center; background: rgba(34, 24, 63, .88); box-shadow: 0 6px 16px rgba(24, 16, 52, .24); opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.84); transition: opacity .16s ease, transform .16s ease; }
.advertising-generated-audio-play-icon::before { content: ""; width: 0; height: 0; margin-left: 2px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid #fff; }
.advertising-generated-audio-list[data-view="compact"] button.advertising-generated-audio-media:hover .advertising-generated-audio-play-icon,
.advertising-generated-audio-list[data-view="compact"] button.advertising-generated-audio-media:focus-visible .advertising-generated-audio-play-icon,
.advertising-generated-audio-card.is-playing .advertising-generated-audio-play-icon { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.advertising-generated-audio-card.is-playing .advertising-generated-audio-play-icon::before { width: 9px; height: 11px; margin-left: 0; border: 0; border-left: 3px solid #fff; border-right: 3px solid #fff; }
button.advertising-generated-audio-media:focus-visible { outline: 3px solid rgba(122, 87, 225, .26); outline-offset: 3px; }
.advertising-generated-audio-card > header > div { min-width: 0; display: grid; gap: 3px; }
.advertising-generated-audio-card > header > div > span { color: var(--purple); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.advertising-generated-audio-card h3 { margin: 0; overflow-wrap: anywhere; font-size: 1.04rem; }
.advertising-generated-audio-card header small { color: var(--admin-muted); line-height: 1.35; }
.advertising-generated-audio-card audio { width: 100%; }
.advertising-generated-audio-expand { width: 36px; height: 36px; border: 1px solid var(--admin-line); border-radius: 50%; display: none; place-items: center; background: var(--admin-soft); color: var(--admin-text); font: inherit; font-size: 1.1rem; cursor: pointer; }
.advertising-generated-audio-expand span { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; display: block; transform: rotate(45deg) translate(-1px, -1px); transition: transform .18s ease; }
.advertising-generated-audio-card.is-expanded .advertising-generated-audio-expand span { transform: rotate(225deg) translate(-1px, -1px); }
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-expand { display: grid; }
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card > header { cursor: pointer; }
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card > header:focus-visible { border-radius: 9px; outline: 3px solid rgba(122, 87, 225, .2); outline-offset: 4px; }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card,
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card:not(.is-expanded) { padding: 11px 14px; border-radius: 13px; box-shadow: 0 4px 14px rgba(34, 29, 52, .05); }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > :not(header),
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card:not(.is-expanded) > :not(header) { display: none !important; }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > header,
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card:not(.is-expanded) > header { grid-template-columns: 42px minmax(0, 1fr) auto auto; align-items: center; }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > header { grid-template-columns: 42px minmax(180px, .8fr) minmax(520px, 2.2fr) auto; }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-media,
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > header .advertising-generated-audio-media img,
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-mark,
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card:not(.is-expanded) .advertising-generated-audio-media,
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card:not(.is-expanded) .advertising-generated-audio-media img,
.advertising-generated-audio-list[data-view="details"] .advertising-generated-audio-card:not(.is-expanded) .advertising-generated-audio-mark { width: 42px; height: 42px; border-radius: 10px; font-size: 1.1rem; }
.advertising-generated-audio-card > header > .advertising-generated-audio-compact-meta { display: none; }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-compact-meta { min-width: 0; display: grid; grid-template-columns: 1.15fr 1.3fr .7fr 1fr 1.25fr; align-items: center; gap: 6px; }
.advertising-generated-audio-compact-meta > span { min-width: 0; padding-left: 9px; border-left: 1px solid var(--admin-line); display: grid; gap: 2px; color: inherit; text-transform: none; }
.advertising-generated-audio-compact-meta b { color: var(--admin-muted); font-size: .58rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.advertising-generated-audio-compact-meta small { min-width: 0; overflow-wrap: anywhere; color: var(--admin-text); font-size: .68rem; font-weight: 800; line-height: 1.25; }
.advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-expand { display: none; }
.advertising-generated-audio-pending { padding: 14px; border-radius: 12px; background: var(--admin-soft); color: var(--admin-muted); font-size: .78rem; font-weight: 800; text-align: center; }
.advertising-generated-audio-objective { margin: 0; padding: 13px 14px; border-left: 3px solid var(--purple); border-radius: 0 12px 12px 0; background: rgba(122, 87, 225, .07); color: var(--admin-text); line-height: 1.5; }
.advertising-generated-audio-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.advertising-generated-audio-tags span { padding: 5px 8px; border-radius: 999px; background: var(--admin-soft); color: var(--admin-muted); font-size: .66rem; font-weight: 850; }
.advertising-generated-audio-card dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.advertising-generated-audio-card dl > div { min-width: 0; padding: 10px 11px; border: 1px solid var(--admin-line); border-radius: 10px; display: grid; gap: 3px; background: var(--admin-soft); }
.advertising-generated-audio-card dt { color: var(--admin-muted); font-size: .64rem; font-weight: 900; text-transform: uppercase; }
.advertising-generated-audio-card dd { margin: 0; overflow-wrap: anywhere; color: var(--admin-text); font-size: .78rem; font-weight: 800; line-height: 1.35; }
.advertising-generated-audio-card dd small { display: block; margin-top: 2px; color: var(--admin-muted); font-size: .64rem; font-weight: 700; }
.advertising-generated-audio-card dl > .advertising-generated-audio-cost { grid-column: 1 / -1; border-color: rgba(122, 87, 225, .28); background: linear-gradient(135deg, rgba(122, 87, 225, .08), rgba(85, 123, 216, .05)); }
.advertising-generated-audio-card dl > .advertising-generated-audio-cost dd { color: var(--purple); font-size: .9rem; }
.advertising-generated-audio-lifecycle { align-self: start; padding: 6px 9px; border: 1px solid var(--admin-line); border-radius: 999px; background: var(--admin-soft); color: var(--admin-muted); font-size: .64rem; font-weight: 950; text-transform: uppercase; white-space: nowrap; }
.advertising-generated-audio-lifecycle.is-available { border-color: #8fc8a8; background: #e9f7ef; color: #175c35; }
.advertising-generated-audio-lifecycle.is-paused { border-color: #d7bf7a; background: #fff8df; color: #6c5110; }
.advertising-generated-audio-lifecycle.is-recall_pending,
.advertising-generated-audio-lifecycle.is-recalled,
.advertising-generated-audio-lifecycle.is-deleted { border-color: #e4aaa5; background: #fff0ef; color: #8d2f28; }
.advertising-generated-audio-clearance { padding: 13px; border: 1px solid var(--admin-line); border-radius: 13px; display: grid; gap: 9px; background: linear-gradient(135deg, rgba(122, 87, 225, .07), rgba(217, 255, 90, .08)); }
.advertising-generated-audio-clearance > div { display: grid; gap: 3px; }
.advertising-generated-audio-clearance > div span { color: var(--admin-muted); font-size: .74rem; line-height: 1.45; }
.advertising-generated-audio-clearance label { display: flex; align-items: flex-start; gap: 8px; color: var(--admin-text); font-size: .76rem; font-weight: 800; line-height: 1.4; }
.advertising-generated-audio-clearance input { margin-top: 2px; accent-color: var(--purple); }
.advertising-generated-audio-clearance .admin-button { justify-self: start; }
.advertising-generated-audio-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.advertising-generated-audio-actions .admin-button { min-height: 36px; }
.advertising-generated-audio-private-note { padding: 13px; border: 1px solid #cfc3ef; border-radius: 12px; display: grid; gap: 3px; background: #f5f1ff; color: #3a276e; }
.advertising-generated-audio-private-note span { color: #675a83; font-size: .75rem; line-height: 1.45; }
.advertising-generated-audio-deadline { margin: 0; padding: 11px 12px; border-left: 4px solid #c9574e; background: #fff4f3; color: #7b2f29; font-size: .76rem; font-weight: 800; line-height: 1.45; }
.advertising-generated-audio-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; }
.advertising-generated-audio-pagination[hidden] { display: none; }
.advertising-generated-audio-pagination button { min-height: 38px; padding: 7px 13px; border: 1px solid var(--admin-line); border-radius: 10px; background: var(--admin-panel); color: var(--admin-text); font: inherit; font-size: .74rem; font-weight: 900; cursor: pointer; }
.advertising-generated-audio-pagination button:disabled { opacity: .42; cursor: default; }
.advertising-generated-audio-pagination span { min-width: 110px; color: var(--admin-muted); font-size: .74rem; font-weight: 850; text-align: center; }
.advertising-generated-audio-filter-empty { grid-column: 1 / -1; }

@media (max-width: 1180px) {
  .advertising-generated-audio-control-shelf { grid-template-columns: minmax(0, 1fr) auto; }
  .advertising-generated-audio-control-group.is-types { grid-column: 1; grid-row: 1; }
  .advertising-generated-audio-control-group.is-view { grid-column: 2; grid-row: 1; }
  .advertising-generated-audio-control-group.is-access { grid-column: 1 / -1; grid-row: 2; }
  .advertising-generated-audio-access-filters { flex-wrap: wrap; justify-content: flex-start; }
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > header { grid-template-columns: 42px minmax(0, 1fr) auto; }
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-compact-meta { grid-column: 2 / -1; grid-row: 2; grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .advertising-generated-audio-filters { grid-template-columns: 1fr; }
  .advertising-generated-audio-list { grid-template-columns: 1fr; }
  .advertising-generated-audio-control-shelf { grid-template-columns: 1fr; align-items: stretch; }
  .advertising-generated-audio-control-group.is-types,
  .advertising-generated-audio-control-group.is-access,
  .advertising-generated-audio-control-group.is-view { grid-column: 1; grid-row: auto; }
  .advertising-generated-audio-subtabs { width: 100%; flex-wrap: wrap; }
  .advertising-generated-audio-subtabs button { flex: 1 1 135px; justify-content: center; }
  .advertising-generated-audio-toolbar { align-items: stretch; flex-direction: column; }
  .advertising-generated-audio-access-filters { justify-content: flex-start; }
  .advertising-generated-audio-view-switcher { width: 100%; }
  .advertising-generated-audio-view-switcher button { flex: 1; }
  .advertising-generated-audio-card > header { grid-template-columns: 50px minmax(0, 1fr) auto; }
  .advertising-generated-audio-media,
  .advertising-generated-audio-card > header .advertising-generated-audio-media img,
  .advertising-generated-audio-mark { width: 50px; height: 50px; }
  .advertising-generated-audio-card > header .advertising-status,
  .advertising-generated-audio-lifecycle { grid-column: 2; width: fit-content; }
  .advertising-generated-audio-expand { grid-column: 3; grid-row: 1; }
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > header { grid-template-columns: 42px minmax(0, 1fr) auto; }
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-card > header .advertising-status,
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-lifecycle { grid-column: 3; grid-row: 1; }
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-compact-meta { grid-column: 1 / -1; grid-row: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .advertising-generated-audio-list[data-view="compact"] .advertising-generated-audio-compact-meta > span:last-child { grid-column: 1 / -1; }
  .advertising-generated-audio-card dl { grid-template-columns: 1fr; }
  .advertising-generated-audio-actions .admin-button { flex: 1 1 180px; }
}

/* Advertising interactive placement policy */
.advertising-placement-workspace { display: grid; gap: 18px; }
.advertising-placement-tier-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.advertising-placement-tier-grid article,
.advertising-placement-policy-card,
.advertising-placement-inventory { border: 1px solid var(--admin-line); border-radius: 18px; background: var(--admin-panel); box-shadow: var(--shadow); }
.advertising-placement-tier-grid article { min-width: 0; padding: 18px; display: grid; align-content: start; gap: 7px; }
.advertising-placement-tier-grid article > span,
.advertising-placement-policy-card > header span,
.advertising-placement-inventory > header span { color: var(--purple); font-size: .68rem; font-weight: 950; letter-spacing: .05em; text-transform: uppercase; }
.advertising-placement-tier-grid article strong { font-size: 1.08rem; }
.advertising-placement-tier-grid article small { color: var(--admin-muted); line-height: 1.5; }
.advertising-placement-policy-card { padding: 20px; display: grid; gap: 16px; }
.advertising-placement-policy-card > header,
.advertising-placement-inventory > header { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.advertising-placement-policy-card > header > div,
.advertising-placement-inventory > header > div { display: grid; gap: 5px; }
.advertising-placement-policy-card h3,
.advertising-placement-inventory h3 { margin: 0; font-size: clamp(1.25rem, 2.5vw, 2rem); }
.advertising-placement-policy-card > header > small { max-width: 420px; color: var(--admin-muted); line-height: 1.45; text-align: right; }
.advertising-placement-frequency-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.advertising-placement-frequency-grid.is-surfaces { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.advertising-placement-frequency-grid article { min-width: 0; padding: 15px; border: 1px solid var(--admin-line); border-radius: 14px; display: grid; align-content: start; gap: 12px; background: var(--admin-soft); }
.advertising-placement-frequency-grid article > small { min-height: 2.7em; color: var(--admin-muted); line-height: 1.35; }
.advertising-placement-frequency-grid label { min-width: 0; display: grid; gap: 6px; }
.advertising-placement-frequency-grid label > span { color: var(--admin-muted); font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.advertising-placement-frequency-grid select { box-sizing: border-box; width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--admin-line); border-radius: 10px; background: var(--admin-panel); color: var(--admin-text); font: inherit; font-size: .8rem; }
.advertising-placement-frequency-grid select:focus-visible { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(122, 87, 225, .14); outline: 0; }
.advertising-placement-policy-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.advertising-placement-policy-card > footer p { max-width: 900px; margin: 0; color: var(--admin-muted); line-height: 1.5; }
.advertising-placement-policy-card > footer .admin-button { flex: 0 0 auto; }
.advertising-placement-inventory { padding: 20px; display: grid; gap: 16px; }
.advertising-placement-inventory > header > strong { color: var(--admin-muted); }
.advertising-placement-inventory > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.advertising-placement-inventory article { min-width: 0; padding: 16px; border: 1px solid var(--admin-line); border-radius: 14px; display: grid; gap: 11px; background: var(--admin-soft); }
.advertising-placement-inventory article > header { display: flex; justify-content: space-between; gap: 12px; }
.advertising-placement-inventory article > header > div { min-width: 0; display: flex; align-items: center; gap: 9px; }
.advertising-placement-inventory article > header strong { overflow-wrap: anywhere; }
.advertising-placement-inventory article > header > span { color: var(--purple); font-size: .72rem; font-weight: 950; text-transform: uppercase; }
.advertising-placement-inventory article > p { margin: 0; color: var(--admin-muted); }
.advertising-placement-inventory dl { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.advertising-placement-inventory dl div { min-width: 0; padding: 10px; border: 1px solid var(--admin-line); border-radius: 10px; background: var(--admin-panel); }
.advertising-placement-inventory dt { color: var(--admin-muted); font-size: .62rem; font-weight: 900; text-transform: uppercase; }
.advertising-placement-inventory dd { margin: 4px 0 0; overflow-wrap: anywhere; font-size: .76rem; font-weight: 800; line-height: 1.35; }

@media (max-width: 1120px) {
  .advertising-placement-frequency-grid.is-surfaces { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 820px) {
  .advertising-placement-tier-grid,
  .advertising-placement-frequency-grid,
  .advertising-placement-frequency-grid.is-surfaces,
  .advertising-placement-inventory > div { grid-template-columns: 1fr; }
  .advertising-placement-policy-card > header,
  .advertising-placement-inventory > header,
  .advertising-placement-policy-card > footer { align-items: stretch; flex-direction: column; }
  .advertising-placement-policy-card > header > small { max-width: none; text-align: left; }
  .advertising-placement-policy-card > footer .admin-button { width: 100%; }
  .advertising-placement-inventory dl { grid-template-columns: 1fr; }
}
/* Admin Task 567: owner-only Release Lyrics Studio appearance policy. */
.settings-release-lyrics-appearance-card {
  overflow: hidden;
  background:
    radial-gradient(circle at 96% 5%, rgba(174, 96, 201, .13), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(248, 245, 253, .98));
}

.settings-release-lyrics-policy-grid {
  display: grid;
  gap: 12px;
}

.settings-release-lyrics-policy-row {
  display: grid;
  grid-template-columns: 52px minmax(230px, 1fr) minmax(190px, auto);
  align-items: center;
  gap: 14px;
  padding: 14px;
  border: 1px solid rgba(112, 88, 151, .14);
  border-radius: 18px;
  background: rgba(255, 255, 255, .76);
}

.settings-release-lyrics-policy-row > label:not(.checkbox-line) {
  display: grid;
  grid-template-columns: minmax(160px, .55fr) minmax(220px, 1fr);
  align-items: center;
  gap: 3px 16px;
}

.settings-release-lyrics-policy-row > label strong,
.settings-release-lyrics-policy-row > label small {
  grid-column: 1;
}

.settings-release-lyrics-policy-row > label small {
  color: #777083;
  line-height: 1.35;
}

.settings-release-lyrics-policy-row > label select {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-width: 210px;
}

.settings-release-lyrics-policy-swatch {
  width: 46px;
  height: 46px;
  display: block;
  border: 4px solid #fff;
  border-radius: 15px;
  background: linear-gradient(135deg, var(--policy-from), var(--policy-to));
  box-shadow: 0 8px 18px rgba(69, 42, 108, .19), 0 0 0 1px rgba(71, 52, 100, .14);
}

.settings-release-lyrics-enforce {
  min-height: 42px;
  justify-content: flex-start;
  padding: 9px 12px;
  border: 1px solid rgba(123, 91, 173, .16);
  border-radius: 999px;
  background: rgba(244, 238, 255, .72);
  white-space: nowrap;
}

@media (max-width: 940px) {
  .settings-release-lyrics-policy-row {
    grid-template-columns: 46px minmax(0, 1fr);
  }

  .settings-release-lyrics-policy-row > label:not(.checkbox-line) {
    grid-template-columns: 1fr;
  }

  .settings-release-lyrics-policy-row > label select {
    grid-column: 1;
    grid-row: auto;
    margin-top: 8px;
  }

  .settings-release-lyrics-enforce {
    grid-column: 2;
    width: fit-content;
  }
}

/* Private, pre-save uploaded-cover decisions stay separate from release publication. */
.admin-dialog-card.is-upload-cover-review-dialog {
  width: min(100%, 1120px);
  max-width: 1120px;
}

.admin-upload-cover-review {
  display: grid;
  grid-template-columns: minmax(240px, .85fr) minmax(0, 1.15fr);
  align-items: start;
  gap: clamp(24px, 4vw, 48px);
  padding-block: 12px;
}

.admin-upload-cover-review figure { margin: 0; }
.admin-upload-cover-review figure img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  border-radius: 20px;
  background: #f2f0f5;
}
.admin-upload-cover-review figcaption {
  margin-top: 12px;
  font-size: 13px;
  line-height: 1.5;
  color: #625d70;
  overflow-wrap: anywhere;
}
.admin-upload-cover-review-copy { display: grid; gap: 22px; min-width: 0; }
.admin-upload-cover-review-copy p { margin: 7px 0 0; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.admin-upload-cover-review-copy small { display: block; margin-top: 8px; line-height: 1.5; }
.admin-upload-cover-review-copy a { display: inline-block; margin-top: 12px; }
.admin-upload-cover-review-copy details { font-size: 13px; }
.admin-upload-cover-review-copy summary { cursor: pointer; font-weight: 700; }
.admin-upload-cover-review-copy dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 14px; }
.admin-upload-cover-review-copy dd { margin: 0; overflow-wrap: anywhere; }
.admin-upload-cover-review-field { display: grid; gap: 8px; font-weight: 700; }
.admin-upload-cover-review-field select,
.admin-upload-cover-review-field textarea {
  width: 100%;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #cbc6d5;
  border-radius: 12px;
  background: #fff;
  color: #19161f;
  font: inherit;
  font-weight: 400;
}
.admin-upload-cover-review-field textarea { resize: vertical; }
.admin-upload-cover-review-field :is(select, textarea):focus-visible { outline: 2px solid #6b51de; outline-offset: 2px; }
.media-private-track-license { margin-block: 16px; padding: 16px 20px; border: 1px solid var(--border-color, #dcd7e6); border-radius: 16px; text-align: left; }
.media-private-track-license > summary { cursor: pointer; font-size: 16px; font-weight: 650; }
.media-private-track-license > summary > span { margin-left: 10px; font-size: 12px; font-weight: 400; opacity: .7; }
.media-private-track-license [data-media-license-content] { padding-top: 16px; line-height: 1.6; font-size: 14px; overflow-wrap: anywhere; }
.media-private-track-license pre { max-height: 400px; overflow: auto; white-space: pre-wrap; font: inherit; padding: 16px; background: #f5f3fa; color: #292035; border-radius: 12px; }
.admin-track-screening-slot { min-width: 0; width: 100%; margin-block: 18px; }
.settings-ai-layout > [data-settings-category-content="models"] > .admin-track-screening-slot { margin-block: 0; }
.media-private-track-license iframe { display: block; width: 100%; height: 440px; border: 1px solid #e4dfeb; border-radius: 10px; margin-bottom: 12px; background: white; }
body[data-admin-theme="dark"] .admin-upload-cover-review figcaption { color: #bac4d8; }
body[data-admin-theme="dark"] .admin-upload-cover-review-field :is(select, textarea) { color: #ebf1fc; background: #182132; border-color: #546179; }
@media (max-width: 720px) {
  .admin-upload-cover-review { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .admin-upload-cover-review figure { width: min(100%, 320px); margin-inline: auto; }
}

/* Admin Task 823: typed campaigns and policy-change notices. */
.assistant-campaign-type-panel {
  display: grid;
  gap: 14px;
  margin: 18px 0 24px;
  padding: 18px;
  border: 1px solid var(--admin-line);
  border-radius: 20px;
  background: var(--admin-panel);
  box-shadow: var(--shadow);
}
.assistant-campaign-type-panel > div:first-child { display: grid; gap: 4px; }
.assistant-campaign-type-panel > div:first-child > span { color: var(--admin-muted); font-size: .66rem; font-weight: 950; letter-spacing: .08em; text-transform: uppercase; }
.assistant-campaign-type-panel > div:first-child > strong { color: #2f2a3d; font-size: .96rem; }
.assistant-campaign-type-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.assistant-campaign-type {
  min-width: 0;
  min-height: 118px;
  padding: 13px;
  border: 1px solid var(--admin-line);
  border-radius: 15px;
  display: grid;
  align-content: start;
  gap: 5px;
  background: var(--admin-soft);
  color: var(--admin-text);
  text-align: left;
  cursor: pointer;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.assistant-campaign-type:hover:not(:disabled), .assistant-campaign-type:focus-visible { border-color: var(--campaign-color, #7656e8); outline: 0; transform: translateY(-1px); }
.assistant-campaign-type.is-active { border-color: var(--campaign-color, #7656e8); background: color-mix(in srgb, var(--campaign-color, #7656e8) 9%, var(--admin-panel)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--campaign-color, #7656e8) 15%, transparent); }
.assistant-campaign-type b { width: fit-content; padding: 4px 8px; border-radius: 999px; background: color-mix(in srgb, var(--campaign-color, #7656e8) 14%, transparent); color: var(--campaign-color, #7656e8); font-size: .62rem; text-transform: uppercase; }
.assistant-campaign-type span { font-size: .83rem; font-weight: 900; line-height: 1.25; }
.assistant-campaign-type small { color: var(--admin-muted); font-size: .69rem; line-height: 1.35; }
.assistant-campaign-type.is-purple { --campaign-color: #7656e8; }
.assistant-campaign-type.is-blue { --campaign-color: #3978d5; }
.assistant-campaign-type.is-teal { --campaign-color: #198f82; }
.assistant-campaign-type.is-orange { --campaign-color: #ce7421; }
.assistant-campaign-type.is-rose { --campaign-color: #bd4f79; }

.assistant-policy-source-card, .assistant-campaign-focus-card { display: grid; gap: 18px; }
.assistant-policy-recommendation { align-self: start; padding: 7px 11px; border-radius: 999px; font-size: .67rem; font-style: normal; font-weight: 950; text-transform: uppercase; white-space: nowrap; }
.assistant-policy-recommendation.is-recommended { background: #fff0df; color: #9a571b; }
.assistant-policy-recommendation.is-current { background: #e1f6f1; color: #18796c; }
.assistant-policy-source-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.assistant-policy-source { min-width: 0; padding: 15px; border: 1px solid var(--admin-line); border-radius: 15px; background: var(--admin-soft); cursor: pointer; }
.assistant-policy-source.is-selected { border-color: #8264ea; box-shadow: 0 0 0 3px rgba(130, 100, 234, .11); }
.assistant-policy-source > input { position: absolute; opacity: 0; pointer-events: none; }
.assistant-policy-source > span { display: grid; gap: 7px; }
.assistant-policy-source b { color: #2f2a3d; font-size: .94rem; }
.assistant-policy-source b { display: flex; align-items: center; gap: 8px; }
.assistant-policy-source-check { display: inline-grid; flex: 0 0 19px; width: 19px; height: 19px; place-items: center; border: 1.5px solid #aa9bc5; border-radius: 5px; background: #fff; color: #fff; font-size: .78rem; line-height: 1; }
.assistant-policy-source.is-selected .assistant-policy-source-check { border-color: #7656e8; background: #7656e8; }
.assistant-policy-source:focus-within { outline: 3px solid #a696f4; outline-offset: 2px; }
.assistant-policy-source small { color: var(--admin-muted); line-height: 1.45; }
.assistant-policy-source em { width: fit-content; padding: 5px 8px; border-radius: 999px; font-size: .64rem; font-style: normal; font-weight: 950; text-transform: uppercase; }
.assistant-policy-source em.is-changed, .assistant-policy-source em.is-unreviewed { background: #fff0df; color: #9a571b; }
.assistant-policy-source em.is-current { background: #e1f6f1; color: #18796c; }
.assistant-policy-source a { width: fit-content; color: #6849da; font-size: .72rem; font-weight: 850; }
.assistant-policy-review-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px; border: 1px solid rgba(118, 86, 232, .16); border-radius: 15px; background: rgba(118, 86, 232, .055); }
.assistant-policy-review-bar p { max-width: 720px; margin: 0; color: var(--admin-muted); line-height: 1.5; }
.assistant-policy-review-bar > div { min-width: 0; flex: 1 1 auto; }
.assistant-policy-review-bar .assistant-policy-ai-suggestion { margin-top: 10px; color: #3b3157; }
.settings-maintenance-notice-review { padding: 18px; border: 1px solid #d9d4e7; border-radius: 14px; background: #faf8ff; }
.settings-maintenance-notice-review summary { cursor: pointer; font-weight: 850; color: #352d4e; }
.settings-maintenance-notice-review pre { white-space: pre-wrap; overflow-wrap: anywhere; padding: 15px; border: 1px solid #e1ddec; border-radius: 10px; background: #fff; color: #292536; font: 13px/1.55 Segoe UI,Arial,sans-serif; }
.settings-maintenance-news-handoff { padding: 18px; border: 1px solid #dce1d1; border-radius: 14px; background: #fafff1; }
.settings-maintenance-news-handoff .section-title { margin: 0 0 7px; }
.settings-maintenance-news-actions { display: flex; flex-wrap: wrap; gap: 9px; margin: 13px 0; }
.assistant-policy-review-bar .assistant-studio-button { flex: 0 0 auto; }
.assistant-campaign-focus-card > label { display: grid; gap: 8px; }
.assistant-campaign-focus-card > label > span { color: var(--admin-muted); font-size: .7rem; font-weight: 900; text-transform: uppercase; }
.assistant-campaign-focus-checklist { display: flex; flex-wrap: wrap; gap: 8px; }
.assistant-campaign-focus-checklist span { padding: 7px 10px; border-radius: 999px; background: var(--admin-soft); color: var(--admin-muted); font-size: .7rem; font-weight: 800; }

.assistant-policy-email-preview { overflow: hidden; border: 1px solid #e4e0eb; border-radius: 22px; background: #fff; color: #191724; box-shadow: 0 18px 48px rgba(45, 35, 72, .12); }
.assistant-policy-email-preview > header { display: grid; justify-items: center; gap: 12px; padding: 34px 28px 22px; border-bottom: 1px solid #eeeaf3; }
.assistant-policy-email-preview > header .assistant-soundmark { color: #5e43d6; }
.assistant-policy-email-preview > header > span { padding: 6px 10px; border-radius: 999px; background: #f0ebff; color: #6545d8; font-size: .65rem; font-weight: 950; letter-spacing: .06em; text-transform: uppercase; }
.assistant-policy-email-preview > main { padding: 32px; }
.assistant-policy-email-preview > main > p { margin: 0 0 22px; line-height: 1.65; }
.assistant-policy-email-preview h3 { margin: 0 0 18px; color: #191724 !important; font-size: clamp(1.45rem, 3vw, 2rem); line-height: 1.2; }
.assistant-policy-email-preview section { margin-top: 26px; }
.assistant-policy-email-preview h4 { margin: 0 0 8px; font-size: 1rem; }
.assistant-policy-email-preview ul { margin: 0; padding-left: 22px; line-height: 1.6; }
.assistant-policy-email-preview li { margin: 7px 0; }
.assistant-policy-email-preview .assistant-policy-effective { padding: 13px 15px; border-left: 4px solid #7656e8; background: #f7f4ff; }
.assistant-policy-links { display: flex; flex-wrap: wrap; gap: 8px; }
.assistant-policy-email-preview a { color: #5c42d8; font-weight: 750; }
.assistant-policy-email-preview > footer { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; padding: 20px; border-top: 1px solid #ece9ef; background: #f7f6f8; font-size: .72rem; }
.assistant-policy-delivery-controls { display: grid; gap: 12px; margin-top: 16px; }

body[data-admin-theme="dark"] .assistant-policy-email-preview { border-color: #4c5363; }
body[data-admin-theme="dark"] .assistant-campaign-type-panel { background: #111a2a; }
body[data-admin-theme="dark"] .assistant-campaign-type-panel > div:first-child > strong { color: #f1f5ff; }
body[data-admin-theme="dark"] .assistant-campaign-type { background: #172033; color: #edf3ff; }
body[data-admin-theme="dark"] .assistant-campaign-type.is-active { background: color-mix(in srgb, var(--campaign-color, #7656e8) 18%, #172033); }
body[data-admin-theme="dark"] .assistant-policy-source { background: #172033; color: #edf3ff; }
body[data-admin-theme="dark"] .assistant-policy-source small { color: #aeb9cd; }

@media (max-width: 1180px) {
  .assistant-campaign-type-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .assistant-campaign-type-grid, .assistant-policy-source-grid { grid-template-columns: 1fr; }
  .assistant-campaign-type { min-height: 0; }
  .assistant-policy-review-bar { align-items: stretch; flex-direction: column; }
  .assistant-policy-review-bar .assistant-studio-button { width: 100%; }
  .assistant-policy-review-bar .assistant-studio-button { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .assistant-policy-source-card, .assistant-campaign-type-panel, .assistant-policy-review-bar { min-width: 0; max-width: 100%; }
  .assistant-policy-email-preview > main { padding: 26px 22px; }
}
.admin-approval-row.is-deep-linked {
  border-color: #8064e8;
  box-shadow: 0 0 0 3px rgba(128, 100, 232, 0.18), 0 16px 34px rgba(62, 42, 124, 0.13);
}

.admin-approval-row.is-deep-linked:focus-visible {
  outline: 3px solid rgba(128, 100, 232, 0.32);
  outline-offset: 3px;
}

/* Studio Task 898: unified Studio wallet and owner refund presets. */
.users-unified-credit-balance {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(0, 2fr);
  gap: 12px;
  padding: 16px;
  border: 1px solid #ded8f1;
  border-radius: 18px;
  background: linear-gradient(135deg, #f4f0ff, #eefaff);
}
.users-unified-credit-balance > span,
.users-unified-credit-balance > div > span { display: grid; gap: 4px; }
.users-unified-credit-balance > span strong { font-size: clamp(2rem, 4vw, 3.8rem); line-height: .9; }
.users-unified-credit-balance > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.users-unified-credit-balance > div > span { padding: 12px; border-radius: 13px; background: rgba(255,255,255,.72); }
.users-unified-credit-estimates { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.users-unified-credit-estimates > span { display: grid; gap: 4px; padding: 13px; border: 1px solid #e6e0f4; border-radius: 14px; background: #fff; }
.users-unified-credit-estimates strong { font-size: 1.5rem; }
.users-unified-credit-estimates em { color: #777184; font-size: .76rem; font-style: normal; }
.studio-credit-adjustment-presets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 0; border: 0; }
.studio-credit-adjustment-presets legend { margin-bottom: 8px; font-weight: 800; }
.studio-credit-adjustment-presets label { display: flex; gap: 9px; padding: 11px; border: 1px solid #dfd9ee; border-radius: 12px; background: #fff; }
.studio-credit-adjustment-presets label:has(input:checked) { border-color: #8064e8; background: #f4efff; }
.studio-credit-adjustment-presets span { display: grid; gap: 3px; }
.studio-credit-adjustment-presets small { color: #777184; }
.studio-credit-adjustment-amounts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
body[data-admin-theme="dark"] .users-unified-credit-balance { border-color: #49405f; background: linear-gradient(135deg, #211a32, #14252c); }
body[data-admin-theme="dark"] .users-unified-credit-balance > div > span,
body[data-admin-theme="dark"] .users-unified-credit-estimates > span,
body[data-admin-theme="dark"] .studio-credit-adjustment-presets label { border-color: #49405f; background: #1a1721; }
.media-incident-audit { margin-top: 18px; min-width: 0; }
.media-incident-audit-filters { display: grid; grid-template-columns: minmax(220px, 2fr) repeat(2, minmax(145px, 1fr)) repeat(2, minmax(150px, 1fr)) 100px auto; gap: 10px; align-items: end; margin: 18px 0; }
.media-incident-audit-filters label { display: grid; gap: 5px; min-width: 0; font-size: .82rem; font-weight: 800; }
.media-incident-audit-filters .admin-text-input { width: 100%; min-width: 0; }
.media-incident-audit-filters > .admin-button { justify-self: end; }
.media-incident-audit-toolbar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding: 14px 0; border-top: 1px solid var(--line); }
.media-incident-audit-modes { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: #f8f7fb; }
.media-incident-audit-modes button { border: 0; border-radius: 999px; padding: 8px 12px; background: transparent; color: var(--muted); cursor: pointer; font: inherit; font-size: .82rem; font-weight: 850; }
.media-incident-audit-modes button[aria-pressed="true"] { background: #182943; color: #fff; }
.media-incident-selected-account { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 12px 14px; border-radius: 14px; background: #f1edff; color: #5743a9; }
.media-incident-audit-count { margin: 14px 0 10px; color: var(--muted); }
.media-incident-audit-list { display: grid; gap: 9px; min-width: 0; }
.media-incident-account-row { display: grid; grid-template-columns: minmax(170px, 1.4fr) minmax(150px, .9fr) minmax(200px, 1fr) auto; gap: 18px; align-items: center; padding: 15px 17px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.media-incident-account-row > div { display: grid; gap: 4px; min-width: 0; overflow-wrap: anywhere; }
.media-incident-account-row small { color: var(--muted); }
.media-incident-report { padding: 0 16px 16px; border: 1px solid var(--line); border-radius: 16px; background: #fff; min-width: 0; overflow-wrap: anywhere; }
.media-incident-report summary { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 12px; padding: 15px 0; cursor: pointer; }
.media-incident-report summary::before { content: "▸"; color: #8262e8; font-weight: 900; }
.media-incident-report[open] summary::before { content: "▾"; }
.media-incident-report summary strong { color: #473c83; }
.media-incident-report summary small { flex-basis: 100%; color: var(--muted); user-select: all; }
.media-incident-report dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.media-incident-report dt { color: var(--muted); font-size: .75rem; font-weight: 800; }
.media-incident-report dd { margin: 3px 0 0; overflow-wrap: anywhere; }
.media-incident-report pre { max-height: 320px; overflow: auto; padding: 12px; border-radius: 10px; background: #f7f6fb; }
.media-incident-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 18px; }
body[data-admin-theme="dark"] .media-incident-account-row,
body[data-admin-theme="dark"] .media-incident-report { border-color: #49405f; background: #211d2b; }
body[data-admin-theme="dark"] .media-incident-audit-modes,
body[data-admin-theme="dark"] .media-incident-report pre { border-color: #49405f; background: #17141e; }
body[data-admin-theme="dark"] .media-incident-selected-account { background: #32244e; color: #e2d7ff; }
body[data-admin-theme="dark"] .media-incident-report summary strong { color: #cbb8ff; }
@media (max-width: 1500px) { .media-incident-audit-filters { grid-template-columns: repeat(3, minmax(0, 1fr)); } .media-incident-audit-filters > .admin-button { grid-column: 3; } }
@media (max-width: 950px) { .media-incident-account-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .media-incident-account-row .admin-button { justify-self: start; } }
@media (max-width: 760px) {
  .users-unified-credit-balance,
  .users-unified-credit-balance > div,
  .users-unified-credit-estimates,
  .studio-credit-adjustment-presets,
  .studio-credit-adjustment-amounts { grid-template-columns: 1fr; }
  .media-incident-audit-filters,
  .media-incident-account-row,
  .media-incident-report dl { grid-template-columns: 1fr; }
  .media-incident-audit-filters > .admin-button { grid-column: 1; justify-self: stretch; }
  .media-incident-audit-modes { border-radius: 14px; }
  .media-incident-pagination { flex-wrap: wrap; }
}
.assistant-maintenance-workspace{padding:24px 28px 48px;background:#f7f6f4;color:#252235;min-height:70vh}
.assistant-maintenance-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin:0 0 26px}
.assistant-maintenance-heading h2{font-size:clamp(26px,3vw,38px);margin:8px 0 6px;letter-spacing:-.035em}
.assistant-maintenance-heading p{margin:0;color:#676379;max-width:720px}
.assistant-maintenance-layout{display:grid;grid-template-columns:190px minmax(0,1fr) 240px;gap:22px;align-items:start}
.assistant-maintenance-steps{display:grid;gap:9px}
.assistant-maintenance-steps button{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #ddd8ec;border-radius:12px;background:#fff;color:#514b64;padding:12px;font:inherit;cursor:pointer}
.assistant-maintenance-steps button.is-active{background:#ebe5f9;border-color:#8064d6;color:#352174;font-weight:700}
.assistant-maintenance-steps b{display:grid;place-items:center;width:25px;height:25px;flex:none;border-radius:50%;background:#ece8f2;color:#4e3b80}
.assistant-maintenance-steps .is-active b{background:#6c49c5;color:#fff}
.assistant-maintenance-form,.assistant-maintenance-summary{border:1px solid #e6e1ed;border-radius:18px;background:#fff;box-shadow:0 8px 25px #2920430b}
.assistant-maintenance-panel{padding:28px}
.assistant-maintenance-panel[hidden]{display:none}
.assistant-maintenance-panel h3{font-size:25px;margin:8px 0}
.assistant-maintenance-panel p{line-height:1.5;color:#6a6579}
.assistant-maintenance-panel>label:not(.checkbox-line),.assistant-maintenance-fields label{display:grid;gap:8px;color:#4b4660;font-weight:600}
.assistant-maintenance-panel textarea{width:100%;min-height:140px}
.assistant-maintenance-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:23px 0}
.assistant-maintenance-fields input{width:100%}
.assistant-maintenance-presets{display:flex;align-items:center;flex-wrap:wrap;gap:8px;color:#696376}
.assistant-maintenance-choice{display:flex;gap:13px;align-items:flex-start;border:1px solid #e3deed;border-radius:14px;padding:18px;margin:14px 0;cursor:pointer}
.assistant-maintenance-choice span{display:grid;gap:5px}
.assistant-maintenance-choice small{color:#6d687d;line-height:1.4}
.assistant-maintenance-impact{border:0;padding:0;margin:18px 0 0;min-width:0}
.assistant-maintenance-impact legend{font-size:14px;font-weight:750;color:#4b4660;margin-bottom:6px}
.assistant-maintenance-impact .assistant-maintenance-choice{align-items:center;gap:18px;min-height:96px;padding:20px 22px;transition:border-color .16s,background .16s,box-shadow .16s}
.assistant-maintenance-impact .assistant-maintenance-choice:has(input:checked){background:#f3efff;border-color:#7954d1;box-shadow:0 0 0 2px #7954d126}
.assistant-maintenance-choice input[type=radio]{appearance:none;flex:none;width:29px;height:29px;margin:0;border:3px solid #8475a3;border-radius:50%;background:#fff;display:grid;place-items:center;cursor:pointer}
.assistant-maintenance-choice input[type=radio]:checked{border-color:#6844c2}
.assistant-maintenance-choice input[type=radio]:checked::after{content:"";width:13px;height:13px;border-radius:50%;background:#6844c2}
.assistant-maintenance-choice input[type=radio]:focus-visible{outline:3px solid #59c9e5;outline-offset:4px}
.assistant-maintenance-impact .assistant-maintenance-choice strong{font-size:20px;line-height:1.2;color:#241d3e}
.assistant-maintenance-impact .assistant-maintenance-choice small{font-size:14px}
.assistant-maintenance-includes{display:flex!important;gap:8px!important;align-items:center;flex-wrap:wrap;color:#5b4c78;font-size:13px;font-weight:700}
.assistant-maintenance-includes b{padding:4px 9px;border-radius:30px;background:#e5ddf9;color:#4a2b88}
.assistant-maintenance-field{display:grid;gap:8px;color:#4b4660;font-weight:600}
.assistant-maintenance-field-label{display:flex;align-items:center;gap:7px}
.assistant-maintenance-info{position:relative;display:inline-block}
.assistant-maintenance-info summary{list-style:none;display:grid;place-items:center;width:19px;height:19px;border:1px solid #8a6ac9;border-radius:50%;color:#6d45be;font-size:12px;font-weight:800;cursor:pointer}
.assistant-maintenance-info summary::-webkit-details-marker{display:none}
.assistant-maintenance-info[open] p{position:absolute;z-index:8;left:26px;top:-18px;width:min(340px,65vw);box-sizing:border-box;margin:0;padding:13px 15px;border:1px solid #c8b6e9;border-radius:11px;background:#fff;color:#383148;box-shadow:0 9px 24px #2920432b;font-size:13px;font-weight:500;line-height:1.45}
.assistant-maintenance-fields label small{color:#6b667a;font-size:12px;font-weight:500}
.assistant-maintenance-message-field{position:relative;display:grid;gap:8px}
.assistant-maintenance-message-field>label{font-weight:700;color:#3b334e}
.assistant-maintenance-message-field>small{color:#6c667b}
.assistant-maintenance-ai-trigger{position:absolute;top:-8px;right:0;opacity:.45;transition:opacity .15s,transform .15s}
.assistant-maintenance-message-field:hover .assistant-maintenance-ai-trigger,.assistant-maintenance-message-field:focus-within .assistant-maintenance-ai-trigger{opacity:1;transform:translateY(-2px)}
.assistant-maintenance-ai,.assistant-maintenance-drafts{margin:18px 0;padding:18px;border:1px solid #dfd4f4;border-radius:14px;background:#f8f5ff}
.assistant-maintenance-ai[hidden]{display:none}
.assistant-maintenance-ai p,.assistant-maintenance-drafts p{margin:6px 0 12px}
.assistant-maintenance-ai details{margin:12px 0}
.assistant-maintenance-ai details summary{cursor:pointer;font-weight:750;color:#56338e}
.assistant-maintenance-ai details label{display:grid;gap:7px;margin-top:12px;color:#4b4660;font-weight:650}
.assistant-maintenance-ai textarea{min-height:82px;box-sizing:border-box}
.assistant-maintenance-ai-result{margin-top:14px;padding:15px;border:1px solid #d5c7ec;border-radius:11px;background:#fff}
.assistant-maintenance-ai-result[hidden]{display:none}
.assistant-maintenance-ai-result p{white-space:pre-wrap;color:#282137}
.assistant-maintenance-draft-create{display:flex;gap:9px;align-items:end;flex-wrap:wrap}
.assistant-maintenance-draft-create label{display:grid;gap:6px;flex:1;min-width:220px;font-weight:650;color:#4b4660}
.assistant-maintenance-draft-create button{white-space:nowrap}
.assistant-maintenance-draft{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #e3ddee}
.assistant-maintenance-draft>span{display:grid;gap:3px;min-width:0;overflow-wrap:anywhere}
.assistant-maintenance-draft small{color:#756a86}
.assistant-maintenance-draft>div{display:flex;gap:6px;flex:none}
.assistant-maintenance-draft .admin-button{padding:7px 10px}
.assistant-maintenance-message-status{min-height:1em;margin:10px 0 0!important;color:#4e347e!important;font-weight:650}
.assistant-maintenance-message-status.is-error{color:#a42d42!important}
@media(hover:none){.assistant-maintenance-ai-trigger{opacity:1}}
.assistant-maintenance-news,.assistant-maintenance-approval{background:#f7f4fd;border-radius:14px;padding:18px;margin:20px 0}
.assistant-maintenance-news>div{display:flex;flex-wrap:wrap;gap:9px}
.assistant-maintenance-approval{display:grid;gap:13px}
.assistant-maintenance-approval>label:not(.checkbox-line){display:grid;gap:7px}
.assistant-maintenance-panel pre{white-space:pre-wrap;overflow-wrap:anywhere;padding:18px;background:#f6f4fb;border-radius:13px;color:#352f49;line-height:1.5}
.assistant-maintenance-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}
.assistant-maintenance-summary{padding:22px;position:sticky;top:24px;display:grid;gap:9px}
.assistant-maintenance-summary strong{font-size:21px}
.assistant-maintenance-summary p{margin:0;color:#5f596c}
.assistant-maintenance-summary small{margin-top:12px;color:#757080;line-height:1.5}
@media(max-width:1100px){.assistant-maintenance-layout{grid-template-columns:170px minmax(0,1fr)}.assistant-maintenance-summary{grid-column:2;position:static}}
@media(max-width:700px){.assistant-maintenance-workspace{padding:18px 14px 32px}.assistant-maintenance-heading{display:block}.assistant-maintenance-heading .admin-button{margin-top:14px}.assistant-maintenance-layout{display:block}.assistant-maintenance-steps{display:flex;overflow:auto;margin-bottom:14px}.assistant-maintenance-steps button{white-space:nowrap;flex:none}.assistant-maintenance-panel{padding:20px}.assistant-maintenance-fields{grid-template-columns:1fr}.assistant-maintenance-summary{margin-top:16px}}
@media(max-width:700px){.assistant-maintenance-info[open] p{left:-115px;top:26px;width:min(290px,80vw)}.assistant-maintenance-message-field{padding-top:42px}.assistant-maintenance-ai-trigger{top:0}.assistant-maintenance-draft{align-items:flex-start;flex-direction:column}.assistant-maintenance-impact .assistant-maintenance-choice{min-height:0;padding:17px}}

/* Admin Media Library Timeline follows the Admin light/night palette. */
.release-timeline.admin-media-timeline{--rt-ink:var(--text);--rt-muted:color-mix(in srgb,var(--text) 78%,var(--panel-bg));--rt-paper:var(--panel-bg);--rt-soft:var(--panel-soft);--rt-line:var(--line);--rt-accent:var(--purple);padding:24px 0 0;border:1px solid var(--line)}
.release-timeline.admin-media-timeline :is(h2,.rt-album,.rt-album strong,.rt-date,.rt-dialog h3,.rt-metrics strong){color:var(--rt-ink)}
.release-timeline.admin-media-timeline :is(.rt-intro,.rt-status,.rt-legend,.rt-date small,.rt-album time,.rt-views,.rt-foot,.rt-no-upcoming p,.rt-dialog p,.rt-metrics span,.rt-owner){color:var(--rt-muted)}
.release-timeline.admin-media-timeline :is(.rt-kicker,.rt-full-link,.rt-status a,.rt-no-upcoming a,.rt-dialog footer a,.rt-dialog footer button){color:var(--rt-accent)}
.release-timeline.admin-media-timeline :is(.rt-toolbar button,.rt-history-edge button,.rt-dialog,.rt-metrics>div,.rt-dialog [data-rt-close]){background:var(--rt-paper);border-color:var(--rt-line);color:var(--rt-ink)}
.release-timeline.admin-media-timeline :is(.rt-toolbar button:hover,.rt-metrics>div){background:var(--rt-soft)}
.release-timeline.admin-media-timeline .rt-dialog footer{border-color:var(--rt-line)}
.release-timeline.admin-media-timeline .rt-owner{max-width:208px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:1.3}
.release-timeline.admin-media-timeline .rt-album strong{font-size:16px}
.release-timeline.admin-media-timeline .rt-disc{border-color:var(--rt-paper)}
.release-timeline.admin-media-timeline .rt-state{color:var(--rt-accent)}
.release-timeline.admin-media-timeline .is-live .rt-state{color:var(--green);background:var(--green-soft);border-color:color-mix(in srgb,var(--green) 50%,transparent)}
.release-timeline.admin-media-timeline .rt-album[data-rt-state="taken-down"] .rt-state{color:var(--red)}
.release-timeline.admin-media-timeline .rt-album[data-rt-state="previous"] .rt-state{color:var(--rt-muted)}

.community-artist-image-settings{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.community-artist-image-settings>img{border-radius:50%;object-fit:contain;background:#09080f;flex:none}.community-artist-image-settings>.panel-stack{flex:1;min-width:220px}

.community-artist-profile-heading{display:grid;grid-template-columns:minmax(180px,260px) minmax(0,1fr);gap:28px;align-items:center;margin:20px 0 28px}
.community-artist-profile-preview{display:grid;justify-items:center;gap:10px;text-align:center;min-width:0}
.community-artist-profile-preview img,.community-artist-slot-art img{border-radius:50%;object-fit:contain;background:#09080f;border:1px solid var(--line-strong,#d8cae7)}
.community-artist-profile-preview strong{font-size:20px;line-height:1.3;overflow-wrap:anywhere;color:var(--text,#f4f1fa)}
.community-artist-profile-heading form{min-width:0;align-items:start}
.community-artist-profile-heading label{width:100%}
.community-artist-profile-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.community-artist-profile-slot{display:flex;flex-direction:column;align-items:stretch;gap:10px;min-width:0;padding:14px;border:1px solid var(--line-strong,#d8cae7);border-radius:16px;background:var(--panel-soft,#faf6ff)}
.community-artist-profile-slot.is-default{border-color:#ac8bee;box-shadow:inset 0 0 0 1px #ac8bee44}
.community-artist-slot-label{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px}
.community-artist-default-badge{font-size:11px;font-weight:700;padding:3px 7px;border-radius:20px;background:#ad8cf630;color:#6435a5}
.community-artist-slot-art{display:grid;place-items:center;min-height:90px}
.community-artist-slot-empty{display:grid;place-items:center;width:80px;height:80px;border:1px dashed var(--border,#776684);border-radius:50%;font-size:32px;color:var(--muted,#bcb4ca)}
.community-artist-profile-slot .admin-button{width:100%;min-height:42px;white-space:normal;justify-content:center}
.community-artist-profile-slot input[type=file]{width:100%;min-width:0;font-size:11px;padding:8px}
.community-artist-profile-settings .settings-field-hint{line-height:1.5}
.community-artist-profile-settings [data-community-profile-status]:empty{display:none}
@media(max-width:1100px){.community-artist-profile-slots{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.community-artist-profile-heading{grid-template-columns:1fr;gap:20px}.community-artist-profile-slots{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.community-artist-profile-slots{grid-template-columns:1fr}.community-artist-profile-slot{display:grid;grid-template-columns:80px minmax(0,1fr);gap:10px 14px}.community-artist-slot-label{grid-column:1/-1}.community-artist-slot-art{grid-column:1;grid-row:2/4}.community-artist-profile-slot>label,.community-artist-profile-slot>button[value=upload],.community-artist-profile-slot>button[value=logo]{grid-column:1/-1}}

.community-artist-profile-settings :is(.section-note,.detail-meta,.settings-field-hint){color:#655b75}
.admin-app[data-theme="dark"] .community-artist-profile-settings :is(.section-note,.detail-meta,.settings-field-hint){color:#bcb6ca}
.admin-app[data-theme="dark"] .community-artist-default-badge{color:#d3baff}
.community-artist-profile-settings .community-artist-profile-slot .admin-button.subtle{background:var(--panel-bg,#fff);color:var(--text,#34384a);border-color:var(--line-strong,#d8cae7)}
.community-artist-profile-slot.is-default button[value="activate"]{opacity:1;background:#ede4ff;color:#6435a5;border-color:#d8cae7}
.admin-app[data-theme="dark"] .community-artist-profile-settings .admin-button.subtle{background:#1e293b;color:#edf1fa;border-color:#556077}
.admin-app[data-theme="dark"] .community-artist-profile-slot.is-default button[value="activate"]{opacity:1;background:#36274d;color:#e9ddff;border-color:#9b7bc3}

/* One scrolling pricing stack prevents implicit grid rows from filling the screen. */
.admin-panels.is-settings-layout .settings-studio-pricing-stack{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:18px;min-width:0;min-height:0;overflow:auto;padding:18px}
.settings-studio-pricing-stack>*{min-width:0;margin-block:0}
.settings-studio-pricing-stack .studio-pricing-admin{max-width:none}
.settings-studio-pricing-stack .settings-owner-plan-testing>summary{cursor:pointer;font-weight:700}
.settings-studio-pricing-stack .settings-owner-plan-testing>summary span{display:block;font-size:12px;font-weight:400;color:var(--muted-color,#69738a);margin-top:5px}
.settings-studio-pricing-stack .settings-owner-plan-testing>section{margin-top:16px}
@media(max-width:650px){.admin-panels.is-settings-layout .settings-studio-pricing-stack{padding:10px;gap:12px}}

@media(max-width:600px){.settings-community-trial-master-toggle.toggle-card{flex-direction:column;align-items:flex-start}}