/* The wallpaper is a viewport layer; all interactive content stays above it. */
body.has-wallpaper{isolation:isolate;background:var(--page)}
#siteBackdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
#siteBackdropImage,#siteBackdropVeil{position:absolute;inset:0}
#siteBackdropImage{background-size:cover;background-repeat:no-repeat;transform-origin:center}
#siteBackdropVeil{background:rgb(var(--wallpaper-veil));pointer-events:none}
.has-wallpaper>header.app-header{background:transparent;isolation:isolate;backdrop-filter:none;-webkit-backdrop-filter:none}
/* Clip a viewport-sized copy to the header, without clipping its user dropdown. */
#headerWallpaper{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--page)}
#headerWallpaperImage,#headerWallpaperVeil{position:absolute;top:0;left:0;width:100%;height:100vh;height:100dvh}
#headerWallpaperImage{background-size:cover;background-repeat:no-repeat;transform-origin:center}
#headerWallpaperVeil{background:rgb(var(--wallpaper-veil))}
/* Match both viewport layers so the sticky header still conceals scrolling cards. */
#siteBackdrop::after,#headerWallpaper::after{content:"";position:absolute;top:0;left:0;width:100%;height:100vh;height:100dvh;background:linear-gradient(to bottom,rgba(var(--wallpaper-veil),.32),rgba(var(--wallpaper-veil),.18) 32%,rgba(var(--wallpaper-veil),.06) 55%,rgba(var(--wallpaper-veil),0) 75%);pointer-events:none}
.has-wallpaper .app-header .rainbow-divider{background:transparent}
.has-wallpaper .app-brand{gap:9px;width:fit-content;max-width:100%;box-sizing:border-box;padding:8px 9px;background:var(--wallpaper-toolbar);border:1px solid var(--line);border-radius:15px;box-shadow:0 3px 16px rgba(22,28,53,.04)}
.has-wallpaper .app-brand>div:last-child{min-width:0}
.has-wallpaper .app-brand h1{font-size:21px}
.has-wallpaper .app-brand p{font-size:11px;white-space:nowrap;line-height:1.4}
.has-wallpaper .app-brand-mark{width:38px;height:38px;border-radius:12px;font-size:17px}
.has-wallpaper .app-header>.site-container{padding-bottom:10px}
body.has-wallpaper>main.site-container{padding-top:18px}
.has-wallpaper .app-header #searchPlatformTabs>button{background:var(--wallpaper-toolbar)}
.has-wallpaper .app-header #searchPlatformTabs>button[aria-pressed=true]{background:var(--soft)}
body.has-wallpaper.wallpaper-light{--page:#f9faff;--surface:rgba(255,255,255,.95);--soft:#f0edff;--hover:#f5f3ff;--ink:#182034;--muted:#566178;--line:rgba(214,219,233,.85);--accent:#654ce4;--accent-hover:#5944d6;--on-accent:#fff;--header:rgba(255,255,255,.92);--wallpaper-veil:255,255,255;--wallpaper-toolbar:rgba(255,255,255,.92);--wallpaper-solid:#fff;--danger:#c34e66;--shadow:0 5px 24px rgba(22,28,53,.075)}
body.has-wallpaper.wallpaper-dark{--page:#171820;--surface:rgba(27,29,42,.96);--soft:#322c49;--hover:#343044;--ink:#f3f2fa;--muted:#c3c4d5;--line:rgba(117,121,148,.42);--accent:#c2b0ff;--accent-hover:#d4c7ff;--on-accent:#241737;--header:rgba(25,27,39,.94);--wallpaper-veil:15,17,27;--wallpaper-toolbar:rgba(27,29,42,.94);--wallpaper-solid:#1b1d2a;--danger:#f69aa9;--shadow:0 5px 24px rgba(0,0,0,.16)}
.has-wallpaper .bookmark-workspace-nav{background:var(--wallpaper-toolbar);border:1px solid var(--line);border-radius:15px;padding:8px 15px;box-shadow:var(--shadow);backdrop-filter:blur(12px);margin-bottom:24px}
.has-wallpaper .bookmark-workspace-nav .bookmark-add{padding:9px 15px}
.has-wallpaper.wallpaper-light .bookmark-domain{color:#606b80}
.has-wallpaper .personal-bookmark,.has-wallpaper .bookmark-discovery-card,.has-wallpaper #siteSearchGrid>article{background:rgba(255,255,255,.92);border-color:rgba(255,255,255,.56);box-shadow:0 3px 14px rgba(22,28,53,.045);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.has-wallpaper.wallpaper-dark .personal-bookmark,.has-wallpaper.wallpaper-dark .bookmark-discovery-card,.has-wallpaper.wallpaper-dark #siteSearchGrid>article{background:rgba(27,29,42,.94);border-color:rgba(160,166,194,.24)}
.has-wallpaper .personal-bookmark:hover,.has-wallpaper .bookmark-discovery-card:hover,.has-wallpaper #siteSearchGrid>article:hover{border-color:var(--accent);box-shadow:0 6px 20px rgba(22,28,53,.08)}
/* Keep recent links readable on any photo, without a full-width panel. */
.has-wallpaper .bookmark-recent-row{width:fit-content;max-width:100%;box-sizing:border-box;gap:10px;margin-top:24px;background:var(--wallpaper-toolbar);border:0;border-radius:10px;padding:6px 10px;backdrop-filter:blur(12px)}
.has-wallpaper #personalRecent{gap:6px 14px}
.has-wallpaper #personalRecent a{padding:3px 5px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.has-wallpaper .bookmark-recent-row>span{font-size:12px}
.has-wallpaper .bookmark-workspace-nav,.has-wallpaper .bookmark-recent-row{-webkit-backdrop-filter:blur(12px)}
.has-wallpaper .bookmark-menu-content,.has-wallpaper #userDropdownMenu,.has-wallpaper .bookmark-modal-content,.has-wallpaper .modal-content,.has-wallpaper .popup-content{background:var(--wallpaper-solid)}
.has-wallpaper #personalListHeader,.has-wallpaper .bookmark-search-library-label{background:var(--wallpaper-toolbar);padding:10px 14px;border-radius:12px}
.has-wallpaper #siteSearchResults>div:first-child,.has-wallpaper #siteSearchStatus,.has-wallpaper #siteSearchPagination,.has-wallpaper #categoryBrowse>div:first-child{background:var(--wallpaper-toolbar);border-radius:12px;padding:12px 15px}
.has-wallpaper .bookmark-personal-matches>.bookmark-section-heading{background:var(--wallpaper-toolbar);border-radius:12px;padding:10px 14px}
.has-wallpaper>footer.app-footer{background:transparent;backdrop-filter:none}
.has-wallpaper #categoryBrowse>div:first-child>div{color:var(--muted)}
.has-wallpaper>footer .footer-text{border-color:transparent}
.has-wallpaper>footer .footer-text>p{width:fit-content;max-width:100%;margin:0 auto;padding:3px 9px;background:var(--wallpaper-toolbar);border-radius:9px}

/* An unobtrusive background control alongside the existing user menu. */
.background-trigger{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--accent);box-shadow:var(--shadow);font-size:15px;cursor:pointer}
.background-trigger:hover{background:var(--soft)}
.app-header .header-row{display:block}
.app-header .header-search{width:100%;min-width:0}
.header-search-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;margin-top:10px;min-width:0}
.app-header .header-search-tools #searchPlatformTabs{margin:0;min-width:0;align-items:center;padding:2px 0}
.app-header .header-search-tools .header-actions{width:auto;margin:0;align-self:center}
.app-header .header-search-tools .background-trigger,.app-header .header-search-tools #userDropdownToggle{width:36px;height:36px;box-shadow:none}
.app-header .header-actions{gap:10px}
.app-header .header-actions>*{margin-left:0}
.background-dialog{max-width:470px}
.background-dialog .bookmark-modal-header{margin-bottom:18px}
.background-presets{display:grid;grid-template-columns:repeat(auto-fit,minmax(58px,1fr));gap:10px}
.background-preset{padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;background:var(--page);color:var(--muted);cursor:pointer;font:inherit;font-size:12px}
.background-preset[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}
.background-preset-swatch{display:block;height:44px;border-bottom:1px solid var(--line)}
.background-preset span:last-child{display:block;padding:5px}
.background-preset-default{background:#fafbff}
.background-preset-mist{background:radial-gradient(ellipse at 12% 12%,rgba(160,177,255,.88),transparent 65%),radial-gradient(ellipse at 88% 82%,rgba(244,174,214,.8),transparent 65%),linear-gradient(135deg,#d4e5ff,#e9d5fa 52%,#c4e9e1)}
.background-preset-dusk{background:radial-gradient(ellipse at 10% 90%,rgba(255,168,121,.85),transparent 65%),radial-gradient(ellipse at 95% 12%,rgba(89,78,158,.88),transparent 60%),linear-gradient(135deg,#edc3b9,#c4a1d6 55%,#7f91bd)}
.background-preset-custom{background-size:cover;background-position:center}
.background-dialog .background-upload{display:flex;width:100%;align-items:center;justify-content:center;gap:8px;min-height:46px;margin:15px 0 8px;border:1px dashed var(--line);border-radius:11px;color:var(--accent);background:var(--soft);cursor:pointer;font:inherit;font-size:13px}
.background-help{color:var(--muted);font-size:12px;line-height:1.7;margin:0 0 16px}
.background-preview{height:92px;border-radius:12px;border:1px solid var(--line);background-color:var(--page);background-size:cover;display:flex;align-items:flex-end;overflow:hidden}
.background-preview span{font-size:12px;color:#243047;background:rgba(255,255,255,.94);padding:4px 9px;margin:9px;border-radius:6px}
.background-dialog .background-control{display:block;margin:16px 0;color:var(--ink);font-size:13px}
.background-control-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.background-control-heading output{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}
.background-dialog input[type=range]{width:100%;padding:0;margin:0;border:0;height:20px;background:transparent;accent-color:var(--accent);cursor:pointer}
.background-selects{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.background-selects select{font-size:14px}
.background-dialog .bookmark-form-actions{align-items:center;gap:6px;margin-top:18px;flex-wrap:wrap}
#backgroundReset{margin-right:auto;font-size:12px}
#backgroundSave:disabled{opacity:.5;cursor:wait}
#backgroundProcessing{font-size:12px;color:var(--muted);min-height:0}
#backgroundError{font-size:13px;color:var(--danger);line-height:1.6}
@media(max-width:760px){.has-wallpaper .bookmark-workspace-nav{padding:8px 12px}.has-wallpaper .bookmark-recent-row{padding:6px 9px;gap:6px 10px}.background-selects select{font-size:16px}.header-search-tools{gap:12px}}
@media(max-width:420px){.background-dialog{padding:20px}.background-presets{gap:7px}.background-dialog .bookmark-form-actions .bookmark-button{padding:9px 11px}}
@media(pointer:coarse){.app-header .header-search-tools .background-trigger,.app-header .header-search-tools #userDropdownToggle{width:44px;height:44px}}
