/* Home wallpaper stays behind the menu bar and desktop, like an OS desktop. */
body.desktop-home {
  min-height: 100svh;
  isolation: isolate;
  background: #4fa5c8;
}
.desktop-home::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, rgb(12 52 79 / 18%), transparent 70%),
    url("../assets/壁纸.png") center / cover no-repeat;
}
.desktop-home .system-bar {
  background: rgb(244 250 255 / 66%);
  border-bottom: 1px solid rgb(255 255 255 / 45%);
  box-shadow: 0 1px 8px rgb(12 44 67 / 8%);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
}
.desktop-home .greeting,
.desktop-home .greeting h1 {
  color: #fff;
  text-shadow: 0 2px 12px rgb(8 39 65 / 40%);
}
.desktop-home .greeting p,
.desktop-home .app-caption {
  color: #fff;
  text-shadow: 0 1px 4px rgb(8 31 52 / 95%), 0 2px 10px rgb(8 31 52 / 60%);
}
.desktop-home .app-name {
  color: #fff;
  background: rgb(12 47 72 / 34%);
  border-color: rgb(255 255 255 / 20%);
  text-shadow: 0 1px 3px rgb(8 31 52 / 65%);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.desktop-home .dock {
  background: rgb(235 246 255 / 48%);
  border-color: rgb(255 255 255 / 65%);
  box-shadow: 0 12px 32px rgb(10 43 66 / 22%), inset 0 1px rgb(255 255 255 / 55%);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  backdrop-filter: blur(24px) saturate(160%);
}
.desktop-home .desktop-footer a {
  padding: 8px 12px;
  border: 1px solid rgb(255 255 255 / 25%);
  border-radius: 8px;
  background: rgb(12 47 72 / 45%);
  color: #fff;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.desktop-home .app:focus-visible,
.desktop-home .desktop-footer a:focus-visible {
  outline-color: #fff;
}
@media (max-width: 600px) {
  .desktop-home::before { background-position: center, 48% center; }
}

/* A translucent title panel lets the desktop wallpaper remain visible. */
.desktop-home .title-glass {
  width: fit-content;
  max-width: 100%;
  margin: 24px 0 17px;
  padding: 24px 30px;
  border: 1px solid rgb(255 255 255 / 38%);
  border-radius: 24px;
  background: rgb(231 246 255 / 14%);
  box-shadow: 0 12px 36px rgb(10 43 66 / 12%), inset 0 1px rgb(255 255 255 / 24%);
  -webkit-backdrop-filter: blur(16px) saturate(125%);
  backdrop-filter: blur(16px) saturate(125%);
}
.desktop-home .title-glass h1 { margin: 0; }
.desktop-home .title-glass p { margin: 14px 0 0; }
@media (max-width: 600px) {
  .desktop-home .title-glass { padding: 20px; border-radius: 20px; }
  .desktop-home .title-glass h1 { font-size: clamp(30px, 9vw, 45px); letter-spacing: -1.5px; }
}