/* 主页(主菜单)。2026-10-02 从 index.html 拆出来；加载顺序见 index.html 的 <link>，前后顺序就是层叠顺序，别乱调 */
  /* ── Menu (hub · app 唯一入口，从聊天页返回箭头进入) ──
     个人信息已并入头像身份区；三组导航各自一块玻璃面板，组内用细线分隔；
     设置折叠在最后。视觉语言跟登录页同一套：晕染底 + 玻璃壳 + 呼吸感。 */
  .menu-panel{
    position: fixed; inset: 0; z-index: 190;
    pointer-events: none;
    transform: translateX(-100%);
    transition: transform .38s var(--ease-soft);
    will-change: transform;
  }
  /* 只滑不淡，理由同 .profile-panel */
  .menu-panel.open{ transform: none; pointer-events: auto; }
  /* 打开 app 时主菜单直接就在，不从左边滑进来 */
  .menu-panel.instant{ transition: none; }
  .menu-page{
    position: absolute; inset: 0;
    display: flex; flex-direction: column;
    background-color: var(--bg);
    background-image: var(--menu-wall-default);
    background-size: cover; background-position: center;
    overflow: hidden;
  }
  .menu-page::before{
    content:""; position:absolute; inset:0; background: var(--scrim); pointer-events:none;
  }
  .menu-scroll{
    position: relative; z-index: 1;
    flex: 1 1 auto; overflow-y: auto;
    -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
    display: flex; flex-direction: column; gap:22px;
    padding: calc(env(safe-area-inset-top) + 34px) var(--side-pad) calc(env(safe-area-inset-bottom) + 34px);
  }
  .menu-scroll::-webkit-scrollbar{ width:0; height:0; }

  /* 身份区：头像即个人信息入口，不套玻璃壳，敞开的 */
  .menu-hero{ flex:0 0 auto; text-align:center; padding:4px 0 6px; }
  .hero-tag{
    font-size:9.5px; letter-spacing:.38em; text-indent:.38em;
    color: var(--text-faint); margin-bottom:22px;
  }
  .hero-avatar{
    position:relative;
    width:86px; height:86px; border-radius:50%;
    margin:0 auto 21px; padding:0; border:1px solid var(--card-line); cursor:pointer;
    background-color: var(--card-bg);
    background-image: var(--avatar-default);
    background-size:cover; background-position:center;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 12px 30px rgba(24,46,67,.15);
    transition: transform .25s var(--ease-soft), box-shadow .25s var(--ease-soft);
  }
  .hero-avatar::after{
    content:""; position:absolute; inset:-9px; border-radius:50%;
    border:1px solid var(--hairline); pointer-events:none;
    transition: inset .25s var(--ease-soft), border-color .25s var(--ease-soft);
  }
  .hero-avatar:hover::after{ inset:-12px; }
  .hero-avatar:active{ transform: scale(.96); }
  .hero-title{
    font-family: var(--font-en), var(--font-cn);
    font-weight:500; font-size:31px;
    letter-spacing:.1em; text-indent:.1em; line-height:1.1;
    color: var(--text); margin:0;
  }
  .hero-rule{
    display:flex; align-items:center; justify-content:center; gap:9px;
    width:170px; margin:16px auto 15px;
  }
  .hero-rule i{ flex:1 1 auto; height:1px; background:linear-gradient(90deg, transparent, var(--hairline)); }
  .hero-rule i + i{ background:linear-gradient(90deg, var(--hairline), transparent); }
  .hero-rule b{
    flex:none; width:4px; height:4px; border-radius:1px;
    background: var(--accent); opacity:.6; transform:rotate(45deg);
  }
  .hero-meta{ display:flex; align-items:center; gap:21px; width:100%; max-width:300px; margin:0 auto; }
  .hero-stat{ flex:1 1 0; min-width:0; }
  .hero-stat-label{ font-size:8.5px; letter-spacing:.24em; text-indent:.24em; color: var(--text-faint); margin-bottom:6px; white-space:nowrap; }
  .hero-stat-val{ font-family: var(--font-en), var(--font-cn); font-weight:500; font-size:20px; line-height:1; letter-spacing:.05em; color: var(--text-soft); white-space:nowrap; }
  .hero-days .hero-stat-val{ letter-spacing:.02em; }
  .hero-days .num{ font-size:22px; color: var(--accent); }
  .hero-sep{ flex:none; width:1px; height:32px; align-self:center; background:linear-gradient(180deg, transparent, var(--hairline), transparent); }

  /* 分组：一组一块玻璃，组内用细线分隔 */
  .menu-group{ flex:0 0 auto; }
  .menu-group-label{
    font-family: var(--font-en), var(--font-cn); font-size:10.5px; letter-spacing:.28em;
    color: var(--text-faint); margin:0 0 8px 3px;
  }
  .menu-group-panel{
    border-radius:16px;
    background: var(--card-bg);
    -webkit-backdrop-filter: blur(20px) saturate(1.6); backdrop-filter: blur(20px) saturate(1.6);
    border:1px solid var(--card-line);
    box-shadow: var(--card-shadow);
    overflow:hidden;
  }
  .menu-list{ display:flex; flex-direction:column; }
  .menu-item{
    display:flex; align-items:center; gap:12px;
    width:100%; padding:13px 15px;
    border:0; border-top:1px solid var(--hairline);
    background:none; text-align:left;
    color: var(--text); font: inherit; cursor:pointer;
    transition: background .15s var(--ease-soft);
  }
  .menu-item:first-child{ border-top:0; }
  .menu-item:active{ background: var(--row-press); }
  .menu-ic{ flex:none; width:19px; height:19px; color: var(--accent); display:grid; place-items:center; }
  .menu-ic svg{ width:19px; height:19px; display:block; }
  .menu-copy{ flex:1 1 auto; min-width:0; }
  .menu-name{ font-family: var(--font-cn); font-size:14.5px; color: var(--text); display:block; }
  .menu-sub{ font-size:11.5px; color: var(--text-faint); margin-top:2px; display:block; }
  .menu-chev{ flex:none; width:14px; height:14px; color: var(--text-faint); }
  .menu-chev svg{ width:14px; height:14px; display:block; }

  /* footer */
  .menu-foot{
    text-align:center; margin-top:6px;
    font-family: var(--font-en), var(--font-cn); font-style:italic; font-size:13px;
    color: var(--text-faint);
  }