/* High-tech desktop wallpaper with a glowing red panda. */
.desktop-screen{background:var(--bg)}
.login-screen{background:var(--bg);background-image:none}
.boot-cat{width:70px;height:70px;object-fit:contain;padding:0;letter-spacing:0;filter:drop-shadow(0 0 18px #18e0ff88)}
.login-avatar{overflow:hidden;background:#0b2038}
.login-avatar img{display:block;width:100%;height:100%;object-fit:contain}
.tray-cat{display:block;width:20px;height:20px;object-fit:contain;filter:drop-shadow(0 0 8px #18e0ff66)}
.wallpaper,.wallpaper.theme-noir{background:
  radial-gradient(1000px 640px at 78% 18%,#173b6c 0%,transparent 62%),
  radial-gradient(820px 600px at 14% 100%,#241d56 0%,transparent 58%),
  linear-gradient(160deg,#07142e,var(--bg))}
/* React Bits 背景挂载点，从下往上叠：铁磁流体打底，结晶球浮在上面。
   指针监听都挂在 window 上，这里把指针事件放行给桌面图标与右键菜单。 */
.wallpaper-bg-layer{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;pointer-events:none}
.wallpaper-bg-layer canvas{display:block;width:100%;height:100%}
.ferrofluid-bg{z-index:0}
.crystal-bg{z-index:1}
.wallpaper.theme-dusk{background:
  radial-gradient(900px 600px at 78% 20%,#3a2d5e 0%,transparent 60%),
  linear-gradient(160deg,#120d2c,#070512)}
.wallpaper.theme-mint{background:
  radial-gradient(900px 600px at 78% 20%,#164d52 0%,transparent 60%),
  linear-gradient(160deg,#061d24,#040b12)}
.wallpaper::before{content:"";position:absolute;inset:0;background:
  linear-gradient(#18e0ff11 1px,transparent 1px) 0 0/44px 44px,
  linear-gradient(90deg,#18e0ff11 1px,transparent 1px) 0 0/44px 44px;
  opacity:.4;mask-image:radial-gradient(ellipse at 62% 42%,#000 0%,transparent 76%);z-index:0}
.scanline{display:none}
/* 时间与文案坐在结晶球内部：以球心为中心排版，字号跟着球径（vmin）缩放，
   球变大变小、窗口拉伸时文字始终待在球里。 */
.wallpaper-copy{
  position:absolute;z-index:2;left:50%;top:50%;width:min(62vmin,620px);height:auto;aspect-ratio:auto;
  transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  padding:0;color:var(--text);text-shadow:0 2px 18px #000;pointer-events:none
}
/* 球心压一层柔和暗晕，保证文字在粒子尘上也读得清。 */
.wallpaper-copy::before{
  content:"";position:absolute;inset:-12% -8%;z-index:-1;border-radius:50%;
  background:radial-gradient(closest-side,#03060f99,#03060f42 58%,transparent 82%)
}
.wallpaper-kicker{font-family:"Segoe UI","PingFang SC",sans-serif;font-size:clamp(10px,1.5vmin,18px);font-weight:700;letter-spacing:.34em;color:var(--cyan-soft);text-shadow:0 0 16px #18e0ffcc}
.wallpaper-time{
  display:block;margin:2.4vmin 0 2.8vmin;font-family:"Segoe UI",Georgia,serif;
  font-size:clamp(44px,12.8vmin,148px);font-weight:800;line-height:.92;letter-spacing:-.04em;color:#fff;
  font-variant-numeric:tabular-nums;
  text-shadow:0 0 26px #18e0ffcc,0 0 74px #8b7bff80,0 6px 24px #000
}
.wallpaper-copy p{max-width:100%;margin:0;font-size:clamp(12px,2.2vmin,25px);font-weight:600;line-height:1.62;letter-spacing:.04em;color:#d9edfb}
.wallpaper-character{
  position:absolute;right:clamp(30px,7.5vw,150px);top:47%;width:min(37vw,530px);
  height:min(78vh,720px);transform:translateY(-50%);pointer-events:none;
  display:flex;align-items:center;justify-content:center;filter:none;z-index:2
}
/* 双层冷色边缘光：把角色从结晶球和铁磁流体里托出来，并呼应界面的青 / 紫霓虹 */
.wallpaper-character img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 26px #18e0ff59) drop-shadow(0 0 68px #b79bff3d);animation:ip-breathe 6.5s ease-in-out infinite;transform-origin:50% 100%}
.wallpaper-character .wallpaper-character-img{filter:drop-shadow(0 0 26px #18e0ff59) drop-shadow(0 0 68px #b79bff3d) drop-shadow(0 10px 30px #000000a6)}
.login-avatar img{width:100%;height:100%;object-fit:contain}
@keyframes ip-breathe{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(10px) rotate(-1deg)}}
@media(prefers-reduced-motion:reduce){.wallpaper-character img{animation:none}}
/* 桌面图标：这里只保留配色与描影。悬停不再画方框——描边、底色、抬升阴影统一由 style.css
   末尾的「鼠标触碰特效」层负责。这份样式表比 style.css 后加载、同优先级下会赢，
   所以那两处（白天 / 夜景）的 hover 方框必须在这里删掉，不能只写进 style.css。 */
.desktop-icon{color:var(--text);text-shadow:0 1px 8px #000}
.desktop-icon.drop-target{background:#18e0ff33;border-color:var(--cyan)}

/* Night mode: deep-space violet with a brighter neon rim. */
.wallpaper.theme-night{
  isolation:isolate;
  background:
    radial-gradient(ellipse 58% 54% at 77% 25%,#3a2a6ecc 0%,#1a174855 52%,transparent 100%),
    radial-gradient(ellipse 85% 60% at 50% 115%,#251d4d 0%,transparent 72%),
    linear-gradient(155deg,#0b0720 0%,#120d2c 53%,#070512 100%)
}
.wallpaper.theme-night::before{
  display:none;content:"";position:absolute;inset:-18px;z-index:0;pointer-events:none;
  background-image:
    radial-gradient(circle,#e4e9e5 1px,transparent 1.7px),
    radial-gradient(circle,#b6d5e5 1px,transparent 1.6px),
    radial-gradient(circle,#f0dfbd 1.5px,transparent 2px);
  background-size:143px 109px,211px 169px,347px 229px;
  background-position:26px 12px,101px 71px,184px 142px;
  opacity:.42;animation:night-stars 8s ease-in-out infinite alternate
}
.wallpaper.theme-night::after{
  display:none;content:"";position:absolute;left:53%;top:10%;z-index:0;
  width:clamp(62px,8vw,112px);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 37% 30%,#fffdf0 0%,#e2e8df 48%,#adbdc7 80%,#8297aa 100%);
  box-shadow:0 0 25px 7px #d8e9e34d,0 0 115px 42px #c2d9e126;
  animation:night-moon 7s ease-in-out infinite alternate
}
.wallpaper.theme-night .wallpaper-copy{z-index:2;color:#f0efe8;text-shadow:0 2px 16px #000}
.wallpaper.theme-night .wallpaper-kicker{color:#c3b7ff}
.wallpaper.theme-night .wallpaper-time{color:#fff8dd;font-variant-numeric:tabular-nums;text-shadow:0 0 30px #c3b7ffaa}
.wallpaper.theme-night .wallpaper-character{z-index:1}
.wallpaper.theme-night ~ .desktop-icons .desktop-icon{color:#f6f3e9;text-shadow:0 1px 8px #000}
.wallpaper.theme-night ~ .taskbar{background:#110c2fee;border-top-color:#ffffff1a}
.wallpaper.theme-night ~ .taskbar .start-button,
.wallpaper.theme-night ~ .taskbar .task-button{background:#241b4d;border-color:#8b7bff55}
.wallpaper.theme-night ~ .taskbar .start-button:hover,
.wallpaper.theme-night ~ .taskbar .task-button:hover{background:#332676}
.wallpaper.theme-night ~ .taskbar .tray{background:#160f38;border-color:#8b7bff44}
.wallpaper.theme-night ~ .start-menu{background:#0b1428;border-color:#8b7bff33}
@keyframes night-stars{50%{opacity:.57}100%{opacity:.31}}
@keyframes night-moon{to{box-shadow:0 0 34px 12px #d8e9e361,0 0 125px 50px #c2d9e12d}}
@media(max-width:700px){
  .wallpaper-copy{left:50%;top:46%;width:min(84vmin,100%);padding:0;transform:translate(-50%,-50%)}
  .wallpaper-kicker{font-size:clamp(8px,1.6vmin,12px);letter-spacing:.26em}
  .wallpaper-time{font-size:clamp(36px,14.5vmin,78px);margin:1.6vmin 0 2vmin}
  .wallpaper-copy p{max-width:100%;font-size:clamp(11px,3vmin,16px);line-height:1.5}
  .wallpaper-character{right:8px;top:auto;bottom:14px;width:min(49vw,260px);height:min(45vh,355px);transform:none;opacity:.96}
  .wallpaper.theme-night::after{left:auto;right:11%;top:8%;width:clamp(54px,14vw,76px)}
}
@media(prefers-reduced-motion:reduce){.wallpaper.theme-night::before,.wallpaper.theme-night::after{animation:none}}

/* 静态立绘让位给 <huguang-mascot> 动效组件。
   这条必须写在 wallpaper.css（最后一份样式表）：上面第 50 行有 .wallpaper-character
   的 display:flex，同优先级下后加载的赢，写在 style.css 里会被它盖掉。 */
.wallpaper-character{display:none}