/* Shared surface experiment: 40% background alpha, never element opacity. */
:root{--loom-card-opacity:40%;--loom-event-lilac:#ead8ed;--loom-event-blue:#d5e7ee}
html[data-theme=night]{--loom-event-lilac:#493449;--loom-event-blue:#293f4d}
html body #app #discovery-tray:is(.open,.loom-card-stack,.loom-scroll-form),
html body #app :is(.loom-card-stack,.loom-scroll-form,#layer-summary,#civic-meetings,.hud-bottom,.hud-search,.service-locations-panel,.block-property-panel,.block-explorer-panel,.water-card,.living-panel,#people-drawer,#government-drawer,#today-drawer,#business-tools,.loom-route-panel,.place-story,.cip-map-detail,.ask-chat,.ground-toolbar,.ground-inventory),
html:root body :is(dialog[open]:not(.ground-world):not(.resident-reader),.loom-card-stack[data-card-theme],.loom-scroll-form[data-card-theme],.loom-card-stack,.loom-scroll-form,.mapboxgl-popup-content,.ground-dock,.ground-picked,.ground-selection){
 background:color-mix(in srgb,var(--card-paper,var(--map-surface,#fbf7ed)) var(--loom-card-opacity),transparent)!important;
 box-shadow:0 9px 28px #20362c24!important;
 -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
}
/* Inner structural wrappers must not put an opaque sheet back over the glass. */
html body #app #discovery-tray:is(.open,.loom-card-stack,.loom-scroll-form)>.map-step,
html body #app #discovery-tray :is(.place-browse-card,.map-step-copy,.event-discovery){background:transparent!important}
/* Alternate by displayed order, including community event rows after sorting. */
html body #app #event-search .event-list>button:nth-of-type(odd),
html body #app .event-venue-list[data-event-tone="0"]>button{
 background:color-mix(in srgb,var(--loom-event-lilac) var(--loom-card-opacity),transparent)!important;
 border-left:3px solid #9b6ca3!important;
}
html body #app #event-search .event-list>button:nth-of-type(even),
html body #app .event-venue-list[data-event-tone="1"]>button{
 background:color-mix(in srgb,var(--loom-event-blue) var(--loom-card-opacity),transparent)!important;
 border-left:3px solid #608e9f!important;
}
html body #app #discovery-tray:has([data-event-reader="events"][data-event-tone="0"]){--card-paper:var(--loom-event-lilac)}
html body #app #discovery-tray:has([data-event-reader="events"][data-event-tone="1"]){--card-paper:var(--loom-event-blue)}