.home-wallpaper { position:fixed; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; object-position:center; pointer-events:none; user-select:none; }
body:has(> .home-wallpaper) { isolation:isolate; }
.mode-home > :is(.topbar,main), .is-home-page > :is(.topbar,main), .home-landing > .home-main, body:has(> .home-wallpaper) > .periodical-shell { position:relative; z-index:1; }
.home-landing:has(> .home-wallpaper), .mode-home:has(> .home-wallpaper), .is-home-page:has(> .home-wallpaper) { background-color:var(--bg); }
.home-landing,.mode-home,.is-home-page { --home-glass-opacity:58%; }
.home-landing { margin: 0; min-height: 100vh; font-family: system-ui, sans-serif; }
.home-landing * { box-sizing: border-box; }
.home-landing a { text-decoration: none; }
.home-account { position: absolute; top: .7rem; right: 1rem; display: flex; align-items: center; gap: .55rem; z-index: 5; padding:.3rem .45rem; border:1px solid color-mix(in srgb,var(--border) 70%,var(--accent) 30%); border-radius:999px; background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); box-shadow:0 .4rem 1.4rem #0003; -webkit-backdrop-filter:blur(12px) saturate(115%); backdrop-filter:blur(12px) saturate(115%); }
.home-account .auth-menu { position: relative; }
.home-wiki-title { position:absolute; z-index:5; top:1rem; left:1.25rem; min-width:0; max-width:min(22rem,40vw); margin:0; font-size:1rem; font-weight:600; line-height:2.25rem; }
.home-wiki-title a { display:block; overflow:hidden; color:var(--fg); text-overflow:ellipsis; white-space:nowrap; }
.home-account .city-map-launch { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; padding: .4rem; border-radius: 50%; background: transparent; color: var(--fg); }
.home-main { width: min(100% - 2rem, 58rem); margin: auto; padding: 6rem 0 3rem; }
.home-layout-directory .home-main { width:min(100% - 3rem,100rem); }
.home-search { width: min(100%, 40rem); margin: auto; text-align: center; }
.home-search-combobox { position:relative; width:100%; z-index:6; }
.home-search form { display: flex; border: 1px solid color-mix(in srgb,var(--border) 72%,var(--accent) 28%); background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); border-radius: 2rem; padding: .35rem .5rem .35rem 1rem; box-shadow:0 .45rem 1.5rem #0002; -webkit-backdrop-filter:blur(12px) saturate(115%); backdrop-filter:blur(12px) saturate(115%); }
.home-search form:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.home-search input[type=search] { min-width: 0; width: 100%; font-size: 1.1rem; border: 0; background: transparent; outline: none; }
.home-search button { flex-shrink: 0; border: 0; border-radius: 50%; padding: .65rem; display: grid; place-items: center; background:color-mix(in srgb,var(--button-bg,var(--bg)) 76%,transparent); }
.home-search button svg { width: 1.4rem; height: 1.4rem; fill: none; stroke: currentColor; stroke-width: 1.8; }
.home-search-suggestions { position:absolute; z-index:8; top:calc(100% + .55rem); left:0; right:0; max-height:max(8rem,min(28rem,calc(50dvh - 5rem))); padding:.4rem; overflow:auto; overscroll-behavior:contain; border:1px solid color-mix(in srgb,var(--border) 70%,var(--accent) 30%); border-radius:.85rem; background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); box-shadow:0 1rem 2.6rem #0007; -webkit-backdrop-filter:blur(16px) saturate(120%); backdrop-filter:blur(16px) saturate(120%); text-align:left; }
.home-search-suggestions[hidden] { display:none; }
.home-search-suggestion { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.7rem; min-width:0; padding:.58rem .7rem; border-radius:.55rem; color:var(--fg); text-decoration:none; }
.home-search-suggestion:hover,.home-search-suggestion[aria-selected="true"] { background:color-mix(in srgb,var(--accent) 16%,transparent); outline:none; }
.home-search-suggestion-kind { min-width:3.4rem; padding:.12rem .35rem; overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 42%,var(--border)); border-radius:999px; color:var(--muted); font-size:.68rem; text-align:center; text-overflow:ellipsis; white-space:nowrap; }
.home-search-suggestion-main { display:grid; min-width:0; gap:.12rem; }
.home-search-suggestion-main strong,.home-search-suggestion-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-search-suggestion-main strong { color:var(--fg); font-size:.92rem; font-weight:620; }
.home-search-suggestion-main small { color:var(--muted); font: .75rem "Hack Nerd Font",monospace; }
.home-search-suggestion-open { color:var(--muted); font-size:.75rem; white-space:nowrap; }
.home-search-suggestion-search { margin-top:.3rem; border-top:1px solid var(--border-soft,var(--border)); border-radius:.25rem .25rem .55rem .55rem; }
.home-search-suggestion-search .home-search-suggestion-kind { min-width:2rem; border:0; font-size:1rem; }
.mode-home .topbar-search,
.is-home-page .topbar-search { border:1px solid color-mix(in srgb,var(--border) 72%,var(--accent) 28%); border-radius:.45rem; background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); box-shadow:0 .35rem 1.2rem #0002; -webkit-backdrop-filter:blur(12px) saturate(115%); backdrop-filter:blur(12px) saturate(115%); }
.mode-home .topbar-search:focus-within,
.is-home-page .topbar-search:focus-within { outline:2px solid var(--accent); outline-offset:2px; }
.mode-home .topbar-search input[name="q"],
.is-home-page .topbar-search input[name="q"] { border-color:transparent; background:transparent; box-shadow:none; outline:none; }
body:has(> .home-wallpaper) .home-search form,
body:has(> .home-wallpaper) .topbar-search { background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); box-shadow:0 .55rem 1.8rem #0005; }
:is(body.mode-home,body.is-home-page,body.home-landing,body.periodical-top) :is(.notification-dialog,.calendar-upcoming-dialog,.city-map-dialog,dialog.home-bookmark-manager,.auth-menu-popover),
body.periodical-top .periodical-shell dialog { border-color:color-mix(in srgb,var(--border) 72%,var(--accent) 28%); background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); box-shadow:0 1.5rem 5rem #0009; -webkit-backdrop-filter:blur(16px) saturate(120%); backdrop-filter:blur(16px) saturate(120%); }
:is(body.mode-home,body.is-home-page,body.home-landing,body.periodical-top) :is(.notification-dialog,.calendar-upcoming-dialog,dialog.home-bookmark-manager) header,
:is(body.mode-home,body.is-home-page,body.home-landing,body.periodical-top) dialog.home-bookmark-manager .bookmark-savebar,
body.periodical-top .periodical-shell dialog header { background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); }
body:has(> .home-wallpaper) :is(.notification-dialog,.calendar-upcoming-dialog,.city-map-dialog,dialog.home-bookmark-manager,.auth-menu-popover),
body.periodical-top:has(> .home-wallpaper) .periodical-shell dialog { background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); }
body:has(> .home-wallpaper) :is(.notification-dialog,.calendar-upcoming-dialog,dialog.home-bookmark-manager) header,
body:has(> .home-wallpaper) dialog.home-bookmark-manager .bookmark-savebar,
body.periodical-top:has(> .home-wallpaper) .periodical-shell dialog header { background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); }
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  body:has(> .home-wallpaper) .home-search form,
  body:has(> .home-wallpaper) .topbar-search { background:color-mix(in srgb,var(--bg) 90%,transparent); }
  body:has(> .home-wallpaper) :is(.notification-dialog,.calendar-upcoming-dialog,.city-map-dialog,dialog.home-bookmark-manager,.auth-menu-popover),
  body.periodical-top:has(> .home-wallpaper) .periodical-shell dialog { background:color-mix(in srgb,var(--bg) 92%,transparent); }
}
.home-shortcuts { display:flex; width:max-content; max-width:100%; margin:1.35rem auto 0; gap:.25rem; }
.home-shortcuts a { display:grid; place-items:center; width:2.45rem; height:2.45rem; border-radius:50%; color:var(--fg); }
.home-shortcuts a:hover,.home-shortcuts a:focus-visible { background:color-mix(in srgb,var(--accent) 17%,transparent); color:var(--accent); outline:2px solid color-mix(in srgb,var(--accent) 42%,transparent); outline-offset:-2px; }
.home-shortcuts svg { width:1.35rem; height:1.35rem; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.home-appearance-launch { position:fixed; z-index:7; right:1rem; bottom:1rem; display:grid; place-items:center; width:2.6rem; height:2.6rem; padding:.55rem; border:1px solid color-mix(in srgb,var(--border) 70%,var(--accent) 30%); border-radius:50%; background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); color:var(--fg); box-shadow:0 .45rem 1.5rem #0005; -webkit-backdrop-filter:blur(12px) saturate(115%); backdrop-filter:blur(12px) saturate(115%); cursor:pointer; }
.home-appearance-launch:hover,.home-appearance-launch:focus-visible { border-color:var(--accent); color:var(--accent); outline:2px solid color-mix(in srgb,var(--accent) 42%,transparent); outline-offset:2px; }
.home-appearance-launch svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linejoin:round; }
.home-appearance-dialog { width:min(30rem,calc(100vw - 2rem)); box-sizing:border-box; margin:auto; padding:0; border:1px solid color-mix(in srgb,var(--border) 70%,var(--accent) 30%); border-radius:.9rem; background:color-mix(in srgb,var(--bg) var(--home-glass-opacity,58%),transparent); color:var(--fg); box-shadow:0 1.5rem 5rem #0009; -webkit-backdrop-filter:blur(18px) saturate(120%); backdrop-filter:blur(18px) saturate(120%); }
.home-appearance-dialog::backdrop { background:#0008; -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.home-appearance-dialog form { display:grid; gap:1rem; margin:0; padding:1.2rem; }
.home-appearance-dialog header,.home-appearance-dialog footer { display:flex; align-items:center; gap:.75rem; }
.home-appearance-dialog header { justify-content:space-between; }
.home-appearance-dialog h2,.home-appearance-dialog p { margin:0; }
.home-appearance-dialog h2 { font-size:1.1rem; }
.home-appearance-dialog header button { border:0; background:transparent; color:inherit; font-size:1.5rem; cursor:pointer; }
.home-appearance-dialog label { display:grid; gap:.55rem; }
.home-appearance-range { display:grid; grid-template-columns:minmax(0,1fr) 3.5rem; align-items:center; gap:.75rem; }
.home-appearance-range input { width:100%; accent-color:var(--accent); }
.home-appearance-range output { color:var(--fg); font-variant-numeric:tabular-nums; text-align:right; }
.home-appearance-dialog footer { justify-content:flex-end; }
.home-appearance-dialog footer [role=status] { min-width:0; margin-right:auto; color:var(--muted); }
.home-appearance-dialog footer button { padding:.5rem .8rem; border:1px solid var(--border); border-radius:.4rem; background:color-mix(in srgb,var(--button-bg,var(--bg)) var(--home-glass-opacity,58%),transparent); color:var(--fg); cursor:pointer; }
.home-search ~ .home-bookmarks { margin-top: 4rem; }
.home-bookmarks h2 { font-size: 1rem; font-weight: 500; color: var(--muted); }
.home-bookmark-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: .75rem; }
.home-bookmark { display: flex; gap: .8rem; align-items: center; padding: 1.25rem; border: 1px solid var(--border); border-radius: .65rem; overflow-wrap: anywhere; }
.home-bookmark:hover { background: var(--button-hover-bg); border-color: var(--accent); }
.home-empty { color: var(--muted); }
.home-layout-search .home-main { min-height: 100vh; min-height: 100svh; display: grid; align-items: center; padding-block: 5rem; }
.home-layout-directory .home-main { padding-top: max(7rem, 18vh); }
@media (max-width: 600px) { .home-layout-directory .home-main { padding-top: 7rem; } .home-search ~ .home-bookmarks { margin-top: 2.5rem; } }
.home-paged { height:100vh; height:100dvh; overflow:hidden; overscroll-behavior:none; }
.home-paged .home-main[data-home-pager] { display:grid; grid-template-rows:100vh 100vh; grid-template-rows:100dvh 100dvh; align-items:stretch; width:min(100% - 3rem,100rem); height:200vh; height:200dvh; margin:auto; padding:0; transform:translate3d(0,var(--home-pager-drag),0); transition:transform .42s cubic-bezier(.22,.8,.24,1); will-change:transform; }
.home-paged .home-main[data-home-page="bookmarks"] { transform:translate3d(0,calc(-100dvh + var(--home-pager-drag)),0); }
.home-paged .home-main[data-home-dragging] { transition:none; user-select:none; }
.home-pager-page { position:relative; min-width:0; height:100vh; height:100dvh; }
.home-search-page { display:grid; place-items:center; padding:5rem 0; touch-action:pan-x; }
.home-search-page .home-search { align-self:center; }
.home-bookmarks-page { padding:4.5rem 0 3rem; overflow:auto; overscroll-behavior:contain; scrollbar-gutter:stable; touch-action:pan-y; }
.home-bookmarks-page-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1.25rem; padding-inline:.25rem; }
.home-bookmarks-page-head h1 { margin:0; font-size:clamp(1.45rem,3vw,2rem); font-weight:550; }
.home-page-cue { display:grid; place-items:center; width:2.5rem; height:2.5rem; padding:.5rem; border:1px solid color-mix(in srgb,var(--border) 72%,var(--accent) 28%); border-radius:50%; background:color-mix(in srgb,var(--bg) 62%,transparent); color:var(--fg); box-shadow:0 .35rem 1.2rem #0003; -webkit-backdrop-filter:blur(10px) saturate(115%); backdrop-filter:blur(10px) saturate(115%); cursor:pointer; }
.home-page-cue svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.home-page-cue-next { position:absolute; z-index:2; left:50%; bottom:1.25rem; transform:translateX(-50%); animation:home-page-cue 2.4s ease-in-out infinite; }
.home-page-cue:hover,.home-page-cue:focus-visible { border-color:var(--accent); color:var(--accent); outline:2px solid color-mix(in srgb,var(--accent) 45%,transparent); outline-offset:2px; }
.home-page-indicator { position:fixed; z-index:4; top:50%; right:max(.7rem,env(safe-area-inset-right)); display:grid; gap:.55rem; transform:translateY(-50%); }
.home-page-indicator button { width:.65rem; height:.65rem; padding:0; border:1px solid color-mix(in srgb,var(--fg) 62%,transparent); border-radius:50%; background:color-mix(in srgb,var(--bg) 62%,transparent); box-shadow:0 1px 5px #0005; cursor:pointer; }
.home-page-indicator button[aria-current="page"] { border-color:var(--accent); background:var(--accent); transform:scale(1.25); }
@keyframes home-page-cue { 0%,70%,100%{translate:0 0} 82%{translate:0 .28rem} 91%{translate:0 0} }
@media(max-width:600px) { .home-account{right:.5rem;gap:.35rem;padding:.2rem .3rem}.home-wiki-title{left:.75rem;max-width:35vw;font-size:.95rem}.home-appearance-launch{right:.7rem;bottom:.7rem}.home-paged .home-main[data-home-pager]{width:min(100% - 1.5rem,100rem)} .home-search-page{padding-inline:.35rem} .home-bookmarks-page{padding-top:4.25rem} .home-page-indicator{right:.35rem} }
@media(max-width:600px) { .home-search-suggestions{max-height:max(8rem,calc(50dvh - 4rem))} .home-search-suggestion{grid-template-columns:minmax(0,1fr) auto;gap:.4rem} .home-search-suggestion-kind{display:none} }
@media(prefers-reduced-motion:reduce) { .home-paged .home-main[data-home-pager]{transition:none} .home-page-cue-next{animation:none} }
@media (forced-colors:active) {
  .home-search form,
  .mode-home .topbar-search,
  .is-home-page .topbar-search,
  :is(body.mode-home,body.is-home-page,body.home-landing,body.periodical-top) :is(.notification-dialog,.calendar-upcoming-dialog,.city-map-dialog,dialog.home-bookmark-manager,.auth-menu-popover),
  body.periodical-top .periodical-shell dialog,
  .home-page-cue,
  .home-account,
  .home-appearance-launch,
  .home-appearance-dialog,
  .home-search-suggestions { border-color:CanvasText; background:Canvas; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
}