/* Shared white-line UI for home + park */
.nu-top{
  position:absolute;left:0;right:0;top:0;height:118px;z-index:31;
  padding:18px 22px 0;box-sizing:border-box;pointer-events:none;
  background:linear-gradient(180deg,rgba(16,24,22,.46) 0%,rgba(16,24,22,.16) 55%,rgba(16,24,22,0) 100%);
  color:#fffaf0;font-family:"KaiTi","STKaiti","Microsoft YaHei",sans-serif;
  display:flex;justify-content:space-between;align-items:flex-start;
  text-shadow:0 2px 5px rgba(0,0,0,.35);
}
.nu-place,.nu-time,.nu-coins{display:flex;flex-direction:column;align-items:flex-start;gap:2px;pointer-events:auto}
.nu-place{flex-direction:row;align-items:center;gap:8px}
.nu-place svg,.nu-time svg,.nu-coins svg{width:22px;height:22px;flex:none;stroke:#fffaf0;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}
.nu-place b{font-size:26px;font-weight:500;letter-spacing:1px;line-height:1}
.nu-place small{font-size:8px;letter-spacing:1.6px;opacity:.68;margin-top:2px}
.nu-time{flex-direction:row;align-items:center;gap:7px;position:absolute;left:50%;transform:translateX(-50%);top:16px;background:none;border:none;padding:0;color:#fffaf0;font-family:inherit;cursor:pointer}
.nu-time b{font-size:25px;font-weight:500;letter-spacing:2px}
.nu-time small{font-size:8px;letter-spacing:1px;opacity:.6;align-self:flex-end;margin-bottom:3px}
.nu-coins{flex-direction:row;align-items:center;gap:6px;position:absolute;right:22px;top:18px}
.nu-coins b{font-size:20px;font-weight:500}
.nu-coins small{font-size:8px;letter-spacing:1.4px;opacity:.65}

.nu-cluster{
  position:absolute;left:16px;bottom:16px;width:226px;height:170px;z-index:32;
  font-family:"KaiTi","STKaiti","Microsoft YaHei",sans-serif;
}
.nu-icon{
  position:absolute;border:none;background:transparent;padding:0;cursor:pointer;
  width:66px;height:66px;display:grid;place-items:center;isolation:isolate;
  -webkit-tap-highlight-color:transparent;outline:none;
}
.nu-icon svg{width:44px;height:44px;position:relative;z-index:2;stroke:#fffaf0;fill:none;
  stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.32));}
.nu-icon::before{content:"";position:absolute;left:50%;top:50%;width:64px;height:64px;z-index:0;transform:translate(-50%,-50%) rotate(45deg);border-radius:18px;background:rgba(47,56,53,.14);}
.nu-icon .nu-mask{
  position:absolute;left:50%;top:50%;width:64px;height:64px;z-index:0;
  transform:translate(-50%,-50%) rotate(45deg);border-radius:18px;
  background:rgba(47,56,53,.30);filter:blur(7px);
}
.nu-icon:active{transform:scale(.94)}
.nu-camera{left:80px;top:0}
.nu-more{left:8px;top:12px;width:46px;height:46px}
.nu-more svg{width:30px;height:30px}
.nu-more::before{width:40px;height:40px;border-radius:12px}
.nu-more .nu-mask{width:40px;height:40px;border-radius:12px;opacity:.8}
.nu-door{left:18px;top:82px}
.nu-message{left:142px;top:82px}

.nu-photo-count{position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);
  font:600 7.5px/1 "Microsoft YaHei",sans-serif;letter-spacing:.6px;color:#fffaf0;opacity:.55;z-index:3;text-shadow:0 1px 2px #000;}

.nu-phone{
  position:absolute;inset:0;z-index:50;display:none;place-items:center;
  background:rgba(8,16,18,.58);backdrop-filter:blur(7px);
  font-family:"KaiTi","STKaiti","Microsoft YaHei",sans-serif;
}
.nu-phone.show{display:grid}
.nu-phone-card{
  width:330px;border-radius:18px;padding:22px 22px 16px;box-sizing:border-box;
  background:rgba(31,43,42,.92);border:1px solid rgba(255,250,240,.22);
  color:#fffaf0;box-shadow:0 24px 60px rgba(0,0,0,.45);position:relative;
}
.nu-phone-card h2{margin:0 0 3px;font-size:30px;font-weight:500;letter-spacing:2px}
.nu-phone-card p{margin:0 0 16px;font-size:9px;letter-spacing:1.4px;opacity:.55}
.nu-phone-close{position:absolute;right:12px;top:10px;width:30px;height:30px;border:none;border-radius:50%;
  background:rgba(255,250,240,.1);color:#fffaf0;font:300 18px/1 "Microsoft YaHei";cursor:pointer}
.nu-phone-row{display:flex;align-items:center;justify-content:space-between;
  padding:12px 2px;border-bottom:1px solid rgba(255,250,240,.12);font-size:13px;letter-spacing:1.4px}
.nu-phone-row span{opacity:.55;font-size:9px;letter-spacing:1px}

.nu-toast{
  position:absolute;left:50%;bottom:206px;transform:translate(-50%,8px);z-index:55;
  padding:8px 14px;border-radius:999px;background:rgba(16,24,22,.86);
  border:1px solid rgba(255,250,240,.28);color:#fffaf0;
  font:500 9.5px/1.2 "Microsoft YaHei",sans-serif;white-space:nowrap;
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
}
.nu-toast.show{opacity:1;transform:translate(-50%,0)}

.nu-flash{position:absolute;inset:0;z-index:58;background:#fffaf0;opacity:0;pointer-events:none;transition:opacity .08s}
.nu-flash.on{opacity:.9}

.nu-loading{
  position:fixed;left:0;top:0;width:100vw;height:100vh;z-index:70;display:grid;place-items:center;
  background:#101c22;color:#fffaf0;transition:opacity .55s ease;
  font-family:"KaiTi","STKaiti","Microsoft YaHei",sans-serif;
}
.nu-loading.hide{opacity:0;pointer-events:none}
.nu-loading-inner{display:flex;flex-direction:column;align-items:center;gap:14px;transform:translateY(-12px)}
.nu-loading-dots{display:flex;gap:10px}
.nu-loading-dots i{width:8px;height:8px;border-radius:50%;background:#fffaf0;opacity:.25;animation:nuDot 1.2s infinite}
.nu-loading-dots i:nth-child(2){animation-delay:.18s}
.nu-loading-dots i:nth-child(3){animation-delay:.36s}
@keyframes nuDot{0%,80%,100%{opacity:.2;transform:translateY(0)}40%{opacity:1;transform:translateY(-5px)}}
.nu-loading span{font-size:11px;letter-spacing:3px;opacity:.7}
.nu-loading small{font-size:8px;letter-spacing:2px;opacity:.35}

/* hide old UI, keep old prompts/toasts/photo overlay */
body.nu-active .hud,
body.nu-active .spec,
body.nu-active .photo-btn,
body.nu-active .home-btn,
body.nu-active .bar,
body.nu-active .zoom-btn,
body.nu-active .depart-btn,
body.nu-active .loading{display:none!important}

#stage.photo-open .nu-top,
#stage.photo-open .nu-cluster{display:none!important}

@media (max-width:600px),(max-height:720px){
  .nu-top{padding-top:calc(14px + env(safe-area-inset-top))}
  .nu-cluster{bottom:calc(14px + env(safe-area-inset-bottom))}
  .nu-loading span{font-size:12px}
}
