/* The two saved brand colors are exchanged by the theme switch. */
:root {
  --site-primary: #79051b;
  --site-background: #fcf6ef;
  --palette-ink: var(--site-primary);
  --palette-paper: var(--site-background);
  --wine: var(--palette-ink);
  --text: var(--palette-ink);
  --ink: var(--palette-ink);
  --surface: var(--palette-paper);
  --muted: color-mix(in srgb, var(--palette-ink) 65%, var(--palette-paper));
  --soft: color-mix(in srgb, var(--palette-paper) 91%, var(--palette-ink));
  --cream: var(--soft);
  --border: color-mix(in srgb, var(--palette-paper) 78%, var(--palette-ink));
  --line: var(--border);
}
html[data-theme="dark"] {
  --palette-ink: var(--site-background);
  --palette-paper: var(--site-primary);
  --wine: var(--palette-ink);
  --text: var(--palette-ink);
  --ink: var(--palette-ink);
  --surface: var(--palette-paper);
  --muted: color-mix(in srgb, var(--palette-ink) 65%, var(--palette-paper));
  --soft: color-mix(in srgb, var(--palette-paper) 91%, var(--palette-ink));
  --cream: var(--soft);
  --border: color-mix(in srgb, var(--palette-paper) 78%, var(--palette-ink));
  --line: var(--border);
}
:root:not([data-theme="dark"]) .storefront,
:root[data-theme="dark"] .storefront {background:var(--palette-paper);color:var(--palette-ink)}
.storefront .announcement,
.storefront .dark-button,
.storefront .dark-button:hover,
.storefront .mobile-nav button.selected,
.storefront .round-arrow,
.storefront .product-plus,
.storefront .primary,
.storefront .primary:hover,
.storefront .cart-panel > .primary,
.storefront .options .chosen,
.storefront .steps-grid article:is(:nth-child(2),:nth-child(4)),
.storefront #toast {
  background:var(--palette-ink);color:var(--palette-paper);border-color:var(--palette-ink);
}
html[data-theme="dark"] .storefront .dark-button,
html[data-theme="dark"] .storefront .mobile-nav button.selected,
html[data-theme="dark"] .storefront #toast {background:var(--palette-ink);color:var(--palette-paper);border-color:var(--palette-ink)}
.storefront .steps-grid article:is(:nth-child(2),:nth-child(4)) p {color:var(--palette-paper)}
.storefront .home-product .product-image,
html[data-theme="dark"] .storefront .home-product .product-image,
.storefront .cart-row img {background:var(--soft)}
.storefront .floating-tag {background:color-mix(in srgb,var(--palette-paper) 88%,transparent);border-color:var(--border);color:var(--palette-ink)}
html[data-theme="dark"] .storefront .floating-tag {background:color-mix(in srgb,var(--palette-paper) 88%,transparent);border-color:var(--border);color:var(--palette-ink)}
.storefront .category-symbol,.storefront .home-category-grid small,
.storefront .home-product > small,.storefront .home-price small,
.storefront .intro p,.storefront .about-section p,
.storefront footer p,.storefront footer small,
.storefront .steps-grid p {color:var(--muted)}
.storefront .square-caption small,.storefront .panel-eyebrow {color:var(--muted)}
.storefront .home-price del {color:var(--muted)}
.storefront .mobile-nav b,.storefront #banner-dots button.selected {background:var(--palette-ink);color:var(--palette-paper)}
.storefront #banner-dots button:not(.selected) {background:var(--border)}
.storefront #products .product-image .heart,
html[data-theme="dark"] .storefront #products .product-image .heart {color:var(--palette-ink)}
.storefront .banner-orbit {border-color:var(--border)}
.storefront .banner-halo {background:radial-gradient(ellipse at 65% 30%,var(--soft),transparent 55%)}
.storefront .price,.storefront .badge,.storefront select {color:var(--palette-ink)}
.storefront .badge,.storefront select,.storefront .form input,.storefront .form select,.storefront .form textarea {background:var(--soft)}
.storefront .cart-row p {color:var(--muted)}
.storefront .options .chosen {background:var(--soft);color:var(--palette-ink);border-color:var(--palette-ink)}
.storefront #theme-toggle {color:var(--palette-ink)}
.storefront .mobile-nav button.selected:hover {background:var(--palette-ink);color:var(--palette-paper)}

/* Storefront surfaces, controls and illustrations share the chosen palette. */
.storefront .hero,.storefront .hero-art,.storefront .editorial,
.storefront .editorial:has(.brand-story-art),.storefront .coming-soon,
.storefront .clothing-subcategories,.storefront .nav-clothing-panel,
.storefront #wholesale-page,.storefront .submenu,
.storefront .subcategory-grid button,.storefront .nav-clothing-panel button,
.storefront .search,.storefront .notice,.storefront .empty-state,
.storefront .panel-icon,.storefront .qty,
.storefront .home-category-grid > a {
  background:var(--soft);color:var(--palette-ink);border-color:var(--border);
}
.storefront .hero-art {
  background:linear-gradient(130deg,var(--soft),color-mix(in srgb,var(--palette-paper) 78%,var(--palette-ink)));
}
.storefront .hero-art .arch {
  background:linear-gradient(130deg,var(--soft),var(--border));border-color:var(--border);
}
.storefront .campaign-banner,.storefront .campaign-0,
.storefront .campaign-1,.storefront .campaign-2 {
  background:var(--soft);color:var(--palette-ink);
}
.storefront .campaign-1 {background:var(--palette-ink);color:var(--palette-paper)}
.storefront .campaign-1 .eyebrow {color:var(--palette-paper)}
.storefront .campaign-orbit,.storefront .hero-foot,
.storefront .category span,.storefront .product-bottom button {border-color:var(--border)}
.storefront .hero-art:after,.storefront .art-word,.storefront .art-caption,
.storefront .category small,.storefront .category span,
.storefront .product .sub,.storefront .demo-note,
.storefront .eyebrow,.storefront .small-label,
.storefront .hero p,.storefront .hero-foot,
.storefront .editorial p,.storefront .detail p,
.storefront .round-note,.storefront .store-nav small,
.storefront .footer-sign,.storefront .copyright,
.storefront footer button,.storefront .empty,
.storefront .coming-soon p,.storefront .coming-soon .eyebrow,
.storefront .notice,.storefront .dashboard-panel h3,
.storefront .dashboard-panel [role="alert"] {color:var(--muted)}
.storefront .subcategory-grid button:hover,.storefront .submenu button:hover {
  background:var(--border);color:var(--palette-ink);
}
.storefront .product-image,.storefront .lingerie,
.storefront .accessories,.storefront .beauty,
.storefront .coming-soon,.storefront .dashboard-panel .dashboard-order {
  background:var(--soft);
}
.storefront .product-image .heart {background:var(--palette-paper);color:var(--palette-ink)}
.storefront .heart.saved {background:var(--soft);color:var(--palette-ink)}
.storefront .price del,.storefront .home-price del {color:var(--muted)}
.storefront .product-bottom button,.storefront .options button {border-color:var(--border)}
.storefront .options .chosen {background:var(--palette-ink);color:var(--palette-paper);border-color:var(--palette-ink)}
.storefront .home-price,.storefront .cart-row,.storefront .home-product,
.storefront .store-nav,.storefront .submenu,.storefront .clothing-subcategories {
  border-color:var(--border);
}
.storefront .bag b,.storefront .primary,.storefront #toast {
  background:var(--palette-ink);color:var(--palette-paper);border-color:var(--palette-ink);
}
.storefront footer,.storefront .mobile-nav,.storefront dialog,
.storefront .store-nav,.storefront .floating-header {
  background:color-mix(in srgb,var(--palette-paper) 94%,transparent);
  color:var(--palette-ink);border-color:var(--border);
}
.storefront #search-panel,.storefront .nav-clothing-panel button,
.storefront .subcategory-grid button,.storefront .cart-row,
.storefront dialog input,.storefront dialog textarea,.storefront dialog select {
  background:var(--soft);color:var(--palette-ink);border-color:var(--border);
}
.storefront #theme-toggle,.storefront .step-label {
  background:var(--soft);color:var(--palette-ink);border-color:var(--border);
}
.storefront .steps-grid b {color:color-mix(in srgb,var(--palette-ink) 20%,transparent)}
.storefront .steps-grid article:is(:nth-child(2),:nth-child(4)) b,
.storefront .steps-grid article:is(:nth-child(2),:nth-child(4)) .step-label {color:var(--palette-paper)}
.storefront .dashboard-panel [role="alert"] {color:var(--palette-ink)}
.storefront dialog::backdrop {background:color-mix(in srgb,var(--site-primary) 45%,transparent)}

/* Login is a separate document; it reads the same saved pair of colors. */
body.login-page,body.login-page.dark {
  background:var(--palette-paper);color:var(--palette-ink);
}
body.login-page.dark {
  --palette-ink:var(--site-background);--palette-paper:var(--site-primary);
  --soft:color-mix(in srgb,var(--palette-paper) 91%,var(--palette-ink));
  --border:color-mix(in srgb,var(--palette-paper) 78%,var(--palette-ink));
  --muted:color-mix(in srgb,var(--palette-ink) 65%,var(--palette-paper));
}
.login-page main,.login-page.dark main {
  background:var(--soft);color:var(--palette-ink);border-color:var(--border);
  box-shadow:0 18px 55px color-mix(in srgb,var(--palette-ink) 14%,transparent);
}
.login-page p,.login-page .hint {color:var(--muted)}
.login-page input,.login-page.dark input {
  background:var(--palette-paper);color:var(--palette-ink);border-color:var(--border);
}
.login-page button,.login-page button:hover {
  background:var(--palette-ink);color:var(--palette-paper);
}
.login-page .switch,.login-page .secondary,
.login-page.dark .switch,.login-page.dark .secondary {
  background:transparent;color:var(--palette-ink);border-color:var(--border);
}
.login-page a,.login-page.dark a {color:var(--palette-ink)}
.login-page .error {color:var(--palette-ink)}
