:root {
  --primary: #4f46e5;
  --primary-d: #4338ca;
  --gold: #d4a017;
  --gold-d: #b8860b;
  --bg: #f4f6fb;
  --card: #ffffff;
  --text: #1f2330;
  --muted: #8a90a2;
  --line: #e8eaf2;
  --ok: #16a34a;
  --err: #dc2626;
  --shadow: 0 10px 30px rgba(36, 40, 80, 0.08);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: "PingFang SC", "Microsoft YaHei", "Segoe UI", system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  min-height: 100vh;
}

/* 顶部栏 */
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 28px;
  background: linear-gradient(120deg, #4f46e5 0%, #7c3aed 50%, #9333ea 100%);
  color: #fff;
  box-shadow: 0 4px 20px rgba(79, 70, 229, 0.25);
  position: sticky;
  top: 0;
  z-index: 50;
}
.brand { font-size: 20px; font-weight: 700; letter-spacing: 1px; }
.brand .logo { color: #fcd34d; margin-right: 6px; }
.userbadge { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.ub-name { font-weight: 600; }
.ub-role { background: rgba(255,255,255,0.2); padding: 2px 8px; border-radius: 999px; font-size: 12px; }
.ub-points { background: rgba(252, 211, 77, 0.95); color: #5b4500; padding: 3px 12px; border-radius: 999px; font-weight: 700; }

/* 导航 */
.nav {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 10px 28px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 56px;
  z-index: 40;
}
.nav-link {
  text-decoration: none;
  color: #555c70;
  padding: 8px 16px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.15s;
}
.nav-link:hover { background: #f0f1f8; color: var(--primary); }
.nav-link.active { background: var(--primary); color: #fff; box-shadow: 0 4px 12px rgba(79,70,229,0.3); }
/* 重点推荐入口：琥珀色高亮 + 呼吸光圈（导航项和快捷按钮通用） */
.nav-link.nav-hot, .btn.nav-hot { background: #f59e0b; color: #fff; box-shadow: 0 2px 8px rgba(245,158,11,0.35); }
.nav-link.nav-hot:hover, .btn.nav-hot:hover { background: #d97706; color: #fff; }
.nav-link.nav-hot.active, .btn.nav-hot.active { background: #d97706; color: #fff; }
@media (prefers-reduced-motion: no-preference) {
  .nav-link.nav-hot, .btn.nav-hot { animation: navpulse 1.8s ease-in-out infinite; }
}
@keyframes navpulse {
  0%, 100% { box-shadow: 0 2px 8px rgba(245,158,11,0.35); }
  50% { box-shadow: 0 2px 18px rgba(245,158,11,0.85); }
}

/* 容器 */
.container { max-width: 1080px; margin: 24px auto; padding: 0 20px 60px; }

/* 卡片 */
.card {
  background: var(--card);
  border-radius: 16px;
  padding: 22px;
  box-shadow: var(--shadow);
  margin-bottom: 20px;
}
.card h3 { font-size: 16px; margin-bottom: 12px; color: var(--text); }
.card.center { text-align: center; }

/* 统计卡 */
.grid { display: grid; gap: 16px; margin-bottom: 20px; }
.grid.cols { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.grid:not(.cols) { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.stat { text-align: center; padding: 20px; }
.stat-num { font-size: 28px; font-weight: 800; color: var(--primary); }
.stat-label { color: var(--muted); font-size: 14px; margin-top: 4px; }

/* 按钮 */
.btn {
  display: inline-block;
  border: none;
  border-radius: 10px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  color: #fff;
  transition: transform 0.1s, box-shadow 0.15s, opacity 0.15s;
  font-family: inherit;
}
.btn:hover { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn.primary { background: linear-gradient(120deg, var(--primary), var(--primary-d)); box-shadow: 0 6px 16px rgba(79,70,229,0.3); }
.btn.gold { background: linear-gradient(120deg, #eab308, var(--gold-d)); box-shadow: 0 6px 16px rgba(212,160,23,0.3); color: #4a3700; }
.btn.ghost { background: #eef0f8; color: var(--primary); }
.btn.big { padding: 14px 28px; font-size: 16px; width: 100%; }
.btn.tiny { padding: 5px 10px; font-size: 12px; border-radius: 8px; background: linear-gradient(120deg, var(--primary), var(--primary-d)); box-shadow: 0 3px 10px rgba(79,70,229,0.25); }
.btn.tiny.danger { background: #fee2e2; color: var(--err); box-shadow: none; }
.btn.tiny:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(79,70,229,0.35); }
.btn.tiny.danger:hover { background: #fecaca; }
.btn:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }

.quick { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }

/* 提示横幅 */
.banner {
  padding: 12px 18px;
  border-radius: 12px;
  margin-bottom: 18px;
  font-size: 14px;
  font-weight: 500;
}
.banner.info { background: #eef2ff; color: #3730a3; }
.banner.ok { background: #ecfdf5; color: #047857; }
.banner.error { background: #fef2f2; color: #b91c1c; }
.banner.pao { background: #fff7ed; color: #c2410c; border: 1px solid #fed7aa; font-weight: 700; }
/* 炸金花结果条：固定两行高度，没内容时也占位，页面不再上下跳动 */
.banner.jh-flash { min-height: 66px; display: flex; align-items: center; }
.banner.jh-flash.empty { visibility: hidden; }
.jh-info { min-height: 42px; }
/* 发牌（新一局）按钮：与「跟注开牌」等宽、同一排起点靠左 —— 具体规则见下方 .jh-newgame form */

/* 疯狂水管工 */
.pipe-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 10px 0; }
.pipe-grid { display: grid; gap: 4px; max-width: 520px; margin: 10px auto; }
.pipe-tile { position: relative; background: #eef0f8; border-radius: 8px; cursor: pointer; }
.pipe-tile::before { content: ''; display: block; padding-top: 100%; }
.pipe-tile svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.pipe-tile.src { outline: 3px solid #0ea5e9; }
.pipe-tile.dst { outline: 3px solid #f59e0b; }
.pipe-tile:active { transform: scale(.96); }
.pipe-tile .flow { animation: pipeflow .9s linear infinite; }
@keyframes pipeflow { to { stroke-dashoffset: -16; } }
@media (prefers-reduced-motion: reduce) { .pipe-tile .flow { animation: none; } }

/* 数独 */
.sd-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
  max-width: 540px;
  margin: 12px auto;
  background: #334155;
  border: 3px solid #334155;
  border-radius: 12px;
  overflow: hidden;
}
.sd-box { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: #b8c2d4; }
.sd-cell {
  background: #fff;
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(17px, 4.6vw, 26px);
  font-weight: 600;
  color: #1d4ed8;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  transition: background-color .08s;
}
.sd-cell.given { background: #f1f5f9; color: #0f172a; cursor: default; }
.sd-cell.rel { background: #eff6ff; }
.sd-cell.same { background: #e0f2fe; }
.sd-cell.sel { background: #bfdbfe; box-shadow: inset 0 0 0 2px #2563eb; }
.sd-cell.bad { color: #dc2626; background: #fef2f2; }
.sd-cell.bad.sel { background: #fecaca; }
.sd-pad {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 6px;
  max-width: 540px;
  margin: 12px auto 0;
}
.sd-key {
  padding: 10px 0;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  font-size: clamp(14px, 3.4vw, 19px);
  font-weight: 700;
  color: #1e293b;
  cursor: pointer;
  font-family: inherit;
}
.sd-key:hover { background: #eff6ff; border-color: #93c5fd; }
.sd-key:active { transform: scale(.94); }
.sd-key.done { opacity: .35; }
.sd-key.sd-erase { background: #f8fafc; color: #64748b; }
@media (max-width: 560px) {
  .sd-pad { gap: 4px; }
  .sd-key { padding: 9px 0; border-radius: 8px; }
}

/* 输入框 */
.input {
  width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 14px;
  font-family: inherit;
  background: #fbfbfe;
  transition: border 0.15s, box-shadow 0.15s;
}
.input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.input.small { width: auto; padding: 6px 10px; }

/* 表单行 */
.rowform { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.rowform .input { width: auto; flex: 1; min-width: 140px; }
.fld { display: flex; flex-direction: column; font-size: 13px; color: var(--muted); gap: 4px; }
.chk { display: flex; align-items: center; gap: 6px; font-size: 14px; color: #555c70; }

/* 登录/注册 */
.auth { display: flex; justify-content: center; padding-top: 40px; }
.auth-card { width: 100%; max-width: 380px; }
.auth-card h2 { text-align: center; margin-bottom: 20px; }
.auth-form { display: flex; flex-direction: column; gap: 14px; }
.auth-form .btn { margin-top: 6px; }

/* 商品卡 */
.product { display: flex; flex-direction: column; gap: 8px; }
.p-name { font-size: 17px; font-weight: 700; }
.p-desc { color: var(--muted); font-size: 13px; min-height: 20px; }
.p-meta { display: flex; justify-content: space-between; align-items: center; margin: 6px 0; }
.price { color: var(--gold-d); font-weight: 700; }
.stock { color: var(--muted); font-size: 13px; }

/* 签到日历 */
.calendar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.day { background: #eef2ff; border-radius: 12px; padding: 10px 14px; text-align: center; min-width: 64px; }
.d-date { font-size: 13px; color: var(--muted); }
.d-pt { font-weight: 700; color: var(--primary); }
.done { font-size: 18px; font-weight: 600; color: var(--ok); padding: 10px; }

/* 表格 */
.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th { text-align: left; padding: 10px 12px; color: var(--muted); font-weight: 600; border-bottom: 2px solid var(--line); }
.tbl td { padding: 10px 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.tbl tr:hover td { background: #fafbff; }
.actions { display: flex; flex-wrap: wrap; gap: 6px; }
.mini { display: inline-flex; gap: 4px; align-items: center; }

/* 文本修饰 */
.muted { color: var(--muted); font-size: 13px; }
.center { text-align: center; }
.plus { color: var(--ok); font-weight: 700; }
.minus { color: var(--err); font-weight: 700; }
.clean { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.clean li { padding: 8px 12px; background: #fafbff; border-radius: 10px; border: 1px solid var(--line); }

.footer { text-align: center; color: var(--muted); font-size: 13px; padding: 24px; }
.footer .icp { margin-top: 6px; font-size: 12px; }
.footer .icp a { color: var(--muted); text-decoration: none; }
.footer .icp a:hover { color: var(--primary); text-decoration: underline; }

/* 响应式 */
@media (max-width: 600px) {
  .topbar, .nav { padding-left: 14px; padding-right: 14px; }
  .userbadge { font-size: 12px; }
  .ub-role { display: none; }
  .tbl { font-size: 13px; }
  .tbl th, .tbl td { padding: 8px; }
}

/* 幸运转盘（方形网格） */
.luky-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  max-width: 420px;
  margin: 10px auto 4px;
}
.luky-cell {
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: 14px;
  background: #eef1fb;
  border: 2px solid #dbe0f0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
  transition: transform .15s, box-shadow .15s, background .15s, border-color .15s;
  user-select: none;
}
.luky-cell .luky-ico { font-size: 26px; line-height: 1; }
.luky-cell .luky-lbl { font-size: 12px; font-weight: 700; color: #5b6178; margin-top: 6px; }
.luky-cell.cursor {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.35);
  transform: scale(1.05);
}
.luky-cell.hit {
  background: linear-gradient(120deg, #fff7e6, #ffe9b0);
  border-color: #f59e0b;
  box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.35), 0 8px 20px rgba(245, 158, 11, 0.3);
  animation: luky-pop .5s ease;
}
@keyframes luky-pop {
  0%   { transform: scale(.9); }
  60%  { transform: scale(1.12); }
  100% { transform: scale(1); }
}
@media (max-width: 460px) {
  .luky-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .luky-cell .luky-ico { font-size: 22px; }
}
.spin-result {
  margin-top: 14px; padding: 12px 18px; border-radius: 12px;
  font-size: 16px; font-weight: 700; text-align: center;
}
.spin-result.ok { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; }
.spin-result.no { background: #fff7ed; color: #c2410c; border: 1px solid #fed7aa; }

/* ---------- 景天聊天室 ---------- */
.btn.chat { background: linear-gradient(120deg, #0d9488, #0f766e); color: #fff; box-shadow: 0 6px 16px rgba(13, 148, 136, 0.3); }
.btn.chat:hover { box-shadow: 0 8px 20px rgba(13, 148, 136, 0.4); }
.chat-card { display: flex; flex-direction: column; }
.chat-top { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.chat-top h3 { margin-bottom: 0; }
.chat-box {
  height: 56vh; min-height: 320px; overflow-y: auto; padding: 14px;
  background: #f8f9fe; border: 1px solid #e5e7f2; border-radius: 12px;
  display: flex; flex-direction: column; gap: 12px;
}
.chat-loading { margin: auto; color: #9ca3af; font-size: 14px; }
.chat-msg {
  position: relative; max-width: 78%; padding: 10px 14px; border-radius: 14px;
  background: #ffffff; border: 1px solid #e5e7f2; box-shadow: 0 1px 3px rgba(36, 40, 80, 0.06);
  align-self: flex-start; word-break: break-word;
}
.chat-msg.self { align-self: flex-end; background: #eef2ff; border-color: #dfe4ff; }
.chat-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; flex-wrap: wrap; }
.chat-name { font-weight: 700; font-size: 13px; color: var(--primary); }
.chat-msg.self .chat-name { color: #4338ca; }
.chat-tag {
  font-size: 11px; font-weight: 700; color: #fff; padding: 1px 7px; border-radius: 999px;
  background: linear-gradient(120deg, #f59e0b, #b45309);
}
.chat-time { font-size: 11px; color: #9ca3af; }
.chat-text { font-size: 14px; line-height: 1.6; white-space: pre-wrap; }
.chat-imglink { display: inline-block; margin-top: 4px; }
.chat-img {
  max-width: 240px; max-height: 200px; border-radius: 10px; display: block;
  border: 1px solid #e5e7f2; cursor: zoom-in; background: #fff;
}
.chat-del {
  display: none; position: absolute; top: -8px; right: -8px; width: 22px; height: 22px;
  border: none; border-radius: 50%; background: #ef4444; color: #fff; font-size: 11px;
  cursor: pointer; line-height: 1; box-shadow: 0 2px 6px rgba(239, 68, 68, 0.4);
}
.chat-msg:hover .chat-del { display: block; }
.chat-preview { display: none; align-items: center; gap: 8px; margin-top: 10px; }
.chat-preview img {
  height: 52px; width: auto; border-radius: 8px; border: 1px solid #e5e7f2;
}
.chat-prev-x {
  cursor: pointer; color: #6b7280; font-size: 14px; padding: 4px 8px;
  border-radius: 8px; background: #eef0f8;
}
.chat-prev-x:hover { background: #e0e3f0; color: var(--err, #dc2626); }
.chat-inputrow { display: flex; gap: 8px; margin-top: 12px; align-items: flex-end; }
.chat-imgbtn { padding: 10px 14px; font-size: 18px; line-height: 1; }
.chat-input {
  flex: 1; resize: none; padding: 11px 14px; border-radius: 12px;
  border: 1.5px solid #e5e7f2; font-size: 14px; font-family: inherit; max-height: 120px;
}
.chat-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12); }
.chat-send { padding: 11px 26px; }

/* ---------- 景天论坛 ---------- */
.btn.site { background: linear-gradient(120deg, #ef4444, #991b1b); color: #fff; box-shadow: 0 6px 16px rgba(239, 68, 68, 0.35); }
.btn.site:hover { box-shadow: 0 8px 20px rgba(239, 68, 68, 0.45); }
.forum-tag.admin { background: linear-gradient(120deg, #3b82f6, #1d4ed8); }
.btn.forum { background: linear-gradient(120deg, #f59e0b, #b45309); color: #fff; box-shadow: 0 6px 16px rgba(245, 158, 11, 0.3); }
.btn.forum:hover { box-shadow: 0 8px 20px rgba(245, 158, 11, 0.4); }
.forum-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.forum-head h3 { margin-bottom: 0; font-size: 20px; }
.btn-forum-new { margin-left: auto; padding: 9px 18px; font-size: 14px; }
.forum-list { display: flex; flex-direction: column; gap: 10px; }
.forum-item {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  border: 1px solid #e5e7f2; border-radius: 12px; background: #fbfcff;
}
.forum-item:hover { background: #f4f6ff; border-color: #dfe4ff; }
.forum-thumb {
  width: 56px; height: 56px; object-fit: cover; border-radius: 10px;
  border: 1px solid #e5e7f2; flex: 0 0 auto;
}
.forum-main { flex: 1; min-width: 0; }
.forum-title {
  display: block; font-weight: 700; font-size: 15px; color: var(--text);
  text-decoration: none; margin-bottom: 5px; word-break: break-word;
}
.forum-title:hover { color: var(--primary); }
.forum-tag {
  display: inline-block; margin-left: 6px; font-size: 11px; font-weight: 700;
  color: #fff; background: linear-gradient(120deg, #f59e0b, #b45309);
  padding: 1px 7px; border-radius: 999px; vertical-align: middle;
}
.forum-meta { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: #9ca3af; }
.forum-tools { display: flex; gap: 6px; flex: 0 0 auto; }
.forum-pager { display: flex; gap: 10px; justify-content: center; margin-top: 14px; }
.forum-post .forum-body {
  margin-top: 12px; font-size: 14px; line-height: 1.8; white-space: pre-wrap; word-break: break-word;
}
.forum-post h3 { font-size: 19px; margin-bottom: 8px; }
.forum-img { margin-top: 12px; }
.forum-img img { max-width: 100%; max-height: 420px; border-radius: 12px; border: 1px solid #e5e7f2; cursor: zoom-in; }
.forum-form { display: flex; flex-direction: column; gap: 10px; }
.flabel { font-size: 13px; font-weight: 700; color: #4b5563; }
.forum-textarea { resize: vertical; padding: 11px 14px; border-radius: 12px; line-height: 1.7; font-family: inherit; }
.forum-form .btn { align-self: flex-start; padding: 11px 26px; }
.cmt-list { display: flex; flex-direction: column; gap: 10px; }
.forum-cmt {
  padding: 10px 14px; border-radius: 12px; background: #f8f9fe;
  border: 1px solid #e5e7f2; position: relative;
}
.forum-cmt.mine { background: #eef2ff; border-color: #dfe4ff; }
.cmt-head { display: flex; align-items: center; gap: 10px; font-size: 13px; margin-bottom: 4px; }
.cmt-head b { color: var(--primary); }
.cmt-body { font-size: 14px; line-height: 1.7; white-space: pre-wrap; word-break: break-word; }
.cmt-del { margin-left: auto; }
.forum-back { margin-top: 16px; }

/* 炸金花 */
.jh-row { display: flex; align-items: center; gap: 14px; margin: 10px 0; flex-wrap: wrap; }
.jh-label { font-size: 14px; color: #8a90a2; min-width: 56px; }
.jh-big .jh-card { width: clamp(56px, 18vw, 88px); height: clamp(80px, 25vw, 122px); font-size: clamp(22px, 7vw, 34px); border-radius: 12px; }
.jh-card {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  width: clamp(46px, 15vw, 72px); height: clamp(66px, 21vw, 100px); border-radius: 10px; background: #fff;
  border: 1px solid #d8dced; box-shadow: 0 2px 6px rgba(15,23,42,.10);
  color: #1f2937; font-weight: 800; font-size: clamp(18px, 5.5vw, 28px); line-height: 1.1;
}
.jh-card i { font-style: normal; font-size: 0.78em; margin-top: 0.1em; }
.jh-card.red { color: #dc2626; }
.jh-card.back {
  background: repeating-linear-gradient(45deg, #6366f1, #6366f1 6px, #4f46e5 6px, #4f46e5 12px);
  color: #fff; font-size: 1.25em;
}
.jh-type {
  padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
  background: #eef2ff; color: var(--primary);
}
.jh-type.off { background: #f1f2f6; color: #8a90a2; }
.jh-note { display: inline-block; min-height: 20px; font-size: 12px; vertical-align: middle; }
.jh-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.jh-actions form { margin: 0; flex: 1 1 0; min-width: 76px; }
.jh-actions .btn { width: 100%; padding: 9px 6px; font-size: 13px; text-align: center; }
/* 只有「发牌」一个按钮时，不让 flex:1 1 0 把它拉成整条：
   固定成两个按钮格宽（76*2+8=160px）更好按，靠左起始，与「跟注开牌」同一排起点 */
.jh-newgame form { flex: 0 1 160px; }
.jh-tag {
  padding: 2px 9px; border-radius: 999px; font-size: 12px; font-weight: 700;
  background: #fee2e2; color: #b91c1c; vertical-align: middle;
}
.jh-tag.dark { background: #e0e7ff; color: #4338ca; }
.jh-rules summary { cursor: pointer; font-weight: 700; user-select: none; }
.jh-rules[open] summary { margin-bottom: 10px; }

/* 后台表单网格（积分⇄激活码等设置页） */
.form-grid { display: flex; flex-direction: column; gap: 14px; }
.frow { display: flex; flex-direction: column; gap: 6px; }
.frow .input { width: 100%; }
.fhint { font-size: 12px; color: #8a90a2; }
.fcheck { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #4b5563; cursor: pointer; }
.fcheck input { width: 16px; height: 16px; }
.btn.danger { background: linear-gradient(120deg, #ef4444, #b91c1c); box-shadow: 0 6px 16px rgba(239,68,68,.28); }
.tag {
  display: inline-block; padding: 1px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700; margin-left: 6px; vertical-align: middle;
}
.tag.admin { background: linear-gradient(120deg, #3b82f6, #1d4ed8); color: #fff; }

/* 扫码登录 */
.scan-entry { margin-top: 14px; text-align: center; }
.btn.ghost { display: inline-block; background: #fff; border: 1px solid #dfe4ff; color: var(--primary); }
.btn.ghost:hover { background: #f4f6ff; }
.scan-area { margin-top: 14px; padding-top: 14px; border-top: 1px dashed #e5e7f2; }
.qrbox { display: flex; justify-content: center; padding: 10px; background: #fff; border: 1px solid #e5e7f2; border-radius: 12px; width: 200px; margin: 0 auto; }
#qrcode img, #qrcode canvas { display: block; }
.scan-area p { margin: 8px 0 0; }

/* 导航未读红点 */
.nav-link { position: relative; }
.nav-badge {
  display: none; min-width: 16px; height: 16px; padding: 0 4px;
  margin-left: 4px; border-radius: 8px; background: #ef4444; color: #fff;
  font-size: 11px; font-weight: 700; line-height: 16px;
  text-align: center; vertical-align: top;
}

/* 注册欢迎弹窗 */
.modal-mask {
  position: fixed; inset: 0; background: rgba(15,23,42,.55);
  display: flex; align-items: center; justify-content: center; z-index: 999;
}
.modal {
  background: #fff; border-radius: 16px; padding: 34px 30px 28px;
  max-width: 360px; width: 88%; text-align: center;
  box-shadow: 0 18px 50px rgba(15,23,42,.28);
}
.modal-emoji { font-size: 46px; margin-bottom: 6px; }
.modal h2 { color: #1f2937; margin: 0 0 10px; font-size: 20px; }
.modal p { color: #6b7280; font-size: 14px; line-height: 1.7; margin: 0 0 20px; }

/* ===== 头像 ===== */
.avatar {
  display: inline-flex; align-items: center; justify-content: center;
  flex: 0 0 auto; overflow: hidden; vertical-align: middle;
  border-radius: 50%; background: var(--primary); color: #fff;
  font-weight: 700; line-height: 1; user-select: none;
}
.avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.avatar.av-fb { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.avatar.av-xs { width: 20px; height: 20px; font-size: 11px; }
.avatar.av-s  { width: 30px; height: 30px; font-size: 14px; }
.avatar.av-m  { width: 44px; height: 44px; font-size: 18px; }
.avatar.av-xl { width: 84px; height: 84px; font-size: 34px; }

/* ===== 个人中心 ===== */
.grid2 { display: grid; grid-template-columns: 260px 1fr; gap: 16px; margin-bottom: 18px; }
@media (max-width: 720px) { .grid2 { grid-template-columns: 1fr; } }
.prof-ava { text-align: center; }
.ava-row { display: flex; align-items: center; gap: 14px; justify-content: center; margin-bottom: 14px; }
.ava-form { display: flex; flex-direction: column; gap: 8px; align-items: center; }
.ava-form input[type=file] { font-size: 13px; width: 100%; }
.ava-file {
  display: inline-block; border: 1px dashed #c9cfee; border-radius: 10px;
  padding: 8px 12px; font-size: 13px; color: var(--primary);
  background: #f7f8ff; cursor: pointer; width: 100%; box-sizing: border-box; text-align: center;
}
.ava-file:hover { background: #eef1ff; }
.ava-form input[type=file] {
  display: block; width: 100%; box-sizing: border-box; font-size: 13px;
  padding: 8px 10px; border: 1px dashed #c9cfee; border-radius: 10px;
  background: #f7f8ff; color: #4b5563; cursor: pointer;
}
.ava-form input[type=file]::file-selector-button {
  border: 0; background: var(--primary); color: #fff;
  padding: 5px 12px; border-radius: 8px; margin-right: 10px; cursor: pointer;
  font-size: 13px;
}
.ava-preview { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 12px; color: #6b7280; }
.ava-preview img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; }
.hint { font-size: 12px; color: #9aa1b1; margin: 6px 0 0; }

/* ===== 游戏大厅 / 棋盘 ===== */
.game-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.game-head h3 { margin: 0; }
.game-tip { background: #fff8e6; border: 1px solid #f3e0b0; border-radius: 10px; padding: 8px 12px; font-size: 13px; margin: 0 0 14px; }
.game-card h3 { margin-top: 0; }
.game-card .muted { font-size: 13px; line-height: 1.6; }
.game-start { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.game-start select.input { width: 100%; }
.game-board-card { text-align: center; }
.gstatus { font-size: 15px; font-weight: 600; padding: 8px 0 12px; min-height: 24px; }
.gstatus .win { color: #16a34a; }
.gstatus .lose { color: #6b7280; }
.gcanvas {
  max-width: 100%; height: auto; display: block; margin: 0 auto;
  border-radius: 10px; box-shadow: 0 4px 16px rgba(15,23,42,.15);
  touch-action: manipulation; cursor: pointer;
}
.game-ctrl { margin-top: 14px; display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }

/* ===== 等级徽章 / 进度条 ===== */
.ub-level {
  background: rgba(255,255,255,0.2); padding: 3px 10px;
  border-radius: 999px; font-size: 12px; font-weight: 700;
}
.level-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 2px 10px; border-radius: 999px; font-size: 12px;
  font-weight: 700; color: #fff; background: var(--lv, #8a90a2);
  white-space: nowrap;
}
.lv-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.lv-cur { font-size: 18px; font-weight: 800; }
.lv-bar {
  height: 12px; border-radius: 999px; background: #eef0f8;
  overflow: hidden; margin: 12px 0 8px;
}
.lv-fill { height: 100%; border-radius: 999px; transition: width 0.4s ease; }
.lv-hint { margin-bottom: 4px; }
.lv-list { display: flex; flex-direction: column; gap: 8px; }
.lv-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px; border-radius: 12px;
  background: #fafbff; border: 1px solid var(--line);
}
.lv-item.cur { border-color: var(--primary); background: #eef2ff; }
.lv-no {
  width: 28px; height: 28px; border-radius: 50%; flex: none;
  background: #e8eaf2; color: #555c70;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 13px;
}
.lv-item.cur .lv-no { background: var(--primary); color: #fff; }
.lv-name { font-weight: 700; }
.lv-tag {
  font-size: 11px; font-weight: 700; color: var(--primary);
  background: #fff; border: 1px solid var(--primary);
  padding: 1px 8px; border-radius: 999px;
}
.lv-pts { margin-left: auto; color: var(--muted); font-size: 13px; }

/* ===== 积分排行榜 ===== */
.lb-me { border: 1px solid #fde68a; background: linear-gradient(120deg, #fffdf5, #fef9ec); }
.lb-me-info { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.lb-me-rank { font-size: 22px; font-weight: 800; }
.lb-me-points { margin-left: auto; font-size: 20px; font-weight: 800; color: var(--gold-d); }
.lb-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.lb-row {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 16px; border-radius: 14px;
  background: var(--card); border: 1px solid var(--line);
  box-shadow: var(--shadow);
}
.lb-row.top { background: linear-gradient(120deg, #fff7ed, #fefce8); border-color: #fde68a; }
.lb-row.me { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
.lb-rank { width: 40px; text-align: center; font-weight: 800; font-size: 17px; color: var(--muted); flex: none; }
.lb-row.top .lb-rank { font-size: 24px; }
.lb-user { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; }
.lb-name { font-weight: 600; }
.lb-streak { flex: none; }
.lb-points { font-weight: 800; color: var(--gold-d); flex: none; }

/* ===== 红包中心 ===== */
.btn.rp { background: linear-gradient(120deg, #ef4444, #b91c1c); box-shadow: 0 6px 16px rgba(220,38,38,0.3); }
.rp-wrap { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.rp-card {
  position: relative; overflow: hidden;
  border-radius: 16px; padding: 20px 18px 16px; color: #fff;
  background: linear-gradient(150deg, #ef4444 0%, #b91c1c 100%);
  box-shadow: 0 10px 24px rgba(220, 38, 38, 0.25);
  display: flex; flex-direction: column; gap: 6px;
}
.rp-card.done { background: linear-gradient(150deg, #f8b4b4 0%, #ef8080 100%); box-shadow: none; }
.rp-tag {
  position: absolute; top: 12px; right: 12px;
  background: rgba(255,255,255,0.25); color: #fff;
  padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
}
.rp-kind { font-size: 12px; font-weight: 700; opacity: 0.9; letter-spacing: 1px; }
.rp-title { font-size: 18px; font-weight: 800; }
.rp-bless { font-size: 13px; opacity: 0.92; min-height: 20px; }
.rp-meta { font-size: 12px; opacity: 0.85; margin-top: 2px; }
.rp-btn {
  margin-top: 8px; width: 100%; border: none; cursor: pointer;
  background: #fff; color: #b91c1c; border-radius: 10px;
  padding: 10px 0; font-weight: 800; font-size: 15px; font-family: inherit;
  transition: transform 0.1s;
}
.rp-btn:hover:not(:disabled) { transform: translateY(-1px); }
.rp-btn:disabled { background: rgba(255,255,255,0.35); color: #fff; cursor: not-allowed; }

/* ===== 聊天/论坛内联等级徽章 ===== */
.lv-inline { font-size: 11px; padding: 1px 8px; vertical-align: middle; }
.chat-head .lv-inline { margin: 0 2px; }
.forum-meta .level-badge, .cmt-head .level-badge { flex: none; }
.cmt-head { flex-wrap: wrap; }

/* ===== 表情面板 ===== */
.emoji-panel {
  display: none;
  grid-template-columns: repeat(12, 1fr);
  gap: 4px;
  margin-top: 8px;
  padding: 10px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  max-width: 420px;
}
.emoji-item {
  border: none; background: transparent; cursor: pointer;
  font-size: 20px; line-height: 1; padding: 4px; border-radius: 8px;
  transition: background 0.1s, transform 0.1s;
}
.emoji-item:hover { background: #eef2ff; transform: scale(1.15); }
@media (max-width: 520px) {
  .emoji-panel { grid-template-columns: repeat(8, 1fr); }
}

/* ===== 导航红包徽标（红色款） ===== */
.nav-badge.rp { background: #ef4444; box-shadow: 0 2px 8px rgba(220,38,38,0.4); }

/* ===== 激活码套餐卡片 ===== */
.pkg-wrap { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 20px; }
.pkg-card { text-align: center; padding: 20px 16px; }
.pkg-pts { font-size: 26px; font-weight: 800; color: var(--gold-d); }
.pkg-name { color: var(--muted); font-size: 13px; margin: 4px 0 8px; }
.pkg-stock { font-size: 14px; margin-bottom: 10px; }
.pkg-buy { width: 100%; }
.pkg-out { opacity: 0.6; }
.pkg-gen { margin-top: 10px; justify-content: center; }
.pkg-links { display: flex; gap: 6px; justify-content: center; margin-top: 10px; flex-wrap: wrap; }
.pkg-buytip { text-align: center; }
.pkg-buytip a { color: var(--primary); font-weight: 700; }

/* ========== 手机版全面自适应 ========== */
@media (max-width: 768px) {
  /* 顶栏压缩 */
  .topbar { padding: 10px 12px; }
  .brand { font-size: 17px; letter-spacing: 0; }
  .brand .logo { margin-right: 4px; }
  .userbadge { gap: 6px; font-size: 12px; }
  .ub-role, .ub-level { display: none; }
  .ub-points { padding: 2px 8px; font-size: 12px; }

  /* 导航改为横向滚动，避免十几项换行堆满屏幕 */
  .nav {
    flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none; padding: 8px 12px; gap: 6px;
  }
  .nav::-webkit-scrollbar { display: none; }
  .nav-link { flex: none; white-space: nowrap; padding: 8px 12px; font-size: 13px; }
  .nav-badge { margin-left: 3px; }

  /* 容器与卡片 */
  .container { padding: 0 12px 40px; margin: 14px auto; }
  .card { padding: 16px 14px; border-radius: 14px; margin-bottom: 14px; }
  .card h3 { font-size: 15px; }

  /* 统计卡：两列 */
  .grid:not(.cols) { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .grid.cols { grid-template-columns: repeat(2, 1fr); }
  .stat { padding: 14px 8px; }
  .stat-num { font-size: 21px; }
  .stat-label { font-size: 12px; }

  /* 表格：卡片内横向滚动；仅 4 列及以上的宽表才撑开，两列表格保持自适应 */
  .card { overflow-x: auto; }
  .tbl { min-width: 520px; font-size: 13px; }
  .tbl:not(:has(th:nth-child(4))) { min-width: 0; }
  .tbl th, .tbl td { padding: 8px 10px; }
  .actions { gap: 4px; }
  .actions .mini { flex-wrap: wrap; }

  /* 按钮触摸友好 */
  .btn { padding: 11px 16px; font-size: 14px; }
  .btn.tiny { padding: 7px 10px; font-size: 12px; }
  .btn.big { padding: 13px 18px; font-size: 15px; }
  .quick .btn { flex: 1 1 44%; text-align: center; }

  /* 表单纵向堆叠 */
  .rowform { flex-direction: column; align-items: stretch; gap: 10px; }
  .rowform .input { width: 100% !important; flex: none !important; min-width: 0; }
  .rowform .btn, .rowform select.input { width: 100%; }
  .input { font-size: 15px; padding: 11px 12px; }

  /* 排行榜 */
  .lb-row { padding: 10px 12px; gap: 10px; }
  .lb-rank { width: 30px; font-size: 15px; }
  .lb-row.top .lb-rank { font-size: 20px; }
  .lb-streak { display: none; }
  .lb-points { font-size: 14px; }
  .lb-name { font-size: 14px; }
  .lb-me-info { gap: 10px; }
  .lb-me-rank { font-size: 18px; }
  .lb-me-points { font-size: 16px; }

  /* 红包 */
  .rp-wrap { grid-template-columns: 1fr; }
  .rp-card { padding: 16px 14px; }
  .rp-title { font-size: 16px; }

  /* 套餐 */
  .pkg-wrap { grid-template-columns: 1fr; }

  /* 聊天室：输入区固定高度，字号 >=16px 防 iOS 自动缩放 */
  .chat-input { font-size: 16px; }
  .chat-box { height: 50vh; min-height: 260px; }
  .chat-inputrow { gap: 6px; }
  .chat-imgbtn { padding: 10px 12px; }
  .chat-send { padding: 10px 14px; }
  .chat-img { max-width: 100%; max-height: 200px; }
  .chat-del { top: 4px; right: 4px; }   /* 卡片可横滚，删除按钮不再外溢被裁 */
  .emoji-panel { grid-template-columns: repeat(8, 1fr); max-width: none; }

  /* 论坛 */
  .forum-meta { flex-wrap: wrap; gap: 8px; font-size: 12px; }
  .forum-item { gap: 10px; }
  .forum-thumb { width: 72px; height: 72px; }
  .forum-title { font-size: 15px; }
  .cmt-head { gap: 6px; font-size: 13px; }

  /* 个人中心 */
  .grid2 { grid-template-columns: 1fr; }
  .lv-item { padding: 8px 12px; font-size: 13px; }
  .lv-name { font-size: 13px; }
}

@media (max-width: 420px) {
  .brand { font-size: 15px; }
  .ub-name { max-width: 72px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .container { padding: 0 10px 30px; }
  .card { padding: 14px 12px; }
  .grid:not(.cols) { grid-template-columns: 1fr 1fr; gap: 8px; }
  .stat-num { font-size: 19px; }
  .luky-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .quick .btn { flex: 1 1 100%; }
  .emoji-panel { grid-template-columns: repeat(6, 1fr); }
  .forum-thumb { width: 60px; height: 60px; }

/* 江湖排名 */
.rank-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:4px}
.rank-grid .card{margin-bottom:0}
.rank-grid td.rk{width:46px;font-weight:700;color:#3557e8}
}

/* ============ 社交：关注 / 私信 ============ */
.inline-form{display:inline-block;margin:0}
.forum-social{display:flex;gap:8px;align-items:center;margin:10px 0 4px;flex-wrap:wrap}
.dm-thread{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line,#e5e9f2);border-radius:10px;margin-bottom:8px;text-decoration:none;color:inherit;background:#fff}
.dm-thread:hover{background:#f7f9ff}
.dm-name{font-weight:700;min-width:110px;position:relative}
.dm-last{flex:1;color:var(--muted,#6b7385);font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dm-ts{font-size:12px;color:var(--muted,#6b7385);white-space:nowrap}
.dm-badge{background:#e0484d;color:#fff}
.dm-chat-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.dm-msgs{max-height:420px;overflow:auto;padding:6px 2px;border-top:1px dashed var(--line,#e5e9f2);border-bottom:1px dashed var(--line,#e5e9f2)}
.dm-msg{display:flex;flex-direction:column;align-items:flex-start;margin:10px 0}
.dm-msg.mine{align-items:flex-end}
.dm-bubble{max-width:75%;padding:9px 13px;border-radius:14px;background:#f1f3f9;font-size:14.5px;word-break:break-all;white-space:pre-wrap}
.dm-msg.mine .dm-bubble{background:var(--brand,#3557e8);color:#fff}
.dm-time{font-size:11px;color:var(--muted,#6b7385);margin-top:3px}
.dm-sendform{display:flex;gap:8px;margin-top:12px;align-items:flex-end}
.dm-sendform textarea{flex:1}

/* ============ 抖音视频挂件 ============ */
.dy-card .dy-btns{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.dy-btn{font-weight:600}
.dy-btn.active{background:var(--brand,#3557e8);color:#fff}
.dy-stage{max-width:420px;margin:0 auto}
.dy-embed{display:none}
.dy-embed.dy-on{display:block}
.dy-embed iframe,.dy-embed video{width:100%;height:560px;border:0;border-radius:12px;background:#000;display:block}
.dy-next{margin-left:auto}

/* 全站悬浮视频挂件（右下角，位于音乐 🎵 按钮上方） */
.dy-float{position:fixed;right:16px;bottom:74px;z-index:91}
.dy-fab{display:block;width:46px;height:46px;border-radius:50%;border:0;background:#e64545;
  color:#fff;font-size:20px;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.3);
  animation:dybob 1.8s ease-in-out infinite;z-index:92}
@keyframes dybob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.dy-panel{position:fixed;right:16px;bottom:74px;width:min(400px,calc(100vw - 32px));max-height:80vh;
  background:rgba(26,31,46,.96);color:#fff;border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.35);
  padding:10px 12px;display:none;backdrop-filter:blur(6px)}
.dy-panel.dy-open{display:block}
.dy-panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:14.5px}
.dy-panel-body .dy-stage{max-width:none}
.dy-panel-body .dy-embed iframe,.dy-panel-body .dy-embed video{height:520px}
.dy-panel-body .dy-btns{flex-wrap:wrap}

/* ============ 悬浮音乐播放器 ============ */
.mp-wrap{position:fixed;right:16px;bottom:16px;z-index:90;font-family:inherit}
.mp-bar{display:flex;align-items:center;gap:6px;background:rgba(26,31,46,.92);color:#fff;
  padding:8px 10px;border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.25);backdrop-filter:blur(6px)}
.mp-btn{border:0;background:transparent;color:#fff;font-size:15px;cursor:pointer;padding:4px 6px;border-radius:8px}
.mp-btn:hover{background:rgba(255,255,255,.15)}
.mp-play{font-size:18px}
.mp-info{width:170px}
.mp-title{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-prog{height:4px;background:rgba(255,255,255,.25);border-radius:99px;margin:5px 0 3px;cursor:pointer}
.mp-prog-in{height:100%;width:0;background:#4d7cff;border-radius:99px}
.mp-time{font-size:10.5px;opacity:.75}
.mp-vol{width:64px;accent-color:#4d7cff}
.mp-list{background:rgba(26,31,46,.94);color:#fff;border-radius:12px;margin-top:6px;padding:8px;max-height:220px;overflow:auto;display:none}
.mp-item{padding:6px 10px;border-radius:8px;font-size:13px;cursor:pointer}
.mp-item:hover{background:rgba(255,255,255,.12)}
.mp-item.on{color:#7da2ff;font-weight:700}
.mp-fab{display:none;width:46px;height:46px;border-radius:50%;border:0;background:rgba(26,31,46,.92);
  color:#fff;font-size:20px;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.25)}

/* ============ 多人房间（炸金花 / 斗牛） ============ */
.room-list{display:flex;flex-direction:column;gap:8px}
.room-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #e5e9f2;border-radius:10px;background:#fff;flex-wrap:wrap}
.room-row .muted{flex:1}
.room-players{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:12px 0}
.room-p{border:1px solid #e5e9f2;border-radius:12px;padding:10px 12px;background:#fafbfe;display:flex;flex-direction:column;gap:4px}
.room-p.me{border-color:#3557e8;background:#eef2ff}
.room-p.turn{border-color:#12a150;box-shadow:0 0 0 3px rgba(18,161,80,.12)}
.room-p.folded{opacity:.5}
.room-cards{font-size:18px;letter-spacing:2px;font-weight:700}
.room-cards.big{font-size:30px;letter-spacing:6px;text-align:center;padding:8px 0}
.room-ops{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}

/* ============ 开心农场 ============ */
.farm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-top:10px}
.farm-plot{border:1px solid #e5e9f2;border-radius:14px;background:#fff;padding:14px 12px;text-align:center;display:flex;flex-direction:column;gap:6px;min-height:150px;justify-content:space-between;position:relative;overflow:hidden}
.farm-plot.empty{background:#f3f6fc;border-style:dashed}
.farm-plot.ripe{border-color:#12a150;background:#eefaf1;box-shadow:0 0 0 3px rgba(18,161,80,.10)}
.farm-plot.wither{background:#f5f1ea;border-color:#d8c7a8;opacity:.85}
.farm-plot.grow{background:#fbfdff}
.fp-emoji{font-size:42px;line-height:1}
.fp-name{font-weight:700;font-size:14px;color:#23314f}
.fp-stage{font-size:12px;color:#6b7689;min-height:16px}
.fp-bar{height:8px;background:#eef1f7;border-radius:99px;overflow:hidden}
.fp-bar span{display:block;height:100%;background:linear-gradient(90deg,#5aa9ff,#12a150);border-radius:99px}
.fp-form{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.fp-form .input{font-size:12px;padding:5px 6px}
.farm-plot .btn.tiny{width:100%;justify-content:center}
.dog-card{border-color:#e8c46a;background:#fffaf0}
.steal-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-top:8px}
.steal-item{border:1px solid #e5e9f2;border-radius:12px;background:#fff;padding:10px 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.si-crop{font-weight:700;font-size:14px}
.si-owner{font-size:12px;color:#6b7689;flex:1;min-width:70px}
.si-form{margin-left:auto}

/* 农场增强：横幅 / 等级 / 图片 / 图鉴 / 虫灾 */
.farm-banner{position:relative;border-radius:16px;overflow:hidden;margin-bottom:12px;min-height:120px;background:#dff0d8}
.farm-banner img{display:block;width:100%;height:auto}
.farm-banner-txt{position:absolute;left:20px;top:50%;transform:translateY(-50%);color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.4)}
.farm-banner-txt h3{margin:0 0 2px;font-size:26px}
.farm-banner-txt .muted{color:rgba(255,255,255,.92)}
.farm-info{padding:14px 16px}
.farm-info .fi-row{display:flex;justify-content:space-between;align-items:center;font-size:14px;margin:5px 0}
.farm-info .fi-row span{color:#6b7689}
.farm-info .fi-row b{color:#23314f}
.fp-crop{display:flex;align-items:center;justify-content:center;min-height:96px;background:linear-gradient(180deg,#f3e2c7,#e7d3ad);border-radius:12px;margin-bottom:4px;overflow:hidden}
.fp-img{width:90px;height:90px;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(0,0,0,.18))}
.fp-sprout{font-size:48px}
.fp-pest{font-size:12px;color:#b3541e;background:#fde9d6;border:1px solid #f3c79c;border-radius:8px;padding:3px 6px;display:inline-block}
.fp-lock{font-size:11px;margin-top:4px}
.farm-plot{min-height:232px;gap:7px}
.codex{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px;margin-top:10px}
.codex-item{border:1px solid #e5e9f2;border-radius:12px;background:#fff;padding:10px;text-align:center}
.codex-item img{width:62px;height:62px;object-fit:contain}
.codex-item .cx-name{font-weight:700;font-size:13px;margin-top:4px;color:#23314f}
.codex-item .cx-meta{font-size:11px;color:#6b7689;line-height:1.5}
.codex-item.t-common{border-color:#bfe3c6;background:#f3fbf4}
.codex-item.t-rare{border-color:#7aa7ff;background:#f3f7ff}
.codex-item.t-legend{border-color:#c08bff;background:#f8f1ff}

/* ============================================================
   开心农场 v2 —— 动画农场场景（纯 CSS/SVG，无插件依赖）
   2026-10-27 重做：三维视角地块、作物生长动画、天气层、收获特效
   ============================================================ */
:root{
  --fm-sky1:#8fd4ff; --fm-sky2:#c6ecff; --fm-grass:#7ec850;
  --fm-soil1:#a9793f; --fm-soil2:#7d5527; --fm-soil3:#5c3d1a;
}

/* ---- 场景外壳 ---- */
.farm-scene{
  position:relative;border-radius:20px;overflow:hidden;margin-bottom:18px;
  background:linear-gradient(180deg,#5eb8ff 0%,var(--fm-sky1) 38%,var(--fm-sky2) 62%,#b9e88a 63%,var(--fm-grass) 100%);
  box-shadow:0 14px 34px rgba(30,60,90,.16);
  isolation:isolate;
}

/* 太阳 + 光环 */
.fm-sun{position:absolute;top:22px;right:46px;width:66px;height:66px;border-radius:50%;
  background:radial-gradient(circle at 36% 34%,#fffbe8,#ffe066 55%,#ffb703);
  box-shadow:0 0 26px 10px rgba(255,214,64,.55);animation:fm-sun 7s ease-in-out infinite;z-index:1}
.fm-sun::after{content:"";position:absolute;inset:-22px;border-radius:50%;
  background:conic-gradient(from 0deg,rgba(255,224,102,.55) 0 6deg,transparent 6deg 45deg);
  animation:fm-spin 40s linear infinite}
@keyframes fm-sun{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes fm-spin{to{transform:rotate(360deg)}}

/* 云 / 雨 / 雪 / 沙尘 */
.fm-cloud{position:absolute;background:#fff;border-radius:99px;opacity:.92;filter:blur(.3px);z-index:1;
  box-shadow:0 6px 16px rgba(120,170,220,.18)}
.fm-cloud::before,.fm-cloud::after{content:"";position:absolute;background:#fff;border-radius:50%}
.fm-cloud::before{width:62%;height:160%;left:10%;top:-72%}
.fm-cloud::after{width:44%;height:120%;right:8%;top:-48%}
.fm-c1{width:110px;height:26px;top:26px;left:-140px;animation:fm-drift 46s linear infinite}
.fm-c2{width:76px;height:19px;top:62px;left:-140px;animation:fm-drift 64s linear infinite 8s;opacity:.8}
.fm-c3{width:92px;height:22px;top:14px;left:-140px;animation:fm-drift 82s linear infinite 22s;opacity:.72}
@keyframes fm-drift{0%{transform:translateX(0)}100%{transform:translateX(calc(100vw + 260px))}}

.fm-weather{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:0;transition:opacity .6s}
.fm-scene-w{opacity:1}
.fm-rain{background-image:repeating-linear-gradient(102deg,rgba(255,255,255,.65) 0 1px,transparent 1px 7px);
  animation:fm-rain 0.6s linear infinite;opacity:.55}
@keyframes fm-rain{to{background-position:-28px 120px}}
.fm-snow{background-image:radial-gradient(circle,#fff 1.6px,transparent 1.8px);background-size:22px 22px;
  animation:fm-snow 6s linear infinite;opacity:.85}
@keyframes fm-snow{to{background-position:14px 220px}}
.fm-sand{background:linear-gradient(90deg,rgba(214,178,116,.55),rgba(214,178,116,.18));
  animation:fm-sand 3.4s ease-in-out infinite}
@keyframes fm-sand{0%,100%{opacity:.35}50%{opacity:.7}}

/* 远山 + 围栏 */
.fm-hills{position:absolute;left:0;right:0;bottom:148px;height:120px;z-index:0;pointer-events:none}
.fm-hills svg{width:100%;height:100%;display:block}
.fm-fence{position:absolute;left:0;right:0;bottom:150px;height:34px;z-index:1;pointer-events:none;
  background:
    repeating-linear-gradient(90deg,#cf9c5c 0 9px,transparent 9px 46px) bottom/100% 30px no-repeat;
  border-bottom:5px solid #b9834a;
  filter:drop-shadow(0 3px 4px rgba(90,60,20,.18))}

/* 场景顶部标题 */
.fm-head{position:relative;z-index:5;padding:18px 22px 0;display:flex;align-items:flex-start;
  justify-content:space-between;gap:14px;flex-wrap:wrap}
.fm-title{display:flex;flex-direction:column;gap:2px}
.fm-title h2{font-size:26px;margin:0;color:#fff;letter-spacing:1px;
  text-shadow:0 2px 0 rgba(0,90,50,.35),0 6px 18px rgba(0,60,40,.35)}
.fm-title .fm-sub{font-size:12.5px;color:#f2fff8;text-shadow:0 1px 4px rgba(0,60,40,.4)}
.fm-pts{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.94);
  border-radius:999px;padding:7px 16px;font-weight:800;color:#8a5a00;font-size:15px;
  box-shadow:0 6px 18px rgba(0,0,0,.14)}

/* ---- 等级面板 ---- */
.fm-hud{position:relative;z-index:5;margin:12px 22px 0;display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(158px,1fr))}
.fm-hud .hud{background:rgba(255,255,255,.94);border-radius:14px;padding:10px 14px;
  box-shadow:0 6px 16px rgba(20,60,40,.14);backdrop-filter:blur(4px)}
.hud .hud-k{font-size:11.5px;color:#7a8798;display:flex;align-items:center;gap:4px}
.hud .hud-v{font-size:16px;font-weight:800;color:#22314c;margin-top:1px}
.hud .hud-v small{font-size:11.5px;font-weight:600;color:#8a93a5}
.hud-bar{height:7px;border-radius:99px;background:#e7edf3;overflow:hidden;margin-top:6px;position:relative}
.hud-bar span{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,#7ee07e,#3fbf5f);transition:width .6s ease}
.hud-bar.tick span{background:linear-gradient(90deg,#ffcc66,#ff9f1c)}

/* ---- 地块网格（草地视角） ---- */
.fm-field{position:relative;z-index:4;margin:16px 18px 0;padding:16px 14px 8px;
  background:radial-gradient(ellipse at 50% 0%,rgba(255,255,255,.5),rgba(126,200,80,0) 70%),
             repeating-linear-gradient(94deg,rgba(255,255,255,.10) 0 3px,transparent 3px 9px),
             linear-gradient(180deg,#8fd463,#6bb944 90%);
  border-radius:18px;box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 10px 26px rgba(20,80,20,.16)}
.fm-plots{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:16px 14px}

/* 单块地：透视泥土 + 垄沟 */
.fm-plot{position:relative;border-radius:12px;padding:10px 9px 9px;text-align:center;
  display:flex;flex-direction:column;gap:6px;
  background:
    repeating-linear-gradient(90deg,rgba(0,0,0,.10) 0 2px,transparent 2px 15px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.09) 0 1px,transparent 1px 12px),
    radial-gradient(ellipse at 50% 120%,var(--fm-soil1),var(--fm-soil2) 62%,var(--fm-soil3));
  border:2px solid #6b4a20;
  box-shadow:0 7px 0 #5a3c17,0 12px 22px rgba(40,25,5,.28),inset 0 2px 6px rgba(255,255,255,.16);
  transition:transform .18s ease,box-shadow .18s ease;
  min-height:214px;justify-content:space-between;overflow:hidden}
.fm-plot::before{content:"";position:absolute;left:0;right:0;top:-2px;height:14px;
  background:linear-gradient(180deg,rgba(255,255,255,.30),transparent);border-radius:12px 12px 0 0;pointer-events:none}
.fm-plot:hover{transform:translateY(-3px);
  box-shadow:0 10px 0 #5a3c17,0 18px 30px rgba(40,25,5,.32),inset 0 2px 6px rgba(255,255,255,.2)}
.fm-plot.is-empty{background:
    repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 6px,transparent 6px 12px),
    radial-gradient(ellipse at 50% 100%,#b0864e,#8a6134 70%,#6d4a24);
  border-color:#7a5a2e;cursor:pointer}
.fm-plot.is-empty:hover{border-color:#ffd166}
.fm-plot.is-ripe{border-color:#22c55e;
  box-shadow:0 7px 0 #12813f,0 0 0 4px rgba(52,211,153,.45),0 14px 30px rgba(16,120,60,.34),
             inset 0 2px 6px rgba(255,255,255,.2);
  animation:fm-ripeglow 2.2s ease-in-out infinite}
@keyframes fm-ripeglow{0%,100%{box-shadow:0 7px 0 #12813f,0 0 0 3px rgba(52,211,153,.35),0 14px 30px rgba(16,120,60,.3),inset 0 2px 6px rgba(255,255,255,.2)}
50%{box-shadow:0 7px 0 #12813f,0 0 0 8px rgba(52,211,153,.16),0 18px 34px rgba(16,120,60,.4),inset 0 2px 6px rgba(255,255,255,.2)}}
.fm-plot.is-wither{filter:saturate(.4) brightness(.92);border-color:#8a7a5c;box-shadow:0 6px 0 #6b5c40,0 10px 20px rgba(40,30,10,.3)}
.fm-plot.liberated{outline:2px dashed #a8b3c4;outline-offset:3px}
.fm-plot.has-pest{border-color:#f97316}

/* 垄台（作物站立的那一块土） */
.fm-bed{position:relative;width:100%;height:104px;border-radius:50%/26%;
  background:radial-gradient(ellipse at 50% 34%,#c19057,#8f6231 72%,#6f4a22);
  box-shadow:inset 0 -6px 12px rgba(0,0,0,.24),inset 0 4px 8px rgba(255,255,255,.22),0 3px 0 rgba(0,0,0,.14);
  display:flex;align-items:flex-end;justify-content:center;overflow:visible;margin-top:6px}

/* 作物：生长缩放 + 摇摆 */
.fm-crop{position:relative;width:100%;transform-origin:50% 100%;display:flex;align-items:flex-end;justify-content:center;
  height:100%;animation:fm-sway 3.6s ease-in-out infinite}
.fm-crop img{width:84px;height:84px;object-fit:contain;
  filter:drop-shadow(0 5px 6px rgba(40,25,5,.38));transform-origin:50% 100%}
@keyframes fm-sway{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.6deg)}}
.fm-crop.g0 img{width:34px;height:34px;opacity:.95;animation:fm-pop .9s ease-out}
.fm-crop.g1 img{width:44px;height:44px}
.fm-crop.g2 img{width:58px;height:58px}
.fm-crop.g3 img{width:70px;height:70px}
.fm-crop.g4 img{width:78px;height:78px}
.fm-crop.g5 img{width:86px;height:86px;animation:fm-ripebounce 1.6s ease-in-out infinite}
@keyframes fm-ripebounce{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-5px) scale(1.03)}}
@keyframes fm-pop{0%{transform:scale(.2);opacity:0}70%{transform:scale(1.15)}100%{transform:scale(1);opacity:1}}

/* 种子阶段：土里的小点 + 破土 */
.fm-seedling{position:relative;width:100%;height:100%;display:flex;align-items:flex-end;justify-content:center}
.fm-seed-dot{width:12px;height:12px;border-radius:50%;background:#f5e6c8;
  box-shadow:0 0 0 3px rgba(255,255,255,.18);animation:fm-seedpulse 1.8s ease-in-out infinite}
@keyframes fm-seedpulse{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.22);opacity:1}}

/* 洒水/浇水小水珠 */
.fm-drop{position:absolute;top:6px;left:50%;width:5px;height:9px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  background:linear-gradient(180deg,#a8e4ff,#2b9fe0);opacity:0;pointer-events:none;
  animation:fm-drop 1.1s ease-in infinite}
@keyframes fm-drop{0%{transform:translate(-50%,-10px) scale(.7);opacity:0}
20%{opacity:.95}100%{transform:translate(-50%,86px) scale(1);opacity:0}}
.fm-plot.watering .fm-drop{opacity:.9}

/* 成熟闪光 */
.fm-spark{position:absolute;width:6px;height:6px;border-radius:50%;background:#fff;pointer-events:none;
  box-shadow:0 0 8px 2px rgba(255,255,180,.9);animation:fm-spark 2.4s ease-in-out infinite}
.fm-spark:nth-child(2){animation-delay:.8s}
.fm-spark:nth-child(3){animation-delay:1.6s}
@keyframes fm-spark{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:1;transform:scale(1.15)}}

/* 虫子爬行 */
.fm-bug{position:absolute;bottom:14px;left:18px;font-size:17px;animation:fm-bugcrawl 4.6s ease-in-out infinite;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}
@keyframes fm-bugcrawl{0%{transform:translate(0,0) rotate(-4deg)}25%{transform:translate(52px,-6px) rotate(6deg)}
50%{transform:translate(96px,2px) rotate(-3deg)}75%{transform:translate(44px,-4px) rotate(5deg)}
100%{transform:translate(0,0) rotate(-4deg)}}

/* 枯萎 */
.fm-wilt{font-size:44px;filter:grayscale(.55) drop-shadow(0 4px 5px rgba(0,0,0,.3));animation:fm-wilt 3.4s ease-in-out infinite}
@keyframes fm-wilt{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(3deg)}}

/* 地块文字区 */
.fm-tag{display:inline-flex;align-items:center;justify-content:center;gap:4px;
  background:rgba(255,255,255,.92);border-radius:8px;padding:2px 8px;font-size:12px;font-weight:700;
  color:#2a3448;box-shadow:0 2px 6px rgba(0,0,0,.16);max-width:100%;margin:0 auto}
.fm-tag .tier{font-size:10px;font-weight:700;padding:0 5px;border-radius:5px}
.fm-tag .tier.t-common{background:#dcfce7;color:#15803d}
.fm-tag .tier.t-rare{background:#dbeafe;color:#1d4ed8}
.fm-tag .tier.t-legend{background:#f3e8ff;color:#7e22ce}
.fm-meta{font-size:11.5px;color:#ffeacb;text-shadow:0 1px 2px rgba(60,35,0,.7);min-height:15px}
.fm-meta.done{color:#c8ffd8;font-weight:700}
.fm-timer{font-weight:800;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px rgba(0,0,0,.5)}

/* 地块进度条 */
.fm-bar{height:6px;border-radius:99px;background:rgba(0,0,0,.34);overflow:hidden;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.5);margin:0 2px}
.fm-bar>span{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,#b6f36b,#41c94a);box-shadow:0 0 8px rgba(150,255,120,.7);
  transition:width .8s ease}
.fm-bar.ripe>span{background:linear-gradient(90deg,#ffe066,#ff9f1c)}

/* 地块按钮行 */
.fm-acts{display:flex;gap:5px;flex-wrap:wrap;justify-content:center}
.fm-acts form{margin:0;flex:1 1 auto;min-width:0}
.fm-btn{width:100%;border:none;border-radius:9px;padding:6px 7px;font-size:11.5px;font-weight:700;
  cursor:pointer;font-family:inherit;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:rgba(255,255,255,.20);border:1px solid rgba(255,255,255,.34);
  backdrop-filter:blur(2px);transition:transform .12s,background .15s,box-shadow .15s}
.fm-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.34)}
.fm-btn:active{transform:translateY(0) scale(.97)}
.fm-btn.go{background:linear-gradient(145deg,#ffe066,#ff9f1c);color:#5a3200;
  border-color:#ffd166;box-shadow:0 3px 10px rgba(255,140,0,.45);font-size:12.5px;padding:8px 7px;
  animation:fm-btnpulse 1.8s ease-in-out infinite}
@keyframes fm-btnpulse{0%,100%{box-shadow:0 3px 10px rgba(255,140,0,.42)}50%{box-shadow:0 5px 18px rgba(255,140,0,.75)}}
.fm-btn.water{background:linear-gradient(145deg,#7dd3fc,#0284c7);border-color:#7dd3fc;color:#fff}
.fm-btn.soil{background:linear-gradient(145deg,#a8a29e,#57534e);border-color:#a8a29e}
.fm-btn.bug{background:linear-gradient(145deg,#fdba74,#ea580c);border-color:#fdba74}

/* 空地：播种交互 */
.fm-empty-body{display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;flex:1;cursor:pointer;padding:6px 0 2px}
.fm-plus{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.22);border:2px dashed rgba(255,255,255,.7);font-size:24px;color:#fff;
  transition:all .2s;animation:fm-plusfloat 2.6s ease-in-out infinite}
@keyframes fm-plusfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.fm-empty-body:hover .fm-plus{background:rgba(255,209,102,.9);border-color:#fff;color:#5a3200;transform:scale(1.08)}
.fm-empty-tip{font-size:11.5px;color:#fff8e7;text-shadow:0 1px 2px rgba(70,40,0,.6)}
.fm-plant-pop{display:none;flex-direction:column;gap:6px;margin-top:4px}
.fm-plot.is-empty.picking .fm-plant-pop{display:flex}
.fm-plot.is-empty.picking .fm-empty-body{display:none}
.fm-crop-select{width:100%;border-radius:9px;border:1px solid #cbb18a;background:#fffdf7;
  color:#3a2b12;font-size:11.5px;padding:6px 6px;font-family:inherit}
.fm-close{background:none;border:none;color:#ffe9c9;font-size:11px;cursor:pointer;text-decoration:underline;padding:0}

/* 场景底部工具条 */
.fm-tools{position:relative;z-index:5;margin:14px 18px 18px;display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.fm-tool{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.94);
  border-radius:12px;padding:8px 14px;font-size:13px;font-weight:700;color:#22314c;
  text-decoration:none;box-shadow:0 5px 14px rgba(20,60,40,.16);border:none;cursor:pointer;
  font-family:inherit;transition:transform .14s,box-shadow .16s}
.fm-tool:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(20,60,40,.24)}
.fm-tool.primary{background:linear-gradient(145deg,#34d399,#059669);color:#fff}
.fm-tool.gold{background:linear-gradient(145deg,#ffe066,#eab308);color:#5a3200}
.fm-tool.ghost{background:rgba(255,255,255,.86);color:#2f6a2f}
.fm-tool .cnt{background:#0ea5e9;color:#fff;border-radius:99px;font-size:11px;padding:0 6px}

/* ---- 收获飘分 ---- */
.fm-toast{position:fixed;left:50%;top:22%;transform:translate(-50%,0) scale(.9);z-index:999;
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(240,255,240,.98));
  border:2px solid #34d399;border-radius:16px;padding:14px 26px;text-align:center;
  box-shadow:0 18px 40px rgba(10,90,50,.28);opacity:0;pointer-events:none;
  transition:opacity .3s,transform .35s cubic-bezier(.2,1.4,.5,1)}
.fm-toast.on{opacity:1;transform:translate(-50%,0) scale(1)}
.fm-toast .tt{font-size:22px;font-weight:800;color:#0f9d58}
.fm-toast .ts{font-size:13px;color:#4b5563;margin-top:2px}

/* ---- 可折叠卡片（图鉴/偷菜靠后） ---- */
.fm-card{background:#fff;border-radius:18px;box-shadow:0 10px 30px rgba(36,40,80,.08);margin-bottom:18px;
  overflow:hidden;border:1px solid #eef1f7}
.fm-card>summary{list-style:none;cursor:pointer;padding:14px 20px;display:flex;align-items:center;gap:9px;
  font-size:15px;font-weight:800;color:#22314c;background:linear-gradient(180deg,#fbfdff,#f3f7fb);
  border-bottom:1px solid transparent;transition:background .16s;user-select:none}
.fm-card>summary::-webkit-details-marker{display:none}
.fm-card>summary:hover{background:#f0f6ff}
.fm-card>summary .arrow{margin-left:auto;color:#9aa6b8;transition:transform .22s;font-size:12px}
.fm-card[open]>summary{border-bottom-color:#eef1f7}
.fm-card[open]>summary .arrow{transform:rotate(90deg)}
.fm-card .fm-card-body{padding:16px 20px 20px}

/* ---- 偷菜大厅 items ---- */
.fm-steals{display:grid;grid-template-columns:repeat(auto-fill,minmax(222px,1fr));gap:11px}
.fm-steal{border:1px solid #e8ecf4;border-radius:14px;background:linear-gradient(160deg,#fff,#f8fbff);
  padding:11px 13px;display:flex;align-items:center;gap:10px;transition:transform .15s,box-shadow .18s,border-color .15s}
.fm-steal:hover{transform:translateY(-2px);border-color:#bcd7ff;box-shadow:0 8px 20px rgba(40,90,160,.12)}
.fm-steal .ss-ico{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:20px;
  background:linear-gradient(160deg,#eafaf0,#d3f2df);flex:0 0 auto}
.fm-steal .ss-main{flex:1;min-width:0}
.fm-steal .ss-name{font-size:13px;font-weight:700;color:#22314c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-steal .ss-sub{font-size:11.5px;color:#8a93a5}
.fm-steal .ss-dog{color:#c2410c;font-weight:700}
.fm-steal form{margin:0}

/* 偷菜大厅：可偷 / 已偷 状态标记 */
.fm-steals-wrap{margin:2px 0}
.ss-sec{display:flex;align-items:center;gap:8px;margin:14px 0 9px}
.ss-sec:first-child{margin-top:4px}
.ss-sec-t{font-size:13px;font-weight:800}
.ss-sec-t.ok{color:#16a34a}
.ss-sec-t.done{color:#9aa3b2}
.ss-sec-n{font-size:11px;font-weight:800;color:#fff;background:#9aa3b2;border-radius:99px;padding:1px 8px}
.ss-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:0 0 auto}
.ss-badge{font-size:11px;font-weight:800;border-radius:99px;padding:2px 9px;line-height:1.55;white-space:nowrap}
.ss-badge.ok{background:#e7f9ee;color:#16a34a;border:1px solid #b7ebc8}
.ss-badge.done{background:#eef1f5;color:#8a93a5;border:1px solid #dbe1ea}
.fm-steal.is-done{background:linear-gradient(160deg,#fafbfc,#f1f3f7);border-color:#e3e7ee;opacity:.85}
.fm-steal.is-done:hover{transform:none;box-shadow:none}

/* ---- 图鉴 v2 ---- */
.fm-codex{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:12px}
.fm-cx{position:relative;border-radius:14px;padding:12px 10px 10px;text-align:center;overflow:hidden;
  border:1.5px solid #e6ebf3;background:linear-gradient(180deg,#fff,#f7faff);transition:transform .16s,box-shadow .18s}
.fm-cx:hover{transform:translateY(-3px);box-shadow:0 10px 22px rgba(40,70,140,.14)}
.fm-cx::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 80% 0%,rgba(255,255,255,.9),transparent 60%)}
.fm-cx img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 4px 5px rgba(0,0,0,.16));
  transition:transform .2s}
.fm-cx:hover img{transform:scale(1.08) rotate(-3deg)}
.fm-cx .cn{font-size:13px;font-weight:800;color:#22314c;margin-top:4px}
.fm-cx .cm{font-size:11px;color:#8a93a5;line-height:1.62}
.fm-cx.t-common{border-color:#bfe8c8;background:linear-gradient(180deg,#fff,#f2fcf4)}
.fm-cx.t-rare{border-color:#b9cffd;background:linear-gradient(180deg,#fff,#f3f7ff)}
.fm-cx.t-legend{border-color:#dcb8ff;background:linear-gradient(180deg,#fff,#faf3ff);
  box-shadow:0 0 0 3px rgba(192,139,255,.10)}
.fm-cx .lockmask{position:absolute;inset:0;background:rgba(255,255,255,.74);display:grid;place-items:center;
  backdrop-filter:blur(1.5px);font-size:11.5px;font-weight:800;color:#7c6a4a;z-index:2;border-radius:12px}

/* ---- 邻居农场横幅 ---- */
.fm-nh{display:flex;align-items:center;gap:14px;border-radius:16px;padding:16px 18px;margin-bottom:16px;
  background:linear-gradient(135deg,#0f766e,#0d9488 55%,#14b8a6);color:#fff;
  box-shadow:0 12px 28px rgba(13,148,136,.26)}
.fm-nh .nh-av{width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.22);
  display:grid;place-items:center;font-size:24px;flex:0 0 auto;border:2px solid rgba(255,255,255,.5)}
.fm-nh .nh-t{font-size:19px;font-weight:800}
.fm-nh .nh-s{font-size:12.5px;opacity:.94;margin-top:1px}

@media (max-width:640px){
  .fm-title h2{font-size:21px}
  .fm-star,.fm-sun{display:none}
  .fm-plots{grid-template-columns:repeat(auto-fill,minmax(146px,1fr));gap:13px 10px}
  .fm-field{margin:12px 10px 0;padding:12px 9px 6px}
  .fm-hud{margin:10px 12px 0;grid-template-columns:repeat(auto-fit,minmax(136px,1fr))}
  .fm-tools{margin:12px 10px 14px}
  .fm-crop img{width:70px;height:70px}
}
@media (prefers-reduced-motion:reduce){
  .fm-sun,.fm-sun::after,.fm-cloud,.fm-crop,.fm-spark,.fm-bug,.fm-plus,.fm-seed-dot,
  .fm-plot.is-ripe,.fm-btn.go,.fm-wilt{animation:none!important}
}