/* 世界树仙途 · 旧版控制台外观层：Q 版美术 + 仙友传音外壳
 * 配套 social.css（Q 版原生样式）与 social.js 使用。 */
.wt-social-overlay, .wt-social-shell, .social-panel, .social-launch, .wt-hero-badge, .wt-social-toast {
  --ink: #193c3b;
  --muted: #70837a;
  --paper: #f4f1e7;
  --panel: rgba(255, 253, 246, .94);
  --line: rgba(54, 91, 76, .15);
  --jade: #397c69;
  --jade-dark: #1f514b;
  --gold: #c59c4d;
  --gold-soft: #f0d897;
  --danger: #b75d4c;
  --shadow: 0 18px 45px rgba(31, 76, 68, .22);
  --serif: "Noto Serif SC", "Songti SC", "SimSun", serif;
  --sans: "Noto Sans SC", "Microsoft YaHei", system-ui, sans-serif;
}

/* ---- 旧版页面美术接入（覆盖组件内联样式，故需 !important） ---- */
.cultivation-page {
  background-color: #eef2e6 !important;
  background-image: linear-gradient(180deg, rgba(240, 244, 232, .9), rgba(228, 236, 226, .94)), url('/worldtree/game-art/resource-scene-home.webp') !important;
  background-size: cover !important;
  background-position: center top !important;
  background-attachment: fixed !important;
}
.cultivation-head {
  background-image: linear-gradient(90deg, rgba(247, 245, 236, .95), rgba(247, 245, 236, .74)), url('/worldtree/game-art/resource-scene-paths.webp') !important;
  background-size: cover !important;
  background-position: center 44% !important;
  background-repeat: no-repeat !important;
}
.cultivation-logo {
  background: #f4f4f4 url('/worldtree-legacy/worldtree-logo.webp') center / contain no-repeat !important;
}
.cultivation-logo svg { opacity: 0; }
.cultivation-aside.wt-aside-art {
  background-image: linear-gradient(180deg, rgba(244, 241, 231, .75), rgba(244, 241, 231, 0) 260px);
  background-repeat: no-repeat;
}

/* ---- 头部英雄徽标 ---- */
.wt-hero-badge {
  display: flex; align-items: center; gap: 10px; flex: none;
  padding: 8px 13px 8px 9px; border: 1px solid rgba(215, 198, 128, .5); border-radius: 12px;
  background-image: linear-gradient(90deg, rgba(24, 63, 54, .94), rgba(24, 63, 54, .74)), url('/worldtree/game-art/resource-scene-home.webp');
  background-size: cover; background-position: center 38%;
  color: #f7f0d7; font-family: var(--sans);
}
.wt-hero-badge .social-avatar { width: 38px; height: 38px; border-color: rgba(215, 198, 128, .55); background: #2b574d; }
.wt-hero-badge strong { display: block; font-size: 13px; font-weight: 600; line-height: 1.3; }
.wt-hero-badge small { display: block; font-size: 10px; opacity: .82; margin-top: 2px; }

/* ---- 页内入口横幅 ---- */
.social-launch { font-family: var(--sans); }

/* ---- 悬浮按钮 ---- */
.wt-social-fab {
  position: fixed; right: 22px; bottom: 24px; z-index: 2147482000;
  display: flex; align-items: center; gap: 8px; padding: 10px 17px 10px 12px;
  border: 1px solid #b7b680; border-radius: 999px; background: #183f36; color: #fbf2ce;
  box-shadow: 0 14px 34px rgba(10, 40, 35, .38); cursor: pointer;
  font: 600 13px/1 var(--sans, "Noto Sans SC", sans-serif); letter-spacing: .5px;
}
.wt-social-fab img { width: 26px; height: 26px; object-fit: contain; }
.wt-social-fab:hover { border-color: #e0cd8a; }
/* 仅在旧版修仙控制台内显示悬浮入口；登录页等其它页面不显示 */
body:not(:has(.cultivation-page)) .wt-social-fab { display: none; }

/* ---- 弹层 ---- */
.wt-social-overlay {
  position: fixed; inset: 0; z-index: 2147483000; display: none;
  align-items: center; justify-content: center; padding: 24px;
  background: rgba(9, 32, 30, .55); backdrop-filter: blur(3px);
}
.wt-social-overlay.open { display: flex; }
.wt-social-overlay button:disabled { opacity: .55; cursor: not-allowed; }
.wt-social-overlay :focus-visible { outline: 2px solid #397c69; outline-offset: 3px; }
.wt-social-shell {
  position: relative; width: min(760px, 100%); max-height: min(90vh, 940px); overflow: auto;
  padding: 22px 24px 18px; border: 1px solid var(--line); border-radius: 16px;
  background: linear-gradient(180deg, #fbf9f0, var(--paper)); box-shadow: var(--shadow);
  font-family: var(--sans);
}
.wt-social-close {
  position: absolute; right: 12px; top: 12px; z-index: 2; width: 30px; height: 30px;
  border: 1px solid var(--line); border-radius: 50%; background: rgba(255, 255, 255, .8);
  color: var(--muted); font-size: 17px; line-height: 1; cursor: pointer;
}
.wt-social-close:hover { color: var(--ink); }
html.wt-social-lock, html.wt-social-lock body { overflow: hidden; }

/* ---- 面板内通用控件（补齐 Q 版全局类） ---- */
.social-panel .button {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 14px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel); color: var(--ink); font: inherit; font-size: 12px; cursor: pointer;
}
.social-panel .button.primary { border-color: var(--jade-dark); background: var(--jade-dark); color: #f6f1dc; }
.social-panel .button.secondary { background: #fff; color: var(--jade-dark); }
.social-panel .button.small { padding: 5px 10px; font-size: 11px; }
.social-panel .text-button { border: 0; background: none; color: var(--jade); font: inherit; font-size: 11px; cursor: pointer; padding: 4px 2px; }
.social-panel .help-text { font-size: 11px; color: var(--muted); }
.social-panel .legacy-error { font-size: 12px; margin: 10px 0; padding: 10px 12px; border: 1px solid #c98a7a; background: #b75d4c14; color: #a4432f; border-radius: 7px; }
.social-panel .resource-filters { display: flex; gap: 8px; margin-bottom: 8px; }
.social-panel .resource-filters input,
.social-panel .social-id-invite input {
  flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px;
  background: #fff; color: var(--ink); font: inherit; font-size: 12px;
}
.social-directory { margin-top: 16px; padding: 10px 14px 14px; border: 1px solid var(--line); border-radius: 10px; background: rgba(255, 255, 255, .62); }
.social-directory > summary { cursor: pointer; font-size: 13px; font-weight: 500; }
.social-id-invite { display: flex; gap: 8px; margin: 12px 0; }

/* ---- 轻提示 ---- */
.wt-social-toast {
  position: fixed; left: 50%; bottom: 36px; z-index: 2147483600;
  transform: translateX(-50%) translateY(14px); opacity: 0; pointer-events: none;
  padding: 11px 18px; border: 1px solid #d7c680; border-radius: 999px;
  background: #173e3a; color: #f6f1dc; font: 500 12px/1.4 var(--sans); transition: .25s ease;
}
.wt-social-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width: 760px) {
  .cultivation-page { padding-bottom: calc(86px + env(safe-area-inset-bottom)) !important; }
  .wt-social-overlay { padding: 0; align-items: stretch; }
  .wt-social-shell { width: 100%; max-height: 100vh; max-height: 100dvh; border-radius: 0; padding: 18px 14px calc(14px + env(safe-area-inset-bottom)); }
  .wt-social-fab { right: 14px; bottom: calc(16px + env(safe-area-inset-bottom)); padding: 9px 14px 9px 10px; }
  .wt-hero-badge { display: none; }
}
