/* ══════════════════════════════════════════════════════════
   app/shell.css — 登录墙 / 手机端 App 化布局 / 导航管理
   由原 assets/app.css 第 1026–1278 行拆出；七个文件按 index.html 里的顺序加载，层叠顺序与原来一致
   ══════════════════════════════════════════════════════════ */
/* ══ 登录墙 ══ */
.auth-wall{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#060b19 0%,#110c26 40%,#1a0a18 70%,#0d0520 100%);
  overflow:hidden;}
/* 登录墙动态光晕 */
.auth-wall::before{content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 25% 35%,rgba(167,139,250,.18) 0%,transparent 55%),
             radial-gradient(ellipse at 75% 65%,rgba(232,80,122,.14) 0%,transparent 55%),
             radial-gradient(ellipse at 50% 10%,rgba(56,189,248,.08) 0%,transparent 45%);
  animation:authBgPulse 8s ease-in-out infinite alternate;pointer-events:none;}
@keyframes authBgPulse{
  0%{opacity:.7;transform:scale(1);}
  50%{opacity:1;transform:scale(1.05);}
  100%{opacity:.8;transform:scale(1);}
}
/* 登录墙专属樱花画布 */
#auth-sakura-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;}
.auth-wall.hidden{display:none;}
/* 首次加载时隐藏，等 session 检查完再决定是否显示 */
/* 验证会话的这一两百毫秒里盖什么：
   · 上次登录着离开的人（html.auth-guess-in）：保持透明，他们大概率还登录着，
     不该为了这点时间闪一张加载页；
   · 没登录过的访客：直接盖上（只露转圈），否则会先看到主界面再被登录页顶掉 */
.auth-wall.checking{opacity:1;pointer-events:auto;}
html.auth-guess-in .auth-wall.checking{opacity:0;pointer-events:none;}
.auth-checking-spinner{display:none;flex-direction:column;align-items:center;gap:16px;}
.auth-wall.checking .auth-checking-spinner{display:flex;}
.spinner-icon{font-size:2.5rem;animation:floatIcon 2s ease-in-out infinite;}
.spinner-text{font-size:.82rem;color:rgba(255,255,255,.4);letter-spacing:2px;}
/* 邮箱找回密码弹窗 */
.reset-modal{position:fixed;inset:0;z-index:100050;display:none;align-items:center;justify-content:center;
  background:rgba(6,4,16,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:18px;}
.reset-modal.show{display:flex;}
.reset-card{
  --a:#ffb7c5;--a2:#ff6b9d;--gold:#e9c789;
  --ink:#f4ebf1;--ink-soft:#c2a7bd;--ink-dim:#7a6274;
  --line:rgba(255,183,197,.14);--line2:rgba(255,183,197,.3);--field:rgba(255,255,255,.05);
  position:relative;width:min(400px,94vw);
  background:radial-gradient(420px 200px at 20% -10%,rgba(255,107,157,.18),transparent 60%),linear-gradient(160deg,rgba(28,17,38,.94),rgba(16,10,26,.96));
  border:1px solid var(--line2);border-radius:24px;
  box-shadow:0 30px 80px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.06);padding:30px 28px 26px;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);}
.reset-card::before{content:'';position:absolute;top:0;left:24px;right:24px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.6;}
.reset-title{font-family:"Songti SC","STSong","Noto Serif SC","SimSun",serif;font-size:1.35rem;font-weight:600;color:#fff;text-align:center;letter-spacing:2px;}
.reset-sub{font-size:.78rem;color:var(--ink-soft);text-align:center;margin:6px 0 22px;letter-spacing:.5px;}
.reset-back{display:block;margin-top:14px;text-align:center;color:var(--ink-dim);cursor:pointer;font-size:.82rem;letter-spacing:1px;transition:color .18s;}
.reset-back:hover{color:var(--a);}
#reset-msg{margin-top:12px;}

/* ── 通知中心（铃铛）── */
.bell-wrap{position:relative;}
.bell-badge{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;border-radius:9px;background:#ef4444;color:#fff;
  font-size:.6rem;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 4px;
  border:1.5px solid rgba(12,16,36,.9);box-shadow:0 0 8px rgba(239,68,68,.5);}
.bell-panel{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:min(340px,92vw);max-height:72vh;overflow-y:auto;
  background:linear-gradient(160deg,#16122b,#0e0b1e);border:1px solid rgba(167,139,250,.3);border-radius:16px;
  box-shadow:0 22px 64px rgba(0,0,0,.6);z-index:9985;display:none;
  scrollbar-width:thin;scrollbar-color:rgba(167,139,250,.25) transparent;}
/* 居中箭头，指向铃铛 */
.bell-panel::before{content:'';position:absolute;top:-7px;left:50%;transform:translateX(-50%) rotate(45deg);
  width:13px;height:13px;background:#16122b;border-left:1px solid rgba(167,139,250,.3);border-top:1px solid rgba(167,139,250,.3);}
.bell-panel.show{display:block;animation:bellIn .2s cubic-bezier(.16,1,.3,1);}
@keyframes bellIn{from{opacity:0;transform:translateX(-50%) translateY(-8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
body.theme-light .bell-panel{background:linear-gradient(160deg,#fff0f6,#ffe6f0);border-color:rgba(200,120,150,.3);}
.bell-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;position:sticky;top:0;
  background:inherit;border-bottom:1px solid rgba(255,255,255,.08);font-weight:800;color:var(--text-main);font-size:.92rem;}
.bell-readall{background:rgba(255,255,255,.08);border:none;color:#c4b5fd;border-radius:8px;padding:4px 10px;font-size:.72rem;cursor:pointer;}
.bell-readall:hover{background:rgba(167,139,250,.25);}
.bell-sec-title{font-size:.7rem;color:var(--text-dim);padding:10px 16px 4px;font-weight:700;letter-spacing:.5px;}
.bell-item{display:flex;gap:10px;align-items:flex-start;padding:10px 16px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.04);}
.bell-item:hover{background:rgba(255,255,255,.05);}
.bell-item.unread{background:rgba(167,139,250,.08);}
.bell-ico{flex-shrink:0;font-size:1.05rem;line-height:1.3;}
.bell-item-main{flex:1;min-width:0;}
.bell-item-title{font-size:.82rem;color:var(--text-main);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.bell-item-sub{font-size:.74rem;color:var(--text-sub);margin-top:2px;word-break:break-word;line-height:1.5;}
.bell-item-time{font-size:.64rem;color:var(--text-dim);margin-top:3px;}
.bell-dot{flex-shrink:0;width:7px;height:7px;border-radius:50%;background:#ef4444;margin-top:6px;}
.bell-empty{text-align:center;color:var(--text-dim);font-size:.8rem;padding:14px 0;}
.auth-error{background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.25);color:#f87171;border-radius:10px;padding:10px 14px;font-size:.8rem;margin-top:12px;display:none;}
.auth-error.show{display:block;}
.auth-rules{font-size:.69rem;color:rgba(255,255,255,.22);margin-top:14px;text-align:center;line-height:1.7;}
/* 个人中心 UID + 退出 */
.pc-uid{font-size:.7rem;color:rgba(255,255,255,.3);letter-spacing:1px;}
.pc-logout-btn{padding:5px 12px;border-radius:20px;background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.22);color:#f87171;cursor:pointer;font-size:.72rem;font-family:inherit;transition:background .15s;}
.pc-logout-btn:hover{background:rgba(248,113,113,.22);}
/* 角色徽章 */
.pc-role-badge{padding:2px 10px;border-radius:20px;font-size:.68rem;font-weight:700;letter-spacing:.5px;}
.pc-role-super{background:rgba(248,113,113,.15);border:1px solid rgba(248,113,113,.3);color:#f87171;}
.pc-role-admin{background:rgba(167,139,250,.15);border:1px solid rgba(167,139,250,.3);color:#a78bfa;}
.pc-role-user{background:rgba(148,163,184,.1);border:1px solid rgba(148,163,184,.2);color:#94a3b8;}
/* 后台管理入口 */
.pc-admin-btn{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;text-decoration:none;background:rgba(167,139,250,.08);border:1px solid rgba(167,139,250,.2);transition:background .15s,border-color .15s;cursor:pointer;}
.pc-admin-btn:hover{background:rgba(167,139,250,.18);border-color:rgba(167,139,250,.4);}
.pc-admin-icon{font-size:1.4rem;flex-shrink:0;}
.pc-admin-info{flex:1;}
.pc-admin-title{font-size:.88rem;font-weight:600;color:#c7d2fe;margin-bottom:2px;}
.pc-admin-sub{font-size:.72rem;color:rgba(255,255,255,.35);}

/* ── 主题壁纸板块 ── */
.pc-theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;}
.pc-theme-card{border-radius:12px;overflow:hidden;cursor:pointer;border:1.5px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);transition:transform .15s,border-color .15s,box-shadow .15s;}
.pc-theme-card:hover{transform:translateY(-2px);border-color:rgba(167,139,250,.45);}
.pc-theme-card.active{border-color:#f472b6;box-shadow:0 0 0 1px #f472b6,0 6px 20px rgba(244,114,182,.25);}
.pc-theme-card.locked{cursor:not-allowed;opacity:.82;}
.pc-theme-card.locked:hover{transform:none;border-color:rgba(255,255,255,.12);}
.pc-theme-prev{position:relative;height:64px;display:flex;align-items:center;justify-content:center;}
.pc-theme-ico{font-size:1.8rem;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5));}
.pc-theme-card.locked .pc-theme-ico{filter:grayscale(.7) brightness(.7);}
.pc-theme-lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.42);font-size:1.3rem;}
.pc-theme-badge{position:absolute;top:5px;right:5px;background:rgba(244,114,182,.9);color:#fff;
  font-size:.56rem;font-weight:800;padding:1px 6px;border-radius:8px;letter-spacing:.5px;}
.pc-theme-meta{padding:7px 8px 9px;}
.pc-theme-name{font-size:.78rem;font-weight:700;color:#e2e8f0;margin-bottom:3px;display:flex;align-items:center;gap:4px;}
.pc-theme-desc{font-size:.64rem;color:rgba(255,255,255,.42);line-height:1.45;}

/* ── 主题壁纸激活时：主面板降透明度，露出背后动态壁纸 ── */
body.theme-wallpaper-active .card{
  background:rgba(14,11,28,.46);
  border-color:rgba(255,255,255,.09);
  backdrop-filter:blur(10px) saturate(1.1);
  -webkit-backdrop-filter:blur(10px) saturate(1.1);
}
body.theme-wallpaper-active .header-bar{
  background:rgba(14,11,28,.5);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
}
body.theme-wallpaper-active .timezone-item,
body.theme-wallpaper-active .tz-card{background:rgba(255,255,255,.04);}

/* ── 壁纸模式 + 主题壁纸：透出主题背景层（z-1），前景层(z56)自然浮于时钟之上 ── */
body.theme-wallpaper-active.pure-mode-on .pure-overlay{background:transparent;}
body.theme-wallpaper-active.pure-mode-on .pure-overlay .pure-bg,
body.theme-wallpaper-active.pure-mode-on .pure-overlay .pure-bg-dim{display:none;}
/* 隐藏背后仪表盘，避免透明遮罩下露出主界面 */
body.theme-wallpaper-active.pure-mode-on #dashboard-root{visibility:hidden;}

/* ════════════════ 手机端 App 化布局 ════════════════ */
.mobile-tabbar{display:none;}
.mtools-sheet{display:none;position:fixed;inset:0;z-index:9500;}
.mtools-sheet.show{display:block;}
.mtools-backdrop{position:absolute;inset:0;background:rgba(4,6,20,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:mtFade .2s;}
.mtools-panel{position:absolute;left:0;right:0;bottom:0;background:var(--glass-bg,rgba(12,16,40,.97));backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);border-top:1px solid var(--glass-border,rgba(255,183,197,.2));border-radius:24px 24px 0 0;padding:10px 18px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -16px 50px rgba(0,0,0,.5);animation:mtSlide .26s cubic-bezier(.16,1,.3,1);}
@keyframes mtFade{from{opacity:0}to{opacity:1}}
@keyframes mtSlide{from{transform:translateY(100%)}to{transform:translateY(0)}}
.mtools-grab{width:40px;height:4px;border-radius:4px;background:var(--text-dim,#475569);margin:2px auto 12px;}
.mtools-title{font-size:.95rem;font-weight:800;color:var(--text-main,#f1f5f9);margin-bottom:14px;text-align:center;}
.mtools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.mtool{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;background:rgba(255,255,255,.05);border:1px solid var(--glass-border,rgba(255,183,197,.14));border-radius:16px;color:var(--text-main,#e2e8f0);font-size:.76rem;font-weight:600;cursor:pointer;transition:background .15s,transform .12s;}
.mtool:active{transform:scale(.94);background:rgba(255,183,197,.14);}
.mtool-ico{font-size:1.7rem;line-height:1;}

@media(max-width:768px){
  /* 顶部精简：隐藏拥挤按钮，仅保留 城市选择器 + 通知🔔 + 私信✉️ */
  .sakura-density-wrap,#theme-btn,#sec-btn,#btn-note,#btn-calc,#btn-cal,
  #btn-random,#btn-install,#btn-game-trigger,#btn-chat,#pure-btn,#btn-player-center{display:none !important;}
  .header-bar{position:sticky;top:0;z-index:60;}
  .nav-actions{gap:8px;flex:1;justify-content:flex-end;}
  .custom-select-container{flex:1;min-width:0;max-width:none;}
  /* 内容底部留出标签栏空间 */
  .app-shell{padding-bottom:calc(74px + env(safe-area-inset-bottom));}

  /* 底部标签栏 */
  .mobile-tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:9000;
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    background:var(--glass-bg,rgba(10,15,35,.92));
    backdrop-filter:blur(24px) saturate(1.4);-webkit-backdrop-filter:blur(24px) saturate(1.4);
    border-top:1px solid var(--glass-border,rgba(255,183,197,.15));box-shadow:0 -8px 28px rgba(0,0,0,.35);}
  .mtab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;
    cursor:pointer;padding:5px 2px;position:relative;color:var(--text-sub,#94a3b8);transition:color .15s;}
  .mtab-ico{font-size:1.35rem;line-height:1;filter:grayscale(.3);transition:transform .15s,filter .15s;}
  .mtab-lbl{font-size:.66rem;font-weight:600;letter-spacing:.5px;}
  .mtab.active{color:var(--pink-deep,#e8507a);}
  .mtab.active .mtab-ico{transform:translateY(-1px) scale(1.12);filter:grayscale(0);}
  .mtab:active .mtab-ico{transform:scale(.9);}

  /* 便签/计算器/日历 → 底部上滑面板（App 化） */
  .note-modal.open,.calc-modal.open,.cal-modal.open{
    top:0 !important;left:0 !important;right:0 !important;bottom:0 !important;
    display:flex !important;align-items:flex-end;justify-content:center;
    background:rgba(4,6,20,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
    pointer-events:auto !important;animation:mtFade .2s;padding:0 !important;}
  .note-panel,.calc-panel,.cal-panel{
    width:100% !important;max-width:none !important;
    border-radius:22px 22px 0 0 !important;
    padding:16px 18px calc(18px + env(safe-area-inset-bottom)) !important;
    max-height:86vh !important;overflow:auto;
    animation:mtSlide .28s cubic-bezier(.16,1,.3,1) !important;}
  .note-panel::before,.calc-panel::before,.cal-panel::before{
    content:'';display:block;width:40px;height:4px;border-radius:4px;flex-shrink:0;
    background:var(--text-dim,#475569);margin:0 auto 14px;}

  /* 首页字号 / 间距节奏 */
  .app-shell{padding-left:14px;padding-right:14px;}
  .main-grid{gap:14px;}
  .card{padding:20px 18px;border-radius:20px;}
  .main-clock-card{padding:26px 20px;}
  .time-display{font-size:clamp(3rem,15vw,4.6rem) !important;letter-spacing:-1px;margin:6px 0;}
  .date-display{font-size:.92rem;}
  .card-title{font-size:.92rem;margin-bottom:14px;}
  .timezone-grid{gap:10px;}
  .header-bar{height:54px;}
}
/* ══════════════════════════════════════════════════════════
   导航管理 — 「⋯ 更多」下拉 + 个人中心管理面板
   ══════════════════════════════════════════════════════════ */
.nav-more-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:min(300px,92vw);
  background:linear-gradient(160deg,#16122b,#0e0b1e);border:1px solid rgba(167,139,250,.3);border-radius:16px;
  box-shadow:0 22px 64px rgba(0,0,0,.6);z-index:9986;padding:12px 14px 14px;
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s;}
.nav-more-dropdown.open{opacity:1;visibility:visible;transform:none;}
body.theme-light .nav-more-dropdown{background:linear-gradient(160deg,#fff0f6,#ffe6f0);border-color:rgba(200,120,150,.3);}
.nav-more-title{font-size:.78rem;font-weight:800;color:var(--text-main,#e9e4ff);margin-bottom:10px;letter-spacing:.5px;}
.nav-more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.nav-more-item{display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px 4px;border-radius:12px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);}
.nav-more-item:hover{background:rgba(167,139,250,.12);}
body.theme-light .nav-more-item{background:rgba(255,255,255,.6);border-color:rgba(200,120,150,.18);}
.nav-more-item.wide{grid-column:1/-1;flex-direction:row;justify-content:center;gap:10px;padding:8px 10px;}
.nav-more-label{font-size:.68rem;color:var(--text-dim,rgba(233,228,255,.6));white-space:nowrap;}
/* 宽控件在下拉里放开宽度限制 */
.nav-more-item .custom-select-container{width:auto;}
.nav-more-item .btn-pure{width:100%;justify-content:center;}

/* 个人中心 · 导航管理列表 */
.pc-navm-row{display:flex;align-items:center;gap:9px;padding:8px 2px;border-bottom:1px solid rgba(255,255,255,.06);}
.pc-navm-row:last-child{border-bottom:none;}
.pc-navm-ico{width:28px;text-align:center;font-size:1.05rem;flex-shrink:0;}
.pc-navm-info{flex:1;min-width:0;}
.pc-navm-name{font-size:.82rem;font-weight:700;color:var(--text-main,#e9e4ff);}
.pc-navm-desc{font-size:.66rem;color:var(--text-dim,rgba(233,228,255,.45));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pc-navm-seg{display:flex;border:1px solid rgba(255,255,255,.14);border-radius:9px;overflow:hidden;flex-shrink:0;}
.pc-navm-opt{border:none;background:transparent;color:rgba(233,228,255,.5);font-size:.7rem;padding:5px 10px;cursor:pointer;}
.pc-navm-opt.on-show{background:rgba(74,222,128,.2);color:#4ade80;font-weight:800;}
.pc-navm-opt.on-more{background:rgba(96,165,250,.2);color:#93c5fd;font-weight:800;}
.pc-navm-arrows{display:flex;gap:4px;flex-shrink:0;}
.pc-navm-arrow{width:26px;height:26px;border-radius:8px;border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);color:var(--text-main,#e9e4ff);font-size:.8rem;cursor:pointer;line-height:1;}
.pc-navm-arrow:hover:not(:disabled){background:rgba(167,139,250,.25);}
.pc-navm-arrow:disabled{opacity:.25;cursor:default;}
body.theme-light .pc-navm-name{color:#5b3347;}
body.theme-light .pc-navm-desc{color:rgba(91,51,71,.55);}
body.theme-light .pc-navm-opt{color:rgba(91,51,71,.55);}
body.theme-light .pc-navm-arrow{color:#5b3347;background:rgba(255,255,255,.5);border-color:rgba(200,120,150,.25);}
