/* Final semantic surfaces: keep component-specific layout, unify theme and contrast. */
html.personal-appearance{
 --ui-surface:color-mix(in srgb,var(--user-accent) 3%,#ffffff);
 --ui-raised:color-mix(in srgb,var(--user-accent) 6%,#ffffff);
 --ui-control:color-mix(in srgb,var(--user-accent) 10%,#ffffff);
 --ui-border:color-mix(in srgb,var(--user-accent) 18%,#d4dae2);
 --ui-text:#172838;--ui-muted:#4c5f70;--ui-link:color-mix(in srgb,var(--user-accent) 65%,#10202f);
}
html.personal-appearance[data-user-theme=dark]{
 --ui-surface:color-mix(in srgb,var(--user-accent) 7%,#18212c);
 --ui-raised:color-mix(in srgb,var(--user-accent) 9%,#222e3d);
 --ui-control:color-mix(in srgb,var(--user-accent) 14%,#2b3849);
 --ui-border:color-mix(in srgb,var(--user-accent) 18%,#475568);
 --ui-text:#edf2f8;--ui-muted:#bac7d6;--ui-link:color-mix(in srgb,var(--user-accent) 24%,#e9f2ff);
}
html.personal-appearance #itemModal,html.personal-appearance dialog{background:var(--ui-surface)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance #itemModal .editor-heading,html.personal-appearance #itemModal #itemForm>.form-actions{background:var(--ui-surface)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance #itemModal #editorTitle,html.personal-appearance #itemModal label,html.personal-appearance dialog legend{color:var(--ui-text)!important}
html.personal-appearance #wizardProgress button{background:var(--ui-control)!important;color:var(--ui-muted)!important;opacity:1}
html.personal-appearance #wizardProgress button>span{background:var(--ui-surface)!important;color:var(--ui-text)!important}
html.personal-appearance #wizardProgress button[aria-current=step]{background:var(--user-accent)!important;color:var(--user-accent-ink)!important}
html.personal-appearance #wizardProgress button:disabled{opacity:.65}
html.personal-appearance #itemModal #closeEditor,html.personal-appearance dialog .quiet,html.personal-appearance dialog button[data-text-action=cancel]{background:var(--ui-control)!important;color:var(--ui-text)!important}
html.personal-appearance #app .trip-days-section,html.personal-appearance #app .trip-strip-empty{background:var(--ui-surface)!important;border-color:var(--ui-border)!important}
html.personal-appearance #app .trip-day-tile{background:var(--ui-control)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance #app .trip-day-tile.weekend{background:color-mix(in srgb,#d98b56 16%,var(--ui-surface))!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance #app .trip-day-tile[aria-pressed=true]{background:var(--user-accent)!important;color:var(--user-accent-ink)!important;border-color:var(--user-accent)!important}
html.personal-appearance #app .trip-day-tile strong,html.personal-appearance #app .trip-day-tile small{color:inherit!important}
html.personal-appearance #app .trip-days-section .object-icon{color:var(--ui-text)!important}
html.personal-appearance #app .object-icon svg{stroke:currentColor}
html.personal-appearance #app .object-group-badge,html.personal-appearance #app .note-category-badge,html.personal-appearance dialog .object-group-badge{color:var(--ui-text)!important}
html.personal-appearance #app .object-icon,html.personal-appearance #app .action-icon{color:var(--ui-text)!important}
html.personal-appearance #app.category-list-view .collection-results .entry,html.personal-appearance #app.category-list-view .notebook .entry,html.personal-appearance #app.category-list-view .quick-composer,html.personal-appearance #app.category-list-view .empty{background:var(--ui-raised)!important;border-color:var(--ui-border)!important;color:var(--ui-text)!important}
html.personal-appearance #app.category-list-view .collection-results .entry:hover{background:var(--ui-control)!important}
html.personal-appearance #app.category-list-view .entry h3,html.personal-appearance #app.category-list-view .entry-text{color:var(--ui-text)!important}
html.personal-appearance #app.category-list-view .entry a{color:var(--ui-link)!important}
html.personal-appearance #app .journey-pool summary,html.personal-appearance #app .journey-visit-switch,html.personal-appearance #app .journey-empty-day>svg,html.personal-appearance #app .empty>svg{color:var(--ui-muted)!important}
html.personal-appearance #app .journey-pool summary small{background:var(--ui-control)!important;color:var(--ui-text)!important}
html.personal-appearance #app .collection-map-filters{border-color:var(--ui-border)!important}
html.personal-appearance #app .collection-map-chips{border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .entry,html.personal-appearance[data-user-theme=dark] #app .empty,html.personal-appearance[data-user-theme=dark] #app .journey-stop-body,html.personal-appearance[data-user-theme=dark] #app .journey-pool,html.personal-appearance[data-user-theme=dark] #app .journey-route-map-panel{background:var(--ui-raised)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .collection-results,html.personal-appearance[data-user-theme=dark] #app .collection-map-filters,html.personal-appearance[data-user-theme=dark] #app .journey-workspace,html.personal-appearance[data-user-theme=dark] #app .journey-dates-bar{background:var(--ui-surface)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-stop-body:hover{background:var(--ui-control)!important}
html.personal-appearance[data-user-theme=dark] .place-suggestions,html.personal-appearance[data-user-theme=dark] #googlePreview,html.personal-appearance[data-user-theme=dark] .place-photo-drop{background:var(--ui-raised)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] .place-suggestions>button{color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] .place-suggestions>button:hover{background:var(--ui-control)!important}
html.personal-appearance[data-user-theme=dark] input::placeholder,html.personal-appearance[data-user-theme=dark] textarea::placeholder{color:#a9b8cb!important;opacity:1}
html.personal-appearance[data-user-theme=dark] #app .place-author{color:#fff!important}
html.personal-appearance[data-user-theme=dark] #app .place-cover-date{color:#173b60!important}
html.personal-appearance[data-user-theme=dark] #app .place-cover-date,html.personal-appearance[data-user-theme=dark] #app .place-drag-handle{background:#f3f6fa!important}
html.personal-appearance[data-user-theme=dark] dialog button,html.personal-appearance[data-user-theme=dark] #app .group-toolbar button{color:var(--ui-text)}
html.personal-appearance[data-user-theme=dark] dialog button.primary,html.personal-appearance[data-user-theme=dark] dialog button[data-text-action=save]{color:var(--user-accent-ink)!important}
/* Neutral glass carries the accent as a tint, not a solid wash. */
html.personal-appearance[data-user-theme=dark] #app .magic-sidebar-surface,html.personal-appearance[data-user-theme=dark] #app .magic-sidebar-inner{background:color-mix(in srgb,var(--ui-surface) 93%,transparent)!important;--lg-bg-color:var(--ui-surface)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app input:not([type=color]):not([type=checkbox]),html.personal-appearance[data-user-theme=dark] #app textarea,html.personal-appearance[data-user-theme=dark] #app select,html.personal-appearance[data-user-theme=dark] dialog input:not([type=color]):not([type=checkbox]),html.personal-appearance[data-user-theme=dark] dialog textarea,html.personal-appearance[data-user-theme=dark] dialog select{background:color-mix(in srgb,var(--user-accent) 4%,#121c28)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance #app .group-row>[data-filter]{background:var(--ui-control)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance #app .group-row>[data-filter][aria-pressed=true],html.personal-appearance #app .collection-map-chips button[aria-pressed=true],html.personal-appearance #app #nav>.active{background:color-mix(in srgb,var(--user-accent) 24%,var(--ui-surface))!important;color:var(--ui-text)!important;border-color:var(--user-accent)!important}
html.personal-appearance[data-user-theme=dark] #app button.secondary,html.personal-appearance[data-user-theme=dark] #app .group-toolbar button,html.personal-appearance[data-user-theme=dark] #app .object-icon,html.personal-appearance[data-user-theme=dark] #app .action-icon,html.personal-appearance[data-user-theme=dark] #app .journey-icon,html.personal-appearance[data-user-theme=dark] #itemModal #cancelEditor,html.personal-appearance[data-user-theme=dark] #itemModal #wizardBack{background:var(--ui-control)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .group-toolbar .group-add-label{background:var(--ui-control)!important;color:var(--ui-text)!important}
html.personal-appearance[data-user-theme=dark] #app .action-icon:before{background-color:var(--ui-text)!important}
html.personal-appearance #itemModal input:focus,html.personal-appearance #itemModal textarea:focus{outline:none!important;box-shadow:none!important}
html.personal-appearance[data-user-theme=dark] #app .journey-route{color:var(--ui-text)!important;background:var(--ui-control)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-day-view{background:transparent!important}
html.personal-appearance[data-user-theme=dark] #app.category-list-view .collection-groups{background:var(--ui-surface)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-empty-day{background:var(--ui-raised)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-date{background:var(--ui-control)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-date[aria-pressed=true]{background:color-mix(in srgb,var(--user-accent) 30%,var(--ui-surface))!important;border-color:var(--user-accent)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-date.weekend>small{color:#ffa4ac!important}
html.personal-appearance[data-user-theme=dark] #app .journey-date>span{background:#e73d54!important;color:#fff!important}
html.personal-appearance[data-user-theme=dark] #app .journey-switch-track{background:#627184!important}
html.personal-appearance[data-user-theme=dark] #app .journey-visit-switch input:checked+.journey-switch-track{background:var(--user-accent)!important}
html.personal-appearance[data-user-theme=dark] #app .journey-dates-bar>.journey-icon{background:var(--ui-control)!important;color:var(--ui-text)!important}
html.personal-appearance[data-user-theme=dark] #app .collection-map-filters .collection-map-chips{border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .collection-map-chips button{background:var(--ui-control)!important;color:var(--ui-text)!important;border-color:var(--ui-border)!important}
html.personal-appearance[data-user-theme=dark] #app .collection-map-chips button[aria-pressed=true]{background:color-mix(in srgb,var(--user-accent) 30%,var(--ui-surface))!important;border-color:var(--user-accent)!important}
html.personal-appearance[data-user-theme=dark] #app #collectionMapMount{background:var(--ui-surface)!important;border-color:var(--ui-border)!important}
