/* =====================================================================
   pso2 官网样式 —— 版式对齐 psobb（app.css 的骨架），配色按 PSO2 主题调整
   结构：重置 / 顶栏 / 页脚 / 通用区块(标题·卡片·表格·表单·徽章·分页) / 首页 / 响应式
   ===================================================================== */

/* ---------- 基础 ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: 'Segoe UI', 'Microsoft YaHei', 'PingFang SC', 'Hiragino Sans GB', sans-serif;
	font-size: 15px;
	line-height: 1.7;
	color: #37475e;
	background: #f5f7fa;
}

a { color: #2b83bd; text-decoration: none; transition: color .15s ease; }
a:hover { color: #1b6a9e; text-decoration: none; }

h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: 600; color: #21283b; }

img { max-width: 100%; border: 0; }

.container {
	width: 100%;
	max-width: 1170px;
	margin: 0 auto;
	padding: 0 16px;
}

.inline-form { display: inline; margin: 0; }

/* ---------- 顶栏（psobb：单条吸顶 白底 阴影） ---------- */
.topbar {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: #fff;
	border-bottom: 1px solid #e9edf2;
	box-shadow: 0 2px 10px rgba(23, 43, 77, 0.06);
}

.topbar-inner {
	display: flex;
	align-items: center;
	gap: 20px;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 16px;
	min-height: 62px;
}

/* 站标 */
.brand {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
	color: #21283b;
}
.brand:hover { color: #21283b; }

.brand-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 10px;
	font-weight: 800;
	font-size: 15px;
	letter-spacing: 1px;
	color: #fff;
	background: linear-gradient(135deg, #35c5f0 0%, #2b83bd 60%, #1a4f9c 100%);
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(43, 131, 189, 0.45);
}

.brand-text {
	display: flex;
	flex-direction: column;
	line-height: 1.25;
	font-weight: 700;
	font-size: 16px;
	letter-spacing: 1px;
}
.brand-text small {
	font-size: 11px;
	font-weight: 400;
	color: #7b8aa1;
	letter-spacing: 2px;
}

/* 导航（居中弹性；桌面端永不折行——折行会把顶栏顶高导致整体错位） */
.mainnav { flex: 1 1 auto; min-width: 0; }
.mainnav > ul {
	display: flex;
	justify-content: flex-start;   /* 菜单紧跟站标左对齐：位置不随右侧（状态/登录）宽度漂移，加项只向右延伸 */
	flex-wrap: nowrap;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mainnav > ul > li { position: relative; }

.mainnav > ul > li > a {
	display: block;
	padding: 20px 13px;
	font-size: 15px;
	font-weight: 600;
	color: #37475e;
	letter-spacing: 1px;
	border-bottom: 3px solid transparent;
	white-space: nowrap;
}

.mainnav > ul > li > a:hover {
	color: #2b83bd;
	border-bottom-color: #2b83bd;
}

/* 下拉子菜单 */
.dropdown-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 168px;
	margin: 0;
	padding: 6px 0;
	list-style: none;
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 0 0 10px 10px;
	box-shadow: 0 10px 26px rgba(23, 43, 77, 0.14);
	z-index: 1010;
}

/* GM 导航角标（待审核数） */
.nav-dot {
	display: inline-block;
	margin-left: 4px;
	padding: 0 6px;
	font-size: 11px;
	font-weight: 700;
	line-height: 16px;
	color: #fff;
	background: #e2554d;
	border-radius: 9px;
	vertical-align: 4px;
}

.has-dropdown:hover .dropdown-menu,
.has-dropdown.open .dropdown-menu { display: block; }

.dropdown-menu a {
	display: block;
	padding: 9px 18px;
	font-size: 14px;
	color: #4c5c74;
	border-left: 3px solid transparent;
}
.dropdown-menu a:hover {
	color: #2b83bd;
	background: #f2f7fb;
	border-left-color: #2b83bd;
}

/* 分组下拉（资料库）：组标题（加粗+主题色+色带底，扫一眼可辨）+ 双列 */
.dropdown-menu li.dd-group {
	padding: 7px 18px 5px;
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .08em;
	color: #2b83bd;
	background: linear-gradient(90deg, #eaf3fa, #f7fafc 72%);
	border-left: 3px solid #2b83bd;
	user-select: none;
}
.dropdown-menu li.dd-group:not(:first-child) {
	margin-top: 8px;
	border-top: 1px solid #e6edf4;
}
.dropdown-menu.dd-cols-3 {
	column-count: 3;
	column-gap: 0;
	min-width: 470px;
}
.dropdown-menu.dd-cols-2 {
	column-count: 2;
	column-gap: 0;
	min-width: 330px;
}
.dropdown-menu.dd-cols-2 > li, .dropdown-menu.dd-cols-3 > li { break-inside: avoid; }

/* 右区：状态 + 登录（margin-left:auto 恒定贴最右，与菜单宽度无关） */
.head-side {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-shrink: 0;
	margin-left: auto;
}

.head-info {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 13px;
	color: #5b6b80;
	white-space: nowrap;
}

.hb-item { display: inline-flex; align-items: center; gap: 5px; }

.ico {
	display: inline-block;
	width: 14px;
	height: 14px;
	border-radius: 3px;
	background: #2b83bd;
	opacity: .85;
}
.ico-gate    { border-radius: 50%; background: #35c5f0; }
.ico-ship    { background: #2b83bd; }
.ico-patch   { background: #f0a132; }
.ico-auth    { border-radius: 50%; background: #9a7bd1; }
.ico-qq      { background: #12b7f5; }

/* 状态点 */
.st { font-weight: 700; font-size: 12.5px; }
.st-ok       { color: #1fa84f; }
.st-down     { color: #e2554d; }
.st-checking { color: #8a97ab; }

.head-user { position: relative; display: flex; align-items: center; gap: 8px; min-width: 0; }

.hb-hello {
	display: flex;
	flex-direction: column;
	line-height: 1.3;
	text-align: right;
	font-size: 13px;
	max-width: 150px;   /* 长昵称省略，避免把顶栏挤爆 */
	min-width: 0;
}
.hb-name, .hb-sub {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.hb-name { font-weight: 700; color: #21283b; }
.hb-sub  { font-size: 11px; color: #8a97ab; }

.hb-btn {
	display: inline-block;
	padding: 7px 14px;
	font-size: 13.5px;
	font-weight: 600;
	color: #42536b;
	background: #f0f4f8;
	border: 1px solid #dbe4ee;
	border-radius: 8px;
	cursor: pointer;
	transition: all .15s ease;
}
.hb-btn:hover { color: #2b83bd; border-color: #2b83bd; }
.hb-btn-primary {
	color: #fff;
	background: linear-gradient(135deg, #35a7e0, #2b83bd);
	border-color: #2b83bd;
	box-shadow: 0 2px 8px rgba(43, 131, 189, 0.35);
}
.hb-btn-primary:hover { color: #fff; opacity: .92; }

/* 登录浮层 */
.login-panel {
	display: none;
	position: absolute;
	top: calc(100% + 12px);
	right: 0;
	width: 240px;
	padding: 14px;
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 12px;
	box-shadow: 0 12px 30px rgba(23, 43, 77, 0.16);
	z-index: 1020;
}
.login-panel.open { display: block; }
.login-panel::before {
	content: '';
	position: absolute;
	top: -6px;
	right: 40px;
	width: 10px;
	height: 10px;
	background: #fff;
	border-left: 1px solid #e9edf2;
	border-top: 1px solid #e9edf2;
	transform: rotate(45deg);
}
.login-panel form { display: flex; flex-direction: column; gap: 10px; }
.login-panel input {
	padding: 9px 11px;
	font-size: 14px;
	border: 1px solid #d7e0ea;
	border-radius: 8px;
	outline: none;
}
.login-panel input:focus { border-color: #2b83bd; box-shadow: 0 0 0 3px rgba(43, 131, 189, 0.14); }
.login-error {
	margin-bottom: 10px;
	padding: 8px 10px;
	font-size: 13px;
	color: #b3261e;
	background: #fdecea;
	border-radius: 8px;
}

/* 右区「账户」下拉（邮件/账户入口从中间导航移到登录区后新增）：
   桌面 hover 复用 .has-dropdown 规则，移动端点按 JS 切 .open（header.php） */
.head-acct { position: relative; }
.head-acct .dropdown-menu { left: auto; right: 0; min-width: 150px; }
.head-acct > button::after {
	content: '▾';
	margin-left: 5px;
	font-size: 11px;
	color: #8a97ab;
	vertical-align: 1px;
}
.head-acct > button[aria-expanded="true"]::after { content: '▴'; }

/* 汉堡按钮（移动端显示） */
.nav-toggle {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	padding: 8px;
	background: none;
	border: 0;
	cursor: pointer;
}
.nav-toggle span {
	display: block;
	height: 2.5px;
	width: 100%;
	background: #37475e;
	border-radius: 2px;
}

.nav-scrim {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(15, 25, 50, 0.45);
	z-index: 998;
}

/* ---------- 页脚（psobb：深蓝渐变 + 三卡 + 备案行） ---------- */
.site-footer {
	margin-top: 56px;
	background: linear-gradient(180deg, #1a2450 0%, #0d1633 100%);
	color: #9fb3d4;
}

.ft-grids {
	display: grid;
	grid-template-columns: repeat(3, minmax(0,1fr));
	gap: 18px;
	padding: 42px 0 26px;
}

.ft-card {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 18px 20px;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	transition: background .18s ease, border-color .18s ease;
}
.ft-card:hover { background: rgba(255, 255, 255, 0.07); border-color: rgba(53, 197, 240, 0.35); }

.ft-icon {
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	font-size: 22px;
	color: #35c5f0;
	background: rgba(53, 197, 240, 0.1);
	border-radius: 50%;
}

.ft-body h4 { margin: 0 0 2px; font-size: 15px; color: #e8f0fb; letter-spacing: 1px; }
.ft-body p, .ft-body a { margin: 0; font-size: 13.5px; color: #9fb3d4; }
.ft-body a:hover { color: #35c5f0; }
.ft-sub { font-size: 12px; color: #6e82a8; }

.ft-pos {
	padding: 16px 0;
	font-size: 12.5px;
	text-align: center;
	border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.ft-pos p { margin: 0; }
.ft-pos a { color: #7e9cc9; }
.ft-pos a:hover { color: #35c5f0; }

/* ---------- 通用区块 ---------- */

/* 大标题（psobb w3l_head / w3ls_head_para 版式） */
.section { padding: 34px 0 8px; }

.w3l_head {
	font-size: 2.1em;
	font-weight: bold;
	color: #21283b;
	letter-spacing: 3px;
	text-align: center;
}

.w3ls_head_para {
	margin: 6px 0 0;
	color: #ff5000;
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: 4px;
	text-align: center;
}

/* 卡片 */
.card {
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(23, 43, 77, 0.05);
	padding: 22px 24px;
	margin-bottom: 22px;
}

.card-title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-size: 17px;
	color: #21283b;
}
.card-title::before {
	content: '';
	width: 4px;
	height: 18px;
	background: linear-gradient(180deg, #35c5f0, #2b83bd);
	border-radius: 2px;
}

/* 网格布局助手（minmax(0,·)：允许轨道收缩到内容以下，否则 nowrap 文本会把轨道撑破容器造成横向滚动） */
.grid-2 { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 22px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 22px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; }

/* 表格 */
.table-wrap { overflow-x: auto; }

table.data {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

table.data th, table.data td {
	padding: 10px 12px;
	text-align: left;
	border-bottom: 1px solid #edf1f6;
	white-space: nowrap;
}

table.data th {
	font-size: 13px;
	font-weight: 700;
	color: #5b6b80;
	letter-spacing: 1px;
	background: #f7fafc;
	border-bottom: 2px solid #e3eaf2;
}

table.data tbody tr { transition: background .12s ease; }
table.data tbody tr:hover { background: #f4f9fd; }
table.data tbody tr.clickable { cursor: pointer; }

/* 物品图标（客户端 ui_item_{N}.dds 批量导出的 PNG，黑底为游戏原生风格） */
table.data th.th-icon { width: 52px; }
table.data td.cell-icon { padding: 5px 8px; }
.item-icon {
	display: block;
	border-radius: 8px;
	background: #0b0f14;
	box-shadow: inset 0 0 0 1px rgba(32, 45, 64, .18);
}
.item-icon-none {
	border: 1px dashed #c9d5e2;
	border-radius: 8px;
	box-sizing: border-box;
}
.item-detail-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.item-detail-head .card-title { margin-bottom: 0; }

/* 武器 3D 展馆 / 模型查看器 */
.weapon3d-wrap { margin: 6px 0 16px; }
.weapon3d-meta { font-size: 13px; color: #5b6b80; margin-bottom: 8px; }
.weapon3d { border-radius: 10px; overflow: hidden; background: #0b0f14; }
.weapon3d canvas.weapon3d-canvas { display: block; width: 100%; }
.weapon3d-status { padding: 48px 16px; text-align: center; color: #8ea2bd; background: #0b0f14; border-radius: 10px; }
.wfamily-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.wfamily-chips .chip {
	display: inline-block; padding: 5px 11px; border-radius: 999px;
	background: #eef4fa; border: 1px solid #d7e2ee; color: #2b5c8a;
	font: 600 12px/1.4 ui-monospace, SFMono-Regular, Consolas, monospace;
	text-decoration: none; transition: background .12s ease;
}
.wfamily-chips .chip:hover { background: #dcebf8; }

/* 表单 */
.form-row { margin-bottom: 14px; }
.form-row label { display: block; margin-bottom: 6px; font-size: 13.5px; font-weight: 600; color: #4c5c74; }

input[type=text], input[type=password], input[type=email], input[type=search], input[type=number], input[type=tel], select, textarea {
	width: 100%;
	max-width: 420px;
	padding: 10px 12px;
	font-size: 14.5px;
	color: #21283b;
	background: #fff;
	border: 1px solid #d7e0ea;
	border-radius: 8px;
	outline: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}
/* 搜索框走和普通输入框一致的外观（type=search 默认样式各家浏览器不一，且此前漏掉没被主题覆盖——
   图鉴页搜索框因此是浏览器默认小框，2026-10-14 修） */
input[type=search] { -webkit-appearance: none; appearance: none; }
/* 勾选框/单选框取主题蓝（原生控件无法整体换肤，accent-color 是标准做法） */
input[type=checkbox], input[type=radio] { accent-color: #2b83bd; }
input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; }
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=search]:focus, input[type=number]:focus, input[type=tel]:focus, select:focus, textarea:focus {
	border-color: #2b83bd;
	box-shadow: 0 0 0 3px rgba(43, 131, 189, 0.14);
}

.btn {
	display: inline-block;
	padding: 10px 22px;
	font-size: 14.5px;
	font-weight: 600;
	color: #fff;
	background: linear-gradient(135deg, #35a7e0, #2b83bd);
	border: 0;
	border-radius: 8px;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(43, 131, 189, 0.3);
	transition: opacity .15s ease;
}
.btn:hover { color: #fff; opacity: .92; }
.btn-ghost {
	color: #42536b;
	background: #f0f4f8;
	box-shadow: none;
	border: 1px solid #dbe4ee;
}
.btn-ghost:hover { color: #2b83bd; border-color: #2b83bd; opacity: 1; }

/* 禁用态按钮（如「等待放出」） */
.btn-disabled {
	display: inline-block;
	padding: 10px 22px;
	font-size: 14.5px;
	font-weight: 600;
	color: #9aa7b8;
	background: #eef1f5;
	border: 1px dashed #c9d4e0;
	border-radius: 8px;
	cursor: not-allowed;
}

/* 提示条 */
.alert { padding: 12px 16px; margin: 0 0 16px; font-size: 14px; border-radius: 10px; border: 1px solid; }
.alert-ok   { color: #136c39; background: #e8f7ee; border-color: #bce6cb; }
.alert-err  { color: #b3261e; background: #fdecea; border-color: #f5c6c1; }
.alert-info { color: #17588f; background: #e9f4fc; border-color: #bcdcf5; }

/* 徽章 */
.badge {
	display: inline-block;
	padding: 2px 9px;
	font-size: 12px;
	font-weight: 600;
	border-radius: 20px;
	background: #eef3f8;
	color: #4c5c74;
}
.badge-blue { background: #e3f1fb; color: #1f6ea6; }
.badge-green { background: #e5f6ec; color: #1c7c43; }
.badge-orange { background: #fdefe2; color: #b35b00; }
.badge-red { background: #fdecea; color: #b3261e; }

/* 稀有度配色（PSO2 星级） */
.r1  { color: #8a97ab; }
.r4  { color: #2b83bd; }
.r7  { color: #8f5bd6; }
.r10 { color: #d9a400; }
.r11 { color: #e07c1f; }
.r13 { color: #e04b2f; }
.r14 { color: #ff2d55; }

/* 分页 */
.pager {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 20px 0 4px;
}
.pager a, .pager span {
	display: inline-block;
	min-width: 34px;
	padding: 7px 10px;
	font-size: 13.5px;
	text-align: center;
	color: #42536b;
	background: #fff;
	border: 1px solid #dbe4ee;
	border-radius: 8px;
}
.pager a:hover { color: #2b83bd; border-color: #2b83bd; }
.pager .current {
	color: #fff;
	background: #2b83bd;
	border-color: #2b83bd;
	font-weight: 700;
}
.pager .disabled { color: #b8c2d0; background: #f4f6f9; }

/* 空数据 */
.empty { padding: 30px 0; text-align: center; color: #8a97ab; font-size: 14px; }

/* 键值块（潜能图鉴 / 物品详情的效果列表） */
.kv-block {
	padding: 16px 4px 12px;
	border-bottom: 1px dashed #e3eaf2;
}
.kv-block:last-of-type { border-bottom: 0; }
.kv-block h4 {
	margin: 0 0 8px;
	font-size: 15.5px;
	color: #21283b;
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}
.kv-line {
	display: flex;
	align-items: baseline;
	gap: 8px;
	margin: 0 0 6px;
	font-size: 14px;
	color: #4c5c74;
}

/* 表格内小进度条（职业成长） */
.cellbar {
	display: inline-block;
	vertical-align: middle;
	width: 90px;
	height: 8px;
	margin-right: 8px;
	background: #eef3f8;
	border-radius: 4px;
	overflow: hidden;
}
.cellbar i {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, #35c5f0, #2b83bd);
}

/* ---------- 首页 ---------- */

/* 英雄横幅：深空渐变 + 随机背景图（footer.php 里随机换图） */
.hero {
	position: relative;
	min-height: 520px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #0b1230 center / cover no-repeat;
	overflow: hidden;
}
.hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(7, 12, 34, 0.55) 0%, rgba(7, 12, 34, 0.35) 45%, rgba(9, 16, 44, 0.85) 100%);
}
.hero-inner { position: relative; z-index: 2; text-align: center; color: #eaf4ff; padding: 60px 16px; }

.hero-kicker {
	display: inline-block;
	margin-bottom: 18px;
	padding: 6px 18px;
	font-size: 13px;
	letter-spacing: 6px;
	color: #7fd8ff;
	border: 1px solid rgba(127, 216, 255, 0.4);
	border-radius: 30px;
	background: rgba(18, 32, 74, 0.4);
}

.hero h1 {
	margin: 0 0 12px;
	font-size: 46px;
	letter-spacing: 8px;
	color: #fff;
	text-shadow: 0 4px 24px rgba(53, 197, 240, 0.45);
}

.hero p.sub {
	margin: 0 0 28px;
	font-size: 16px;
	letter-spacing: 3px;
	color: #a9c8e8;
}

.hero-actions { display: flex; justify-content: center; gap: 14px; flex-wrap: wrap; }

.hero-btn {
	display: inline-block;
	padding: 12px 30px;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 2px;
	border-radius: 10px;
	transition: transform .15s ease, box-shadow .15s ease;
}
.hero-btn-primary {
	color: #06172e;
	background: linear-gradient(135deg, #7fe3ff, #35c5f0);
	box-shadow: 0 6px 22px rgba(53, 197, 240, 0.45);
}
.hero-btn-primary:hover { color: #06172e; transform: translateY(-2px); }
.hero-btn-ghost {
	color: #dff2ff;
	border: 1px solid rgba(159, 214, 255, 0.55);
	background: rgba(13, 25, 58, 0.35);
}
.hero-btn-ghost:hover { color: #fff; border-color: #7fd8ff; }

/* 服务器状态条（横幅下方悬浮卡） */
.status-strip {
	position: relative;
	z-index: 3;
	margin: -52px auto 0;
	max-width: 1020px;
	padding: 0 16px;
}
.status-cards {
	display: grid;
	grid-template-columns: repeat(4, minmax(0,1fr));
	gap: 14px;
	padding: 20px;
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 16px;
	box-shadow: 0 14px 34px rgba(23, 43, 77, 0.12);
}
.status-cell { text-align: center; }
.status-cell .sc-name { font-size: 13.5px; color: #5b6b80; margin-bottom: 4px; }
.status-cell .sc-dot {
	display: inline-block;
	width: 9px;
	height: 9px;
	margin-right: 6px;
	border-radius: 50%;
	background: #8a97ab;
	vertical-align: 1px;
}
.status-cell .sc-dot.ok { background: #1fa84f; box-shadow: 0 0 0 4px rgba(31, 168, 79, 0.15); }
.status-cell .sc-dot.down { background: #e2554d; box-shadow: 0 0 0 4px rgba(226, 85, 77, 0.15); }
.status-cell .sc-state { font-size: 15px; font-weight: 700; color: #21283b; }

/* 统计卡（auto-fit：5 张卡在一行均分，不再出现 4+1 孤行；min(·,100%) 防窄屏轨道溢出） */
.stat-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(170px, 100%), 1fr)); gap: 18px; }
.stat-card {
	padding: 22px 18px;
	text-align: center;
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(23, 43, 77, 0.05);
	transition: transform .15s ease, box-shadow .15s ease;
}
.stat-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(23, 43, 77, 0.1); }
.stat-num { font-size: 28px; font-weight: 800; color: #2b83bd; }
.stat-label { margin-top: 4px; font-size: 13px; color: #7b8aa1; letter-spacing: 1px; }

/* 公告列表 */
.news-list { list-style: none; margin: 0; padding: 0; }
.news-list li {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 13px 4px;
	border-bottom: 1px dashed #e3eaf2;
}
.news-list li:last-child { border-bottom: 0; }
.news-date { flex-shrink: 0; font-size: 13px; color: #8a97ab; font-variant-numeric: tabular-nums; }
.news-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 视频容器 */
.video-wrap {
	position: relative;
	width: 100%;
	padding-top: 62%;
	border-radius: 12px;
	overflow: hidden;
	background: #0b1230;
}
.video-wrap iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* 快捷入口（auto-fit：条目数变化不再出现 4+1 孤行，同 stat-cards 的处理） */
.quick-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 14px; }
.qlink {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 22px 10px;
	font-size: 14.5px;
	font-weight: 600;
	color: #37475e;
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 14px;
	transition: all .15s ease;
}
.qlink:hover { color: #2b83bd; border-color: #7fd8ff; box-shadow: 0 8px 20px rgba(43, 131, 189, 0.14); transform: translateY(-2px); }
.qlink .qi { font-size: 26px; }

/* ================= 统一组件（2026-10-14 全站 UI 整理） =================
   各页原来自己写内联样式（筛选行/小标签/间距），这里收口成公共类。
   ★ .chip 此前只有已下线武器展馆页的局部定义 —— 全站所有"下载按钮/同型物品/获取道具"
   的 class="chip" 实际渲染成素链接（典型「CSS 不完善」），在此补齐为通用胶囊标签。 */

/* 胶囊标签（链接或静态都可用） */
.chip {
	display: inline-block;
	margin: 2px 4px 2px 0;
	padding: 4px 12px;
	font-size: 12.5px;
	line-height: 1.7;
	color: #37627f;
	background: #eef5fb;
	border: 1px solid #d8e6f3;
	border-radius: 999px;
	text-decoration: none;
	white-space: nowrap;
	transition: background .12s ease, border-color .12s ease, color .12s ease;
}
a.chip:hover { color: #2b83bd; background: #dcebf8; border-color: #b7d5ee; }
/* 激活态胶囊（筛选当前项，如邮件页 全部/未读） */
.chip.on, a.chip.on { color: #fff; background: #2b83bd; border-color: #2b83bd; }
a.chip.on:hover { color: #fff; background: #256fa8; }

/* 工具条：筛选 / 搜索行（替代各页内联 flex） */
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 14px; }
.toolbar input[type=text], .toolbar input[type=search] { margin: 0; min-width: 220px; }
.toolbar select, .toolbar .btn { margin: 0; }
.toolbar .tb-note { color: #8a97ab; font-size: 13px; }
.toolbar .spacer { flex: 1 1 auto; }

/* 工具条底部对齐变体（字段带 label 时用，让输入框与按钮同底线） */
.toolbar-end { align-items: flex-end; }

/* 胶囊行：分类切换 / 批量操作按钮并列 */
.chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 10px; }

/* 统计条：图鉴页（.mag-stat）对齐首页 .stat-card 的观感 */
.mag-stat {
	flex: 1 1 130px;
	padding: 15px 14px;
	text-align: center;
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(23, 43, 77, 0.05);
	transition: transform .15s ease, box-shadow .15s ease;
}
.mag-stat:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(23, 43, 77, 0.1); }
.mag-stat b { display: block; font-size: 25px; line-height: 1.25; font-weight: 800; color: #2b83bd; }
.mag-stat span { font-size: 12.5px; color: #7b8aa1; }

/* 表格补充细节 */
table.data tbody tr:hover { background: #f6fafd; }
table.data .sub { color: #8a97ab; font-size: 12.5px; }
table.data td.mono, .mono { font-family: Consolas, "Courier New", monospace; font-size: 12.5px; }

/* 键值小表（玛古图鉴「其它道具」等——此前无样式，渲染成浏览器默认表格） */
.kv-table { width: 100%; border-collapse: collapse; }
.kv-table th, .kv-table td { padding: 8px 10px; text-align: left; font-size: 13.5px; border-bottom: 1px solid #edf1f6; vertical-align: top; }
.kv-table th { color: #5b6b80; font-weight: 700; background: #f7fafc; white-space: nowrap; }
.kv-table tbody tr:hover, .kv-table tr:hover { background: #f6fafd; }

/* 次要文字（各页内联 color:#8a97ab 的收口） */
.muted { color: #8a97ab; }

/* 行内代码（各页 <code> 此前样式零散） */
code {
	padding: 1px 6px;
	font-size: .92em;
	color: #37627f;
	background: #f2f6fa;
	border: 1px solid #e3eaf2;
	border-radius: 5px;
}

/* ---------- 响应式 ----------
   断点策略（2026-10-12 按实测调整，修复登录态顶栏错位/手机端溢出）：
   > 1440  完整顶栏（站标+导航+状态+用户区）
   ≤1200  汉堡菜单（实测 993-1280 登录态下导航必折行，收进菜单最稳）
   ≤768   页脚三卡纵排
   ≤600   手机：顶栏极简（昵称+登出）、输入框 16px 防 iOS 聚焦缩放、表格紧凑

   右区紧凑样式（状态只留圆点+文字、QQ 群收进页脚、昵称限宽）**任何宽度都生效**——
   顶栏容器上限 1280px，宽松版右区（带 kb 标签/QQ 群约 524px）会在宽屏把菜单挤到与
   右区重叠（2026-10-14 实测 1680px 重叠 24px，这就是"加标签就错位"的根因）。 */

/* 移动端汉堡菜单顶部的用户行（桌面隐藏；样式见 ≤1200 段） */
.nav-user-row { display: none; }

.hb-item-group, .hb-item .hb-k { display: none; }   /* 状态只留点+文字，QQ 群收进页脚 */
.mainnav > ul > li > a { padding: 19px 10px; }
.hb-btn { padding: 7px 11px; font-size: 13px; }
.hb-hello { max-width: 120px; }

@media (max-width: 1200px) {
	/* 汉堡菜单展开 */
	.nav-toggle { display: flex; }

	.topbar-inner { flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; }
	.brand { order: 1; }
	.head-side { order: 2; margin-left: auto; }
	.nav-toggle { order: 3; }

	.mainnav {
		order: 4;
		flex-basis: 100%;
		display: none;
	}
	body.nav-open .mainnav { display: block; }
	body.nav-open .nav-scrim { display: block; }

	/* 菜单顶部用户行 */
	.nav-user-row {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 8px 14px;
		margin: 4px 0 10px;
		padding: 10px 12px;
		background: #f2f7fb;
		border: 1px solid #e3eaf2;
		border-radius: 10px;
	}
	.nav-user-name { font-weight: 700; color: #21283b; }
	.nav-user-sub { font-size: 12px; color: #8a97ab; }
	.nav-user-row a { font-size: 14px; font-weight: 600; }
	.nav-user-row .btn { padding: 8px 18px; font-size: 14px; }

	.mainnav > ul { flex-direction: column; align-items: stretch; padding-bottom: 10px; }
	.mainnav > ul > li > a { padding: 12px 6px; border-bottom: 0; }
	.dropdown-menu {
		position: static;
		display: none;
		border: 0;
		border-left: 3px solid #2b83bd;
		border-radius: 0;
		box-shadow: none;
		background: #f7fafc;
	}
	.has-dropdown.open .dropdown-menu { display: block; }

	/* 手机端下拉紧凑化：统一双列 + 收窄内距（资料库 18 项不再拉出长条） */
	.dropdown-menu a { padding: 8px 10px; font-size: 13.5px; }
	.dropdown-menu li.dd-group { padding: 6px 10px 4px; font-size: 12px; }
	.dropdown-menu li.dd-group:not(:first-child) { margin-top: 6px; }
	.dropdown-menu li.dd-group { break-inside: avoid; grid-column: auto; }

	/* 栅格退化 */
	.grid-2, .grid-3, .grid-4, .stat-cards, .quick-links { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
	.status-cards { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 18px; }
}

@media (max-width: 768px) {
	.ft-grids { grid-template-columns: minmax(0,1fr); gap: 12px; padding: 28px 0 18px; }
	.ft-card { padding: 14px 16px; }
	.ft-icon { width: 40px; height: 40px; font-size: 19px; }
}

@media (max-width: 600px) {
	.container { padding: 0 12px; }

	/* 顶栏极简：窄屏一行 = 站标(去副标) + 昵称 + 登出 + 汉堡 */
	.brand-text { font-size: 15px; }
	.brand-text small { display: none; }
	.hb-sub { display: none; }
	.hb-hello { max-width: 96px; font-size: 13px; }
	.hb-btn { padding: 6px 10px; font-size: 12.5px; }
	.hb-btn-acct, .hb-btn-reg { display: none; }   /* 入口在汉堡菜单的用户行里 */
	.head-info { display: none; }
	.topbar-inner { gap: 12px; }

	/* iOS Safari：输入字号 <16px 聚焦会自动放大页面 */
	input[type=text], input[type=password], input[type=email], input[type=search], input[type=number], select,
	textarea, .login-panel input { font-size: 16px !important; }

	.grid-2, .grid-3, .grid-4, .quick-links { grid-template-columns: minmax(0,1fr); }
	.stat-cards { grid-template-columns: minmax(0,1fr) minmax(0,1fr); }

	.w3l_head { font-size: 1.6em; letter-spacing: 2px; }
	.w3ls_head_para { letter-spacing: 2px; }

	.hero { min-height: 400px; }
	.hero h1 { font-size: 30px; letter-spacing: 4px; }
	.hero p.sub { font-size: 13px; }
	.hero-kicker { font-size: 11px; letter-spacing: 3px; padding: 5px 12px; }
	.hero-btn { padding: 11px 22px; font-size: 14px; }

	.status-cards { grid-template-columns: minmax(0,1fr) minmax(0,1fr); padding: 14px; }
	.card { padding: 14px; }
	table.data { font-size: 13px; }
	table.data th, table.data td { padding: 8px 9px; }

	.pager a, .pager span { min-width: 30px; padding: 6px 8px; font-size: 12.5px; }

	.login-panel { width: min(240px, calc(100vw - 48px)); }
}

@media (max-width: 480px) {
	/* 极窄屏（320-480）：昵称行也收进汉堡菜单，顶栏只留 站标 + 登出 + 汉堡 */
	.hb-hello { display: none; }
	.brand-text { letter-spacing: 0; }
}

/* ================= 玛古图鉴（mag_codex.php） ================= */
.mag-stats { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 14px; }
.mag-stat { flex: 1 1 120px; padding: 10px 14px; border: 1px solid #e6ebf2; border-radius: 12px; background: #fff; }
.mag-stat b { display: block; font-size: 22px; line-height: 1.25; color: #21283b; }
.mag-stat span { font-size: 12px; color: #8a97ab; }
.mag-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 4px 0 2px; }
.mag-toolbar input[type="search"] { max-width: 340px; margin: 0; }
.mag-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.mag-filter { padding: 6px 12px; border: 1px solid #dbe3ec; border-radius: 999px; background: #fff; color: #37475e; font-size: 13px; cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease; }
.mag-filter:hover { border-color: #9dc6e6; }
.mag-filter.on { background: #2b83bd; border-color: #2b83bd; color: #fff; }
.mag-count { color: #8a97ab; font-size: 13px; margin-left: auto; }
.mag-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(146px, 1fr)); gap: 12px; margin: 12px 0 4px; }
.mag-card { display: flex; flex-direction: column; border: 1px solid #e6ebf2; border-radius: 12px; background: #fff; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.mag-card:hover { transform: translateY(-3px); border-color: #9dc6e6; box-shadow: 0 10px 22px rgba(23, 43, 77, .13); }
.mag-thumb { position: relative; aspect-ratio: 1 / 1; background: radial-gradient(circle at 50% 36%, #1d2733 0%, #0b0f14 72%); }
.mag-thumb img { position: absolute; inset: 5%; width: 90%; height: 90%; object-fit: contain; }
.mag-badge { position: absolute; top: 7px; right: 7px; padding: 1px 7px; border-radius: 999px; font-size: 11px; background: rgba(63, 169, 245, .92); color: #04121f; }
.mag-body { padding: 8px 10px 10px; display: flex; flex-direction: column; gap: 1px; }
.mag-name { font-size: 14px; font-weight: 600; color: #21283b; line-height: 1.35; }
.mag-en { font-size: 12px; color: #8a97ab; min-height: 15px; }
.mag-meta { display: flex; justify-content: space-between; align-items: baseline; font-size: 12px; color: #a9b7c9; margin-top: 3px; }
.mag-stars { color: #f0a92e; letter-spacing: .5px; }
.mag-id { font-family: Consolas, 'Courier New', monospace; }
.mag-nomodel { margin: 12px 0 0; font-size: 13px; color: #8a97ab; line-height: 2; }
.mag-nomodel code { font-size: 12px; }
/* 物品图鉴卡片墙（icard = mag-card 的物品版）：图标内衬留白、星级徽标、名字按星级着色
   （色值与上方稀有度配色一致；放 .mag-name 之后以覆盖其默认色） */
.mag-card.icard .mag-thumb img { inset: 13%; width: 74%; height: 74%; }
.mag-card.icard .mag-badge { background: rgba(8, 13, 20, .62); color: #ffd75e; font-weight: 700; }
.mag-card .mag-name.r1  { color: #8a97ab; }
.mag-card .mag-name.r4  { color: #2b83bd; }
.mag-card .mag-name.r7  { color: #8f5bd6; }
.mag-card .mag-name.r10 { color: #d9a400; }
.mag-card .mag-name.r11 { color: #e07c1f; }
.mag-card .mag-name.r13 { color: #e04b2f; }
.mag-card .mag-name.r14 { color: #ff2d55; }
/* 任务卡片（无图标）：缩略图区显示行星-区域文字 */
.mag-card.qcard .qcard-planet { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #9db8d4; font-size: 15px; font-weight: 700; letter-spacing: 1px; }
/* 详情页 */
.mag-detail { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.mag-detail-view .weapon3d { border-radius: 12px; }
.mag-detail-side { background: #fff; }
.mag-detail-h { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 0 0 4px; }
.mag-detail-h h1 { font-size: 20px; }
.mag-detail-en { color: #8a97ab; font-size: 14px; }
.mag-desc { margin: 10px 0 0; padding: 10px 14px; border-left: 3px solid #9dc6e6; background: #f2f7fc; border-radius: 0 8px 8px 0; color: #37475e; font-size: 14px; }
.mag-facts { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mag-facts li { display: flex; gap: 10px; font-size: 14px; color: #37475e; }
.mag-facts b { flex: 0 0 76px; color: #5b6b80; font-weight: 600; }
.mag-facts code { font-size: 12px; background: #f2f5f9; padding: 1px 5px; border-radius: 5px; }
.mag-nav { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.mag-fx-card { margin-top: 16px; border: 1px solid #e6ebf2; border-radius: 12px; background: #fff; padding: 12px 14px 4px; }
.mag-fx-card .weapon3d-meta { margin-bottom: 6px; }
.mag-fold { border: 1px solid #e6ebf2; border-radius: 12px; background: #fff; padding: 12px 16px; margin-top: 14px; }
.mag-fold > summary { cursor: pointer; font-weight: 600; color: #21283b; list-style: none; }
.mag-fold > summary::-webkit-details-marker { display: none; }
.mag-fold > summary::before { content: '▸ '; color: #2b83bd; }
.mag-fold[open] > summary::before { content: '▾ '; }
.mag-fold > summary small { color: #8a97ab; font-weight: 400; }
.mag-fold .mag-fold-body { margin-top: 10px; font-size: 14px; color: #37475e; }
@media (max-width: 900px) {
	.mag-detail { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
	.mag-grid { grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; }
	.mag-stat { flex: 1 1 46%; }
}

/* 玛古详情：攻击特效播放器别占满整幅（宽度受限 → 高度跟着 9:16 缩小） */
.mag-fx-card .pso2fx { max-width: 560px; }
.mag-fx-card .pso2fx canvas { max-width: 100%; }

/* ===== 3D 预览小工具条（重置视角 / 自动旋转） ===== */
.weapon3d { position: relative; }
.weapon3d canvas { display: block; touch-action: none; cursor: grab; }
.weapon3d canvas:active { cursor: grabbing; }
.weapon3d-tools { position: absolute; top: 8px; right: 8px; display: flex; gap: 6px; }
.weapon3d-tools button {
	padding: 4px 10px; font-size: 12px; color: #cfe0f0; background: rgba(18, 26, 36, .72);
	border: 1px solid rgba(140, 170, 200, .35); border-radius: 999px; cursor: pointer;
}
.weapon3d-tools button:hover { background: rgba(30, 44, 60, .9); }
.weapon3d-tools button.on { background: #2b83bd; border-color: #2b83bd; color: #fff; }

/* ===== 卡片悬浮大预览（js/hover-preview.js） ===== */
.hover-preview {
	position: fixed; z-index: 1200; width: 372px; display: none; flex-direction: column;
	background: #0f151d; border: 1px solid rgba(140, 170, 200, .28); border-radius: 14px;
	box-shadow: 0 18px 44px rgba(0, 0, 0, .5); overflow: hidden; pointer-events: auto;
}
.hover-preview.on { display: flex; }
.hover-preview .hp-body { position: relative; background: radial-gradient(circle at 50% 36%, #1d2733 0%, #0b0f14 72%); }
.hover-preview .hp-body img { display: block; width: 100%; height: 330px; object-fit: contain; }
.hover-preview .hp-view { width: 100%; }
.hover-preview .hp-view .weapon3d { border-radius: 0; background: transparent; }
.hover-preview .hp-meta { padding: 8px 12px 10px; }
.hover-preview .hp-title { color: #e8f0f8; font-size: 15px; font-weight: 600; }
.hover-preview .hp-sub { color: #8a97ab; font-size: 12px; }
.hover-preview .hp-hint { color: #5f6f85; font-size: 11px; margin-top: 4px; }

/* ================= 邮件（messages.php） ================= */
/* 未读红点（收件箱状态列） */
.mail-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #e2554d;
	box-shadow: 0 0 0 3px rgba(226, 85, 77, 0.15);
}
.mail-dot-read {
	display: inline-block;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #d4dde7;
}
/* 详情页：寄件人/时间元信息行 */
.mail-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 16px;
	margin: 0 0 14px;
	font-size: 13px;
	color: #7b8aa1;
}
/* 详情页正文（保留换行，长串不撑破卡片） */
.mail-body {
	padding: 16px 18px;
	margin: 0 0 18px;
	line-height: 1.9;
	color: #2b3a4d;
	background: #f8fafc;
	border: 1px solid #edf1f6;
	border-radius: 10px;
	overflow-wrap: anywhere;
}
/* 详情页操作行（返回/回复/删除） */
.mail-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.mail-actions form { margin: 0; }
/* 卡片底部说明行（收件箱/写邮件卡片内的小字） */
.mail-note { margin: 14px 0 0; font-size: 13px; }

/* ================= 留言板（board.php） ================= */
/* 主题列表：行式布局（替代表格，响应式——手机单列、不横向滚动；
   标题/最后活动是真链接可新标签打开，整行也可点） */
.thread-list { display: flex; flex-direction: column; }
.thread-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 150px;
	gap: 4px 16px;
	align-items: center;
	padding: 11px 10px;
	border-bottom: 1px dashed #e3eaf2;
	border-radius: 10px;
	cursor: pointer;
	transition: background .12s ease;
}
.thread-row:hover { background: #f4f9fd; }
.thread-row:last-child { border-bottom: 0; }
.tr-title-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
a.tr-title {
	flex: 0 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: #21283b;
	font-weight: 600;
}
.thread-row:hover a.tr-title { color: #2b83bd; }
.tr-sub { font-size: 12.5px; margin-top: 1px; }
.tr-side { text-align: right; font-size: 13px; line-height: 1.5; min-width: 0; }
a.tr-last { color: #5b6b80; }
a.tr-last:hover { color: #2b83bd; }
.tr-poster { margin-left: 6px; font-size: 12px; }

/* 楼层：头部行（楼号/作者/时间/引用）+ 正文 + 操作行 */
.board-post {
	padding: 14px 2px 10px;
	border-bottom: 1px dashed #e3eaf2;
}
.board-post:last-of-type { border-bottom: 0; }
.board-post-head {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 10px;
	margin-bottom: 6px;
	font-size: 13.5px;
}
.board-post-head .spacer { flex: 1 1 auto; }
.board-floor {
	display: inline-block;
	min-width: 40px;
	font-weight: 700;
	color: #8a97ab;
	font-variant-numeric: tabular-nums;
}
.board-post-body {
	padding: 4px 0 2px 48px;
	line-height: 1.9;
	color: #2b3a4d;
	overflow-wrap: anywhere;
}
.board-post-act {
	display: flex;
	gap: 8px;
	padding-left: 48px;
	margin-top: 4px;
}
/* 锚点直达的楼层高亮（回复/引用跳转、通知里的定位） */
.board-post:target { background: #fffbf0; border-radius: 8px; }

/* ================= 文档快照渲染（dev_status / gm_commands，inc/md_render.php） ================= */
.md-body { font-size: 14px; color: #37475e; }
.md-body h1, .md-body h2, .md-body h3, .md-body h4 { margin: 18px 0 8px; color: #21283b; }
.md-body h1 { font-size: 20px; }
.md-body h2 { font-size: 17px; padding-bottom: 4px; border-bottom: 1px solid #e3eaf2; }
.md-body h3 { font-size: 15px; }
.md-body h4 { font-size: 14px; }
.md-body .md-p { margin: 8px 0; line-height: 1.8; }
.md-body .md-code {
	padding: 12px 14px;
	margin: 10px 0;
	background: #0f151d;
	color: #d8e4f0;
	border-radius: 8px;
	overflow-x: auto;
	font-size: 12.5px;
	line-height: 1.6;
}
.md-body .md-code code { background: none; border: 0; color: inherit; padding: 0; }
.md-body .md-quote {
	margin: 10px 0;
	padding: 8px 14px;
	border-left: 3px solid #9dc6e6;
	background: #f2f7fc;
	border-radius: 0 8px 8px 0;
	color: #4c5c74;
}
.md-body .md-list { margin: 8px 0 8px 22px; padding: 0; }
.md-body .md-list li { margin: 3px 0; }
.md-body .md-hr { border: 0; border-top: 1px dashed #d7e0ea; margin: 16px 0; }
.md-body .table-wrap { margin: 10px 0; }

/* 折叠的全量文档（协议覆盖矩阵） */
.md-fold {
	background: #fff;
	border: 1px solid #e9edf2;
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(23, 43, 77, 0.05);
	padding: 16px 22px;
	margin-bottom: 22px;
}
.md-fold > summary {
	cursor: pointer;
	font-weight: 600;
	color: #21283b;
	font-size: 16px;
	list-style: none;
}
.md-fold > summary::-webkit-details-marker { display: none; }
.md-fold > summary::before { content: '▸ '; color: #2b83bd; }
.md-fold[open] > summary::before { content: '▾ '; }
.md-fold > summary small { color: #8a97ab; font-weight: 400; }
.md-fold .md-body { margin-top: 10px; border-top: 1px dashed #e3eaf2; padding-top: 10px; }

/* ================= 开发进度（dev_status.php） ================= */
/* 进度条 */
.pbar {
	display: inline-block;
	flex: 0 0 auto;
	width: 150px;
	height: 10px;
	background: #eef3f8;
	border-radius: 5px;
	overflow: hidden;
	vertical-align: middle;
}
.pbar i {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, #35c5f0, #2b83bd);
	border-radius: 5px;
	transition: width .2s ease;
}
.pbar-lg { width: min(420px, 60vw); height: 16px; border-radius: 8px; }
.pbar-lg i { border-radius: 8px; }
.ppct { font-weight: 700; color: #2b83bd; font-variant-numeric: tabular-nums; }
.ppct-lg { font-size: 24px; }
.poverall { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }

/* 明细行：名称 | 进度条+% | 说明；GM 编辑态同结构换成表单 */
.prow {
	display: grid;
	grid-template-columns: minmax(140px, 220px) minmax(160px, 1fr) minmax(0, 1.2fr);
	gap: 8px 16px;
	align-items: center;
	padding: 10px 6px;
	border-bottom: 1px dashed #e3eaf2;
}
.prow:last-child { border-bottom: 0; }
.plabel { font-weight: 600; color: #21283b; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pbar-wrap { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pnote { font-size: 12.5px; min-width: 0; }

/* GM 编辑态 */
.prow-edit { padding: 8px 6px; }
.prow-edit .pin-label { max-width: none; }
.prow-edit .pin-pct { width: 74px; max-width: 74px; padding: 7px 8px; }
.prow-edit .pin-note { max-width: none; }
.prow-edit .prow-btns { display: flex; gap: 6px; }
.prow-edit .prow-meta { grid-column: 1 / -1; font-size: 12px; }
@media (max-width: 600px) {
	.prow { grid-template-columns: minmax(0, 1fr); gap: 5px; }
	.prow .pbar-wrap .pbar { flex: 1 1 auto; width: auto; }
}
/* 主题列表手机单列：最后活动并入左对齐的副行 */
@media (max-width: 600px) {
	.thread-row { grid-template-columns: minmax(0, 1fr); padding: 12px 4px; }
	.tr-side { display: flex; flex-wrap: wrap; gap: 6px; text-align: left; margin-top: 2px; }
	.board-post-body, .board-post-act { padding-left: 0; }
	.board-floor { min-width: 34px; }
}

/* ===== 捏脸部件图鉴（making_codex）===== */
.mk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 10px; margin: 12px 0 6px; }
.mk-cell { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px 6px; border: 1px solid #e6ebf2; border-radius: 10px; background: #fff; text-decoration: none; transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease; }
.mk-cell:hover { transform: translateY(-2px); border-color: #9dc6e6; box-shadow: 0 6px 14px rgba(23, 43, 77, .12); }
.mk-thumb { position: relative; width: 72px; height: 72px; border-radius: 8px; background: radial-gradient(circle at 50% 38%, #232e3d 0%, #0d1118 75%); overflow: hidden; }
.mk-thumb img { position: absolute; inset: 6%; width: 88%; height: 88%; object-fit: contain; }
.mk-thumb .mk-noimg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #5f7f9f; font-size: 11px; }
.mk-name { font-size: 12px; font-weight: 600; color: #21283b; line-height: 1.25; text-align: center; }
.mk-sub { font-size: 11px; color: #7a8aa0; line-height: 1.2; text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mk-jump { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
.mk-jump input { width: 90px; }
@media (max-width: 600px) {
	.mk-grid { grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 8px; }
	.mk-thumb { width: 64px; height: 64px; }
}

/* 种族图鉴：正负修正着色 */
.data .up { color: #1c7c43; font-weight: 600; }
.data .down { color: #b3261e; }

/* 捏脸部件：可 3D 单元格与选中态 */
.mk-cell.on { border-color: #2b83bd; box-shadow: 0 0 0 2px rgba(43, 131, 189, .25); }
.mk-3d { position: absolute; right: 3px; bottom: 3px; padding: 0 4px; font-size: 10px; font-weight: 700; line-height: 15px; border-radius: 4px; background: rgba(43, 131, 189, .85); color: #fff; }

/* 宠物图鉴：卡片 3D 提示角标（缩略图占据卡片时提示缩到底角） */
.mag-3d-hint { position: absolute; left: 6px; bottom: 5px; padding: 1px 6px; font-size: 10px; line-height: 15px; border-radius: 4px; background: rgba(13, 17, 24, .72); color: #8fb6d8; }