:root {
  color-scheme: dark;
  font-family: "Microsoft YaHei", "PingFang SC", system-ui, sans-serif;
  --bg: #04130f;
  --panel: rgba(9, 38, 31, 0.88);
  --panel-2: rgba(8, 31, 39, 0.9);
  --line: rgba(86, 227, 159, 0.22);
  --green: #56e39f;
  --green-2: #1fa96b;
  --cyan: #42c7e8;
  --blue: #42b8ff;
  --orange: #ffad45;
  --purple: #917bff;
  --text: #effff8;
  --muted: #83aaa0;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #020a08; color: var(--text); }
body { overflow-x: hidden; }
button { font: inherit; }

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(45, 122, 91, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(45, 122, 91, .045) 1px, transparent 1px),
    radial-gradient(circle at 50% 0%, rgba(36, 176, 112, .18), transparent 40%),
    radial-gradient(circle at 80% 45%, rgba(27, 115, 151, .1), transparent 34%);
  background-size: 44px 44px, 44px 44px, auto, auto;
}

.dashboard-shell { position: relative; width: min(100%, 2560px); min-width: 1180px; margin: 0 auto; padding: 0 18px 14px; background: linear-gradient(180deg, rgba(4,20,15,.9), rgba(2,12,10,.97)); }
.dashboard-shell::before, .dashboard-shell::after { content:""; position:absolute; top:86px; width:170px; height:1px; background:linear-gradient(90deg, transparent, var(--green)); box-shadow:0 0 12px var(--green); }
.dashboard-shell::before { left:20px; }
.dashboard-shell::after { right:20px; transform:scaleX(-1); }

.dashboard-header { height: 86px; display:flex; align-items:center; justify-content:center; position:relative; border-bottom:1px solid rgba(86,227,159,.14); }
.dashboard-header::after { content:""; position:absolute; left:50%; bottom:-2px; width:44%; height:4px; transform:translateX(-50%); background:linear-gradient(90deg, transparent, var(--green), transparent); filter:blur(1px); }
.brand-mark { position:absolute; left:26px; width:54px; height:52px; border:1px solid rgba(86,227,159,.3); border-radius:50%; box-shadow:inset 0 0 20px rgba(86,227,159,.1), 0 0 18px rgba(86,227,159,.08); }
.brand-leaf { position:absolute; width:20px; height:30px; top:9px; background:linear-gradient(145deg,#7ff2ad,#168d5a); border-radius:90% 10% 80% 20%; }
.brand-leaf--left { left:9px; transform:rotate(-35deg); }
.brand-leaf--right { right:9px; transform:rotate(68deg) scale(.85); }
.brand-stem { position:absolute; left:26px; top:23px; width:2px; height:24px; background:var(--green); transform:rotate(5deg); }
.header-title { text-align:center; }
.header-title p { margin:0 0 2px; color:#54b88c; font-size:10px; letter-spacing:7px; }
.header-title h1 { margin:0; font-size:28px; letter-spacing:5px; font-weight:700; text-shadow:0 0 22px rgba(86,227,159,.3); }
.header-meta { position:absolute; right:22px; display:flex; align-items:center; gap:20px; }
.status-chip { padding:6px 10px; border:1px solid rgba(255,173,69,.35); color:#ffd08d; font-size:12px; border-radius:3px; background:rgba(255,173,69,.08); }
.status-chip i, .freshness i, .live-dot { display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:var(--orange); box-shadow:0 0 8px var(--orange); }
.fullscreen-btn { width:32px; height:32px; display:grid; place-items:center; border:1px solid rgba(86,227,159,.3); background:rgba(8,43,32,.6); color:#7fe3ac; font-size:15px; line-height:1; cursor:pointer; border-radius:3px; transition:.2s; }
.fullscreen-btn:hover { background:var(--green); color:#04130f; box-shadow:0 0 12px rgba(86,227,159,.35); }
.clock-block { text-align:right; }
.clock-block strong { display:block; font:600 21px/1.1 Consolas, monospace; letter-spacing:2px; }
.clock-block span { color:var(--muted); font-size:11px; }

.toolbar { min-height:38px; display:flex; align-items:center; justify-content:space-between; padding:4px 4px 2px; }
.toolbar-controls { display:flex; align-items:center; gap:8px; }
.autoplay-btn { border:1px solid rgba(86,227,159,.3); background:rgba(8,43,32,.55); color:#7fb19f; padding:5px 11px; font-size:12px; cursor:pointer; transition:.2s; }
.autoplay-btn:hover { color:#04130f; background:var(--green); box-shadow:0 0 12px rgba(86,227,159,.35); }
.autoplay-btn[aria-pressed="true"] { color:#04130f; background:var(--green); box-shadow:0 0 12px rgba(86,227,159,.35); }
.period-tabs { display:flex; gap:2px; border:1px solid rgba(86,227,159,.17); padding:2px; background:rgba(8,43,32,.55); }
.period-tabs button { border:0; color:#7fb19f; background:transparent; padding:5px 13px; cursor:pointer; font-size:12px; }
.period-tabs button:hover, .period-tabs button.is-active { color:#04130f; background:var(--green); box-shadow:0 0 12px rgba(86,227,159,.35); }
.toolbar-note { display:flex; gap:18px; color:#6e998d; font-size:11px; }
.toolbar-note b { color:#b9ded1; font-weight:500; }
.freshness { color:#55d99c; }
.freshness i { background:#56e39f; box-shadow:0 0 8px #56e39f; }

.kpi-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:8px; }
.kpi-card { --accent:var(--green); position:relative; min-height:103px; padding:14px 16px 10px 68px; border:1px solid color-mix(in srgb, var(--accent) 35%, transparent); background:linear-gradient(135deg, color-mix(in srgb, var(--accent) 10%, transparent), rgba(5,30,23,.88) 55%); overflow:hidden; cursor:pointer; transition:.2s ease; }
.kpi-card:hover { transform:translateY(-2px); border-color:color-mix(in srgb, var(--accent) 65%, transparent); box-shadow:0 8px 24px rgba(0,0,0,.22), inset 0 0 20px color-mix(in srgb, var(--accent) 7%, transparent); }
.kpi-card::after { content:""; position:absolute; top:0; right:0; width:46px; height:1px; background:var(--accent); box-shadow:0 0 8px var(--accent); }
.kpi-card--orange { --accent:#ffad45; }.kpi-card--cyan { --accent:#43d5e8; }.kpi-card--gold { --accent:#ffd063; }.kpi-card--purple { --accent:#9c86ff; }
.kpi-icon { position:absolute; left:15px; top:17px; width:39px; height:39px; display:grid; place-items:center; border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); color:var(--accent); font-size:18px; transform:rotate(45deg); background:color-mix(in srgb, var(--accent) 8%, transparent); }
.kpi-icon::first-letter { transform:rotate(-45deg); }
.kpi-icon { text-indent:0; }
.kpi-main > span { color:#a8c9bd; font-size:12px; }
.kpi-main div { margin-top:3px; }
.kpi-main strong { color:#fff; font:700 27px/1.1 "DIN Alternate", Consolas, sans-serif; letter-spacing:1px; text-shadow:0 0 14px color-mix(in srgb, var(--accent) 42%, transparent); }
.kpi-main em { color:var(--accent); font-style:normal; font-size:11px; margin-left:6px; }
.kpi-progress { height:3px; margin-top:7px; background:rgba(255,255,255,.07); }
.kpi-progress span { display:block; width:var(--progress); height:100%; background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 35%,white)); box-shadow:0 0 8px var(--accent); animation:grow 1.1s ease-out; }
.kpi-card small { display:block; margin-top:5px; color:#638d80; font-size:9px; }

.content-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:8px; margin-top:8px; }
.column { min-width:0; }
.section-heading { height:39px; padding:0 10px; display:flex; align-items:center; justify-content:space-between; border:1px solid rgba(86,227,159,.16); background:linear-gradient(90deg,rgba(44,153,99,.22),transparent 72%); }
.section-heading > div { display:flex; align-items:center; gap:9px; }
.section-heading span { color:var(--green); font:700 17px/1 Consolas; }
.section-heading h2 { margin:0; font-size:15px; letter-spacing:2px; }
.section-heading p { margin:0; color:#679687; font-size:10px; letter-spacing:1px; }
.section-heading--talent { border-color:rgba(66,184,255,.18); background:linear-gradient(90deg,rgba(37,119,149,.24),transparent 72%); }
.section-heading--talent span { color:var(--cyan); }

.product-layout { display:grid; grid-template-columns:1fr 1.5fr 1fr; grid-template-rows:222px 220px 218px; gap:8px; margin-top:8px; }
.talent-layout { display:grid; grid-template-columns:1fr 1.08fr; grid-template-rows:222px 220px 218px; gap:8px; margin-top:8px; }
.panel { position:relative; min-width:0; padding:10px 12px; border:1px solid rgba(86,227,159,.17); background:linear-gradient(145deg,rgba(10,43,34,.94),rgba(5,24,21,.92)); box-shadow:inset 0 0 24px rgba(27,115,76,.035); overflow:hidden; }
.panel::before, .panel::after { content:""; position:absolute; width:14px; height:14px; pointer-events:none; }
.panel::before { left:-1px; top:-1px; border-left:2px solid var(--green); border-top:2px solid var(--green); }
.panel::after { right:-1px; bottom:-1px; border-right:2px solid rgba(86,227,159,.55); border-bottom:2px solid rgba(86,227,159,.55); }
.panel-title { height:25px; display:flex; align-items:flex-start; justify-content:space-between; }
.panel-title h3 { margin:0; font-size:12px; font-weight:600; letter-spacing:1px; }
.panel-title h3::before { content:""; display:inline-block; width:3px; height:11px; margin-right:7px; vertical-align:-1px; background:var(--green); box-shadow:0 0 7px var(--green); }
.panel-title > span { color:#628f81; font-size:9px; }
.warning-text { color:#ffad45 !important; }
.brand-panel { grid-column:1; grid-row:1; }.map-panel { grid-column:2; grid-row:1 / 3; }.category-panel { grid-column:3; grid-row:1; }
.trend-panel { grid-column:1; grid-row:2; }.platform-panel { grid-column:3; grid-row:2; }.compliance-panel { grid-column:1 / 4; grid-row:3; }

.chart-box { width:100%; height:calc(100% - 25px); min-height:0; }
.chart-box--gauge { width:190px; height:100%; flex:0 0 190px; }
.chart-box--training { height:calc(100% - 25px - 42px); }

.map-body { position:relative; height:calc(100% - 25px); display:flex; flex-direction:column; gap:6px; }
.fujian-map { width:100%; flex:1 1 auto; min-height:0; }
.map-rank { flex:0 0 auto; font-size:9px; }
.map-rank p { color:#6b9d8d; margin:0 0 5px; }
.map-rank ol { counter-reset:item; list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.map-rank li { display:flex; align-items:baseline; gap:5px; padding:5px 8px; border:1px solid rgba(86,227,159,.14); background:rgba(86,227,159,.045); }
.map-rank li::before { counter-increment:item; content:counter(item); color:var(--green); font:italic 700 12px Consolas; }
.map-rank b { font-weight:500; }.map-rank span { margin-left:auto; color:#82b4a3; font:500 10px Consolas; }
.map-back { position:absolute; top:0; right:0; z-index:2; padding:3px 9px; border:1px solid rgba(86,227,159,.35); background:rgba(8,43,32,.85); color:#7fe3ac; font-size:10px; cursor:pointer; display:none; }
.map-back.is-visible { display:inline-block; }
.map-back:hover { background:var(--green); color:#04130f; }

.gauge-row { height:calc(100% - 25px); display:grid; grid-template-columns:190px 1fr; align-items:center; gap:28px; padding:0 4%; }
.compliance-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.compliance-stats p { position:relative; margin:0; min-height:88px; padding:18px 20px; border:1px solid rgba(86,227,159,.13); background:linear-gradient(135deg,rgba(86,227,159,.07),rgba(255,255,255,.01)); overflow:hidden; }
.compliance-stats p::after { content:""; position:absolute; right:-18px; bottom:-28px; width:80px; height:80px; border:1px solid rgba(86,227,159,.1); border-radius:50%; }
.compliance-stats span { display:block; color:#82aa9f; font-size:10px; }.compliance-stats b { display:block; margin-top:9px; color:#e5fff5; font:700 25px/1 Consolas; }.compliance-stats .orange { color:#ffb24c; }

.people-panel { grid-column:1; grid-row:1; }.training-panel { grid-column:2; grid-row:1; }.talent-direction-panel { grid-column:1; grid-row:2; }.rating-panel { grid-column:2; grid-row:2; }.ranking-panel { grid-column:1/3; grid-row:3; }
.mini-kpis { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin-top:1px; }.mini-kpis p { margin:0; padding:5px 7px; background:rgba(66,184,255,.055); border:1px solid rgba(66,184,255,.1); }.mini-kpis span { display:block; color:#668f8b; font-size:8px; }.mini-kpis b { color:#bcecff; font:600 12px Consolas; }
.direction-list > div { display:grid; grid-template-columns:1fr 28px 42%; gap:7px; align-items:center; margin:8px 0; }.direction-list span { color:#91b9ae; font-size:9px; }.direction-list span > i { display:inline-grid; place-items:center; width:20px; height:20px; margin-right:7px; border:1px solid rgba(86,227,159,.25); color:#57d99a; font-style:normal; font-size:9px; }.direction-list b { font:500 11px Consolas; }.direction-list em { height:4px; background:rgba(255,255,255,.06); }.direction-list em i { display:block; width:var(--w); height:100%; background:linear-gradient(90deg,#1e7455,#56e39f); box-shadow:0 0 6px rgba(86,227,159,.5); }
.rating-circles { display:flex; justify-content:center; gap:15px; margin-top:7px; }.rating { width:58px; height:58px; border-radius:50%; display:grid; place-content:center; text-align:center; border:2px solid var(--rating); box-shadow:inset 0 0 14px color-mix(in srgb,var(--rating) 15%,transparent),0 0 9px color-mix(in srgb,var(--rating) 20%,transparent); }.rating strong{font:700 19px Consolas;color:var(--rating)}.rating span{font-size:8px;color:#8bb0a6}.rating-a{--rating:#ffcb62}.rating-b{--rating:#56e39f}.rating-c{--rating:#42b8ff}
.result-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin-top:15px; }.result-cards p { margin:0; padding:8px 3px; text-align:center; background:rgba(255,255,255,.025); border-top:1px solid rgba(86,227,159,.16); }.result-cards b { display:block; color:#d9fff0; font:600 14px Consolas; }.result-cards span { color:#658f83; font-size:8px; }
.ranking-table { display:grid; grid-template-columns:1fr 1fr; column-gap:20px; }.ranking-table > div { display:grid; grid-template-columns:28px 1fr 70px; align-items:center; min-height:51px; border-bottom:1px solid rgba(255,255,255,.055); }.ranking-table em { color:#61dba0; font:italic 700 14px Consolas; }.ranking-table span b { display:block; font-size:10px; }.ranking-table small { color:#628c80; font-size:8px; }.ranking-table strong { color:#ffd17e; text-align:right; font:600 11px Consolas; }

.bottom-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr; gap:8px; margin-top:8px; height:196px; }
.live-dot { background:#56e39f; box-shadow:0 0 8px #56e39f; animation:pulse 1.4s infinite; }
.data-table { font-size:9px; height:calc(100% - 25px); display:flex; flex-direction:column; }.table-head, .table-scroll > div { display:grid; grid-template-columns:1.2fr 1fr 1.2fr 1.25fr .55fr; gap:8px; align-items:center; min-height:29px; padding:0 7px; }.table-head { color:#5f9281; background:rgba(86,227,159,.055); }.table-scroll > div { color:#a5c9bd; border-bottom:1px solid rgba(255,255,255,.04); }.table-scroll > div:nth-child(even){background:rgba(255,255,255,.015)}
.table-viewport { flex:1 1 auto; min-height:0; overflow:hidden; position:relative; }
.table-scroll { will-change:transform; }
.tag-pass,.tag-warn { width:max-content; padding:2px 5px; border:1px solid rgba(86,227,159,.3); color:#68e7a9; }.tag-warn { color:#ffbd62; border-color:rgba(255,173,69,.35); }
.sales-ranking { padding-top:3px; }.rank-row { display:grid; grid-template-columns:20px 1.1fr .85fr 70px; gap:7px; align-items:center; min-height:35px; }.rank-row em { font:italic 700 13px Consolas; color:#60e2a4; }.rank-row span b { display:block; font-size:9px; }.rank-row small { color:#547c71; font-size:7px; }.rank-row > i { height:4px; background:rgba(255,255,255,.06); }.rank-row u { display:block; width:var(--w); height:100%; background:linear-gradient(90deg,#1d7252,#56e39f); box-shadow:0 0 5px #3dbc7f; }.rank-row strong { color:#ffd17e; font:500 9px Consolas; text-align:right; }
.schedule-list > div { display:grid; grid-template-columns:42px 1fr 43px; gap:8px; align-items:center; min-height:48px; border-bottom:1px solid rgba(255,255,255,.055); }.schedule-list time { width:37px; height:37px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid rgba(66,184,255,.22); background:rgba(66,184,255,.06); }.schedule-list time b { font:600 15px/17px Consolas; color:#8ce7ff; }.schedule-list time span { color:#5f9098; font-size:7px; line-height:1; }.schedule-list p { margin:0; }.schedule-list p b { display:block; font-size:9px; }.schedule-list p span { color:#5c8980; font-size:8px; }.schedule-list em { padding:3px; font-size:7px; font-style:normal; color:#62e3a5; border:1px solid rgba(86,227,159,.22); text-align:center; }
/* 可点击的榜单/排期行 */
.ranking-table > div, .rank-row, .schedule-list > div { cursor:pointer; transition:background .15s; padding-inline:6px; margin-inline:-6px; }
.ranking-table > div:hover, .rank-row:hover, .schedule-list > div:hover { background:rgba(86,227,159,.08); }

footer { height:36px; display:grid; grid-template-columns:70px 1fr 300px; align-items:center; margin-top:8px; border:1px solid rgba(86,227,159,.18); background:rgba(8,38,30,.82); overflow:hidden; }
.ticker-label { align-self:stretch; display:grid; place-items:center; background:linear-gradient(90deg,#21875f,#1b6a50); font-size:10px; letter-spacing:1px; }
.ticker-window { overflow:hidden; white-space:nowrap; }.ticker-track { width:max-content; animation:ticker 32s linear infinite; color:#90bcb0; font-size:9px; }.ticker-track span{margin:0 18px}.ticker-track i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#ffad45;vertical-align:2px}
footer > p { margin:0; padding-right:14px; color:#64b88e; text-align:right; font-size:10px; letter-spacing:2px; }

.detail-modal { position:fixed; inset:0; z-index:20; display:none; place-items:center; }.detail-modal.is-open { display:grid; }.modal-backdrop { position:absolute; inset:0; background:rgba(0,8,6,.78); backdrop-filter:blur(5px); }.modal-card { position:relative; width:min(480px,90vw); padding:27px; border:1px solid rgba(86,227,159,.45); background:linear-gradient(145deg,#0b2d23,#071913); box-shadow:0 20px 60px rgba(0,0,0,.5),inset 0 0 30px rgba(86,227,159,.06); }.modal-close { position:absolute; top:8px; right:10px; border:0; background:transparent; color:#7db6a4; font-size:24px; cursor:pointer; }.modal-eyebrow { color:#4fc98d; font-size:9px; letter-spacing:3px; }.modal-card h2 { margin:7px 0 13px; font-size:20px; }.modal-card p { color:#a6ccc0; font-size:13px; line-height:1.8; }.modal-meta { display:flex; justify-content:space-between; padding-top:14px; border-top:1px solid rgba(255,255,255,.07); color:#5e897c; font-size:9px; }

/* 首屏加载 / 依赖失败遮罩 */
.boot-overlay { position:fixed; inset:0; z-index:40; display:grid; place-items:center; background:radial-gradient(circle at 50% 40%, #072019, #020a08); transition:opacity .4s ease; }
.boot-overlay.is-hidden { opacity:0; pointer-events:none; }
.boot-card { text-align:center; }
.boot-spinner { width:46px; height:46px; margin:0 auto 16px; border:3px solid rgba(86,227,159,.18); border-top-color:var(--green); border-radius:50%; animation:boot-spin 900ms linear infinite; }
.boot-overlay.is-error .boot-spinner { display:none; }
.boot-text { color:#a6ccc0; font-size:14px; letter-spacing:1px; margin:0; }
.boot-overlay.is-error .boot-text { color:#ffb24c; }
.boot-retry { margin-top:16px; padding:7px 18px; border:1px solid rgba(86,227,159,.4); background:rgba(8,43,32,.7); color:#7fe3ac; font-size:13px; cursor:pointer; border-radius:3px; }
.boot-retry:hover { background:var(--green); color:#04130f; }

@keyframes boot-spin { to { transform:rotate(360deg); } }
@keyframes grow { from { width:0; } }
@keyframes pulse { 50% { opacity:.4; box-shadow:0 0 2px currentColor; } }
@keyframes ticker { from { transform:translateX(-50%); } to { transform:translateX(0); } }

/* 尊重系统“减少动态效果”偏好：停用跑马灯、脉冲、进度条等 CSS 动画 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .ticker-track { transform:translateX(0); }
}

@media (min-width: 1900px) {
  .dashboard-shell { padding-inline:26px; }
  .dashboard-header { height:100px; }.header-title h1{font-size:34px}.header-title p{font-size:12px}
  .kpi-card{min-height:118px}.kpi-main strong{font-size:34px}.kpi-main>span{font-size:14px}
  .product-layout{grid-template-rows:260px 255px 245px}.talent-layout{grid-template-rows:260px 255px 245px}.bottom-grid{height:230px}
  .panel-title h3{font-size:14px}.panel-title>span{font-size:11px}
  .ranking-table>div{min-height:60px}.table-head,.table-scroll>div{min-height:35px}.schedule-list>div{min-height:58px}
}

@media (max-width: 1180px) {
  .dashboard-shell { min-width:0; width:100%; }
  .content-grid { grid-template-columns:1fr; }
  .product-layout { grid-template-columns:1fr 1fr; grid-template-rows:240px 240px 240px 220px; }
  .brand-panel{grid-column:1;grid-row:1}.map-panel{grid-column:2;grid-row:1/3}.category-panel{grid-column:1;grid-row:2}.trend-panel{grid-column:1/3;grid-row:3}.platform-panel{grid-column:1;grid-row:4}.compliance-panel{grid-column:2;grid-row:4}
  .talent-layout { grid-template-rows:240px 230px 240px; }
  .bottom-grid { height:auto; grid-template-columns:1fr; }.bottom-grid .panel{min-height:220px}
  footer { grid-template-columns:70px 1fr; } footer>p{display:none}
}

@media (max-width: 760px) {
  .dashboard-shell{padding:0 8px 10px}.dashboard-header{height:76px}.brand-mark,.status-chip{display:none}.header-title h1{font-size:17px;letter-spacing:2px}.header-title p{letter-spacing:3px;font-size:8px}.header-meta{right:8px}.clock-block{display:none}
  .toolbar{align-items:flex-start;gap:5px}.toolbar-note{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px;text-align:right}.kpi-grid{grid-template-columns:1fr 1fr}.kpi-card:last-child{grid-column:1/3}
  .product-layout,.talent-layout{display:block}.panel{min-height:230px;margin-top:8px}.content-grid{display:block}.column--talent{margin-top:8px}.section-heading p{display:none}.people-panel,.training-panel,.talent-direction-panel,.rating-panel,.ranking-panel{display:block}.bottom-grid{display:block}.bottom-grid .panel{margin-top:8px}
  .map-panel{min-height:290px}.ranking-table{grid-template-columns:1fr}.modal-meta{display:block}.modal-meta span{display:block;margin-top:3px}
  .chart-box,.chart-box--training{height:200px}.chart-box--gauge{width:100%;flex:1}.map-body{flex-direction:column}.fujian-map{width:100%;height:220px}.map-rank{width:100%}
  .gauge-row{grid-template-columns:1fr;gap:12px}
}