/* Boutique ivory and fashion charcoal. Photography is deliberately untouched. */
:root {
  --ui-paper:#f3f0e9;--ui-surface:#fcfaf5;--ui-ink:#3c322c;--ui-muted:#797168;
  --ui-line:#ddd5c8;--ui-accent:#3c322c;--ui-soft:#e5dccf;--ui-on-accent:#fcfaf5;
  --ui-header:#f3f0e9ed;--ui-shadow:#30251b0c; color-scheme:light;
}
:root[data-theme="dark"] {
  --ui-paper:#121212;--ui-surface:#202020;--ui-ink:#eeede8;--ui-muted:#aaa9a3;
  --ui-line:#353535;--ui-accent:#eeede8;--ui-soft:#343434;--ui-on-accent:#171717;
  --ui-header:#121212ed;--ui-shadow:#0005; color-scheme:dark;
}
:root,body,body.wardrobe-collections-active,#wardrobeView.wc-wardrobe,.wc-dialog {
  --paper:var(--ui-paper);--card:var(--ui-surface);--ink:var(--ui-ink);--muted:var(--ui-muted);
  --line:var(--ui-line);--accent:var(--ui-accent);--accent-soft:var(--ui-soft);
}
body { background:var(--paper);color:var(--ink); }
.topbar,.wardrobe-collections-active .topbar { background:var(--ui-header); }
.theme-toggle { display:inline-grid;place-items:center;flex-shrink:0;width:36px;height:44px;padding:8px;border:0;background:transparent;color:var(--ink);border-radius:50%; }
.theme-toggle svg { width:19px;height:19px; }
.top-actions .theme-toggle { padding:8px; }
.theme-toggle:focus-visible { outline:2px solid var(--ink);outline-offset:1px; }
.top-actions #accountButton { min-width:44px;min-height:44px;padding:0 8px;border:0;background:transparent;color:var(--ink);font-size:12px;white-space:nowrap; }
:root[data-theme="dark"] .atelier-table-column .canvas { background:radial-gradient(ellipse at 22% 8%,#efe4ce42,transparent 65%),repeating-linear-gradient(0deg,transparent 0,transparent 3px,#7565480a 3px,#7565480a 4px),#c9bfa8;border-color:#a99b7d;box-shadow:0 6px 0 #887b62,0 13px 18px #0002; }
.primary,.wc-primary,#wc-selection button,.wardrobe-collections-active #addGarmentButton { background:var(--ui-accent);color:var(--ui-on-accent); }
.wc-card,.wc-wardrobe .archive-thumbnail { background:var(--ui-surface);border-color:var(--ui-line); }
.wc-cover { aspect-ratio:.94; }
.wc-motion { aspect-ratio:1; }
.wc-wardrobe .archive-thumbnail-image { aspect-ratio:1; }
.wc-photo { flex:1 1 100%; }
.wc-card { border:0;box-shadow:0 1px 3px var(--ui-shadow); }
.wc-wardrobe .archive-thumbnail { border:0; }
.wardrobe-collections-active .bottom-nav,.bottom-nav { background:var(--ui-surface);border-color:var(--ui-line);box-shadow:0 5px 24px var(--ui-shadow); }
.wardrobe-collections-active .bottom-nav button,.bottom-nav button { color:var(--ui-muted); }
.wardrobe-collections-active .bottom-nav button.active,.bottom-nav button.active { background:var(--ui-soft);color:var(--ui-ink); }
#wc-selection { background:var(--ui-soft);color:var(--ui-ink); }
.wc-dialog .category-tabs button[aria-pressed="true"] { background:var(--ui-accent);border-color:var(--ui-accent);color:var(--ui-on-accent); }
.wc-wardrobe .archive-thumbnail>button[aria-pressed]::after { background:var(--ui-surface);border-color:var(--ui-muted); }
.wc-wardrobe .archive-thumbnail>button.wc-picked::after { background:var(--ui-accent);border-color:var(--ui-accent);color:var(--ui-on-accent); }
input,textarea,select { color:var(--ink); }
dialog { color:var(--ink);background:var(--card);border-color:var(--line); }
.icon-button { color:var(--ui-ink);background:var(--ui-soft); }
.category-tabs button { color:var(--ui-ink);border-color:var(--ui-line); }
.category-tabs button[aria-pressed="true"] { color:var(--ui-on-accent);background:var(--ui-accent);border-color:var(--ui-accent); }
.catalog-tools small { color:var(--ui-muted); }
.toast { background:var(--ui-accent);color:var(--ui-on-accent); }
.garment-group-choices { margin:0 0 18px;padding:0;border:0;min-width:0; }
.garment-group-choices legend { margin-bottom:9px;padding:0;font-size:13px; }
.garment-group-choices legend small { margin-left:6px;color:var(--muted);font-size:11px; }
.garment-group-choices>div { display:flex;flex-wrap:wrap;gap:7px; }
.garment-group-choices label { display:inline-flex;align-items:center;gap:6px;margin:0;padding:8px 10px;min-height:40px;border:1px solid var(--line);border-radius:18px;font-size:12px;cursor:pointer; }
.garment-group-choices label:has(input:checked) { background:var(--accent-soft);border-color:var(--muted); }
.garment-group-choices label:has(input:focus-visible) { outline:2px solid var(--ink);outline-offset:2px; }
.garment-group-choices input { width:14px;height:14px;margin:0;padding:0;accent-color:var(--accent); }
.garment-group-tags { display:flex;flex-wrap:wrap;gap:5px; }
/* Dark surfaces beyond the wardrobe keep the single theme toggle consistent. */
:root[data-theme="dark"] .hero,
:root[data-theme="dark"] .tag,
:root[data-theme="dark"] .styling-concept,
:root[data-theme="dark"] .tryon-reveal,
:root[data-theme="dark"] .legacy-access,
:root[data-theme="dark"] .archive-category,
:root[data-theme="dark"] .atelier-selected-row,
:root[data-theme="dark"] .atelier-shelf,
:root[data-theme="dark"] .atelier-shelf-card,
:root[data-theme="dark"] .atelier-browser,
:root[data-theme="dark"] .atelier-browser .picker-entry,
:root[data-theme="dark"] .look-cover,
:root[data-theme="dark"] .result-card,
:root[data-theme="dark"] .profile-photo,
:root[data-theme="dark"] .photo-slot { background:var(--ui-surface);color:var(--ui-ink);border-color:var(--ui-line); }
:root[data-theme="dark"] :is(.personal-info,.photo-guidance,.archive-audit,.tag-suggestions,.wear-reference-card,.viewer-toolbar,.image-viewer,.photo-field,.ai-button,.outfit-layer-row.selected) { background:var(--ui-surface);color:var(--ui-ink);border-color:var(--ui-line); }
:root[data-theme="dark"] .wonder-button { background:#34343c;color:var(--ui-ink);border-color:#55555a; }
:root[data-theme="dark"] :is(.image-choice button.active,.dictate-icon.listening) { background:var(--ui-accent);color:var(--ui-on-accent); }
:root[data-theme="dark"] :is(.intake-photo-gallery button,.atelier-browser .picker-preview) { background:var(--ui-surface);color:var(--ui-ink); }
:root[data-theme="dark"] .atelier-selected-copy,
:root[data-theme="dark"] .styling-concept>small { color:var(--ui-muted); }
:root[data-theme="dark"] .account-gate { background:var(--ui-paper);color:var(--ui-ink); }
:root[data-theme="dark"] :is(input,select,textarea) { background-color:var(--ui-surface);border-color:var(--ui-line); }
@media(max-width:350px) { .theme-toggle { width:31px;padding:6px; } #wc-count { font-size:10px; } }
