/* Toast、桌面适配、打印与减少动态效果。第一阶段只搬移，不改选择器和值。 */
.toast { position: fixed; z-index: 20; left: 50%; bottom: 102px; transform: translateX(-50%); width: min(360px, calc(100% - 42px)); background: #26364f; color: white; padding: 13px 17px; border-radius: 16px; text-align: center; box-shadow: 0 14px 35px rgba(32,49,73,.3); animation: toastIn .25s ease; }
@keyframes toastIn { from { opacity: 0; transform: translate(-50%, 8px); } }
@media (min-width: 900px) {
  body { padding: 24px; background: radial-gradient(circle at 16% 12%, rgba(239,178,196,.28), transparent 25%), radial-gradient(circle at 82% 82%, rgba(159,205,187,.27), transparent 30%), linear-gradient(135deg, #526f95, #7a9dbc); }
  .site-shell { min-height: 0; height: calc(100vh - 48px); }
  .phone main { height: calc(100% - 88px); }
  .phone { height: calc(100vh - 48px); min-height: 0; }
  nav { position: absolute; width: auto; left: 0; right: 0; transform: none; }
  .toast { position: absolute; }
  .home-world .world-map { width: calc(100% - 48px); margin: 0 auto; }
  .home-world .map-uu { width: 68px; height: 91px; }
}
@media print {
  body { background: white; padding: 0; }
  .desktop-story, header, nav, .print-hide, .section-sub { display: none !important; }
  .site-shell, .phone, .phone main { display: block; width: 100%; height: auto; min-height: 0; max-width: none; box-shadow: none; background: white; overflow: visible; }
  .bag-card { width: 100%; max-width: 600px; margin: 40px auto; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

/* 手机、平板和电脑使用同一个应用外壳。 */
body { padding: 0; display: block; }
.site-shell { width: 100%; min-height: 0; height: 100dvh; display: block; }
.desktop-story { display: none; }
.phone { width: 100%; max-width: 460px; height: 100dvh; min-height: 0; margin: 0 auto; border-radius: 0; }
.phone main { height: calc(100% - 88px); overflow-y: auto; }
.phone:has(.world-view) > header,
.phone:has(.world-view)::before { display: none; }
.phone #appMain.world-view { padding: 0; height: 100%; overflow: hidden; }
.world-view .home-world { margin: 0; height: 100%; display: flex; justify-content: center; }
.world-view .home-world .world-map { width: 100%; height: 100%; margin: 0; aspect-ratio: auto; border: 0; border-radius: 0; box-shadow: none; }
.world-view #worldBanner { bottom: 12px; }
@media (min-width: 600px) {
  .phone { max-width: 820px; }
  .phone main { padding-left: 32px; padding-right: 32px; }
  .world-view .home-world .world-map { width: min(100%, calc(100dvh * .8)); }
}
@media (min-width: 1100px) {
  .phone { max-width: 1120px; }
  .phone main:not(.world-view) > .screen { max-width: 900px; margin: 0 auto; }
  .mentor-grid, .profile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (orientation: landscape) and (max-width: 599px) {
  .world-view .home-world .world-map { width: min(100%, calc(100dvh * .8)); }
}
@media print {
  .phone, .phone main { height: auto; overflow: visible; }
}

/* 按需展开的侧边导航，使用原生 dialog 管理焦点与 Escape。 */
.phone > header { padding-left: 76px; justify-content: flex-end; }
.phone main:not(.world-view) { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
.menu-toggle { position: absolute; z-index: 10; top: calc(20px + env(safe-area-inset-top, 0px)); left: 18px; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.94); color: var(--ink); box-shadow: 0 6px 20px rgba(38,54,79,.12); cursor: pointer; }
.navigation-drawer { position: fixed; inset: 0 auto 0 0; margin: 0; width: min(300px, 85vw); max-width: none; height: 100dvh; max-height: none; padding: calc(24px + env(safe-area-inset-top, 0px)) 18px calc(24px + env(safe-area-inset-bottom, 0px)); border: 0; background: var(--cream); color: var(--ink); box-shadow: 12px 0 48px rgba(38,54,79,.18); overflow-y: auto; }
.navigation-drawer::backdrop { background: rgba(24,38,53,.35); backdrop-filter: blur(3px); }
.drawer-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; padding-left: 12px; font-size: 22px; }
.drawer-close { width: 44px; height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--ink); font-size: 28px; cursor: pointer; }
.phone .drawer-nav { position: static; width: 100%; height: auto; padding: 0; display: grid; grid-template-columns: 1fr; gap: 10px; border: 0; background: transparent; backdrop-filter: none; transform: none; }
.drawer-nav .nav-item { min-height: 56px; display: flex; justify-content: flex-start; gap: 16px; padding: 14px 18px; border-radius: 16px; font-size: 16px; text-align: left; }
.drawer-nav .nav-item.active { background: #e4eff7; color: #315475; }
.menu-toggle:focus-visible, .drawer-close:focus-visible, .drawer-nav .nav-item:focus-visible { outline: 3px solid var(--blue-deep); outline-offset: 3px; }
.toast { bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
@media print { .menu-toggle, .navigation-drawer { display: none !important; } }

/* 等级统计归入个人中心，主内容不再预留顶部统计栏。 */
.phone main { height: 100%; padding-top: calc(80px + env(safe-area-inset-top, 0px)); }
.phone #appMain.world-view { padding-top: 0; }

.sidebar-profile { display:flex;gap:12px;align-items:center;width:100%;padding:16px 12px;margin-bottom:22px;border:1px solid var(--line);border-radius:20px;background:#fff;color:var(--ink);text-align:left;font:inherit;cursor:pointer; }
.sidebar-profile > img { width:52px;height:52px;object-fit:contain;background:#edf5ff;border-radius:16px; }
.sidebar-user-info { flex:1;display:grid;gap:6px;min-width:0; }
.sidebar-user-info strong { overflow-wrap:anywhere;font-size:17px; }
.sidebar-user-info small { color:var(--muted);font-size:11px; }
.sidebar-level { font-size:12px;font-weight:700;color:#55708f; }
.sidebar-progress { height:5px;background:#e7eef5;border-radius:99px;overflow:hidden; }
.sidebar-progress i { display:block;height:100%;background:#7aaad8; }
.sidebar-profile.active { border-color:#7aaad8;background:#eef6fc; }
.drawer-divider { height:1px;background:var(--line);margin:14px 0; }
.phone.reduce-motion *, .phone.reduce-motion *::before, .phone.reduce-motion *::after { animation:none!important;transition:none!important;scroll-behavior:auto!important; }
.settings-form { display:grid;gap:12px; }
.settings-form label { display:grid;gap:8px; }
.settings-form input, .settings-form select { min-height:44px;padding:12px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--ink);font:inherit;max-width:100%; }
.settings-form .checkbox-label { display:flex;gap:12px;align-items:center; }
.settings-form input[type=checkbox] { min-height:auto;width:20px;height:20px; }

.sidebar-profile:focus-visible { outline:3px solid #7aaad8;outline-offset:3px; }
.drawer-section-title { margin:16px 14px 4px;font-size:12px;font-weight:700;letter-spacing:.12em;color:#8193a8; }
.phone #appMain.scene-home { padding:0;height:100%; }
.phone #appMain.chat-view { display:flex;overflow:hidden;padding:80px 16px 16px; }
.conversation-screen { width:100%;height:100%;display:flex;flex-direction:column;min-height:0; }
.waterfall-stream { flex:1;min-height:100px;overflow-y:auto;padding:14px 2px; }
.conversation-screen .chat-compose { flex-shrink:0; }
.conversation-screen > details { margin-top:8px;padding:8px; }
.conversation-screen > .secondary,.conversation-screen > .primary { margin-top:8px;flex-shrink:0; }

.drawer-brand{border:0;background:none;padding:0;color:inherit;font:inherit;font-weight:700;cursor:pointer;}

.menu-toggle[hidden],.subpage-header[hidden]{display:none!important;}
.phone>.subpage-header{position:absolute;z-index:10;top:0;left:0;right:0;min-height:72px;padding:calc(12px + env(safe-area-inset-top,0px)) 18px 12px;display:flex;align-items:center;gap:12px;box-sizing:border-box;background:rgba(239,247,253,.96);backdrop-filter:blur(12px);justify-content:flex-start;}
.subpage-header h1{margin:0;font-size:20px;font-weight:700;line-height:1.3;}.subpage-back{width:44px;height:44px;flex:0 0 44px;display:grid;place-items:center;border:0;border-radius:14px;color:var(--ink);background:transparent;cursor:pointer;}.subpage-back:focus-visible{outline:3px solid #7aaad8;outline-offset:2px;}
.subpage-layout .screen>.page-top,.subpage-layout .screen>.section-title{display:none;}
.phone.subpage-layout #appMain{padding-top:calc(92px + env(safe-area-inset-top,0px));}
.phone.subpage-layout #appMain.world-view{padding-top:calc(72px + env(safe-area-inset-top,0px));box-sizing:border-box;}
.phone.theme-dark>.subpage-header{background:rgba(23,35,51,.96);}
@media print{.subpage-header{display:none!important;}}
.phone>.subpage-header{height:calc(72px + env(safe-area-inset-top,0px));}

.phone.subpage-layout>.menu-toggle{display:none!important;}
.phone>.subpage-header{padding-left:20px;justify-content:flex-start;background:transparent;backdrop-filter:none;}
.subpage-header h1{font-size:21px;}.subpage-back{border:1px solid var(--line);background:rgba(255,255,255,.8);border-radius:15px;}
.phone:not(.subpage-layout)>.subpage-header{display:none!important;}
.phone:not(.subpage-layout) #appMain.scene-home{padding:0!important;}
.phone.subpage-layout:has(.world-view)>.subpage-header{display:flex;}
