/* Member-only presentation: shared geometry/typography, independent palettes.
   Light colors and document ink/paper remain intact. Media is never recolored. */
.studio-page .member-theme-toggle {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  justify-self: start;
  align-items: center;
  gap: 2px;
  width: 76px;
  height: 34px;
  padding: 4px;
  border: 0;
  border-radius: 999px;
  background: transparent;
}

.studio-page .member-theme-toggle::before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  z-index: -1;
  inset: 0;
  border: 1px solid rgba(246, 238, 232, 0.11);
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.025);
  pointer-events: none;
}

.studio-page .member-theme-toggle[hidden] { display: none; }

.studio-page .member-theme-toggle button {
  position: relative;
  isolation: isolate;
  display: inline-grid;
  place-items: center;
  flex: 0 0 33px;
  width: 33px;
  min-width: 33px;
  height: 26px;
  min-height: 26px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #a8988d;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.studio-page .member-theme-toggle button::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 33px;
  height: 26px;
  transform: translate(-50%, -50%);
  border-radius: inherit;
  pointer-events: none;
}

.studio-page .member-theme-toggle button[aria-pressed="true"] { color: #efaa6a; }
.studio-page .member-theme-toggle button[aria-pressed="true"]::before {
  background: rgba(239, 170, 106, 0.12);
  box-shadow: inset 0 0 0 1px rgba(239, 170, 106, 0.28);
}
.studio-page .member-theme-toggle button:hover { color: #f5eee7; }
.studio-page .member-theme-toggle button:focus-visible {
  outline: 2px solid #efaa6a;
  outline-offset: 3px;
}
.studio-page .member-theme-toggle svg { width: 14px; height: 14px; }

/* The painted pill stays slim on touch screens; its two hit areas do not overlap. */
@media (pointer: coarse) {
  .studio-page .member-theme-toggle { width: 88px; height: 44px; gap: 0; padding: 0; }
  .studio-page .member-theme-toggle::before { inset: 5px 0; }
  .studio-page .member-theme-toggle button {
    flex-basis: 44px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
  }
}

[data-member-theme="dark"] .studio-page {
  --member-canvas: #171310;
  --member-side: #1d1713;
  --member-side-deep: #100d0b;
  --member-contrast: #1d1713;
  --member-inverse: #f4ebe4;
  --member-inverse-muted: #aa9b90;
  --member-surface: #d7c9be;
  --member-card: #eadfd7;
  --member-inset: #c6b5a8;
  --member-ink: #201813;
  --member-ink-soft: #514238;
  --member-muted: #75665b;
  --member-accent: #a8643e;
  --member-accent-light: #efab6c;
  --member-line: rgba(46, 34, 27, 0.17);
  --member-line-dark: rgba(246, 238, 232, 0.11);
  /* Small text needs more contrast than the decorative palette accents. */
  --member-accent-text: #78492d;
  --member-muted-text: #625249;
  background: radial-gradient(circle at 82% 5%, rgba(239, 167, 103, 0.08), transparent 31rem), var(--member-canvas);
}

[data-member-theme="dark"] .studio-page .studio-sidebar {
  background: linear-gradient(180deg, var(--member-side), var(--member-side-deep));
  border-color: var(--member-line-dark);
}

/* Geometry remains in styles.css; this file changes only the dark palette. */
[data-member-theme="dark"] .studio-page .studio-page-masthead {
  background:
    linear-gradient(116deg, #dacdc2, #cfbeb1),
    var(--member-surface);
  border-color: #bba99b;
  color: var(--member-ink);
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.24);
}

[data-member-theme="dark"] .studio-page .studio-page-masthead::before {
  border-color: rgba(48, 31, 24, 0.16);
}

[data-member-theme="dark"] .studio-page .studio-masthead-copy h1 {
  color: var(--member-ink);
}

[data-member-theme="dark"] .studio-page .studio-masthead-copy #studio-page-description {
  color: #6b5a50;
}

.studio-page .studio-page-masthead .section-kicker {
  opacity: 1;
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.12em;
}

[data-member-theme="dark"] .studio-page .studio-page-masthead .section-kicker {
  color: #a75d34;
}

[data-member-theme="dark"] .studio-page :is(
  .studio-masthead-account .studio-member-header,
  .studio-masthead-account .studio-main-site-link
) {
  background: var(--member-contrast);
  border-color: var(--member-line-dark);
  color: var(--member-inverse);
}

[data-member-theme="dark"] .studio-page .studio-masthead-account .member-company-name {
  color: var(--member-inverse);
}

[data-member-theme="dark"] .studio-page .studio-masthead-account .member-email-link {
  color: var(--member-inverse-muted);
}

[data-member-theme="dark"] .studio-page .studio-masthead-accessory :is(
  .plan-chip,
  .billing-hero-status,
  .video-studio-format-note,
  .section-status-chip
) {
  background: var(--member-card);
  border-color: var(--member-line);
  color: var(--member-ink);
  box-shadow: none;
}

[data-member-theme="dark"] .studio-page .studio-masthead-accessory :is(
  .plan-chip strong,
  .billing-hero-status strong,
  .video-studio-format-note strong
) {
  color: var(--member-ink);
}

[data-member-theme="dark"] .studio-page .studio-masthead-accessory :is(
  .plan-chip span,
  .billing-hero-status span,
  .section-status-chip
) {
  color: var(--member-accent-text);
}

[data-member-theme="dark"] .studio-page .studio-masthead-accessory :is(
  .billing-hero-status small,
  .video-studio-format-note span,
  .video-studio-format-note small
) {
  color: var(--member-muted-text);
}

[data-member-theme="dark"] .studio-page .studio-masthead-example {
  border-color: var(--member-line-dark);
  background:
    linear-gradient(rgba(244, 235, 228, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(244, 235, 228, 0.035) 1px, transparent 1px),
    var(--member-contrast);
  background-size: 18px 18px;
}

[data-member-theme="dark"] .studio-page .masthead-example-piece {
  border-color: var(--member-line);
  background: var(--member-card);
  color: var(--member-ink);
}

[data-member-theme="dark"] .studio-page .studio-masthead-example--dual-example .masthead-example-piece[data-example-piece="2"] {
  border-color: rgba(239, 171, 108, 0.46);
  background: #9f5d38;
  color: var(--member-inverse);
}

[data-member-theme="dark"] .studio-page .masthead-example-copy > span {
  color: var(--member-muted-text);
}

[data-member-theme="dark"] .studio-page .masthead-example-copy small,
[data-member-theme="dark"] .studio-page .masthead-example-motif {
  color: var(--member-accent-text);
}

/* The approved charcoal-and-linen masthead keeps the editorial artwork intact. */
[data-member-theme="dark"] .studio-page .studio-masthead-side {
  border-color: rgba(48, 31, 24, 0.16);
  background: rgba(45, 30, 24, 0.07);
}

[data-member-theme="dark"] .studio-page .studio-masthead-account .studio-member-header {
  border-color: rgba(48, 31, 24, 0.16);
  background: rgba(45, 30, 24, 0.07);
  color: var(--member-ink);
}

[data-member-theme="dark"] .studio-page .studio-masthead-account .member-company-name {
  color: var(--member-ink);
}

[data-member-theme="dark"] .studio-page .studio-masthead-account .member-email-link {
  color: var(--member-muted-text);
}

[data-member-theme="dark"] .studio-page .studio-masthead-account .studio-main-site-link {
  border-color: var(--member-line-dark);
  background: var(--member-contrast);
  color: var(--member-inverse);
}

[data-member-theme="dark"] .studio-page .studio-masthead-example {
  border: 0;
  background: transparent;
}

[data-member-theme="dark"] .studio-page .masthead-example-label {
  color: #a75d34;
}

[data-member-theme="dark"] .studio-page .masthead-example-piece,
[data-member-theme="dark"] .studio-page .studio-masthead-example--dual-example .masthead-example-piece[data-example-piece="1"] {
  border-color: rgba(248, 229, 212, 0.17);
  background: #251813;
  color: #f7eadf;
}

[data-member-theme="dark"] .studio-page .studio-masthead-example--dual-example .masthead-example-piece[data-example-piece="2"] {
  background: #5d3527;
}

[data-member-theme="dark"] .studio-page .studio-masthead-badge {
  color: #a75d34;
}

[data-member-theme="dark"] .studio-page .masthead-example-copy small {
  color: #d7b9a4;
}

[data-member-theme="dark"] .studio-page .masthead-example-footer {
  color: #d5bca9;
}

.studio-page #overview { gap: 16px; }
.studio-page .studio-overview { gap: 12px; margin-bottom: 0; }
.studio-page .studio-overview article { padding: 18px; border-radius: 5px; }
.studio-page .studio-overview strong { margin: 8px 0; font-size: 28px; line-height: 1.1; }
.studio-page .studio-overview p { font-size: 0.875rem; line-height: 1.5; }
.studio-page :is(.plan-chip, .overview-usage-panel) { border-radius: 5px; }

[data-member-theme="dark"] .studio-page :is(.studio-page-section > .section-heading, .inline-results > .section-heading, .commercial-proposal-results-section > .section-heading, .quote-results-section > .section-heading, .library-toolbar) {
  color: var(--member-inverse);
}
[data-member-theme="dark"] .studio-page :is(.studio-page-section > .section-heading, .inline-results > .section-heading, .commercial-proposal-results-section > .section-heading, .quote-results-section > .section-heading) p {
  color: var(--member-inverse-muted);
}
[data-member-theme="dark"] .studio-page :is(.studio-page-section > .section-heading, .inline-results > .section-heading, .commercial-proposal-results-section > .section-heading, .quote-results-section > .section-heading) h2 {
  color: var(--member-inverse);
}

/* Grouping surfaces: forms, dashboards and workspaces. No generic article or
   descendant color reset: those would also recolor generated documents. */
[data-member-theme="dark"] .studio-page :is(
  .studio-panel, .creation-form, .settings-form, .schedule-form,
  .subscription-access-panel, .module-plan-notice, .studio-notice,
  .diagnosis-result-panel, .diagnosis-score-card, .strategy-context-panel,
  .projects-form, .projects-followup, .projects-progress-panel, .projects-result,
  .projects-view[data-projects-view="history"], .projects-quota-strip,
  .video-studio-editor, .video-projects-section,
  .quote-editor-form, .quote-editor-preview-card, .commercial-proposal-final-card,
  .quote-final-card, .general-chat-panel, .avatar-picker-shell, .diagnosis-content-plan
) {
  background: var(--member-surface);
  color: var(--member-ink);
  border-color: var(--member-line);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}

[data-member-theme="dark"] .studio-page :is(
  .studio-overview article, .usage-list article, .overview-action-grid article,
  .mini-library-card, .schedule-list article, .social-grid article,
  .plan-details-grid article, .library-card, .plan-chip, .account-member-card, .billing-hero-status,
  .billing-summary-grid article, .billing-financial-grid article,
  .billing-limit-grid article, .billing-upgrade-grid article,
  .contacts-metrics article, .contacts-table-shell, .contacts-dialog,
  .contacts-campaign-card, .contacts-template-card, .contacts-recipient-list article,
  .account-summary-list div, .account-security-events article, .account-email-change-panel,
  .account-delete-confirmation, .account-delete-pending,
  .site-analysis-card, .site-analysis-meta article, .site-analysis-insights article,
  .diagnosis-section-grid article, .diagnosis-content-plan article,
  .strategy-context-grid article, .strategy-result-card,
  .brand-script-card, .campaign-script-card, .video-script-card, .schedule-script-card,
  .brand-empty-final-card, .empty-state, .latest-diagnosis-panel,
  .avatar-picker-dialog, .avatar-picker-option,
  .quote-item-row, .quote-items-section, .quote-live-summary,
  .projects-reference-card, .projects-history-card, .projects-progress-current,
  .projects-processing-state, .projects-question-options label,
  .video-studio-preview, .video-media-card, .video-project-row, .video-audio-option,
  .video-soundtrack-picker, .video-soundtrack-trigger, .video-soundtrack-list,
  .video-external-protection,
  .general-chat-message.is-bot, .general-chat-option-card, .general-chat-result-card,
  .general-chat-copy-card, .general-chat-score, .general-chat-detail-list li,
  .general-chat-quote-items, .general-chat-quote-item-row, .general-chat-quote-summary
) {
  background: var(--member-card);
  color: var(--member-ink);
  border-color: var(--member-line);
  box-shadow: none;
}

[data-member-theme="dark"] .studio-page .studio-overview article:nth-child(2) { background: var(--member-surface); }
[data-member-theme="dark"] .studio-page .plan-chip strong { color: var(--member-ink); }
[data-member-theme="dark"] .studio-page .billing-hero-status strong { color: var(--member-ink); }
[data-member-theme="dark"] .studio-page .billing-hero-status span { color: var(--member-accent-text); }
[data-member-theme="dark"] .studio-page .billing-hero-status small { color: var(--member-muted-text); }
[data-member-theme="dark"] .studio-page .video-studio-format-note {
  background: var(--member-card);
  border-color: var(--member-line);
  color: var(--member-ink);
}
[data-member-theme="dark"] .studio-page .video-studio-format-note strong { color: var(--member-ink); }
[data-member-theme="dark"] .studio-page .video-studio-format-note :is(span, small) { color: var(--member-muted-text); }

/* These UI shells host exported paper, whose inherited base ink must stay the
   same as the light theme. The actual document subtree is never overridden. */
[data-member-theme="dark"] .studio-page .studio-main :is(.commercial-proposal-final-card, .quote-final-card, .quote-editor-preview-card, .general-chat-document-result) {
  color: var(--ink);
}

[data-member-theme="dark"] .studio-page .library-toolbar {
  background: var(--member-contrast);
  border-color: var(--member-line-dark);
  color: var(--member-inverse);
}
[data-member-theme="dark"] .studio-page .library-toolbar p { color: var(--member-inverse-muted); }
[data-member-theme="dark"] .studio-page .library-view-switch { background: var(--member-inset); }
[data-member-theme="dark"] .studio-page :is(.schedule-saved-panel .panel-heading h2, .diagnosis-score-card strong, .latest-diagnosis-panel strong) { color: var(--member-ink); }
[data-member-theme="dark"] .studio-page .latest-diagnosis-panel p { color: var(--member-muted-text); }
[data-member-theme="dark"] .studio-page :is(.schedule-saved-panel .panel-heading p, .schedule-saved-panel #schedule-helper, .schedule-saved-panel #schedule-helper[data-type="error"]) { color: var(--member-muted-text); }
[data-member-theme="dark"] .studio-page .schedule-saved-panel .empty-state {
  background: var(--member-card);
  color: var(--member-ink-soft);
  border-color: var(--member-line);
}

/* Native controls stay light because their surrounding surfaces are linen. */
[data-member-theme="dark"] .studio-page :is(
  .creation-form, .settings-form, .schedule-form, .account-form,
  .account-email-change-panel, .account-delete-confirmation, .support-form,
  .projects-form, .projects-answer-form, .video-studio-form,
  .contacts-dialog-card, .contacts-email-form, .contacts-search-tools,
  .general-chat-composer, .general-chat-compact-form, .quote-editor-form
) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="range"]), textarea, select),
[data-member-theme="dark"] .studio-page .contacts-rich-editor {
  background: var(--member-card);
  color: var(--member-ink);
  border-color: var(--member-line);
  color-scheme: light;
}

[data-member-theme="dark"] .studio-page .analysis-source-form input {
  background: var(--member-card);
  color: var(--member-ink);
  border-color: var(--member-line);
  color-scheme: light;
}

[data-member-theme="dark"] .studio-page :is(.creation-form, .settings-form, .schedule-form, .account-form, .support-form, .projects-form, .video-studio-form, .contacts-dialog-card, .contacts-email-form, .general-chat-composer) :is(input, textarea)::placeholder {
  color: var(--member-muted-text);
  opacity: 1;
}

/* Labels, subtitles and helper copy on linen. Intentionally target UI classes,
   not all p/span/strong descendants (paper and brand colors must survive). */
[data-member-theme="dark"] .studio-page :is(
  .studio-overview p, .overview-action-grid p, .mini-library-card p,
  .subscription-access-panel p, .module-plan-notice-copy span,
  .panel-heading > div > p:not(.section-kicker), .panel-heading > p,
  .billing-summary-grid p, .billing-upgrade-grid p, .billing-upgrade-grid ul,
  .billing-action-row p:not([data-type="error"]),
  .contacts-panel-heading > div > p:last-child, .contacts-panel-intro p,
  .contacts-metrics span, .contacts-directory-footer, .contacts-plan-badge,
  .contacts-form-grid small, .contacts-table td span,
  .general-chat-inline-status, .luna-chat-identity small, .general-chat-field-helper,
  .general-chat-message-card > p:not(.section-kicker),
  .video-media-heading p, .video-media-copy span, .video-media-copy small, .video-studio-submit-row p,
  .video-audio-fieldset > p, .video-audio-option small, .video-custom-audio-actions > span,
  .video-soundtrack-trigger small, .video-soundtrack-option small,
  .video-soundtrack-option-meta span, .video-soundtrack-status,
  .account-email-change-heading p, .account-security-events p,
  .support-contact-panel p, .live-chat-status, .brand-contact-heading p
):where(:not(.section-kicker)) { color: var(--member-muted-text); }

[data-member-theme="dark"] .studio-page :is(
  .plan-chip span, .usage-list span, .studio-overview article > span,
  .overview-action-grid span, .mini-library-list span, .library-card > span,
  .billing-summary-grid span, .billing-financial-grid span,
  .billing-limit-grid span, .billing-upgrade-grid span,
  .contacts-table th, .projects-quota-strip span,
  .studio-panel > :where(.panel-heading) .section-kicker,
  .creation-form > :where(.panel-heading) .section-kicker,
  .diagnosis-content-plan > div > span, .diagnosis-section-grid article > span,
  .brand-contact-heading span,
  .general-chat-message > span, .general-chat-compact-form label span
) { color: var(--member-accent-text); }

[data-member-theme="dark"] .studio-page :is(.general-chat-message.is-bot > p, .luna-chat-identity strong) { color: var(--member-ink-soft); }
[data-member-theme="dark"] .studio-page .general-chat-message.is-user { background: var(--member-contrast); }
[data-member-theme="dark"] .studio-page .general-chat-message.is-user > p { color: var(--member-inverse); }
[data-member-theme="dark"] .studio-page .general-chat-message.is-user > span { color: var(--member-accent-light); }

/* Toolbars, table headers and auxiliary wells. Email/document preview canvases
   keep their original paper; only the UI around them is mapped here. */
[data-member-theme="dark"] .studio-page :is(
  .contacts-list-switcher, .contacts-communication-tabs, .contacts-editor-toolbar,
  .contacts-preview-modes, .contacts-table th, .billing-history-table-wrap,
  .contacts-recipient-summary, .contacts-attachment-field,
  .video-media-section, .video-media-retention-note, .video-external-protection-panel,
  .brand-contact-fields, .general-chat-thread, .projects-dimensions
) {
  --member-muted-text: var(--member-ink-soft);
  --member-accent-text: #653c25;
  background: var(--member-inset);
  border-color: var(--member-line);
  color: var(--member-ink-soft);
}
[data-member-theme="dark"] .studio-page .contacts-table tbody tr { background: var(--member-card); }
[data-member-theme="dark"] .studio-page :is(.contacts-table tbody tr.is-selected, .general-chat-option-card.is-selected, .video-media-card.is-selected, .video-project-row.is-active, .video-audio-option.is-selected, .projects-question-options label:has(input:checked)) {
  --member-muted-text: var(--member-ink-soft);
  --member-accent-text: #653c25;
  background: var(--member-inset);
  border-color: var(--member-accent);
}
[data-member-theme="dark"] .studio-page .video-soundtrack-option[aria-selected="true"] {
  background: var(--member-inset);
  box-shadow: inset 3px 0 0 var(--member-accent);
}
[data-member-theme="dark"] .studio-page :is(.video-soundtrack-trigger strong, .video-soundtrack-option strong) { color: var(--member-ink); }
[data-member-theme="dark"] .studio-page :is(.luna-chat-toolbar, .general-chat-composer, .luna-quick-actions) { border-color: var(--member-line); }
[data-member-theme="dark"] .studio-page :is(.luna-new-conversation, .luna-quick-actions button, .contacts-editor-toolbar button, .contacts-preview-modes button, .studio-notice-action) {
  background: var(--member-card);
  border-color: var(--member-line);
  color: var(--member-ink-soft);
}
[data-member-theme="dark"] .studio-page :is(.projects-tabs button, .library-toolbar label) { color: var(--member-inverse-muted); }
[data-member-theme="dark"] .studio-page .projects-tabs button.is-active {
  border-color: var(--member-accent-light);
  color: var(--member-inverse);
}
[data-member-theme="dark"] .studio-page :is(.contacts-preview-modes button.is-active, .contacts-list-switcher button.is-active, .contacts-communication-tabs button.is-active) {
  background: var(--member-contrast);
  color: var(--member-inverse);
}

/* Preserve semantic error/success hues, while giving status messages a known
   light surface so their existing dark text never lands on the canvas. */
[data-member-theme="dark"] .studio-page :is(.account-status, .support-status):not(:empty),
[data-member-theme="dark"] .studio-page :is(.projects-form-notice, .projects-inline-error) {
  background: var(--member-card);
  border-color: var(--member-line);
}
[data-member-theme="dark"] .studio-page :is(.creation-form, .settings-form, .schedule-form, .studio-panel, .projects-form, .video-studio-form) :is(input, select, textarea):disabled {
  background: var(--member-inset);
  color: var(--member-muted-text);
}

/* Linen is darker than the former card palette. Only UI text is adjusted here;
   generated paper, customer branding and semantic status colors stay independent. */
[data-member-theme="dark"] .studio-page :is(
  .field-helper,
  .video-audio-option small, .video-custom-audio-status, .video-projects-section > header > span,
  .projects-dimensions > p, .quote-items-section p, .quote-live-summary > span:not(.is-total),
  .contacts-recipient-summary span, .contacts-recipient-summary small,
  .contacts-editor-toolbar > span, .contacts-attachment-field span,
  .contacts-preview-heading > span, .brand-logo-heading p,
  .company-image-actions .ghost-button, .analysis-source-form > div > p,
  .site-analysis-card > div > p, .social-grid p,
  .account-member-card .member-email-link, .account-delete-support-note
) { color: var(--member-muted-text); }

[data-member-theme="dark"] .studio-page :is(
  .observation-suggestion-button, .video-studio-step,
  .video-project-status:not([data-status="ready"]):not([data-status="published"]):not([data-status="failed"]), .strategy-context-grid span,
  .latest-diagnosis-panel span, .site-analysis-card > div > span,
  .social-grid article > span, .billing-history-table-wrap th,
  .account-summary-list div > span, .account-security-events article > span
) { color: var(--member-accent-text); }

[data-member-theme="dark"] .studio-page .analysis-toggle :is(span, small) { color: var(--member-ink-soft); }

[data-member-theme="dark"] .studio-page :is(
  .studio-panel, .creation-form, .settings-form, .schedule-form,
  .video-studio-editor, .video-studio-preview, .video-projects-section,
  .projects-form, .diagnosis-result-panel, .contacts-workspace
) .section-kicker:not(:where(.quote-document-preview *, .commercial-proposal-document *)) {
  color: var(--member-accent-text);
}

[data-member-theme="dark"] .studio-page :is(.contacts-list-switcher, .contacts-communication-tabs) button:not(.is-active) {
  color: var(--member-ink-soft);
}

@media (prefers-reduced-motion: reduce) {
  .studio-page .member-theme-toggle button { transition: none; }
}

@media (max-width: 900px) {
  [data-member-theme="dark"] .studio-page .studio-masthead-account {
    border-top-color: var(--member-line);
  }
}