/* White City palette and component roles for Touch 32. */
html[data-profile=touch32][data-touch-theme=white-city]{
 --touch-bg:#EEE9DE;--paper:#EEE9DE;--cream:#EEE9DE;--ink:#403E37;--blue:#403E37;
 --muted:#5E5B52;--touch-secondary:#5E5B52;--accent:#A39D8B;
 --line:#847E70;
 --wc-selected:#403E37;--wc-on-selected:#FFFDF7;--wc-field:#FFFCF5;
 --wc-effect:#403E37;--wc-inset:#E2DCCE;color-scheme:light;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal{color:var(--ink);--content-surface:var(--touch-surface);accent-color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(h1,h2,h3,h4,p,strong,label,legend,dt,dd,small,summary){color:inherit}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.mini-look-anchors,.mini-look-summary,.mini-review,.mini-pair-identity,.touch-checkout-pair,.mini-detail,.mini-fitting-details,.celebration-copy,.comparison-copy,.comparison-specs,.fitting-loader,.placeholder,.mini-reason-copy){color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.mini-brand small,.mini-privacy,.mini-note,.mini-details,.mini-detail-line,.mini-fitting-identity>span,.mini-card-meta span,.mini-card .card-number,.mini-pager,.mini-store small,.mini-basket span,.mini-fields label,.mini-choices small,.mini-pair small,.mini-pair-identity span,.touch-checkout-pair span,.comparison-colour,.comparison-fit,.mini-menu-button,.mini-settings-button,#vto-status,.mini-look-anchors nav,.mini-look-anchors nav span,.mini-fitting-details dt,.style-palette span,.live-comparison-status,#mini-guide small,.mini-recommendation,.muted,.small,.choice-icon,.language-setting h2,.language-setting p,.presence-choice small,.presence-choice svg,.booking-footnote,.draft-notice,.local-camera-note,.fitting-change,.model-loading,.model-loading:after,.celebration-copy>small,.celebration-options,.lens-progress,.settings-version p){color:var(--touch-secondary)}
/* Protect reading zones from every phase of the moving membrane. */
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.mini-card,.mini-detail,.mini-detail>.mini-fitting-details,.try-tile,.comparison>.card,.mini-basket,.mini-store,.mini-stores button,.mini-date-grid button,.mini-time-grid button,.mini-choices label>span,.mini-fitting-details,.mini-look-anchors .anchor-stage,.mini-review,.mini-pair-identity,.touch-checkout-pair,.mini-appointment-prompt,.mini-bottom button,#mini-guide,.tray,dialog,.celebration-copy){background:var(--touch-surface);border-color:var(--line);color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.fitting-controls,#page>.mini-note,#page>.mini-reason-copy,.mini-pager,.mini-fittings-nav,.mini-look-anchors nav){background:var(--touch-surface);padding:14px 18px}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.mini-fitting-identity h2,.mini-look-anchors strong,.mini-look-anchors p,.mini-look-summary li strong,.mini-look-summary li span,.comparison .card-top>span,.settings-version strong){color:var(--ink)}
/* Opaque hit areas, strong edges, and filled selection instead of a faint outline. */
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(button,a.primary,.primary,.secondary){color:var(--ink);background:var(--touch-surface);border-color:var(--line)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app button:where(:hover:not([aria-pressed=true]):not([aria-expanded=true]):not(:disabled)){background:var(--wc-control-hover);color:var(--ink);border-color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(button[aria-pressed=true],button[aria-expanded=true],.capture-check.active,.try-tile.is-current,.mini-choices input:checked+span,.options label:has(input:checked),.lens-options label:has(input:checked),.prescription-options label:has(input:checked)){
 background:var(--wc-selected);color:var(--wc-on-selected);border-color:var(--wc-selected);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(button[aria-pressed=true],button[aria-expanded=true],.capture-check.active,.try-tile.is-current,.mini-choices input:checked+span,.options label:has(input:checked),.lens-options label:has(input:checked),.prescription-options label:has(input:checked)) :where(span,small,strong,svg){color:var(--wc-on-selected)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(button:disabled,button[aria-disabled=true]){opacity:1;color:#767166;background:#E8E3D8;border-color:#B2AC9F;cursor:default}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .swatch.active{border:2px solid var(--ink);outline:2px solid var(--wc-field);outline-offset:-5px}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(button,input,select,textarea,a,summary):focus-visible{outline:3px solid var(--ink);outline-offset:4px}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(input:not([type=radio]):not([type=checkbox]),select,textarea){background:var(--wc-field);color:var(--ink);border:1px solid var(--line);caret-color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app ::placeholder{color:var(--touch-secondary);opacity:1}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app dialog::backdrop{background:#403e3759;backdrop-filter:blur(6px)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.studio>.camera-slot,.live-vto-mount){background:var(--wc-inset);border-color:var(--line)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.saved-look-badge,.live-view-status,.capture-check,.camera-note,.counter){background:var(--wc-field);color:var(--ink);border:1px solid var(--line)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.live-view-status:before,.mini-bottom #thea-status:before,.model-loading:before,.digital-dots i,.mini-thinking>span){background:var(--wc-effect)!important}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-bottom #thea-status:before{opacity:1}
/* Existing mirror img rule is !important: match it only for branding. */
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.mini-brand img,.fallback-logo){filter:brightness(0) saturate(100%) invert(24%) sepia(9%) saturate(530%) hue-rotate(8deg) brightness(92%) contrast(86%)!important}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app #thea-orb>canvas:not(.mini-profile-presence){filter:brightness(0) saturate(100%) invert(24%) sepia(9%) saturate(530%) hue-rotate(8deg) brightness(92%) contrast(86%)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.fitting-loader,#catalogue-research){background:rgba(245,241,232,.98);color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app #mini-celebration{background:rgba(238,233,222,.96);color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.loader-line,.settings-version){background:var(--wc-inset);color:var(--ink)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .loader-line:after{background:var(--wc-effect)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #toast{background:var(--wc-selected);color:var(--wc-on-selected)}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :where(.product-image,.try-tile .product-image){background:transparent}
/* Selection must also win over the generic media badge surface. */
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .capture-check.active{background:var(--wc-selected);color:var(--wc-on-selected);border-color:var(--wc-selected)}

/* White City shares the Mineral component roles, with warm, light finishes. */
html[data-profile=touch32][data-touch-theme=white-city] {
  --mineral-scene: #eee9de;
  --mineral-product: rgb(249 246 238 / .93);
  --mineral-editorial: rgb(234 227 214 / .97);
  --mineral-data: rgb(224 216 200 / .98);
  --mineral-modal: #f8f5ed;
  --mineral-ink: var(--ink);
  --mineral-secondary: var(--touch-secondary);
  --mineral-line: var(--line);
  --mineral-soft-line: #b1a794;
  --touch-surface: var(--mineral-product);
  --touch-editorial: var(--mineral-editorial);
  --touch-editorial-ink: var(--mineral-ink);
  --touch-panel-solid: var(--mineral-data);
  --touch-nav-bg: var(--wc-on-selected);
  --wc-surface-raised: #f3ede1;
  --wc-control: #f8f4e9;
  --wc-control-hover: #e7dfcf;
  --wc-action-hover: #504a3e;
}

html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-look-anchors .anchor-stage {
  background: linear-gradient(110deg, #efe9ddfa, #e2d9c7f0);
  border: 1px solid var(--mineral-soft-line);
  color: var(--ink);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .anchor-stage::after {
  background: linear-gradient(90deg, #62594aa0, #847e7030 65%, transparent);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-anchor-tabs {
  background: transparent;
  padding: 0;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-anchor-tabs button:not(.touch-style-tab) {
  background: var(--wc-surface-raised);
  color: var(--ink);
  border-color: var(--mineral-soft-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-anchor-tabs .touch-style-tab {
  background: var(--mineral-editorial);
  border-color: var(--mineral-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-anchor-tabs button[aria-pressed=true]:not(.touch-style-tab) {
  background: #d8cebb;
  color: var(--ink);
  border-color: #a79c89;
  border-bottom-color: var(--mineral-secondary);
  box-shadow: 0 7px 12px -10px #504a3e85;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :is(.touch-anchor-tabs .touch-style-tab[aria-pressed=true],.touch-product-actions .touch-action-buy,.touch-product-actions .touch-action-details[aria-expanded=true],.touch-comparison-details>button[aria-expanded=true],.touch-order-summary .touch-order-confirm,.customer-lens-routes .rx-source-actions .rx-confirm,.customer-lens-routes .rx-source-choices .rx-source-choice[aria-pressed=true],.visit-dialog-actions button:first-child) {
  background: var(--wc-selected);
  color: var(--wc-on-selected);
  border-color: var(--wc-selected);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :is(.touch-order-confirm,.touch-action-buy,.rx-confirm):is(:hover,:focus-visible) {
  background: var(--wc-action-hover);
  color: var(--wc-on-selected);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-product-action :is(svg,span) { color: inherit; }
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-card[data-owned=exact] {
  box-shadow: inset 0 0 0 3px var(--mineral-product), inset 0 0 0 4px var(--mineral-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-purchase-stamp {
  color: var(--ink);
  background: #ded4c1;
  border-color: var(--mineral-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-card .product-image[data-model-expected=true]:has(.touch-card-model:not([data-ready=true]):not([data-failed=true]))::after {
  background: radial-gradient(circle, var(--mineral-secondary) 0 1px, transparent 1.35px) center / 8px 4px repeat-x;
}

html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :is(.studio>.camera-slot,.live-vto-mount) {
  background: var(--wc-inset);
  border-color: var(--mineral-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .camera-stage .placeholder {
  background: var(--mineral-modal);
  color: var(--ink);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :is(.studio .swatches,.comparison-colours) .swatch,
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-detail .swatch {
  color: var(--ink);
  background: transparent;
  border-color: transparent;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .swatch:is(.active,[aria-pressed=true]) {
  border-color: var(--ink);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .swatch:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :is(.studio .swatches,.studio .touch-live-badge,.live-comparison-status) {
  background: var(--wc-control);
  color: var(--ink);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-live-badge::before {
  background-color: currentColor;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app :is(.mini-detail>.mini-fitting-details,.comparison .touch-comparison-specs) {
  background: var(--mineral-data);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .comparison-tabs button[aria-pressed=true] {
  background: var(--wc-selected);
  color: var(--wc-on-selected);
  border-color: var(--wc-selected);
}

html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .customer-lens-routes :is(button,.rx-source-choice),
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .customer-lens-routes[data-prescription-section] .rx-source-choices .rx-source-choice:not([aria-pressed=true]) {
  background: var(--wc-surface-raised);
  color: var(--ink);
  border-color: var(--mineral-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-choices input:checked+span {
  background: var(--wc-control-hover);
  color: var(--ink);
  border-color: var(--ink);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .mini-choices input:checked+span :is(small,svg,strong) {
  color: inherit;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-lens-progress-track li { background: #b5aa97; }
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-lens-progress-track [data-progress=done] { background: var(--mineral-secondary); }
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-lens-progress-track [data-progress=current] { background: var(--ink); }
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-review-models .touch-order-edit:is(:hover,:focus-visible) {
  background: transparent;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-order-summary[data-count="2"] .touch-order-line {
  background: var(--mineral-product);
}

html[data-profile=touch32][data-touch-theme=white-city] body.minimal :is(.mineral-auto-welcome,.mineral-welcome-controls,.mineral-welcome-controls select) {
  background: var(--mineral-modal);
  color: var(--ink);
  border-color: var(--mineral-line);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal .mineral-welcome-controls :is(label,p) {
  color: var(--mineral-secondary);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal .mineral-visit-dialog[data-kind=hold] {
  --signal-ink: var(--ink);
  --signal-dim: var(--mineral-secondary);
  background: radial-gradient(ellipse at 50% 37%, #f8f3e7, #e9e1d3 80%);
  color: var(--signal-ink);
  border-color: var(--mineral-line);
  box-shadow: 0 16px 60px #403e3733;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal .mineral-visit-dialog[data-kind=hold]::backdrop {
  background: #403e375e;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal .hold-motion i {
  background: var(--ink);
}

html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app #page>.page-heading {
  background: linear-gradient(90deg, var(--mineral-product) 58%, transparent);
  padding-inline: 12px;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app #lenses-form[data-step=review] .touch-order-summary[data-count="2"] {
  padding-block: 17px;
  gap: 12px;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app #lenses-form[data-step=review] .touch-order-summary[data-count="2"] .touch-order-line {
  padding-block: 7px;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal .mineral-visit-dialog[data-kind=warning]::backdrop {
  background: #403e375e;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal .mineral-visit-dialog[data-kind=warning] [data-resume] {
  background: var(--wc-selected);
  color: var(--wc-on-selected);
  border-color: var(--wc-selected);
}

html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-save[aria-pressed=true] {
  background: transparent;
  border-color: transparent;
  color: var(--ink);
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .touch-save[aria-pressed=true] svg {
  color: inherit;
}
html[data-profile=touch32][data-touch-theme=white-city] body.minimal #app .studio>.touch-save[aria-pressed=true] {
  background: var(--wc-control);
  border-color: var(--mineral-line);
}