:root{
  --bg:#f5f7fa; --card:#ffffff; --line:#e8ecf1; --txt:#2b3440; --muted:#8a94a6;
  --blue:#2f9bec; --blue-d:#1e7fd0; --gold:#f5b301; --silver:#9aa5b1; --bronze:#c98a3c;
  --pink:#f06aa1; --male:#3b9ae1; --radius:12px;
  --mono:"Consolas","Menlo","PingFang SC","Microsoft YaHei",monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--txt);
  font:14px/1.55 "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  min-height:100vh; display:flex; flex-direction:column;   /* 页脚吸底：内容不足时也贴底 */
}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
/* 内联 SVG 图标（替代 emoji）：描边跟随文字颜色，跨平台一致 */
.svgico{display:inline-block;vertical-align:-.16em;flex:0 0 auto;fill:none;stroke:currentColor;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.svgico.lg{stroke-width:1.6}
.wrap{max-width:820px;margin:0 auto;padding:14px 14px 40px;width:100%;
  flex:1 0 auto;display:flex;flex-direction:column}
.wrap.wide{max-width:1440px}
.wrap.side-layout>.site-foot{margin:18px 0 0;color:var(--muted);font-size:12.5px;line-height:1.8}
.wrap>.site-foot{margin-top:auto}
.icp-badge{vertical-align:middle;max-width:100%;height:1.6em;width:auto}   /* 跟随声明段字号自动缩放，各设备一致 */
/* 桌面单独：换高清素材(icp-hd.png，见 view.php <picture>)并按页脚字号放大到约14px；
   手机/iPad(≤860px) 仍用 icp.png + 1.6em，完全不动，避免影响自适应 */
@media (min-width:861px){ .icp-badge{height:9px} }
.icp-link{display:inline-block;line-height:0;vertical-align:middle;cursor:pointer;
  user-select:none;-webkit-user-select:none;-webkit-user-drag:none;user-drag:none}
.icp-link img{pointer-events:none}   /* 图片不吃鼠标事件：防拖拽/右键另存；链接仍可点 */

/* ---------- 左侧导航布局（主页 + 展示页通用） ---------- */
.wrap.side-layout{max-width:1160px;flex-direction:row;align-items:flex-start;gap:18px;padding-top:10px;padding-bottom:30px}
/* 侧导航：强化视觉（更大/加粗/当前页蓝条） */
.side-nav{font-size:14.5px}
.side-cap{font-size:11px;font-weight:800;color:#3b4a63;letter-spacing:1px}
.side-group a{padding:10px 12px;font-weight:700;font-size:14px;color:#334155}
.side-group a:hover{background:#f0f5fb;text-decoration:none}
.side-group a.on{background:var(--c12,#E6F3FD);color:var(--blue-d);font-weight:800;border-left:3px solid var(--blue);padding-left:9px}
.side-group .si{font-size:17px;width:22px}
.side-nav{flex:0 0 168px;position:sticky;top:10px;display:flex;flex-direction:column;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:8px}
.side-cap{font-size:11px;font-weight:700;color:var(--muted);letter-spacing:2px;
  padding:10px 10px 4px;text-transform:uppercase}
.side-group{display:flex;flex-direction:column;gap:2px}
.side-group a{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;
  color:var(--txt);font-size:13.5px;font-weight:600}
.side-group a:hover{background:#f2f6fb;text-decoration:none}
.side-group a.on{background:#e8f3fd;color:var(--blue-d)}
.side-group .si{width:20px;text-align:center;flex:0 0 auto}
.side-gap{height:6px}
.side-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:10px;min-height:calc(100vh - 110px)}
.side-main>.site-foot{margin:auto 0 0;max-width:none;padding:14px 0 0;text-align:left;border-top:1px solid var(--line)}
@media (max-width:860px){
  /* align-items:stretch 必须显式写：基础规则里是 flex-start，列布局下子项会退化成「内容宽」，
     内容一变（如手机端用下拉筛选）整页宽度跟着变 → 勋章等元素被带动缩放 */
  .wrap.side-layout{flex-direction:column;align-items:stretch}
  /* 导航：手机端「一行横滑」（不再多行堆叠占掉半个屏）；宽度与内容容器一致，超宽就左右滑 */
  .side-nav{position:static;flex:none;display:flex;flex-direction:row;flex-wrap:nowrap;
    gap:6px;padding:8px;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .side-nav::-webkit-scrollbar{display:none}
  .side-cap,.side-gap{display:none}
  .side-group{display:contents}
  .side-nav a{flex:0 0 auto;display:flex;align-items:center;gap:5px;padding:8px 12px;
    background:#f6f9fc;border:1px solid #eef2f7;border-radius:8px;
    font-size:13px;font-weight:600;color:var(--txt);white-space:nowrap}
  .side-nav a:hover{background:#eef4fb;text-decoration:none}
  .side-nav a.on{background:#e8f3fd;border-color:#bcdcfb;color:var(--blue-d);padding-left:12px}
  .side-nav .si{font-size:15px;width:auto}
  .side-nav .side-entry{display:none}   /* 手机端不显示「管理」入口 */
}

/* ---------- 主页：三段大色块 ---------- */
.home-hero{display:flex;align-items:center;gap:18px;background:linear-gradient(135deg,#eaf8ef,#dff3e6);
  border:1px solid #c7e9d3;border-radius:var(--radius);padding:16px 20px;margin:0 0 10px}
.home-hero .hh-txt{flex:1 1 auto;min-width:0}
.home-hero h1{margin:0 0 4px;font-size:20px;color:#1d6b40}
.home-hero p{margin:0;color:#3d7a58;font-size:13.5px}
.home-hero .hh-ico{flex:0 0 auto;font-size:44px;line-height:1}
/* 主页：数据板块分组头（卡片模块化） */
.home-sec{display:flex;align-items:baseline;gap:8px;margin:2px 0 8px;padding:0 2px}
.home-sec b{font-size:13px;color:#334155;letter-spacing:.5px}
.home-sec span{font-size:11.5px;color:var(--muted)}
.home-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(164px,1fr));gap:10px;margin:0 0 10px}
.home-tile{display:flex;flex-direction:column;gap:3px;align-items:flex-start;border:1px solid var(--line);
  border-radius:12px;padding:12px 14px;min-height:98px;color:var(--txt);
  box-shadow:0 1px 2px rgba(30,60,110,.05);
  transition:transform .12s ease, box-shadow .12s ease}
.home-tile:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.08)}
.home-tile .ht-ico{font-size:26px;line-height:1}
.home-tile b{font-size:14.5px}
.home-tile .ht-sub{font-size:11.5px;color:var(--muted);line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.home-tile{border-top:3px solid var(--tc,#5b6675)}
.home-tile.academy{--tc:#3DB463;background:#f7fcf9}
.home-tile.town{--tc:#E8842F;background:#fdf8f3}
.home-tile.tree{--tc:#7A5CF0;background:#f8f6fe}
.home-tile.pre{--tc:#f06aa1;background:#fff5f9}
.home-tile.medal{--tc:#f5b301;background:#fffbf2}
.home-tile.level{--tc:#2B66CC;background:#f5f8fe}
.home-tile.petlevel{--tc:#0EA5A4;background:#f2fbfa}

/* ========== 主页 v4（2026-09-22）：全宽布局 · 三列卡片 · 收紧 hero ========== */
.hm-wrap{width:100%;display:flex;flex-direction:column;gap:12px}

.hm-hero{position:relative;overflow:hidden;text-align:center;
  padding:28px 24px 24px;border-radius:12px;
  background:linear-gradient(135deg,#ecfdf5 0%,#f0f9ff 100%);
  border:1px solid var(--line);box-shadow:0 1px 3px rgba(15,23,42,.05)}
.hm-hero::before{content:'';position:absolute;top:-50px;right:-50px;width:160px;height:160px;
  background:radial-gradient(circle,rgba(61,180,99,.1) 0%,transparent 70%);border-radius:50%}
.hm-hero-ico{font-size:40px;line-height:1;margin-bottom:6px}
.hm-hero h1{margin:0 0 4px;font-size:21px;color:#1d6b40;letter-spacing:2px}
.hm-hero p{margin:0;color:#3d7a58;font-size:13px;letter-spacing:.3px}

.hm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.hm-card{display:flex;align-items:center;gap:12px;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:14px;color:var(--txt);text-decoration:none;
  box-shadow:0 1px 3px rgba(15,23,42,.05);
  transition:transform .15s ease,box-shadow .15s ease}
.hm-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(15,23,42,.1);text-decoration:none}
.hm-ico{width:40px;height:40px;border-radius:10px;display:flex;
  align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.hm-txt{flex:1;min-width:0}
.hm-txt b{display:block;font-size:13.5px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hm-txt span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.hm-arr{color:#c8cdd8;font-size:18px;transition:transform .15s ease,color .15s ease}
.hm-card:hover .hm-arr{transform:translateX(3px);color:var(--txt)}

.c-grn{background:#ecfdf5;color:#3DB463}
.c-org{background:#fff7ed;color:#E8842F}
.c-pur{background:#f5f3ff;color:#7A5CF0}
.c-gld{background:#fffbeb;color:#d4a001}
.c-blu{background:#eff6ff;color:#2B66CC}
.c-tea{background:#f0fdfa;color:#0EA5A4}

@media(max-width:860px){
  .hm-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .hm-grid{grid-template-columns:1fr}
  .hm-hero{padding:24px 16px 20px}
  .hm-hero-ico{font-size:36px}
  .hm-hero h1{font-size:19px}
  .hm-card{padding:12px}
  .hm-ico{width:36px;height:36px;font-size:18px;border-radius:9px}
  .hm-txt b{font-size:13px}
}

/* ---------- 主页 hero：窄屏适屏（必须放在 .home-hero 基础规则之后才生效） ---------- */
/* ≤860px：收紧固定占位，把宽度让给文字 */
@media (max-width:860px){
  .home-hero{gap:12px}
  .home-hero .hh-ico{font-size:34px}
}
/* ≤640px：竖排 —— 第一行「图标 + 标题」，正文独占第二行，
   避免标题/正文被挤成一字一行 */
@media (max-width:640px){
  .home-hero{flex-wrap:wrap;gap:8px 12px;padding:14px 16px}
  .home-hero .hh-txt{display:contents}
  .home-hero h1{flex:0 1 auto;font-size:18px;margin:0}
  .home-hero p{flex:1 1 100%;order:9;margin:0;font-size:13px;line-height:1.6}
}

/* ---------- 数据图鉴长图页（频道风 · 窄长条 480px） ---------- */
/* 必须写 width:100%：.side-main 是 column flex，子项的 margin:auto 会压过 align-items:stretch，
   容器会退化成「内容宽」—— 手机端一筛选（行数变少）整页连同勋章就一起缩水（88px→64px）。
   加 width:100% 后宽度与内容无关，筛选前后尺寸不变。 */
.sheet-wrap{width:100%;max-width:720px;margin:0 auto;padding:0 16px 40px}   /* 顶部不自加 14px：.wrap.side-layout 已有 10px，否则主体比左侧导航低 */
/* 手机端「内容容器」必须与「导航容器」同宽：左右内边距归零，留白交给卡片自己。
   （必须写在上面基础规则之后，否则同优先级下会被 padding:0 16px 40px 盖掉） */
@media (max-width:860px){
  .sheet-wrap{padding-left:0;padding-right:0}
}
.sheet-t{width:100%;border-collapse:collapse;font-size:10.5px;table-layout:fixed}
.sheet{background:#fff;border:1px solid #e3e8f0;border-radius:14px;overflow:hidden;margin:0 0 14px;
  padding:0 14px 12px;border-top:3px solid var(--c,#5b6675);
  box-shadow:0 2px 10px rgba(30,50,90,.06)}
.sheet-hd{display:flex;align-items:center;gap:8px;padding:10px 0 8px;background:transparent}
.sheet-hd b{color:var(--c);font-size:14px;font-weight:800;letter-spacing:.3px}
.sheet-note{font-size:9.5px;color:#b45309;background:#fff7ed;border:1px solid #fed7aa;border-radius:6px;padding:1px 5px}
.sheet-head{display:flex;justify-content:space-between;align-items:center;gap:8px 12px;flex-wrap:wrap}
.sheet-head h2{font-size:18px;white-space:nowrap;flex:0 0 auto}
.sheet-head-meta{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;flex:1 1 auto;justify-content:flex-end;min-width:0}
.sheet-head-meta .sheet-at{margin-top:0;white-space:nowrap}
/* 头部按钮/下拉不许被压扁（否则「生成分享长图」会被挤成多行） */
.sheet-head-meta>.btn,.sheet-head-meta>.sh-pick,.sheet-head-meta>.pk-cap{flex:0 0 auto;white-space:nowrap}
.sheet-head-meta>.sh-pick{width:auto;max-width:190px}   /* 全局 select{width:100%} 会把它撑满整行，这里必须收回 */
.sh-picks{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end;flex:1 1 auto;min-width:0}
.sh-picks .pk-btn{font-size:11.5px;padding:3px 9px;border-radius:8px}
@media (max-width:820px){ .sheet-head{flex-wrap:wrap} .sheet-head-meta{flex-wrap:wrap;margin-left:0} }
/* 板块头吸顶：往下拉也能看清当前在哪个板块（宠物学院 / 年级战力 / 职业小镇 / 职业树 / 勋章馆 / 宠物等级…）
   底部的 10px 间距做进 padding（不再用 margin），否则吸顶时那 10px 缝隙会漏出滚动内容 */
.sheet-head{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px 20px;margin-bottom:0;
  position:sticky;top:0;z-index:40;box-shadow:0 1px 3px rgba(15,23,42,.05)}
/* 后台：板块头吸在顶栏（.topbar 高约 78px）下方，且 z-index 低于顶栏，绝不遮住导航 */
.data-main .sheet-head{top:var(--topbar-h,78px);z-index:9}
/* 主页（前台）：板块头同样吸在顶栏下方，且 z-index 低于顶栏，不遮导航 */
.side-main .sheet-head{top:var(--topbar-h,72px);z-index:9}
/* 后台表格吸顶表头：表格容器(.table-wrap)本身是滚动容器，thead sticky 相对它 → 保持 top:0（原值），不要用视口值 */
/* 后台：所有板块的卡片标题栏吸顶（吸在顶栏下方，z-index 低于顶栏）；
   卡片放开 overflow，否则 overflow:hidden 会让内部 sticky 失效
   ⚠️ 踩坑（2026-09-23）：下面 .data-main .card{overflow:visible} 是【类选择器】，
   会被卡片上的【内联 overflow:hidden】压过去（例：share.php 的 #capture，为裁圆角所加）。
   卡片一旦是 overflow:hidden 就成了 .card-hd 的 sticky 包含块，标题自然位置 0 <
   top(--topbar-h≈77px) → 标题被下推 77px，压住表头和第一名。
   要「裁圆角 + 不破坏 sticky」→ 用 overflow:clip（只裁切、不产生滚动容器）。
   同类坑：sticky 的 top 必须相对它真正的滚动容器，不能照抄视口值（见 cb0dbf4）。 */
@media (min-width:861px){
  .data-main .card{overflow:visible}
  .data-main .card-hd{position:sticky;top:var(--topbar-h,78px);z-index:9;background:var(--card);
    border-radius:var(--radius) var(--radius) 0 0}
}
.sheet-head h2{margin:0;font-size:16px}
.sheet-thanks{color:#5b6675;font-size:10.5px}
.sheet-at{color:var(--muted);font-size:10px;margin-top:2px}
/* 年级战力表头：三行排版（①标题+按钮 ②筛选/奶控件 ③说明），不再靠 flex-wrap 乱折 */
.sheet-head.sh-rows{display:flex;flex-direction:column;gap:9px;align-items:stretch;flex-wrap:nowrap}
.sh-r1{display:flex;align-items:center;justify-content:flex-start;gap:10px;flex-wrap:wrap;min-width:0}
/* 旧规则给 .sheet-head--narrow 的 h2/pk-bar 设过 order（桌面也生效），这里按三行排版重置 */
.sheet-head.sh-rows .sh-r1>*,
.sheet-head.sh-rows .sh-r2>*,
.sheet-head.sh-rows .sh-r3>*{order:0}
.sh-r1 .btn{margin-left:auto}
.sh-r1 h2{margin:0 auto 0 0;flex:0 1 auto;min-width:0}
.sh-sp{flex:1 1 auto}
.sh-r2{display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap}
.sh-r2 .pk-bar{margin:0}
/* 这一页控件不套方框（.pk-bar 默认白底+边框+内边距，会让整行偏高） */
.sheet-head.sh-rows .pk-bar{background:none;border:0;border-radius:0;padding:0;overflow:visible}
.sh-r3{min-width:0}
.sh-r3 .sheet-at{margin:0;white-space:normal;line-height:1.6}
@media (max-width:860px){
  .sh-r1 h2{font-size:15px}
  .sh-r2{gap:6px 10px}
}
/* A+ 概率封顶提示（超过 100% 时显示「封顶 100%，溢出 xx%」） */
.bf-over{font-style:normal;font-size:10px;color:#d97706;margin-left:3px}
/* 手机端：压缩「锁定的板块头」高度（职业树 / 宠物等级）——
   第 1 行 = 标题靠左 + 控件靠右；第 2 行 = 说明（单行省略，去掉 <br> 强制换行） */
@media (max-width:860px){
  .sheet-head--compact{align-items:center;gap:6px 8px;padding:10px 12px 12px}
  .sheet-head--compact h2{order:1;flex:1 1 auto;min-width:0;font-size:15px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sheet-head--compact .sheet-head-meta{display:contents}
  .sheet-head--compact .btn{order:2;flex:0 0 auto;margin-left:auto}
  .sheet-head--compact .mpick-bar{order:2;flex:0 0 auto;margin:0 0 0 auto;padding:0;background:none;border:0}
  .sheet-head--compact .mpick-cap{display:none}   /* 省掉「选职业」三字，下拉本身显示当前选项 */
  /* 头里的独立下拉（职业小镇「阶段/星级」）：跟标题同一行，右侧对齐 */
  .sheet-head--compact .sh-pick{order:2;flex:0 1 auto;min-width:0;max-width:none}
  /* 宽筛选条（A+概率按钮组）独占一行、行内可横滑；学院多选 / 疲劳档各占一行 */
  .sheet-head--compact .pk-bar{order:3;flex:1 1 100%;min-width:0;margin:0;padding:0;background:none;border:0}
  .sheet-head--compact .pk-cap{flex:0 0 auto;white-space:nowrap}   /* 不换行，否则「A+ 概率」会挤成竖排 */
  /* 手机端：概率/学园/年级 三个下拉平分一行全部可见（下拉自身文字已说明含义，标签省掉） */
  .sheet-head--compact .pk-bar .pk-cap{display:none}
  .sheet-head--compact .pk-bar .sh-pick{flex:1 1 0;min-width:0;max-width:none}
  .sheet-head--compact .sh-picks{order:3;flex:1 1 100%;min-width:0;justify-content:flex-start;overflow-x:auto}
  .sheet-head--compact .ts-fatseg{order:4;flex:1 1 100%;min-width:0;justify-content:flex-start;overflow-x:auto}
  .sheet-head--compact .sheet-at{order:5;flex:1 1 100%;margin:0;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sheet-head--compact .sheet-at br{display:none}
}
.sheet-t th.l{text-align:left;color:var(--muted);font-weight:600}
.sheet-t th,.sheet-t td{padding:3px 4px;border-bottom:1px solid var(--line);text-align:center;
  font-variant-numeric:tabular-nums;overflow-wrap:anywhere;line-height:1.25}
.sheet-t .row-heads th{background:#f7f9fc;color:#334155;font-size:10px}
.sheet-t .subhead th,.sheet-t .subhead td{background:#f2f6fb;color:#64748b;font-size:9.5px;font-weight:700}
.sheet-t .grp{background:var(--c12,#eef4fb);color:var(--c)}
.sheet-t .grp2{background:#f2f6fb}
.sheet-t td.camp,.sheet-t th.camp{background:#f2eefe;color:#7A5CF0}
.sheet-t .up{font-weight:800;color:var(--c)}
.sheet-t .sumrow td,.sheet-t .sumrow th{background:var(--c10,#f1f6fb);font-weight:700;color:#334155;border-top:2px solid var(--c)}
.sh-hint{font-size:9.5px;color:var(--muted);line-height:1.5;margin:5px 0 0}
.sh-pick{font-size:12px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#334155}
.sh-pick:focus{outline:none;border-color:var(--blue)}
.pk-bar{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;overflow-x:auto;margin:0 0 8px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:8px 12px}
.pk-bar .pk-cap{margin-right:2px}
.pk-bar .sh-pick{flex:0 0 auto;width:auto;max-width:170px}
/* 主页窄版年级战力：筛选/输入框更紧凑（820px 才放得下） */
.sheet-head--narrow .pk-bar{gap:4px}
.sheet-head--narrow .pk-bar .sh-pick{max-width:132px}
.sheet-head--narrow .pk-bar--buff input{width:64px !important}
.pk-cap{font-size:12px;font-weight:700;color:#3b4a63;margin-right:2px}
.pk-btn{font:inherit;font-size:12px;padding:4px 9px;border:1px solid var(--line);border-radius:8px;color:#334155;background:#fff;cursor:pointer}   /* 也用于 <button>（职业小镇阶段筛选）：字体/鼠标跟 <a> 版一致 */
.pk-btn:hover{background:#f2f6fb;text-decoration:none;color:#334155}
.pk-btn.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700}
.pk-btn.on:hover{color:#fff}
/* ── 学院页（PHP 版）：课程 chip 行 + 原生表，撑满主区，不再挤压换行 ── */
.aca-wrap{width:100%;padding:0 0 30px}   /* 顶部不再自加 10px：.wrap.side-layout 已有 10px，加两层会让主体比左侧导航低 11px */
.aca-cols{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:10px;margin:2px 0 10px}
.aca-col{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}
.aca-col b{font-size:11.5px;color:#334155;font-weight:600;line-height:1.3;white-space:nowrap}
.aca-col .m{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;color:#8a94a6;line-height:1.2}
.aca-col .m img{width:13px;height:13px;object-fit:contain}
.aca-col .m em{font-style:normal}
.aca-col.camp b,.aca-col.camp .m em{color:var(--c)}   /* 夏令营跟随当期学院主色（原来写死 #7A5CF0，在非高级学院里会串色） */
.aca-t{width:100%;border-collapse:collapse;table-layout:fixed;font-size:12.5px}
.aca-t th,.aca-t td{border:1px solid #e6ebf2;text-align:center;padding:6px 4px;line-height:1.3}
.aca-t thead th{background:#f7f9fc;color:#334155;font-weight:700;font-size:12px;position:sticky;top:0;z-index:8}
.aca-t thead th.g-short{background:#f2f9f4;color:#2f7d51}
.aca-t thead th.g-long{background:#f3f6fd;color:#2b4f9e}
.aca-t tbody tr:nth-child(even){background:#fbfcfe}
.aca-t tbody tr.sum td,.aca-t tbody tr.sum th{background:var(--c10,#f1f6fb);font-weight:700;border-top:2px solid var(--c)}
.aca-t .up{color:#1e7fd0;font-weight:700}
.aca-t .cum{color:#0f766e;font-weight:700}
@media (max-width:1150px){.aca-t{font-size:11.5px}.aca-t thead th{font-size:10.5px}.aca-t th,.aca-t td{padding:5px 3px}}
.aca-t th.l{white-space:nowrap}
.aca-t tbody tr.muted td{background:#f4f7fb;text-align:left;font-size:11.5px;color:#3b4a63;padding:5px 8px;border:1px solid #e6ebf2}
/* 图鉴长图表：不做吸顶（吸顶+透明底会与下方内容重叠，看起来像被盖住） */
.sheet-wrap .sheet-t thead th,.sheet-wrap .sheet-t .row-heads th{position:static;box-shadow:none}
.sheet-t td:nth-child(1),.sheet-t th:nth-child(1){text-align:left}


/* ── 学院 / 年级战力：表格轻量化（去满格线、圆角、分组表头、阶段累计条）—— 只动视觉，不动数值 ── */
.aca-wrap .aca-t{border-collapse:separate;border-spacing:0;border:1px solid #e9eef5;border-radius:12px;
  overflow:visible;background:#fff}
.aca-wrap .aca-t th,.aca-wrap .aca-t td{border:0;border-bottom:1px solid #f1f5f9;padding:7px 6px}
.aca-wrap .aca-t thead th{background:#f7f9fc;border-bottom:1px solid #e4eaf2;color:#475569}
.aca-wrap .aca-t thead th.g-short{background:#f1f8f4;color:#2f7d51;border-bottom-color:#dcece3}
.aca-wrap .aca-t thead th.g-long{background:#f2f5fc;color:#2b4f9e;border-bottom-color:#dbe4f6}
.aca-wrap .aca-t tbody tr.muted td{background:#f4f7fb;border-bottom:1px solid #eef2f7}
.aca-wrap .aca-t tbody tr.sum td{background:var(--c10,#f1f6fb);border-top:2px solid var(--c);border-bottom:0;
  font-weight:800;color:#334155}
.aca-wrap .aca-t tbody tr:last-child td{border-bottom:0}
.aca-wrap .aca-t .up{color:var(--c);font-weight:800}
@media (max-width:1150px){ .aca-wrap .aca-t th,.aca-wrap .aca-t td{padding:6px 4px} }

/* ── 手机端适屏（≤720px）：宽表改「卡片式纵向堆叠」——
   只在窄屏生效，桌面版式不变；点「生成长图分享」时强制还原成宽表（截图仍出原表格） ── */
.mx-cards{display:none}
@media (max-width:720px){
  .mx-cards{display:block}
  .mx-hide{display:none !important}
  .aca-wrap .aca-cols{display:flex;flex-wrap:wrap;gap:6px 14px;margin-bottom:8px}
  .aca-wrap .aca-col{flex:0 0 auto;align-items:flex-start}
  .aca-wrap .aca-col b{white-space:normal}
  .aca-mcards{display:flex}
  .btn.capture-hide{display:none !important}   /* 手机端不再提供「生成长图分享」（只留在网页端） */
  /* 年级·战力对照：11 列宽表 → 手机上左右滑动查看（列保持可读宽度，不挤压重叠） */
  .aca-wrap .table-wrap{overflow-x:auto;border-radius:12px}   /* 圆角改由滚动容器提供 */
  .aca-wrap .table-wrap .aca-t{min-width:820px}
  /* 首列（年级）冻结：左右滑动时始终知道这行是哪个年级。
     注意：必须让表格自身 overflow:visible，否则表格会成为「滚动容器」把 sticky 困住（不生效）。 */
  .aca-wrap .table-wrap .aca-t{overflow:visible}
  .aca-wrap .table-wrap .aca-t th.l{position:sticky;left:0;z-index:2;background:#fff;box-shadow:1px 0 0 #eef2f7}
  .aca-wrap .table-wrap .aca-t thead th.l{background:#f7f9fc;z-index:3}
  .aca-wrap .table-wrap .aca-t tbody tr:nth-child(even) th.l{background:#fbfcfe}
  .aca-wrap .table-wrap .aca-t tbody tr.sum th.l{background:var(--c10,#f1f6fb)}
}
.swipe-hint{padding:2px 12px 8px;font-size:11.5px;color:#8a94a6;text-align:center}
/* 手机端「快捷查看」下拉条（仅窄屏显示；长图截图不出现） */
.mpick-bar{display:none;align-items:center;gap:8px;margin:0 0 10px;padding:8px 10px;background:#fff;
  border:1px solid var(--line);border-radius:10px}
@media (max-width:720px){ .mpick-bar{display:flex} }
#capture.capturing .mpick-bar{display:none !important}
/* R-07 勋章馆桌面端：标题行右侧显示类别筛选下拉（手机版行为不变；长图截图仍隐藏） */
.sheet-head--compact .mpick-bar{display:flex;order:2;flex:0 0 auto;margin:0 0 0 auto;padding:0;background:none;border:0}
.sheet-head--compact .sheet-head-meta{order:3}
.mpick-cap{flex:0 0 auto;font-size:12px;color:#5b6675;font-weight:700}
.mpick-bar select{flex:1 1 auto;min-width:0;padding:7px 30px 7px 11px;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  border:1px solid var(--line);border-radius:8px;
  font:inherit;font-size:13px;font-weight:600;color:#334155;background:#fff;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a94a6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;background-size:14px 14px;
  transition:border-color .15s ease,box-shadow .15s ease}
.mpick-bar select:hover{border-color:#c7d5e6}
.mpick-bar select:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(47,155,236,.15)}
/* 桌面端：说明/统计文字挪到标题旁，筛选下拉挪到主按钮前（勋章馆 / 职业树共用；手机版不变） */
@media (min-width:861px){
  .sheet-head--swap .sheet-head-meta{display:contents}
  .sheet-head--swap .sheet-at{order:2}
  .sheet-head--swap .mpick-bar{order:3;margin-left:auto}
  .sheet-head--swap .pk-bar{order:3;margin-left:auto}
  .sheet-head--swap .btn{order:4}
  .sheet-head--swap .pk-bar--buff{order:5;flex:1 1 100%;margin-left:0}
  /* 后台宽版年级战力：行1 = 标题 + 说明（接标题后）+ 长图；行2 = 筛选(左) + 填写框(右) */
  .sheet-head--admin{display:grid;grid-template-columns:auto 1fr auto;
    grid-template-areas:"title desc shot" "picks picks buff";
    align-items:center;gap:6px 12px}
  .sheet-head--admin h2{grid-area:title;white-space:nowrap}
  .sheet-head--admin .sheet-head-meta{display:contents}
  .sheet-head--admin .sheet-at{grid-area:desc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    margin:0;text-align:left;font-size:12.5px}
  .sheet-head--admin .btn{grid-area:shot;justify-self:end}
  .sheet-head--admin .pk-bar{grid-area:picks;margin:0;justify-self:start}
  .sheet-head--admin .pk-bar--buff{grid-area:buff;margin:0;justify-self:end}
  /* 主页窄版（820px）：行1 = 标题 + 说明（占满剩余）+ 长图；行2 = 筛选 + 填写框 */
  .sheet-head--narrow{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
  .sheet-head--narrow h2{order:1;flex:0 0 auto;white-space:nowrap}
  .sheet-head--narrow .sheet-head-meta{display:contents}
  .sheet-head--narrow .sheet-at{order:2;flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;
    text-overflow:ellipsis;margin:0;text-align:left;font-size:11px;line-height:1.35}
  .sheet-head--narrow .btn{order:3;flex:0 0 auto;margin-left:auto}
  .sheet-head--narrow .pk-bar{order:4;flex:0 0 auto;margin:0}
  .sheet-head--narrow .pk-bar--buff{order:5;flex:1 1 auto;margin:0}
}
.bf-help{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;
  border-radius:50%;background:#eef2f7;color:#64748b;font-size:11px;font-weight:700;cursor:help;flex:0 0 auto}
.bf-help:hover{background:#dbe7f5;color:#1e7fd0}
/* 学院标题前的「初/中/高/进」色块（仅手机端显示，便于区分） */
.sch-badge{display:none}
@media (max-width:720px){
  .sch-badge{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;
    border-radius:6px;background:var(--c);color:#fff;font-size:12px;font-weight:800;margin-right:6px}
}
#capture.capturing .sch-badge{display:none !important}
#capture.capturing .mx-cards{display:none !important}
#capture.capturing .mx-hide{display:block !important}
/* 学院图鉴 · 手机卡片 */
.aca-mcards{flex-direction:column;gap:8px;margin:4px 0 0}
.amc{border:1px solid #e9eef5;border-radius:10px;background:#fff;overflow:hidden}
.amc-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 11px;
  background:var(--cz,#f7fafc);border-bottom:1px solid #eef2f7;font-size:13px;font-weight:800;color:#334155}
.amc-hd .amc-badge{font-size:11px;font-weight:700;color:#5b6675}
.amc-hd .amc-badge b{color:var(--c);font-size:13px}
.amc-hd .badge-long{color:#2b4f9e}
.amc-hd .badge-short{color:#2f7d51}
.amc-r{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 11px;border-top:1px solid #f4f7fb}
.amc-hd+.amc-r,.amc-gcap+.amc-r{border-top:0}
.amc-k{flex:0 0 auto;font-size:12px;color:#8a94a6;font-weight:600}
.amc-v{flex:1 1 auto;text-align:right;font-size:12.5px;color:#334155;font-variant-numeric:tabular-nums}
.amc-v b{color:var(--c);font-weight:800}
.amc-v .sep{color:#cbd5e1;margin:0 5px}
.amc-v img{width:13px;height:13px;object-fit:contain;vertical-align:-2px;margin-right:2px}
.amc-gcap{padding:5px 11px;background:#fafcfe;border-top:1px solid #eef2f7;font-size:11px;font-weight:700;color:#7b8798}
.amc-sum{--c:#334155}
.amc-sum .amc-hd{background:var(--c10,#f1f6fb);color:#334155}

/* ══════════ 数据记录 · 学园 ══════════ */
.ac-school{--sch:#1e7fd0;--schbg:#eef4fb;--schbd:#d6e8fa}
.ac-school[data-sch="初级学园"]{--sch:#3DB463;--schbg:#EAF8EF;--schbd:#c7e9d3}
.ac-school[data-sch="中级学园"]{--sch:#2B66CC;--schbg:#EAF1FC;--schbd:#c9dcf5}
.ac-school[data-sch="高级学园"]{--sch:#7A5CF0;--schbg:#F2EEFE;--schbd:#ddd2fb}
.ac-school[data-sch="进修学院"]{--sch:#E8842F;--schbg:#FDF3E8;--schbd:#f7dcbe}
.ac-school[data-sch="学前辅导班"]{--sch:#f06aa1;--schbg:#FDEEF4;--schbd:#f9d2e2}
.ac-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.ac-tab{border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 18px;
  font:inherit;font-weight:700;font-size:14px;color:#5b6675;cursor:pointer}
.ac-tab:hover{background:#f6f9fc}
.ac-tab.on{background:#e8f3fe;border-color:#bcdcfb;color:#1e7fd0}
.ac-tab[data-sch="初级学园"].on{background:#EAF8EF;border-color:#c7e9d3;color:#2f9c53}
.ac-tab[data-sch="中级学园"].on{background:#EAF1FC;border-color:#c9dcf5;color:#2B66CC}
.ac-tab[data-sch="高级学园"].on{background:#F2EEFE;border-color:#ddd2fb;color:#7A5CF0}
.ac-tab[data-sch="进修学院"].on{background:#FDF3E8;border-color:#f7dcbe;color:#E8842F}
.ac-tab[data-sch="学前辅导班"].on{background:#FDEEF4;border-color:#f9d2e2;color:#f06aa1}
.ac-gtabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.ac-gtab{border:1px solid var(--line);background:#f8fafc;border-radius:999px;padding:6px 15px;
  font:inherit;font-size:13px;color:#5b6675;cursor:pointer}
.ac-gtab:hover{background:var(--schbg)}
.ac-gtab.on{background:var(--sch);border-color:var(--sch);color:#fff;font-weight:700}
.ac-need{display:inline-flex;align-items:center;gap:6px;margin-bottom:12px;font-size:12px;color:#7b8794;
  background:var(--schbg);border:1px solid var(--schbd);border-radius:999px;padding:3px 12px}
.ac-need b{color:var(--sch)}
/* 顶部玩法说明 */
.ac-tips{display:flex;flex-wrap:wrap;gap:5px 20px;margin-bottom:14px;padding:9px 14px;
  background:#f8fafc;border:1px solid var(--line);border-radius:10px;font-size:12.5px;color:#5b6675;line-height:1.6}
.ac-tips b{color:#2b3440}
.k-all .ac-attr{color:#f06aa1;background:#FDEEF4}
/* 多图标与文字之间拉开（全属性） */
.ac-attr .ac-ic:last-of-type{margin-right:4px}
.ac-gain .ac-ic:last-of-type{margin-right:2px}
.ac-attr{flex-wrap:wrap}
/* 只有年级、还没课程的占位 */
.ac-empty{padding:22px 4px;color:#8a94a6;font-size:13px;text-align:center;
  background:var(--schbg);border:1px dashed var(--schbd);border-radius:10px}
.ac-sumic{display:inline-block;width:13px;height:13px;object-fit:contain;vertical-align:-2px;margin-right:3px}
.ac-up{font-style:normal;font-size:10.5px;font-weight:800;color:#c62f27;margin-left:5px}
.ac-sum-ic{width:12px;height:12px;vertical-align:-2px;margin-right:3px}

/* 学院后台：卡片/页签上的 ✎（修改·移动·删除 入口） */
.ac-editb{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:6px;border:1px solid var(--line);
  background:#fff;color:#3b4a63;font-size:11px;line-height:1;cursor:pointer;opacity:.92;z-index:2;
  box-shadow:0 1px 3px rgba(15,23,42,.12)}
.ac-card:hover .ac-editb,.ac-gwrap:hover .ac-editb{opacity:1;background:#eef4fb;color:#1e7fd0}
.ac-gwrap{position:relative;display:inline-block}
.ac-editb.g{top:-5px;right:-9px;width:18px;height:18px}
.ac-card{position:relative}

/* ══════════ 数据记录 · 职业小镇 ══════════ */
.tw-town{--tw:#2f9bec;--twbg:#eef4fb;--twbd:#d6e8fa}
.tw-town[data-town="风铃旅社"]{--tw:#2B66CC;--twbg:#EAF1FC;--twbd:#c9dcf5}
.tw-town[data-town="彩虹画室"]{--tw:#E8427F;--twbg:#FDEFF5;--twbd:#f9d2e2}
.tw-town[data-town="迷雾侦探所"]{--tw:#5B6B7F;--twbg:#F1F4F8;--twbd:#dde4ec}
.tw-town[data-town="星尘魔法塔"]{--tw:#7A5CF0;--twbg:#F2EEFE;--twbd:#ddd2fb}
.tw-town[data-town="咕噜厨房"]{--tw:#E8842F;--twbg:#FDF3E8;--twbd:#f7dcbe}
.tw-town[data-town="竹影武馆"]{--tw:#22A06B;--twbg:#EAF8F1;--twbd:#c5e8d6}
.tw-town[data-town="云朵梦舍"]{--tw:#0EA5E9;--twbg:#E9F6FC;--twbd:#c6e6f5}
.tw-town[data-town="闪耀星屋"]{--tw:#C9941C;--twbg:#FCF5E3;--twbd:#f0e0b5}
.tw-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.tw-hidtag{display:inline-block;font-size:10px;background:#fff;border:1px solid var(--line);color:#9aa5b1;
  border-radius:999px;padding:0 6px;margin-left:6px;font-weight:400;vertical-align:1px;font-style:normal}
.tw-tab.tw-dim{opacity:.62}
.tw-tab.tw-dim:hover,.tw-tab.tw-dim.on{opacity:1}
.tw-ladder{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:12px}
.tw-chip{display:inline-flex;align-items:center;gap:4px;background:var(--twbg);border:1px solid var(--twbd);
  color:var(--tw);font-weight:700;font-size:12.5px;border-radius:999px;padding:3px 11px}
.tw-chip i{font-style:normal;font-size:10.5px;font-weight:600;opacity:.72}
.tw-arrow{color:#b6c1ce;font-size:12px}
.tw-town .ac-gtab{color:#4a5a6e}
.tw-town .ac-gtab:hover{background:var(--twbg);color:var(--tw)}
.tw-town .ac-gtab.on{background:var(--tw);border-color:var(--tw);color:#fff}
.tw-town .ac-gtab i{font-style:normal;opacity:.75;font-size:10.5px;margin-left:6px}
/* 明细面板：工作名称做表头（大字），星级做行分组，金币是主角数字 */
.tw-panel{margin-bottom:2px}
.tw-matrix{width:100%;border-collapse:separate;border-spacing:0;background:#fff;
  border:1px solid var(--twbd);border-radius:12px;overflow:hidden;table-layout:fixed;
  box-shadow:0 1px 3px rgba(30,60,110,.05)}
.tw-matrix th,.tw-matrix td{overflow:hidden}
.tw-matrix thead th{background:#fff;border-bottom:1px solid var(--twbd);
  padding:11px 12px 9px;vertical-align:top;text-align:center}
.tw-matrix thead th.tw-starhd{background:#fff;width:70px;border-bottom-color:var(--twbd);
  color:var(--tw);font-size:11.5px;font-weight:700;padding:11px 4px}
/* 待开放阶段（大师）占位面板 */
.tw-soon{background:#fff;border:1px dashed var(--twbd);border-radius:12px;padding:26px 24px;
  text-align:center;display:flex;flex-direction:column;gap:7px}
.tw-soon b{font-size:14px;color:var(--tw)}
.tw-soon span{font-size:12.5px;color:#8592a6}
.tw-jname{display:inline-block;background:var(--twbg);border:1px solid var(--twbd);color:#2b3440;
  border-radius:8px;padding:3px 10px;font-weight:800;font-size:13px;max-width:100%;
  line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tw-head{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 6px}
.tw-head .tw-time{font-size:11px;padding:1px 7px}
.tw-work{display:block;margin-top:7px;font-size:12.5px;color:#5b6675;font-weight:700}
.tw-work b{color:var(--tw);font-size:15px;font-family:var(--mono)}
.tw-work b.cut{color:#d0342c}
.tw-cost{display:block;margin-top:2px;font-size:11px;color:#9aa5b1}
.tw-gic{width:14px;height:14px;object-fit:contain;margin-right:4px;vertical-align:-2px}
.tw-jic{width:22px;height:22px;object-fit:contain;margin-right:6px;vertical-align:-5px}
.tw-time{display:inline-block;background:var(--twbg);border:1px solid var(--twbd);color:var(--tw);
  font-weight:700;border-radius:999px;padding:1px 8px;font-size:11px}
.tw-matrix tbody td{padding:8px 12px;border-bottom:1px solid #eef1f5;text-align:center;
  font-family:var(--mono);font-weight:700;font-size:14px;color:#2b3440;white-space:nowrap;
  transition:background .12s}
.tw-gline{display:inline-flex;align-items:baseline;justify-content:center;gap:5px}
.tw-gcoin{display:inline-flex;align-items:baseline;justify-content:flex-end;gap:5px;min-width:62px;
  font-variant-numeric:tabular-nums}
.tw-matrix tbody td.tw-star{text-align:center}
.tw-matrix tbody td.tw-star,.tw-matrix thead th.tw-starhd{text-align:center}
.tw-matrix thead th.tw-starhd{vertical-align:middle}
.tw-matrix tbody tr:nth-child(even) td{background:#fafcfe}
.tw-matrix tbody tr:hover td{background:var(--twbg)}
.tw-matrix tbody tr:last-child td{border-bottom:none}
.tw-star{color:var(--tw);text-align:center;width:70px;font-family:inherit}
/* 首列(星级)行线跟表体一致：不再单独用主题色/不透明的横线，直接跟随 td 默认的浅灰 */
.tw-matrix tbody td.tw-star{border-bottom-color:#eef1f5}
.tw-star b{font-size:16px}
.tw-star i{font-style:normal;font-size:11px;opacity:.7;margin-left:2px}
.tw-gold{cursor:default}
.tw-matrix thead th.tw-edit{cursor:pointer}
.tw-matrix thead th.tw-edit:hover{background:var(--twbg)}
.tw-matrix thead th.tw-edit:hover .tw-jname{border-color:var(--tw)}
.tw-matrix tbody td.tw-edit{cursor:pointer}
.tw-matrix tbody td.tw-edit:hover .tw-gdig{text-decoration:underline dotted;text-underline-offset:3px}
.tw-matrix thead th.tw-edit.sel,.tw-matrix tbody td.tw-edit.sel{background:var(--twbg)!important;box-shadow:inset 0 0 0 2px var(--tw)}
.tw-gold.hi{color:#E8842F}
.tw-gold.cut{color:#d0342c}
.tw-delta{display:inline-block;width:46px;text-align:left;font-family:var(--mono);font-weight:600;
  font-size:10.5px;letter-spacing:.2px}
.tw-delta.up{color:#d0342c}
.tw-delta.down{color:#1f8a4c}
.tw-delta.flat{color:#9aa5b1}
.tw-gold.cut .tw-delta{opacity:.7}
.tw-ic{width:14px;height:14px;object-fit:contain;margin-right:4px;vertical-align:-2px}

/* ── 前台「职业小镇」：结构同用户 Excel（星级合并列 / 工时行 / 三列小镇 / 折合4h），视觉按网站做法：
   去网格线、星级块做成色块标签 + 块间留白、数字做层级、涨幅做小徽标 ── */
.ts-mod{padding:0 0 12px}
.ts-mod .sheet-hd{padding:10px 14px 2px}
.ts-mod .sheet-hd .muted{font-size:11.5px;font-weight:600;margin-left:8px}
.ts-cap{max-width:820px;margin:0 auto}   /* 分享长图按 820px 出图，手机点开刚好整屏 */
.ts-cap--wide{max-width:none;margin:0}   /* 后台宽版：占满内容区，不受长图宽度限制 */
/* 职业小镇 · 手机端卡片（≤720px）：每个星级一块卡，时长行 + 三档金币（标签=桌面表头小镇名） */
.ts-mcards{flex-direction:column;gap:12px;margin:2px 0 0}
@media (max-width:720px){ .ts-mcards{display:flex} }
#capture.capturing .ts-mcards{display:none !important}
.tsm{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.tsm-hd{padding:7px 11px;background:var(--c10,#f1f6fb);border-bottom:1px solid #eef2f7;font-weight:800;font-size:13px;color:var(--c)}
.tsm-r{padding:8px 11px;border-top:1px solid #eef2f7}
.tsm-r:first-child{border-top:0}
.tsm-dur{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:800;font-size:13px;color:#334155}
.tsm-dur .tsm-gong{font-weight:700;font-size:12.5px;color:#5b6675}
.tsm-line{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-top:3px}
.tsm-k{flex:1 1 auto;min-width:0;font-size:12px;color:#8a94a6;line-height:1.35}
.tsm-v{flex:0 0 auto;font-size:12.5px;font-weight:700;color:#334155;font-variant-numeric:tabular-nums}
.tsm-v .ts-gd{display:inline-block;margin-left:4px;padding:0 3px}
.tsm-fold .tsm-k{color:#7b8798}
.tsm-fold .tsm-v{color:#5b6675}
.ts-tablewrap{padding:0 12px}
.ts-t{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:12.5px;background:transparent}
.ts-t th,.ts-t td{text-align:center;vertical-align:middle;font-family:inherit;font-variant-numeric:tabular-nums;
  padding:5px 8px;border:0}
/* 表头：只有一条淡线，没有竖线 */
.ts-t thead th{color:#5b6675;font-weight:800;font-size:11.5px;line-height:1.45;
  padding:6px 8px 7px;border-bottom:1px solid #e6ebf2}
.ts-t thead th:first-child{border-top-left-radius:12px}
.ts-t thead th:last-child{border-top-right-radius:12px}
.ts-t thead th.l{text-align:center}
.ts-hjobs{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:2px 14px;width:100%;margin:4px 0 0;padding-right:10px}
.ts-pair{display:grid;grid-template-columns:62px 58px;justify-content:end;align-items:center;gap:5px;
  white-space:nowrap;padding:0}
.ts-pair.ts-one{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;gap:2px;justify-items:center}
.ts-pair.ts-one .ts-jobchip{width:auto;min-width:52px}
.ts-townname{font-size:10.5px;font-weight:700;color:#334155;white-space:nowrap;width:100%;
  text-align:justify;text-align-last:justify;text-justify:distribute-all-lines}   /* 4/5 个字都撑满 → 两端对齐 */
.ts-jobchip{display:block;box-sizing:border-box;width:100%;text-align:justify;text-align-last:justify;
  font-style:normal;font-size:10px;font-weight:800;line-height:1.55;padding:0 3px;border-radius:6px;
  color:var(--tc,#3b4a63);background:var(--tcbg,#eef4fb);border:1px solid var(--tcbd,#d6e8fa);white-space:nowrap}
.ts-job{font-size:10px;font-weight:600;color:#7c8798;text-align:right}   /* 职业名靠右 → 与镇名两端对齐 */
.ts-sep{color:#c8d1dc;font-weight:800;font-style:normal;margin-left:3px}
/* 行：只有极淡的下边线；星级块之间用留白行隔开（模块感） */
.ts-t tbody tr.ts-row td{border-bottom:1px solid #f6f8fb}
.ts-t tbody tr.ts-row.ts-alt td{background:var(--cz,#f9fbfd)}           /* 隔行：阶段色最浅一档（与首列同色系） */
.ts-t tbody tr.ts-row:hover td{background:#fbfdff}
.ts-gap td{height:7px;padding:0 !important}
/* 星级 = 色块标签（左侧色条 + 淡底 + 主题色文字） */
.ts-sg{text-align:center;width:8%;background:var(--c9,#f7f9fc)}
.ts-sgp{font-size:12.5px;font-weight:800;color:var(--c,#E8842F);white-space:nowrap;letter-spacing:.2px}
.ts-dur{text-align:center;color:#475569}
.ts-dur b{font-weight:800;font-size:12.5px;color:#1f2a37}
.ts-flag{font-style:normal;font-size:9px;font-weight:800;color:#b45309;background:#fff7ed;
  border:1px solid #fde3b8;border-radius:999px;padding:0 6px;margin-left:7px;white-space:nowrap}
.ts-dur b.ts-hot{color:#b45309}
.ts-hotup{font-style:normal;font-size:10px;font-weight:900;color:#b45309;margin-left:3px}
.ts-gong{color:#334155;font-weight:800;font-size:12.5px}
.ts-t td.num{color:#0f172a;font-weight:800;font-size:13px;letter-spacing:.1px}
/* 金币/工分格：定宽块居中；图标固定在块首、数字紧贴其右，涨幅占剩余列靠右 → 一列里图标成列 */
.ts-mv{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:5px;width:100%;max-width:112px;margin:0 auto}
.ts-mvr{margin:0 10px 0 auto}   /* 金币格右对齐：与表头清单同一条线 */
.ts-mv1{grid-template-columns:auto}
.ts-mv .ts-gd{justify-self:start;margin-left:4px}
.ts-mv u{text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.ts-gn{display:inline-flex;align-items:center;gap:3px;justify-content:flex-start;white-space:nowrap}
.ts-mv .ts-ic{margin-right:0}
/* 涨幅：小徽标，不喧宾夺主 */
.ts-gd{display:block;box-sizing:border-box;text-align:right;font-style:normal;
  font-size:9.5px;font-weight:800;border-radius:999px;line-height:1.6;white-space:nowrap}
.ts-gd:empty{display:none}
.ts-gd.up{color:#c62f27;background:#fef2f1}
.ts-gd.down{color:#1f8a4c;background:#f0fbf4}
.ts-gd.flat{color:#94a3b8;background:#f5f7fa}
/* 折合4h：金币区间为主、工分为小字 */
.ts-fold{text-align:center}
.ts-fold b{font-size:12.5px;font-weight:800;color:#0f172a;display:inline-flex;align-items:baseline;white-space:nowrap}
.ts-fold .ts-fl{display:grid;grid-template-columns:14px 26px minmax(0,1fr);align-items:center;gap:3px;min-width:104px}
.ts-fold .ts-fl i{font-style:normal;font-size:10px;font-weight:700;color:#94a3b8}
.ts-fold .ts-ic{margin-right:0}
.ts-up{font-style:normal;font-size:11px;font-weight:900;color:#0f766e;margin-left:3px;vertical-align:1px}


.ts-ic{width:12px;height:12px;object-fit:contain;vertical-align:-2px;margin-right:3px;opacity:.9}
.ts-ti{color:#c2cbd6;margin:0 2px}
.ts-soon{margin:2px 12px 12px;background:#fff;border:1px dashed var(--twbd,#d6e8fa);border-radius:12px;
  padding:26px 24px;text-align:center;display:flex;flex-direction:column;gap:7px}
.ts-soon b{font-size:14px;color:var(--tw,#E8842F)}
.ts-soon span{font-size:12.5px;color:#8592a6}
.ts-fatseg{display:inline-flex;align-items:center;gap:4px;background:#f7f9fc;border:1px solid var(--line);border-radius:10px;padding:2px 6px}
.ts-fatcap{font-style:normal;font-size:11px;font-weight:800;color:#3b4a63;margin-right:2px}
.ts-fatseg .pk-btn{font-size:11px;padding:3px 8px;border-radius:7px;background:#fff}
.ts-fatseg .pk-btn.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:800}   /* 选中态别被上面的白底盖掉 */
.ts-notes{padding:0 14px 12px}
.ts-notes .sh-hint{font-size:10px;line-height:1.7}
@media (max-width:900px){
  .ts-mod .sheet-hd .muted{display:block;margin:2px 0 0}
  .ts-t{font-size:11.5px}
  .ts-t th,.ts-t td{padding:8px 6px}
  .ts-jobchip{font-size:9px}
  .ts-pair{grid-template-columns:50px 52px;gap:4px}
  .ts-t td.num{font-size:12px}
}
/* 学院表：隔行底色用学院色最浅一档 */
.aca .aca-t tbody tr.data:nth-child(odd) td{background:var(--cz,#f7fafc)}
.aca .aca-t tbody tr.data:nth-child(even) td{background:#fff}

/* 宠物等级 · 每日经验任务（模块内的小列表 + 相对条） */
.plc-tasks{display:flex;flex-direction:column;gap:6px;margin:2px 0 4px}
.plc-task{display:grid;grid-template-columns:20px minmax(0,1fr) 90px 44px;align-items:center;gap:8px}
.plc-no{width:20px;height:20px;border-radius:50%;background:#eef4fb;color:#1e7fd0;font-style:normal;
  font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
.plc-tname{font-size:12.5px;color:#334155;font-weight:600}
.plc-tname em{font-style:normal;font-size:10.5px;color:#94a3b8;margin-left:6px}
.plc-tbar{height:7px;border-radius:999px;background:#f1f5f9;overflow:hidden}
.plc-tbar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#7cc4ff,#2f9bec)}
.plc-tcap{font-size:13px;font-weight:800;color:#0f766e;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:560px){ .plc-task{grid-template-columns:20px minmax(0,1fr) 60px 36px;gap:6px} }

/* ══════════ 数据记录 · 职业树 ══════════ */
.jt-town .ac-tab{display:inline-flex;align-items:center}
.jt-line{font-size:11px;color:#8a94a6;margin-left:6px;font-weight:500}
.jt-matrix{width:100%;border-collapse:separate;border-spacing:0;background:#fff;table-layout:fixed;
  border:1px solid var(--twbd);border-radius:12px;overflow:hidden;box-shadow:0 1px 3px rgba(30,60,110,.05)}
.jt-matrix th,.jt-matrix td{padding:10px 12px;border-bottom:1px solid #eef1f5;vertical-align:middle}
.jt-matrix thead th{background:var(--twbg);color:var(--tw);font-size:12.5px;font-weight:700;text-align:left;
  border-bottom:1px solid var(--twbd);white-space:normal;line-height:1.35}
.jt-c-stage{width:64px}.jt-c-job{width:186px}.jt-c-attr{width:236px}.jt-c-star{width:276px}
.jt-c-total{width:128px}.jt-c-gold{width:112px}.jt-c-pre{width:120px}
.jt-matrix tbody tr{height:66px}
.jt-matrix tbody tr:last-child td{border-bottom:none}
.jt-matrix tbody tr:hover td{background:#fafcff}
.jt-stage{width:70px;text-align:center!important}
.jt-matrix td.jt-stage{color:var(--tw);font-weight:700}
.jt-job{width:190px}
.jt-matrix td.jt-job{font-weight:700;font-size:13.5px;color:#2b3440;white-space:nowrap}
.jt-ic{width:26px;height:26px;object-fit:contain;vertical-align:-7px;margin-right:7px}
.jt-matrix td.jt-attrs{white-space:nowrap}
.jt-attr{display:inline-flex;align-items:center;gap:3px;font-family:var(--mono);font-weight:700;font-size:13px;
  background:#f7f9fc;border:1px solid var(--line);border-radius:8px;padding:2px 8px;color:#2b3440;
  margin-right:6px;vertical-align:middle}
.jt-attr img{width:14px;height:14px;object-fit:contain}
.jt-attr.off{opacity:.38}
.jt-matrix td.jt-stars{white-space:normal}
.jt-star{display:inline-flex;align-items:baseline;gap:3px;background:#fff;border:1px solid var(--twbd);
  border-radius:999px;padding:1px 7px;font-family:var(--mono);font-weight:700;font-size:11.5px;color:#2b3440;
  margin:0 4px 2px 0}
.jt-star i{font-style:normal;color:var(--tw);font-size:11px}
.jt-matrix td.jt-total{font-family:var(--mono);font-weight:700;color:#2b3440}
.jt-matrix td.jt-total b{font-size:14px}
.jt-next{display:block;font-size:11px;color:#8a94a6;font-family:inherit;font-weight:500;margin-top:2px}
.jt-matrix td.jt-gold{font-family:var(--mono);font-weight:700;font-size:13.5px;color:#2b3440;white-space:nowrap}
.jt-matrix td.jt-gold img{width:14px;height:14px;object-fit:contain;margin-right:4px;vertical-align:-2px}
.jt-matrix td.jt-pre{font-size:12.5px;color:#5b6675}
.jt-note{margin-top:6px;font-size:12px;color:#9aa5b1}
.jt-rules{margin-top:12px;border:1px solid var(--line);border-radius:14px;background:#fff;padding:0;overflow:hidden;
  box-shadow:0 2px 10px rgba(15,23,42,.04)}
.jt-rules-hd{font-weight:700;font-size:13px;color:#2b3440;padding:10px 14px;
  background:linear-gradient(#f7f9fc,#fdfeff);border-bottom:1px solid var(--line)}
.jt-rules-ol{margin:0;padding:11px 16px 11px 36px;font-size:12.5px;color:#5b6675;line-height:1.7}
.jt-rules-ol li{margin-bottom:3px}
.jt-rules-ol li::marker{color:#9aa5b1;font-weight:700}
.jt-npc{margin:0;padding:11px 16px;display:flex;flex-wrap:wrap;gap:7px 10px;font-size:12px;color:#5b6675;
  border-top:1px dashed var(--line);background:#fcfdff}
.jt-npc-item{background:#f4f7fb;border:1px solid var(--line);border-radius:999px;padding:3px 12px;color:#5b6675}
.jt-notes-ft{padding:0 16px 12px}
/* 职业树：游戏同款 8 列 × 5 行图标树（照游戏实图：表头只有文字 · 节点圆角六边形 · 竖线串联 · 空阶段留白） */
.jt-tree{display:grid;grid-template-columns:92px repeat(8,minmax(0,1fr));gap:0;
  --jt-hex:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%);
  --jt-hex-in:polygon(42.09% 10%,32.24% 15%,22.79% 20%,14.58% 25%,10.68% 30%,8.62% 35%,8.21% 40%,8.21% 45%,8.21% 50%,8.21% 55%,8.21% 60%,8.42% 65%,10.27% 70%,14.17% 75%,21.97% 80%,30.8% 85%,41.07% 90%,58.73% 90%,68.99% 85%,77.82% 80%,85.63% 75%,89.53% 70%,91.38% 65%,91.79% 60%,91.79% 55%,91.79% 50%,91.79% 45%,91.79% 40%,91.17% 35%,89.12% 30%,85.22% 25%,77% 20%,67.56% 15%,57.7% 10%);
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:5px 4px 8px;overflow:hidden;
  --jt-pt:7px;--jt-pb:4px}   /* 格子上下内边距：竖线的两段长度就按它算，改这里两边一起变 */
.jt-tree-hd{display:contents}
/* 表头 = 「职业小镇」那一行：给底色高亮，角落的「阶段＼职业线」不再是孤立白格 */
.jt-corner{display:flex;align-items:flex-end;justify-content:center;font-size:10.5px;color:#8a94a6;
  white-space:nowrap;background:#e9eef5;padding:5px 4px 6px;border-bottom:1px solid var(--line)}
.jt-colhd{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;
  padding:10px 5px 9px;border-bottom:1px solid var(--line);min-height:46px;background:var(--twbg)}
.jt-colhd b{font-size:13.5px;color:var(--tw);letter-spacing:.3px}
/* 表头下面的「职业小镇」名：白底药丸 + 描边，在表头底色上明显高亮出来 */
/* 表头下面的「职业小镇」名：加底色高亮（分享版用该镇浅色主题底 --jttint，后台没有则白底） */
.jt-colhd-sub{font-size:11.5px;color:#4a5563;background:var(--jttint,#fff);
  border:1px solid var(--jtbd,var(--line));border-radius:999px;padding:1px 10px;line-height:17px;white-space:nowrap}
/* 图标（职业/勋章）只作展示：不允许右键「图片另存为」、不允许拖拽保存、不允许选中
   原理：pointer-events:none 后右键命中的是父元素（卡片/按钮），浏览器右键菜单里就没有「图片另存为」这一项。
   注意：这只能挡随手另存，挡不住截图 / F12 抓地址；父元素上的点击（点图标弹窗）不受影响。 */
.jt-ic,.jt-icb img,.tw-jic,.mdh-item img,.md-thumb img,.jt-card .jt-coin,.jt-attr img{
  pointer-events:none;-webkit-user-drag:none;user-drag:none;-webkit-user-select:none;user-select:none}
.jt-row{display:contents}
.jt-rowlb{display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#6b7686;
  border-right:1px solid var(--line)}
.jt-cell{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:var(--jt-pt) 5px var(--jt-pb)}
/* 竖线只画在「文字以外」的两段：节点上方一小段（进入节点后即被不透明六边形盖住）+ 格底内边距
   —— 不再贯穿整格，避免从职业名/属性/工分/前置的文字上穿过去（穿模）。两段在相邻两格拼成一条连线 */
.jt-cell::before{content:"";position:absolute;left:50%;top:0;height:calc(var(--jt-pt) + 34px);width:2px;background:#e3e8ef;transform:translateX(-50%)}
.jt-cell::after{content:"";position:absolute;left:50%;bottom:0;height:var(--jt-pb);width:2px;background:#e3e8ef;transform:translateX(-50%)}
/* 没有职业的「空档」（如流浪散人没有初级/中级，见习直通万象宗师）：竖线贯穿整格，
   让上下两个职业连成一条直线（格内没有文字，穿不到任何东西） */
.jt-cell.jt-blank::before{top:0;bottom:0;height:auto}
.jt-cell.jt-blank::after{display:none}
.jt-cell>*{position:relative;z-index:1}
.jt-first .jt-cell::before{display:none}
.jt-node{position:relative;width:min(56px,100%);height:auto;aspect-ratio:122/130;padding:0;border:0;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:transform .12s}
.jt-node .jt-ic{width:100%;height:100%;margin:0;vertical-align:0;display:block}
.jt-node:hover{transform:translateY(-3px)}
/* 选中态：沿六边形形状外扩一圈主题色（不是方形 outline） */
.jt-node.sel::before{content:"";position:absolute;inset:-4px;background:var(--tw);clip-path:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%);-webkit-clip-path:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%);z-index:-1}
/* 未现世/大师：游戏同款圆角六边形（2px 外框 + 浅灰底 + 灰问号） */
.jt-hex-note{}
.jt-node.jt-off{position:relative;cursor:default;transform:none;background:#dde4ec;
  aspect-ratio:122/130;clip-path:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%);-webkit-clip-path:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%)}
.jt-node.jt-off::after{content:"";position:absolute;inset:0;background:#f1f5f9;clip-path:polygon(42.09% 10%,32.24% 15%,22.79% 20%,14.58% 25%,10.68% 30%,8.62% 35%,8.21% 40%,8.21% 45%,8.21% 50%,8.21% 55%,8.21% 60%,8.42% 65%,10.27% 70%,14.17% 75%,21.97% 80%,30.8% 85%,41.07% 90%,58.73% 90%,68.99% 85%,77.82% 80%,85.63% 75%,89.53% 70%,91.38% 65%,91.79% 60%,91.79% 55%,91.79% 50%,91.79% 45%,91.79% 40%,91.17% 35%,89.12% 30%,85.22% 25%,77% 20%,67.56% 15%,57.7% 10%);-webkit-clip-path:polygon(42.09% 10%,32.24% 15%,22.79% 20%,14.58% 25%,10.68% 30%,8.62% 35%,8.21% 40%,8.21% 45%,8.21% 50%,8.21% 55%,8.21% 60%,8.42% 65%,10.27% 70%,14.17% 75%,21.97% 80%,30.8% 85%,41.07% 90%,58.73% 90%,68.99% 85%,77.82% 80%,85.63% 75%,89.53% 70%,91.38% 65%,91.79% 60%,91.79% 55%,91.79% 50%,91.79% 45%,91.79% 40%,91.17% 35%,89.12% 30%,85.22% 25%,77% 20%,67.56% 15%,57.7% 10%)}
.jt-node.jt-off>span{position:relative;z-index:2;font-size:23px;font-weight:800;color:#aab4c2;line-height:1}
/* 已有职业但还没配图标（如「大师」及以后新开的阶段）：主题色六边形 + 职业名首字 */
.jt-node.jt-noph{background:var(--tw);clip-path:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%);-webkit-clip-path:polygon(46.11% 0%,33.88% 5%,25.34% 10%,15.66% 15%,7.99% 20%,4.11% 25%,1.6% 30%,0.16% 35%,0% 40%,0% 45%,0% 50%,0% 55%,0% 60%,0.07% 65%,1.42% 70%,3.61% 75%,7.49% 80%,15.1% 85%,23.65% 90%,33.26% 95%,45.14% 100%,54.86% 100%,66.74% 95%,76.35% 90%,84.9% 85%,92.51% 80%,96.39% 75%,98.58% 70%,99.93% 65%,100% 60%,100% 55%,100% 50%,100% 45%,100% 40%,99.84% 35%,98.4% 30%,95.89% 25%,92.01% 20%,84.34% 15%,74.66% 10%,66.12% 5%,53.89% 0%);display:flex;align-items:center;justify-content:center}
.jt-node.jt-noph>span{font-size:22px;font-weight:800;color:#fff;line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.18)}
/* 生成长图时：html2canvas 不渲染 clip-path，六边形会渲染成方块 → capturing 期间改用 PNG 六边形兜底 */
#capture.capturing .jt-node.jt-off{clip-path:none !important;-webkit-clip-path:none !important;
  background:url(/assets/hex-off.png) center/100% 100% no-repeat !important}
#capture.capturing .jt-node.jt-off::after{display:none !important}
/* 弹窗里的条件编辑表单 */
.jt-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px 14px;margin-bottom:10px}
.jt-f{display:flex;align-items:center;gap:8px;margin:0;font-size:12.5px;font-weight:600;color:#5b6675}
.jt-f>span{flex:0 0 auto;display:inline-flex;align-items:center;gap:4px;min-width:52px}
.jt-f-wide{grid-column:1/-1}
.jt-f input{flex:1 1 auto;min-width:0;width:auto;padding:6px 9px;border:1px solid var(--line);
  border-radius:8px;font-size:13px;font-family:inherit;background:#fff}
.jt-f input:focus{outline:2px solid #cfe3ff;border-color:#8bbcff}
.jt-aic{width:15px;height:15px;object-fit:contain;margin-right:1px}
.jt-ftitle{font-size:12px;font-weight:700;color:#8592a6;margin:2px 0 8px}
.jt-ta{width:100%;padding:6px 9px;border:1px solid var(--line);border-radius:8px;
  font:inherit;font-size:13px;color:var(--txt);background:#fff;line-height:1.55;resize:vertical}
.jt-hint{font-size:12px;color:#8592a6;background:#f6f8fb;border:1px solid var(--line);
  border-radius:8px;padding:7px 10px;margin-top:2px}
/* 弹窗标题栏右上角的对应图标（职业编辑 = 职业图标；勋章 = 勋章图） */
.hdic{display:none;width:42px;height:44px;align-items:center;justify-content:center;margin-right:8px}
.hdic.on{display:inline-flex}
.hdic img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(70,45,10,.18))}
/* 弹窗可拖动（脚本在后台公共 footer）：拖动中加投影、禁选文字；cursor 由脚本按弹窗加，不影响前台弹窗 */
.modal.dragging{box-shadow:0 24px 60px rgba(20,32,48,.34);user-select:none}
/* 升星工分那几颗「N★」：黄色、比普通字段名大一号 */
.jt-fk.jt-fstar{color:#F2C14E;font-size:15px;font-weight:800;letter-spacing:1px;min-width:34px}
/* 底部说明：直接在页面上填（原「✎ 修改说明」弹窗已合并到这里） */
.jt-notes{margin-top:10px}
.jt-te{display:block;width:100%;box-sizing:border-box;border:1px dashed #dbe3ec;border-radius:8px;background:#fff;
  padding:5px 9px;font:inherit;font-size:12.5px;line-height:1.55;color:#5b6675;resize:vertical;overflow:hidden;min-height:28px}
.jt-te:focus{outline:2px solid #cfe3ff;border-color:#8bbcff;border-style:solid}
.jt-te::placeholder{color:#b6bfc9}
.jt-te-1{color:#9aa5b1}
.jt-rules-ol .jt-te{margin:2px 0}
.jt-npc .jt-te{flex:1 1 200px;width:auto}
.jt-notes-ft{display:flex;align-items:center;gap:10px;margin-top:8px}
.jt-notes-ft #ntMsg{font-size:12.5px}
.jt-notes-ft .btn{margin-left:auto}
/* 说明弹窗已合并进页面，nsec 只在有权限的老标记里可能残留 */
.jt-nsec{font-size:12.5px;font-weight:700;color:#5b6675;margin:14px 0 9px;padding-bottom:5px;
  border-bottom:1px solid var(--line)}
.modal textarea{width:100%;padding:6px 9px;border:1px solid var(--line);border-radius:7px;
  font:inherit;font-size:13px;color:var(--txt);background:#fff;line-height:1.55;resize:vertical}
.err{color:#d0342c;font-weight:600}

.jt-name{font-size:11.5px;font-weight:700;color:var(--tw);background:var(--twbg);border:1px solid var(--twbd);
  border-radius:999px;padding:2px 10px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;
  box-sizing:border-box}
.jt-name-off{color:#b6c1ce;background:#f7f9fc;border-color:#e6eaf0;font-weight:500}
/* 职业树单元格：职业名下方 = 三项属性值 + 该阶段工分总额
   （窄容器下允许换行/收紧，否则会把 .jt-cell 撑破 → 相邻列穿模） */
.jt-cattrs{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 8px;max-width:100%;
  margin-top:1px;font-family:var(--mono);font-size:11px;font-weight:700;line-height:1.3}
.jt-cattrs b{font-weight:700}
.jt-cp{color:#E8842F}
.jt-ci{color:#2B66CC}
.jt-cc{color:#3DB463}
.jt-cattrs b.off{opacity:.3}
.jt-creq{display:flex;flex-wrap:wrap;justify-content:center;gap:3px 8px;margin-top:1px;font-family:var(--mono);font-size:11px;font-weight:700;color:#5b6675;line-height:1.3}
.jt-g{display:inline-flex;align-items:center;gap:3px}
.jt-pre{display:block;margin-top:3px;font-size:11px;color:#8a94a6;font-weight:600;line-height:1.3}
.jt-g img{width:10px;height:10px;object-fit:contain}
/* 分享版整页宽度上限：列宽收到「内容刚好放得下」，列间空隙变小、长图更窄（手机上缩得更少） */
.jt-sheet{max-width:820px;margin:0 auto}
/* 分享版职业树（前台 channel.php?t=tree）：除职业图标外一律常规色 —— 主题色变量统一压成深灰/白底
   （列头文字 / 职业名药丸 / 兜底六边形都吃 --tw·--twbg·--twbd；三项属性数值单独压成同一灰） */
.jt-tree.jt-plain{--tw:#2b3440;--twbg:#fff;--twbd:#e3e8ef}
.jt-plain .jt-cattrs b{color:#4a5563}
.jt-plain .jt-corner{background:#f7f9fc}
.jt-plain .jt-colhd{background:#f7f9fc}   /* 分享版：表头保持浅灰（高亮只加在「职业小镇」名上） */
/* 职业树整卡：游戏同款暖棕（表头带 + 表体 + 底部小字）。
   色值取自游戏实图采样：#5d4340 → #7a5a52 → #8a6a5e；仅分享版职业树页（.jt-sheet），不影响后台编辑器 */
.jt-sheet .card{background:#6e4f4a;border-color:#4a3634}
.jt-sheet .jt-tree.jt-plain{background:transparent;border-color:rgba(255,255,255,.12)}
.jt-plain .jt-corner,
.jt-plain .jt-colhd{background:transparent;border-bottom-color:transparent}
.jt-plain .jt-corner{color:#e8dcd6;border-top-left-radius:11px}
.jt-plain .jt-colhd b{color:#fff}
.jt-plain .jt-colhd-sub{background:rgba(255,255,255,.94);border-color:transparent}
.jt-plain .jt-tree-hd>.jt-colhd:last-child{border-top-right-radius:11px}
.jt-plain .jt-rowlb{color:#f0e4de;border-right-color:rgba(255,255,255,.14)}
.jt-plain .jt-cell::before,.jt-plain .jt-cell::after{background:rgba(255,255,255,.26)}
.jt-plain .jt-cattrs b{color:#f0e4de}
.jt-plain .jt-creq{color:#f0e4de}
.jt-sheet .jt-note{color:#e8dcd6}
/* 职业树 · 手机端卡片（≤720px）：每条职业线一张卡，阶段节点竖排；桌面与长图截图仍是 8 列树 */
.jt-mcards{display:none;flex-direction:column;gap:10px;margin:2px 0 0}
@media (max-width:720px){ .jt-mcards{display:flex} }
#capture.capturing .jt-mcards{display:none !important}
.jtm{border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.jtm-hd{display:flex;align-items:center;gap:8px;padding:8px 11px;background:var(--jttint,#f7f9fc);
  border-bottom:1px solid var(--jtbd,var(--line))}
.jtm-hd b{font-size:13.5px;color:#334155}
.jtm-hd span{font-size:11.5px;color:#4a5563;background:#fff;border:1px solid var(--jtbd,var(--line));
  border-radius:999px;padding:0 8px;line-height:16px}
.jtm-r{display:flex;gap:10px;padding:9px 11px;border-top:1px solid #eef2f7}
.jtm-r:first-child{border-top:0}
.jtm-ic{flex:0 0 46px;width:46px;display:flex;align-items:center;justify-content:center;
  border:0;background:transparent;padding:0;font:inherit;cursor:pointer}
.jtm-ic img{width:100%;height:auto;display:block}
.jtm-ic>span{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;
  background:var(--tw,#2b3440);color:#fff;font-weight:800;font-size:18px}
.jtm-ic-off>span{background:#e6ebf2;color:#aab4c2}
.jtm-bd{flex:1 1 auto;min-width:0}
.jtm-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.jtm-stage{font-size:11px;color:#8592a6;font-weight:700}
.jtm-job{font-size:13.5px;font-weight:800;color:#2b3440}
.jtm-star{font-size:11px;color:#F2C14E;letter-spacing:1px}
.jtm-meta{display:flex;gap:12px;margin-top:3px;font-size:12px;font-weight:700}
.jtm-req{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:3px;font-size:12px;color:#5b6675}
.jtm-off .jtm-job-off{color:#b6c1ce;font-weight:600}
.jt-mrow{display:flex;gap:12px;padding:11px 2px;border-bottom:1px solid var(--line);align-items:center}
.jt-mrow:last-child{border-bottom:none}
.jt-mk{flex:0 0 88px;color:#6b7686;font-size:13px;font-weight:600}
.jt-mv{flex:1;display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13.5px;color:#2b3440}
.jt-mnum{font-family:var(--mono);font-weight:800;font-size:15px}
.jt-coin{width:15px;height:15px;object-fit:contain;margin-right:3px;vertical-align:-2px}
/* 前台「点职业图标」弹窗：照游戏职业弹窗做（奶油底卡片 · 图标压顶 · 居中职业名与星级 · 灰标签行） */
.modal.jt-card{position:relative;width:320px;max-width:94vw;overflow:visible;border-radius:22px;
  padding:0 16px 13px;display:flex;flex-direction:column;align-items:center;
  background:linear-gradient(#FCF3E2 0%,#FFFCF6 34%,#fff 62%);box-shadow:0 18px 48px rgba(20,32,48,.26)}
.jt-card .jt-x{position:absolute;right:9px;top:9px;width:25px;height:25px;border:0;border-radius:50%;
  background:rgba(30,40,55,.07);color:#8a94a6;font:inherit;font-size:15px;line-height:22px;cursor:pointer;padding:0}
.jt-card .jt-x:hover{background:rgba(30,40,55,.14);color:#5b6675}
.jt-icb{width:88px;height:92px;margin-top:-34px;display:flex;align-items:center;justify-content:center}
.jt-icb img{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 6px 10px rgba(70,45,10,.22))}
.jt-nameb{font-size:18px;font-weight:800;color:#2b3440;letter-spacing:2px;margin-top:6px}
.jt-starsb{font-size:21px;line-height:1;letter-spacing:4px;color:#F2C14E;margin:6px 0 12px}
.jt-lbody{width:100%}
.jt-lrow{display:flex;gap:9px;margin-bottom:8px}
.jt-lrow:last-child{margin-bottom:0}
.jt-lk{flex:0 0 32px;color:#aab3c0;font-weight:700;font-size:12.5px;line-height:1.62}
.jt-lv{flex:1 1 auto;min-width:0;color:#33404f;font-weight:600;font-size:12.5px;line-height:1.62}
.jt-lv b{font-weight:800}
.jt-an{display:inline-block;margin-right:12px;white-space:nowrap}
.jt-an b{font-family:var(--mono);margin-left:3px;font-weight:800}
.jt-sw{display:inline-block;margin-right:6px;white-space:nowrap;font-family:var(--mono);font-size:12px}
.jt-sw em{font-style:normal;color:#8592a6;font-weight:600;margin-right:2px}
.jt-lnote{display:block;color:#a2abb8;font-weight:500;font-size:11.5px;margin-top:3px}
.jt-lnote b{color:#7b8794;font-weight:700}
/* 职业树：阶段奖励文案（无底色，融进棕底；缩写显示） */
.jt-rw{margin-top:4px;font-size:10.5px;line-height:1.35;color:#f0d2a6;text-align:center;
  white-space:normal;word-break:break-word;opacity:.95}
.jtm-rw{margin-top:5px;font-size:12px;line-height:1.4;color:#f0d2a6}
.jt-card .jt-coin{width:14px;height:14px;object-fit:contain;vertical-align:-2px;margin-right:4px}
.jt-closeb{width:100%;margin-top:10px;padding:10px 0;border-radius:13px;background:#f3f5f9;
  border:1px solid #e8ecf1;color:#5b6675;font-weight:700;font-size:13.5px}
.jt-closeb:hover{background:#eaeef4}
/* 一个年级 7 门课排一行 */
.ac-cards{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.ac-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-top:3px solid var(--sch);border-radius:10px;padding:9px 10px;cursor:pointer;
  transition:box-shadow .15s,transform .15s}
.ac-card:hover{box-shadow:0 6px 18px rgba(30,60,110,.12);transform:translateY(-2px)}
.ac-card.sel{outline:2px solid var(--sch);outline-offset:-2px;background:var(--schbg)}
.md-card.sel{outline:2px solid var(--gold);outline-offset:-2px}
.ac-card-hd{display:flex;flex-direction:column;gap:5px}
.ac-name{font-weight:700;font-size:13px;line-height:1.3;min-height:34px}
.ac-attr{align-self:flex-start;display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;border-radius:6px;padding:1px 7px}
.ac-ic{width:15px;height:15px;object-fit:contain;flex:0 0 auto}
.ac-coin{width:15px;height:15px;object-fit:contain;vertical-align:-3px;margin-right:3px}
.k-power .ac-attr{color:#E8842F;background:#FDF3E8}
.k-intel .ac-attr{color:#2B66CC;background:#EAF1FC}
.k-charm .ac-attr{color:#3DB463;background:#EAF8EF}
.k-mix .ac-attr{color:#7A5CF0;background:#F2EEFE}
.ac-meta{display:flex;flex-direction:column;gap:3px;margin-top:8px;font-size:11.5px;color:#5b6675}
.ac-dur{align-self:flex-start;background:var(--schbg);color:var(--sch);font-weight:700;border-radius:6px;padding:1px 7px;margin-bottom:2px}
.ac-gain{margin-top:auto;padding-top:8px;font-size:12.5px;font-weight:800;color:var(--sch);display:flex;align-items:center;flex-wrap:wrap;gap:3px}
/* 「由短课算长课」预览表（后台课程面板内） */
.ac-lt{width:100%;border-collapse:collapse;margin-top:6px;font-size:12px}
.ac-lt th{background:#f5f8fc;color:#5b6675;font-weight:700;padding:5px 6px;border-bottom:1px solid var(--line);white-space:nowrap}
.ac-lt td{padding:5px 6px;border-bottom:1px solid #f0f3f7;text-align:center;white-space:nowrap}
.ac-lt td:first-child{text-align:left;font-weight:700}
.ac-lt tr:nth-child(even) td{background:#fafcfe}
/* 勋章馆（后台「数据记录 · 勋章馆」） */
.md-card{border-top:none;padding:8px;align-items:stretch;text-align:center}
.md-thumb{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;
  margin-bottom:7px;overflow:hidden}
.md-thumb img{width:76%;height:76%;object-fit:contain}
.md-noimg{font-size:11px;color:#a9b4c4}
.md-card.md-draft{opacity:.55;border:1px dashed var(--line);border-radius:10px}
.md-hd{align-items:center}
.md-name{font-weight:700;font-size:13px;line-height:1.3;min-height:34px;display:flex;align-items:center;justify-content:center}
.md-drafttag{font-size:10.5px;font-weight:800;color:#B8860B;background:#FFF6E0;border-radius:5px;padding:1px 6px}
.md-cond{font-size:11.5px;color:#5b6675;min-height:30px;line-height:1.55;display:flex;align-items:center;justify-content:center}
.md-desc{margin-top:5px;font-size:11px;line-height:1.5;color:#8b96a5}
.md-rel{margin-top:3px;font-size:11px;color:#8a7a55;letter-spacing:.2px}
.md-show{display:inline-flex;align-items:center;justify-content:center;gap:4px;margin-top:7px;
  font-size:11px;color:#2f7d4f;background:#eaf8ef;border-radius:6px;padding:2px 8px;cursor:pointer;user-select:none}
.md-show input{margin:0;width:13px;height:13px}
.md-show.off{color:#8592a6;background:#f1f5f9}
.md-card.md-offshow{opacity:.62}
.md-card .md-show{margin-top:auto}         /* 「展示」固定贴卡片底部：一行内所有勾选位置统一 */
/* 卡片底行：勋章编号（#9008）在「展示」左边，与复选框同一行 */
.md-foot{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:auto}
.md-foot .md-show{margin-top:0}
.md-id{font-size:11px;font-weight:700;color:#8a93a3;background:#f1f5f9;border:1px solid var(--line);
  border-radius:6px;padding:2px 6px;letter-spacing:.3px;font-variant-numeric:tabular-nums;cursor:default}
.md-card .md-desc{margin-bottom:8px}
.md-n{font-style:normal;font-weight:700;opacity:.65;font-size:11px;margin-left:2px}
/* 勋章弹窗：自由文本字段（收集中文案 / 获得时文案）的历史候选 —— 点「历史 ▾」列出库里已录入过的值，
   选中只填进输入框（不落库），改完再点保存；避免每枚勋章都从零打字 */
.hist-wrap{position:relative;display:flex;gap:6px;align-items:center}
.hist-wrap>input{flex:1 1 auto;min-width:0}
.hist-btn{flex:0 0 auto;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:#f7f9fc;
  color:#5b6675;font:inherit;font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;line-height:1.2}
.hist-btn:hover{background:#eef4fb;border-color:#c9dcf5;color:#2b66cc}
.hist-wrap.on>.hist-btn{background:#eef4fb;border-color:#8bbcff;color:#2b66cc}
.hist-list{position:absolute;top:calc(100% + 3px);left:0;right:0;z-index:30;max-height:180px;overflow:auto;
  background:#fff;border:1px solid var(--line);border-radius:9px;box-shadow:0 10px 24px rgba(20,32,48,.16);padding:4px}
.hist-list.hist-up{top:auto;bottom:calc(100% + 3px)}   /* 贴近弹窗下沿时朝上弹，避开 .modal 的 overflow:hidden */
.hist-item{display:block;width:100%;text-align:left;padding:6px 9px;border:0;border-radius:7px;background:transparent;
  font:inherit;font-size:12.5px;font-weight:400;color:#2b3440;cursor:pointer;white-space:normal;
  word-break:break-word;line-height:1.45}
.hist-item:hover{background:#eef4fb;color:#1e6fd0}
.hist-empty{padding:8px 9px;font-size:12.5px;color:#9aa5b1}
/* 主页勋章馆：行=类别，横排图标条（图标+名称+次数） */
.mdh-row{display:flex;gap:12px;align-items:flex-start;padding:8px 0;border-bottom:1px dashed var(--line)}
.mdh-row:last-child{border-bottom:none}
.mdh-g{flex:0 0 96px;text-align:center;font-size:12.5px;color:#4a5568;background:#f4f7fb;
  border:1px solid #e8eef6;border-radius:8px;padding:6px 4px;line-height:1.3}
.mdh-strip{flex:1;display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px}
.mdh-item{flex:0 0 92px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px}
.mdh-item img{width:64px;height:64px;object-fit:contain}
.mdh-item b{font-size:11.5px;font-weight:700;color:#2d3646;line-height:1.25}
.mdh-item i{font-size:11px;font-style:normal;color:#8592a6}
/* 勋章馆长图页：加宽 + 换行（分享长图必须把所有勋章都拍进去，不能横滑截断） */
.sheet-wrap.sheet-wide{max-width:1160px}
.sheet-wide .mdh-strip{flex-wrap:wrap;overflow:visible;row-gap:12px;padding-bottom:4px}
.sheet-wide .mdh-item{flex:0 0 88px}
.sheet-medal{background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.sheet-wide .sheet-head{max-width:100%}
/* 勋章馆 · 手机端：类别名单独一行，勋章一行 4 个（桌面与长图截图仍为横排条） */
@media (max-width:720px){
  .sheet-wide .mdh-row{flex-direction:column;align-items:stretch;gap:6px}
  .sheet-wide .mdh-g{align-self:flex-start;flex:none}
  .sheet-wide .mdh-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 6px;
    overflow:visible;padding-bottom:0}
  .sheet-wide .mdh-item{flex:none;width:auto;min-width:0}
  .sheet-wide .mdh-item img{width:64px;height:64px}
  .sheet-wide .mdh-item b{font-size:11px}
}
#capture.capturing .sheet-wide .mdh-row{flex-direction:row;align-items:flex-start}
#capture.capturing .sheet-wide .mdh-strip{display:flex;flex-wrap:wrap}
#capture.capturing .sheet-wide .mdh-item{flex:0 0 88px;width:auto}
/* 弹窗 */
.ac-toggle{display:inline-flex;background:#f1f5f9;border-radius:10px;padding:4px;gap:4px;margin-bottom:16px}
.ac-toggle label{display:flex;align-items:center;gap:6px;font-weight:600;font-size:13px;margin:0;cursor:pointer;
  padding:6px 13px;border-radius:8px;color:#5b6675}
.ac-toggle label:has(input:checked){background:#fff;box-shadow:0 1px 4px rgba(30,60,110,.14);color:#1e7fd0}
.ac-toggle input{display:none}
.ac-res{width:100%;border-collapse:collapse;font-size:14px}
.ac-res th,.ac-res td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}
.ac-res th{color:#6b7686;font-size:12.5px;font-weight:600;background:#f8fafc}
.ac-res tr:last-child td{border-bottom:none}
.ac-res td.v{font-family:var(--mono);font-weight:700}
.ac-res tr.cut td.v{color:#d0342c}
/* 弹窗正文（照游戏面板：消耗 / 学分 / 奖励）*/
.ac-row{display:flex;gap:12px;padding:12px 2px;border-bottom:1px solid var(--line);align-items:center}
.ac-row:last-child{border-bottom:none}
.ac-k{flex:0 0 60px;color:#6b7686;font-size:13px;font-weight:600}
.ac-v{flex:1;display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:14px}
.ac-v.big{font-family:var(--mono);font-weight:800;font-size:17px}
.ac-v.cut{color:#d0342c}
.ac-chip{display:inline-flex;align-items:center;gap:4px;background:#f4f7fb;border:1px solid #e8eef6;
  border-radius:8px;padding:3px 10px;font-size:13px;color:#334155}
.ac-chip b{font-family:var(--mono)}
.ac-chip.mood{background:#fff7ed;border-color:#fed7aa;color:#b45309}

/* ---------------- top bar ---------------- */
.topbar{padding-top:8px;padding-bottom:8px;
  background:var(--card);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:10;
}
.topbar .inner{
  max-width:1440px;margin:0 auto;padding:12px 14px;   /* 与 .wrap.wide 一致，左边缘跟内容对齐 */
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
}
.brand{display:flex;align-items:center;gap:9px;font-size:19px;font-weight:700;letter-spacing:.3px}
.brand .logo{
  width:30px;height:30px;border-radius:9px;flex:0 0 auto;
  background:#fff;object-fit:contain;display:block;
}
/* 后台顶栏「返回主页」：蓝色底 */
.topbar .back{background:#1e7fd0;border-color:#1e7fd0;color:#fff}
.topbar .back:hover{background:#1a6fba;border-color:#1a6fba;color:#fff}
.spacer{flex:1}
.nav{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.nav a{
  padding:7px 13px;border-radius:9px;color:#5b6675;font-weight:600;font-size:14px;
}
.nav a:hover{background:#eef4fb;text-decoration:none}
.nav a.on{background:#e8f3fe;color:var(--blue-d)}
.nav a.ghost{border:1px solid var(--line)}

/* ---------------- card / table ---------------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.card+.card{margin-top:16px}

/* 表格滚动区：纵向滚动时表头固定，横向可滑动 */
.table-wrap{overflow:auto;max-height:74vh;-webkit-overflow-scrolling:touch}
table.rank thead th{position:sticky;top:0;z-index:3;background:#f8fafc;box-shadow:inset 0 -1px 0 var(--line)}

/* 分享长图页脚：平时隐藏，点「生成分享长图」时才出现在图里 */
.shot-foot{display:none}
.capturing .shot-foot{
  display:block;padding:16px;border-top:1px solid var(--line);background:transparent;
  color:#8a94a6;font-size:13px;line-height:1.9;text-align:center;
}
/* 职业树：声明带完全跟随卡片底色（无白条、无分隔线，文字转浅保证可读） */
.jt-sheet .capturing .shot-foot{border-top-color:transparent;color:#e8dcd6}
.capturing .shot-foot b{color:#5b6675}

/* 生成分享长图时的处理：隐藏按钮/筛选等"操作类"元素，并放大字号让图内更易读 */
.capturing .capture-hide{display:none !important}
.capturing table.rank{font-size:18px}
.capturing table.rank th{font-size:14px;padding:13px 12px}
.capturing table.rank td{padding:15px 12px}
.capturing .card-hd h2{font-size:19px}
.capturing .card-hd{padding:16px}
.capturing .pill{font-size:13px;padding:4px 12px}
.capturing .badge{width:32px;height:32px;font-size:15px}
.capturing .gen{font-size:17px}
.capturing .shot-foot{font-size:14px}
.card-hd{
  padding:13px 16px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
.card-hd h2{margin:0;font-size:16px}
.card-bd{padding:14px 16px}

table.rank{width:100%;border-collapse:collapse;font-size:15px;table-layout:auto}
table.rank th{
  font-weight:600;color:#6b7686;font-size:13px;letter-spacing:.2px;
  padding:11px 12px;background:#f8fafc;border-bottom:1px solid var(--line);white-space:nowrap;
}
table.rank td{padding:12px;border-bottom:1px solid #f1f4f8;vertical-align:middle}
table.rank tr:last-child td{border-bottom:none}
table.rank tbody tr:hover{background:#fafcff}

/* 列对齐：th 与 td 用同一套 class，保证表头内容严格对齐 */
.col-c{text-align:center}
.col-l{text-align:left;padding-left:16px}
.col-rank{text-align:center}
.col-gender{text-align:center}
.col-type{text-align:center}
.col-num{text-align:center;font-family:var(--mono)}
.col-act{text-align:center}
/* 宠物名过长时折行，不把列撑爆 */
.col-pet{white-space:normal;word-break:break-word;line-height:1.35;text-align:center;padding-left:0}

/* 公开榜单表（6 列）：固定 px 列宽，按内容需要给战力/勋章 —— 不再两边对称摊开 */
table.t-public{table-layout:fixed;width:100%;max-width:720px;margin:0 auto}
table.t-public .col-rank{width:48px}
table.t-public .col-gender{width:74px}
table.t-public .col-type{width:98px}
table.t-public .col-power{width:156px}    /* 战力：类型标 + 6 位数 + 余量，别再被挤到边 */
table.t-public .col-medal{width:76px}     /* 勋章：最多 3 位数，别再浪费一整列 */
table.t-public .col-pet{width:auto;text-align:center}   /* 剩下的都给宠物名 */
table.t-public .col-num{text-align:center;font-family:var(--mono)}   /* 数字列居中、等宽数字（宽度由 .col-power/.col-medal 提供）*/

/* 后台表（9 列）：固定列宽，各列留足间距；窄屏横向滚动 */
/* ══════════════ 后台列表（t-admin）布局 · 唯一权威块 ══════════════ */
table.t-admin{width:auto;min-width:1400px;      /* 列多：横向滑动，不挤压内容 */
  --row-bg:#fff; --row-bg-hover:#eef7ff; --row-bg-sel:#e3f0ff; --row-bg-quit:#f2f4f7;   /* 行底色只此一处 */
  --head-bg:#f8fafc; --w-rank:52px; --w-pet:170px;}              /* 列宽变量：left 偏移与真实宽度同源 */
table.t-admin th{text-align:center}             /* 表头居中（与公开榜一致）*/
table.t-admin td,table.t-admin th{white-space:nowrap}   /* 能一行的一律不换行 */
table.t-admin .col-qqnick{width:150px}          /* 账号昵称：固定宽、不换行 */
table.t-admin th.col-power,table.t-admin td.col-power{width:136px}  /* 战力：预留 6 位数+涨幅 */
table.t-admin th.col-medal,table.t-admin td.col-medal{width:88px}   /* 勋章：最多 3 位数 */
table.t-admin .col-act{min-width:96px}
table.t-admin .col-act .row-actions{flex-wrap:nowrap}   /* 操作列里的「更新 + ⋯」必须同一行（父级 flex-wrap:wrap 会折行）*/
table.t-admin th.col-act,table.t-admin td.col-act{width:112px;min-width:112px}
table.t-admin td.col-num{padding-left:10px;padding-right:10px}

/* 对齐：文字列左对齐、数字列居中 */
table.t-admin th.col-pet,table.t-admin td.col-pet,
table.t-admin th.col-qq,table.t-admin td.col-qq,
table.t-admin th.col-qqnick,table.t-admin td.col-qqnick,
table.t-admin th.col-job,table.t-admin td.col-job,
table.t-admin th.col-l,table.t-admin td.col-l{text-align:left}
table.t-admin th.col-num,table.t-admin td.col-num{text-align:left;padding-left:14px}
/* 表头数字标签用与数字相同的 56px 右对齐框 → 表头右缘与战力/勋章数字右缘严格对齐 */
table.t-admin th.col-num .th-sort{display:inline-block;min-width:56px;text-align:right;font-variant-numeric:tabular-nums}
table.t-admin .col-power .c-power,table.t-admin .col-medal .c-medal{
  display:inline-block;min-width:56px;text-align:right;font-variant-numeric:tabular-nums}
table.t-admin .col-num .delta{margin-left:6px}

/* 战力数字按战力类型配色 */
table.t-admin .c-power.k-mix{color:#7A5CF0}
table.t-admin .c-power.k-power{color:#E8842F}
table.t-admin .c-power.k-intel{color:#2B66CC}
table.t-admin .c-power.k-charm{color:#3DB463}

/* ── 横向滑动冻结「名次 + 宠物昵称」：变量驱动、零补丁（任何状态都不会有色差竖条）── */
/* 1) 行底色只有一个来源：--bg（普通 / 悬停 / 选中各改这一个变量） */
table.t-admin tbody tr          {--bg:var(--row-bg)}
table.t-admin tbody tr.row-quit {--bg:var(--row-bg-quit)}     /* 弃游：整行标灰（放在 hover/sel 之前 → 悬停与选中仍能高亮） */
table.t-admin tbody tr.row-quit td{color:#9aa5b4}
table.t-admin tbody tr:hover    {--bg:var(--row-bg-hover)}
table.t-admin tbody tr.row-sel  {--bg:var(--row-bg-sel)}
table.t-admin tbody td          {background:var(--bg)}
table.t-admin thead th          {--bg:var(--head-bg);background:var(--bg)}
/* 2) 分层：表头(6) > 冻结表头(7) > 冻结表体列(3) > 普通格 —— 上下滚动表头不会被盖 */
table.t-admin thead th          {position:sticky;top:0;z-index:6}
table.t-admin th.col-rank,table.t-admin td.col-rank{position:sticky;left:0;z-index:3}
table.t-admin th.col-pet, table.t-admin td.col-pet {position:sticky;left:var(--w-rank);z-index:3}
table.t-admin thead th.col-rank,table.t-admin thead th.col-pet{z-index:7}
/* 3) 列宽与 left 偏移同源（消除 1~2px 缝） */
table.t-admin .col-rank{width:var(--w-rank);min-width:var(--w-rank);max-width:var(--w-rank)}
table.t-admin .col-pet {width:var(--w-pet); max-width:var(--w-pet);overflow:hidden;text-overflow:ellipsis}
/* 4) 分隔感靠一条明确的右边线，不靠底色差 */
table.t-admin th.col-pet,table.t-admin td.col-pet{box-shadow:1px 0 0 var(--line)}

.col-home{text-align:center}
.home{display:block;font-size:12.5px;color:#475569;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.col-who{text-align:center;line-height:1.3}
.col-time{text-align:center}
.who{display:block;font-size:13px;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who-sub{display:block;font-size:11.5px;color:#16a34a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tm{font-family:var(--mono);font-size:12.5px;color:#64748b;white-space:nowrap}
.qtail{display:inline-block;margin-left:5px;padding:0 6px;border-radius:999px;font-size:11px;font-weight:600;
  line-height:1.7;background:#f1f3f6;color:#98a2b3;border:1px solid #e4e8ee;vertical-align:1px}   /* 已弃游标记 */
.col-time .tm-today{color:#1e7fd0;font-weight:700}   /* 当天更新：只变颜色，不加字、不加宽 */
.pager{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;justify-content:space-between;
  margin-top:0;padding:12px 16px 14px;border-top:1px solid var(--line);background:#fcfdff}
.pg-info{color:#4a5563;font-size:14px}
.pg-info b{color:#1f2937;font-family:var(--mono)}
.pg-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pg-label{display:inline-flex;align-items:center;gap:6px;color:#4a5563;font-size:13.5px;font-weight:400;white-space:nowrap}
.pg-label select,.pg-label input[type=number]{width:auto;padding:6px 8px;font-size:13.5px;margin:0}
.pg-label input[type=number]{width:66px;text-align:center}
.btn.sm.off{opacity:.4;pointer-events:none;cursor:default}

/* 二维码浮层（后台点 QQ昵称，贴着昵称弹出） */
.nick-qr{cursor:pointer;border-bottom:1px dashed #b9c4d4}
.nick-qr:hover{color:#1e7fd0;border-bottom-color:#1e7fd0}
.qr-pop{position:fixed;z-index:80;display:none;background:#fff;border:1px solid var(--line);
  border-radius:10px;box-shadow:0 8px 24px rgba(20,30,50,.16);padding:5px}
.qr-pop.on{display:block}
.qr-close{position:absolute;right:2px;top:2px;width:20px;height:20px;padding:0;border:0;background:transparent;
  color:#bcc6d4;font-size:16px;line-height:1;cursor:pointer;border-radius:5px}
.qr-close:hover{background:#f2f5f9;color:#333}
.qr-canvas-wrap{display:flex;justify-content:center}
.qr-canvas-wrap canvas{display:block;max-width:100%;height:auto}
.qr-acts{display:flex;justify-content:center;gap:6px;margin-top:4px}
.qr-ico{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;
  border:1px solid var(--line);border-radius:7px;background:#fff;color:#5b6b82;cursor:pointer}
.qr-ico:hover{background:#f2f8ff;color:#1e7fd0;border-color:#bcdcff}

/* 更新弹窗：左字段 / 右二维码 两栏布局 */
.modal-cols{display:flex;gap:16px;align-items:flex-start}
.modal-cols>.grid{flex:1 1 auto;min-width:0}
.modal-qr{flex:0 0 130px;width:130px;height:130px;display:none;box-sizing:border-box;
  background:#fff;border:1px solid var(--line);border-radius:10px;padding:3px;
  box-shadow:0 2px 8px rgba(20,32,48,.08)}
.modal-qr.on{display:block}
.modal-qr canvas{width:100%;height:100%;display:block;border-radius:7px}
.badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;font-weight:700;font-size:13px;
  background:#eef1f5;color:#6b7686;
}
.badge.b1{background:var(--gold);color:#fff}
.badge.b2{background:var(--silver);color:#fff}
.badge.b3{background:var(--bronze);color:#fff}
.c-pet{font-weight:600}
.c-num{font-family:var(--mono);text-align:center;white-space:nowrap}
.c-power{color:#e8663c;font-weight:700}
.c-medal{color:#2f9bec;font-weight:700}
table.rank th.num{text-align:center}
.muted{color:var(--muted)}
.mono{font-family:var(--mono)}

.gen{font-weight:600;white-space:nowrap}
.gen.male{color:var(--male)}
.gen.female{color:var(--pink)}
.gen .sym{font-size:13px}

.type{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;width:82px;text-align:left}
.sp-ico{width:22px;height:22px;flex:0 0 auto;object-fit:contain;vertical-align:middle}
.capturing .sp-ico{width:26px;height:26px}
.capturing .type{width:104px}
.type .dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}

.pill{
  display:inline-block;padding:3px 10px;border-radius:999px;
  background:#eef4fb;color:#4a6b8a;font-size:12px;font-weight:600;
}
.pill.warn{background:#fff4e5;color:#a86a12}
.pill.ok{background:#e8f7ee;color:#1f8a4c}

.tip{margin:14px 0 0;color:var(--muted);font-size:12.5px;line-height:1.8}
.tip b{color:#5b6675}

/* ---------------- forms / buttons ---------------- */
input[type=text],input[type=password],input[type=number],input[type=date],select,textarea{
  width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;
  font:inherit;color:var(--txt);background:#fff;
}
input:focus,select:focus,textarea:focus{outline:2px solid #cfe7fd;border-color:#a9d4f7}
label{display:block;font-weight:600;font-size:13px;color:#5b6675;margin:0 0 5px}
.field{margin-bottom:13px}
.chk-line{display:flex;align-items:center;gap:8px;font-weight:400;cursor:pointer;white-space:nowrap}
.chk-line input[type=checkbox]{width:auto;margin:0;flex:0 0 auto}
#correctWrap{background:#fff7ed;border:1px solid #fed7aa;border-radius:9px;padding:10px 12px;margin-left:-13px;margin-right:-13px}   /* 负外边距抵消 padding+border，让内容与上方字段左对齐 */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:0 14px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  padding:9px 16px;border-radius:9px;border:1px solid var(--line);
  background:#fff;color:#4a5563;font:inherit;font-weight:600;cursor:pointer;
  line-height:1.2;text-decoration:none;
}
.btn:hover{background:#f6f9fc;text-decoration:none}
.btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.btn.primary:hover{background:var(--blue-d)}
.btn.danger{color:#c0392b;border-color:#f0d2ce}
.btn.danger:hover{background:#fdf3f2}
.btn.sm{padding:5px 11px;font-size:13px;border-radius:8px}
.row-actions{display:flex;gap:7px;flex-wrap:wrap;align-items:center}

.alert{padding:11px 14px;border-radius:10px;margin-bottom:14px;font-weight:600}
.alert.ok{background:#e8f7ee;color:#1f8a4c}
.alert.err{background:#fdecea;color:#c0392b}
.alert.info{background:#eaf4fe;color:#1e7fd0}

.stat{display:flex;gap:22px;flex-wrap:wrap}
.stat div{font-size:13px;color:var(--muted)}
.stat b{display:block;font-size:18px;color:var(--txt);font-family:var(--mono)}

/* ---------------- login ---------------- */
.login-box{max-width:380px;margin:9vh auto}
.login-box .card-bd{padding:22px}

/* ---------------- share (发帖) view ---------------- */
.share-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.share-head .t{font-size:17px;font-weight:700}
.share-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;
}
table.rank.share{font-size:14.5px}
table.rank.share td{padding:9px 10px}
table.rank .col-lv{width:72px;text-align:center;white-space:nowrap}   /* 后台：等级列 */
table.rank .rank-lv{margin-left:5px;font-size:10px;padding:0 5px;line-height:1.45;
  vertical-align:1px;font-weight:600}   /* 展示榜：等级跟在宠物名后面 */
table.rank .ptype{font-size:11px;padding:1px 7px;margin-right:6px;vertical-align:1px}  /* 展示榜：战力类型标 */
.row-flag{margin-left:6px;font-size:12px;color:#c9d2de;text-decoration:none;vertical-align:1px}
.delta{display:inline-block;margin-left:5px;padding:0 6px;border-radius:999px;
  font-size:11px;font-weight:700;line-height:1.7;white-space:nowrap;vertical-align:1px}   /* 同日对比：相对当天 00:00 */
.delta.up{color:#d0342c;background:#fdf3f2;border:1px solid #f3d5d1}   /* 涨：红箭头/红字 + 最浅红底（红色才能和数字区分，不然 ↑1 像 11）*/
.delta.down{color:#b3462f;background:#fdf5f3;border:1px solid #f2ddd8}  /* 跌：最浅红底 + 红字 */

/* 战力数字按战力类型配色（复合紫/力量橙/智力蓝/魅力绿） */
/* 横向滑动时冻结「名次 + 宠物昵称」 */
.row-flag:hover{color:var(--blue)}   /* 每行的反馈入口，平时很淡 */
table.t-public .col-num{white-space:nowrap}                 /* 类型标与数字同一行 */
/* 分享版（分享长图页）：容器最大 640，640 以上不能回落到弹性布局，否则数字列被挤到 108px 而裁掉内容 */
table.rank.share-view{table-layout:fixed}
table.rank.share-view .col-rank{width:56px}
table.rank.share-view .col-gender{width:62px}
table.rank.share-view .col-type{width:94px}
table.rank.share-view .col-power{width:126px}   /* 战力：类型标 + 大数字 */
table.rank.share-view .col-medal{width:78px}    /* 勋章：两位数，不该占那么宽 */
table.rank.share-view .col-pet{width:auto}   /* 剩下的都给宠物名（会自动换行） */
.limbar{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}   /* 看前 N 名 */
/* 榜单页头部控件统一尺寸（下拉 / 自定义框 / 日期框 / 按钮 高度一致，圆角一致） */
.limbar select,.limbar input[type=number],
.card-hd select,.card-hd input[type=date],.card-hd input[type=number]{
  width:auto;height:32px;padding:0 10px;font-size:13px;border-radius:9px;
}
.limbar input[type=number]{width:76px;text-align:center}
/* 头部行内所有框同高同圆角、垂直居中对齐（含「更新于」胶囊与日期框所在的 label） */
.card-hd{gap:8px}
.card-hd .pill{height:32px;display:inline-flex;align-items:center;padding:0 12px;font-size:12.5px}
.card-hd label.muted{margin:0;display:inline-flex;align-items:center;gap:5px;font-weight:400;font-size:13px}
.card-hd .btn,.card-hd .btn.sm{border-radius:9px}
.limbar .btn.sm,.card-hd .btn.sm{height:32px;padding:0 12px;display:inline-flex;align-items:center}


@media (max-width:640px){
  .wrap{padding:12px 8px 40px}
  table.rank{font-size:13.5px}
  table.rank td,table.rank th{padding:9px 7px}
  .c-rank{width:46px}
  .hide-sm{display:none}
  /* 手机窄屏：改固定列宽布局——弹性布局下宠物名列会抢走宽度，把战力列挤到 63px 裁掉内容 */
  table.t-public{table-layout:fixed}
  table.t-public .col-rank{width:34px}
  table.t-public .col-power{width:108px}        /* 战力：窄屏留够放「类型标+6位数」且别溢出 */
  table.t-public .col-medal{width:56px}         /* 勋章：窄屏别再 108，浪费一半 */
  table.t-public .col-pet{width:130px;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}  /* 窄屏：宠物名定宽省略，防止表格被撑宽出横滑 */
  table.t-public td.col-rank,table.t-public th.col-rank{padding-left:4px;padding-right:4px}
  table.t-public td.col-num,table.t-public th.col-num{padding-left:5px;padding-right:5px}
  table.rank .ptype{font-size:9.5px;padding:0 4px;margin-right:3px}
  table.rank .rank-lv{font-size:9px;padding:0 4px;margin-left:4px}
  table.rank .col-num{font-size:13px}
  table.t-public .col-num{white-space:normal;overflow-wrap:break-word}  /* 大字号兜底：宁可换行也不横滑 */
  /* 分享版固定列宽在窄屏要跟着收窄（否则宠物名列被挤到几像素） */
  table.rank.share-view .col-rank{width:34px}
  table.rank.share-view .col-power{width:106px}
  table.rank.share-view .col-medal{width:56px}
}

/* ---------------- modal (后台弹窗录入) ---------------- */
.modal-mask{
  position:fixed;inset:0;background:rgba(23,32,44,.45);z-index:100;
  display:none;align-items:flex-start;justify-content:center;padding:6vh 14px;overflow:auto;
}
.modal-mask.on{display:flex}
.modal{
  position:relative;
  background:#fff;border-radius:14px;width:100%;max-width:880px;
  box-shadow:0 18px 48px rgba(20,32,48,.24);overflow:hidden;
  animation:pop .16s ease-out;
}
@keyframes pop{from{transform:translateY(-8px);opacity:.6}to{transform:none;opacity:1}}
.modal-hd{
  display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);
  cursor:move;user-select:none;-webkit-user-select:none;touch-action:none;
}
.modal-hd b{font-size:16px}
.modal-bd{padding:18px 18px 4px}
.modal-ft{
  display:flex;align-items:center;gap:10px;padding:14px 18px;border-top:1px solid var(--line);
  background:#fafcff;
}
.tipline{font-size:12.5px;margin-top:5px;min-height:17px}
.rowclick{cursor:pointer}
#tbl tbody tr.rowclick:hover{background:#eef7ff}

/* ---------- 行内「更新 + ⋯」下拉 ---------- */
.act-group{display:inline-flex;align-items:stretch;gap:0}
.act-menu{position:relative;display:inline-block}
.btn.caret{padding:6px 9px 6px 8px;border-left:none;border-radius:0 8px 8px 0;margin-left:-1px;line-height:1}
.menu{
  position:absolute;right:0;top:calc(100% + 6px);z-index:30;display:none;min-width:118px;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 10px 28px rgba(20,32,48,.16);overflow:hidden;
}
.menu.on{display:block;animation:pop .14s ease-out}
.menu .mi{display:block;width:100%;padding:9px 13px;border:0;background:none;cursor:pointer;
  text-align:left;font:inherit;font-size:13.5px;color:#4a5563}
.menu .mi:hover{background:#f2f7fd;color:var(--blue-d)}
.menu .mi.danger{color:#c0392b}
.menu .mi.danger:hover{background:#fdf3f2}

/* 后台筛选面板 */
.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:6px 10px;align-items:end}
.filter-grid>.field{min-width:0}
.filter-grid>.field select,.filter-grid>.field input{max-width:100%}
.filter-grid .field{margin-bottom:12px}
.filter-grid input,.filter-grid select{width:100%}
/* 后台筛选面板：默认只有一行搜索框 */
.filter-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.filter-row input[name=kw]{flex:0 1 300px;width:300px;max-width:46vw}
.filter-row .btn{flex:0 0 auto}
.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:6px 10px;align-items:end}
.filter-grid .field{margin-bottom:12px}
.filter-grid input,.filter-grid select{width:100%}
.range-row{display:flex;gap:4px;align-items:center}
.range-row input[type=number]{width:100%;min-width:0;padding:5px 6px;font-size:13px}
.filter-grid .field>label{font-size:12px;font-weight:600;color:#5b6675;margin-bottom:2px;white-space:nowrap}
.filter-grid select,.filter-grid input[type=number]{padding:5px 6px;font-size:13px}
.range-row input{width:100%}
/* 账号区下拉（个人信息 / 退出） */
.acct{position:relative;display:flex;align-items:center}
.acct-menu{
  position:absolute;right:0;top:calc(100% + 6px);z-index:40;display:none;min-width:170px;
  background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 28px rgba(20,32,48,.16);overflow:hidden;
}
.acct-menu.on{display:block;animation:pop .14s ease-out}
.acct-menu .mi{display:block;width:100%;padding:10px 14px;border:0;background:none;cursor:pointer;
  text-align:left;font:inherit;font-size:13.5px;color:#4a5563;text-decoration:none}
.acct-menu .mi:hover{background:#f2f7fd;color:var(--blue-d);text-decoration:none}
.acct-menu .mi.danger{color:#c0392b}
.acct-menu .sep{height:1px;background:var(--line);margin:2px 0}
/* 账号按钮：与导航项同一风格（无边框） */
.acct-btn{
  padding:7px 13px;border-radius:9px;border:0;background:none;color:#5b6675;
  font:inherit;font-size:14px;font-weight:600;cursor:pointer;
  display:inline-block;vertical-align:middle;line-height:inherit;
}
.acct-btn:hover{background:#eef4fb}
.acct-btn .caret-i{font-size:10px;opacity:.7}


/* 提示条：挪到「筛选」那一行的右上角，窄条不占位 */
.hint-slot{margin-left:auto;display:inline-flex;align-items:center;min-width:0}
.hint-slot .alert{margin:0;padding:6px 10px;font-size:13px;font-weight:600;white-space:nowrap;max-width:44vw;overflow:hidden;text-overflow:ellipsis}
.alert.compact{margin:0}

/* 弹窗里跨整行的字段（昵称可能很长，要能看全） */
.grid-full{grid-column:1 / -1}

/* 生日：年/月/日 三段，自动跳格 */
.date-row{display:flex;align-items:center;gap:6px}
.date-row input{width:64px;text-align:center}
.date-row input#f_birth_y{width:86px}

/* 表格：QQ昵称列允许换行，长名字不截断 */

/* 刚更新过的那一行：淡黄高亮一下 */
tr.row-flash>td{background:#fff6d8 !important;transition:background .3s}
/* 正在更新的那一行（点「更新」时高亮，弹窗关闭即取消）*/
#tbl tbody tr.row-sel{--bg:var(--row-bg-sel);background:var(--row-bg-sel)}
#tbl tbody tr.row-sel>td{background:var(--bg) !important;border-bottom-color:transparent}   /* 底色高亮（同 --bg 来源），且去掉行分隔线（看着像网格）*/
#tbl tbody tr.row-sel .col-pet{font-weight:700}






/* ══════════ 更新弹窗 · 最终版（唯一来源，此前版本全部删除）══════════
   结构：3 列自包含格子（每格=标签+控件，永远不重叠）+ 底部 左二维码/右备注修正 */
.modal{width:640px;max-width:94vw}
.modal-hd{padding:11px 14px}
.modal-hd b{font-size:15px}
.modal-bd{padding:14px 16px 2px}
.modal-ft{padding:10px 14px}
.modal .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:11px 14px}
.modal .field{margin:0;min-width:0;display:flex;flex-direction:column;gap:4px}
.modal .field>label{font-size:12.5px;font-weight:600;color:#5b6675;margin:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modal .field .muted{font-size:11.5px;font-weight:400}
.modal input[type=text],.modal input[type=number],.modal input[type=date],.modal select{width:100%;padding:6px 9px;
  font-size:13.5px;box-sizing:border-box;border-radius:8px}
.modal .tipline{margin:0;font-size:12px;min-height:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modal-bottom{display:flex;gap:14px;align-items:stretch;margin-top:12px}
.modal-qr-wrap{flex:0 0 104px;display:flex;flex-direction:column}
.modal-bottom .modal-qr{width:104px;height:104px}
.modal-bottom-main{flex:1 1 0;min-width:0}
.modal-bottom-main .field{margin:0 0 9px}
.modal .chk-line{font-size:12.5px}
.modal .date-row{gap:3px}
.modal .date-row input{width:34px;padding:6px 3px;text-align:center}
.modal .date-row input#f_birth_y{width:50px}
/* 生日单框（YYYY-MM-DD）也兼容同一宽度 */
.modal input#f_birth{letter-spacing:.5px;text-align:center}
.modal .modal-ft .btn{padding:7px 15px}


/* 弹窗页脚：按钮永不竖排（信息条可截断） */
.modal .modal-ft .btn{flex:0 0 auto;white-space:nowrap;min-width:64px;padding:8px 16px}
.modal-ft #mInfo{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ══════════ 更新弹窗 · v6（唯一权威来源，历史上所有弹窗叠加规则全部作废）══════════
   结构：固定 3 列格子 + 备注/修正整行 + 二维码独占最后一行（左下角）。
   以后改弹窗样式【只改这一块】，不要再往后追加。 */
.modal{width:640px;max-width:94vw;position:relative;margin:auto}
.modal-hd{padding:11px 14px}
.modal-hd b{font-size:15px}
.modal-bd{padding:12px 16px 2px}
.modal-ft{padding:10px 14px}
.modal .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 14px}
.modal .grid>.field{margin-bottom:0}
.modal .field{margin:0 0 10px;min-width:0;display:flex;flex-direction:column;gap:4px}
.modal .field>label{font-size:12.5px;font-weight:600;color:#5b6675;margin:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.modal .field .muted{font-size:11.5px;font-weight:400}
.modal input[type=text],.modal input[type=number],.modal input[type=date],.modal select{width:100%;padding:6px 9px;
  font-size:13.5px;box-sizing:border-box}
.modal .tipline{margin:0;font-size:12px;min-height:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 底部两栏：与上方 3 列同一套网格 → 二维码占第 1 列，备注+修正占第 2~3 列（与「生日」列左缘对齐） */
.modal-bottom{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 14px;margin-top:10px;margin-bottom:10px;align-items:stretch}
.modal-qr-wrap{grid-column:1;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.modal-bottom-main{grid-column:2 / span 2;min-width:0}
.modal-bottom-main .field{margin-bottom:8px}
/* 二维码边长由这一行的高度决定（与右栏等高、底边齐平），下限 160，宽度不超过第 1 列 */
.modal .modal-qr{position:relative;flex:0 0 auto;height:100%;min-height:160px;width:auto;aspect-ratio:1/1;max-width:100%;box-sizing:border-box;background:#fff;
  border:1px solid var(--line);border-radius:10px;padding:3px;overflow:hidden;
  box-shadow:0 2px 8px rgba(20,32,48,.08)}
.modal-qr.on{display:block}
.modal-qr canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;border-radius:8px}
.modal .chk-line{font-size:12.5px}
.modal .date-row{gap:3px;width:100%}
.modal .date-row input{flex:1 1 0;width:auto;min-width:0;padding:5px 3px;text-align:center}
.modal .date-row input#f_birth_y{flex:1.6 1 0;width:auto}   /* 年份宽一点，但整体撑满格子 */
.modal .modal-ft .btn{flex:0 0 auto;white-space:nowrap;min-width:64px;padding:8px 16px}
.modal-ft #mInfo{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ══════════ 数据记录页（admin/data.php）· 唯一权威块 ══════════
   以前这四个类【根本没写样式】，导航退化成裸 <a> 挤成一行、左右分栏也不存在。
   以后改这一页只改这一块，不要再往别处追加。 */
.data-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:14px;align-items:start}
.data-side .card{margin:0}
/* 左导航跟随滚动：页面往下拉时导航停在视口内，始终能看到当前板块高亮 */
.data-side{position:sticky;top:var(--topbar-h,78px);align-self:start}
.data-menu{display:flex;flex-direction:column;gap:2px;padding:6px}
.data-menu a{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:9px;
  color:#3b4759;text-decoration:none;font-size:14px;line-height:1.25;border:1px solid transparent}
.data-menu a:hover{background:#f2f6fb;color:#1e7fd0}
.data-menu a.on{background:#eaf3ff;border-color:#cfe4ff;color:#1e7fd0;font-weight:600}
.data-menu a .ico{flex:0 0 20px;text-align:center;font-size:15px;line-height:1}
.data-menu a .tx{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.data-main{min-width:0}
@media (max-width:820px){
  .data-layout{grid-template-columns:1fr}
  .data-menu{flex-direction:row;flex-wrap:wrap}
  .data-menu a{flex:0 0 auto}
}

/* ══════════ 战力类型配色（照游戏里的颜色）· 唯一权威块 ══════════ */
.ptype{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;
  font-size:12.5px;font-weight:600;line-height:1.7;white-space:nowrap}
.ptype.mix{background:#F2EEFE;color:#7A5CF0}
.ptype.power{background:#FDF3E8;color:#E8842F}
.ptype.intel{background:#EAF1FC;color:#2B66CC}
.ptype.charm{background:#EAF8EF;color:#3DB463}
select.ptype{margin:0}
/* 这两个下拉的文字会随值变色，但原生箭头会跟着一起变色（看着像整个框变色）→ 隐藏原生箭头，自绘灰色的 */
option.g-male{color:#3b9ae1;background:#fff}      /* 选项自己带色：否则会继承下拉框颜色（选雌性时雄性也变粉） */
option.g-female{color:#f06aa1;background:#fff}
#f_gender,#f_power_type{
  -webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%238a94a6' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 9px center;background-size:10px 6px;
  padding-right:26px;
}
select.ptype option{background:#fff;color:#3b4759;font-weight:400}

/* ══════════ 宠物管家等级（Lv 徽章 + 经验条）· 唯一权威块 ══════════ */
.lv{display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:600;
  color:#fff;background:#FF8100;border-radius:999px;padding:0 6px;
  white-space:nowrap;line-height:1.5}      /* 等级标＝游戏实图色（橙底白字）*/
.lv.max{color:#fff;background:#E8590C}
.lvbar{height:8px;border-radius:999px;background:#eef2f7;overflow:hidden;margin:7px 0 5px}
.lvbar>i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#4fa8ff,#1e7fd0)}
.lvtbl{font-size:14px}
.lvtbl td{padding:4px 0}

/* ══════════ 权限分配下拉（面板 + 复选框）· 唯一权威块 ══════════
   之前只写了 HTML/JS、【没写 CSS】→ 面板一直摊开着挤在一起。以后只改这一块。
   注意：面板必须 position:fixed（由 JS 定位）。.card 是 overflow:hidden，
   绝对定位的浮层会被卡片裁掉——旧版就是「往上弹又撞到卡片上沿 → 顶部被切」。 */
.perm-dd{position:relative;display:inline-block}
.perm-btn{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--line);
  border-radius:8px;background:#fff;color:#3b4759;font-size:13px;cursor:pointer;white-space:nowrap}
.perm-btn:hover{border-color:#bcdcff;color:#1e7fd0}
.perm-btn .caret{font-size:10px;color:#8a94a6}
.perm-btn.has{background:#eaf3ff;border-color:#cfe4ff;color:#1e7fd0;font-weight:600}
.perm-panel{display:none;position:fixed;z-index:60;left:0;top:0;min-width:300px;max-width:min(380px,92vw);
  max-height:min(60vh,440px);overflow:auto;overscroll-behavior:contain;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 10px 26px rgba(20,32,48,.16);padding:8px;text-align:left}
.perm-panel.on{display:block}
.perm-item{display:flex;align-items:flex-start;gap:6px;padding:9px 10px;border-radius:8px;
  cursor:pointer;font-size:13px;line-height:1.6;margin:0}
.perm-item+.perm-item{border-top:1px solid #f0f3f7}   /* 项间细分隔线，层次更清楚 */
.perm-item:hover{background:#f2f6fb}
.perm-item>span{min-width:0}
.perm-item input{margin:3px 0 0;flex:0 0 auto}
.perm-item em{display:block;font-style:normal;color:#8a94a6;font-size:12px;margin-top:3px;line-height:1.55}
.perm-tip{font-size:11.5px;padding:5px 8px 2px;border-top:1px solid var(--line);margin-top:4px}

/* ══════════ 账号管理 · 登录记录：筛选条 + 紧凑行 ══════════ */
.lg-filter{display:flex;align-items:center;gap:8px;margin-left:auto;flex-wrap:wrap}
.lg-filter input,.lg-filter select{padding:5px 9px;border:1px solid var(--line);border-radius:8px;
  font:inherit;font-size:12.5px;background:#fff;color:#334155}
.lg-filter input{width:132px}
table.t-compact th{padding:7px 10px;font-size:12px}
table.t-compact td{padding:6px 10px;font-size:12.5px;border-bottom:1px solid #f4f6fa}
.ua-cell{max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ══════════ 活动发布 · 已发布列表：定宽适屏（不左右滑） ══════════ */
table.act-tbl{table-layout:fixed;width:100%}
table.act-tbl th:nth-child(1){width:56px}
table.act-tbl th:nth-child(2){width:auto}
table.act-tbl th:nth-child(3){width:152px}
table.act-tbl th:nth-child(4){width:74px}
table.act-tbl th:nth-child(5){width:104px}
table.act-tbl th:nth-child(6){width:160px}
table.act-tbl th:nth-child(7){width:132px}
table.act-tbl td.col-l{word-break:break-word}
table.act-tbl td:nth-child(3),table.act-tbl td:nth-child(6){white-space:nowrap}
@media (max-width:860px){
  table.act-tbl th:nth-child(3),table.act-tbl th:nth-child(5),table.act-tbl th:nth-child(6){width:0}
  table.act-tbl th:nth-child(4){width:64px}
  table.act-tbl th:nth-child(7){width:118px}
}

/* ══════════ 导航下拉（宠物管理▾）· 当前分组高亮 ══════════ */
.nav .nav-dot{display:inline-flex;align-items:center;justify-content:center;min-width:17px;height:17px;
  margin-left:5px;padding:0 5px;border-radius:999px;background:#e5484d;color:#fff;font-size:11px;
  font-weight:700;line-height:1;vertical-align:1px}
.acct-btn.on{background:#eaf3ff;color:#1e7fd0;font-weight:600}
.nav .acct-menu{min-width:150px}
.nav .acct-menu .mi{display:block;text-align:left}
/* 长图分享按钮：紧贴 sheet 下方，居中 */
.sheet-shot{display:flex;gap:8px;justify-content:center;margin:10px auto 0;max-width:720px}
.sheet-shot .btn{padding:8px 18px;font-size:14px}

/* 图鉴表格内小图标（金币/学分/属性） */
.sheet-t .sh-ic{width:12px;height:12px;object-fit:contain;vertical-align:-2px;margin:0 auto;display:block}
/* 窄长条：不横滑、固定列宽 */
.sheet-wrap .table-wrap{overflow:visible;max-height:none}
.sheet-wrap .sheet-t{width:100%;table-layout:fixed;font-size:11px;border-collapse:separate;border-spacing:0}
.sheet-wrap .sheet-t col.c-label{width:52px}
.sheet-wrap .sheet-t col.c-v{width:auto}
.sheet-wrap .sheet-t col.c-up{width:46px}
/* 无竖线；只留极浅横线 */
.sheet-wrap .sheet-t th,.sheet-wrap .sheet-t td{border:0;padding:3px 3px;overflow-wrap:anywhere;word-break:break-all;text-align:center}
.sheet-wrap .sheet-t th.l,.sheet-wrap .sheet-t td.l{text-align:left}
/* 表头：课程名 */
.sheet-wrap .sheet-t .row-heads th{background:transparent;color:#1f2a37;font-weight:800;font-size:10.5px;line-height:1.3;padding:8px 2px 5px}
.sheet-wrap .sheet-t .row-heads th.l{color:var(--muted);font-weight:600}
/* 元信息行（属性奖励/时长）：淡化、无背景 */
.sheet-wrap .sheet-t tr.meta th.l{color:#aeb8c6;font-weight:600}
.sheet-wrap .sheet-t tr.meta td{color:#8b96a5;font-size:10px}
/* 数值表头（图标行） */
.sheet-wrap .sheet-t .subhead th,.sheet-wrap .sheet-t .subhead td{background:transparent;padding:4px 2px 3px;border-top:1px solid #eef2f7}
.sheet-wrap .sheet-t .subhead td.grp{background:var(--c9,#f3f7fc)}
.sheet-wrap .sheet-t .subhead td.grp2{background:#f4f7fb}
/* 数据行：斑马纹 + 仅横线 */
.sheet-wrap .sheet-t tbody tr td,.sheet-wrap .sheet-t tr.data td,.sheet-wrap .sheet-t tr.data th{background:#fff}
.sheet-wrap .sheet-t tr.data:nth-child(odd) td,.sheet-wrap .sheet-t tr.data:nth-child(odd) th{background:#fff}
.sheet-wrap .sheet-t tr.data td,.sheet-wrap .sheet-t tr.data th{border-top:1px solid #eef2f7;padding:4px 3px}
.sheet-wrap .sheet-t tr.data th.l{color:#5b6675;font-weight:700;background:#fff}
.sheet-wrap .sheet-t tr.data td{color:#334155;font-size:11px;font-variant-numeric:tabular-nums}
.sheet-wrap .sheet-t .up{color:var(--c);font-weight:800}
/* 累计行 */
.sheet-wrap .sheet-t tr.sumrow td,.sheet-wrap .sheet-t tr.sumrow th{background:var(--c10,#f1f6fb);
  font-weight:800;color:#334155;border-top:2px solid var(--c);padding:5px 3px}
/* 简单表（学前） */
.sheet-wrap .sheet-t.sheet-simple{font-size:10.5px}
.sheet-wrap .sheet-t.sheet-simple .row-heads th{font-size:11px}
.side-entry{color:#1e7fd0 !important;font-weight:800}

/* ---------- 活动列表 ---------- */
.act-list{display:flex;flex-direction:column;gap:12px}
.act{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff;
  border-left:3px solid var(--blue)}
.act-hd{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.act-hd b{font-size:14.5px}
.act-when{font-size:12px;color:var(--muted)}
.act-body{margin-top:6px;font-size:13px;line-height:1.75;color:#3d4652;overflow-wrap:anywhere}

/* ── 去壳模式（?embed=1）：供新前端右侧内嵌，去掉顶栏/侧栏 ── */
body.embed{background:#f7f9fc}
.embed-wrap{max-width:1100px;margin:0 auto}
.embed-main{padding:10px 12px 16px}
.embed-main .tip{max-width:none}

/* ══════════ 「宠物等级」模块（前台 channel.php?t=petlevel + 后台 data.php?s=petlevel）· 唯一权威块 ══════════
   规矩：列窄、能换行就换行、能缩字就缩字 ⇒ 任何宽度下都不出现横向滚动（口径与模块由 lib/petlevel.php 同一份输出）。 */
.plc{display:grid;gap:12px}
.plc-mod{border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px 14px;min-width:0}
.plc-mod-hd{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.plc-mod-hd b{font-size:13.5px;color:#334155}
.plc-mod-hd .muted{font-size:11.5px}

/* ① 今日卡 */
.plc-today{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:linear-gradient(135deg,#fff8f1,#fff 62%)}
.plc-lv{flex:0 0 auto;width:92px;height:92px;border-radius:20px;
  background:linear-gradient(135deg,#FFA53D,#FF8100);color:#fff;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(255,129,0,.26)}
.plc-lv em{font-style:normal;font-size:11px;opacity:.92;letter-spacing:1px}
.plc-lv b{font-size:34px;line-height:1.15;font-weight:800;font-variant-numeric:tabular-nums}
.plc-lv i{font-style:normal;font-size:10.5px;opacity:.92}
.plc-today-main{flex:1 1 260px;min-width:0}
.plc-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.plc-chip{font-size:11.5px;color:#5b6675;background:#f5f8fc;border:1px solid #e6ecf4;border-radius:999px;padding:2px 9px;white-space:nowrap}
.plc-chip b{color:#1e7fd0}
.plc-today-foot{font-size:12.5px;color:#5b6675;line-height:1.75}
.plc-today-foot b{color:#E8590C}
.plc-goal{color:#334155}
.plc-sep{color:#c7d0dc;margin:0 5px}

/* ② 等级阶梯 */
.plc-ladder{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:6px}
.plc-step{display:flex;flex-direction:column;align-items:center;gap:1px;
  border:1px solid #e6ecf4;background:#f7f9fc;border-radius:9px;padding:5px 2px;
  font:inherit;color:#8b96a5;line-height:1.3;cursor:default}
.plc-step .n{font-size:11.5px;font-weight:700;color:#7c8798;font-variant-numeric:tabular-nums}
.plc-step .e{font-size:10.5px;color:#aeb8c6;font-variant-numeric:tabular-nums}
.plc-step.done{background:#eef7ff;border-color:#cfe6ff}
.plc-step.done .n{color:#1e7fd0}
.plc-step.done .e{color:#7fb4e6}
.plc-step.now{background:linear-gradient(135deg,#FFA53D,#FF8100);border-color:#FF8100;
  box-shadow:0 3px 10px rgba(255,129,0,.28)}
.plc-step.now .n,.plc-step.now .e{color:#fff}
button.plc-step{cursor:pointer}
button.plc-step:hover{border-color:#bcdcff;background:#f0f7ff}
button.plc-step.done:hover .n{color:#1e7fd0}
button.plc-step.now:hover{background:linear-gradient(135deg,#FFB055,#FF8E1F)}
.plc-legend{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:9px;font-size:11.5px;color:#7c8798}
.plc-legend .k{display:inline-block;width:12px;height:12px;border-radius:4px;border:1px solid #e6ecf4;background:#f7f9fc}
.plc-legend .k.done{background:#eef7ff;border-color:#cfe6ff}
.plc-legend .k.now{background:#FF8100;border-color:#FF8100}
.plc-legend .muted{margin-left:2px;font-size:11px}

/* 等级阶梯：格子里的奖励气泡（悬停 / 点击显示） */
.plc-step{position:relative}
.plc-tip{display:none;position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 8px);z-index:30;
  background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 28px rgba(15,23,42,.16);
  padding:9px 11px;font-size:12px;line-height:1.95;white-space:nowrap;text-align:left;
  color:var(--txt);font-weight:400;font-variant-numeric:tabular-nums}
.plc-step:hover .plc-tip,.plc-step.on .plc-tip{display:block}
.plc-tip::after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;margin-left:-4px;
  background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.plc-tip b{display:block;margin-bottom:3px;color:#334155;font-size:12.5px}
.plc-tip>span{display:block;line-height:1.9}
.plc-tip i{display:inline-block;min-width:56px;margin-right:6px;color:var(--muted);font-style:normal}
.plc-tip .rw-coin{width:14px;height:14px;object-fit:contain;vertical-align:-2px;margin-right:3px}
.plc-tip .rw-pt-ic{width:14px;height:14px;object-fit:contain;vertical-align:-2px;margin-right:3px}

/* 道具库：清单里的图标缩略图 */
.item-ico{width:36px;height:36px;object-fit:contain;vertical-align:middle}

/* 道具库（后台「数据记录 · 道具库」）：卡片式，做法同勋章馆；卡片更矮、一排 8 个 */
.it-cards{grid-template-columns:repeat(7,minmax(0,1fr));gap:9px}
.it-card{border-top:none;padding:10px 9px 9px;text-align:center;align-items:stretch}
.it-card.it-off{opacity:.55;border-style:dashed}
.it-thumb{height:72px;display:flex;align-items:center;justify-content:center;margin-bottom:7px;overflow:hidden}
.it-thumb img{width:68px;height:68px;object-fit:contain}
.it-name{font-size:13px;font-weight:700;line-height:1.3;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;margin-bottom:7px}
.it-name .it-ev{font-style:normal;font-size:9.5px;font-weight:800;color:#c2410c;background:#fff3e6;
  border-radius:4px;padding:0 4px;margin-left:3px;vertical-align:1px}
/* 用途 / 获取 / 售价（商品卡片式，行距放宽） */
.it-use,.it-ob,.it-price{text-align:left;margin-bottom:5px;line-height:1.6}
.it-use{font-size:11.5px;color:#4b5563;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.it-ob{font-size:11px;color:#8b96a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.it-price{font-size:12px;color:#c98a3c;font-weight:800;display:flex;align-items:center;gap:3px}
.it-price img{width:14px;height:14px;object-fit:contain}
.it-use i,.it-ob i,.it-price i{font-style:normal;font-weight:800;color:#7b8794;margin-right:4px}
.it-foot{display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:auto;padding-top:4px}
.it-foot .md-id{font-size:10.5px;padding:2px 7px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.it-foot .md-show{font-size:11px;padding:2px 9px;margin-top:0}
.it-foot .md-show input{width:12px;height:12px}
/* 筛选框（圆角搜索框 + 内置搜索图标 + 清空） */
.it-filter{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.it-search{position:relative;display:flex;align-items:center}
.it-search .it-sic{position:absolute;left:11px;width:15px;height:15px;pointer-events:none;
  fill:none;stroke:#9aa5b1;stroke-width:2;stroke-linecap:round}
.it-search input{width:250px;max-width:32vw;height:34px;padding:0 30px 0 33px;
  border:1px solid var(--line);border-radius:999px;background:#f7f9fc;color:var(--txt);
  font-size:13px;font-family:inherit;transition:background .15s,border-color .15s,box-shadow .15s}
.it-search input::placeholder{color:#a9b4c4}
.it-search input:hover{background:#f2f5fa}
.it-search input:focus{outline:none;background:#fff;border-color:#bfd8f5;
  box-shadow:0 0 0 3px rgba(47,155,236,.13)}
.it-search .it-clr{position:absolute;right:7px;width:20px;height:20px;line-height:1;border:0;border-radius:50%;
  background:transparent;color:#b6c0cd;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.it-search .it-clr:hover{background:#e9eef5;color:#5b6675}
.it-hit{font-size:12px;color:var(--muted);white-space:nowrap}
@media (max-width:1300px){ .it-cards{grid-template-columns:repeat(5,minmax(0,1fr))} }
@media (max-width:900px){ .it-cards{grid-template-columns:repeat(3,minmax(0,1fr))} }

/* ③ 本级经验曲线（纯 CSS 柱状：30 根并排也各自收窄，不横向滚动） */
.plc-curve{display:flex;align-items:flex-end;gap:3px;height:132px;padding-top:4px}
.plc-bar{flex:1 1 0;min-width:0;height:100%;display:flex;align-items:flex-end}
.plc-bar>i{display:block;width:100%;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#bfe0ff,#7cbcf5)}
.plc-bar.done>i{background:linear-gradient(180deg,#7cc0ff,#1e7fd0)}
.plc-bar.now>i{background:linear-gradient(180deg,#FFB055,#FF8100)}
.plc-curve-x{display:flex;gap:3px;margin-top:5px}
.plc-curve-x>span{flex:1 1 0;min-width:0;text-align:center;font-size:9.5px;color:#aeb8c6}
.plc-curve-x>span.on{color:#E8590C;font-weight:700}

/* ④ 口径与规则 */
.plc-rules{margin:0;padding-left:18px;font-size:12.5px;color:#5b6675;line-height:1.85}
.plc-rules b{color:#1e7fd0}
.plc-rules li+li{margin-top:2px}

/* ⑤ 每日经验上限规则（后台） */
.plc-caps{display:grid;gap:6px}
.plc-cap-row{display:flex;align-items:center;flex-wrap:wrap;gap:5px 12px;padding:7px 11px;
  border-radius:9px;background:#f7fafd;font-size:12.5px;color:#5b6675;min-width:0}
.plc-cap-row b{font-variant-numeric:tabular-nums;color:#334155;font-size:13px}
.plc-cap-row i{font-style:normal;font-weight:700;color:#1e7fd0;font-variant-numeric:tabular-nums}
.plc-cap-row em{font-style:normal;color:#8a94a6;font-size:12px;min-width:0;overflow-wrap:anywhere}
.plc-cap-row .btn{margin-left:auto}

/* 今日卡上的「测算中」小标签 + 恢复默认 */
.plc-chip.calc{background:#fff7ed;border-color:#fed7aa;color:#b45309;gap:6px;display:inline-flex;align-items:center}
.plc-chip .plc-back{margin-left:6px;color:#1e7fd0;text-decoration:none;border-bottom:1px dashed #9cc8f0}
.plc-chip .plc-back:hover{text-decoration:none;border-bottom-style:solid}

/* 窄屏：台阶与柱子一起收窄，今日卡改成竖排 */
@media (max-width:620px){
  .plc-ladder{grid-template-columns:repeat(auto-fill,minmax(48px,1fr))}
  .plc-curve{height:104px}
  .plc-lv{width:100%;height:auto;padding:9px 0;border-radius:14px;flex-direction:row;justify-content:center;gap:6px}
  .plc-lv em{font-size:11.5px}
  .plc-lv b{font-size:26px}
}