:root {
  --brand: #1B66C9;
  --brand-light: #3D82E8;
  --brand-dark: #0F4C9C;
  --brand-bg: #EEF4FD;
  --success: #16A34A;
  --warning: #F59E0B;
  --danger: #DC2626;
  --info: #0EA5E9;
  --purple: #7C3AED;
  --t1: #0F172A;
  --t2: #334155;
  --t3: #64748B;
  --t4: #94A3B8;
  --line: #E2E8F0;
  --bg: #F6F8FB;
  --card: #FFFFFF;
  --radius: 10px;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --shadow: 0 4px 16px rgba(15, 23, 42, .07);
  --shadow-lg: 0 16px 48px rgba(15, 23, 42, .14);
}

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

body {
  /* 第 120 轮：对标顶级 UI 字体体系 —— 中文系统栈优先（iOS 苹方/鸿蒙 HarmonyOS Sans/小米 MiSans/思源黑体），数字走 DIN 系（--font-num） */
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "HarmonyOS Sans SC", "MiSans", "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif;
  background: var(--bg);
  color: var(--t1);
  font-size: 13.5px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
:root { --font-num: "DIN Alternate", "Bahnschrift", "Helvetica Neue", Arial, sans-serif; }
/* 数字排版：统计大数 / 金额 / 单号 —— DIN 系等宽数字（金融级对齐规范） */
.o-stat4 b, .o-money, .p-reg-amt, .o-rt.mono, .p-tag, .p-chip, .o-num {
  font-variant-numeric: tabular-nums;
}
.o-stat4 b, .o-money, .p-reg-amt, .o-num {
  font-family: var(--font-num);
  letter-spacing: -.2px;
}
.p-main svg text { font-family: var(--font-num); }

button, input, select, textarea { font-family: inherit; font-size: inherit; color: inherit; }
a { color: var(--brand); text-decoration: none; }

/* ============ 登录 ============ */
.login-wrap {
  min-height: 100vh; display: grid; grid-template-columns: 1.05fr .95fr;
  background: #fff;
}
.login-left {
  position: relative; overflow: hidden;
  background: linear-gradient(145deg, #0B3B7A 0%, #1B66C9 45%, #3D82E8 100%);
  padding: 56px 60px; display: flex; flex-direction: column; justify-content: space-between;
  color: #fff;
}
.login-left::before {
  content: ''; position: absolute; width: 620px; height: 620px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.16), transparent 65%);
  right: -220px; top: -180px;
}
.login-left::after {
  content: ''; position: absolute; width: 420px; height: 420px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.1), transparent 62%);
  left: -160px; bottom: -160px;
}
.brand-line { display: flex; align-items: center; gap: 12px; position: relative; z-index: 2; }
.brand-mark {
  width: 40px; height: 40px; border-radius: 11px; background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.3); display: grid; place-items: center;
  font-weight: 800; font-size: 19px; letter-spacing: -.5px; backdrop-filter: blur(8px);
}
.brand-name { font-size: 18px; font-weight: 700; letter-spacing: .3px; }
.brand-sub { font-size: 11.5px; opacity: .75; letter-spacing: 2.5px; }
.login-hero { position: relative; z-index: 2; max-width: 460px; }
.login-hero h1 { font-size: 33px; line-height: 1.35; font-weight: 700; letter-spacing: -.5px; }
.login-hero h1 em { font-style: normal; color: #BFE0FF; }
.login-hero p { margin-top: 16px; font-size: 14px; opacity: .82; line-height: 1.85; }
.hero-stats { display: flex; gap: 34px; margin-top: 40px; }
.hero-stat .n { font-size: 25px; font-weight: 700; letter-spacing: -.5px; }
.hero-stat .l { font-size: 11.5px; opacity: .68; margin-top: 2px; }
.login-feats { display: flex; gap: 10px; flex-wrap: wrap; position: relative; z-index: 2; }
.login-feats span {
  font-size: 11.5px; padding: 6px 12px; border-radius: 999px;
  background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.2);
}
.login-right { display: grid; place-items: center; padding: 40px; }
.login-card { width: 100%; max-width: 372px; }
.login-card h2 { font-size: 23px; font-weight: 700; letter-spacing: -.3px; }
.login-card .desc { color: var(--t3); margin-top: 7px; margin-bottom: 30px; font-size: 13px; }
.field { margin-bottom: 17px; }
.field label { display: block; font-size: 12.5px; color: var(--t2); margin-bottom: 7px; font-weight: 500; }
.input {
  width: 100%; height: 42px; padding: 0 13px; border: 1px solid var(--line);
  border-radius: 9px; background: #FCFDFE; outline: none; transition: .16s;
}
.input:focus { border-color: var(--brand); background: #fff; box-shadow: 0 0 0 3px rgba(27,102,201,.11); }
.input:hover:not(:focus) { border-color: #CBDEDA; }
/* 表格表头统一淡青底（覆盖内联 #F8FAFC）与行 hover 清新反馈 */
.card th, .modal th { background: #F3F9F8 !important; }
.card tbody tr, .modal tbody tr { transition: background .14s; }
.card tbody tr:hover, .modal tbody tr:hover { background: #F7FBFA; }
.btn-login {
  width: 100%; height: 44px; border: 0; border-radius: 9px; cursor: pointer;
  background: linear-gradient(135deg, var(--brand), var(--brand-light));
  color: #fff; font-weight: 600; font-size: 14.5px; letter-spacing: .5px;
  box-shadow: 0 6px 18px rgba(27,102,201,.28); transition: .18s;
}
.btn-login:hover { transform: translateY(-1px); box-shadow: 0 9px 24px rgba(27,102,201,.34); }
.btn-login:active { transform: translateY(0); }
.demo-accounts { margin-top: 26px; border-top: 1px dashed var(--line); padding-top: 18px; }
.demo-accounts .t { font-size: 11.5px; color: var(--t4); margin-bottom: 10px; letter-spacing: .5px; }
.demo-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 9px 12px; border-radius: 8px; background: var(--bg); margin-bottom: 7px;
  cursor: pointer; transition: .15s; border: 1px solid transparent;
}
.demo-item:hover { background: var(--brand-bg); border-color: #CFE0F7; }
.demo-item .role { font-size: 12.5px; font-weight: 600; }
.demo-item .cred { font-size: 11.5px; color: var(--t3); font-family: ui-monospace, Consolas, monospace; }
.err-box {
  background: #FEF2F2; border: 1px solid #FECACA; color: #B91C1C;
  padding: 10px 13px; border-radius: 8px; font-size: 12.5px; margin-bottom: 14px;
}

/* ============ 布局 ============ */
.app { display: flex; min-height: 100vh; }
.sidebar {
  width: 218px; background: #0E1726; color: #C7D2DE; flex-shrink: 0;
  display: flex; flex-direction: column; position: fixed; top: 0; bottom: 0; z-index: 50;
}
.sb-brand { padding: 20px 20px 16px; display: flex; align-items: center; gap: 10px; }
.sb-brand .mk {
  width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg, var(--brand), var(--brand-light));
  display: grid; place-items: center; font-weight: 800; color: #fff; font-size: 15px;
}
.sb-brand .nm { font-size: 14.5px; font-weight: 650; color: #fff; letter-spacing: .3px; }
.sb-brand .sb-sub { font-size: 10px; color: #64748B; letter-spacing: 1.6px; }
.sb-nav { flex: 1; overflow-y: auto; padding: 6px 10px 20px; }
.sb-nav::-webkit-scrollbar { width: 4px; }
.sb-nav::-webkit-scrollbar-thumb { background: #24313F; border-radius: 4px; }
.nav-group { font-size: 10.5px; color: #5A6B7D; letter-spacing: 1.2px; padding: 15px 12px 7px; font-weight: 600; }
.nav-item {
  display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 8px;
  cursor: pointer; font-size: 13px; color: #B3C0CE; transition: .14s; margin-bottom: 2px;
  position: relative;
}
.nav-item:hover { background: #182432; color: #E4EBF3; }
.nav-item.active { background: linear-gradient(90deg, rgba(27,102,201,.95), rgba(61,130,232,.7)); color: #fff; font-weight: 550; }
.nav-item .ic { width: 17px; text-align: center; font-size: 14px; opacity: .9; }
.nav-badge {
  margin-left: auto; background: var(--danger); color: #fff; font-size: 10px;
  padding: 1px 6px; border-radius: 999px; font-weight: 600;
}
.nav-item.active .nav-badge { background: rgba(255,255,255,.28); }

.main { flex: 1; margin-left: 218px; min-width: 0; display: flex; flex-direction: column; }
.topbar {
  height: 58px; background: rgba(255,255,255,.88); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line); display: flex; align-items: center;
  padding: 0 24px; gap: 16px; position: sticky; top: 0; z-index: 40;
}
.crumb { font-size: 13.5px; color: var(--t3); }
.crumb b { color: var(--t1); font-weight: 600; }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.searchbox {
  display: flex; align-items: center; gap: 7px; background: var(--bg); border: 1px solid var(--line);
  border-radius: 8px; padding: 0 11px; height: 34px; width: 230px; color: var(--t4); font-size: 12.5px;
}
.searchbox input { border: 0; background: transparent; outline: none; width: 100%; }
.avatar {
  width: 32px; height: 32px; border-radius: 50%; background: linear-gradient(135deg, var(--brand), var(--brand-light));
  color: #fff; display: grid; place-items: center; font-size: 12.5px; font-weight: 600;
}
.user-chip { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.user-chip .un { font-size: 12.5px; font-weight: 550; }
.user-chip .ur { font-size: 10.5px; color: var(--t4); }

.content { padding: 22px 24px 40px; flex: 1; max-width: 1480px; width: 100%; margin: 0 auto; }
.content:has(.screen-page) { max-width: none; }
.page-head { display: flex; align-items: flex-end; gap: 14px; margin-bottom: 18px; }
.page-title { font-size: 20px; font-weight: 700; letter-spacing: -.3px; }
.page-sub { font-size: 12.5px; color: var(--t3); margin-bottom: 3px; }
.page-head .actions { margin-left: auto; display: flex; gap: 9px; flex-wrap: wrap; justify-content: flex-end; }

/* ============ 组件 ============ */
/* 清新卡片基底：左上薄荷青光晕 + 右上天蓝光晕（极淡），淡青描边 + 青调柔和投影 */
.card {
  background:
    radial-gradient(820px 240px at -2% -10%, rgba(20, 184, 166, .05), transparent 62%),
    radial-gradient(640px 210px at 102% -4%, rgba(56, 142, 225, .04), transparent 58%),
    linear-gradient(172deg, #FBFEFD 0%, #FFFFFF 36%);
  border: 1px solid #E2EBE9; border-radius: var(--radius);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .05), 0 12px 30px -20px rgba(13, 148, 136, .18), inset 0 1px 0 rgba(255, 255, 255, .85);
}
.card-head {
  padding: 15px 18px; border-bottom: 1px solid #EBF2F0;
  display: flex; align-items: center; gap: 10px;
}
.card-title { font-size: 14px; font-weight: 650; letter-spacing: -.1px; }
.card-head .more { margin-left: auto; font-size: 12px; color: var(--t3); cursor: pointer; }
.card-body { padding: 18px; }

.btn {
  height: 34px; padding: 0 14px; border-radius: 8px; border: 1px solid var(--line);
  background: #fff; cursor: pointer; font-size: 12.5px; font-weight: 550;
  display: inline-flex; align-items: center; gap: 6px; transition: .14s; white-space: nowrap;
}
.btn:hover { border-color: #C8D6E5; background: #FAFCFF; }
.btn-primary {
  background: linear-gradient(135deg, var(--brand), var(--brand-light)); color: #fff;
  border-color: transparent; box-shadow: 0 3px 10px rgba(27,102,201,.22);
}
.btn-primary:hover { box-shadow: 0 5px 16px rgba(27,102,201,.3); background: linear-gradient(135deg, var(--brand-dark), var(--brand)); }
.btn-ghost { background: transparent; border-color: transparent; color: var(--brand); }
.btn-ghost:hover { background: var(--brand-bg); }
.btn-sm { height: 28px; padding: 0 10px; font-size: 12px; border-radius: 7px; }
.btn-danger { color: var(--danger); border-color: #FECACA; background: #FEF7F7; }
.btn:disabled { opacity: .5; cursor: not-allowed; }

.tag {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px;
  border-radius: 999px; font-size: 11.5px; font-weight: 550; white-space: nowrap;
}
.tag-blue { background: #EFF6FF; color: #1D4ED8; }
.tag-green { background: #F0FDF4; color: #15803D; }
.tag-orange { background: #FFFBEB; color: #B45309; }
.tag-red { background: #FEF2F2; color: #B91C1C; }
.tag-gray { background: #F1F5F9; color: #475569; }
.tag-purple { background: #F5F3FF; color: #6D28D9; }
.tag-cyan { background: #ECFEFF; color: #0E7490; }

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 12.8px; }
thead th {
  text-align: left; padding: 10px 14px; font-weight: 600; color: var(--t3);
  background: #FAFBFD; border-bottom: 1px solid var(--line); white-space: nowrap; font-size: 12px;
  position: sticky; top: 0;
}
tbody td { padding: 11px 14px; border-bottom: 1px solid #F1F5F9; color: var(--t2); vertical-align: middle; }
tbody tr:hover { background: #FAFCFF; }
tbody tr:last-child td { border-bottom: 0; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.mono { font-family: ui-monospace, "SF Mono", Consolas, monospace; font-size: 12px; }
.link { color: var(--brand); cursor: pointer; font-weight: 550; }
.link:hover { text-decoration: underline; }
.muted { color: var(--t4); }

.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.kpi {
  background:
    radial-gradient(420px 150px at -4% -14%, rgba(20, 184, 166, .06), transparent 60%),
    radial-gradient(360px 130px at 104% -8%, rgba(56, 142, 225, .05), transparent 56%),
    linear-gradient(172deg, #FBFEFD 0%, #FFFFFF 40%);
  border: 1px solid #E2EBE9; border-radius: var(--radius);
  padding: 17px 18px; box-shadow: 0 1px 2px rgba(15,23,42,.05), 0 12px 30px -20px rgba(13,148,136,.16), inset 0 1px 0 rgba(255,255,255,.85);
  position: relative; overflow: hidden;
}
.kpi::after {
  content: ''; position: absolute; right: -30px; top: -30px; width: 90px; height: 90px;
  border-radius: 50%; background: linear-gradient(140deg, rgba(20,184,166,.10), rgba(56,142,225,.10)); opacity: .7;
}
.kpi .kl { font-size: 12px; color: var(--t3); display: flex; align-items: center; gap: 6px; }
.kpi .kv { font-size: 25px; font-weight: 700; margin-top: 8px; letter-spacing: -.7px; font-variant-numeric: tabular-nums; }
.kpi .kv small { font-size: 13px; font-weight: 500; color: var(--t4); margin-left: 3px; }
.kpi .kd { font-size: 11.5px; color: var(--t4); margin-top: 7px; display: flex; gap: 6px; align-items: center; }
.up { color: var(--success); font-weight: 600; }
.down { color: var(--danger); font-weight: 600; }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.grid-23 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 16px; }

/* 漏斗 */
.funnel { display: flex; flex-direction: column; gap: 11px; }
.funnel-row { display: flex; align-items: center; gap: 11px; }
.funnel-row .fl { width: 46px; font-size: 12px; color: var(--t3); }
.funnel-bar { flex: 1; height: 30px; background: #F1F5F9; border-radius: 7px; overflow: hidden; position: relative; }
.funnel-fill {
  height: 100%; border-radius: 7px; display: flex; align-items: center; padding-left: 10px;
  color: #fff; font-size: 11.5px; font-weight: 600; transition: width .6s cubic-bezier(.2,.8,.2,1);
}
.funnel-row .fv { width: 42px; text-align: right; font-size: 12.5px; font-weight: 650; font-variant-numeric: tabular-nums; }

/* 条形图 */
.bars { display: flex; align-items: flex-end; gap: 9px; height: 130px; padding-top: 10px; }
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; height: 100%; justify-content: flex-end; }
.bar-v {
  width: 100%; max-width: 34px; border-radius: 5px 5px 2px 2px;
  background: linear-gradient(180deg, var(--brand-light), var(--brand));
  transition: height .6s cubic-bezier(.2,.8,.2,1); position: relative;
}
.bar-v:hover { filter: brightness(1.08); }
.bar-x { font-size: 10.5px; color: var(--t4); }

/* 列表行 */
.rowlist { display: flex; flex-direction: column; }
.rowitem {
  display: flex; align-items: center; gap: 11px; padding: 11px 0; border-bottom: 1px solid #F1F5F9;
}
.rowitem:last-child { border-bottom: 0; }
.rowitem .ri-name { font-size: 13px; font-weight: 550; }
.rowitem .ri-sub { font-size: 11.5px; color: var(--t4); margin-top: 1px; }
.rowitem .ri-right { margin-left: auto; text-align: right; }
.ri-amt { font-size: 13px; font-weight: 650; font-variant-numeric: tabular-nums; }

/* 筛选栏 */
.filter-bar {
  display: flex; gap: 9px; align-items: center; flex-wrap: wrap;
  padding: 13px 16px; background: #fff; border: 1px solid var(--line);
  border-radius: var(--radius) var(--radius) 0 0; border-bottom: 0;
}
.filter-bar .input, .filter-bar select { height: 32px; font-size: 12.5px; width: auto; min-width: 120px; padding: 0 10px; }

/* 抽屉 */
.drawer-mask {
  position: fixed; inset: 0; background: rgba(15,23,42,.42); backdrop-filter: blur(2px);
  z-index: 100; display: flex; justify-content: flex-end; animation: fade .18s;
}
@keyframes fade { from { opacity: 0 } }
.drawer {
  width: 640px; max-width: 92vw; background: var(--bg); height: 100%;
  display: flex; flex-direction: column; animation: slidein .22s cubic-bezier(.2,.8,.2,1);
  box-shadow: var(--shadow-lg);
}
@keyframes slidein { from { transform: translateX(40px); opacity: .6 } }
.drawer-head {
  padding: 17px 20px; background: #fff; border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 12px;
}
.drawer-body { flex: 1; overflow-y: auto; padding: 18px 20px; }
.drawer-foot { padding: 13px 20px; background: #fff; border-top: 1px solid var(--line); display: flex; gap: 9px; justify-content: flex-end; }

/* 弹窗 */
.modal-mask {
  position: fixed; inset: 0; background: rgba(15,23,42,.45); backdrop-filter: blur(2px);
  z-index: 110; display: grid; place-items: center; animation: fade .16s;
}
.modal {
  background:
    radial-gradient(560px 170px at -3% -10%, rgba(20, 184, 166, .045), transparent 60%),
    radial-gradient(440px 150px at 103% -6%, rgba(56, 142, 225, .035), transparent 56%),
    #FFFFFF;
  border: 1px solid #E6EEEC;
  border-radius: 14px; width: 520px; max-width: 94vw;
  box-shadow: 0 16px 48px rgba(15, 23, 42, .14), 0 18px 44px -24px rgba(13, 148, 136, .2);
  animation: pop .2s cubic-bezier(.2,.8,.2,1);
  max-height: 88vh; display: flex; flex-direction: column;
}
@keyframes pop { from { transform: scale(.96); opacity: .7 } }
.modal-head { padding: 18px 22px 14px; font-size: 15.5px; font-weight: 650; }
.modal-body { padding: 0 22px 6px; overflow-y: auto; }
.modal-foot { padding: 14px 22px 18px; display: flex; gap: 9px; justify-content: flex-end; }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.form-grid .full { grid-column: 1 / -1; }
.fg label { display: block; font-size: 12px; color: var(--t2); margin-bottom: 6px; font-weight: 500; }
.fg label .req { color: var(--danger); }
.fg .input, .fg select { height: 34px; font-size: 12.5px; padding: 0 10px; }
textarea.input { height: auto; padding: 8px 10px; resize: vertical; min-height: 64px; line-height: 1.5; }

.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); padding: 0 4px; background: #fff; }
.tab {
  padding: 10px 15px; font-size: 13px; color: var(--t3); cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 500; transition: .14s;
}
.tab:hover { color: var(--brand); }
.tab.active { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }

.empty { padding: 46px 20px; text-align: center; color: var(--t4); font-size: 13px; }
.empty .ic { font-size: 30px; margin-bottom: 8px; opacity: .5; }

.toast-wrap { position: fixed; top: 20px; right: 22px; z-index: 200; display: flex; flex-direction: column; gap: 9px; }
.toast {
  background: #0F172A; color: #fff; padding: 11px 17px; border-radius: 9px;
  font-size: 12.8px; box-shadow: var(--shadow-lg); animation: slidein .2s;
  display: flex; align-items: center; gap: 9px; max-width: 380px;
}
.toast.err { background: #B91C1C; }
.toast.ok { background: #15803D; }

/* 代理树 */
.agent-node { border-left: 2px solid var(--line); margin-left: 14px; padding-left: 14px; }
.agent-card {
  background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 12px 14px;
  margin-bottom: 9px; display: flex; align-items: center; gap: 12px; transition: .15s;
}
.agent-card:hover { border-color: #C8D6E5; box-shadow: var(--shadow-sm); }
.lv-badge {
  width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center;
  font-size: 11px; font-weight: 700; color: #fff; flex-shrink: 0;
}
.lv1 { background: linear-gradient(135deg, #1B66C9, #3D82E8); }
.lv2 { background: linear-gradient(135deg, #0891B2, #22D3EE); }
.lv3 { background: linear-gradient(135deg, #7C3AED, #A78BFA); }

/* 打印对账单 */
.statement {
  background: #fff; width: 794px; min-height: 1123px; margin: 0 auto;
  padding: 46px 52px; box-shadow: var(--shadow); font-size: 12px; color: #000;
}
.st-title { text-align: center; font-size: 21px; font-weight: 700; letter-spacing: 3px; margin-bottom: 5px; }
.st-sub { text-align: center; font-size: 11px; color: #555; letter-spacing: 1px; margin-bottom: 20px; }
.st-meta { display: flex; justify-content: space-between; font-size: 11.5px; padding-bottom: 10px; border-bottom: 2px solid #111; }
.st-meta div { line-height: 1.9; }
.st-info { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 24px; margin: 14px 0; font-size: 11.5px; }
.st-info .k { color: #555; }
.st-table { width: 100%; border-collapse: collapse; font-size: 10.5px; margin-top: 8px; }
.st-table th {
  background: #EEF2F7; border: 1px solid #94A3B8; padding: 6px 5px; font-weight: 600; font-size: 10.5px;
  text-align: center; color: #111;
}
.st-table td { border: 1px solid #CBD5E1; padding: 5px; text-align: center; font-variant-numeric: tabular-nums; }
.st-table td.l { text-align: left; }
.st-table td.r { text-align: right; }
.st-total { background: #F8FAFC; font-weight: 700; }
.st-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 16px 0; border: 1px solid #CBD5E1; }
.st-sum-item { padding: 9px 12px; border-right: 1px solid #CBD5E1; }
.st-sum-item:last-child { border-right: 0; }
.st-sum-item .sl { font-size: 10px; color: #555; }
.st-sum-item .sv { font-size: 14.5px; font-weight: 700; margin-top: 2px; font-variant-numeric: tabular-nums; }
.st-sign { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 42px; font-size: 11.5px; }
.st-sign-box { border-top: 1px solid #333; padding-top: 9px; line-height: 2.1; }
.st-foot { margin-top: 30px; font-size: 9.5px; color: #666; line-height: 1.8; border-top: 1px dashed #CBD5E1; padding-top: 10px; }

/* 导入映射 */
.map-row {
  display: grid; grid-template-columns: 1fr 28px 1fr; gap: 10px; align-items: center;
  padding: 8px 0; border-bottom: 1px solid #F1F5F9;
}
.map-arrow { text-align: center; color: var(--t4); }

.pill-tabs { display: inline-flex; background: #F1F5F9; border-radius: 9px; padding: 3px; gap: 2px; }
.pill-tab {
  padding: 6px 14px; border-radius: 7px; font-size: 12.5px; cursor: pointer; color: var(--t3);
  font-weight: 500; transition: .14s;
}
.pill-tab.active { background: #fff; color: var(--brand); box-shadow: var(--shadow-sm); font-weight: 600; }

.matrix-wrap { overflow: auto; max-height: 520px; }
.matrix th { position: sticky; top: 0; z-index: 2; }
.matrix .sticky-col { position: sticky; left: 0; background: #fff; z-index: 1; }
.matrix tbody tr:hover .sticky-col { background: #FAFCFF; }
.cell-check {
  width: 22px; height: 22px; border-radius: 5px; border: 1.5px solid var(--line);
  display: grid; place-items: center; cursor: pointer; margin: 0 auto; transition: .12s;
  font-size: 12px; color: transparent; background: #fff;
}
.cell-check:hover { border-color: var(--brand-light); }
.cell-check.on { background: var(--brand); border-color: var(--brand); color: #fff; }
.cell-check.disabled { background: #F1F5F9; border-color: #E2E8F0; cursor: not-allowed; opacity: .55; }

.stat-mini { display: flex; gap: 22px; padding: 12px 18px; background: var(--brand-bg); border-radius: 9px; }
.stat-mini .sm { font-size: 11.5px; color: var(--t3); }
.stat-mini .sm b { display: block; font-size: 17px; color: var(--brand-dark); font-weight: 700; margin-top: 2px; font-variant-numeric: tabular-nums; }

.scroll-table { max-height: 460px; overflow-y: auto; }

@media (max-width: 1200px) {
  .kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .grid-2, .grid-3, .grid-23 { grid-template-columns: 1fr; }
}
@media print {
  body { background: #fff; }
  .sidebar, .topbar, .page-head, .no-print { display: none !important; }
  .main { margin-left: 0; }
  .content { padding: 0; }
  .statement { box-shadow: none; margin: 0; width: 100%; padding: 20mm 15mm; min-height: auto; }
  /* 第 99 轮：统一页边距 14mm（原 margin:0 会让打印内容顶满纸边、两侧文字被裁） */
  @page { size: A4; margin: 14mm; }
}

/* ===== 集体报名导入：拖拽上传区 ===== */
.drop-zone {
  border: 1.5px dashed #C7D2E0;
  border-radius: 10px;
  background: #FBFCFE;
  padding: 30px 20px;
  text-align: center;
  cursor: pointer;
  transition: all .16s ease;
  color: var(--t2);
}
.drop-zone:hover, .drop-zone.dragging {
  border-color: var(--brand);
  background: #F2F7FF;
  box-shadow: 0 0 0 3px rgba(27,102,201,.08);
}
.ci-grow:hover { background: #F8FAFC; }
.ci-grow td { transition: background .12s; }

/* ================= 学生端（Portal） ================= */
body.portal-mode { background: #F2F5F9; }
body.portal-mode .toast-wrap { display: none; }

.portal-entry { margin-top: 18px; padding-top: 16px; border-top: 1px solid #EEF2F7; }
.btn-portal {
  width: 100%; height: 42px; border-radius: 10px; cursor: pointer;
  border: 1px solid #D7E3F4; background: linear-gradient(180deg,#F7FAFF,#EFF5FE);
  color: #1B66C9; font-size: 13px; font-weight: 600; font-family: inherit;
  transition: all .15s;
}
.btn-portal:hover { background: #E8F1FE; border-color: #B9D3F2; }

.p-login {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  padding: 24px 16px; position: relative; overflow: hidden;
}
.p-login-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(900px 500px at 15% 8%, rgba(27,102,201,.14), transparent 60%),
    radial-gradient(700px 500px at 88% 92%, rgba(109,40,217,.12), transparent 62%),
    linear-gradient(160deg, #F7FAFF 0%, #EEF4FC 100%);
}
.p-login-box {
  position: relative; width: 100%; max-width: 400px;
  background: #fff; border-radius: 20px; padding: 26px 24px 22px;
  box-shadow: 0 20px 60px -18px rgba(16,44,84,.22), 0 2px 8px rgba(16,44,84,.05);
  animation: pRise .4s cubic-bezier(.2,.8,.3,1);
}
@keyframes pRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.p-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.p-logo {
  width: 38px; height: 38px; border-radius: 11px; flex: none;
  background: linear-gradient(135deg,#1B66C9,#3D82E8);
  color: #fff; display: grid; place-items: center;
  font-weight: 700; font-size: 18px; letter-spacing: -.5px;
  box-shadow: 0 4px 12px -2px rgba(27,102,201,.4);
}
.p-logo.sm { width: 28px; height: 28px; border-radius: 8px; font-size: 14px; }
.p-title { font-size: 15.5px; font-weight: 700; color: #0F172A; letter-spacing: -.2px; }
.p-sub { font-size: 11.5px; color: #7A8899; margin-top: 2px; }

.p-hero { margin-bottom: 22px; }
.p-hero-h { font-size: 22px; font-weight: 750; color: #0F172A; letter-spacing: -.5px; margin-bottom: 6px; }
.p-hero-p { font-size: 13px; color: #64748B; line-height: 1.6; }

.p-form label { display: block; font-size: 12.5px; font-weight: 600; color: #334155; margin-bottom: 7px; }
.p-input {
  width: 100%; height: 48px; padding: 0 14px; border-radius: 11px;
  border: 1px solid #DDE5EF; background: #FAFCFF; font-size: 15px;
  font-family: inherit; color: #0F172A; transition: all .15s; box-sizing: border-box;
}
.p-input:focus { outline: none; border-color: #1B66C9; background: #fff; box-shadow: 0 0 0 3px rgba(27,102,201,.1); }
.p-err { color: #DC2626; font-size: 12px; min-height: 18px; margin: 6px 0 2px; }
.p-btn {
  width: 100%; height: 48px; border: 0; border-radius: 11px; cursor: pointer;
  background: linear-gradient(135deg,#1B66C9,#3D82E8); color: #fff;
  font-size: 15px; font-weight: 650; font-family: inherit;
  box-shadow: 0 6px 16px -4px rgba(27,102,201,.45); transition: all .15s;
}
.p-btn:hover:not(:disabled) { filter: brightness(1.06); transform: translateY(-1px); }
.p-btn:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.p-btn-block { width: 100%; }
.p-btn-sm { height: 34px; width: auto; padding: 0 16px; font-size: 13px; border-radius: 8px; box-shadow: none; margin-top: 12px; }

.p-demo { margin-top: 22px; padding-top: 16px; border-top: 1px solid #F0F4F9; }
.p-demo-t { font-size: 11.5px; color: #94A3B8; margin-bottom: 8px; }
.p-demo-item {
  display: flex; justify-content: space-between; align-items: center;
  padding: 9px 12px; border-radius: 9px; background: #F8FAFD;
  font-size: 12.5px; color: #475569; cursor: pointer; margin-bottom: 6px;
  transition: all .13s;
}
.p-demo-item:hover { background: #EEF4FC; color: #1B66C9; }
.p-demo-item .mono { font-family: ui-monospace, Menlo, monospace; font-size: 11.5px; color: #94A3B8; }
.p-back { text-align: center; font-size: 12.5px; color: #94A3B8; margin-top: 18px; cursor: pointer; }
.p-back:hover { color: #1B66C9; }

/* ---- 首页 ---- */
.p-shell { min-height: 100vh; background: #F2F5F9; padding-bottom: 30px; }
.p-header {
  background: #fff; border-bottom: 1px solid #E8EEF6; position: sticky; top: 0; z-index: 20;
}
.p-header-in {
  max-width: 760px; margin: 0 auto; padding: 12px 16px;
  display: flex; align-items: center; justify-content: space-between;
}
.p-brand-sm { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 650; color: #0F172A; }
.p-user { display: flex; align-items: center; gap: 10px; font-size: 13px; color: #475569; }
.p-logout {
  border: 1px solid #E2E8F0; background: #fff; color: #64748B; font-size: 12px;
  padding: 5px 11px; border-radius: 7px; cursor: pointer; font-family: inherit;
}
.p-logout:hover { color: #DC2626; border-color: #FECACA; }

.p-main { max-width: 760px; margin: 0 auto; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.p-card {
  background: #fff; border-radius: 14px; padding: 16px;
  box-shadow: 0 1px 3px rgba(16,44,84,.06), 0 1px 2px rgba(16,44,84,.04);
  animation: pRise .3s ease both;
}
.p-card-h { font-size: 14px; font-weight: 700; color: #0F172A; margin-bottom: 12px; }

.p-profile { display: flex; align-items: center; gap: 13px; }
.p-avatar {
  width: 48px; height: 48px; border-radius: 14px; flex: none;
  background: linear-gradient(135deg,#E8F1FE,#D6E6FB); color: #1B66C9;
  display: grid; place-items: center; font-size: 19px; font-weight: 700;
}
.p-profile-info { flex: 1; min-width: 0; }
.p-name { font-size: 16.5px; font-weight: 700; color: #0F172A; margin-bottom: 5px; }
.p-meta { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #7A8899; flex-wrap: wrap; }
.p-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: #CBD5E1; }
.p-stage {
  font-size: 11.5px; padding: 4px 10px; border-radius: 20px;
  background: #F1F5F9; color: #64748B; font-weight: 600; flex: none;
}
.p-stage.ok { background: #E9F8EF; color: #15803D; }

.p-term-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; }
.p-term-name { font-size: 16px; font-weight: 700; color: #0F172A; margin-bottom: 4px; }
.p-term-date { font-size: 12px; color: #7A8899; }
.p-term-badge {
  font-size: 11.5px; padding: 5px 11px; border-radius: 20px;
  background: #F1F5F9; color: #64748B; font-weight: 600; flex: none;
}
.p-term-badge.live { background: #FEF3E7; color: #B45309; }
.p-term-badge.live::before {
  content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%;
  background: #F59E0B; margin-right: 5px; vertical-align: middle;
  animation: pPulse 1.6s infinite;
}
@keyframes pPulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }

.p-term-bar {
  display: flex; gap: 10px; background: #F8FAFD; border-radius: 10px;
  padding: 10px 12px; margin-bottom: 14px;
}
.p-term-step { flex: 1; font-size: 11.5px; color: #64748B; line-height: 1.5; }
.p-term-step b { display: block; font-size: 11px; color: #94A3B8; font-weight: 500; margin-bottom: 2px; }

.p-reg { padding: 14px 0; border-bottom: 1px solid #F2F5F9; }
.p-reg:last-child { border-bottom: 0; padding-bottom: 0; }
.p-reg-top { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 9px; }
.p-reg-no { font-size: 12px; color: #94A3B8; margin-bottom: 3px; }
.p-reg-term { font-size: 13px; color: #334155; font-weight: 550; }
.p-reg-right { text-align: right; }
.p-reg-amt { font-size: 15px; font-weight: 700; color: #0F172A; margin-bottom: 5px; }
.p-tag { font-size: 11px; padding: 3px 9px; border-radius: 20px; display: inline-block; font-weight: 600; }
.p-tag.ok { background: #E9F8EF; color: #15803D; }
.p-tag.warn { background: #FEF3E7; color: #B45309; }
.p-reg-items { display: flex; flex-wrap: wrap; gap: 5px; }
.p-chip {
  font-size: 11px; padding: 3px 8px; border-radius: 6px;
  background: #F5F8FC; color: #475569;
}
.p-empty { text-align: center; padding: 26px 0; color: #94A3B8; font-size: 13px; }
.p-foot { text-align: center; font-size: 11.5px; color: #A8B4C4; padding: 14px 0 0; }
.p-loading { text-align: center; padding: 60px 0; color: #94A3B8; font-size: 13px; }

/* ---- 底部抽屉 ---- */
.p-sheet-mask {
  position: fixed; inset: 0; background: rgba(15,23,42,.45);
  display: flex; align-items: flex-end; justify-content: center; z-index: 100;
  animation: pFade .18s ease; backdrop-filter: blur(2px);
}
@keyframes pFade { from { opacity: 0; } to { opacity: 1; } }
.p-sheet {
  width: 100%; max-width: 760px; background: #fff;
  border-radius: 20px 20px 0 0; max-height: 88vh; display: flex; flex-direction: column;
  animation: pSlideUp .28s cubic-bezier(.2,.8,.3,1);
}
@keyframes pSlideUp { from { transform: translateY(100%); } to { transform: none; } }
.p-sheet-sm { max-height: 70vh; }
.p-sheet-grab { width: 38px; height: 4px; border-radius: 2px; background: #E2E8F0; margin: 8px auto 0; }
.p-sheet-h {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 18px; font-size: 15px; font-weight: 700; color: #0F172A;
  border-bottom: 1px solid #F2F5F9;
}
.p-sheet-close { color: #94A3B8; cursor: pointer; font-size: 16px; padding: 4px; }
.p-sheet-body { padding: 14px 18px; overflow: auto; flex: 1; }
.p-sheet-foot {
  padding: 12px 18px calc(12px + env(safe-area-inset-bottom));
  border-top: 1px solid #F2F5F9; display: flex; align-items: center; gap: 12px;
}
.p-sheet-foot .p-btn { flex: 1; }
.p-sum { font-size: 12.5px; color: #64748B; white-space: nowrap; }
.p-sum b { color: #0F172A; font-size: 16px; font-weight: 700; }

.p-sheet-tip { font-size: 11.5px; color: #7A8899; margin-bottom: 12px; }
.p-group-h { font-size: 12px; font-weight: 650; color: #94A3B8; margin: 14px 0 8px; }

.p-course {
  display: flex; align-items: flex-start; gap: 11px; padding: 12px;
  border: 1px solid #EDF2F7; border-radius: 11px; margin-bottom: 8px;
  cursor: pointer; transition: all .14s;
}
.p-course:hover:not(.disabled) { border-color: #C5DBF5; background: #FAFCFF; }
.p-course.sel { border-color: #1B66C9; background: #F5F9FF; box-shadow: 0 0 0 2px rgba(27,102,201,.09); }
.p-course.disabled { opacity: .52; cursor: not-allowed; background: #FAFBFC; }
.p-course-check { padding-top: 2px; }
.p-course-check input { width: 17px; height: 17px; accent-color: #1B66C9; cursor: inherit; }
.p-course-main { flex: 1; min-width: 0; }
.p-course-name { font-size: 13.5px; font-weight: 600; color: #0F172A; margin-bottom: 5px; }
.p-course-meta { display: flex; gap: 8px; font-size: 11px; color: #7A8899; flex-wrap: wrap; align-items: center; }
.p-mini { padding: 1px 6px; border-radius: 4px; background: #F1F5F9; font-size: 10.5px; }
.p-mini.deg { background: #F3E8FF; color: #7E22CE; }
.p-course-warn { font-size: 11px; color: #DC2626; margin-top: 5px; }
.p-course-right { text-align: right; flex: none; }
.p-course-fee { font-size: 14px; font-weight: 700; color: #0F172A; }
.p-course-state { font-size: 10.5px; color: #94A3B8; margin-top: 3px; }
.p-course-state.ok { color: #15803D; }

.p-pay-amt { text-align: center; font-size: 34px; font-weight: 750; color: #0F172A; letter-spacing: -1px; margin: 10px 0 4px; }
.p-pay-sub { text-align: center; font-size: 12.5px; color: #94A3B8; margin-bottom: 22px; }
.p-pay-methods { display: flex; flex-direction: column; gap: 9px; }
.p-pay-m {
  display: flex; align-items: center; gap: 11px; padding: 13px 14px;
  border: 1px solid #EDF2F7; border-radius: 11px; cursor: pointer; font-size: 13.5px; color: #334155;
}
.p-pay-m:has(input:checked) { border-color: #1B66C9; background: #F5F9FF; }
.p-pay-m input { accent-color: #1B66C9; width: 16px; height: 16px; }
.p-pay-ico {
  width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center;
  color: #fff; font-size: 12px; font-weight: 700;
}
.p-pay-ico.wx { background: #07C160; }
.p-pay-ico.ali { background: #1677FF; }
.p-pay-note { font-size: 11px; color: #A8B4C4; text-align: center; margin-top: 14px; }

.p-success { padding: 34px 24px 26px; text-align: center; }
.p-success-ico {
  width: 62px; height: 62px; border-radius: 50%; margin: 0 auto 16px;
  background: #E9F8EF; color: #15803D; display: grid; place-items: center;
  font-size: 30px; font-weight: 700; animation: pPop .4s cubic-bezier(.2,.9,.3,1.3);
}
@keyframes pPop { from { transform: scale(.5); opacity: 0; } to { transform: none; opacity: 1; } }
.p-success-h { font-size: 19px; font-weight: 700; color: #0F172A; margin-bottom: 7px; }
.p-success-p { font-size: 13px; color: #7A8899; margin-bottom: 24px; }

@media (max-width: 520px) {
  .p-login-box { border-radius: 16px; padding: 22px 18px 18px; }
  .p-hero-h { font-size: 20px; }
  .p-main { padding: 12px; gap: 11px; }
  .p-card { border-radius: 12px; padding: 14px; }
}

/* ================= 总平台控制台 ================= */
.plat-chip {
  font-size: 11.5px; font-weight: 600; color: #6D28D9;
  background: #F3E8FF; padding: 5px 11px; border-radius: 20px;
  border: 1px solid #E9D5FF;
}
.app.plat-mode .sb-brand .mk {
  background: linear-gradient(135deg,#6D28D9,#8B5CF6);
  box-shadow: 0 4px 12px -2px rgba(109,40,217,.4);
}
.app.plat-mode .nav-item.active { background: rgba(139,92,246,.16); color: #C4B5FD; }
.app.plat-mode .nav-item.active .ic { color: #A78BFA; }
.app.plat-mode .nav-item:hover:not(.active) { background: rgba(255,255,255,.05); }

.kp-sub { font-size: 11px; color: var(--t3); margin-top: 5px; }

.bar-chart {
  display: flex; align-items: flex-end; gap: 10px; height: 168px;
  padding: 10px 4px 0;
}
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.bar-v { font-size: 11px; color: var(--t3); margin-bottom: 4px; font-weight: 600; }
.bar {
  width: 100%; max-width: 42px; border-radius: 6px 6px 3px 3px;
  background: linear-gradient(180deg,#6D28D9,#8B5CF6);
  transition: height .4s cubic-bezier(.2,.8,.3,1);
  opacity: .88;
}
.bar-col:hover .bar { opacity: 1; }
.bar-l { font-size: 11px; color: var(--t4); margin-top: 7px; }

.rank-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; }
.rank-name { font-size: 12.5px; color: var(--t2); width: 130px; flex: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-bar { flex: 1; height: 8px; background: #F1F5F9; border-radius: 4px; overflow: hidden; }
.rank-bar i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg,#8B5CF6,#C4B5FD); transition: width .5s; }
.rank-val { font-size: 11.5px; color: var(--t3); width: 100px; text-align: right; flex: none; }

.hint-box {
  background: #F5F9FF; border: 1px solid #E0EBFA; border-radius: 8px;
  padding: 10px 12px; font-size: 12px; color: #3B6BA5; line-height: 1.6;
}

/* 审批轨迹时间轴 */
.tl { padding: 4px 0; }
.tl-item { display: flex; gap: 12px; padding-bottom: 16px; position: relative; }
.tl-item:not(:last-child)::before {
  content: ''; position: absolute; left: 7px; top: 18px; bottom: 0;
  width: 1.5px; background: #E8EEF6;
}
.tl-dot {
  width: 15px; height: 15px; border-radius: 50%; flex: none; margin-top: 2px;
  border: 2.5px solid #fff; box-shadow: 0 0 0 2px #DBEAFE; background: #3D82E8;
}
.tl-dot.ok { background: #16A34A; box-shadow: 0 0 0 2px #DCFCE7; }
.tl-dot.warn { background: #F59E0B; box-shadow: 0 0 0 2px #FEF3C7; }
.tl-dot.gray { background: #CBD5E1; box-shadow: 0 0 0 2px #F1F5F9; }
.tl-body { flex: 1; }
.tl-h { font-size: 12.5px; font-weight: 600; color: var(--t1); margin-bottom: 3px; }
.tl-p { font-size: 11.5px; color: var(--t3); line-height: 1.6; }

/* ===== 筛选行 ===== */
.filter-row { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.filter-row .input { height: 34px; font-size: 12.5px; }
.filter-row .btn { height: 34px; }

/* ===== 流水行 ===== */
.bill-row { display: flex; align-items: center; gap: 11px; padding: 9px 0; border-bottom: 1px solid #F4F7FA; }
.bill-row:last-child { border-bottom: 0; }
.bill-ico {
  width: 28px; height: 28px; border-radius: 8px; flex: none;
  display: grid; place-items: center; font-size: 15px; font-weight: 700;
}
.bill-ico.in { background: #E9F8EF; color: #15803D; }
.bill-ico.out { background: #FEF2F2; color: #DC2626; }
.bill-main { flex: 1; min-width: 0; }
.bill-t { font-size: 12.5px; color: var(--t1); font-weight: 550; }
.bill-t .muted { font-weight: 400; font-size: 11.5px; }
.bill-s { font-size: 11px; color: var(--t4); margin-top: 2px; }
.bill-amt { font-size: 13px; font-weight: 700; flex: none; }
.bill-amt.in { color: #15803D; }
.bill-amt.out { color: #DC2626; }

/* ================== 学籍异动 ================== */
.chg-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 9px; border-radius: 6px; font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.chg-badge.c-blue { background: #EEF4FD; color: #1B66C9; }
.chg-badge.c-orange { background: #FEF6E7; color: #B45309; }
.chg-badge.c-green { background: #ECFDF3; color: #15803D; }
.chg-badge.c-red { background: #FEF2F2; color: #DC2626; }
.chg-badge.c-gray { background: #F1F5F9; color: #64748B; }
.chg-badge.c-cyan { background: #ECFEFF; color: #0E7490; }
.chg-diff { font-size: 12px; color: var(--t2); max-width: 220px; }
.chg-diff b { color: var(--brand); }
.link.danger { color: var(--danger); }

.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 22px; }
.detail-grid > div { display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0; border-bottom: 1px dashed var(--line); font-size: 12.5px; }
.detail-grid span { color: var(--t3); }
.detail-grid b { color: var(--t1); font-weight: 600; }
.sec-title { font-size: 12px; font-weight: 700; color: var(--t2); letter-spacing: .3px; }
.note-box { background: #F8FAFC; border: 1px solid var(--line); border-radius: 8px;
  padding: 11px 13px; font-size: 12.5px; color: var(--t2); line-height: 1.7; }
.mini-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.mini-table th { text-align: left; padding: 8px 10px; background: #F8FAFC;
  color: var(--t3); font-weight: 600; border-bottom: 1px solid var(--line); font-size: 11.5px; }
.mini-table td { padding: 8px 10px; border-bottom: 1px solid #F1F5F9; }
.mini-table tr:last-child td { border-bottom: none; }

.hint-box { padding: 10px 13px; border-radius: 8px; font-size: 12.5px; line-height: 1.6; }
.hint-box.ok { background: #EEF4FD; color: #1B66C9; border: 1px solid #D6E4FA; }
.hint-box.warn { background: #FEF2F2; color: #B91C1C; border: 1px solid #FBD5D5; }

/* ================== 资料审查 ================== */
.doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.doc-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 16px; cursor: pointer; transition: .16s; }
.doc-card:hover { border-color: #B9D2F5; box-shadow: var(--shadow); transform: translateY(-1px); }
.doc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.doc-name { font-size: 13.5px; font-weight: 650; color: var(--t1); }
.doc-sub { font-size: 11.5px; color: var(--t4); margin-top: 3px; }
.doc-progress { height: 6px; background: #EEF2F7; border-radius: 4px; overflow: hidden; margin: 12px 0 8px; }
.doc-progress i { display: block; height: 100%; background: linear-gradient(90deg, #3D82E8, #16A34A);
  border-radius: 4px; transition: .4s; }
.doc-foot { display: flex; gap: 12px; font-size: 11.5px; color: var(--t3); align-items: center; }
.doc-foot .muted { margin-left: auto; }

.doc-item { display: flex; align-items: center; gap: 12px; padding: 11px 4px;
  border-bottom: 1px solid #F1F5F9; }
.doc-item:last-child { border-bottom: none; }
.doc-item-ico { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center;
  justify-content: center; font-size: 14px; font-weight: 700; flex-shrink: 0; }
.doc-item-ico.s-ok { background: #ECFDF3; color: #15803D; }
.doc-item-ico.s-bad { background: #FEF2F2; color: #DC2626; }
.doc-item-ico.s-wait { background: #FEF6E7; color: #B45309; }
.doc-item-ico.s-miss { background: #F1F5F9; color: #94A3B8; }
.doc-item-main { flex: 1; min-width: 0; }
.doc-item-t { font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 7px; }
.doc-item-s { font-size: 11.5px; color: var(--t4); margin-top: 2px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.doc-item-act { display: flex; align-items: center; gap: 10px; font-size: 12px; }
.req-dot { font-size: 10px; padding: 1px 6px; border-radius: 4px; background: #FEF2F2; color: #DC2626; font-weight: 600; }

/* ================== 打印中心 ================== */
.print-tpl-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-bottom: 16px; }
.print-tpl { background: var(--card); border: 1.5px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; cursor: pointer; transition: .16s; }
.print-tpl:hover { border-color: #B9D2F5; }
.print-tpl.active { border-color: var(--brand); background: #F7FAFF; box-shadow: 0 0 0 3px rgba(27, 102, 201, .08); }
.pt-ico { font-size: 20px; color: var(--brand); margin-bottom: 8px; }
.print-tpl.active .pt-ico { color: var(--brand-dark); }
.pt-n { font-size: 13.5px; font-weight: 650; margin-bottom: 4px; }
.pt-d { font-size: 11.5px; color: var(--t4); line-height: 1.5; }

/* 打印预览 */
.print-mask { background: rgba(15, 23, 42, .55); align-items: stretch; }
.print-wrap { width: 100%; display: flex; flex-direction: column; }
.print-bar { background: #fff; border-bottom: 1px solid var(--line); padding: 12px 24px;
  display: flex; justify-content: space-between; align-items: center; box-shadow: var(--shadow-sm); }
.pb-title { font-size: 14px; font-weight: 650; }
.pb-act { display: flex; gap: 9px; }
.print-scroll { flex: 1; overflow: auto; padding: 26px; background: #E9EEF5; max-height: calc(100vh - 62px); }

.sheet { background: #fff; width: 720px; margin: 0 auto 22px; padding: 30px 34px;
  box-shadow: 0 2px 18px rgba(15, 23, 42, .12); position: relative; }
.sheet-head { text-align: center; border-bottom: 2px solid #1B66C9; padding-bottom: 12px; margin-bottom: 18px; position: relative; }
.sh-org { font-size: 13px; color: var(--t3); letter-spacing: 1px; }
.sh-title { font-size: 21px; font-weight: 700; letter-spacing: 4px; margin: 6px 0; color: #0F172A; }
.sh-no { font-size: 11px; color: var(--t4); position: absolute; right: 0; bottom: 6px; }

.sheet-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.sheet-table th { background: #F4F7FB; font-weight: 600; color: var(--t2); text-align: left;
  border: 1px solid #D9E2EC; padding: 9px 11px; width: 88px; white-space: nowrap; }
.sheet-table td { border: 1px solid #D9E2EC; padding: 9px 11px; color: var(--t1); }
.sheet-table.full th { width: auto; }
.sheet-table tfoot td { background: #F8FAFC; font-weight: 600; }
.sheet-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.ok-t { color: #15803D; font-weight: 600; }
.bad-t { color: #DC2626; font-weight: 600; }

.sign-row { margin-top: 26px; font-size: 12px; color: var(--t2); line-height: 2.4; }
.sign-item { display: flex; align-items: center; gap: 8px; }
.sign-line { display: inline-block; width: 130px; border-bottom: 1px solid #94A3B8; height: 14px; }

.sheet-card .card-body2 { display: flex; gap: 24px; }
.ec-photo { width: 92px; height: 124px; border: 1px dashed #94A3B8; border-radius: 4px;
  display: flex; align-items: center; justify-content: center; color: var(--t4);
  font-size: 11px; flex-shrink: 0; background: #FAFBFD; }
.ec-tip { margin-top: 14px; font-size: 11.5px; color: var(--t3); border-top: 1px dashed #D9E2EC; padding-top: 10px; }

.sheet-cert { text-align: center; padding: 54px 64px; }
.cert-title { font-size: 26px; font-weight: 700; letter-spacing: 10px; margin-bottom: 34px;
  border-bottom: 2px solid #1B66C9; display: inline-block; padding-bottom: 10px; }
.cert-body { text-align: left; font-size: 14px; line-height: 2.6; color: #1E293B; }
.cert-body b { border-bottom: 1px solid #94A3B8; padding: 0 4px; font-weight: 600; }
.cert-foot { margin-top: 52px; text-align: right; font-size: 13px; line-height: 2.4; }
.sc-meta { display: flex; gap: 22px; flex-wrap: wrap; font-size: 12px; color: var(--t2); margin-bottom: 12px; }

@media print {
  body * { visibility: hidden !important; }
  #printArea, #printArea * { visibility: visible !important; }
  .print-bar { display: none !important; }
  .print-scroll { position: absolute; left: 0; top: 0; padding: 0; background: #fff; }
  .sheet { box-shadow: none; margin: 0; page-break-after: always; width: 100%; }
}

/* ================== 成绩与毕业 ================== */
.big-progress { display: flex; align-items: center; gap: 28px; padding: 6px 0; }
.bp-ring {
  width: 116px; height: 116px; border-radius: 50%; flex-shrink: 0;
  background: conic-gradient(#1B66C9 calc(var(--p) * 1%), #E8EEF6 0);
  display: flex; align-items: center; justify-content: center;
}
.bp-in { width: 92px; height: 92px; border-radius: 50%; background: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center; }
.bp-in b { font-size: 20px; color: var(--t1); font-variant-numeric: tabular-nums; }
.bp-in span { font-size: 10.5px; color: var(--t4); margin-top: -2px; }
.bp-stats { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
.bp-stats > div { display: flex; flex-direction: column; gap: 2px; }
.bp-stats span { font-size: 11.5px; color: var(--t3); }
.bp-stats b { font-size: 13.5px; color: var(--t1); font-variant-numeric: tabular-nums; }

.check-row { display: flex; align-items: flex-start; gap: 11px; padding: 9px 0;
  border-bottom: 1px dashed var(--line); }
.check-row:last-child { border-bottom: none; }
.ck-ico { width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; font-size: 11px; font-weight: 700; flex-shrink: 0; margin-top: 1px; }
.ck-ico.ok { background: #ECFDF3; color: #15803D; }
.ck-ico.bad { background: #FEF2F2; color: #DC2626; }
.ck-t { font-size: 12.5px; font-weight: 600; color: var(--t1); }
.ck-s { font-size: 11.5px; color: var(--t4); margin-top: 1px; }

.mini-bar { height: 5px; background: #EEF2F7; border-radius: 3px; overflow: hidden; width: 100%;
  max-width: 140px; margin-bottom: 4px; }
.mini-bar i { display: block; height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #3D82E8, #16A34A); }
.spacer { flex: 1; }
.tag.tag-blue { background: #EEF4FD; color: #1B66C9; }
.tag.tag-purple { background: #F5F3FF; color: #6D28D9; }
.tag.tag-cyan { background: #ECFEFF; color: #0E7490; }

/* ================== 消息中心 ================== */
.msg-list { display: flex; flex-direction: column; gap: 10px; }
.msg-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 16px; display: flex; gap: 14px; align-items: flex-start; transition: .16s; }
.msg-card:hover { border-color: #B9D2F5; box-shadow: var(--shadow-sm); }
.msg-ico { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center;
  justify-content: center; font-size: 15px; font-weight: 700; flex-shrink: 0; }
.msg-ico.ch-wx { background: #E8F7EE; color: #07C160; }
.msg-ico.ch-sms { background: #EEF4FD; color: #1B66C9; }
.msg-ico.ch-in { background: #F1F5F9; color: #64748B; }
.msg-main { flex: 1; min-width: 0; }
.msg-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.msg-title { font-size: 13.5px; font-weight: 650; color: var(--t1); }
.msg-body { font-size: 12.5px; color: var(--t2); margin-top: 5px; line-height: 1.6; }
.msg-meta { display: flex; gap: 16px; font-size: 11.5px; color: var(--t4); margin-top: 7px; }
.msg-act { display: flex; flex-direction: column; gap: 6px; font-size: 12px; align-items: flex-end; }

/* ================== AI 助手 ================== */
.ai-layout { display: grid; grid-template-columns: 1fr 330px; gap: 16px; align-items: start; }
.ai-chat-card { display: flex; flex-direction: column; height: calc(100vh - 190px); min-height: 520px; }
.ai-scroll { flex: 1; overflow-y: auto; padding: 18px 20px; background: #FAFBFD; }
.ai-welcome { text-align: center; padding: 26px 20px 10px; }
.aw-ico { font-size: 32px; color: var(--brand); margin-bottom: 10px; }
.aw-t { font-size: 15px; font-weight: 650; color: var(--t1); }
.aw-d { font-size: 12.5px; color: var(--t3); margin-top: 6px; line-height: 1.7; max-width: 380px; margin-left: auto; margin-right: auto; }

.ai-row { display: flex; gap: 10px; margin-bottom: 16px; align-items: flex-start; }
.ai-row.me { justify-content: flex-end; }
.ai-avatar { width: 30px; height: 30px; border-radius: 9px; background: linear-gradient(135deg, #1B66C9, #7C3AED);
  color: #fff; font-size: 11px; font-weight: 700; display: flex; align-items: center;
  justify-content: center; flex-shrink: 0; }
.ai-bubble { background: #fff; border: 1px solid var(--line); border-radius: 12px; border-top-left-radius: 4px;
  padding: 11px 14px; font-size: 13px; line-height: 1.75; color: var(--t1); max-width: 78%;
  box-shadow: var(--shadow-sm); }
.ai-bubble.me { background: var(--brand); color: #fff; border: none; border-radius: 12px;
  border-top-right-radius: 4px; max-width: 70%; }
.ai-bubble b { color: var(--brand); }
.ai-bubble.me b { color: #fff; }
.ai-bubble.typing { display: flex; gap: 4px; padding: 14px; }
.ai-bubble.typing i { width: 6px; height: 6px; border-radius: 50%; background: #B9C6D8;
  animation: typing 1.2s infinite; }
.ai-bubble.typing i:nth-child(2) { animation-delay: .2s; }
.ai-bubble.typing i:nth-child(3) { animation-delay: .4s; }
@keyframes typing { 0%,60%,100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

.ai-cards { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.ai-card { background: #F7FAFF; border: 1px solid #DCE7F7; border-radius: 9px; padding: 9px 12px; min-width: 96px; }
.ac-l { font-size: 10.5px; color: var(--t3); }
.ac-v { font-size: 14px; font-weight: 700; color: var(--t1); margin-top: 2px; font-variant-numeric: tabular-nums; }
.ai-card.t-good { background: #F3FBF6; border-color: #CDEBD9; }
.ai-card.t-good .ac-v { color: #15803D; }
.ai-card.t-warn { background: #FFFBF2; border-color: #F7E2BC; }
.ai-card.t-warn .ac-v { color: #B45309; }
.ai-card.t-bad .ac-v { color: #DC2626; }

.ai-table { margin-top: 10px; overflow: auto; max-height: 240px; border: 1px solid var(--line); border-radius: 8px; }
.ai-table table { width: 100%; border-collapse: collapse; font-size: 12px; }
.ai-table th { background: #F8FAFC; text-align: left; padding: 7px 10px; color: var(--t3);
  font-weight: 600; position: sticky; top: 0; font-size: 11.5px; }
.ai-table td { padding: 7px 10px; border-top: 1px solid #F1F5F9; }
.ai-actions { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.ai-act { font-size: 11.5px; padding: 4px 11px; border-radius: 20px; background: #EEF4FD;
  color: var(--brand); cursor: pointer; font-weight: 600; }
.ai-act:hover { background: #DDEAFB; }

.ai-sugg { padding: 10px 16px; display: flex; gap: 7px; flex-wrap: wrap;
  border-top: 1px solid var(--line); background: #fff; max-height: 84px; overflow: auto; }
.ai-chip { font-size: 11.5px; padding: 5px 11px; border-radius: 20px; background: #F1F5F9;
  color: var(--t2); cursor: pointer; transition: .14s; white-space: nowrap; }
.ai-chip:hover { background: var(--brand-bg); color: var(--brand); }
.ai-input { display: flex; gap: 9px; padding: 12px 16px; border-top: 1px solid var(--line); background: #fff; }
.ai-input input { flex: 1; height: 40px; border: 1px solid var(--line); border-radius: 10px;
  padding: 0 14px; font-size: 13px; font-family: inherit; outline: none; }
.ai-input input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(27,102,201,.1); }
.ai-input button { height: 40px; padding: 0 20px; border-radius: 10px; border: none;
  background: var(--brand); color: #fff; font-size: 13px; font-weight: 600; cursor: pointer; }
.ai-input button:hover { background: var(--brand-dark); }
.ai-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: #16A34A; margin-right: 5px; vertical-align: middle; }

.ai-side .ins-item { display: flex; gap: 11px; align-items: flex-start; padding: 11px 10px;
  border-radius: 9px; cursor: pointer; transition: .14s; border-left: 3px solid transparent; }
.ai-side .ins-item:hover { background: #F8FAFC; }
.ai-side .ins-item.lv-warn { border-left-color: #F59E0B; }
.ai-side .ins-item.lv-danger { border-left-color: #DC2626; }
.ai-side .ins-item.lv-info { border-left-color: #0EA5E9; }
.ai-side .ins-item.lv-good { border-left-color: #16A34A; }
.ins-ico { width: 26px; height: 26px; border-radius: 7px; display: flex; align-items: center;
  justify-content: center; font-size: 12px; flex-shrink: 0; background: #F1F5F9; color: var(--t2); }
.lv-warn .ins-ico { background: #FEF6E7; color: #B45309; }
.lv-danger .ins-ico { background: #FEF2F2; color: #DC2626; }
.lv-info .ins-ico { background: #ECFEFF; color: #0E7490; }
.lv-good .ins-ico { background: #ECFDF3; color: #15803D; }
.ins-main { flex: 1; min-width: 0; }
.ins-t { font-size: 12.5px; font-weight: 600; color: var(--t1); }
.ins-d { font-size: 11.5px; color: var(--t4); margin-top: 2px; line-height: 1.5; }
.ins-go { color: var(--t4); font-size: 16px; align-self: center; }

/* ================== 运营数据大屏（深色） ================== */
.screen-page {
  background: radial-gradient(1200px 600px at 50% -10%, #12243D 0%, #0B1220 55%, #070C15 100%);
  border-radius: 14px; padding: 18px 20px 14px; color: #E2E8F0; margin: -4px 0 0;
  font-variant-numeric: tabular-nums;
}
.sc-head { display: flex; justify-content: space-between; align-items: center;
  border-bottom: 1px solid rgba(56,189,248,.18); padding-bottom: 14px; margin-bottom: 16px; }
.sc-title { display: flex; align-items: center; gap: 12px; }
.sc-mark { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center;
  justify-content: center; font-weight: 700; font-size: 17px;
  background: linear-gradient(135deg, #1B66C9, #38BDF8); color: #fff;
  box-shadow: 0 0 22px rgba(56,189,248,.35); }
.sc-title h1 { font-size: 17px; font-weight: 700; letter-spacing: 1.5px; color: #F1F5F9; }
.sc-title p { font-size: 9.5px; letter-spacing: 2.5px; color: rgba(56,189,248,.65); margin-top: 2px; }
.sc-right { display: flex; align-items: center; gap: 14px; font-size: 12px; }
.sc-live { display: flex; align-items: center; gap: 6px; color: #34D399; font-weight: 600; }
.sc-live i { width: 7px; height: 7px; border-radius: 50%; background: #34D399;
  box-shadow: 0 0 8px #34D399; animation: pulse 1.8s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.sc-time { color: rgba(148,163,184,.8); }
.sc-btn { background: rgba(56,189,248,.12); border: 1px solid rgba(56,189,248,.3);
  color: #7DD3FC; padding: 5px 13px; border-radius: 7px; cursor: pointer; font-size: 12px; }
.sc-btn:hover { background: rgba(56,189,248,.22); }

.sc-kpi-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-bottom: 14px; }
.sc-kpi { background: linear-gradient(160deg, rgba(30,58,95,.55), rgba(15,23,42,.5));
  border: 1px solid rgba(56,189,248,.16); border-radius: 10px; padding: 12px 14px;
  display: flex; gap: 10px; align-items: center; position: relative; overflow: hidden; }
.sc-kpi::after { content: ''; position: absolute; left: 0; top: 0; width: 2px; height: 100%;
  background: #38BDF8; opacity: .8; }
.sc-kpi.warn::after { background: #FBBF24; }
.sk-ico { width: 30px; height: 30px; border-radius: 8px; background: rgba(56,189,248,.12);
  display: flex; align-items: center; justify-content: center; color: #7DD3FC; font-size: 13px; }
.sc-kpi.warn .sk-ico { background: rgba(251,191,36,.14); color: #FBBF24; }
.sk-l { font-size: 11px; color: rgba(148,163,184,.85); }
.sk-v { font-size: 19px; font-weight: 700; color: #F8FAFC; margin-top: 2px; letter-spacing: .3px; }

.sc-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.sc-col { display: flex; flex-direction: column; gap: 12px; }
.sc-panel { background: rgba(15,23,42,.62); border: 1px solid rgba(56,189,248,.14);
  border-radius: 10px; padding: 13px 15px 15px; }
.sc-panel-head { display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px dashed rgba(56,189,248,.16); }
.sc-panel-head span { font-size: 12.5px; font-weight: 650; color: #CBD5E1; letter-spacing: .5px; }
.sc-panel-head span::before { content: '▎'; color: #38BDF8; margin-right: 4px; }
.sc-panel-head em { font-size: 10.5px; color: rgba(148,163,184,.7); font-style: normal; }

.sc-chart { height: 158px; }
.area-svg { width: 100%; height: 100%; }

.sc-donut-wrap { }
.dn-wrap { display: flex; align-items: center; gap: 16px; }
.dn-svg { width: 132px; height: 132px; flex-shrink: 0; }
.dn-legend { flex: 1; display: flex; flex-direction: column; gap: 9px; }
.dl-row { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #94A3B8; }
.dl-row i { width: 8px; height: 8px; border-radius: 2px; flex-shrink: 0; }
.dl-row span { flex: 1; }
.dl-row b { color: #E2E8F0; font-size: 12.5px; }

.sc-funnel { display: flex; flex-direction: column; gap: 9px; }
.fn-row { display: flex; align-items: center; gap: 9px; }
.fn-bar { height: 26px; border-radius: 4px; display: flex; align-items: center;
  justify-content: space-between; padding: 0 9px; min-width: 90px;
  background: linear-gradient(90deg, rgba(56,189,248,.55), rgba(56,189,248,.18));
  border: 1px solid rgba(56,189,248,.35); transition: .4s; }
.fn-name { font-size: 11px; color: #E0F2FE; }
.fn-val { font-size: 12.5px; font-weight: 700; color: #F0F9FF; }
.fn-pct { font-size: 11px; color: rgba(148,163,184,.8); width: 36px; text-align: right; }

.sc-bars { display: flex; flex-direction: column; gap: 10px; }
.sc-bar-row { display: flex; align-items: center; gap: 9px; }
.sbr-name { width: 88px; font-size: 11.5px; color: #94A3B8; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.sbr-track { flex: 1; height: 7px; background: rgba(148,163,184,.12); border-radius: 4px; overflow: hidden; }
.sbr-track i { display: block; height: 100%; border-radius: 4px;
  background: linear-gradient(90deg, #0EA5E9, #38BDF8); }
.sbr-v { font-size: 11.5px; color: #E2E8F0; width: 96px; text-align: right; }
.sbr-v em { color: rgba(148,163,184,.7); font-style: normal; font-size: 10.5px; margin-left: 5px; }

.sc-rank { display: flex; flex-direction: column; gap: 8px; }
.rk-row { display: flex; align-items: center; gap: 10px; padding: 5px 0;
  border-bottom: 1px solid rgba(148,163,184,.07); }
.rk-row:last-child { border-bottom: none; }
.rk-no { width: 18px; height: 18px; border-radius: 5px; background: rgba(148,163,184,.14);
  color: #94A3B8; font-size: 10.5px; font-weight: 700; display: flex;
  align-items: center; justify-content: center; flex-shrink: 0; }
.rk-no.n1 { background: linear-gradient(135deg, #F59E0B, #FBBF24); color: #422006; }
.rk-no.n2 { background: linear-gradient(135deg, #94A3B8, #CBD5E1); color: #1E293B; }
.rk-no.n3 { background: linear-gradient(135deg, #B45309, #D97706); color: #fff; }
.rk-name { flex: 1; font-size: 11.5px; color: #CBD5E1; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; }
.rk-name em { color: rgba(148,163,184,.65); font-style: normal; font-size: 10.5px; margin-left: 6px; }
.rk-val { font-size: 12.5px; font-weight: 650; color: #7DD3FC; }

.sc-todos { display: flex; flex-direction: column; gap: 2px; }
.td-row { display: flex; justify-content: space-between; align-items: center;
  padding: 7px 8px; border-radius: 6px; font-size: 11.5px; color: #94A3B8; cursor: pointer; }
.td-row:hover { background: rgba(56,189,248,.08); color: #CBD5E1; }
.td-row b { font-size: 13px; color: #64748B; }
.td-row b.hot { color: #FBBF24; }

.sc-foot { display: flex; justify-content: space-between; margin-top: 14px; padding-top: 10px;
  border-top: 1px solid rgba(56,189,248,.12); font-size: 10.5px; color: rgba(148,163,184,.55); }

/* ================== 我的工作台（任务 + 日程） ================== */
.kpi-grid-6 { grid-template-columns: repeat(6, 1fr); }
.kpi-grid-6 .kv { font-size: 23px; }
.kpi-red .kv { color: #DC2626; }
.kpi-amber .kv { color: #D97706; }
.kpi-green .kv { color: #059669; }
.wf-bars { display: flex; align-items: flex-end; gap: 3px; height: 22px; margin-top: 8px; }
.wf-bars i { flex: 1; background: linear-gradient(180deg, #93C5FD, #1B66C9); border-radius: 2px; min-height: 4px; }

.wb-layout { display: grid; grid-template-columns: 1fr 320px; gap: 16px; align-items: start; }
.wb-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.wb-filters { display: flex; gap: 8px; align-items: center; }
.wb-filters .input.sm { height: 30px; padding: 0 8px; font-size: 12.5px; width: auto; }
.seg { display: inline-flex; background: #F1F5F9; border-radius: 8px; padding: 3px; }
.seg button { border: 0; background: transparent; padding: 6px 14px; border-radius: 6px; font-size: 13px;
  color: var(--t3); cursor: pointer; font-weight: 500; }
.seg button.on { background: #fff; color: var(--brand); box-shadow: 0 1px 3px rgba(15,23,42,.1); font-weight: 600; }

/* 任务分组 */
.td-group { background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); margin-bottom: 14px; overflow: hidden; }
.td-gh { display: flex; align-items: center; gap: 8px; padding: 11px 16px; background: #FAFBFC;
  border-bottom: 1px solid var(--line); font-size: 12.5px; font-weight: 600; color: var(--t2); }
.td-gh em { font-style: normal; background: #E2E8F0; color: #475569; border-radius: 20px;
  padding: 1px 8px; font-size: 11px; font-weight: 600; }
.td-group.g-over .td-gh { color: #B91C1C; background: #FEF2F2; border-bottom-color: #FECACA; }
.td-group.g-over .td-gh em { background: #FEE2E2; color: #B91C1C; }
.td-group.g-today .td-gh { color: #B45309; background: #FFFBEB; border-bottom-color: #FDE68A; }
.td-group.g-today .td-gh em { background: #FEF3C7; color: #B45309; }
.td-group.g-done .td-gh { color: var(--t4); }

.td-item { display: flex; gap: 12px; padding: 13px 16px; border-bottom: 1px solid #F1F5F9; align-items: flex-start; }
.td-item:last-child { border-bottom: 0; }
.td-item:hover { background: #FCFDFE; }
.td-item.done { opacity: .55; }
.td-item.done .td-title { text-decoration: line-through; }
.td-chk { width: 19px; height: 19px; flex: 0 0 19px; margin-top: 2px; border-radius: 50%;
  border: 1.5px solid #CBD5E1; background: #fff; cursor: pointer; font-size: 11px; line-height: 1;
  color: #fff; display: flex; align-items: center; justify-content: center; transition: .15s; }
.td-chk:hover { border-color: var(--brand); background: var(--brand-bg); }
.td-item.done .td-chk { background: #10B981; border-color: #10B981; }
.td-body { flex: 1; min-width: 0; }
.td-title { font-size: 13.5px; font-weight: 600; color: var(--t1); display: flex; gap: 7px; align-items: center; flex-wrap: wrap; }
.td-sub { font-size: 12.5px; color: var(--t3); margin-top: 4px; line-height: 1.5; }
.td-meta { display: flex; gap: 14px; font-size: 11.5px; color: var(--t4); margin-top: 6px; align-items: center; }
.td-meta .ov { color: #DC2626; font-weight: 600; }
.td-meta a { color: var(--brand); text-decoration: none; }
.td-ops { display: flex; gap: 6px; flex: 0 0 auto; opacity: 0; transition: .15s; }
.td-item:hover .td-ops { opacity: 1; }
.btn.xs { height: 26px; padding: 0 9px; font-size: 11.5px; }
.btn.xs.danger { color: #DC2626; border-color: #FECACA; }
.btn.xs.danger:hover { background: #FEF2F2; }
.pri { font-size: 10.5px; padding: 1px 6px; border-radius: 4px; font-weight: 600; }
.pri.p-h { background: #FEE2E2; color: #B91C1C; }
.pri.p-m { background: #FEF3C7; color: #B45309; }
.pri.p-l { background: #E2E8F0; color: #475569; }
.ty { font-size: 11px; color: var(--t4); font-weight: 500; }
.auto-tag { font-size: 10px; padding: 1px 5px; border-radius: 3px; background: #EFF6FF;
  color: #1D4ED8; border: 1px solid #DBEAFE; font-weight: 600; }
.empty-box { background: #fff; border: 1px dashed var(--line); border-radius: var(--radius);
  padding: 46px; text-align: center; color: var(--t4); font-size: 13.5px; }
.empty-sm { color: var(--t4); font-size: 12.5px; padding: 12px 0; text-align: center; }

/* 侧栏分布条 */
.wb-bar { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; font-size: 12.5px; }
.wb-bar .lbl { flex: 0 0 66px; color: var(--t2); }
.wb-bar .track { flex: 1; height: 7px; background: #F1F5F9; border-radius: 4px; overflow: hidden; }
.wb-bar .fill { height: 100%; background: linear-gradient(90deg, #93C5FD, #1B66C9); border-radius: 4px; }
.wb-bar .num { flex: 0 0 26px; text-align: right; font-weight: 600; color: var(--t2); font-variant-numeric: tabular-nums; }
.wb-up { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px dashed #F1F5F9; }
.wb-up:last-child { border-bottom: 0; }
.wb-up .d { flex: 0 0 40px; text-align: center; font-size: 12px; font-weight: 700; color: var(--brand);
  background: var(--brand-bg); border-radius: 6px; padding: 4px 0; }
.wb-up .t { flex: 1; min-width: 0; }
.wb-up .t b { display: block; font-size: 12.5px; color: var(--t1); font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wb-up .t span { font-size: 11px; color: var(--t4); }

/* 日历 */
.cal-wrap { background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); padding: 14px; }
.cal-head { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 6px; }
.cal-head div { text-align: center; font-size: 11.5px; color: var(--t4); font-weight: 600; padding: 4px 0; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.cal-cell { min-height: 92px; border: 1px solid #F1F5F9; border-radius: 8px; padding: 6px; background: #FCFDFE; }
.cal-cell.empty { border: 0; background: transparent; }
.cal-cell.today { border-color: var(--brand); background: var(--brand-bg); }
.cal-d { font-size: 12px; font-weight: 600; color: var(--t3); margin-bottom: 4px; }
.cal-cell.today .cal-d { color: var(--brand); }
.cal-evs { display: flex; flex-direction: column; gap: 3px; }
.cal-ev { font-size: 10.5px; padding: 2px 5px; border-radius: 4px; color: #fff; cursor: default;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-more { font-size: 10px; color: var(--t4); padding-left: 4px; }
.k-task { background: #3B82F6; } .k-exam { background: #EF4444; } .k-due { background: #F59E0B; }
.k-meet { background: #8B5CF6; } .k-fest { background: #EC4899; } .k-work { background: #64748B; }
.cal-legend { display: flex; gap: 14px; align-items: center; margin-top: 12px; padding-top: 10px;
  border-top: 1px solid #F1F5F9; font-size: 11.5px; color: var(--t3); flex-wrap: wrap; }
.cal-legend i { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 4px; }
.cal-tip { margin-left: auto; color: var(--t4); font-size: 11px; }
.kdot { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 7px; }

/* ================== 报表中心 ================== */
.rp-sets { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-bottom: 16px; }
.rp-set { background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 13px 14px; text-align: left; cursor: pointer; transition: .16s; box-shadow: var(--shadow-sm); }
.rp-set:hover { border-color: #BFD4EE; transform: translateY(-1px); }
.rp-set.on { border-color: var(--brand); background: linear-gradient(180deg, #F5F9FF, #fff); box-shadow: 0 0 0 3px var(--brand-bg); }
.rp-set b { display: block; font-size: 13px; color: var(--t1); }
.rp-set.on b { color: var(--brand); }
.rp-set span { font-size: 11px; color: var(--t4); }
.rp-bar { display: flex; gap: 22px; align-items: flex-end; flex-wrap: wrap; }
.rp-f { display: flex; flex-direction: column; gap: 6px; }
.rp-f > label { font-size: 11.5px; color: var(--t4); font-weight: 500; }
.rp-f .input.sm { height: 30px; padding: 0 8px; font-size: 12.5px; min-width: 130px; }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chip { border: 1px solid var(--line); background: #fff; border-radius: 20px; padding: 4px 11px;
  font-size: 12px; color: var(--t3); cursor: pointer; transition: .15s; }
.chip:hover { border-color: #BFD4EE; color: var(--brand); }
.chip.on { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 500; }
.table th.num, .table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.table td.num.em { font-weight: 650; color: var(--brand); }
.table tfoot td { background: #FAFBFC; border-top: 2px solid #E2E8F0; padding: 11px 12px; }
.rp-ratio .track { height: 6px; background: #F1F5F9; border-radius: 3px; overflow: hidden; }
.rp-ratio .track i { display: block; height: 100%; background: linear-gradient(90deg, #93C5FD, #1B66C9); border-radius: 3px; }
.table-wrap { overflow-x: auto; }

/* ================== 数据管理 ================== */
.ent-card { transition: .16s; }
.ent-card:hover { box-shadow: var(--shadow); }
.ent-top { display: flex; gap: 11px; align-items: center; margin-bottom: 11px; }
.ent-ico { width: 34px; height: 34px; border-radius: 9px; background: var(--brand-bg); color: var(--brand);
  display: flex; align-items: center; justify-content: center; font-size: 15px; flex: 0 0 34px; }
.ent-nm { font-size: 13.5px; font-weight: 650; color: var(--t1); }
.ent-sub { font-size: 11.5px; color: var(--t4); }
.ent-cols { display: flex; gap: 5px; flex-wrap: wrap; margin-bottom: 12px; }
.ent-cols span { font-size: 10.5px; background: #F1F5F9; color: #64748B; padding: 2px 7px; border-radius: 4px; }
.ent-cols span.more { background: #EFF6FF; color: #1D4ED8; }
.ent-ops { display: flex; gap: 7px; }
.btn.sm { height: 30px; padding: 0 12px; font-size: 12.5px; }

.imp-drop { border: 1.5px dashed #CBD5E1; border-radius: 10px; padding: 30px; text-align: center;
  cursor: pointer; transition: .15s; background: #FCFDFE; }
.imp-drop:hover, .imp-drop.over { border-color: var(--brand); background: var(--brand-bg); }
.imp-ico { font-size: 26px; color: var(--brand); margin-bottom: 6px; }
.imp-hint { font-size: 11.5px; color: var(--t4); margin-top: 4px; }
.imp-file { font-size: 12.5px; color: var(--t2); background: #F1F5F9; padding: 8px 12px; border-radius: 7px; margin-bottom: 12px; }
.imp-map-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; max-height: 250px; overflow-y: auto; }
.imp-map-row { display: flex; align-items: center; gap: 8px; }
.imp-f { flex: 0 0 88px; font-size: 12px; color: var(--t3); font-family: var(--mono, monospace); }
.imp-arrow { color: var(--t4); font-size: 11px; }
.imp-map-row .input.sm { flex: 1; height: 28px; font-size: 12px; }
.imp-sum { display: flex; gap: 16px; align-items: center; margin-top: 14px; padding: 10px 14px;
  background: #FAFBFC; border-radius: 8px; font-size: 12.5px; }
.imp-sum .ok { color: #059669; font-weight: 600; }
.imp-sum .bad { color: #DC2626; font-weight: 600; }
.imp-sum .dup { color: #D97706; font-weight: 600; }
.imp-errs { margin-top: 8px; max-height: 110px; overflow-y: auto; font-size: 12px; color: #B91C1C;
  background: #FEF2F2; border: 1px solid #FECACA; border-radius: 8px; padding: 9px 12px; line-height: 1.7; }

/* ================== 组织与权限 ================== */
.rbac-layout { display: grid; grid-template-columns: 220px 1fr; gap: 16px; align-items: start; }
.rbac-roles { display: flex; flex-direction: column; gap: 9px; }
.rbac-role { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px;
  cursor: pointer; transition: .15s; box-shadow: var(--shadow-sm); position: relative; }
.rbac-role:hover { border-color: #BFD4EE; }
.rbac-role.on { border-color: var(--brand); background: linear-gradient(180deg, #F5F9FF, #fff); box-shadow: 0 0 0 3px var(--brand-bg); }
.rr-top { display: flex; align-items: center; gap: 6px; }
.rr-top b { font-size: 13px; color: var(--t1); }
.rbac-role.on .rr-top b { color: var(--brand); }
.sys-tag { font-size: 9.5px; background: #E2E8F0; color: #475569; padding: 1px 5px; border-radius: 3px; }
.rr-sub { font-size: 11.5px; color: var(--t3); margin-top: 5px; }
.rr-scope { font-size: 10.5px; color: var(--t4); margin-top: 2px; }
.rr-users { position: absolute; right: 11px; bottom: 10px; font-size: 10.5px; color: var(--brand); font-weight: 600; }

.perm-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.perm-group { border: 1px solid var(--line); border-radius: 9px; padding: 11px 13px; background: #FCFDFE; }
.pg-head { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.pg-head > span { font-size: 12px; font-weight: 650; color: var(--t1); flex: 1; }
.mini { border: 0; background: transparent; color: var(--brand); font-size: 10.5px; cursor: pointer; padding: 0 3px; }
.mini:hover { text-decoration: underline; }
.perm-item { display: flex; align-items: center; gap: 7px; padding: 4px 0; font-size: 12.5px; color: var(--t2); cursor: pointer; }
.perm-item input { accent-color: var(--brand); width: 14px; height: 14px; }
.perm-item em { font-style: normal; font-size: 10px; color: var(--t4); margin-left: auto; font-family: var(--mono, monospace); }
.perm-foot { display: flex; align-items: center; gap: 10px; justify-content: flex-end;
  margin-top: 14px; padding-top: 12px; border-top: 1px solid #F1F5F9; }
.perm-foot .muted { margin-right: auto; font-size: 12px; }
.tag-gray { background: #F1F5F9; color: #64748B; }
.tag-green { background: #DCFCE7; color: #15803D; }
.mono { font-family: var(--mono, ui-monospace, monospace); font-size: 12px; }

/* ============ 企业微信集成 ============ */
.wb-loading { padding: 60px; text-align: center; color: var(--t4); }
.wc-hero {
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 20px 24px; border-radius: var(--radius); margin-bottom: 16px;
  border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow-sm);
  position: relative; overflow: hidden;
}
.wc-hero::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: linear-gradient(180deg, #16A34A, #0EA5E9);
}
.wc-hero.mock::before { background: linear-gradient(180deg, #F59E0B, #F97316); }
.wc-hero-l { display: flex; align-items: center; gap: 14px; }
.wc-logo {
  width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center;
  font-size: 22px; color: #fff; flex: 0 0 auto;
  background: linear-gradient(135deg, #16A34A, #0D9488);
  box-shadow: 0 6px 16px rgba(22, 163, 74, .28);
}
.wc-hero.mock .wc-logo { background: linear-gradient(135deg, #F59E0B, #EA580C); box-shadow: 0 6px 16px rgba(245, 158, 11, .28); }
.wc-hero-t { font-size: 15px; font-weight: 700; color: var(--t1); }
.wc-hero-s { font-size: 12.5px; color: var(--t3); margin-top: 3px; max-width: 640px; line-height: 1.6; }
.wc-hero-r { display: flex; gap: 26px; flex: 0 0 auto; }
.wc-mini { text-align: center; }
.wc-mini b { display: block; font-size: 20px; font-weight: 700; color: var(--t1); font-variant-numeric: tabular-nums; }
.wc-mini span { font-size: 11.5px; color: var(--t4); }

.wc-tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.wc-tab {
  padding: 9px 16px; font-size: 13.5px; color: var(--t3); cursor: pointer;
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: all .15s;
}
.wc-tab:hover { color: var(--brand); }
.wc-tab.on { color: var(--brand); font-weight: 600; border-bottom-color: var(--brand); }

.wc-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: start; }
.wc-switch-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--line); }
label.sw { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--t2); cursor: pointer; }
.sw input { display: none; }
.sw span {
  width: 34px; height: 19px; border-radius: 10px; background: #CBD5E1; position: relative;
  transition: background .18s; flex: 0 0 auto;
}
.sw span::after {
  content: ''; position: absolute; left: 2px; top: 2px; width: 15px; height: 15px;
  border-radius: 50%; background: #fff; transition: transform .18s; box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.sw input:checked + span { background: var(--brand); }
.sw input:checked + span::after { transform: translateX(15px); }
.fg-hint { font-size: 11.5px; color: var(--t4); margin-top: 4px; }

.wc-qr-box { display: flex; gap: 28px; align-items: flex-start; }
.wc-qr { flex: 0 0 auto; }
.wc-qr-fake {
  width: 168px; height: 168px; border: 1px solid var(--line); border-radius: 12px;
  padding: 12px; background: #fff; display: flex; flex-direction: column; gap: 8px;
}
.wc-qr-grid { flex: 1; display: grid; grid-template-columns: repeat(11, 1fr); gap: 2px; }
.wc-qr-grid i { background: #F1F5F9; border-radius: 1px; }
.wc-qr-grid i.on { background: #0F172A; }
.wc-qr-tip { text-align: center; font-size: 10.5px; color: var(--t4); }
.wc-qr-side { flex: 1; }
.wc-step { display: flex; gap: 10px; font-size: 12.5px; color: var(--t2); margin-bottom: 10px; line-height: 1.6; }
.wc-step b {
  flex: 0 0 auto; width: 18px; height: 18px; border-radius: 50%; background: var(--brand-bg);
  color: var(--brand); font-size: 11px; display: grid; place-items: center; margin-top: 2px;
}
.wc-step code { background: #F1F5F9; padding: 1px 5px; border-radius: 4px; font-size: 11.5px; color: var(--brand-dark); }
.wc-code-out { margin-top: 10px; }
.wc-code { font-size: 12px; color: var(--t2); font-family: var(--mono, monospace); }
.wc-code-sub { font-size: 11px; color: var(--t4); word-break: break-all; margin-top: 4px; line-height: 1.5; }
.wc-save-bar { margin-top: 16px; display: flex; align-items: center; gap: 12px; }

.wc-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.wc-log-c { max-width: 420px; font-size: 12.5px; color: var(--t2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.tpl-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tpl {
  border: 1px solid var(--line); border-radius: 9px; padding: 12px; cursor: pointer;
  transition: all .15s; background: #fff;
}
.tpl:hover { border-color: var(--brand-light); background: var(--brand-bg); }
.tpl.on { border-color: var(--brand); background: var(--brand-bg); box-shadow: 0 0 0 3px rgba(27, 102, 201, .09); }
.tpl-n { font-size: 13px; font-weight: 600; color: var(--t1); margin-bottom: 6px; }
.tpl-m { display: flex; gap: 5px; }

.wc-phone {
  width: 300px; border-radius: 20px; background: #F1F5F9; padding: 10px;
  border: 1px solid var(--line); margin: 0 auto;
}
.wc-phone-bar { text-align: center; font-size: 11px; color: var(--t4); padding: 4px 0 8px; }
.wc-msg { background: #fff; border-radius: 10px; padding: 14px; box-shadow: var(--shadow-sm); }
.wc-msg-app {
  display: inline-block; font-size: 10.5px; color: #15803D; background: #DCFCE7;
  padding: 1px 7px; border-radius: 4px; margin-bottom: 8px;
}
.wc-msg-t { font-size: 13.5px; font-weight: 700; color: var(--t1); margin-bottom: 8px; }
.wc-msg-c { font-size: 12.5px; color: var(--t2); line-height: 1.75; white-space: pre-wrap; }
.wc-msg-f { margin-top: 12px; padding-top: 10px; border-top: 1px solid #F1F5F9; font-size: 12px; color: var(--brand); }

@media (max-width: 1180px) {
  .wc-grid2 { grid-template-columns: 1fr; }
  .wc-hero { flex-direction: column; align-items: flex-start; }
}

/* ============ 审批中心 ============ */
.ap-bar {
  display: flex; align-items: center; gap: 10px; margin-bottom: 12px;
  padding: 10px 12px; background: #F8FAFC; border: 1px solid var(--line); border-radius: 9px;
}
.ap-type {
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px;
  border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap;
}
.ap-sub { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ============ 考场编排与准考证 ============ */
.st-room-row { display: flex; flex-wrap: wrap; gap: 8px; }
.st-room {
  border: 1px solid var(--line); border-radius: 8px; padding: 8px 14px;
  background: #F8FAFC; min-width: 130px;
}
.st-room-no { font-weight: 700; font-size: 12.5px; color: var(--t1); }
.st-room-c { font-size: 11.5px; color: var(--t4); margin-top: 2px; }

/* 准考证（打印友好） */
.tk { border: 2px solid #0F172A; max-width: 660px; margin: 0 auto; background: #fff; color: #0F172A; }
.tk-head { text-align: center; padding: 16px 18px 10px; border-bottom: 2px solid #0F172A; }
.tk-title { font-size: 21px; font-weight: 800; letter-spacing: 5px; }
.tk-sub { font-size: 12px; color: #475569; margin-top: 5px; }
.tk-top { display: flex; gap: 16px; padding: 14px 18px; align-items: flex-start; }
.tk-photo {
  width: 88px; height: 112px; border: 1px dashed #94A3B8; border-radius: 4px;
  display: grid; place-items: center; font-size: 12px; color: #94A3B8; flex: 0 0 auto;
}
.tk-info { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 7px 20px; font-size: 12.5px; }
.tk-info span { color: #64748B; margin-right: 6px; }
.tk-table { width: 100%; border-collapse: collapse; font-size: 12px; margin: 0 18px; width: calc(100% - 36px); }
.tk-table th, .tk-table td { border: 1px solid #334155; padding: 5px 8px; text-align: center; }
.tk-table th { background: #F1F5F9; font-weight: 600; }
.tk-note {
  font-size: 11px; color: #475569; padding: 10px 18px; line-height: 1.7;
  border-top: 1px dashed #94A3B8; margin-top: 12px;
}
.tk-foot { text-align: right; font-size: 11px; color: #94A3B8; padding: 0 18px 10px; }

/* ============================================================
   学员端 UI v2 · 视觉升级层（渐变 Hero + 玻璃拟态 + 卡片质感）
   仅覆盖 portal（p-*）样式，不影响后台
   ============================================================ */

/* ---------- 整体画布：浅色渐变 + 顶部品牌光晕 ---------- */
.p-shell {
  background:
    radial-gradient(900px 320px at 15% -60px, rgba(27, 102, 201, .14), transparent 62%),
    radial-gradient(760px 300px at 88% -80px, rgba(124, 58, 237, .10), transparent 60%),
    linear-gradient(180deg, #F4F7FC 0%, #EEF2F8 42%, #F5F7FB 100%);
}
.p-main { max-width: 860px; gap: 16px; padding: 20px 16px 40px; }

/* ---------- 顶栏：玻璃拟态 ---------- */
.p-header {
  background: rgba(255, 255, 255, .72);
  backdrop-filter: blur(14px) saturate(1.4);
  -webkit-backdrop-filter: blur(14px) saturate(1.4);
  border-bottom: 1px solid rgba(15, 23, 42, .06);
  box-shadow: 0 6px 24px rgba(15, 23, 42, .05);
}
.p-brand-sm {
  background: linear-gradient(135deg, #1B66C9, #6D28D9);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 750;
}

/* ---------- 卡片：白瓷质感 + 入场动画 + hover 微浮 ---------- */
.p-card {
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, .055);
  background: linear-gradient(180deg, #FFFFFF 0%, #FDFEFF 100%);
  box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 10px 30px -12px rgba(15, 23, 42, .10);
  padding: 20px 22px;
  transition: transform .25s ease, box-shadow .25s ease;
  animation: pCardIn .45s cubic-bezier(.22, .8, .36, 1) both;
}
.p-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 4px rgba(15, 23, 42, .05), 0 18px 44px -14px rgba(27, 102, 201, .18);
}
@keyframes pCardIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.p-card:nth-child(2) { animation-delay: .05s; }
.p-card:nth-child(3) { animation-delay: .10s; }
.p-card:nth-child(4) { animation-delay: .15s; }
.p-card:nth-child(5) { animation-delay: .20s; }
.p-card:nth-child(6) { animation-delay: .25s; }

/* 卡片标题：渐变竖标 */
.p-card-h {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 750;
  letter-spacing: -.2px;
  color: #0F172A;
  margin-bottom: 14px;
}
.p-card-h::before {
  content: '';
  width: 4px;
  height: 15px;
  border-radius: 3px;
  background: linear-gradient(180deg, #1B66C9, #6D28D9);
  margin-right: 9px;
  flex: none;
}

/* ---------- 学员档案：深色渐变 Hero 卡 ---------- */
.p-profile {
  background:
    radial-gradient(500px 160px at 90% -40%, rgba(255, 255, 255, .16), transparent 60%),
    linear-gradient(120deg, #143E7B 0%, #1B66C9 46%, #6D28D9 120%);
  border: none;
  color: #fff;
  padding: 24px 26px;
  box-shadow: 0 14px 40px -12px rgba(27, 102, 201, .45);
}
.p-profile .p-avatar {
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(255, 255, 255, .35);
  color: #fff;
  backdrop-filter: blur(6px);
  width: 54px;
  height: 54px;
  font-size: 22px;
  border-radius: 16px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}
.p-profile .p-name { color: #fff; font-size: 19px; letter-spacing: -.3px; }
.p-profile .p-meta { color: rgba(255, 255, 255, .78); }
.p-profile .p-meta .dot { background: rgba(255, 255, 255, .5); }
.p-profile .p-stage {
  background: rgba(255, 255, 255, .18);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .35);
  backdrop-filter: blur(4px);
}
.p-profile .p-stage.ok { background: rgba(134, 239, 172, .25); border-color: rgba(134, 239, 172, .55); color: #D9FFE8; }

/* ---------- 主按钮：品牌渐变 ---------- */
.p-btn {
  background: linear-gradient(135deg, #1B66C9 0%, #2563EB 55%, #6D28D9 130%);
  box-shadow: 0 8px 20px -6px rgba(27, 102, 201, .45);
  border-radius: 12px;
  font-weight: 650;
  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.p-btn:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px -6px rgba(27, 102, 201, .55);
  filter: brightness(1.05);
}
.p-btn-grad {
  background: linear-gradient(120deg, #1B66C9 0%, #7C3AED 100%);
  box-shadow: 0 10px 26px -8px rgba(124, 58, 237, .5);
}
.p-btn-sm {
  background: #fff;
  color: #1B66C9;
  border: 1px solid #D6E4F5;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .06);
}
.p-btn-sm:hover:not(:disabled) { background: #EFF5FD; transform: translateY(-1px); }

/* ---------- 徽标 / chip ---------- */
.p-tag { border-radius: 999px; font-weight: 650; }
.p-tag.ok { background: linear-gradient(120deg, #DCFCE7, #D1FAE5); color: #15803D; }
.p-tag.warn { background: linear-gradient(120deg, #FEF3C7, #FDE8C0); color: #B45309; }

/* ---------- 考期卡：渐变描边强调 ---------- */
.p-term { border: 1px solid transparent; background:
  linear-gradient(#fff, #fff) padding-box,
  linear-gradient(120deg, rgba(27, 102, 201, .35), rgba(124, 58, 237, .28)) border-box; }
.p-term-badge.live { background: linear-gradient(120deg, #FEF3C7, #FDE8C0); color: #92400E; }

/* ---------- 院校平台入口卡 ---------- */
.p-sch-head { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; }
.p-sch-logo {
  width: 50px; height: 50px; border-radius: 14px; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1B66C9, #7C3AED);
  color: #fff; font-size: 21px; font-weight: 750;
  box-shadow: 0 8px 20px -6px rgba(27, 102, 201, .45);
}
.p-sch-name { font-size: 16px; font-weight: 750; color: #0F172A; letter-spacing: -.2px; }
.p-sch-url { font-size: 12.5px; color: #1B66C9; margin-top: 3px; word-break: break-all; }
.p-sch-path {
  background: linear-gradient(180deg, #F6F9FE, #FBFCFF);
  border: 1px dashed #C9DCF5;
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 14px;
}
.p-sch-path-t { font-size: 11.5px; font-weight: 700; color: #64748B; margin-bottom: 8px; letter-spacing: .3px; }
.p-sch-path-steps { display: flex; flex-wrap: wrap; gap: 6px; }
.p-step {
  display: inline-flex; align-items: center; gap: 6px;
  background: #fff; border: 1px solid #E2ECF8; border-radius: 999px;
  padding: 5px 12px 5px 6px; font-size: 12px; color: #334155;
  box-shadow: 0 1px 3px rgba(15, 23, 42, .05);
}
.p-step i {
  font-style: normal; width: 18px; height: 18px; border-radius: 50%; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1B66C9, #7C3AED);
  color: #fff; font-size: 10.5px; font-weight: 700;
}

/* ---------- 成绩表：数字更醒目 ---------- */
.p-card table tbody td { vertical-align: middle; }
.p-card table .p-tag { font-size: 11px; }

/* ---------- 报考记录 chip ---------- */
.p-chip {
  background: linear-gradient(180deg, #F6F9FE, #EFF5FD);
  border: 1px solid #E2ECF8;
  border-radius: 999px;
}

/* ---------- 登录页：光斑渐变背景 + 玻璃卡 ---------- */
.p-login-bg {
  background:
    radial-gradient(700px 420px at 12% 8%, rgba(27, 102, 201, .18), transparent 58%),
    radial-gradient(640px 400px at 90% 16%, rgba(124, 58, 237, .14), transparent 56%),
    radial-gradient(560px 420px at 50% 110%, rgba(14, 165, 164, .10), transparent 60%),
    linear-gradient(160deg, #F2F6FC 0%, #E9EEF7 100%);
}
.p-login-box {
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, .85);
  box-shadow: 0 24px 70px -18px rgba(15, 23, 42, .22), 0 2px 6px rgba(15, 23, 42, .05);
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  animation: pRise .5s cubic-bezier(.22, .8, .36, 1) both;
}
.p-logo {
  background: linear-gradient(135deg, #1B66C9, #7C3AED);
  box-shadow: 0 8px 20px -6px rgba(27, 102, 201, .5);
}
.p-input { border-radius: 12px; }

/* ============================================================
   学员端 UI v3 · Bento 非对称网格（Hero 通栏 + 双列错落卡片）
   仅覆盖 portal（p-*）样式，不影响后台
   ============================================================ */
.p-main {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  max-width: 1060px;
  align-items: start;
  gap: 18px;
}
.p-main > * { grid-column: 1 / -1; min-width: 0; }
.p-main > .p-profile { grid-column: 1 / -1; }
/* 第 77 轮：迈读式单列流首页，取消旧的 Bento 错落占位 */
.p-main > section:nth-child(2),
.p-main > section:nth-child(3),
.p-main > section:nth-child(4),
.p-main > section:nth-child(5),
.p-main > section:nth-child(6) { grid-column: 1 / -1; transform: none; }

/* 官方通知提示：渐变描边信息瓦片（不再通栏方块） */
.p-main > section:nth-child(5) {
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(135deg, rgba(27, 102, 201, .45), rgba(124, 58, 237, .35)) border-box;
  border: 1px solid transparent;
  border-radius: 18px;
  padding: 16px 18px;
}
.p-main > section:nth-child(5) > div { align-items: flex-start; line-height: 1.75; }

/* 考期卡：更醒目的独立视觉 */
.p-main > section:nth-child(2) { padding: 22px 24px; }

/* 窄屏回落单列 */
@media (max-width: 760px) {
  .p-main > section:nth-child(n) { grid-column: 1 / -1; transform: none; }
  .p-main > section:nth-child(n):hover { transform: translateY(-2px); }
}

/* ============================================================
   弹窗关闭按钮全局美化（圆形 ghost，hover 变红微转）
   ============================================================ */
.modal-x {
  width: 30px; height: 30px; border-radius: 50%;
  border: 1px solid var(--line); background: #F8FAFC; color: var(--t3);
  font-size: 13px; line-height: 1; cursor: pointer; flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all .16s ease; font-weight: 600;
}
.modal-x:hover {
  background: #FEF2F2; border-color: #FECACA; color: #DC2626;
  transform: rotate(90deg);
}
.modal-x:active { transform: rotate(90deg) scale(.92); }

/* ================= 代理端门户（agentp.js） ================= */
.btn-agent-entry { margin-top: 8px; background: linear-gradient(135deg, #0E9F6E, #0B815A); }
.btn-agent-entry:hover { filter: brightness(1.06); }
.ag-bg { background: linear-gradient(135deg, #ECFDF5 0%, #E6FAF0 45%, #E0F2FE 100%); }
.ag-logo { background: linear-gradient(135deg, #0E9F6E, #0B815A); }
.ag-tabs { max-width: 1060px; margin: 14px auto 0; padding: 0 16px; display: flex; gap: 6px; overflow-x: auto; }
.ag-tab {
  flex: 0 0 auto; padding: 9px 18px; border: 1px solid transparent; border-radius: 999px;
  background: #fff; color: #475569; font-size: 13px; font-weight: 600; cursor: pointer;
  transition: all .15s; box-shadow: 0 1px 2px rgba(15,23,42,.04);
}
.ag-tab:hover { color: #0B815A; border-color: #A7F3D0; }
.ag-tab.on { background: linear-gradient(135deg, #0E9F6E, #0B815A); color: #fff; box-shadow: 0 3px 8px rgba(14,159,110,.3); }
.ag-main { max-width: 1060px; }
.ag-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
@media (max-width: 760px) { .ag-kpis { grid-template-columns: repeat(2, 1fr); } }
.ag-kpi {
  background: #fff; border: 1px solid #EAF0F6; border-radius: 14px; padding: 14px 16px;
  box-shadow: 0 1px 3px rgba(15,23,42,.05);
}
.ag-kpi-l { font-size: 12px; color: #64748B; font-weight: 600; }
.ag-kpi-v { font-size: 22px; font-weight: 800; color: #0F172A; letter-spacing: -.4px; margin: 4px 0 2px; }
.ag-kpi-v.ag-amber { color: #D97706; }
.ag-kpi-v.ag-green { color: #0E9F6E; }
.ag-kpi-s { font-size: 11px; color: #94A3B8; }
.ag-tb { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 660px; }
.ag-tb th { text-align: left; font-size: 11.5px; color: #94A3B8; font-weight: 600; padding: 8px 10px; border-bottom: 1px solid #EEF2F6; white-space: nowrap; }
.ag-tb td { padding: 9px 10px; border-bottom: 1px solid #F4F7FA; color: #334155; vertical-align: top; white-space: nowrap; }
.ag-tb td div { white-space: normal; }
.ag-tb tbody tr:hover { background: #F8FBF9; }
/* 第 149 轮：代理端表格窄屏溢出修复——容器横向滚动，表格不再撑破卡片 */
.ag-tbwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 12px; }
.ag-empty { text-align: center; color: #94A3B8; font-size: 13px; padding: 28px 0; }
.ag-tip { font-size: 12px; color: #64748B; background: #F0FDF9; border: 1px solid #CCF3E3; border-radius: 10px; padding: 10px 14px; margin-top: 12px; line-height: 1.6; }
.ag-alert {
  background: linear-gradient(135deg, #FFFBEB, #FEF3C7); border: 1px solid #FDE68A; color: #92400E;
  border-radius: 12px; padding: 12px 16px; font-size: 13px; line-height: 1.6;
}
.ag-bar { display: flex; gap: 8px; margin-bottom: 12px; }
.ag-search { flex: 1; max-width: 340px; height: 38px; }
.ag-sumrow { font-size: 12.5px; color: #475569; background: #F8FAFC; border: 1px solid #EEF2F6; border-radius: 10px; padding: 8px 12px; margin-bottom: 10px; }
.ag-prog { width: 110px; height: 6px; background: #EEF2F6; border-radius: 4px; overflow: hidden; margin-bottom: 3px; }
.ag-prog i { display: block; height: 100%; background: linear-gradient(90deg, #0E9F6E, #34D399); border-radius: 4px; }
.ag-note { font-size: 13px; color: #334155; line-height: 1.9; background: #F8FAFC; border: 1px dashed #CBD5E1; border-radius: 10px; padding: 12px 16px; }
.ag-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 14px; margin-bottom: 12px; }
@media (max-width: 760px) { .ag-form { grid-template-columns: 1fr; } }
.ag-f label { display: block; font-size: 12px; font-weight: 600; color: #334155; margin-bottom: 5px; }
.ag-f .p-input { height: 38px; }
.ag-full { grid-column: 1 / -1; }
.ag-del {
  border: 1px solid #FECACA; background: #fff; color: #DC2626; border-radius: 8px;
  font-size: 12px; padding: 4px 10px; cursor: pointer;
}
.ag-del:hover { background: #FEF2F2; }

/* ================= 弹窗视觉升级（全局，2026-10-24） ================= */
.modal {
  border-radius: 18px; border: 1px solid rgba(226,232,240,.9);
  box-shadow: 0 24px 64px rgba(15,23,42,.18), 0 4px 16px rgba(15,23,42,.08);
}
@keyframes pop { from { transform: translateY(10px) scale(.97); opacity: 0 } }
.modal-head {
  padding: 20px 26px 16px; font-size: 17px; font-weight: 750; color: var(--t1);
  display: flex; align-items: center; gap: 10px; letter-spacing: -.2px;
  border-bottom: 1px solid #F1F5F9;
  background: linear-gradient(180deg, #FBFDFF, #FFFFFF);
  border-radius: 18px 18px 0 0;
}
.modal-head::before {
  content: ''; width: 4px; height: 17px; border-radius: 4px; flex: none;
  background: linear-gradient(180deg, var(--brand-light), var(--brand));
  box-shadow: 0 1px 4px rgba(27,102,201,.35);
}
.modal-head .modal-x { margin-left: auto; }
.modal-body { padding: 6px 26px 10px; }
.modal-foot {
  padding: 14px 26px 20px; gap: 10px; justify-content: flex-end;
  border-top: 1px solid #F1F5F9; background: #FCFDFE;
  border-radius: 0 0 18px 18px;
}
/* 表单：密度与一致性 */
.form-grid { gap: 14px 16px; }
.fg label { font-size: 12px; font-weight: 650; color: var(--t3); letter-spacing: .1px; }
.fg .input, .fg select {
  height: 38px; font-size: 13px; padding: 0 12px; border-radius: 9px;
  border: 1px solid #DBE3EE; background: #FBFCFE; color: var(--t1);
  transition: border-color .15s, box-shadow .15s, background .15s;
  box-shadow: 0 1px 2px rgba(15,23,42,.03);
}
.fg .input:hover, .fg select:hover { border-color: #B9C8DE; }
.fg .input:focus, .fg select:focus {
  border-color: var(--brand); background: #fff; outline: none;
  box-shadow: 0 0 0 3px rgba(27,102,201,.13);
}
.fg .input::placeholder { color: #A8B4C4; }
/* 弹窗底部按钮 */
.modal-foot .btn, .m-foot .btn { height: 36px; padding: 0 18px; border-radius: 10px; font-weight: 600; }
.modal-foot .btn-primary, .m-foot .btn-primary {
  background: linear-gradient(135deg, var(--brand-light), var(--brand));
  border: none; box-shadow: 0 4px 12px rgba(27,102,201,.28);
}
.modal-foot .btn-primary:hover, .m-foot .btn-primary:hover { filter: brightness(1.06); box-shadow: 0 6px 16px rgba(27,102,201,.34); }
/* 弹窗内空状态与提示文案 */
.modal .empty { padding: 24px 0; text-align: center; color: var(--t4); font-size: 12.5px; }
.modal .muted { line-height: 1.7; }

/* ================= 裸弹窗兜底（openModal 直塞 inner 的 35+ 弹窗，2026-10-24） ================= */
/* 无 modal-body 结构的弹窗统一给内边距 */
.modal:not(:has(.modal-body)) { padding: 20px 26px 20px; }
/* 标题：品牌竖条 + 分隔线 */
.m-title {
  display: flex; align-items: center; gap: 10px;
  font-size: 16.5px; font-weight: 750; color: var(--t1); letter-spacing: -.2px;
  padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px solid #F1F5F9;
}
.m-title::before {
  content: ''; width: 4px; height: 16px; border-radius: 4px; flex: none;
  background: linear-gradient(180deg, var(--brand-light), var(--brand));
  box-shadow: 0 1px 4px rgba(27,102,201,.35);
}
/* 底部按钮区：上分隔线 + 右对齐 */
.m-foot {
  display: flex; gap: 10px; justify-content: flex-end;
  margin-top: 18px; padding-top: 14px; border-top: 1px solid #F1F5F9;
}
/* 表单标签 */
.m-lab { display: block; font-size: 12px; font-weight: 650; color: var(--t3); margin: 0 0 4px; letter-spacing: .1px; }
/* .ipt 控件全家桶（原裸弹窗使用但从未定义，导致浏览器默认样式裸奔） */
.ipt {
  display: block; width: 100%; box-sizing: border-box;
  height: 38px; padding: 0 12px; font-size: 13px; font-family: inherit;
  border-radius: 9px; border: 1px solid #DBE3EE; background: #FBFCFE; color: var(--t1);
  box-shadow: 0 1px 2px rgba(15,23,42,.03);
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.ipt:hover { border-color: #B9C8DE; }
.ipt:focus { border-color: var(--brand); background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(27,102,201,.13); }
.ipt::placeholder { color: #A8B4C4; }
select.ipt { cursor: pointer; }
textarea.ipt { height: auto; min-height: 64px; padding: 9px 12px; line-height: 1.6; resize: vertical; }

/* ================= 第 43 轮：套餐管理 + 租户功能权限 ================= */
/* 顶栏套餐徽标（到期 ≤30 天橙色预警） */
.plat-chip.plan-urgent { background:#FFF7ED; color:#C2410C; border:1px solid #FED7AA; }
/* 套餐卡片 */
.plan-cards { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:14px; }
.plan-card { transition: box-shadow .2s, transform .2s; }
.plan-card:hover { box-shadow:0 8px 24px rgba(27,102,201,.12); transform:translateY(-2px); }
.plan-card.plan-off { opacity:.55; filter:grayscale(.4); }
.plan-price { font-size:13px; color:var(--t3); margin:2px 0 12px; }
.plan-price b { font-size:28px; color:var(--t1); font-weight:700; margin:0 2px; }
.plan-limits { display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; margin-bottom:12px; }
.plan-limits div { display:flex; justify-content:space-between; font-size:12.5px; padding-bottom:6px; border-bottom:1px dashed var(--line); }
.plan-limits span { color:var(--t3); }
.plan-limits b { color:var(--t1); }
.plan-perms { display:flex; flex-wrap:wrap; gap:5px; }
.plan-foot { display:flex; justify-content:space-between; align-items:center; margin-top:12px; padding-top:10px; border-top:1px solid var(--line); font-size:12.5px; color:var(--t3); }
/* 功能模块勾选矩阵 */
.perm-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(168px, 1fr)); gap:6px; }
.perm-cell { display:flex; align-items:center; gap:6px; padding:6px 9px; border:1px solid var(--line); border-radius:7px; font-size:12.5px; background:var(--bg2,#F8FAFC); cursor:pointer; user-select:none; }
.perm-cell span { white-space:nowrap; }
.perm-cell em { white-space:nowrap; max-width:64px; overflow:hidden; text-overflow:ellipsis; }
.perm-cell:hover { border-color:var(--primary,#1B66C9); }
.perm-cell input { accent-color:var(--primary,#1B66C9); margin:0; }
.perm-cell em { font-style:normal; margin-left:auto; font-size:10.5px; color:#15803D; background:#DCFCE7; border-radius:4px; padding:1px 5px; white-space:nowrap; }
.perm-cell em.ext { color:#9333EA; background:#F3E8FF; }
.perm-cell:not(:has(input)) { cursor:default; }
.perm-cell:not(:has(input)) em { color:var(--t3); background:transparent; }
/* 租户列表学员用量进度条 */
.quota-bar { width:72px; height:4px; background:var(--line,#E2E8F0); border-radius:2px; display:inline-block; vertical-align:middle; margin-left:6px; overflow:hidden; }
.quota-bar i { display:block; height:100%; border-radius:2px; }

/* ================= D18 移动端响应式（第 63~68 轮） ================= */
@media (max-width: 768px) {
  /* 侧栏收起为顶部横向滚动导航 */
  .sidebar { position: fixed; left: 0; right: 0; top: 0; bottom: auto; width: 100%; height: 52px;
    display: flex; align-items: center; overflow-x: auto; overflow-y: hidden; z-index: 50;
    -webkit-overflow-scrolling: touch; }
  .sidebar::-webkit-scrollbar { display: none; }
  .main, .content, #content { margin-left: 0 !important; margin-top: 52px !important; width: 100% !important; }
  /* 卡片与 KPI 网格单列 */
  .cards-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  /* 表格横向滚动不破版 */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table { min-width: 640px; }
  /* 弹窗全宽 */
  .modal-mask > div, .modal-box { width: calc(100vw - 24px) !important; max-width: 96vw !important;
    max-height: 88vh !important; }
  /* 页头按钮换行 */
  .page-head { flex-direction: column; align-items: flex-start !important; gap: 10px; }
  .page-head .btn { margin-top: 0; }
  /* 字号微调 */
  .page-title { font-size: 17px !important; }
}
@media (max-width: 420px) {
  .cards-grid { grid-template-columns: 1fr !important; }
}

/* ================= 第 76 轮 · 学生端高级皮肤（学习中心 Premium） ================= */
body.portal-mode {
  background:
    radial-gradient(1100px 480px at 50% -140px, rgba(45,91,255,.16), transparent 60%),
    radial-gradient(760px 400px at 100% 0%, rgba(124,58,237,.10), transparent 55%),
    linear-gradient(180deg, #F1F5FE 0%, #F6F8FC 340px, #F6F8FC 100%);
  font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft YaHei', sans-serif;
  -webkit-font-smoothing: antialiased;
}
.p-shell { max-width: 480px; margin: 0 auto; min-height: 100vh; }

/* ================= 第 179 轮 · 手机端横向溢出防护 =================
   现象：游客端/学员端页面在真机上「右边可以一直拉」，整页横向滚动。
   根因：多处内联 display:grid 容器只写了 gap（列宽 auto=max-content），
        任一宽内容（长标题、装修区块、双列卡）都会把隐含列撑到上千 px，
        再撑破 .p-shell（max-width:480）→ 整页横向溢出。
   做法：① grid 隐含列锁 minmax(0,1fr)（未显式声明列时才加，双列不受影响）
        ② 直接子项 min-width:0（否则 ellipsis/换行仍失效）
        ③ 兜底 body/shell 裁切，任何情况下不允许横向拖拽 */
body.portal-mode { overflow-x: hidden; }
body.portal-mode .p-shell { width: 100%; max-width: 480px; overflow-x: clip; }
body.portal-mode #pVisitorBody,
body.portal-mode .p-main,
body.portal-mode [style*="display:grid"]:not([style*="grid-template-columns"]) { grid-template-columns: minmax(0, 1fr); }
body.portal-mode #pVisitorBody > *,
body.portal-mode .p-main > *,
body.portal-mode [style*="display:grid"] > * { min-width: 0; }
body.portal-mode .p-card,
body.portal-mode .p-card > * { min-width: 0; max-width: 100%; }
.p-main { padding: 14px 14px 18px; display: grid; gap: 13px; align-content: start; }
/* 顶栏：深蓝紫渐变 + 玻璃 */
.p-header { background: linear-gradient(135deg, #1E3A8A 0%, var(--brand,#2D5BFF) 55%, #7C3AED 100%); border-radius: 0 0 26px 26px; box-shadow: 0 12px 30px rgba(30,58,138,.25); }
.p-header-in { max-width: 480px; margin: 0 auto; padding: 14px 18px; display: flex; align-items: center; justify-content: space-between; }
.p-brand-sm { color: #fff; display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 14.5px; letter-spacing: .5px; background: none; -webkit-text-fill-color: #fff; }
.p-logo.sm { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.4); }
.p-user { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.95); font-size: 13px; font-weight: 600; }
.p-logout { background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.4); color: #fff; border-radius: 999px; padding: 4px 14px; font-size: 12px; cursor: pointer; }
/* 卡片：悬浮玻璃卡 */
.p-card { background: rgba(255,255,255,.88); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.75); border-radius: 20px; padding: 16px 16px 13px; box-shadow: 0 10px 34px rgba(23,35,61,.07), 0 2px 6px rgba(23,35,61,.04); }
.p-card-h { font-size: 15px; font-weight: 800; color: #17233D; display: flex; align-items: center; gap: 8px; margin-bottom: 10px; letter-spacing: .2px; }
.p-card-h::before { content: ''; width: 4px; height: 15px; border-radius: 3px; background: linear-gradient(180deg, var(--brand,#2D5BFF), #7C3AED); flex: none; }
/* 个人卡：品牌渐变英雄卡 */
.p-profile { display: flex; align-items: center; gap: 14px; background: linear-gradient(135deg, #1E3A8A 0%, var(--brand,#2D5BFF) 60%, #7C3AED 100%); border: none; color: #fff; box-shadow: 0 16px 36px rgba(45,91,255,.28); }
.p-avatar { width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.18); border: 2px solid rgba(255,255,255,.5); font-size: 21px; font-weight: 800; display: flex; align-items: center; justify-content: center; color: #fff; }
.p-name { font-size: 17px; font-weight: 800; color: #fff; }
.p-meta { color: rgba(255,255,255,.78); font-size: 11.5px; display: flex; gap: 6px; align-items: center; margin-top: 3px; flex-wrap: wrap; }
.p-meta .dot { background: rgba(255,255,255,.45); }
.p-stage { background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.45); color: #fff; border-radius: 999px; padding: 4px 12px; font-size: 11.5px; font-weight: 700; }
.p-stage.ok { background: #fff; color: var(--brand,#2D5BFF); }
/* 考期卡：招生绿英雄卡 */
.p-term { background: linear-gradient(135deg, #059669 0%, #10B981 100%); border: none; color: #fff; box-shadow: 0 16px 36px rgba(5,150,105,.24); }
.p-term-name, .p-term-date { color: #fff; }
.p-term-date { color: rgba(255,255,255,.8); }
.p-term-badge { background: rgba(255,255,255,.22); color: #fff; }
.p-term-badge.live { background: #fff; color: #059669; animation: pPulse 2s infinite; }
@keyframes pPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(255,255,255,.55); } 50% { box-shadow: 0 0 0 7px rgba(255,255,255,0); } }
.p-term-step { color: rgba(255,255,255,.88); }
.p-term .p-btn { background: #fff; color: #059669; box-shadow: 0 6px 16px rgba(0,0,0,.12); }
/* 按钮：品牌渐变 */
.p-btn { background: linear-gradient(135deg, var(--brand,#2D5BFF), #6D4AFF); color: #fff; border: 0; border-radius: 12px; font-weight: 700; box-shadow: 0 6px 16px rgba(45,91,255,.22); }
.p-btn-block { padding: 12px; font-size: 14.5px; }
.p-btn-sm { border-radius: 10px; }
/* 金刚区渐变瓷砖 */
.p-gi { text-align: center; cursor: pointer; }
.p-gi span { display: inline-flex; width: 46px; height: 46px; border-radius: 15px; background: linear-gradient(135deg, #EEF2FF, #F5F3FF); border: 1px solid rgba(45,91,255,.08); font-size: 21px; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(45,91,255,.09); transition: transform .15s; }
.p-gi:active span { transform: scale(.9); }
.p-gi div { font-size: 11.5px; margin-top: 5px; font-weight: 600; color: #334155; }
/* 标签 / 记录行 / chips */
.p-tag { border-radius: 999px; font-weight: 600; }
.p-reg { border: 1px solid #EEF1F7; border-radius: 14px; padding: 11px 12px; margin-top: 8px; background: #FBFCFE; }
.p-reg-no { color: var(--brand,#2D5BFF); }
.p-chip { background: #EEF2FF; color: #4338CA; border-radius: 999px; }
.p-empty { color: #9AA6BC; }
.p-foot { text-align: center; font-size: 11px; color: #A5AFC2; padding: 12px 0 4px; }
/* 底部 Tab：悬浮玻璃胶囊 */
.p-tabbar { position: sticky; bottom: 10px; display: flex; max-width: 440px; margin: 4px auto 10px; background: rgba(255,255,255,.93); backdrop-filter: blur(14px); border: 1px solid rgba(255,255,255,.85); border-radius: 22px; box-shadow: 0 14px 38px rgba(23,35,61,.16); z-index: 30; overflow: hidden; }
.p-tab { flex: 1; text-align: center; padding: 8px 0 9px; cursor: pointer; border-top: 2px solid transparent; }
.p-tab.on { border-top-color: var(--brand,#2D5BFF); background: linear-gradient(180deg, rgba(45,91,255,.07), transparent); }
.p-tabi { font-size: 19px; }
.p-tabl { font-size: 10.5px; margin-top: 1px; color: #94A3B8; font-weight: 500; }
.p-tab.on .p-tabl { color: var(--brand,#2D5BFF); font-weight: 800; }

/* 第 83 轮：装修组件进场动画 */
@keyframes pbAnim-fade{from{opacity:0}to{opacity:1}}
@keyframes pbAnim-slideL{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:none}}
@keyframes pbAnim-slideR{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
@keyframes pbAnim-zoom{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}

/* 第 91 轮：组件级无边框模式 + 图标大小 */
/* 第 92 轮：无边框模式强化 —— 组件内部任意元素（含 span/label 等）的边框与投影一并去除 */
.pb-noline, .pb-noline * { border-color: transparent !important; box-shadow: none !important; }
/* 第 92 轮：装修页占宽栅格 —— half/third 在学员端真实生效（默认整行） */
.pg-deco-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.pg-deco-grid > * { grid-column: 1 / -1; min-width: 0; }
.pg-deco-grid > .pb-w-half { grid-column: span 3; }
.pg-deco-grid > .pb-w-two3 { grid-column: span 4; }
.pg-deco-grid > .pb-w-third { grid-column: span 2; }
/* 第 113 轮：数字自定义宽度（pw）→ 6 列栅格 span 档；网格内中和内联 width 由 span 精确控宽 */
.pg-deco-grid > .pb-w-s1 { grid-column: span 1; }
.pg-deco-grid > .pb-w-s2 { grid-column: span 2; }
.pg-deco-grid > .pb-w-s3 { grid-column: span 3; }
.pg-deco-grid > .pb-w-s4 { grid-column: span 4; }
.pg-deco-grid > .pb-w-s5 { grid-column: span 5; }
.pg-deco-grid > .pb-b { width: auto !important; }
@media (max-width: 400px) {
  .pg-deco-grid > .pb-w-half, .pg-deco-grid > .pb-w-two3, .pg-deco-grid > .pb-w-third,
  .pg-deco-grid > .pb-w-s1, .pg-deco-grid > .pb-w-s2, .pg-deco-grid > .pb-w-s3, .pg-deco-grid > .pb-w-s4, .pg-deco-grid > .pb-w-s5 { grid-column: 1 / -1; }
}
[style*="--pbisz"] svg { width: var(--pbisz) !important; height: var(--pbisz) !important; }

/* 第 94 轮：菜单大类折叠 + 考试业务子分组 */
.nav-group-fold { display: flex; justify-content: space-between; align-items: center; cursor: pointer; user-select: none; border-radius: 8px; transition: background .15s; }
.nav-group-fold:hover { background: rgba(255,255,255,.06); }
.nav-group-fold .fold-arrow { font-size: 9px; opacity: .5; }
.nav-sub { font-size: 10.5px; color: #9AA8B6; padding: 7px 10px 3px 12px; letter-spacing: .5px; font-weight: 600; }

/* 第 98 轮：对账单等 fixed 打印容器 —— 打印时转静态全量输出（修复导出 PDF 空白） */
/* 第 99 轮补：@page 统一页边距 14mm —— statement 屏幕固定 794px（A4 整宽），
   若无页边距则两侧文字被裁（用户反馈「两边还有字都没有」） */
@media print {
  @page { size: A4 portrait; margin: 14mm; }
  body.printing-statement * { visibility: hidden !important; }
  body.printing-statement .print-fixed-wrap, body.printing-statement .print-fixed-wrap * { visibility: visible !important; }
  /* 关键：visibility:hidden 仍占文档流 → 对账单会被排到后台主界面之后（首页全空）。
     把 wrap 以外的 body 直接子元素 display:none 彻底移出文档流 */
  body.printing-statement > :not(.print-fixed-wrap) { display: none !important; }
  body.printing-statement { margin: 0 !important; padding: 0 !important; background: #fff !important; }
  /* 遮罩层：从 fixed+grid 居中降级为普通文档流（grid 垂直居中会把对账单推到页面中部/第二页底部） */
  body.printing-statement .modal-mask {
    position: static !important; display: block !important; inset: auto !important;
    background: #fff !important; backdrop-filter: none !important;
    padding: 0 !important; margin: 0 !important; overflow: visible !important; z-index: auto !important;
  }
  body.printing-statement .print-fixed-wrap { position: static !important; overflow: visible !important; background: #fff !important; padding: 0 !important; margin: 0 !important; inset: auto !important; }
  body.printing-statement .print-fixed-wrap .modal {
    box-shadow: none !important; border: none !important; border-radius: 0 !important;
    max-height: none !important; width: 100% !important; max-width: none !important;
    animation: none !important; display: block !important;
  }
  body.printing-statement .print-fixed-wrap .modal-head,
  body.printing-statement .print-fixed-wrap .modal-foot,
  body.printing-statement .print-fixed-wrap .no-print { display: none !important; }
  body.printing-statement .print-fixed-wrap .modal-body { padding: 0 !important; overflow: visible !important; max-height: none !important; }
  body.printing-statement .statement {
    box-shadow: none !important; margin: 0 auto !important;
    /* 第 99 轮补丁2：按标准 A4 物理尺寸排版——内容宽 = 210mm − 2×14mm 页边距 = 182mm，
       用 mm 物理单位定死，不依赖浏览器视口实现，任何打印机下都是标准 A4 版式 */
    width: 182mm !important; min-width: 0 !important; max-width: none !important;
    min-height: auto !important; padding: 0 !important; border: none !important;
  }
  /* 内部元素禁止撑破页宽：flex/grid/表格全部收缩到内容区 */
  body.printing-statement .statement * { box-sizing: border-box !important; max-width: 100% !important; }
  body.printing-statement .statement .st-table { table-layout: auto !important; width: 100% !important; }
}

/* ================= 第 98 轮 · 抽屉视觉升级（与弹窗同标准） ================= */
.drawer {
  width: 660px; border-radius: 0; border-left: 1px solid rgba(226,232,240,.9);
  box-shadow: -24px 0 64px rgba(15,23,42,.16), -4px 0 16px rgba(15,23,42,.06);
  animation: drawerin .26s cubic-bezier(.2,.8,.2,1);
}
@keyframes drawerin { from { transform: translateX(60px); opacity: 0 } }
.drawer-mask { background: rgba(15,23,42,.48); backdrop-filter: blur(3px); }
.drawer-head {
  padding: 18px 24px 15px; font-size: 16.5px; font-weight: 750; color: var(--t1);
  letter-spacing: -.2px; border-bottom: 1px solid #F1F5F9;
  background: linear-gradient(180deg, #FBFDFF, #FFFFFF);
  position: relative;
}
.drawer-head::before {
  content: ''; width: 4px; height: 16px; border-radius: 4px; flex: none; margin-right: 2px;
  background: linear-gradient(180deg, var(--brand-light), var(--brand));
  box-shadow: 0 1px 4px rgba(27,102,201,.35);
}
.drawer-head h3, .drawer-head .dh-title { margin: 0; }
.drawer-body { padding: 20px 24px; background: #FBFCFE; }
.drawer-foot {
  padding: 14px 24px 18px; gap: 10px; justify-content: flex-end;
  border-top: 1px solid #F1F5F9; background: #FCFDFE;
}
.drawer-foot .btn { height: 36px; padding: 0 18px; border-radius: 10px; font-weight: 600; }
.drawer-foot .btn-primary {
  background: linear-gradient(135deg, var(--brand-light), var(--brand));
  border: none; box-shadow: 0 4px 12px rgba(27,102,201,.28);
}
.drawer-foot .btn-primary:hover { filter: brightness(1.06); box-shadow: 0 6px 16px rgba(27,102,201,.34); }
/* 抽屉内表单控件与弹窗统一 */
.drawer .fg label, .drawer .m-lab { font-size: 12px; font-weight: 650; color: var(--t3); }
.drawer .fg .input, .drawer .ipt, .drawer select {
  height: 38px; font-size: 13px; border-radius: 9px; border: 1px solid #DBE3EE;
  background: #FBFCFE; box-shadow: 0 1px 2px rgba(15,23,42,.03); transition: all .15s;
}
.drawer .fg .input:focus, .drawer .ipt:focus { border-color: var(--brand); background: #fff; outline: none; box-shadow: 0 0 0 3px rgba(27,102,201,.13); }

/* ================= 第 108 轮：装修组件精致化层（作用域 .pb-b，后台预览 + 学员端同时生效） ================= */
.pb-b { position: relative; }
/* 白卡统一高级投影（两层柔光）+ 悬浮上浮微交互 */
.pb-b [style*="background:#fff"] {
  box-shadow: 0 1px 2px rgba(15,23,42,.04), 0 12px 32px -16px rgba(15,23,42,.16) !important;
  transition: transform .28s cubic-bezier(.2,.7,.3,1), box-shadow .28s cubic-bezier(.2,.7,.3,1);
}
.pb-b [style*="background:#fff"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 2px 6px rgba(15,23,42,.06), 0 20px 48px -16px rgba(15,23,42,.22) !important;
}
/* 玻璃拟态卡：彩色柔光投影 */
.pb-b [style*="backdrop-filter"] { box-shadow: 0 10px 36px -10px rgba(30,58,138,.28) !important; }
/* 模块标题：渐变装饰条（命中各组件统一的 head 模板） */
.pb-b div[style*="font-weight:800;margin-bottom:8px"] { position: relative; padding-left: 13px !important; }
.pb-b div[style*="font-weight:800;margin-bottom:8px"]::before {
  content: ''; position: absolute; left: 0; top: 3px; bottom: 3px; width: 4px; border-radius: 4px;
  background: linear-gradient(180deg, #4F6BF6, #8B5CF6); box-shadow: 0 2px 6px rgba(79,107,246,.35);
}
/* 链接交互：按压反馈 + 取消点按高亮 */
.pb-b a { -webkit-tap-highlight-color: transparent; transition: transform .18s ease, opacity .18s ease; }
.pb-b a:active { transform: scale(.98); opacity: .92; }
/* 图片：跟随卡片圆角、防溢出 */
.pb-b img { max-width: 100%; }
/* 胶囊标签：细微描边提精致 */
.pb-b [style*="border-radius:999px"][style*="background:#FFF7ED"], 
.pb-b [style*="border-radius:999px"][style*="background:#EEF2FF"],
.pb-b [style*="border-radius:999px"][style*="background:#FEF2F2"] {
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.05);
}
/* 价格数字：更醒目的字重与字距 */
.pb-b b[style*="color:#DC2626"] { letter-spacing: -.2px; }
/* 编辑器缩略图中的包裹层重置（避免投影叠加） */
.pgThumb .pb-b [style*="background:#fff"], .pgThumb .pb-b [style*="backdrop-filter"],
div[style*="pointer-events:none"] .pb-b [style*="background:#fff"],
div[style*="pointer-events:none"] .pb-b [style*="backdrop-filter"] {
  box-shadow: 0 1px 3px rgba(15,23,42,.08) !important; transform: none !important;
}

/* ---- 第 110 轮：学员端现代操作芯片（替代大渐变按钮，浅色/深色主题均适配） ---- */
.p-chip {
  font-size: 12px; font-weight: 600; padding: 5px 14px; border-radius: 9px;
  border: 1px solid rgba(45,91,255,.30); background: rgba(45,91,255,.06); color: #2D5BFF;
  cursor: pointer; white-space: nowrap; transition: background .18s, transform .18s, box-shadow .18s;
  -webkit-tap-highlight-color: transparent;
}
.p-chip:hover { background: rgba(45,91,255,.13); box-shadow: 0 3px 10px rgba(45,91,255,.16); }
.p-chip:active { transform: scale(.96); }
.p-chip.danger { border-color: rgba(220,38,38,.32); background: rgba(220,38,38,.05); color: #DC2626; }
.p-chip.ok { border-color: rgba(22,163,74,.32); background: rgba(22,163,74,.06); color: #16A34A; }

/* ===== 第 117 轮：豆包参考 UI 一比一复刻（暖橙设计体系 · 学员端专属） ===== */
/* ===== 第 119 轮：学员端主题模板（6 套）—— o 调色板全部变量化，data-otheme 一键切换 ===== */
:root, [data-otheme="orange"] {
  --ob1: #F97316; --ob2: #FB8C1A; --ob3: #FBA53C; --oacc: #EA580C; --osft: #FDBA74;
  --otrk: #F3E4D3; --olin: #FBF1E5; --osbg: #FFF4E9; --omut: #B45309; --oshell: #FAF3EA;
  --oshadow: rgba(234, 88, 12, .28);
}
[data-otheme="blue"] {
  --ob1: #2D5BFF; --ob2: #3D6CFF; --ob3: #7C97FF; --oacc: #1D4ED8; --osft: #93B0FF;
  --otrk: #E3E9FB; --olin: #EDF1FA; --osbg: #EEF3FF; --omut: #3B55C4; --oshell: #F4F6FE;
  --oshadow: rgba(45, 91, 255, .28);
}
[data-otheme="green"] {
  --ob1: #059669; --ob2: #10B981; --ob3: #34D399; --oacc: #047857; --osft: #6EE7B7;
  --otrk: #D7F0E4; --olin: #E8F6EF; --osbg: #E9FAF2; --omut: #0F766E; --oshell: #F0FAF5;
  --oshadow: rgba(5, 150, 105, .28);
}
[data-otheme="purple"] {
  --ob1: #7C3AED; --ob2: #8B5CF6; --ob3: #A78BFA; --oacc: #6D28D9; --osft: #C4B5FD;
  --otrk: #E9E3F8; --olin: #F1EDFA; --osbg: #F5F1FE; --omut: #5B21B6; --oshell: #F7F4FE;
  --oshadow: rgba(124, 58, 237, .28);
}
[data-otheme="pink"] {
  --ob1: #DB2777; --ob2: #EC4899; --ob3: #F472B6; --oacc: #BE185D; --osft: #F9A8D4;
  --otrk: #F8E3EE; --olin: #FBEDF5; --osbg: #FDF1F7; --omut: #9D174D; --oshell: #FDF4F9;
  --oshadow: rgba(219, 39, 119, .28);
}
[data-otheme="gold"] {
  --ob1: #1E293B; --ob2: #334155; --ob3: #475569; --oacc: #B45309; --osft: #D9B36C;
  --otrk: #EAE4D8; --olin: #F0EAE0; --osbg: #F7F1E4; --omut: #8A6A1F; --oshell: #F5F2EB;
  --oshadow: rgba(30, 41, 59, .32);
}
.p-shell { background: var(--oshell) !important; }
.p-header { background: linear-gradient(140deg, var(--ob1), var(--ob2) 70%, var(--ob3)); border-bottom: none; box-shadow: none; }
.p-header::after { content: ''; display: block; height: 6px; background: linear-gradient(180deg, var(--oshadow), transparent); }
.p-brand-sm { color: #fff !important; }
.p-brand-sm .p-logo { box-shadow: 0 2px 10px rgba(124,45,18,.3); }
.p-user { color: rgba(255,255,255,.92) !important; }
.p-logout { background: rgba(255,255,255,.2) !important; color: #fff !important; border: 1px solid rgba(255,255,255,.45) !important; }
.p-main { position: relative; }
.p-main > *:first-child { margin-top: -10px; }
.p-card { border-radius: 20px !important; box-shadow: 0 6px 22px rgba(154,52,18,.06), 0 1px 3px rgba(154,52,18,.04) !important; }
/* —— 通用组件 —— */
.o-hero { position: relative; overflow: hidden; border-radius: 22px; padding: 17px 16px; color: #fff; background: linear-gradient(135deg, var(--ob1), var(--ob2)); box-shadow: 0 10px 26px var(--oshadow); }
.o-hero .o-orb1 { position: absolute; right: -46px; top: -52px; width: 158px; height: 158px; border-radius: 50%; background: rgba(255,255,255,.14); }
.o-hero .o-orb2 { position: absolute; right: 30px; bottom: -64px; width: 118px; height: 118px; border-radius: 50%; background: rgba(255,255,255,.09); }
.o-sec { font-size: 16px; font-weight: 800; color: #1F2937; display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.o-sec::before { content: ''; width: 5px; height: 17px; border-radius: 3px; background: linear-gradient(180deg, var(--ob1), var(--osft)); }
.o-stat4 { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; }
.o-stat4 > div { position: relative; }
.o-stat4 > div + div::before { content: ''; position: absolute; left: 0; top: 18%; bottom: 18%; width: 1px; background: #F3E8DC; }
.o-stat4 b { display: block; font-size: 23px; font-weight: 900; color: #1F2937; letter-spacing: -.5px; }
.o-stat4 b small { font-size: 12px; font-weight: 700; }
.o-stat4 span { font-size: 11px; color: #9CA3AF; margin-top: 2px; display: block; }
.o-grid4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px 4px; }
.o-gi { text-align: center; cursor: pointer; }
.o-gi:active { transform: scale(.94); }
.o-gi .o-ico { display: inline-flex; width: 46px; height: 46px; border-radius: 15px; align-items: center; justify-content: center; color: #fff; box-shadow: 0 5px 13px var(--osh, var(--oshadow)); }
.o-gi .o-lbl { font-size: 12px; color: #4B5563; margin-top: 6px; font-weight: 600; }
.o-btn { display: block; width: 100%; border: none; border-radius: 999px; padding: 13px; font-size: 15.5px; font-weight: 800; letter-spacing: 4px; color: #fff; background: linear-gradient(135deg, var(--ob1), var(--ob2)); box-shadow: 0 8px 20px var(--oshadow); cursor: pointer; }
.o-btn:active { opacity: .88; }
.o-btn.ghost { background: #fff; color: var(--oacc); border: 1.5px solid var(--osft); box-shadow: none; }
.o-chip { display: inline-block; background: var(--osbg); color: var(--oacc); border-radius: 999px; padding: 4px 13px; font-size: 12px; font-weight: 600; }
.o-chip.ok { background: #ECFDF5; color: #059669; }
.o-chip.wait { background: #FFF7E6; color: #D97706; }
.o-chip.idle { background: #F1F5F9; color: #64748B; }
.o-pill-btn { border: 1.5px solid var(--osft); color: var(--oacc); background: #fff; border-radius: 999px; padding: 6px 18px; font-size: 13px; font-weight: 700; cursor: pointer; }
.o-pill-btn.solid { background: linear-gradient(135deg, var(--ob1), var(--ob2)); color: #fff; border: none; box-shadow: 0 4px 12px var(--oshadow); }
/* 步骤条：上标签-数字圆点-下标签 */
.o-steps { display: grid; grid-template-columns: repeat(4, 1fr); position: relative; text-align: center; }
.o-steps .o-sline { position: absolute; top: 21px; left: 12.5%; right: 12.5%; height: 3px; border-radius: 2px; background: var(--otrk); }
.o-steps .o-sline i { display: block; height: 100%; border-radius: 2px; background: linear-gradient(90deg, var(--ob1), var(--osft)); }
.o-st .o-dot { width: 26px; height: 26px; border-radius: 50%; margin: 8px auto; display: flex; align-items: center; justify-content: center; font-size: 12.5px; font-weight: 800; position: relative; z-index: 1; background: #fff; border: 2px solid var(--otrk); color: #CBD5E1; }
.o-st.done .o-dot { background: linear-gradient(135deg, var(--ob1), var(--ob2)); border-color: transparent; color: #fff; box-shadow: 0 4px 10px var(--oshadow); }
.o-st.doing .o-dot { border-color: var(--ob1); color: var(--ob1); }
.o-st .o-t1 { font-size: 11.5px; font-weight: 700; color: #6B7280; }
.o-st.done .o-t1 { color: var(--oacc); }
.o-st .o-t2 { font-size: 10.5px; margin-top: 2px; color: #9CA3AF; }
/* 列表行卡 */
.o-row { display: flex; align-items: center; gap: 12px; padding: 12px 2px; border-bottom: 1px solid var(--olin); }
.o-row:last-child { border-bottom: none; }
.o-row .o-rico { width: 44px; height: 44px; border-radius: 13px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; background: var(--osbg); color: var(--ob1); }
.o-row .o-rmain { flex: 1; min-width: 0; }
.o-row .o-rt { font-size: 13.5px; font-weight: 700; color: #1F2937; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.o-row .o-rs { font-size: 11.5px; color: #9CA3AF; margin-top: 3px; }
.o-money { color: var(--oacc); font-weight: 900; font-size: 15px; }
/* 双列 bento */
.o-bento { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.o-bento .span2 { grid-column: span 2; }
.o-tile { background: #fff; border-radius: 20px; padding: 15px; box-shadow: 0 6px 22px rgba(154,52,18,.06); }
.o-mini-ring { display: flex; align-items: center; }

/* ===== 第 118 轮：对标豆包「我的」页结构 —— 渐变用户卡+内嵌白统计 / 四列宫格 / 待办卡 / 设置列表组 ===== */
.o-usercard { position: relative; overflow: hidden; border-radius: 22px; padding: 18px 16px 14px; color: #fff;
  background: linear-gradient(140deg, var(--ob1) 0%, var(--ob2) 55%, var(--ob3) 100%); box-shadow: 0 12px 28px var(--oshadow); }
.o-usercard .o-orb1 { position: absolute; right: -46px; top: -52px; width: 158px; height: 158px; border-radius: 50%; background: rgba(255,255,255,.14); }
.o-usercard .o-orb2 { position: absolute; right: 34px; bottom: 30px; width: 96px; height: 96px; border-radius: 50%; background: rgba(255,255,255,.09); }
.o-usercard .o-uava { width: 58px; height: 58px; border-radius: 50%; background: rgba(255,255,255,.28); border: 2.5px solid rgba(255,255,255,.75);
  display: flex; align-items: center; justify-content: center; font-size: 23px; font-weight: 800; flex-shrink: 0; box-shadow: 0 4px 12px rgba(154,52,18,.25); }
.o-usercard .o-uverify { width: 21px; height: 21px; border-radius: 50%; background: rgba(255,255,255,.95); color: var(--ob1);
  display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(154,52,18,.28); flex-shrink: 0; }
.o-upanel { position: relative; margin-top: 15px; background: #fff; border-radius: 16px; padding: 14px 6px 12px; box-shadow: 0 8px 20px rgba(154,52,18,.12); }
.o-upanel .o-stat4 b { font-size: 21px; color: #111827; }
.o-upanel .o-stat4 > div + div::before { background: #F1E7DB; }
/* 宫格（豆包式：彩色线性图标 + 浅色底圆角方块） */
.o-gi.soft .o-ico { width: 47px; height: 47px; border-radius: 15px; background: var(--osbg, var(--osbg)); color: var(--osc, var(--ob1)); box-shadow: none; }
.o-gi.soft .o-lbl { color: #374151; font-weight: 700; }
.o-gi.soft:active { opacity: .8; }
/* 设置列表组 */
.o-setrow { display: flex; align-items: center; gap: 12px; padding: 13px 2px; border-bottom: 1px solid var(--olin); cursor: pointer; }
.o-setrow:last-child { border-bottom: none; }
.o-setrow:active { opacity: .75; }
.o-setrow .o-sico { width: 36px; height: 36px; border-radius: 11px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.o-setrow .o-st { font-size: 14px; font-weight: 700; color: #1F2937; }
.o-setrow .o-chev { margin-left: auto; color: #D4C5B2; font-size: 17px; }
/* 待办卡（豆包式：标题 + 行内「去处理」胶囊） */
.o-todo { display: flex; align-items: center; gap: 11px; padding: 12px 2px; border-bottom: 1px solid var(--olin); cursor: pointer; }
.o-todo:last-child { border-bottom: none; }

/* ===== 第 121 轮：渐变面全局装饰体系（v2 多样轮换：斜光带/柔光斑/点阵，低透明度白系）===== */
/* 通用件：挂 .gdeco 即得「对角光带 + 柔光斑」（容器需自带渐变底与 overflow:hidden） */
.gdeco { position: relative; overflow: hidden; }
.gdeco::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(112deg, transparent 44%, rgba(255,255,255,.10) 50%, rgba(255,255,255,.045) 58%, transparent 64%);
}
.gdeco::after {
  content: ''; position: absolute; right: -46px; bottom: -58px; width: 168px; height: 168px; pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.14) 0%, rgba(255,255,255,.05) 46%, transparent 68%);
}
/* 用户卡：右上柔光 glow + 斜光带（不用圆环，玻璃圆保留但更含蓄） */
.o-usercard::before {
  content: ''; position: absolute; right: -50px; top: -60px; width: 190px; height: 190px; pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.20) 0%, rgba(255,255,255,.07) 46%, transparent 68%);
}
.o-usercard::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(112deg, transparent 46%, rgba(255,255,255,.10) 52%, rgba(255,255,255,.04) 60%, transparent 66%);
}
/* 英雄卡：点阵（右上，弱化）+ 斜光带 */
.o-hero::before {
  content: ''; position: absolute; right: 16px; top: 12px; width: 100px; height: 56px; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.40) 1.1px, transparent 1.4px);
  background-size: 11px 11px; opacity: .42;
  -webkit-mask-image: linear-gradient(215deg, #000 26%, transparent 76%);
  mask-image: linear-gradient(215deg, #000 26%, transparent 76%);
}
.o-hero::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(112deg, transparent 44%, rgba(255,255,255,.09) 50%, rgba(255,255,255,.04) 58%, transparent 64%);
}
.o-hero .o-orb1, .o-usercard .o-orb1 { background: rgba(255,255,255,.14); }
.o-hero .o-orb2, .o-usercard .o-orb2 { background: rgba(255,255,255,.08); }
/* 渐变按钮/图标块：顶部高光+底部内影（立体玻璃感），全局生效 */
.o-btn, .btn-primary, .o-gi .o-ico, .pb-btn-g {
  box-shadow: 0 8px 20px var(--oshadow, rgba(45,91,255,.28)), inset 0 1px 0 rgba(255,255,255,.34), inset 0 -2px 5px rgba(0,0,0,.10) !important;
}
.o-btn:active, .btn-primary:active { filter: brightness(.96); }
/* 后台 KPI 与统计数字统一 DIN 数字字体 */
.kpi .kv, .stat-num, .num-big { font-family: var(--font-num); letter-spacing: -.5px; }
.o-gi.soft .o-ico { box-shadow: none !important; }

/* ==================== 第 128 轮：海报设计器 v2 ==================== */
.pd-sec { font-size:12px; font-weight:800; color:var(--t2); margin:12px 0 7px; padding-left:8px; border-left:3px solid var(--brand); line-height:1.1; }
.flabel { font-size:11px; color:var(--t3); margin-bottom:4px; }
#pdStage { touch-action:none; }
#pdSvg svg { width:100%; height:100%; display:block; }
#pdOv textarea#pdInline { box-shadow:0 6px 22px rgba(79,107,246,.28); }
#pdBox span[title] { transition: transform .1s ease; }
#pdBox span[title]:hover { transform: scale(1.25); }
#pdPanel .btn-sm { padding:3px 9px; font-size:11.5px; }
#pdPanel textarea.input { resize:vertical; }

/* 第 141 轮：1/4 宽预设（四列并排 / 网格 span） */
.pg-deco-grid > .pb-w-quarter { grid-column: span 1; }

/* ===== 第 143 轮：App 整屏组件满幅（apphome/appplayer/appquiz/appjw/appmine） ===== */
.pg-deco-grid > .pb-b[data-pbt="apphome"],
.pg-deco-grid > .pb-b[data-pbt="appplayer"],
.pg-deco-grid > .pb-b[data-pbt="appquiz"],
.pg-deco-grid > .pb-b[data-pbt="appjw"],
.pg-deco-grid > .pb-b[data-pbt="appmine"] { grid-column: 1 / -1 !important; width: 100% !important; }

/* ===== 第 143 轮：App 整屏组件满幅（apphome/appplayer/appquiz/appjw/appmine） ===== */
.pg-deco-grid > .pb-b[data-pbt="apphome"],
.pg-deco-grid > .pb-b[data-pbt="appplayer"],
.pg-deco-grid > .pb-b[data-pbt="appquiz"],
.pg-deco-grid > .pb-b[data-pbt="appjw"],
.pg-deco-grid > .pb-b[data-pbt="appmine"] { grid-column: 1 / -1 !important; width: 100% !important; }