/* Final color layer. Keep legacy geometry, file-type colors and media pixels. */
html[data-theme-switching] body * { transition:none !important; }
html[data-theme] body {
  --bg:var(--theme-bg); --bg-2:var(--theme-surface-alt); --surface:var(--theme-surface);
  --surface-2:var(--theme-control); --surface-3:var(--theme-hover);
  --sidebar:var(--theme-sidebar); --sidebar-2:var(--theme-control);
  --text:var(--theme-text); --text-2:var(--theme-text); --muted:var(--theme-muted);
  --line:var(--theme-border); --line-2:var(--theme-border);
  --accent:var(--theme-accent); --accent-2:var(--theme-link); --blue:var(--theme-link);
  --danger:var(--theme-danger); --danger-bg:var(--theme-danger-bg);
  --success:var(--theme-success); --warning:var(--theme-warning);
  color:var(--theme-text); color-scheme:inherit !important; background:var(--theme-bg) !important;
}
html[data-theme] body.app-screen :is(.app-shell,.content,.content-inner,.topbar),
html[data-theme] body.guest-screen :is(.landing-topbar,.landing-page),
html[data-theme] .workspace-failure { background:var(--theme-bg) !important; color:var(--theme-text); }
html[data-theme] body.app-screen .sidebar { background:var(--theme-sidebar) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen :is(.sidebar-head,.sidebar-account,.topbar) { border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen :is(.sidebar-brand,.nav-item,.nav-icon,.nav-current,.account-trigger) { color:var(--theme-text) !important; }
html[data-theme] body.app-screen :is(.nav-title,.storage-card-head,.account-menu-identity small) { color:var(--theme-muted) !important; }
html[data-theme] body.app-screen .storage-card-head span { color:var(--theme-muted) !important; }
html[data-theme] body.app-screen .nav-item.active { background:var(--theme-selected) !important; box-shadow:inset 3px 0 0 var(--theme-accent) !important; }
html[data-theme] body.app-screen :is(.nav-item:hover,.account-trigger:hover,.account-trigger[aria-expanded=true]) { background:var(--theme-hover) !important; }
html[data-theme] body.app-screen .sidebar-toggle { color:var(--theme-text) !important; background:transparent !important; border:0 !important; }
html[data-theme] body.app-screen .sidebar-toggle:hover { background:var(--theme-hover) !important; }
html[data-theme] body.app-screen .sidebar-toggle::before { background-color:var(--theme-text) !important; }
html[data-theme] body.app-screen .sidebar-resizer span { border-color:var(--theme-muted) !important; background:var(--theme-muted) !important; }
html[data-theme] body.app-screen .storage-card { background:var(--theme-surface) !important; border-color:var(--theme-border) !important; color:var(--theme-text) !important; }
html[data-theme] body.app-screen .storage-meter { background:var(--theme-border) !important; }
html[data-theme] body.app-screen .storage-meter span { background:var(--theme-accent) !important; }
html[data-theme] :is(.storage-manage,.library-location-link,.workspace-failure a) { color:var(--theme-link) !important; }
html[data-theme] :is(.account-popover,.upload-options-menu,.option-menu,.trash-menu,.create-rail-menu) { background:var(--theme-surface) !important; color:var(--theme-text); border-color:var(--theme-border) !important; box-shadow:0 12px 36px var(--theme-shadow); }
html[data-theme] :is(.account-menu-identity,.account-logout,.menu-divider) { border-color:var(--theme-border); }
html[data-theme] :is(.account-popover a,.account-popover button,.option-menu-item,.upload-option-item,.upload-option-icon,.trash-menu button) { color:var(--theme-text) !important; background:transparent; }
html[data-theme] :is(.account-popover a,.account-popover button,.option-menu-item,.upload-option-item,.trash-menu button):hover { background:var(--theme-hover) !important; }

/* Search remains its own form; theme buttons never submit it. */
html[data-theme] body.app-screen .topbar { gap:clamp(8px,1.5vw,22px) !important; justify-content:center !important; }
html[data-theme] body.app-screen .top-search { flex:1 1 680px; max-width:680px; margin-left:auto; }
html[data-theme] body.app-screen :is(.search-query,.search-scope) { background:var(--theme-control) !important; color:var(--theme-text) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen .top-search input { color:var(--theme-text) !important; background:transparent !important; }
html[data-theme] body.app-screen .search-icon { border-color:var(--theme-muted) !important; }
html[data-theme] body.app-screen .search-icon::after { background:var(--theme-muted) !important; }
html[data-theme] body.app-screen .top-search button { background:var(--theme-accent) !important; color:var(--theme-on-accent) !important; }
html[data-theme="navy"] body.app-screen .top-search button { background:#f8fafc !important; color:#0f172a !important; }
html[data-theme] body.app-screen :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea):not(.top-search input):not(.trash-search input) { color:var(--theme-text) !important; background-color:var(--theme-control) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen :is(.top-search input,.trash-search input) { background:transparent !important; }
html[data-theme] :is(input,textarea)::placeholder { color:var(--theme-muted) !important; opacity:1; }
html[data-theme] :is(input[type=checkbox],input[type=radio],input[type=range]) { accent-color:var(--theme-accent); }
html[data-theme] :is(.btn:not(.btn-secondary):not(.btn-ghost):not(.btn-danger),.btn-primary,.item-actions a.btn-primary,.empty-icon) { color:var(--theme-on-accent); }
html[data-theme] :is(.btn-secondary,.btn-ghost,button.secondary) { color:var(--theme-text) !important; background:var(--theme-control) !important; border-color:var(--theme-border) !important; }
html[data-theme] :is(.form-error,.danger-text,.drive-action-status.is-error,.hosting-dialog-status) { color:var(--theme-danger) !important; }

/* Explorer: surfaces/text change; thumbnail pixels and extension badges do not. */
html[data-theme] body.app-screen .legacy-drive-shell { color:var(--theme-text) !important; }
html[data-theme] body.app-screen .legacy-drive-shell :is(.explorer-item,.file-item,.folder-item) { background:var(--theme-surface) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen .legacy-drive-shell :is(.explorer-item:hover,.file-item:hover,.folder-item:hover) { background:var(--theme-hover) !important; }
html[data-theme] body.app-screen .legacy-drive-shell :is(.explorer-item.selected,.explorer-item.is-selected,.location-highlight,.drive-drop-active) { background:var(--theme-selected) !important; border-color:var(--theme-focus) !important; }
html[data-theme] body.app-screen .legacy-drive-shell .explorer-item.is-selected .item-main-area { background:transparent !important; }
html[data-theme] body.app-screen .legacy-drive-shell .explorer-item.is-selected .item-checkmark { background:var(--theme-accent); color:var(--theme-on-accent); border-color:var(--theme-muted); }
html[data-theme] body.app-screen .legacy-drive-shell :is(.explorer-item.is-drop-target,.compact-breadcrumb .is-drop-target) { background:var(--theme-selected) !important; outline-color:var(--theme-focus); }
html[data-theme] .drive-drag-preview { background:var(--theme-selected); color:var(--theme-text); border-color:var(--theme-focus); }
html[data-theme] body.app-screen .legacy-drive-shell :is(.item-name-link,.file-name,.folder-name,.section-title,.file-section h2,.folder-section h2) { color:var(--theme-text) !important; }
html[data-theme] body.app-screen .legacy-drive-shell :is(.item-meta,.item-meta-row,.item-date,.file-meta,.file-date,.folder-date,.item-size,.item-type,.section-count,.search-result-path,.upload-limit-hint) { color:var(--theme-muted) !important; }
html[data-theme] body.app-screen .legacy-drive-shell :is(.folder-meta,.file-meta span,.compact-date,.compact-type,.compact-size,.file-count,.folder-count) { color:var(--theme-muted) !important; }
html[data-theme] body.app-screen :is(.breadcrumb-current,.breadcrumb-separator) { color:var(--theme-text) !important; }
html[data-theme] body.app-screen .breadcrumb-current { background:var(--theme-selected) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen .item-option-btn { color:var(--theme-muted) !important; background:transparent !important; border-color:var(--theme-border) !important; }
html[data-theme] .option-menu :is(button,a) { color:var(--theme-text) !important; background:transparent !important; }
html[data-theme] .option-menu :is(button,a):hover { background:var(--theme-hover) !important; }
html[data-theme] body.app-screen :is(.legacy-breadcrumbs a,.breadcrumb-link,.location-section a,.drive-action-status) { color:var(--theme-link) !important; }
html[data-theme] body.app-screen :is(.legacy-breadcrumbs a,.breadcrumb-link) { background:var(--theme-control) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen :is(.option-button,.drive-view-buttons,.drive-view-button,.drive-action-btn.secondary,.create-rail-toggle,.quick-create-btn,.drive-action-status button) { color:var(--theme-text) !important; background:var(--theme-control) !important; border-color:var(--theme-border) !important; }
html[data-theme] body.app-screen .drive-action-btn:not(.secondary) { color:var(--theme-on-accent) !important; background:var(--theme-accent) !important; }
html[data-theme="navy"] body.app-screen .drive-action-btn:not(.secondary) { color:#0f172a !important; background:#f8fafc !important; }
html[data-theme] body.app-screen .drive-view-button[aria-pressed=true] { color:var(--theme-on-accent) !important; background:var(--theme-accent) !important; }
/* Dark uses white filled actions, not gray fills with inherited white labels.
   Quiet/outlined controls, swatches and destructive actions keep their roles. */
html[data-theme="dark"] .library-commands button { background:var(--theme-accent) !important; color:var(--theme-on-accent) !important; }
html[data-theme="dark"] body.app-screen .view-options button[aria-pressed=true] { background:var(--theme-accent) !important; color:var(--theme-on-accent) !important; }
html[data-theme="dark"] :is(.btn:not(.btn-secondary):not(.btn-ghost):not(.btn-danger),.library-commands button,.drive-action-btn:not(.secondary),.top-search button,.drive-view-button[aria-pressed=true],.view-options button[aria-pressed=true]):not(:disabled):is(:hover,:focus-visible) { border-color:#64748b !important; box-shadow:0 0 0 1px #64748b; }
html[data-theme="dark"] :is(.btn:not(.btn-secondary):not(.btn-ghost):not(.btn-danger),.library-commands button,.drive-action-btn:not(.secondary),.top-search button,.drive-view-button[aria-pressed=true],.view-options button[aria-pressed=true]):focus-visible { outline:2px solid var(--theme-focus); outline-offset:3px; }
html[data-theme] :is(.library-row.selected,.preferences-nav button[aria-selected=true],.policy-item:has(input:checked),.folder-entry.selected) { background:var(--theme-selected) !important; color:var(--theme-text) !important; border-color:var(--theme-focus) !important; }

/* Settings, account, sharing, administrator, upload and operation dialogs. */
html[data-theme] :is(.settings-card,.page-hero,.table-card,.account-session,.command-card,.list-panel,.preview-card,.app-dialog,.hosting-dialog,.create-folder-box,.upload-target-box,.upload-conflict-box,.trash-modal-card,.upload-transfer-window,.global-drop-card) { color:var(--theme-text) !important; background:var(--theme-surface) !important; border-color:var(--theme-border) !important; }
html[data-theme] :is(.stat-card,#zipDownloadBox,#deleteConfirmBox,#shareCreateBox,.rename-box,.search-console) { color:var(--theme-text) !important; background:var(--theme-surface) !important; border-color:var(--theme-border) !important; }
html[data-theme] :is(.zip-label,.zip-hint,.delete-confirm-warning,.conflict-file-row small,.conflict-option>span,.transfer-size,.upload-transfer-item small,.compact-head,.hosting-note) { color:var(--theme-muted) !important; }
html[data-theme] :is(.conflict-file-row b,.upload-conflict-message,.conflict-apply-all,.zip-modal-header,.delete-modal-header,.transfer-name) { color:var(--theme-text) !important; border-color:var(--theme-border); }
html[data-theme] :is(.conflict-apply-all,.upload-transfer-window header,.upload-transfer-window footer) { background:var(--theme-surface-alt) !important; border-color:var(--theme-border) !important; }
html[data-theme] .conflict-option>strong { color:var(--theme-link) !important; }
html[data-theme] .upload-transfer-window :is(header button,footer button) { color:var(--theme-text) !important; background:transparent !important; }
html[data-theme] .transfer-kind { color:var(--theme-link) !important; }
html[data-theme] .upload-transfer-item[data-state=complete] .transfer-kind { color:var(--theme-success) !important; }
html[data-theme] .upload-transfer-item[data-state=error] small { color:var(--theme-danger) !important; }
html[data-theme] body.app-screen .content button[type=submit]:not(:is(.secondary,.danger,.btn-secondary,.btn-ghost,.btn-danger)) { color:var(--theme-on-accent); }
html[data-theme] :is(.page-hero p,.settings-card p,.settings-card label,.settings-help,.upload-target-label,.upload-target-hint,.global-drop-card p,.upload-option-item small,.upload-transfer-meta,.upload-transfer-state,.account-menu-identity small,.trash-modal-card p,.trash-modal-card label) { color:var(--theme-muted) !important; }
html[data-theme] :is(.settings-card h2,.page-hero h1,.upload-transfer-head,.create-folder-head,.upload-target-head,.upload-conflict-head,.upload-target-path,.trash-modal-card h2) { color:var(--theme-text) !important; border-color:var(--theme-border) !important; }
html[data-theme] .upload-conflict-head { background:var(--theme-surface-alt) !important; }
html[data-theme] .upload-conflict-head button { color:var(--theme-muted) !important; background:transparent !important; }
html[data-theme] .upload-conflict-head button:is(:hover,:focus-visible) { color:var(--theme-text) !important; background:var(--theme-hover) !important; }
html[data-theme] :is(.upload-target-path,.conflict-file-row,.conflict-option,.upload-transfer-item,.trash-confirm-summary,.folder-browser,.folder-tree,.folder-entry,.data-table th,.hosting-link-card) { background:var(--theme-control) !important; color:var(--theme-text) !important; border-color:var(--theme-border) !important; }
html[data-theme] :is(.target-cancel,.create-folder-head button,.upload-target-head button,.upload-transfer-head button,.app-dialog header button,.trash-modal-card header button) { color:var(--theme-text) !important; background:var(--theme-control) !important; border-color:var(--theme-border) !important; }
html[data-theme] :is(.target-submit,.target-confirm,.trash-action.restore,.trash-modal-card .primary,.folder-picker footer button:not(.secondary),#themeCustomApply) { background:var(--theme-accent) !important; color:var(--theme-on-accent) !important; }
html[data-theme] :is(.confirmation-switch,.confirmation-switch-label,.toggle-state,.policy-label) { color:var(--theme-text) !important; }
html[data-theme] .viewer-confirmation-toggle { border-color:var(--theme-border) !important; }
html[data-theme] .viewer-toggle-state { color:var(--theme-muted) !important; }
html[data-theme] .viewer-toggle-track { background:var(--theme-border); }
html[data-theme] .viewer-confirmation-toggle input:checked ~ .viewer-toggle-track { background:var(--theme-accent); }
html[data-theme="dark"] .viewer-confirmation-toggle input:checked ~ .viewer-toggle-track::after { background:var(--theme-on-accent); }
html[data-theme] :is(.confirmation-toggle,.preference-switch) { background:var(--theme-border); }
html[data-theme] :is(.confirmation-toggle,.preference-switch)[aria-checked=true] { background:var(--theme-accent); }
html[data-theme] :is(.share-tab,.admin-tabs a,.record-tabs a) { color:var(--theme-muted) !important; background:var(--theme-control); border-color:var(--theme-border); }
html[data-theme] :is(.share-tab,.admin-tabs a,.record-tabs a)[aria-selected=true] { color:var(--theme-text) !important; background:var(--theme-selected) !important; }
html[data-theme] .share-tabs a { color:var(--theme-muted) !important; background:transparent !important; border-color:var(--theme-border); }
html[data-theme] .share-tabs a[aria-current=page] { color:var(--theme-text) !important; border-color:var(--theme-accent); }
html[data-theme] .share-error { color:var(--theme-danger); border-color:var(--theme-danger); }
html[data-theme] .share-preview-dialog { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] #sharePreviewStatus { color:var(--theme-muted); }
html[data-theme] .share-preview-dialog button { color:var(--theme-on-accent); }
html[data-theme] :is(dialog)::backdrop { background:var(--theme-scrim); }
html[data-theme] :is(.create-folder-modal,.upload-target-modal,.upload-conflict-modal,.trash-modal,.global-drop-overlay,.modal-overlay) { background:var(--theme-scrim) !important; }
html[data-theme] :is(.trash-page,.trash-row,.trash-name-cell strong,.trash-empty-state h2) { color:var(--theme-text) !important; }
html[data-theme] :is(.trash-header,.trash-row,.trash-list-shell) { border-color:var(--theme-border) !important; }
html[data-theme] :is(.trash-list-shell,.trash-list-head,.trash-search) { background:var(--theme-control) !important; }
html[data-theme] :is(.trash-header p,.trash-summary,.trash-path,.trash-row time,.trash-expiry,.trash-name-cell small,.trash-no-results,.trash-empty-state,.trash-list-head,.trash-row>div:nth-last-child(2)) { color:var(--theme-muted) !important; }
html[data-theme] :is(.trash-selection-bar,.trash-row.selected) { background:var(--theme-selected) !important; }
html[data-theme] .trash-row:hover { background:var(--theme-hover) !important; }
html[data-theme] .trash-row.selected:hover { background:var(--theme-selected) !important; }
html[data-theme] :is(.trash-action,.trash-more) { background:var(--theme-control); color:var(--theme-text) !important; border-color:var(--theme-border); }
/* Filled destructive actions and quiet menu actions have different contracts.
   Do not put both in one :is(): its strongest argument can hide filled text. */
html[data-theme] :is(.trash-empty-button,.trash-expiry.urgent) { color:var(--theme-danger) !important; }
html[data-theme] .trash-empty-button { border-color:var(--theme-danger) !important; background:transparent !important; }
html[data-theme] :is(.delete-submit-btn,.trash-action.danger,.app-dialog button.danger,.trash-modal-card footer .danger,.btn-danger) { background:#b91c1c !important; color:#fff !important; border-color:#b91c1c !important; }
html[data-theme] :is(.delete-submit-btn,.trash-action.danger,.app-dialog button.danger,.trash-modal-card footer .danger,.btn-danger):hover { background:#991b1b !important; color:#fff !important; border-color:#991b1b !important; }
html[data-theme] :is(.trash-menu button.danger,.option-menu .option-menu-item.danger,.admin-account-menu button.danger) { background:transparent !important; color:var(--theme-danger) !important; }
html[data-theme] :is(.trash-menu button.danger,.option-menu .option-menu-item.danger,.admin-account-menu button.danger):is(:hover,:focus-visible) { background:var(--theme-hover) !important; color:var(--theme-danger) !important; }
html[data-theme] :is(.trash-menu button,.option-menu-item,.admin-account-menu button):focus-visible { outline:2px solid var(--theme-focus) !important; outline-offset:-2px; }
html[data-theme] .drive-drag-ghost { color:var(--theme-text); background:var(--theme-selected); border-color:var(--theme-focus); }
html[data-theme] .admin-accounts { --account-border:var(--theme-border); }
html[data-theme] :is(.admin-account-row,.admin-account-menu,.admin-account-dialog,.record-delete-option) { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] .admin-account-row:is(:hover,:focus-within) { background:var(--theme-hover); border-color:var(--theme-focus); }
html[data-theme] :is(.account-group h2 small,.admin-account-identity small,.admin-account-usage,.admin-account-details dt,.admin-system summary) { color:var(--theme-muted); }
html[data-theme] .admin-account-status { color:var(--theme-success); }
html[data-theme] .admin-account-status.inactive { color:var(--theme-warning); }
/* The same transparent profile PNG must not pick up role-specific backplates. */
html[data-theme] :is(.account-avatar,.admin-account-avatar,.profile-image) { background:var(--theme-control) !important; }
html[data-theme] :is(.admin-account-options,.admin-account-menu button) { background:transparent; color:var(--theme-text); }
html[data-theme] .admin-account-menu button:is(:hover,:focus-visible) { background:var(--theme-hover); }
html[data-theme] .admin-account-menu button.danger { background:transparent !important; color:var(--theme-danger) !important; }
html[data-theme] :is(.admin-account-dialog button:not(.context-help-trigger),.admin-page-actions .btn,.admin-record-actions .btn) { color:var(--theme-on-accent); }
html[data-theme] :is(.record-prune,.record-check) { border-color:var(--theme-border); }
html[data-theme] .record-tabs [aria-current] { color:var(--theme-text) !important; background:var(--theme-selected); border-color:var(--theme-focus); }

/* Authentication also uses the account's palette on a remembered-session visit. */
html[data-theme] body.auth-screen { background:#0b0b0b !important; }
html[data-theme] .auth-screen .auth-panel { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] .auth-screen :is(.auth-subtitle,.auth-remember-hint,.auth-form label,.auth-form label>span) { color:var(--theme-muted) !important; }
html[data-theme] .auth-screen .auth-form input { background:var(--theme-control); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] .auth-screen .auth-submit { background:var(--theme-accent); color:var(--theme-on-accent); }
html[data-theme] .auth-screen .auth-form .auth-remember input:checked { background:var(--theme-accent); border-color:var(--theme-accent); }
html[data-theme] .auth-screen .auth-remember input:checked::after { border-color:var(--theme-on-accent); }
html[data-theme] .auth-message-error { background:var(--theme-danger-bg); color:var(--theme-danger); border-color:var(--theme-danger); }
html[data-theme] .auth-message-success { background:var(--theme-success-bg); color:var(--theme-success); border-color:var(--theme-success); }

/* Viewer chrome only. Image/video/canvas/PDF and video-overlay controls keep pixels. */
html[data-theme] .media-viewer :is(.mv-header,.mv-info,.mv-more-panel,.mv-settings-panel,.mv-draft-fields,.ie-toolbar,.ie-adjust,.ie-draw-popup,.ie-cropbar,.ie-footer) { background:var(--theme-surface) !important; color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] .media-viewer #mvTitle,
html[data-theme] .media-viewer :is(.mv-header button,.mv-info dd,.mv-settings-panel label) { color:var(--theme-text) !important; }
html[data-theme] .media-viewer :is(.mv-position,.mv-info dt,.mv-more-panel p,.mv-draft-fields label,.mv-save-status,.ie-badge,.ie-cropbar label,.ie-draw-popup output,.ie-footer) { color:var(--theme-muted) !important; }
html[data-theme] .media-viewer .mv-header button { background:transparent; }
html[data-theme] .media-viewer :is(.mv-header,.ie-toolbar,.ie-adjust,.ie-draw-popup,.ie-cropbar,.ie-footer) :is(button,a,summary) { color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] .media-viewer :is(.mv-header,.ie-toolbar,.ie-adjust,.ie-draw-popup,.ie-cropbar,.ie-footer) :is(button,a,summary):not(.ie-swatch):hover { background:var(--theme-hover); }
html[data-theme] .media-viewer .ie-toolbar button[aria-pressed=true] { background:var(--theme-selected); color:var(--theme-text); border-color:var(--theme-focus); }
html[data-theme] .media-viewer button.ie-primary { background:var(--theme-accent) !important; color:var(--theme-on-accent) !important; border-color:var(--theme-accent); }
html[data-theme] .media-viewer .ie-divider { background:var(--theme-border); }
html[data-theme] .media-viewer .ie-adjust-group { border-color:var(--theme-border); }
html[data-theme] .media-viewer .ie-swatch[aria-pressed=true] { outline-color:var(--theme-focus); }
html[data-theme] .media-viewer :is(#mvText,#mvDraftName) { background:var(--theme-control) !important; color:var(--theme-text) !important; border-color:var(--theme-border); }
html[data-theme] .media-viewer:not([data-type=video]) .mv-footer { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] .media-viewer:not([data-type=video]) .mv-footer :is(button,summary) { color:var(--theme-text); background:transparent; }
html[data-theme] .media-viewer:not([data-type=video]) .mv-footer #mvSave { background:var(--theme-accent); color:var(--theme-on-accent); }
html[data-theme] .media-viewer[data-type=video] .mv-footer { color:#f8fafc; }
html[data-theme] :is(.mv-confirm,.ie-dialog) { background:var(--theme-surface); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] :is(.mv-confirm,.ie-dialog) button { background:var(--theme-control); color:var(--theme-text); border-color:var(--theme-border); }
html[data-theme] :is(.mv-confirm #mvActionConfirm,.ie-dialog .ie-primary) { background:var(--theme-accent); color:var(--theme-on-accent); border-color:var(--theme-accent); }
html[data-theme] .mv-confirm #mvActionConfirm.is-danger { background:#b91c1c; color:#fff; border-color:#b91c1c; }
html[data-theme] :is(.ie-dialog p,.ie-extension) { color:var(--theme-muted); }
html[data-theme] :is(#mvActionError,.ie-save-error,.ie-folder-error) { color:var(--theme-danger); }

/* Google-like split circular swatches: 20px visual, 30px hit area. */
.theme-toolbar { display:flex; align-items:center; gap:4px; flex:none; margin-left:auto; }
html[data-theme] .theme-chip,html[data-theme] .theme-more { position:relative; flex:none; min-height:30px; width:30px; height:30px; padding:3px; gap:0; border:1px solid transparent; border-radius:8px; background:transparent; color:var(--theme-text); box-shadow:none; transform:none; cursor:pointer; }
.theme-swatch { display:block; flex:none; width:20px; height:20px; border-radius:50%; background:conic-gradient(from 90deg,var(--swatch-right) 0 25%,var(--swatch-left) 25% 50%,var(--swatch-top) 50% 100%); box-shadow:0 0 0 1px var(--theme-border); }
html[data-theme] .theme-chip:hover,html[data-theme] .theme-more:hover { background:var(--theme-hover); }
html[data-theme] .theme-chip[aria-pressed=true] { border-color:var(--theme-focus); }
.theme-chip[aria-pressed=true]::after { content:'✓'; position:absolute; right:-2px; bottom:-2px; display:grid; place-items:center; width:12px; height:12px; border-radius:50%; background:var(--theme-accent); color:var(--theme-on-accent); font-size:9px; line-height:1; }
html[data-theme] .theme-picker { position:fixed; inset:auto 16px auto auto; top:calc(var(--topbar-height,56px) + 8px); margin:0; width:min(320px,calc(100vw - 24px)); max-height:calc(100dvh - var(--topbar-height,56px) - 24px); overflow:auto; padding:18px; border:1px solid var(--theme-border); border-radius:16px; background:var(--theme-surface); color:var(--theme-text); box-shadow:0 16px 48px var(--theme-shadow); }
.theme-picker:not(:popover-open) { display:none; }
.theme-picker:popover-open { display:block; }
.theme-picker h2 { margin:0 0 14px; font-size:14px; }
.theme-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
html[data-theme] .theme-option { width:100%; height:auto; min-height:62px; display:flex; flex-direction:column; gap:6px; padding:8px 2px; }
.theme-option .theme-swatch { width:30px; height:30px; }
.theme-label { font-size:11px; font-weight:500; }
.theme-custom { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; padding-top:14px; border-top:1px solid var(--theme-border); }
.theme-custom h3 { grid-column:1/-1; margin:0; font-size:12px; }
.theme-custom label { display:flex; align-items:center; justify-content:space-between; gap:6px; color:var(--theme-text); font-size:11px; }
html[data-theme] body.app-screen .theme-custom input[type=color] { width:34px; min-height:28px; height:28px; padding:2px; border-radius:6px; }
.theme-custom button { grid-column:1/-1; min-height:32px; padding:4px 10px; font-size:12px; }
.theme-storage-hint { margin:12px 0 0; color:var(--theme-muted); font-size:11px; }
.theme-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
html[data-theme] :is(.theme-chip,.theme-more,.theme-custom button,.account-trigger,.drive-view-button):focus-visible { outline:2px solid var(--theme-focus); outline-offset:2px; }

/* Two rows on phones keep a useful search field and all four theme controls. */
@media(max-width:600px) {
  html[data-theme] body.app-screen { --topbar-height:92px; }
  html[data-theme] body.app-screen .topbar { display:grid !important; grid-template-columns:minmax(0,1fr) auto !important; grid-template-rows:34px 30px; gap:6px 8px !important; padding:10px 12px !important; justify-content:stretch !important; }
  html[data-theme] body.app-screen .top-search { display:contents !important; }
  html[data-theme] body.app-screen .search-query { grid-column:1; grid-row:1; min-width:0; }
  html[data-theme] body.app-screen .top-search button { grid-column:2; grid-row:1; justify-self:end; width:52px; min-height:34px; padding:0 8px !important; }
  html[data-theme] body.app-screen .search-scope { grid-column:1; grid-row:2; width:min(112px,100%); max-width:112px; height:30px; }
  html[data-theme] .theme-toolbar { grid-column:2; grid-row:2; justify-self:end; gap:2px; }
  html[data-theme] .theme-quick,html[data-theme] .theme-more { width:26px; height:28px; min-height:28px; padding:2px; }
  html[data-theme] .theme-picker { right:12px; }
}
