/* Presentation only. Every override requires the shared server-resolved
   appearance attribute. Removing it restores the existing Original styles.
   Artwork pixels, photographs, print mounts and color swatches stay unchanged. */
html[data-site-appearance="halloween"] {
  --season-bg:#1b1728;
  --season-surface:#292137;
  --season-soft:#352a46;
  --season-text:#f6effa;
  --season-muted:#c5b7d3;
  --season-accent:#d2bbf0;
  --season-ink:#251a34;
  --season-line:#4b3c5d;
  --season-hover:#443355;
  --season-glow:#c8a2e31a;
}
html[data-site-appearance="fall"] {
  --season-bg:#f2e9df;
  --season-surface:#fffbf5;
  --season-soft:#e9dccb;
  --season-text:#352a23;
  --season-muted:#715e4d;
  --season-accent:#7c492f;
  --season-ink:#fffaf3;
  --season-line:#d9c9b7;
  --season-hover:#e1cfb9;
  --season-glow:#ac6b2e12;
}
html[data-site-appearance="christmas"] {
  --season-bg:#0b211b;
  --season-surface:#132f25;
  --season-soft:#1c3e31;
  --season-text:#f8f3df;
  --season-muted:#b8cdbb;
  --season-accent:#edd38c;
  --season-ink:#183125;
  --season-line:#3a5b47;
  --season-hover:#2b4c3a;
  --season-glow:#e5bf6f1a;
  --season-danger:#f3a9a6;
  --season-header-start:#163429;
  --season-header-end:#0d271e;
  --season-backdrop:#04150dd1;
  --season-logo:url('/seasonal-christmas-logo.svg');
  --season-motif:url('/seasonal-christmas-motif.svg');
}
html[data-site-appearance="newyear"] {
  --season-bg:#171d2d;
  --season-surface:#222a3e;
  --season-soft:#2d354b;
  --season-text:#f6f1e6;
  --season-muted:#c4c7d2;
  --season-accent:#e2c98e;
  --season-ink:#262131;
  --season-line:#4a546d;
  --season-hover:#3c465e;
  --season-glow:#d5b66e20;
  --season-danger:#f0aa9a;
  --season-header-start:#20283c;
  --season-header-end:#303347;
  --season-backdrop:#101523b3;
  --season-logo:url('/seasonal-newyear-logo.svg');
  --season-motif:url('/seasonal-newyear-motif.svg');
}
html[data-site-appearance="winter"] {
  --season-bg:#eef5f8;
  --season-surface:#fbfdff;
  --season-soft:#dcebf2;
  --season-text:#233f51;
  --season-muted:#4e697a;
  --season-accent:#285d7c;
  --season-ink:#fbfdff;
  --season-line:#bfd2de;
  --season-hover:#cfe1eb;
  --season-glow:#78b8d51a;
  --season-danger:#9e3847;
  --season-header-start:#e7f1f7;
  --season-header-end:#f9fcff;
  --season-backdrop:#294b6380;
  --season-logo:url('/seasonal-winter-logo.svg');
  --season-motif:url('/seasonal-winter-motif.svg');
}
html[data-site-appearance="valentine"] {
  --season-bg:#f8ecee;
  --season-surface:#fff9fa;
  --season-soft:#f0dfe4;
  --season-text:#4b2937;
  --season-muted:#7a5262;
  --season-accent:#963e60;
  --season-ink:#fff9fb;
  --season-line:#d9bfc9;
  --season-hover:#e8d1db;
  --season-glow:#c8719220;
  --season-danger:#9e3443;
  --season-header-start:#f5e5e9;
  --season-header-end:#fff4f4;
  --season-backdrop:#4b293780;
  --season-logo:url('/seasonal-valentine-logo.svg');
  --season-motif:url('/seasonal-valentine-motif.svg');
}
html[data-site-appearance] {
  color:var(--season-text);
  background:var(--season-bg);
  --blue:var(--season-accent);
  --muted:var(--season-muted);
  --line:var(--season-line);
}
html[data-site-appearance] :is(body,.onboarding) {
  color:var(--season-text);
  background:var(--season-bg);
}
html[data-site-appearance] :is(.sidebar,.mobile-header,.mobile-nav,.header-band,
  .join-panel,.settings-card,.moderation-item,.explore-artist,.analytics-metric,
  .analytics-section,.artist-account,.profile-hero,.rhythm,.draft-card,
  .today-gallery-locked,.gallery-message,.archive-edition,.empty,.post-panel,.post-menu>div,
  dialog:not(.studio-dialog)) {
  color:var(--season-text);
  background:var(--season-surface);
  border-color:var(--season-line);
}
html[data-site-appearance] .header-band {box-shadow:0 4px 18px #0000000a;}
html[data-site-appearance] :is(.prompt-card,.feature-heading,.feature-heading.weekly,
  .collection-intro,.collection-intro.collection-weekly,.invitation,.setup-notice,
  .account-entry,.account-modes,.today-sort-options,.tabs,.review-status,
  .comment-reply-banner,.share-formats label,.theme-coming-soon,.theme-automatic,
  .site-announcement,.quiet-pill) {
  color:var(--season-text);
  background:var(--season-soft);
  border-color:var(--season-line);
}
html[data-site-appearance] :is(.prompt-card,.invitation) {
  background:linear-gradient(120deg,var(--season-surface),var(--season-soft));
}
html[data-site-appearance] .collection-intro {
  --collection-ink:var(--season-accent);
  --collection-line:var(--season-line);
}
html[data-site-appearance] :is(.primary,.button,.settings-card .primary,
  .join-submit,.suggest-theme-dialog .primary,.drawing-notice-updates .drawing-notice-start) {
  background:var(--season-accent);
  color:var(--season-ink);
  border-color:var(--season-accent);
  box-shadow:none;
}
html[data-site-appearance] :is(.primary:hover,.button:hover,.settings-card .primary:hover,
  .join-submit:hover,.suggest-theme-dialog .primary:hover,.drawing-notice-updates .drawing-notice-start:hover) {
  background:var(--season-accent);
  color:var(--season-ink);
  opacity:.88;
}
html[data-site-appearance] :is(.secondary,.settings-card button:not(.primary),
  .beta-actions button,.moderation-item button,.artist-follow,.post-actions button,
  .post-share,.collection-refresh,.profile-pin,.today-sort-options button,
  .share-formats label:has(:checked)) {
  color:var(--season-text);
  background:var(--season-soft);
  border-color:var(--season-line);
}
html[data-site-appearance] :is(.secondary:hover,.settings-card button:not(.primary):hover,
  .beta-actions button:hover,.moderation-item button:hover,.artist-follow:hover,
  .post-menu button:hover,.post-close:hover,.mobile-menu-toggle:hover,.mobile-menu-close:hover) {
  background:var(--season-hover);
}
html[data-site-appearance] :is(.nav button,.nav-title,.date-label,.topline p,
  .prompt-label,.prompt-sub,.feature-heading p,.collection-intro p,
  .beta-card-info>span,.beta-card-info small,.post-drawn-date,
  .post-caption p,.post-conversation h3>span,.post-comment-meta,.post-comment-meta button,
  .post-comments-empty,.comment-reply-context,.explore-artist small,.explore-loading,
  .artist-account p,.artist-account small,.profile-stats,.profile-hero p,
  .artist-account-handle,.artist-account-stats dt,.artist-gallery-heading>span,
  .archive-heading>p,.today-sort-bar>span,.collection-gallery-heading>span,
  .join-story>p,.join-description,.join-eyebrow,.join-step,.join-values,
  .join-private,.sample-note,.field-help,.optional,.guideline-check,
  .join-divider,.intro,.quiet,.text-link,.art-note,.hero-drawn-date,
  .daily-rhythm,.section-heading p:not(.eyebrow),.steps p,.invitation small,
  .invitation p:not(.eyebrow),footer p,footer nav,.eyebrow,.detail-info p,
  .settings-card .small,.theme-days time,.theme-idea p,.theme-review th,
  .sidebar-note,.sidebar-note svg,.sidebar-note strong,.preview-link,
  .connections-status,.share-panel p,.analytics-metric h2,.analytics-metric p,
  .analytics-section>p,.post-close,.post-menu summary,.artist-account-refresh,
  .password-reveal,.account-modes button,.dialog-close) {
  color:var(--season-muted);
}
html[data-site-appearance] .join-back {color:var(--season-muted)!important;}
html[data-site-appearance] :is(.prompt-word,.daily-rhythm strong,#hero-note strong,
  .gallery-message strong,.profile-stats strong,.mobile-menu-toggle,.mobile-menu-close,
  .collection-intro h1,.post-conversation h3,.post-comment-content p,
  .post-comment-content strong,.post-comments-empty strong,.post-menu button) {
  color:var(--season-text);
}
html[data-site-appearance] :is(.hero h1 em,.step-number,.collection-label,
  .award,.artist-handle,.legal-page a,.legal-links a,.guideline-check button,
  .account-text-button,.preview-onboarding,.mobile-account,.vote.voted,
  .theme-credit-selected button,.theme-credit-results button,.terms-agreement a,
  .collection-eyebrow,.collection-rank,.collection-rank-number,.pinned-label,
  .comment-load-more,.post-comment-form button) {
  color:var(--season-accent);
}
html[data-site-appearance] :is(.nav button.active,.nav button[aria-current="page"],
  .today-sort-options button[aria-pressed="true"],.archive-tabs button[aria-pressed="true"],
  .artist-follow[aria-pressed="true"],.profile-pin[aria-pressed="true"],
  .post-actions .post-vote[aria-pressed="true"],.community-art-card .post-actions .post-vote[aria-pressed="true"]) {
  color:var(--season-accent);
  background:var(--season-soft);
  border-color:var(--season-accent);
}
html[data-site-appearance] :is(.nav button:hover,.tabs,.theme-review th) {background:var(--season-soft);}
html[data-site-appearance] :is(.nav .count,.tabs button.active,.account-modes button[aria-pressed="true"]) {
  background:var(--season-surface);
  color:var(--season-text);
}
html[data-site-appearance] :is(.dev-badge,.mod-badge,.beta-badge,.landing-account .dev-badge) {
  color:var(--season-accent);
  background:var(--season-soft);
  border-color:var(--season-line);
}
html[data-site-appearance] :is(.join-panel input:not([type="checkbox"]),.join-panel textarea,
  .settings-card input:not([type="checkbox"]):not([type="color"]):not([type="range"]),
  .settings-card select,.settings-card textarea,.theme-editor textarea,.theme-editor input:not([type="checkbox"]),
  .theme-schedule-row input,.suggest-theme-dialog input,.theme-idea input,
  .explore-search input,.connections-dialog input,.post-comment-form textarea,
  .bug-report-dialog textarea,.analytics-heading select) {
  color:var(--season-text);
  background:var(--season-bg);
  border-color:var(--season-line);
}
html[data-site-appearance] :is(.join-panel input::placeholder,.join-panel textarea::placeholder,
  .settings-card input::placeholder,.settings-card textarea::placeholder,
  .post-comment-form textarea::placeholder,.explore-search input::placeholder) {
  color:var(--season-muted);
  opacity:.85;
}
html[data-site-appearance] :is(.join-progress span,.join-divider::before,.join-divider::after) {background:var(--season-line);}
html[data-site-appearance] .join-progress .complete {background:var(--season-accent);}
html[data-site-appearance] :is(.join-private,.sidebar-note,.sidebar-profile,.daily-rhythm,
  .how-section,footer,.theme-days li,.theme-review td,.theme-review th) {border-color:var(--season-line);}
html[data-site-appearance] :is(.guideline-check input,.settings-card input[type="checkbox"]) {accent-color:var(--season-accent);}
html[data-site-appearance] :is(.danger-text,.staff-card .danger-text,#account-message,#beta-status) {color:#d78e77;}
html[data-site-appearance="fall"] :is(.danger-text,.staff-card .danger-text,#account-message,#beta-status) {color:#9a422d;}
html[data-site-appearance] :is(button,a,input,select,textarea):focus-visible {
  outline-color:var(--season-accent);
}

/* Dialog content has its own legacy colors. Theme the surrounding interface
   explicitly, without reaching into artwork, award foil, photographs or QR codes. */
html[data-site-appearance] dialog:not(.studio-dialog)::backdrop {
  background:#120e1c99;
}
html[data-site-appearance="fall"] dialog:not(.studio-dialog)::backdrop {
  background:#352a236b;
}
html[data-site-appearance] :is(.drawing-notice-card p,
  .drawing-notice-updates .drawing-notice-features li,.studio-update-card p,
  .published-moment p,.award-moment>p,.suggest-theme-dialog p,
  .info-dialog p,.terms-agreement-dialog p,.dev-selection-dialog p) {
  color:var(--season-muted);
}
html[data-site-appearance] :is(.drawing-notice-card h2,.studio-update-card h2,
  .published-moment h2,.award-moment h2,.suggest-theme-dialog h2,
  .info-dialog h2,.terms-agreement-dialog h2,.dev-selection-dialog h2) {
  color:var(--season-text);
}
/* Older action groups style every button as secondary. Keep the actual
   primary action distinct inside every popup, including moderator reminders. */
html[data-site-appearance] dialog:not(.studio-dialog) .primary {
  color:var(--season-ink);
  background:var(--season-accent);
  border-color:var(--season-accent);
  box-shadow:none;
}
html[data-site-appearance] dialog:not(.studio-dialog) .primary:hover {
  color:var(--season-ink);
  background:var(--season-accent);
  opacity:.88;
}
html[data-site-appearance] :is(.drawing-notice-close,.studio-update-close,
  .drawing-notice-updates .drawing-notice-close) {
  color:var(--season-muted);
  background:var(--season-soft);
}
html[data-site-appearance] :is(.drawing-notice-close:hover,
  .studio-update-close:hover,.drawing-notice-updates .drawing-notice-close:hover) {
  color:var(--season-text);
  background:var(--season-hover);
}
html[data-site-appearance] :is(.moment-close,dialog .icon-button) {
  color:var(--season-muted);
}
html[data-site-appearance] :is(.moment-close:hover,dialog .icon-button:hover) {
  color:var(--season-text);
  background:var(--season-hover);
}
html[data-site-appearance] :is(.drawing-notice-feature-icon,
  .studio-update-tag,.studio-update-card li>span,.moment-symbol,
  .info-steps .step-number,.profile-photo-notice-tag,.profile-photo-notice-icon) {
  color:var(--season-accent);
  background:var(--season-soft);
  border-color:var(--season-line);
}
html[data-site-appearance] :is(.share-image-preview,.dev-selection-candidate) {
  background:var(--season-soft);
}
html[data-site-appearance] .connections-dialog form {
  background:var(--season-surface);
}
html[data-site-appearance] :is(.dev-selection-slot,.post-header,.post-footer,
  .post-comment-form,.post-panel) {
  border-color:var(--season-line);
}
html[data-site-appearance] .post-art-stage {
  background:var(--season-bg);
}
html[data-site-appearance] :is(.share-formats input,
  .terms-agreement-dialog input[type="checkbox"],.info-dialog input[type="checkbox"]) {
  accent-color:var(--season-accent);
}
html[data-site-appearance] .share-formats label:has(:checked) {
  color:var(--season-accent);
  border-color:var(--season-accent);
}
html[data-site-appearance] .share-formats label:has(:focus-visible) {
  outline-color:var(--season-accent);
}
html[data-site-appearance] :is(#detail-status,#beta-status[data-popup="true"],#toast) {
  color:var(--season-text);
  background:var(--season-soft);
  border-color:var(--season-line);
}
html[data-site-appearance] #beta-status[data-popup="true"]>button {
  color:var(--season-text);
}

/* Long account, Terms and sharing messages must remain reachable on a short
   phone viewport. These geometry limits also protect the Original appearance. */
dialog:is(.info-dialog,.terms-agreement-dialog,.suggest-theme-dialog,
  .dev-selection-dialog,.connections-dialog) {
  box-sizing:border-box;
  max-height:calc(100vh - 28px);
  max-height:calc(100dvh - 28px);
  overflow:auto;
  overscroll-behavior:contain;
  overflow-wrap:anywhere;
}
:is(.info-dialog,.terms-agreement-dialog,.suggest-theme-dialog) button {
  white-space:normal;
  overflow-wrap:anywhere;
}
/* Profile-photo announcement shares the existing notice shell. */
.profile-photo-notice-tag {
  display:inline-block;
  margin:0 48px 14px 0;
  padding:5px 8px;
  border-radius:7px;
  background:#edf0ff;
  color:#3b50bd;
  font-size:11px;
  line-height:1.5;
  font-weight:750;
  letter-spacing:1.2px;
}
.profile-photo-notice-icon {
  display:grid;
  place-items:center;
  width:56px;
  height:56px;
  margin-bottom:18px;
  border-radius:16px;
  background:#f0f3ff;
  color:#4457c2;
}
.profile-photo-notice-icon svg {width:32px;height:32px;}
.profile-photo-notice-actions {display:flex;gap:10px;flex-wrap:wrap;}
.profile-photo-notice-actions button {min-height:46px;flex:1 1 140px;}
.profile-photo-notice-card [role="status"]:empty {display:none;}
@media(max-width:450px) {
  .profile-photo-notice-card h2 {margin-right:0;}
}

/* Theme the editor's stationary interface, not the artwork or color samples.
   Keep all viewport, rail and panel geometry in the existing studio styles. */
html[data-site-appearance] .paint-studio.studio-dialog {
  color:var(--season-text);
  background:var(--season-bg);
  border-color:var(--season-line);
}
html[data-site-appearance] .paint-studio :is(.studio-head,.studio-dock.toolbar,
  .practice-adjustments,.studio-tool-panel,#draw-status),
html[data-site-appearance] .paint-studio>.dock-brushes {
  color:var(--season-text);
  background:var(--season-surface);
  border-color:var(--season-line);
}
html[data-site-appearance] .paint-studio .studio-content {
  background-color:var(--season-bg);
  background-image:radial-gradient(circle,var(--season-line) .85px,transparent 1px);
}
html[data-site-appearance] .paint-studio :is(.studio-tool-panel>header,.art-settings) {
  border-color:var(--season-line);
}
html[data-site-appearance] .paint-studio :is(.paint-eyebrow,
  .theme-suggestion-credit,.studio-head #beta-submit label,.draft-local-note,
  .paint-slider output,.practice-adjustments output,.canvas-zoom,
  #canvas-history-status,#dock-selection,.brush-hint,.art-help,.color-extras small) {
  color:var(--season-muted);
}
html[data-site-appearance] .paint-studio #draft-save-status {
  color:var(--season-text);
}
html[data-site-appearance] .paint-studio :is(.studio-head #drawing-title,
  .studio-tool-panel select,.studio-tool-panel #color-hex) {
  color:var(--season-text);
  background:var(--season-bg);
  border-color:var(--season-line);
}
html[data-site-appearance] .paint-studio .studio-head #drawing-title::placeholder {
  color:var(--season-muted);
  opacity:.85;
}
html[data-site-appearance] .paint-studio :is(.dock-brushes button,
  .dock-utilities button,.paint-history button,.canvas-zoom button,
  .studio-tool-panel [data-panel-close],.tool-panel-tabs button,
  .practice-stroke-choices button,.practice-tip-choices button,
  .compare-paint-styles),
html[data-site-appearance] .paint-studio #color-eyedropper {
  color:var(--season-text);
  background:var(--season-soft);
  border-color:var(--season-line);
  box-shadow:none;
}
html[data-site-appearance] .paint-studio :is(.dock-brushes button:hover,
  .dock-utilities button:hover,.paint-history button:hover,.canvas-zoom button:hover,
  .studio-tool-panel [data-panel-close]:hover,.tool-panel-tabs button:hover,
  .practice-stroke-choices button:hover,.practice-tip-choices button:hover,
  .compare-paint-styles:hover),
html[data-site-appearance] .paint-studio #color-eyedropper:hover {
  background:var(--season-hover);
}
html[data-site-appearance] .paint-studio :is(.dock-brushes button[aria-pressed="true"],
  .dock-brushes button[aria-expanded="true"],.dock-utilities button[aria-expanded="true"],
  .canvas-zoom button[aria-pressed="true"],.tool-panel-tabs button[aria-expanded="true"],
  .practice-stroke-choices button[aria-pressed="true"],
  .practice-tip-choices button[aria-pressed="true"]) {
  color:var(--season-accent);
  background:var(--season-hover);
  border-color:var(--season-accent);
  box-shadow:inset 0 0 0 1px var(--season-accent);
}
/* The existing eyedropper's selected colors use !important. Match that single
   state without broadening the override to palette buttons or color inputs. */
html[data-site-appearance] .paint-studio .color-extras #color-eyedropper[aria-pressed="true"] {
  color:var(--season-accent);
  background:var(--season-hover)!important;
  border-color:var(--season-accent)!important;
}
html[data-site-appearance] .paint-studio :is(#publish-status,
  #draft-save-status[data-state="error"],#beta-clear) {
  color:#e6a38a;
}
html[data-site-appearance="fall"] .paint-studio :is(#publish-status,
  #draft-save-status[data-state="error"],#beta-clear) {
  color:#9a422d;
}
html[data-site-appearance] .paint-studio :is(.paint-slider input[type="range"],
  .art-check input[type="checkbox"]) {
  accent-color:var(--season-accent);
}
html[data-site-appearance] .paint-studio #recovery-note {
  color:var(--season-text);
  background:var(--season-soft);
  border-color:var(--season-line);
}
/* Transparent brush samples keep a neutral reference while their surrounding
   choices follow the theme. No bitmap color, filter or opacity is changed. */
html[data-site-appearance] .paint-studio .practice-stroke-choices canvas,
html[data-site-appearance] .paint-studio .practice-tip-choices svg {
  background:#f9fafc;
}
html[data-site-appearance] .paint-studio .practice-tip-choices svg {
  color:#657083;
}
html[data-site-appearance] #studio-dialog :is(button,input,select,textarea):focus-visible {
  outline-color:var(--season-accent);
}

/* Replace only the brand's flower image. Keeping its original src and fixed
   dimensions makes every dynamic shell inherit this logo and restores the
   flower immediately when Original appearance is selected. */
html[data-site-appearance] :is(img.brand-mark[src="/favicon.svg"],
  .site-header .logo>img[src="/favicon.svg"],.drawing-notice-brand>img[src="/favicon.svg"]) {
  content:url('/seasonal-pumpkin-logo.svg');
  background:transparent;
  box-shadow:none;
}
/* Halloween has its own identity. Fall keeps the warm pumpkin above;
   clearing the appearance attribute still restores the original flower. */
html[data-site-appearance="halloween"]:root :is(img.brand-mark[src="/favicon.svg"],
  .site-header .logo>img[src="/favicon.svg"],.drawing-notice-brand>img[src="/favicon.svg"]) {
  content:url('/seasonal-ghost-logo.svg');
}
/* Each additional edition has its own small drawn mark. This more-specific
   override prevents the generic warm-season pumpkin from leaking into it. */
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
  :is(img.brand-mark[src="/favicon.svg"],.site-header .logo>img[src="/favicon.svg"],
  .drawing-notice-brand>img[src="/favicon.svg"]) {
  content:var(--season-logo);
}

/* Night-sky colors stay on the interface. These are static, small SVGs;
   none is positioned over artwork, controls, or the editable canvas. */
html[data-site-appearance="halloween"]:root :is(body,.onboarding) {
  background-color:var(--season-bg);
  background-image:radial-gradient(ellipse at 88% 0,#59407432,transparent 48%);
  background-repeat:no-repeat;
  background-size:100% 640px;
}
html[data-site-appearance="halloween"]:root .header-band {
  background-color:var(--season-surface);
  background-image:linear-gradient(115deg,#211b30,#362941);
  box-shadow:inset 0 1px 0 #eadbf712,0 5px 18px #08050d18;
}
html[data-site-appearance="halloween"]:root .sidebar {
  background-color:var(--season-surface);
  background-image:url('/halloween-corner-web.svg'),linear-gradient(180deg,#2e2340,#211c2f);
  background-position:top right,center;
  background-size:88px 88px,100% 100%;
  background-repeat:no-repeat;
}
html[data-site-appearance="halloween"]:root :is(.mobile-header,.mobile-nav) {
  background:linear-gradient(110deg,#282034,#332540);
}
html[data-site-appearance="halloween"]:root :is(.hero-copy,.join-story) {
  background-image:url('/halloween-corner-web.svg');
  background-position:top right;
  background-size:clamp(58px,6vw,84px) auto;
  background-repeat:no-repeat;
}
/* Dedicated flow blocks leave text and buttons readable, keep SVGs out of
   image exports, and give small screens the same scene without an overlay. */
html[data-site-appearance="halloween"]:root :is(.hero-copy,.join-story,.main,.legal-page)::after {
  content:"";
  display:block;
  width:min(100%,420px);
  aspect-ratio:28/9;
  margin-top:28px;
  background:url('/halloween-moon-graveyard.svg') center bottom/contain no-repeat;
  pointer-events:none;
}
html[data-site-appearance="halloween"]:root :is(.main,.legal-page)::after {
  width:min(100%,480px);
  margin:42px auto 0;
  opacity:.86;
}
html[data-site-appearance="halloween"]:root .hero-copy::after {margin-top:24px;}
html[data-site-appearance="halloween"]:root .invitation {
  background:linear-gradient(130deg,#31243f,#3e2d4d);
  box-shadow:inset 0 1px 0 #ecdaf710;
}
html[data-site-appearance="halloween"]:root :is(.prompt-card,.feature-heading,
  .feature-heading.weekly,.collection-intro,.collection-intro.collection-weekly) {
  background:linear-gradient(120deg,#2b2239,#392b49);
}
html[data-site-appearance="halloween"]:root :is(.feature-heading .feature-emblem,
  .feature-emblem.weekly) {
  background:#46344f;
  color:#ead3a0;
}
html[data-site-appearance="halloween"]:root :is(.join-header,.legal-page>.brand) {
  color:var(--season-text);
}
@media (max-width:650px) {
  html[data-site-appearance="halloween"]:root :is(.hero-copy,.join-story) {background-size:58px auto;}
  html[data-site-appearance="halloween"]:root .hero-copy::after {
    width:min(100%,350px);
    margin-top:24px;
  }
  html[data-site-appearance="halloween"]:root :is(.main,.legal-page)::after {margin-top:28px;}
}
/* Static accents sit in the page flow or stationary navigation. Their CSS
   never reaches a canvas, posted print, profile photograph or brush sample. */
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
  :is(body,.onboarding) {
  background-color:var(--season-bg);
  background-image:radial-gradient(ellipse at 88% 0,var(--season-glow),transparent 52%);
  background-repeat:no-repeat;
  background-size:100% 540px;
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
  :is(.header-band,.mobile-header,.mobile-nav) {
  background:linear-gradient(115deg,var(--season-header-start),var(--season-header-end));
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root .sidebar {
  background-color:var(--season-surface);
  background-image:var(--season-motif),linear-gradient(180deg,var(--season-surface),var(--season-header-start));
  background-position:right 8px top 4px,center;
  background-size:88px 33px,100% 100%;
  background-repeat:no-repeat;
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
  :is(.hero-copy,.join-story,.main,.legal-page)::after {
  content:"";
  display:block;
  width:min(100%,160px);
  aspect-ratio:8/3;
  margin-top:24px;
  background:var(--season-motif) center/contain no-repeat;
  pointer-events:none;
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
  :is(.main,.legal-page)::after {margin:30px auto 0;}
/* The upcoming New Year greeting uses the existing decoration space below
   page content; the compact navigation motif stays separate and text-free. */
html[data-site-appearance="newyear"]:root
  :is(.hero-copy,.join-story,.main,.legal-page)::after {
  width:min(100%,400px);
  aspect-ratio:40/13;
  background-image:url('/seasonal-newyear-greeting-2027.svg');
}
/* Christmas trim stays on the shell and in existing empty page-flow slots.
   Bulbs are static background images, with room above every nearby control. */
html[data-site-appearance="christmas"]:root .header-band {
  background-image:url('/seasonal-christmas-lights.svg'),linear-gradient(115deg,var(--season-header-start),var(--season-header-end));
  background-position:left top,center;
  background-size:280px 28px,100% 100%;
  background-repeat:repeat-x,no-repeat;
}
html[data-site-appearance="christmas"]:root .sidebar {
  background-image:url('/seasonal-christmas-lights.svg'),linear-gradient(180deg,var(--season-surface),var(--season-header-end));
  background-position:left top,center;
  background-size:240px 24px,100% 100%;
  background-repeat:repeat-x,no-repeat;
}
html[data-site-appearance="christmas"]:root .mobile-header {
  padding-top:34px;
  background-image:url('/seasonal-christmas-lights.svg'),linear-gradient(115deg,var(--season-header-start),var(--season-header-end));
  background-position:left top,center;
  background-size:240px 24px,100% 100%;
  background-repeat:repeat-x,no-repeat;
}
html[data-site-appearance="christmas"]:root .main {
  background-image:url('/seasonal-christmas-lights.svg');
  background-position:left top;
  background-size:220px 22px;
  background-repeat:repeat-x;
}
html[data-site-appearance="christmas"]:root
  :is(.hero-copy,.join-story,.main,.legal-page)::after {
  width:min(100%,240px);
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"])
  :is(.danger-text,.staff-card .danger-text,#account-message,#beta-status) {
  color:var(--season-danger);
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"])
  .paint-studio :is(#publish-status,#draft-save-status[data-state="error"],#beta-clear) {
  color:var(--season-danger);
}
html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"])
  dialog:not(.studio-dialog)::backdrop {background:var(--season-backdrop);}
.appearance-form {display:grid;gap:16px;margin-top:18px;}
.appearance-form label {display:grid;gap:7px;max-width:420px;font-weight:550;}
.appearance-form select {min-height:46px;padding:10px 12px;border:1px solid #dce1ee;border-radius:9px;background:#fff;color:#242832;font:inherit;}
.appearance-actions {display:flex;gap:10px;flex-wrap:wrap;}
.appearance-form [role="status"] {font-size:13px;overflow-wrap:anywhere;}
@media print {
  html[data-site-appearance="halloween"]:root :is(.hero-copy,.join-story,.main,.legal-page)::after {display:none;}
  html[data-site-appearance="halloween"]:root :is(body,.onboarding,.sidebar,.hero-copy,.join-story) {background-image:none;}
  html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
    :is(.hero-copy,.join-story,.main,.legal-page)::after {display:none;}
  html[data-site-appearance]:not([data-site-appearance="halloween"]):not([data-site-appearance="fall"]):root
    :is(body,.onboarding,.sidebar) {background-image:none;}
  html[data-site-appearance="christmas"]:root :is(.header-band,.mobile-header,.main) {background-image:none;}
}

/* Approved monthly and holiday illustrations use the existing empty flow slot. */
html:is([data-site-appearance="spring"],[data-site-appearance="showers"],[data-site-appearance="flowers"],[data-site-appearance="sunshine"],[data-site-appearance="beach"],[data-site-appearance="sunflower"],[data-site-appearance="school"],[data-site-appearance="harvest"],[data-site-appearance="stpatrick"],[data-site-appearance="easter"],[data-site-appearance="independence"]):root
  :is(.hero-copy,.join-story,.main,.legal-page)::after {width:min(100%,280px);}