:root{--c-bg:#101418;--c-surface:#182028;--c-border:#28323c;--c-accent:#3fa8ff;--c-text:#e4e8ec;--radius:6px;--space:14px;--control-height:38px;--control-height-sm:28px;--control-gap:10px;}
/* 语义令牌：同义值收敛到单一来源；新增样式一律引用令牌，不要再写字面量。 */
:root{
  --c-text-muted:#9cb0c4;--c-text-dim:#7b8a97;--c-text-strong:#c7d0d9;
  --c-surface-1:#141b1f;--c-surface-2:#0d1621;--c-surface-3:#08121c;--c-surface-input:#121a21;
  --c-border-soft:rgba(148,177,208,.12);--c-border-strong:#3d4a56;
  --c-accent-tint:rgba(63,168,255,.14);
  --c-success:#1f8b4d;--c-success-fg:#58d2a0;
  --c-warn:#d97706;--c-warn-fg:#ffd8a3;
  --c-danger:#dc2626;--c-danger-fg:#ff9090;
  --c-info:#1f6feb;--c-info-fg:#82c9ff;
  --z-dropdown:20;--z-sticky:30;--z-overlay:40;--z-modal:50;--z-toast:60;--z-tooltip:70;
  --lh-body:1.6;--lh-tight:1.35;--lh-code:1.5;
  --dur-fast:.15s;--dur:.2s;--dur-slow:.28s;
  --ctl-h:34px;--ctl-h-sm:28px;--ctl-h-table:36px;--ctl-h-table-sm:30px;
  /* 层级：数值沿用改造前的量级，避免一次性重排造成遮挡关系翻车 */
  --z-toolbar:900;--z-overlay:1000;--z-toast:1500;--z-tooltip:2000;--z-dropdown:2200;--z-portal-menu:6000;
  --font-ui:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans','PingFang SC','Hiragino Sans GB','Source Han Sans SC','Noto Sans CJK SC','Microsoft Yahei',sans-serif;
  /* 兼容模块样式里引用却从未定义的旧名字（supervisor/trivia/creature）。
     它们过去靠 var() 的 fallback 落到 GitHub Primer 配色，与面板主色系不同族。 */
  --muted:var(--c-text-muted);--surface:var(--c-surface);--surface-2:var(--c-surface-2);
  --border:var(--c-border);--border-strong:var(--c-border-strong);
  --accent:var(--c-accent);--border-color:var(--c-border);
  --panel-bg:rgba(255,255,255,.02);--c-bg-alt:var(--c-surface-1);
}
/* Status semantic colors */
:root{--c-status-online:#16a34a;--c-status-online-alt:#155e31;--c-status-banned:#7a1b1b;--c-status-offline-bg:#24303a;}
/* Diff text semantic colors */
:root{--c-diff-bad:#ff6767;--c-diff-ok:#67ff8c;}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--font-ui);line-height:var(--lh-body);background:
	linear-gradient(180deg,#09111a 0%,#0b141d 28%,#0d151d 58%,#0a1219 100%),
	radial-gradient(circle at 14% 10%,rgba(68,128,200,.24),rgba(68,128,200,0) 34%),
	radial-gradient(circle at 88% 16%,rgba(43,151,137,.18),rgba(43,151,137,0) 30%),
	radial-gradient(circle at 50% 78%,rgba(24,64,104,.12),rgba(24,64,104,0) 34%),
	#09111a;color:var(--c-text);background-attachment:scroll;}a{color:var(--c-accent);text-decoration:none;}a:hover{text-decoration:underline;}
.layout-shell-bg{position:relative;min-height:100vh;padding:24px 20px 0;background:linear-gradient(135deg,rgba(255,255,255,.012),rgba(255,255,255,0) 42%);}
.layout-shell-bg:before{content:"";position:fixed;inset:-10% auto auto -6%;width:44vw;height:44vw;background:radial-gradient(circle,rgba(76,145,226,.12),rgba(76,145,226,0) 70%);pointer-events:none;filter:blur(10px);opacity:.92;}
.layout-shell-bg:after{content:"";position:fixed;right:-10vw;top:-6vh;width:38vw;height:38vw;background:radial-gradient(circle,rgba(58,190,170,.1),rgba(58,190,170,0) 72%);pointer-events:none;filter:blur(8px);opacity:.88;}
.layout-grid{display:grid;grid-template-columns:220px 1fr;min-height:100vh;}
/* 网格列的 min-width 默认是 auto（=min-content），一张宽表就能把整列撑得比视口还宽，
   连带侧栏和汉堡按钮跑到屏幕外。放开收缩，超宽由表面的横向滚动去处理。 */
.layout-grid > main{min-width:0;}
.layout-grid--shell{position:relative;z-index:1;gap:22px;min-height:calc(100vh - 24px);}
aside.sidebar{background:#0d1216;border-right:1px solid var(--c-border);padding:20px 16px;position:sticky;top:0;align-self:start;height:100vh;overflow:auto;display:flex;flex-direction:column;gap:16px;}
.sidebar--shell{background:linear-gradient(180deg,rgba(13,27,43,.94),rgba(11,19,30,.92));border:1px solid rgba(94,168,255,.12);border-radius:22px;box-shadow:0 28px 70px rgba(4,13,22,.42);padding:26px 18px;height:calc(100vh - 28px);top:14px;backdrop-filter:blur(10px);}
.sidebar__brand{display:flex;flex-direction:column;gap:8px;}
aside.sidebar h2{margin:0;font-size:17px;}
aside.sidebar ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;}
aside.sidebar li{margin:0;}
aside.sidebar a{display:block;padding:6px 10px;border-radius:4px;font-size:13px;background:#141b22;color:var(--c-text);}aside.sidebar a.active,aside.sidebar a:hover{background:var(--c-accent);color:#0d1b24;}
aside.sidebar .sidebar-metrics{margin-top:auto;font-size:11.5px;color:#7b8a97;border-top:1px solid rgba(255,255,255,.07);padding-top:12px;line-height:1.5;display:flex;flex-direction:column;gap:2px;}
/* 分组标题：不是链接，只有组内条目才有链接样式 */
aside.sidebar .sidebar-nav__group{margin:4px 0 0;padding:0 10px;font-size:11.5px;font-weight:600;letter-spacing:.06em;color:#7b8a97;}
/* 视口偏矮时让出性能读数：导航优先，侧栏不出滚动条 */
@media (max-height:950px){aside.sidebar .sidebar-metrics{display:none;}}
aside.sidebar .sidebar-metrics strong{color:#c7d0d9;font-weight:600;font-size:12px;}
/* 侧栏标题块：桌面端与原先把 h2/p 直接放进 .sidebar__brand 的观感一致；移动端才与汉堡按钮并排 */
.sidebar__title{display:flex;flex-direction:column;gap:8px;min-width:0;}
/* 导航折叠按钮：桌面端不出现，只在 ≤960px 且 <html> 带 js 标记时显示（见文末移动端块） */
.sidebar-toggle{display:none;align-items:center;gap:8px;flex:0 0 auto;padding:8px 12px;border-radius:12px;
	border:1px solid rgba(94,168,255,.28);background:rgba(20,32,48,.9);color:var(--c-text);
	font:inherit;font-size:13px;line-height:1;cursor:pointer;}
.sidebar-toggle:hover{background:rgba(30,48,70,.95);border-color:rgba(94,168,255,.45);}
.sidebar-toggle:focus-visible{outline:2px solid var(--c-accent);outline-offset:2px;}
.sidebar-toggle__icon{position:relative;display:block;width:16px;height:2px;background:currentColor;}
.sidebar-toggle__icon:before,.sidebar-toggle__icon:after{content:"";position:absolute;left:0;width:16px;height:2px;background:currentColor;}
.sidebar-toggle__icon:before{top:-5px;}
.sidebar-toggle__icon:after{top:5px;}
/* 正文列占满栅格轨道（上限 1240）再居中：margin:auto 会让栅格项退化为 fit-content，
   列宽随内容变化，换页时整块正文左右跳动。 */
main.container{width:100%;max-width:1240px;margin:0;justify-self:center;padding:var(--space);}footer.site-footer{padding:24px 0 42px;text-align:center;font-size:12px;color:#91a0af;position:relative;z-index:1;}
.app-shell-main{padding:0 0 18px;}
/* backdrop-filter 只保留在侧栏（220px 宽）：正文面板整块 1240px 做背景采样会在滚动时
   反复触发合成与回读，而它盖住的只是 body 的静态渐变，毛玻璃几乎看不出来。 */
.app-shell-panel{position:relative;background:linear-gradient(180deg,rgba(12,22,36,.94),rgba(8,14,24,.92));border:1px solid rgba(94,168,255,.12);border-radius:28px;padding:28px 30px 34px;box-shadow:0 30px 90px rgba(4,13,22,.44);overflow:clip;}
.app-shell-panel:before{content:"";position:absolute;inset:-18% -12% auto -14%;height:62%;background:radial-gradient(circle at 18% 12%,rgba(79,145,226,.16),rgba(79,145,226,.08) 22%,rgba(79,145,226,0) 68%);pointer-events:none;filter:blur(10px);opacity:.95;}
.app-shell-panel:after{content:"";position:absolute;inset:auto -16% -24% 24%;height:46%;background:radial-gradient(circle at 72% 40%,rgba(51,156,140,.08),rgba(51,156,140,0) 70%);pointer-events:none;filter:blur(12px);opacity:.78;}
.app-shell-panel > *{position:relative;z-index:1;}
h1.page-title{margin:0;font-size:20px;font-weight:600;letter-spacing:.2px;color:#eef4fa;}
.page-header{display:flex;justify-content:space-between;align-items:flex-end;gap:14px;flex-wrap:wrap;margin:0 0 18px;}
.page-header__main{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1 1 320px;max-width:720px;}
.page-header__intro,.page-header__note{margin:0;line-height:1.7;color:#9cb0c4;font-size:14px;}
.page-header__actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-end;}
/* 面包屑：层级由 PageMetadata 逐视图提供，<ol> 用分隔符而非背景色表达「更深一层」。 */
.breadcrumb{margin:0 0 10px;}
.breadcrumb__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12px;color:var(--c-text-dim);}
.breadcrumb__item{display:inline-flex;align-items:center;gap:6px;}
.breadcrumb__item+.breadcrumb__item:before{content:"/";color:var(--c-border-strong);}
.breadcrumb__item a{color:var(--c-text-muted);text-decoration:none;}
.breadcrumb__item a:hover{color:var(--c-accent);text-decoration:underline;}
.breadcrumb__item [aria-current="page"]{color:var(--c-text);}
.layout-topbar{display:flex;justify-content:flex-end;gap:10px;align-items:center;margin:0;}
.app-shell-toolbar{padding:0 0 14px;border-bottom:1px solid rgba(148,177,208,.08);margin-bottom:18px;}
.layout-topbar__actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end;}
.layout-warning-banner{position:relative;z-index:2;max-width:1240px;margin:0 auto 18px;border-radius:16px;}
.page-toolbar{position:sticky;top:0;z-index:var(--z-toolbar);display:flex;gap:10px;align-items:center;padding:8px 0 10px;background:linear-gradient(#101418 75%,rgba(16,20,24,0));}
.item-toolbar{flex-direction:column;align-items:stretch;gap:6px;padding-top:10px;}
.item-toolbar .toolbar-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.item-toolbar .top-line{flex-wrap:nowrap;}
.item-toolbar .toolbar-nav{display:flex;flex-wrap:wrap;gap:6px;}
.item-toolbar .toolbar-actions{display:flex;gap:8px;flex-wrap:wrap;}
.toolbar-spacer{flex:1 1 auto;}
.page-toolbar .spacer{flex:1;}
.toolbar-group{display:flex;gap:8px;flex-wrap:wrap;}
.btn.primary{background:var(--c-accent);}
.btn.info{background:#3b82f6;}
.btn.warn{background:var(--c-warn);}
.btn.danger{background:var(--c-danger);}
.btn.success{background:var(--c-success);}
.btn.neutral{background:#2a3440;color:#c7d0d9;}
.btn.neutral:hover{opacity:.92;}
.btn.info,.btn.warn,.btn.danger,.btn.success{color:#fff;}
.text-right{text-align:right!important;}
.full-width{width:100%!important;}
.quality-preview{display:inline-block;margin-top:4px;}
.bitmask-field{display:flex;align-items:center;gap:6px;}
.sql-section{margin-top:16px;}
.sql-result{background:var(--c-surface-input);border:1px solid var(--c-border);padding:10px 12px;font-size:12px;line-height:1.4;border-radius:6px;max-height:220px;overflow:auto;}
/* 通用 modal 隐藏/显示控制：所有 .modal-backdrop 默认为隐藏，.active 时显示 */
.modal-backdrop{display:none;}
.modal-backdrop.active{display:flex;}
body.modal-open{overflow:hidden;}
#bitmask-modal{display:none;}
#bitmask-modal.active{display:flex;}
/* 表格：横向分隔线 + 斑马纹 + 悬停高亮。整格 1px 描边在长列表里像电子表格。
   表头吸顶：主列表普遍 9 列，排序入口也在表头，滚过首屏后必须还能看到列名。
   等宽数字：否则逐行比对 id/时间/金币时各位对不齐。 */
.table{width:100%;border-collapse:collapse;margin:16px 0;font-size:13.5px;font-variant-numeric:tabular-nums;}
.table th,.table td{padding:7px 10px;vertical-align:middle;border:0;border-bottom:1px solid rgba(148,177,208,.1);}
.table thead th{position:sticky;top:0;z-index:2;padding:8px 10px;text-align:left;background:#1b242d;color:#cfdae5;font-weight:600;font-size:12.5px;letter-spacing:.02em;white-space:nowrap;border-bottom:1px solid rgba(148,177,208,.22);}
.table tbody tr:nth-child(even){background:rgba(255,255,255,.038);}
.table tbody tr:hover{background:rgba(63,168,255,.11);}
.table tbody tr:last-child td{border-bottom:0;}
/* 紧凑表：角色详情页的技能/声望/光环/成就等长表使用。 */
.table--compact{font-size:12.5px;margin:10px 0;}
.table--compact th,.table--compact td{padding:4px 8px;}
/* 宽表横向滚动容器：包在 <table> 外层，不要给表格自身写 display:block
   （那会把匿名内层表盒变成 shrink-to-fit，窄表不再铺满面板）。 */
.table-wrap{overflow-x:auto;max-width:100%;}
.table-wrap > .table{margin:0;}
.btn{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;text-align:center;text-decoration:none;line-height:1.2;background:var(--c-accent);border:none;color:#fff;padding:0 14px;border-radius:11px;cursor:pointer;font-size:13px;font-weight:600;letter-spacing:.01em;white-space:nowrap;min-height:var(--control-height);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease;}
.btn.outline{background:rgba(15,25,35,.25);border:1px solid var(--c-accent);color:var(--c-accent);} .btn:hover{opacity:1;transform:translateY(-1px);box-shadow:0 10px 24px rgba(10,17,28,.24),inset 0 1px 0 rgba(255,255,255,.08);}
.btn.outline.info{border-color:#3b82f6;color:#3b82f6;background:rgba(59,130,246,.08);}
.btn.outline.warn{border-color:var(--c-warn);color:var(--c-warn);background:rgba(217,119,6,.08);}
.btn.outline.danger{border-color:var(--c-danger);color:var(--c-danger);background:rgba(220,38,38,.08);}
.btn.outline.success{border-color:var(--c-success);color:var(--c-success);background:rgba(31,139,77,.08);}
.btn-sm{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;text-align:center;padding:0 9px;font-size:12px;margin:0;line-height:1.2;border-radius:9px;min-height:var(--control-height-sm);}
/* 次级操作按钮（视图中的 btn ghost）：透明底 + 描边，与主按钮拉开层级。 */
.btn.ghost{background:transparent;border:1px solid rgba(148,163,178,.28);color:#c7d0d9;box-shadow:none;}
.btn.ghost:hover{background:rgba(148,163,178,.12);border-color:rgba(148,163,178,.45);}
/* 超小号按钮：选择器写成 .btn.btn-xs（特异度 0,2,0），不依赖「排在 .btn 之后」这一顺序约定。 */
.btn.btn-xs{padding:0 8px;font-size:11.5px;line-height:1.2;border-radius:6px;min-height:26px;}
.login-form{max-width:360px;}
.login-form__fields{display:flex;flex-direction:column;gap:14px;}
.login-form__field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#c8d4e0;}
.login-form__field input{margin-top:0;}
/* Extra utility */
.no-margin{margin:0!important;}
.flex-1{flex:1 1 auto!important;}
.align-center{align-items:center!important;}
.mb-2{margin-bottom:8px!important;}
.mt-2{margin-top:8px!important;}
/* bitmask / modal */
.modal-scroll{max-height:420px;overflow:auto;}
.bitmask-options-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px;}
.bitmask-anchor{position:relative;overflow:visible;}
.bitmask-popup{position:absolute;top:calc(100% + 4px);left:0;z-index:var(--z-dropdown);background:#18242c;border:1px solid #2b3a44;padding:8px;box-shadow:0 4px 12px rgba(0,0,0,.4);border-radius:6px;min-width:320px;max-width:min(420px,calc(100vw - 32px));}
.bitmask-popup__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:13px;color:var(--c-text-muted);}
.bitmask-popup__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;}
.bit-cell{padding:4px 0;font-size:12px;border:1px solid #2e4450;background:#23323c;color:var(--c-text-muted);border-radius:4px;cursor:pointer;}
.bit-cell[data-active="1"]{background:#1b6b3d;color:#d6ffe8;}
.bitmask-popup__footer{margin-top:6px;display:flex;justify-content:space-between;align-items:center;font-size:12px;gap:8px;}
/* 筛选面板（账号 / 角色 / 邮件共用外观）：字段一律"标签在上、控件在下"，宽度由 12 栏栅格 + 修饰符控制 */
.mail-filter-form{display:flex;flex-direction:column;gap:10px;margin:0 0 16px;padding:14px 16px;background:linear-gradient(180deg,rgba(16,28,43,.78),rgba(13,23,35,.74));border:1px solid rgba(90,146,199,.12);border-radius:16px;box-shadow:0 18px 44px rgba(3,10,18,.22);backdrop-filter:blur(8px);}
.list-summary,.char-results-meta{margin:0 0 14px;color:var(--c-text-muted);font-size:13px;}
.account-bulk-toolbar,.char-bulk-bar{margin:0 0 16px;padding:12px 14px;background:rgba(18,31,46,.72);border:1px solid rgba(80,131,181,.12);border-radius:14px;}

/* ==== 列表页共用筛选面板（账号管理 / 角色管理） ====
   一条可换行的工具条：字段吃满剩余宽度，动作按钮跟在右边；放不下时整组换行、仍靠右。 */
.list-filter{
  display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px 16px;
  margin:0 0 18px;padding:16px 18px;
  background:linear-gradient(180deg,rgba(16,28,43,.78),rgba(13,23,35,.74));
  border:1px solid rgba(90,146,199,.14);border-radius:16px;
  box-shadow:0 18px 44px rgba(3,10,18,.22);backdrop-filter:blur(8px);
}
.list-filter__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:14px 16px;}
.list-filter__field{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#96a6b5;min-width:0;grid-column:span 3;}
.list-filter__field > span{font-weight:600;color:#a9b9c7;font-size:12.5px;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.list-filter__field input,
.list-filter__field select{width:100%;min-width:0;margin:0;}
/* 栅格宽度修饰符：2/12（窄） · 4/12（三分之一） · 6/12（一半） · 12/12（整行） */
.list-filter__field--narrow{grid-column:span 2;}
.list-filter__field--third{grid-column:span 4;}
.list-filter__field--half{grid-column:span 6;}
.list-filter__field--full{grid-column:span 12;}
.list-filter__range{display:flex;align-items:center;gap:6px;min-width:0;}
.list-filter__range input{flex:1 1 0;min-width:0;}
.list-filter__range-sep{color:#6f8296;flex:0 0 auto;}

/* 单行筛选条：等分栅格会把短字段拉得很空旷，改用弹性行 —— --lfw 理想宽度、--lfw-min 压缩下限。
   flex-basis 取得远小于字段实际所需宽度，工具条才有机会与右侧动作按钮排在同一行。 */
.list-filter__grid--fit{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px 12px;flex:1 1 320px;min-width:0;}
.list-filter__grid--fit .list-filter__field{
  flex:1 1 var(--lfw-min,160px);
  max-width:var(--lfw,160px);
  min-width:0;
  grid-column:auto;
}
.list-filter__grid--fit .list-filter__field > input,
.list-filter__grid--fit .list-filter__field > select,
.list-filter__grid--fit .list-filter__field > .list-filter__range{width:100%;min-width:0;}
/* 字段宽度预设（--lfw 理想宽度，--lfw-min 压缩下限；均含 padding/border，下限按占位符刚好放得下来取） */
.list-filter__field--fit-name{--lfw:calc(11ch + 26px);--lfw-min:80px;}
.list-filter__field--fit-id{--lfw:calc(6ch + 26px);--lfw-min:60px;}
.list-filter__field--fit-account{--lfw:calc(15ch + 26px);--lfw-min:92px;}
.list-filter__field--fit-text{--lfw:calc(14ch + 26px);--lfw-min:110px;}
.list-filter__field--fit-level{--lfw:132px;--lfw-min:122px;}
.list-filter__field--fit-select{--lfw:96px;--lfw-min:76px;}

/* 反馈 + 动作作为工具条右端的一组：margin-left:auto 让它在同一行贴右，换行时也靠右。 */
.list-filter__footer{
  display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;
  flex:0 1 auto;margin:0 0 0 auto;padding:0;border-top:0;
}
.list-filter__status{display:flex;align-items:center;gap:8px;flex:0 1 auto;min-width:0;}
.list-filter__actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-end;flex:0 0 auto;}
.list-filter__actions .btn{text-decoration:none;}
.list-filter .panel-flash{margin:0;}
/* 面板里的提示语不是状态闪条：去掉边框底色，否则和右边的按钮长得一样。 */
.list-filter__status .panel-flash--info{background:transparent;border-color:transparent;color:#93a3b3;padding:0 2px;font-weight:400;font-size:12.5px;}

@media (max-width:1439px){
  /* 侧边栏占 220px，中等宽度下用 3 栏最稳：字段约 190–340px */
  .list-filter__grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .list-filter__field,
  .list-filter__field--narrow,
  .list-filter__field--third,
  .list-filter__field--half{grid-column:span 1;}
}
@media (max-width:1112px){
  /* 961–1112px 之间侧边栏仍是竖排，收紧面板内边距与字段间距，保证单行筛选条排得下 */
  .list-filter{padding:14px;}
  .list-filter__grid--fit{gap:14px 10px;}
}
@media (max-width:640px){
  .list-filter__grid{grid-template-columns:1fr;}
  .list-filter__field,
  .list-filter__field--narrow,
  .list-filter__field--third,
  .list-filter__field--half,
  .list-filter__field--full{grid-column:auto;}
  .list-filter__grid--fit .list-filter__field{flex:1 1 100%;max-width:none;}
  .list-filter__grid--fit .list-filter__field > input,
  .list-filter__grid--fit .list-filter__field > select,
  .list-filter__grid--fit .list-filter__field > .list-filter__range{width:100%;}
  .list-filter__footer{align-items:stretch;}
  .list-filter__actions{justify-content:flex-start;}
}

/* ===== 行内操作：高频按钮平铺，其余收进"更多"菜单 ===== */
.row-action-bar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
.row-menu{position:relative;display:inline-block;}
.row-menu > summary{list-style:none;cursor:pointer;user-select:none;}
.row-menu > summary::-webkit-details-marker{display:none;}
.row-menu[open] > summary{background:var(--c-accent);color:#fff;border-color:transparent;}
.row-menu__list{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:160px;display:flex;flex-direction:column;gap:4px;padding:8px;border-radius:10px;background:#16202b;border:1px solid rgba(90,146,199,.28);box-shadow:0 14px 34px rgba(3,10,18,.45);}
.row-menu__list .btn{width:100%;justify-content:flex-start;}
.row-menu__list .btn:disabled{opacity:.5;cursor:not-allowed;}
/* 下拉菜单不能被单元格裁掉 */
.table td,.table th{overflow:visible;}

/*
 * "更多"菜单的浮层态：.row-menu__list 默认 absolute，但祖先链上的
 * .app-shell-panel{overflow:hidden} 会把它裁掉（单元格的 overflow:visible 无法突破）；
 * account.js 打开时把它挂到 <body> 下并加上本类，坐标由脚本按触发按钮计算。
 */
.row-menu__list--portal{
  position:fixed;
  right:auto;
  z-index:var(--z-portal-menu);
  display:flex;
  min-width:160px;
}

@media (max-width:960px){
  /* 窄屏放不下"字段 + 动作"一行：各占整行，动作靠左 */
  .list-filter{align-items:stretch;}
  .list-filter__grid--fit{flex:1 1 100%;}
  .list-filter__footer{flex:1 1 100%;margin:0;justify-content:flex-start;align-items:stretch;}
  .list-filter__actions{justify-content:flex-start;}
}

.table-sort{color:inherit;text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
.table-sort:hover{text-decoration:underline;}
/* 排序状态：方向字形（▲▼，由视图输出）是主信号，颜色与字重只作辅助 ——
   只靠颜色在色弱与高对比模式下读不出「升还是降」。 */
.table-sort.is-active{color:var(--c-accent);font-weight:600;}
.table-sort.is-asc,.table-sort.is-desc{text-decoration:none;}
.table-sort__dir{display:inline-block;min-width:.9em;text-align:center;font-size:11.5px;line-height:1;font-variant-numeric:tabular-nums;}
/* 列表筛选动作按钮区统一样式 */
.filter-actions{display:inline-flex;align-items:center;gap:10px;flex-wrap:nowrap;margin-left:0;}
.filter-actions .btn{padding:0 11px;font-size:13px;line-height:1.2;min-height:var(--ctl-h);}
.filter-actions .btn.primary{background:var(--c-accent);}
.filter-actions .btn.success{background:var(--c-success);}
.filter-actions .btn.dark{background:#2a3440;}
.filter-actions .btn.outline{background:transparent;}
/* 补齐 search/date/password 等类型：漏掉时按浏览器默认高度渲染，与下拉/按钮对不齐。 */
input[type=text],input[type=number],input[type=search],input[type=email],input[type=password],input[type=tel],input[type=url],input[type=date],input[type=datetime-local],input[type=month],input[type=week],input[type=time],select{background:rgba(18,26,33,.95);border:1px solid rgba(78,102,124,.82);color:var(--c-text);padding:0 12px;border-radius:11px;font-size:13px;position:relative;z-index:5;min-height:var(--control-height);transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;}
input[type=text]:focus,input[type=number]:focus,input[type=search]:focus,input[type=email]:focus,input[type=password]:focus,input[type=tel]:focus,input[type=url]:focus,input[type=date]:focus,input[type=datetime-local]:focus,input[type=month]:focus,input[type=week]:focus,input[type=time]:focus,select:focus{outline:none;border-color:rgba(74,165,255,.72);box-shadow:0 0 0 3px rgba(63,168,255,.14);background:rgba(20,30,39,.98);}
/* 数字框去掉浏览器自带的步进箭头：占宽度，且容易被误认成一个可点的控件。 */
input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;}
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
textarea{background:rgba(18,26,33,.95);border:1px solid rgba(78,102,124,.82);color:var(--c-text);padding:10px 12px;border-radius:12px;font-size:14px;line-height:1.55;resize:vertical;min-height:96px;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;}
textarea:focus{outline:none;border-color:rgba(74,165,255,.72);box-shadow:0 0 0 3px rgba(63,168,255,.14);background:rgba(20,30,39,.98);}
.badge{display:inline-block;padding:2px 6px;font-size:12px;border-radius:4px;background:#24303a;color:var(--c-text-muted);}
.flash{padding:10px 14px;border-radius:var(--radius);background:#1e2c38;border:1px solid #314559;margin:14px 0;}
.grid-cols-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
/* ==== 移动端（≤960px）====
   左侧 220px 侧栏在窄屏改成"顶部一条 + 可折叠导航"：内容不必先滚过一整屏菜单。
   ⚠️ 选择器一律写成 aside.sidebar--shell / aside.sidebar--shell ul 这种带 aside 的形态：
   基座规则是 aside.sidebar（0,1,1）与 aside.sidebar ul（0,1,2），原来这里只写 .sidebar--shell（0,1,0）
   特异性不够，position/height/flex-direction/ul 的 display 全被基座压回去，于是窄屏上侧栏仍是
   100vh 的竖排菜单——菜单占满首屏、正文被顶到折叠线以下。
   html.js 门控"默认收起"：JS 失效时导航保持今天的展开形态，不会把菜单弄丢。
   标记由 assets/js/boot.js 打上（不能内联，CSP 会拦）。 */
@media (max-width:960px){
	.layout-shell-bg{padding:16px 12px 0;}
	.layout-grid{grid-template-columns:1fr;}
	.layout-grid--shell{gap:14px;min-height:auto;}
	aside.sidebar--shell{
		border-right:none;
		border-bottom:1px solid rgba(94,168,255,.12);
		display:flex;
		flex-direction:column;
		align-items:stretch;
		gap:0;
		overflow:visible;
		position:relative;
		top:0;
		height:auto;
		align-self:stretch;
		padding:14px 16px;
		border-radius:18px;
	}
	aside.sidebar--shell .sidebar__brand{flex-direction:row;align-items:center;justify-content:space-between;gap:12px;}
	html.js .sidebar-toggle{display:inline-flex;}
	html.js aside.sidebar--shell ul{display:none;}
	html.js aside.sidebar--shell.is-open ul{
		display:grid;
		grid-template-columns:repeat(2,minmax(0,1fr));
		gap:6px;
		margin-top:12px;
	}
	aside.sidebar--shell li{margin:0;}
	/* 折叠后是两列网格，分组标题占满整行，否则会被挤进某一列 */
	aside.sidebar--shell .sidebar-nav__group{grid-column:1/-1;margin:6px 0 0;padding:0 2px;text-align:left;}
	aside.sidebar--shell a{padding:9px 10px;font-size:13px;text-align:center;}
	aside.sidebar--shell .sidebar-metrics{display:none;}
	/* 窄屏不需要居中留白，宽度交给栅格轨道。 */
	main.container{margin:0;padding:0;}
	.app-shell-main{padding:0 0 12px;}
	.app-shell-panel{padding:18px 14px 22px;border-radius:20px;}
	.page-header{align-items:flex-start;gap:12px;}
	.layout-warning-banner{margin:0 0 14px;}
}
.page-header__actions .btn.primary{background:var(--c-accent);color:#fff;}
/* Utility classes */
.m-0{margin:0!important}.mt-1{margin-top:4px!important}.mt-2{margin-top:8px!important}.mt-3{margin-top:12px!important}.mt-4{margin-top:16px!important}
.flex{display:flex}.flex-col{flex-direction:column}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}
.muted{color:var(--c-text-dim);}
.small{font-size:12px!important;}
.alert{padding:10px 14px;border-radius:var(--radius);background:#2b2335;border:1px solid #40304f;color:#e2d2f3;}
/* 警告横幅配色：与 .alert 的紫底区分，用于 warning_banner 输出的提示。 */
.alert-warning{background:rgba(217,119,6,.14);border:1px solid rgba(217,119,6,.45);color:var(--c-warn-fg);}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.55);align-items:flex-start;justify-content:center;z-index:var(--z-overlay);padding-top:60px;display:none;pointer-events:none;}
.modal-backdrop.active{display:flex;pointer-events:auto;}
.modal-panel{background:#192129;border:1px solid var(--c-border);border-radius:8px;min-width:420px;max-width:760px;width:80%;padding:18px 20px;box-shadow:0 8px 30px rgba(0,0,0,.4);}
.modal-panel.modal-panel--narrow{min-width:0;max-width:460px;width:100%;}
.modal-panel header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.modal-panel h3{margin:0;font-size:16px;}
.modal-close{background:transparent;border:none;color:#8899aa;font-size:18px;cursor:pointer;}
.tag{display:inline-block;background:#24303a;color:var(--c-text-muted);font-size:11.5px;padding:2px 6px;border-radius:3px;margin:0 4px 4px 0;}
/* Flash zone (was inline styles in JS) */
.flash-zone{position:fixed;top:14px;right:14px;z-index:var(--z-toast);display:flex;flex-direction:column;gap:8px;max-width:340px;}
.flash-zone .flash{margin:0;}
/* Modal footer alignment utility */
.modal-footer-right{text-align:right;margin-top:14px;}
/* Inline style replacements */
.nowrap{white-space:nowrap!important;}
/* Status badges */
.status-online{background:var(--c-status-online)!important;color:#fff;}
.status-online-alt{background:var(--c-status-online-alt)!important;color:#fff;}
.status-banned{background:var(--c-status-banned)!important;color:#fff;}
.status-offline{background:var(--c-status-offline-bg)!important;}
/* Diff & verification helpers */
.diff-row-changed{background:#4b2d2d !important;}
.flash-warn{background:#4d3b1a !important;}
.flash-ok{background:#1e3b28 !important;}
/* Diff text helpers */
.text-diff-bad{color:var(--c-diff-bad)!important;}
.text-diff-ok{color:var(--c-diff-ok)!important;}
/* Monospace & code blocks */
.mono{font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace; font-size:13px;}
.code-block{background:var(--c-surface-input);border:1px solid var(--c-border);padding:10px 12px;border-radius:6px;overflow:auto;max-height:300px;line-height:1.45;}
/* Modal table alignment utility */
.modal-table-left th, .modal-table-left td { text-align:left; }

/* Character modal kick button disabled state */
.action-kick-char[disabled] {
	opacity: .45;
	cursor: not-allowed;
	filter: grayscale(40%);
	border-color: #444 !important;
	background: #2a333b !important;
	color: #88939c !important;
	text-decoration: line-through;
}

/* Item quality coloring (decoupled from legacy MT naming) */
/* CSS variables for qualities */
:root{
	--item-quality-poor:#9d9d9d;
	--item-quality-common:#ffffff;
	--item-quality-uncommon:#1eff00;
	--item-quality-rare:#0070dd;
	--item-quality-epic:#a335ee;
	--item-quality-legendary:#ff8000;
	--item-quality-artifact:#e6cc80;
	--item-quality-heirloom:#e6cc80;
	--item-quality-unknown:#b4c0cc;
}
/* Number-based (backward compatibility) */
.item-quality-q0{color:var(--item-quality-poor)!important;}
.item-quality-q1{color:var(--item-quality-common)!important;}
.item-quality-q2{color:var(--item-quality-uncommon)!important;}
.item-quality-q3{color:var(--item-quality-rare)!important;}
.item-quality-q4{color:var(--item-quality-epic)!important;}
.item-quality-q5{color:var(--item-quality-legendary)!important;}
.item-quality-q6{color:var(--item-quality-artifact)!important;}
.item-quality-q7{color:var(--item-quality-heirloom)!important;}
.item-quality-unknown{color:var(--item-quality-unknown)!important;}
/* Name-based semantic classes */
.item-quality-poor{color:var(--item-quality-poor)!important;}
.item-quality-common{color:var(--item-quality-common)!important;}
.item-quality-uncommon{color:var(--item-quality-uncommon)!important;}
.item-quality-rare{color:var(--item-quality-rare)!important;}
.item-quality-epic{color:var(--item-quality-epic)!important;}
.item-quality-legendary{color:var(--item-quality-legendary)!important;}
.item-quality-artifact{color:var(--item-quality-artifact)!important;}
.item-quality-heirloom{color:var(--item-quality-heirloom)!important;}
.quality-badge{display:inline-block;padding:2px 6px;font-size:12px;line-height:1.1;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);border-radius:4px;font-weight:500;letter-spacing:.5px;}
.quality-badge[class*="item-quality-"]{text-shadow:0 0 4px rgba(0,0,0,.35);} 
/* 「物品名 = 可点的物品链接」的项目通用样式，标记由 bootstrap/helpers.php 的 item_name_link() 生成。
   颜色一律来自上面的 item-quality-* 类，这里只负责"这是个链接"的观感：虚线下划线，悬停转实线。
   以"徽章"呈现的物品名会同时带 .quality-badge（见物品管理列表），那种形态不加下划线。 */
a.item-name-link{text-decoration:underline;text-decoration-style:dotted;text-decoration-color:currentColor;text-underline-offset:2px;}
a.item-name-link:hover{text-decoration-style:solid;}
/* 徽章形态（物品管理列表把 .item-name-link 和 .quality-badge 叠在一起用）保持原样：
   平时无下划线、悬停才出现，与引入本规则之前完全一致。 */
a.item-name-link.quality-badge{text-decoration:none;}
a.item-name-link.quality-badge:hover{text-decoration:underline;text-decoration-style:solid;}

/* ==== 物品属性卡（悬停物品名弹出；除物品编辑页外全站生效） ====
   标记由 panel.js 的 ItemTooltip 生成、内容由 app/Support/ItemTooltip.php 渲染。
   position:fixed 是刻意的：卡片挂在 <body> 下，用视口坐标定位，不会被任何 overflow:hidden
   的表格/滚动容器裁掉。pointer-events:none 让它永远不抢鼠标，悬停判定只落在物品名上。 */
.item-tooltip{position:fixed;z-index:var(--z-tooltip);pointer-events:none;max-width:340px;min-width:200px;
	padding:10px 12px;border-radius:8px;border:1px solid rgba(140,180,225,.28);
	background:linear-gradient(180deg,rgba(12,20,32,.98),rgba(8,13,22,.98));
	box-shadow:0 18px 44px rgba(2,8,16,.6);color:var(--c-text);font-size:12.5px;line-height:1.55;
	text-align:left;white-space:normal;word-break:break-word;}
.item-tooltip[hidden]{display:none;}
.item-tooltip__content{display:flex;flex-direction:column;gap:6px;}
.item-tooltip__loading{color:#8fa8b7;letter-spacing:2px;text-align:center;padding:4px 0;}
.item-tooltip__name{font-size:13.5px;font-weight:600;line-height:1.4;}
.item-tooltip__section{display:flex;flex-direction:column;gap:3px;}
.item-tooltip__section--stats{gap:2px;}
.item-tooltip__line{display:flex;gap:10px;align-items:baseline;justify-content:space-between;}
.item-tooltip__line--bare .item-tooltip__label{color:#c7d0d9;}
.item-tooltip__line--muted .item-tooltip__value{color:#9cb0c4;}
.item-tooltip__label{color:#8fa8b7;white-space:nowrap;}
.item-tooltip__value{color:#dfe6ee;text-align:right;}
.item-tooltip__stat{color:#7ee08a;}
.item-tooltip__sep{height:1px;background:rgba(148,177,208,.16);margin:1px 0;}
.item-tooltip__desc{color:#c9d6e2;font-style:italic;}
.item-tooltip__footer{margin-top:2px;padding-top:6px;border-top:1px solid rgba(148,177,208,.12);
	color:#7b8a97;font-size:11.5px;line-height:1.45;}

.panel-flash{display:none;margin-bottom:12px;padding:10px 14px;border-radius:10px;font-weight:600;font-size:13px;border:1px solid transparent;transition:opacity .2s ease;}
.panel-flash[hidden]{display:none!important;}
/* hidden 属性的 display:none 只来自浏览器默认样式表，优先级低于任何作者声明。面板里大量元素
   自带 display（.btn 是 inline-flex，卡片/表单行/各种面板是 flex），于是这些元素加上 hidden
   根本不隐藏——实测 40 个带 hidden 的元素里有 24 个一直显示着（boss 的模拟结果面板、trivia 的
   编辑表单、物品库存的翻页条、挂单明细的撤销按钮等）。
   规范做法是补一条兜底：Bootstrap 5 与 normalize.css 都提供 [hidden]{display:none}，而因为
   要压过任意作者规则，这里必须带 !important。 */
[hidden]{display:none!important;}
.panel-flash.is-visible{display:block;}
.panel-flash--success{background:rgba(32,168,127,.18);border-color:rgba(32,168,127,.45);color:var(--c-success-fg);}
.panel-flash--error{background:rgba(205,72,69,.18);border-color:rgba(205,72,69,.45);color:var(--c-danger-fg);}
/* 模块脚本用的是 --danger（与 --error 同色的历史别名） */
.panel-flash--danger{background:rgba(205,72,69,.18);border-color:rgba(205,72,69,.45);color:var(--c-danger-fg);}
.panel-flash--info{background:rgba(63,168,255,.18);border-color:rgba(63,168,255,.45);color:var(--c-info-fg);}
.panel-flash--inline{margin-top:-4px;margin-bottom:6px;padding:6px 10px;border-radius:8px;font-size:12px;}
.home-page-title{margin-bottom:20px;}
.markdown-wrapper{background:#0b1620;border:1px solid #122130;border-radius:8px;padding:24px;box-shadow:0 8px 18px rgba(0,0,0,.25);overflow:auto;}
.markdown-body{color:#d3e3f5;line-height:1.7;}
.markdown-body h1,.markdown-body h2,.markdown-body h3{color:#f2f5f9;margin-top:28px;margin-bottom:16px;}
.markdown-body h1:first-child{margin-top:0;}
.markdown-body p{margin-bottom:16px;}
.markdown-body ul{padding-left:20px;margin-bottom:16px;}
.markdown-body li{margin-bottom:8px;}
.markdown-body table{width:100%;border-collapse:collapse;margin-bottom:20px;min-width:560px;}
.markdown-body th,.markdown-body td{border:1px solid #1f3142;padding:8px 12px;text-align:left;}
.markdown-body th{background:#122130;}
.markdown-body code{background:rgba(15,25,35,0.8);padding:2px 6px;border-radius:4px;font-size:90%;}
.markdown-body pre{background:rgba(8,14,21,0.85);border:1px solid #1b2a3a;border-radius:8px;padding:16px;overflow:auto;margin-bottom:20px;}
.markdown-body a{color:#79c0ff;text-decoration:none;}
.markdown-body a:hover{text-decoration:underline;}
.readme-source{margin-top:24px;font-size:13px;color:#6ea8ff;}
.home-empty-copy{color:#8ea2b2;}
/* 删除说明：此处原有一条 .layout-warning-banner{margin:0;border-radius:0;background:#fff3cd;color:#664d03;…}，
   它与第 85 行的同名规则互相矛盾（同特异度，后出现者胜），把横幅变成深色面板上的亮黄补丁，
   并使 .alert 的紫底声明变成死声明。配色现在统一由 .alert-warning 提供。 */
/* 只写与基座 .layout-topbar 不同处：这里再声明 margin 会盖掉 .app-shell-toolbar 的下边距。 */
.layout-topbar{justify-content:space-between;flex-wrap:wrap;}
.layout-topbar__spacer{flex:1 1 auto;min-width:0;}
.layout-topbar__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.language-switch,.server-switch{display:inline-flex;align-items:center;gap:8px;flex-wrap:nowrap;}
.server-switch{margin:0;}
.language-switch__label,.server-switch__label{font-size:13px;color:#8ea2b2;margin-right:4px;white-space:nowrap;}
.language-switch__select{min-width:148px;padding:0 10px;}
.server-switch__select{min-width:164px;padding:0 10px;}
.header-online-badge{background:#1e2d3a;color:#9ecbff;padding:0 10px;border-radius:11px;font-size:12px;display:inline-flex;align-items:center;gap:8px;min-height:var(--control-height);}
.header-online-badge__count{display:inline-flex;align-items:center;gap:4px;}
.header-online-badge__label{font-size:11.5px;color:#6ea8ff;}
/* 分页条：页码、元信息（x–y / 总数）、跳页三块同排；只有一页时组件整体不渲染。 */
.pagination-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:18px 0;}
.pagination-list{list-style:none;margin:0;padding:0;display:flex;gap:6px;flex-wrap:wrap;}
.pagination-list .pg{display:block;padding:6px 10px;background:#1b242c;border:1px solid #2a3742;border-radius:4px;font-size:13px;color:#d0d8de;text-decoration:none;}
.pagination-list .pg.active,.pagination-list .pg:hover{background:var(--c-accent);color:#0e1920;border-color:var(--c-accent);}
.pagination-list .pg.disabled,.pagination-list .pg.disabled:hover{background:#1b242c;color:#d0d8de;border-color:#2a3742;opacity:.45;cursor:not-allowed;}
.pagination-gap{padding:6px 4px;color:var(--c-text-dim);}
.pagination-meta{margin-left:auto;}
.pagination-jump{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.pagination-jump input[type=number]{width:80px;min-height:var(--ctl-h-sm);}
.mail-table__sortable{cursor:pointer;}

@media (max-width:960px){
	.layout-topbar{align-items:stretch;}
	.layout-topbar__spacer{display:none;}
	.layout-topbar__actions{width:100%;justify-content:space-between;align-items:flex-start;}
	.server-switch{margin:0;}
	.header-online-badge{margin-left:auto;}
}

@media (max-width:720px){
	/* 顶部工具条压成"两个下拉并排 + 在线数一行"：竖排三块会把正文顶到折叠线以下 */
	.layout-topbar__actions{
		display:grid;
		grid-template-columns:repeat(2,minmax(0,1fr));
		gap:8px;
		align-items:center;
		width:100%;
	}
	.language-switch,.server-switch{width:100%;min-width:0;gap:6px;}
	.server-switch{grid-column:1;}
	.language-switch{grid-column:2;}
	.language-switch__select,.server-switch__select{width:100%;min-width:0;flex:1 1 auto;}
	.language-switch__label,.server-switch__label{margin-right:0;}
	.header-online-badge{grid-column:1 / -1;justify-content:space-between;width:100%;margin-left:0;}
	.markdown-wrapper{padding:18px 16px;}
	.markdown-body table{min-width:0;display:block;overflow:auto;}
}

/* ==== Mail Detail Modal（#modal-mail-detail） ==== */
#modal-mail-detail{position:fixed;inset:0;display:none;z-index:var(--z-overlay);background:rgba(0,0,0,.55);padding:40px 20px;overflow:auto;}
#modal-mail-detail.active{display:flex;align-items:flex-start;justify-content:center;}
#modal-mail-detail .modal-panel{width:840px;max-width:100%;background:var(--c-surface-1);border:1px solid #2c3945;border-radius:8px;box-shadow:0 10px 28px rgba(0,0,0,.55);animation:popIn .18s ease;}
.modal-panel--760{max-width:760px;}
.modal-panel--820{max-width:820px;}
@keyframes popIn{from{transform:translateY(12px);opacity:0;}to{transform:translateY(0);opacity:1;}}
#modal-mail-detail header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--c-border);}
#modal-mail-detail header h3{margin:0;font-size:18px;font-weight:600;}
#modal-mail-detail .modal-body{padding:16px 20px 6px;}
#modal-mail-detail .mail-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:12px;}
#modal-mail-detail .mail-meta .kv{background:#18222a;padding:8px 10px;border:1px solid #22303a;border-radius:4px;font-size:12px;line-height:1.4;}
#modal-mail-detail .mail-meta .kv label{display:block;color:#6aa3d8;font-size:11.5px;margin-bottom:2px;}
#modal-mail-detail .subject-box{background:#10161a;border:1px solid #1d2a33;padding:10px 12px;border-radius:4px;font-size:13px;margin-bottom:10px;}
#modal-mail-detail .body-box{background:#10161a;border:1px solid #1d2a33;padding:12px 14px;border-radius:4px;font-size:13px;white-space:pre-wrap;max-height:300px;overflow:auto;margin-bottom:12px;}
#modal-mail-detail .attachments-wrap{background:#10161a;border:1px solid #1d2a33;padding:10px 12px;border-radius:4px;}
#modal-mail-detail .attachments-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;}
#modal-mail-detail .attachments-list a{background:#1e2d3a;color:#9ecbff;padding:4px 9px;border-radius:4px;font-size:12px;text-decoration:none;line-height:1.1;}
#modal-mail-detail .attachments-list a:hover{background:#274459;color:#cfe6ff;}
#modal-mail-detail footer{padding:12px 18px;border-top:1px solid var(--c-border);text-align:right;}
#modal-mail-detail .mail-detail-loading{font-size:14px;padding:40px 10px;text-align:center;color:var(--c-text-dim);}
#modal-mail-detail .status-badge{display:inline-block;background:#20313d;color:#7bc2ff;font-size:11.5px;padding:2px 6px;border-radius:12px;margin-left:8px;}

.mail-filter-form{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px;}
.mail-filter-form > input[type=text]{flex:1 1 160px;min-width:150px;}
.mail-filter-form__subject{flex:1.1 1 190px;min-width:180px;}
.mail-filter-form select{flex:0 0 156px;min-width:156px;}
.mail-filter-form__expiring{flex:0 0 112px;width:112px;}
.mail-filter-form__limit{flex:0 0 96px;width:96px;}
.table .btn{min-height:var(--ctl-h-table);padding:0 14px;border-radius:11px;font-size:13px;}
.table .btn-sm{min-height:var(--ctl-h-table-sm);padding:0 10px;}
.mail-toolbar{display:flex;align-items:center;gap:12px;margin:12px 0;flex-wrap:wrap;}
.mail-toolbar .toolbar-group{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.mail-toolbar__stats{display:flex;gap:18px;align-items:center;}
.mail-log-controls{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.mail-log-select{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#8fa3b4;}
.mail-log-select span{font-size:12px;color:var(--c-text-muted);}
.mail-log-box{max-height:420px;overflow:auto;background:#10161d;color:#94ffc7;padding:10px 12px;border:1px solid #23313c;border-radius:6px;font-family:"Consolas","Menlo","Courier New",monospace;font-size:12px;line-height:1.45;white-space:pre-wrap;}


/* ==== Mass Mail Layout & Components ==== */
/* 三张卡（发布公告 / 群发邮件·物品·金币 / 最近操作日志）竖排：各占一行并横向铺满。 */
.massmail-layout{display:flex;flex-direction:column;gap:18px;width:100%;}
.massmail-card{background:linear-gradient(180deg,rgba(20,29,36,.92),rgba(14,22,29,.9));border:1px solid rgba(79,124,164,.18);border-radius:18px;padding:18px 20px;box-shadow:0 18px 42px rgba(0,0,0,.28);position:relative;overflow:hidden;display:flex;flex-direction:column;flex:0 0 auto;width:100%;max-width:none;min-width:0;}
.massmail-card:before{content:"";position:absolute;inset:0 auto auto 0;width:100%;height:68px;background:linear-gradient(180deg,rgba(77,138,207,.08),rgba(77,138,207,0));pointer-events:none;}
.massmail-card__title{margin:0 0 14px;font-size:18px;font-weight:700;color:#e7f1fb;letter-spacing:.3px;padding-bottom:12px;border-bottom:1px solid rgba(135,168,204,.08);}
.massmail-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 16px;}
.massmail-field{display:flex;flex-direction:column;gap:6px;color:#96a6b5;font-size:13px;}
.massmail-field label{font-weight:600;color:#a9b9c7;font-size:13px;}
.massmail-field input,.massmail-field textarea,.massmail-field select{width:100%;}
.massmail-field.full-span{grid-column:1/-1;}
.massmail-gold-preview{font-size:12px;color:var(--c-text-dim);}
.massmail-actions{display:flex;justify-content:flex-end;margin-top:10px;gap:10px;}
.massmail-actions--primary{margin-top:12px;}
.massmail-actions .btn{min-width:120px;}
.massmail-hint{margin-top:8px;color:var(--c-text-dim);}
.massmail-cond{display:none;}

@media (max-width:960px){
	.mail-filter-form{padding:16px;}
	.filter-actions{flex-wrap:wrap;}
}
.massmail-cond.active{display:flex;}
.massmail-custom{display:none;}
.massmail-summary{background:#0f171c;border:1px solid rgba(70,90,105,.6);border-radius:6px;padding:10px;color:var(--c-text-strong);resize:none;min-height:96px;}
.massmail-summary:focus{outline:none;border-color:var(--c-accent);}
.massmail-custom.active{display:flex;}
.massmail-custom textarea{min-height:96px;}
.massmail-card textarea{min-height:96px;}

/* Mass Mail: Items editor */
.massmail-items{display:flex;flex-direction:column;gap:8px;}
.massmail-items__grid{display:grid;grid-template-columns:minmax(180px,1fr) minmax(140px,240px) 120px;gap:10px;align-items:center;}
.massmail-items__head{font-size:12px;color:var(--c-text-dim);}
.massmail-items__actions{display:flex;justify-content:flex-end;}
.massmail-items__grid input{min-height:var(--ctl-h-table);}

.massmail-logs__header{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;}
.massmail-logs__controls{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;}
.massmail-field--compact{gap:4px;min-width:110px;}
.massmail-field--compact span{font-size:12px;color:var(--c-text-dim);}
.massmail-logs__table{margin-top:16px;border:1px solid rgba(40,50,60,.8);border-radius:8px;overflow:auto;max-height:360px;}
.massmail-logs__table .table{margin:0;}
.massmail-logs__table .table th{position:sticky;top:0;background:#1c2530;z-index:1;}
.massmail-logs__table .table tbody tr:nth-child(even){background:rgba(20,25,32,.45);}
.log-ok td{background:rgba(32,58,46,.25);}
.log-fail td{background:rgba(84,39,39,.3);}

/* Unified logs: click summary -> highlight raw line */
.logs-summary-cell{cursor:pointer;}
.logs-summary-cell:hover{text-decoration:underline;}
.logs-raw__line{display:block;padding:0 4px;border-radius:4px;}
.logs-raw__line.is-active{background:rgba(63,168,255,.18);box-shadow:inset 0 0 0 1px rgba(63,168,255,.45);}
.massmail-confirm{max-width:520px;width:90%;background:var(--c-surface-1);border:1px solid #2c3945;border-radius:12px;box-shadow:0 18px 38px rgba(0,0,0,.5);}
.massmail-confirm__header{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid var(--c-border);}
.massmail-confirm__footer{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-top:1px solid var(--c-border);gap:16px;flex-wrap:wrap;}
.massmail-confirm__hint{flex:1 1 auto;}
.massmail-confirm__actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.massmail-confirm__actions input{width:150px;}
.modal-close{background:none;border:none;color:#8aa2b5;font-size:20px;cursor:pointer;line-height:1;}
.massmail-confirm .modal-body{padding:20px 22px;font-size:13px;color:#c8d4e0;line-height:1.55;background:#131a23;}
.massmail-confirm .summary{margin:0 0 8px 20px;padding:0;list-style:disc;color:#b1c1cf;font-size:13px;}
.massmail-confirm .summary li{margin-bottom:4px;}

/* ==== Quest Editor Enhanced UI ==== */
:root{
	--qe-changed-bg:#2a2614;
	--qe-changed-border:#ffb347;
	--qe-conflict-bg:#3a1f1f;
	--qe-conflict-border:#dc3545;
	--qe-panel-bg:#182028;
	--qe-panel-bg-alt:#141b22;
	--qe-panel-border:var(--c-border);
	--qe-panel-text:var(--c-text);
	--qe-tab-bg:#141b22;
	--qe-tab-bg-active:#192129;
	--qe-tab-border:var(--c-border);
	--qe-tab-accent:var(--c-accent);
	--qe-surface:#182028;
	--qe-surface-alt:#141b1f;
	--qe-border:var(--c-border);
	--qe-text:var(--c-text);
	--qe-changed-glow:#ffb347;
}

.quest-layout-wide{display:grid;grid-template-columns:1fr 360px;gap:16px;}
@media (max-width:1399px){
	.quest-layout-wide{display:block;}
}
#quest-editor-main{min-width:0;}
#quest-side-panel{position:sticky;top:70px;align-self:start;}

.quest-group{border:1px solid var(--qe-panel-border);border-radius:6px;padding:10px 12px;background:var(--qe-panel-bg-alt);position:relative;color:var(--qe-panel-text);}
.quest-group+.quest-group{margin-top:18px;}
.quest-group>h5{font-size:14px;text-transform:uppercase;letter-spacing:.5px;display:flex;align-items:center;gap:8px;margin:0 0 8px;}
.quest-group.collapsed>.row{display:none;}
.quest-group-toggle{cursor:pointer;width:18px;height:18px;border:1px solid var(--qe-panel-border);border-radius:3px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;line-height:1;background:#1d262f;color:var(--qe-panel-text);}
.quest-group-toggle:hover{background:#22313c;}

.quest-changed{background:var(--qe-changed-bg)!important;box-shadow:inset 3px 0 0 var(--qe-changed-border);transition:background .4s;}
.quest-conflict-pulse{animation:qePulse 1.4s ease-in-out 1;}
@keyframes qePulse{0%{background:var(--qe-conflict-bg);}50%{background:#fff;}100%{background:var(--qe-conflict-bg);}}

#quest-float-toolbar{position:sticky;top:0;z-index:30;background:linear-gradient(#101418,#141b22);padding:6px 8px;display:flex;gap:6px;border:1px solid var(--qe-panel-border);border-radius:6px;margin-bottom:12px;box-shadow:0 4px 10px rgba(0,0,0,.35);}
#quest-float-toolbar .btn{white-space:nowrap;}

#quest-nav{list-style:none;padding:8px;margin:0 0 16px;border:1px solid var(--qe-panel-border);border-radius:6px;background:var(--qe-panel-bg-alt);max-height:300px;overflow:auto;}
#quest-nav li{margin:0;}
#quest-nav a{display:block;padding:4px 8px;font-size:12px;color:var(--qe-panel-text);text-decoration:none;border-radius:4px;}
#quest-nav a:hover,#quest-nav a.active{background:#22313c;color:var(--c-accent);}

#sql-panel{box-shadow:0 2px 4px rgba(0,0,0,.4);border:1px solid var(--qe-panel-border);background:var(--qe-panel-bg-alt);color:var(--qe-panel-text);}
#sql-panel.sticky{position:sticky;top:70px;}

.qe-hide-unmodified .quest-group .quest-has-changed{display:block;}
.qe-hide-unmodified .quest-group.collapsed>.row{display:none;}

.quest-group label.form-label{font-size:12px;font-weight:600;color:var(--c-accent);}
.quest-group .form-text{font-size:11.5px;color:var(--c-text-muted);}

.bitmask-wrapper.changed{box-shadow:0 0 0 1px var(--qe-changed-border),0 0 6px -1px var(--qe-changed-border);border-radius:4px;}
.bitmask-boxes label{font-size:11.5px;}

html{scroll-padding-top:76px;}

.quest-conflict-final{box-shadow:inset 0 0 0 2px var(--qe-conflict-border);}

#quest-side-panel .panel-card{background:var(--qe-panel-bg);border:1px solid var(--qe-panel-border);border-radius:6px;padding:10px 12px;margin-bottom:16px;color:var(--qe-panel-text);}
#quest-side-panel .panel-card h6{font-size:13px;font-weight:600;margin:0 0 6px;text-transform:uppercase;letter-spacing:.5px;color:var(--c-accent);}

#quest-save-status{font-size:12px;color:var(--c-text-muted);}

[data-theme="light"] .quest-group{background:#fff;color:#222;border-color:#e3e6ea;}
[data-theme="light"] #quest-float-toolbar{background:rgba(255,255,255,.85);box-shadow:none;border-color:#e3e6ea;}
[data-theme="light"] #quest-nav{background:#fff;border-color:#e3e6ea;}
[data-theme="light"] #quest-nav a{color:#333;}
[data-theme="light"] #quest-nav a:hover,[data-theme="light"] #quest-nav a.active{background:#e7f1ff;color:#0d6efd;}
[data-theme="light"] #sql-panel{background:#fff;border-color:#e3e6ea;box-shadow:0 2px 4px rgba(0,0,0,.08);}
[data-theme="light"] #quest-side-panel .panel-card{background:#fff;border-color:#e3e6ea;color:#333;}

/* ==== Quest Editor Tabs & Layout Enhancements ==== */
.qe-tabs{margin-bottom:1rem;}
.qe-tab-bar{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid #dee2e6;margin-bottom:.75rem;}
.qe-tab{background:var(--qe-tab-bg);color:var(--qe-text);border:1px solid var(--qe-tab-border);border-bottom:none;padding:4px 10px;font-size:.82rem;cursor:pointer;border-top-left-radius:4px;border-top-right-radius:4px;position:relative;letter-spacing:.3px;}
.qe-tab.active{background:var(--qe-tab-bg-active);font-weight:600;color:var(--qe-tab-accent);box-shadow:0 -1px 0 var(--qe-tab-bg-active),0 2px 4px rgba(0,0,0,.35);border-color:var(--qe-tab-accent);}
.qe-tab:not(.active):hover{background:#1d262f;}
.qe-dirty-dot{width:8px;height:8px;background:#dc3545;border-radius:50%;display:inline-block;margin-left:4px;vertical-align:middle;box-shadow:0 0 0 2px #fff;}
.qe-dirty-dot.d-none{display:none!important;}
.qe-tab-panel{display:none;}
.qe-tab-panel.active{display:block;}

#quest-layout[data-qe-layout="tabs"] #quest-editor-main{flex:1 1 auto;}

#quest-side-panel{position:relative;}
#quest-side-panel .panel-card{margin-bottom:1rem;background:var(--qe-surface-alt);border:1px solid var(--qe-border);color:var(--qe-text);}
#quest-side-panel .panel-card h6{color:var(--qe-tab-accent);}

@media (max-width:1200px){
	.qe-tab-bar{overflow-x:auto;white-space:nowrap;}
	#quest-side-panel{order:-1;width:100%;display:flex;gap:1rem;}
	#quest-side-panel .panel-card{flex:1 1 0;}
}

.qe-tab-panel .quest-has-changed{position:relative;}
.qe-tab-panel .quest-has-changed::after{content:"";position:absolute;top:2px;left:2px;width:4px;height:calc(100% - 4px);background:var(--qe-changed-glow);border-radius:2px;opacity:.85;}

.qe-tab-panel pre::-webkit-scrollbar{width:8px;height:8px;}
.qe-tab-panel pre::-webkit-scrollbar-track{background:#101418;}
.qe-tab-panel pre::-webkit-scrollbar-thumb{background:#22313c;border-radius:4px;}
.qe-tab-panel pre::-webkit-scrollbar-thumb:hover{background:#2d4452;}

textarea[name="QuestDescription"]{min-height:140px;min-width:480px;}
#sql-inline-panel pre#diff-sql{background:#0d1820;border:1px solid #1b2a34;border-radius:4px;padding:6px 8px;}
.qe-exec-status-line{background:#101a21;border:1px solid #1e2a34;padding:4px 8px;border-radius:4px;display:inline-flex;align-items:center;gap:8px;font-family:monospace;}
.qe-status-tag{padding:2px 6px;border-radius:3px;font-weight:600;letter-spacing:.5px;font-size:12px;}
.qe-status-ok{background:#1f6f3a;color:#e6ffe9;}
.qe-status-fail{background:#7c2d2d;color:#ffe9e9;}
.qe-status-time{color:#8fa8b7;font-size:11.5px;}
.qe-status-aff{color:#c9e3ff;font-size:11.5px;}
.qe-status-hide{color:#89a6b8;text-decoration:none;font-size:14px;line-height:1;display:inline-block;padding:0 4px;cursor:pointer;}
.qe-status-hide:hover{color:#fff;}
#quest-mini-diff-card table td code{background:#0d1820;padding:2px 4px;border-radius:3px;}
.mini-old{color:#d06c6c;}
.mini-new{color:#5bbf72;}
.mini-arrow{color:#6a8291;}
.mini-revert-btn{padding:0 4px;line-height:1.1;font-size:11.5px;visibility:hidden;}
.mini-row:hover .mini-revert-btn{visibility:visible;}

/* ==== Game Meta Colors ==== */
[data-class-id],[data-item-quality]{transition:color .15s ease-in-out;}
.game-class-color-1{color:#C69B6D!important;}
.game-class-color-2{color:#F48CBA!important;}
.game-class-color-3{color:#AAD372!important;}
.game-class-color-4{color:#FFF468!important;}
.game-class-color-5{color:#FFFFFF!important;}
.game-class-color-6{color:#C41E3A!important;}
.game-class-color-7{color:#0070DD!important;}
.game-class-color-8{color:#3FC7EB!important;}
.game-class-color-9{color:#8788EE!important;}
.game-class-color-10{color:#00FF96!important;}
.game-class-color-11{color:#FF7C0A!important;}
.wow-class-1{color:#C69B6D;}
.wow-class-2{color:#F48CBA;}
.wow-class-3{color:#AAD372;}
.wow-class-4{color:#FFF468;}
.wow-class-6{color:#C41E3A;}
.wow-class-7{color:#0070DD;}
.wow-class-8{color:#3FC7EB;}
.wow-class-9{color:#8788EE;}
.wow-class-10{color:#00FF96;}
.wow-class-11{color:#FF7C0A;}
.wow-class-12{color:#A330C9;}
.wow-quality-0{color:#9D9D9D;}
.wow-quality-1{color:#FFFFFF;}
.wow-quality-2{color:#1EFF00;}
.wow-quality-3{color:#0070DD;}
.wow-quality-4{color:#A335EE;}
.wow-quality-5{color:#FF8000;}
.wow-quality-6{color:#E6CC80;}
.wow-quality-7{color:#00CCFF;}
.border-quality-4{border-color:#A335EE !important;}
.bg-quality-5{background:#FF8000 !important;color:#000;}


/* ==========================================================================
   全局可访问性与渲染卫生
   ========================================================================== */

/* 键盘焦点：全局统一 outline（而非 box-shadow），以便在 Windows 高对比模式下也可见。 */
:where(a,button,summary,select,input,textarea,[tabindex],[role="tab"]):focus-visible{
  outline:2px solid var(--c-accent);
  outline-offset:2px;
}

/* 输入控件：深色底 + 明确占位符色，并声明 color-scheme 免得 UA 走亮色分支
   （无声明时某些浏览器给占位符 rgba(0,0,0,.54)，在 var(--c-surface-input) 上只有 1.12:1）。 */
:root{color-scheme:dark;}
input,select,textarea{background:var(--c-surface-input);color:var(--c-text);}
input::placeholder,textarea::placeholder{color:var(--c-text-dim);opacity:1;}

/* 字段级校验（panel.js 的 applyFormErrors 逐字段渲染）：红框 + 字段下错误文本。
   错误文本带文字说明，不靠颜色单独传达；同一字段的 .field-error 由脚本重建，故不做动画。 */
input.is-invalid,select.is-invalid,textarea.is-invalid,
input.is-invalid:focus,select.is-invalid:focus,textarea.is-invalid:focus{border-color:var(--c-danger-fg);}
input.is-invalid:focus,select.is-invalid:focus,textarea.is-invalid:focus{box-shadow:0 0 0 3px rgba(255,144,144,.18);}
.field-error{display:block;margin-top:4px;color:var(--c-danger-fg);}

/* 打印：GM 常要把账号/物品/日志导出成 PDF。深色底 + 粘性表头在纸上都是灾难。 */
@media print{
  body{background:#fff;color:#000;}
  aside.sidebar,.layout-topbar,.page-toolbar,.flash-zone,.item-tooltip,.sidebar-toggle{display:none !important;}
  .layout-grid,.layout-grid--shell{display:block;}
  .app-shell-panel{background:#fff;border:0;box-shadow:none;padding:0;overflow:visible;border-radius:0;}
  .app-shell-panel:before,.app-shell-panel:after{display:none;}
  .table{font-size:11pt;}
  .table thead th{position:static;background:#eee;color:#000;border-bottom:1px solid #999;}
  .table th,.table td{border-bottom:1px solid #999;}
  a{color:#000;text-decoration:underline;}
}

/* 前庭不适：.quest-conflict-pulse 会闪全白（qePulse 的 50%{background:#fff}），
   还有若干 hover 位移。系统声明减少动效时一律关掉。 */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .btn:hover{transform:none;}
}
