/* HD2 主站样式（2026-09 自 index.html 内嵌 <style> 整体抽取）
   改动会波及主站全部模块，谨慎编辑；设计变量在 tokens.css */

@font-face { font-family: "ChuangKeTi"; src: url("../../fonts/ChuangKeTieJinGangTi-2.otf") format("opentype"); font-display: swap; }
    @font-face { font-family: "SourceHanSans"; src: url("../../fonts/SourceHanSansCN-Medium.otf") format("opentype"); font-display: swap; }
@font-face { font-family: "ZZZ-thick"; src: url("../../fonts/ZZZ-thick.ttf") format("truetype"); font-display: swap; }
    /* ============================================================
       主题变量
       ============================================================ */
    /* :root 设计变量已抽至 tokens.css（本目录），由 index.html 先行引入 */

    /* ============================================================
       全局重置与基础排版
       ============================================================ */
    * { box-sizing: border-box; }
    html, body { margin: 0; padding: 0; }
    body {
      font-family: "SourceHanSans", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
                   "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
      background: radial-gradient(ellipse at top, var(--bg-deep-2) 0%, var(--bg-deep) 60%),
                  var(--bg-deep);
      color: var(--text);
      min-height: 100vh;
      line-height: 1.5;
      letter-spacing: 0.01em;
      overflow-x: hidden;
    }
    h1, h2, h3, h4, .nav-link, .sector-header, .planet-name, .news-float-title {
      font-family: "ZZZ-thick","SourceHanSans","Microsoft YaHei",sans-serif;
    }
    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(2px 2px at 12% 22%, rgba(245, 197, 24, 0.6), transparent 50%),
        radial-gradient(1px 1px at 30% 70%, rgba(255, 255, 255, 0.5), transparent 50%),
        radial-gradient(1.5px 1.5px at 55% 35%, rgba(255, 255, 255, 0.45), transparent 50%),
        radial-gradient(1px 1px at 78% 80%, rgba(255, 255, 255, 0.4), transparent 50%),
        radial-gradient(1.5px 1.5px at 90% 15%, rgba(245, 197, 24, 0.4), transparent 50%),
        radial-gradient(1px 1px at 45% 90%, rgba(255, 255, 255, 0.35), transparent 50%),
        radial-gradient(1px 1px at 8% 60%, rgba(255, 255, 255, 0.3), transparent 50%),
        radial-gradient(1px 1px at 65% 12%, rgba(255, 255, 255, 0.3), transparent 50%);
      z-index: 0;
      opacity: 0.6;
    }
    body > * { position: relative; z-index: 1; }

    h1, h2, h3, h4 {
      text-transform: uppercase;
      letter-spacing: 0.05em;
      margin: 0;
      font-weight: 700;
    }
    a { color: var(--yellow); text-decoration: none; }
    a:hover { color: var(--yellow-2); }

    .container {
      max-width: 1200px;
      margin: 0 auto;
      padding: 0 24px;
    }

    /* ============================================================
       通用卡片
       ============================================================ */
    .card {
      background: var(--card-bg);
      backdrop-filter: var(--blur);
      -webkit-backdrop-filter: var(--blur);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 20px;
      transition: border-color 0.2s, background 0.2s;
    }
    .card:hover { border-color: var(--border-h); background: var(--card-h); }

    /* ============================================================
       区块0：顶部导航
       ============================================================ */
    .topnav {
      position: sticky;
      top: 0;
      z-index: 50;
      backdrop-filter: blur(16px);
      -webkit-backdrop-filter: blur(16px);
      background: rgba(11, 14, 20, 0.7);
      border-bottom: 1px solid var(--border);
    }
    .topnav-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: 56px;
    }
    .brand {
      display: flex;
      align-items: center;
      gap: 8px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--text);
    }
    .brand-emoji { font-size: 1.25em; }
    .brand-title { font-size: 1rem; }
    .nav-cta {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 8px 14px;
      border: 1px solid var(--yellow);
      color: var(--yellow);
      border-radius: 6px;
      font-size: 0.85rem;
      font-weight: 600;
      transition: all 0.15s;
    }
    .nav-cta:hover {
      background: var(--yellow);
      color: var(--bg-deep);
    }
    .topnav-meta {
      font-size: 0.75rem;
      color: var(--text-mute);
      display: flex;
      gap: 12px;
      align-items: center;
    }
    .pulse-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #2ECC71;
      display: inline-block;
      box-shadow: 0 0 6px #2ECC71;
      animation: pulse 1.6s ease-in-out infinite;
    }
    .pulse-dot.stale { background: #E74C3C; box-shadow: 0 0 6px #E74C3C; }
    @keyframes pulse {
      0%, 100% { opacity: 1; }
      50%      { opacity: 0.4; }
    }

    /* 顶栏轮播（.banner-wrap / .banner-track / .banner-item）已于 2026-09 移除：
       顶部信息栏只保留右侧「更新于 HH:MM:SS」，对应的 JS 轮播定时器同步删除 */

    /* 星球详情展开区 */
    .planet-detail {
      margin-top: 10px;
      border-top: 1px solid var(--border);
      padding-top: 10px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .pd-section { display: flex; flex-direction: column; gap: 6px; }
    .pd-title {
      font-size: 0.9rem;      /* 中文主标题，大字 */
      letter-spacing: 0.02em;
      color: var(--yellow);
      font-weight: 700;
      display: flex;
      align-items: baseline;
      gap: 8px;
    }
    .pd-cn { color: var(--text-dim); font-weight: 400; letter-spacing: 0.05em; font-size: 0.66rem; text-transform: uppercase; }
    .pd-row {
      display: flex; justify-content: space-between; align-items: center;
      font-size: 0.8rem; color: var(--text-dim);
    }
    .pd-row strong { color: var(--text); font-weight: 600; }
    .pd-chips { display: flex; flex-wrap: wrap; gap: 6px; }
    .pd-chip-eff { cursor: pointer; user-select: none; transition: all 0.15s; }
    .pd-chip.pd-chip-tac { border-color: rgba(59, 130, 246, 0.65) !important; color: var(--blue) !important; background: rgba(59, 130, 246, 0.1) !important; }
    .pd-chip.pd-chip-tac:hover, .pd-chip.pd-chip-tac.open { border-color: var(--blue) !important; color: #7CA9F8 !important; background: rgba(59, 130, 246, 0.16) !important; }
    .pd-chip.poi-atk { border-color: rgba(231, 76, 60, 0.6); color: #E74C3C; background: rgba(231, 76, 60, 0.08); }
    .pd-chip-tac + .pd-eff-desc .tac-jump { margin-top: 6px; padding-top: 6px; border-top: 1px dashed rgba(59, 130, 246, 0.3); }
    .tac-target { color: #7CA9F8; text-decoration: underline; cursor: pointer; }
    .tac-target:hover { color: #A8C6FA; }
    .planet-card.tac-highlight { outline: 2px solid var(--blue); box-shadow: 0 0 24px rgba(59, 130, 246, 0.55); }
    .pe-event { background: var(--card-bg); border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 16px; margin-bottom: 10px; }
    .pe-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
    .pe-title { font-weight: 600; color: var(--text); }
    .pe-planet { color: var(--yellow); font-weight: 600; }
    .pe-countdown { margin-left: auto; font-family: "SourceHanSans","Microsoft YaHei",sans-serif; color: var(--yellow); font-size: 1.05rem; }
    .pe-sub { margin-top: 6px; font-size: 0.74rem; color: var(--text-mute); }
    .pe-atk { color: #E74C3C; }
    .pd-chip.pd-chip-neg { border-color: rgba(231, 76, 60, 0.6) !important; color: #E74C3C !important; }
    .pd-chip.pd-chip-neg:hover, .pd-chip.pd-chip-neg.open { border-color: #E74C3C !important; color: #FF6B5E !important; background: rgba(231, 76, 60, 0.08) !important; }
    .pd-chip-eff:hover { border-color: var(--accent); color: var(--accent); }
    .pd-chip-eff.open { border-color: var(--accent); color: var(--accent); background: rgba(255,255,255,0.05); }
    .pd-eff-arrow { font-size: 0.6rem; margin-left: 4px; opacity: 0.7; }
    .pd-eff-desc {
      width: 100%;
      font-size: 0.7rem;
      color: var(--text-dim);
      background: rgba(255,255,255,0.03);
      border: 1px dashed var(--border);
      border-radius: 8px;
      padding: 6px 10px;
      margin-top: 2px;
      line-height: 1.5;
    }
    .pd-chip {
      background: var(--card-bg);
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 3px 10px;
      font-size: 0.75rem;
      color: var(--text-dim);
    }
    .poi-mo { border-color: #FF8C00; color: #FFA940; }
    .poi-camp { border-color: var(--yellow); color: var(--yellow); }
    .poi-dss { border-color: #5BA3D0; color: #7FC0E8; }
    .pd-empty { font-size: 0.78rem; color: var(--text-dim); font-style: italic; }

    /* 玩家数量独立行 */
    .player-line {
      background: linear-gradient(90deg, rgba(245,197,24,0.08), rgba(245,197,24,0.02));
      border-bottom: 1px solid var(--border);
      text-align: center;
      padding: 4px 16px;
      font-size: 0.82rem;
      color: var(--text-dim);
      letter-spacing: 0.02em;
    }
    .player-line .pulse-dot {
      margin: 0 4px;
      vertical-align: middle;
    }

    /* ============================================================
       英雄区
       ============================================================ */
    .hero {
      padding: 72px 0 48px;
      text-align: center;
    }
    .hero h1 {
      font-size: clamp(1.8rem, 4vw, 3rem);
      letter-spacing: 0.06em;
      margin-bottom: 14px;
      background: linear-gradient(180deg, #FFFFFF 0%, #C9CFD9 100%);
      -webkit-background-clip: text;
      background-clip: text;
      color: transparent;
    }
    .hero-sub {
      font-size: clamp(0.95rem, 1.6vw, 1.15rem);
      color: var(--text-dim);
      max-width: 640px;
      margin: 0 auto 28px;
    }
    .hero-cta {
      display: inline-flex;
      gap: 12px;
      flex-wrap: wrap;
      justify-content: center;
    }
    .btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 12px 22px;
      border-radius: 8px;
      font-weight: 600;
      font-size: 0.95rem;
      border: 1px solid transparent;
      transition: all 0.15s;
      cursor: pointer;
    }
    .btn-primary {
      background: var(--yellow);
      color: var(--bg-deep);
    }
    .btn-primary:hover { background: var(--yellow-2); color: var(--bg-deep); }
    .btn-ghost {
      border-color: rgba(255, 255, 255, 0.18);
      color: var(--text);
    }
    .btn-ghost:hover {
      border-color: var(--yellow);
      color: var(--yellow);
    }

    /* ============================================================
       通用区块标题
       ============================================================ */
    .block { padding: 32px 0; }
    .block-head {
      display: flex;
      align-items: baseline;
      gap: 12px;
      margin-bottom: 16px;
    }
    .block-emoji { font-size: 1.4em; }
    .block-title {
      font-size: 1.25rem;
      color: var(--text);
    }
    .block-meta {
      margin-left: auto;
      font-size: 0.8rem;
      color: var(--text-mute);
      text-align: right;
      line-height: 1.35;
    }
    /* 区块头里的排序控件（2026-09-26 新增：可攻打星球）。
       放区块头而不是内容区：区块头本来就是"标题 + 右侧 meta"的 flex 行，塞一个紧凑控件不改变版面，
       窄屏时随 .block-head 的 wrap 规则掉到第二行（该规则已在移动端断点里登记）。 */
    .sortbar { display: flex; gap: 6px; flex-wrap: wrap; align-self: center; }
    .sortbar button {
      padding: 3px 10px; border: 1px solid var(--line-2); border-radius: 999px;
      background: transparent; color: var(--text-dim); font-size: 0.74rem; cursor: pointer;
      font-family: inherit; transition: all 0.15s;
    }
    .sortbar button:hover { border-color: var(--yellow); color: var(--yellow); }
    .sortbar button.active { background: var(--yellow); color: #000; border-color: var(--yellow); font-weight: 600; }
    .pd-chip.poi-adj { border-color: rgba(148, 163, 184, 0.4); color: var(--text-dim); }

    /* DSS 停靠位置已移入面板内部（.dss-hud .dss-loc），原 #dss-meta 规则作废 */

    /* ============================================================
       区块1：重要指令
       ============================================================ */
    .mo-brief {
      color: var(--text-dim);
      font-size: 0.95rem;
      margin: 0 0 16px;
    }
    .mo-brief strong {
      color: var(--yellow);
      font-weight: 600;
    }
    .mo-tasks {
      display: flex;
      flex-direction: column;
      gap: 12px;
      margin-bottom: 20px;
    }
    .mo-task {
      background: rgba(255, 255, 255, 0.03);
      border: 1px solid var(--border);
      border-radius: var(--radius-s);
      padding: 12px 14px;
    }
    .mo-task-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 0.85rem;
      color: var(--text-dim);
      margin-bottom: 6px;
    }
    .mo-task-progress {
      font-weight: 700;
      color: var(--text);
    }
    .mo-sub {
      background: rgba(255, 255, 255, 0.02);
      border: 1px solid var(--border);
      border-radius: var(--radius-s);
      padding: 14px;
      margin-top: 4px;
    }
    .progress-bar {
      width: 100%;
      height: 8px;
      border-radius: 4px;
      background: rgba(255, 255, 255, 0.08);
      overflow: hidden;
      position: relative;
    }
    .progress-bar-fill {
      height: 100%;
      background: linear-gradient(90deg, var(--yellow-3) 0%, var(--yellow) 100%);
      border-radius: 4px;
      transition: width 0.4s ease;
    }
    /* 预期进度刻度（重要指令）：进度条上的一条竖线，标出「此刻应在的位置」 */
    .progress-bar-mark {
      position: absolute;
      top: 0;
      bottom: 0;
      width: 2px;
      margin-left: -1px;
      background: var(--blue, #3B82F6);
      box-shadow: 0 0 5px rgba(59, 130, 246, 0.95);
    }
    .mo-expect {
      margin-top: 6px;
      font-size: 0.76rem;
      color: var(--text-mute);
      font-family: var(--font-mono, Consolas, monospace);
    }
    .mo-expect b {
      color: var(--text);
      font-weight: 700;
    }
    .mo-expect .ok {
      color: var(--ok);
      font-weight: 700;
    }
    .mo-expect .behind {
      color: var(--warn);
      font-weight: 700;
    }
    /* 预计完成时间那行里的次要信息（速率与来源）*/
    .mo-expect + .mo-expect { margin-top: 2px; }
    .mo-expect .dim { color: var(--text-mute); font-weight: 400; }
    .mo-task-type {
      font-size: 0.75rem;
      color: var(--text-mute);
      margin-top: 4px;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }
    .mo-targets {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
    }
    .mo-target-card {
      flex: 1 1 220px;
      min-width: 0;
    }
    .mo-target-card .planet-card { margin: 0; }

    /* ============================================================
       区块2 & 区块3：星球卡片
       ============================================================ */
    .planet-grid {
      display: grid;
      width: 100%;
      grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
      gap: 14px;
    }
    .planet-card {
      max-width: 100%;
      background: var(--card-bg);
      backdrop-filter: var(--blur);
      -webkit-backdrop-filter: var(--blur);
      border: 1px solid var(--border);
      border-left: 4px solid var(--c-unknown);
      border-radius: var(--radius);
      padding: 14px 16px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      transition: border-color 0.2s, background 0.2s, transform 0.2s;
      cursor: pointer;
    }
    .planet-card:hover {
      background: var(--card-h);
      transform: translateY(-2px);
    }
    .planet-card.owner-humans     { border-left-color: var(--c-humans); }
    .planet-card.owner-terminids  { border-left-color: var(--c-terminids); }
    .planet-card.owner-automaton  { border-left-color: var(--c-automaton); }
    .planet-card.owner-illuminate { border-left-color: var(--c-illuminate); }
    .planet-card.owner-unknown    { border-left-color: var(--c-unknown); }

    .planet-name {
      font-size: 1rem;
      font-weight: 700;
      color: var(--text);
      line-height: 1.3;
    }
    .planet-name-en {
      font-size: 0.7rem;
      color: var(--text-mute);
      text-transform: uppercase;
      letter-spacing: 0.05em;
      font-weight: 500;
    }
    .planet-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
      font-size: 0.75rem;
      color: var(--text-dim);
    }
    .owner-tag {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px 8px;
      border-radius: 4px;
      background: rgba(255, 255, 255, 0.06);
      font-size: 0.7rem;
      font-weight: 600;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }
    .owner-humans     .owner-tag { background: rgba(91, 163, 208, 0.16); color: #7FC0E8; }
    .owner-terminids  .owner-tag { background: rgba(245, 197, 24, 0.15); color: var(--yellow); }
    .owner-automaton  .owner-tag { background: rgba(214, 128, 109, 0.18); color: #E8A08F; }
    .owner-illuminate .owner-tag { background: rgba(207, 100, 248, 0.18); color: #D99AF5; }
    .owner-unknown    .owner-tag { background: rgba(107, 114, 128, 0.18); color: #9CA3AF; }

    .status-tag {
      padding: 2px 8px;
      border-radius: 4px;
      font-size: 0.7rem;
      font-weight: 600;
    }
    .status-defend    { background: rgba(91, 163, 208, 0.16); color: #7FC0E8; }
    .status-liberate  { background: rgba(245, 197, 24, 0.15); color: var(--yellow); }
    .status-mo        { background: rgba(255, 140, 0, 0.18); color: #FFA940; }
    .status-liberated { background: rgba(46, 204, 113, 0.18); color: #5DDB8E; }
    .status-occupied  { background: rgba(214, 128, 109, 0.18); color: #E8A08F; }
    .status-idle      { background: rgba(107, 114, 128, 0.15); color: #9CA3AF; }

    /* DSS 模块 */
    .dss-station { display: flex; flex-direction: column; gap: 12px; }
    .dss-location { font-size: 0.95rem; color: var(--text); }
    .dss-effects { display: flex; flex-direction: column; gap: 10px; }
    .dss-effect {
      background: var(--card-bg);
      border-left: 3px solid var(--yellow);
      border-radius: 8px;
      padding: 10px 14px;
    }
    /* DSS 红底通知（未停靠时） */
    .dss-notice {
      background: rgba(231, 76, 60, 0.14);
      border: 1px solid rgba(231, 76, 60, 0.5);
      border-radius: 10px;
      color: #F08A7D;
      padding: 10px 14px;
      font-size: 0.9rem;
      margin-bottom: 10px;
    }
    /* DSS buff 卡片 */
    .dss-passive, .dss-buff {
      background: var(--card-bg);
      border-radius: 8px;
      padding: 10px 14px;
    }
    .dss-passive { border-left: 3px solid var(--yellow); }
    .dss-buff-on  { border-left: 3px solid #2ECC71; }
    .dss-buff-off { border-left: 3px solid var(--border); opacity: 0.75; }
    .dss-buff-head {
      display: flex; justify-content: space-between; align-items: center;
      margin-bottom: 4px; gap: 8px;
    }
    .dss-buff-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
    .dss-action-icon {
      width: 26px; height: 26px; object-fit: contain; flex-shrink: 0;
      border-radius: 4px; background: rgba(255,255,255,0.06);
    }
    .dss-emoji-fallback { font-size: 1.15rem; line-height: 1; flex-shrink: 0; }
    .dss-buff-head strong { color: var(--text); font-size: 0.92rem; }
    .dss-buff-status { font-size: 0.78rem; padding: 2px 8px; border-radius: 10px; }
    .st-on { background: rgba(46, 204, 113, 0.18); color: #5DDB8E; }
    .st-off { background: rgba(107, 114, 128, 0.15); color: #9CA3AF; }
    .dss-votes { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
    .dss-passive { margin-top: 10px; }
    .dss-effect strong { color: var(--yellow); font-size: 0.92rem; }
    .dss-effect-desc {
      margin-top: 4px;
      color: var(--text-dim);
      font-size: 0.85rem;
      line-height: 1.55;
    }
    .dss-progress { margin-top: 8px; }
    .dss-bar-bg { width: 100%; height: 8px; background: rgba(255,255,255,0.08); border-radius: 4px; overflow: hidden; }
    .dss-bar-fill { height: 100%; border-radius: 4px; transition: width 0.5s; }
    .dss-bar-label { font-size: 0.7rem; color: var(--text-mute); margin-top: 3px; }

    .hp-bar {
      width: 100%;
      height: 4px;
      border-radius: 2px;
      background: rgba(255, 255, 255, 0.08);
      overflow: hidden;
      margin-top: 4px;
    }
    .hp-bar-fill {
      height: 100%;
      background: var(--yellow);
      transition: width 0.4s ease;
    }
    /* 血量条三色：红(0-30%) 黄(30.1-60%) 绿(60.1-100%) */
    .hp-low  { background: #E74C3C; }
    .hp-mid  { background: #F5C518; }
    .hp-high { background: #2ECC71; }
    .planet-hp {
      font-size: 0.7rem;
      color: var(--text-mute);
      text-align: right;
    }

    /* 区块3：星区目录 */
    .sector-group {
      border: 1px solid var(--border);
      border-radius: var(--radius);
      margin-bottom: 12px;
      overflow: hidden;
      background: var(--card-bg);
    }
    .sector-head {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 12px 16px;
      cursor: pointer;
      user-select: none;
      transition: background 0.15s;
    }
    .sector-head:hover { background: var(--card-h); }
    .sector-chevron {
      display: inline-block;
      transition: transform 0.2s;
      color: var(--text-mute);
      font-size: 0.7em;
    }
    .sector-group.open .sector-chevron { transform: rotate(90deg); }
    .sector-name {
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      font-size: 0.95rem;
    }
    .sector-name-en {
      color: var(--text-mute);
      font-size: 0.8rem;
      font-weight: 400;
      text-transform: none;
      letter-spacing: 0.01em;
      margin-left: 4px;
    }
    .sector-count {
      margin-left: auto;
      color: var(--text-mute);
      font-size: 0.8rem;
    }
    .sector-body {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.3s ease;
    }
    .sector-group.open .sector-body {
      max-height: 4000px;
    }
    .sector-body-inner {
      padding: 0 12px 12px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .sector-body .planet-card {
      padding: 10px 12px;
    }
    .sector-body .planet-name { font-size: 0.9rem; }

    /* ============================================================
       悬浮资讯窗
       ============================================================ */
    /* 返回顶部（2026-09-15）：固定左下角 —— 右下角被「最新资讯」浮层占用（fixed/60vh），
       叠在那边会被展开的资讯面板盖住。滚动超过一屏才出现。 */
    #back-to-top {
      position: fixed; left: 18px; bottom: 18px; z-index: 41;
      display: none; align-items: center; gap: 6px;
      padding: 8px 12px; cursor: pointer;
      font-family: inherit; font-size: .78rem; letter-spacing: .06em;
      color: var(--yellow); background: var(--panel);
      border: 1px solid var(--brass); border-radius: 0;
    }
    #back-to-top.on { display: flex; }
    #back-to-top:hover { background: #1A1200; color: #FFD24A; border-color: var(--yellow); }
    #back-to-top .ar { font-size: .9rem; line-height: 1; }

    .news-float {
      position: fixed;
      right: 18px;
      bottom: 18px;
      width: 320px;
      max-height: 60vh;
      background: rgba(11, 14, 20, 0.85);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
      z-index: 40;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      transition: transform 0.25s ease, opacity 0.25s ease;
    }
    .news-float.collapsed {
      transform: translateY(calc(100% - 44px));
    }
    .news-float-head {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 10px 14px;
      border-bottom: 1px solid var(--border);
      cursor: pointer;
      user-select: none;
    }
    .news-float-title {
      font-weight: 700;
      font-size: 0.9rem;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .news-float-toggle {
      margin-left: auto;
      color: var(--text-mute);
      font-size: 0.85rem;
      transition: transform 0.2s;
    }
    .news-float.collapsed .news-float-toggle { transform: rotate(180deg); }
    .news-float-body {
      overflow-y: auto;
      flex: 1;
      padding: 6px 0;
    }
    .news-item {
      padding: 10px 14px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.04);
      font-size: 0.82rem;
      color: var(--text-dim);
    }
    .news-item:last-child { border-bottom: none; }
    .news-item-title {
      color: var(--yellow);
      font-weight: 700;
      font-size: 0.78rem;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      margin-bottom: 4px;
    }
    .news-item-time {
      color: var(--text-mute);
      font-size: 0.7rem;
      margin-top: 4px;
    }

    /* ============================================================
       页脚
       ============================================================ */
    footer {
      margin-top: 64px;
      padding: 32px 0 24px;
      border-top: 1px solid var(--border);
      background: rgba(0, 0, 0, 0.25);
    }
    .footer-grid {
      display: grid;
      grid-template-columns: 1.4fr 1fr 1fr;
      gap: 28px;
    }
    .footer-col h4 {
      font-size: 0.85rem;
      color: var(--yellow);
      margin-bottom: 10px;
    }
    .footer-col p, .footer-col a {
      color: var(--text-dim);
      font-size: 0.82rem;
      line-height: 1.7;
      display: block;
    }
    .footer-bottom {
      text-align: center;
      color: var(--text-mute);
      font-size: 0.75rem;
      margin-top: 24px;
      padding-top: 16px;
      border-top: 1px solid var(--border);
    }

    /* ============================================================
       工具
       ============================================================ */
    .player-dist-bar {
      display: flex;
      height: 10px;
      border-radius: 6px;
      overflow: hidden;
      margin: 10px 0 14px;
      background: rgba(255,255,255,0.04);
    }
    .player-dist-seg { height: 100%; transition: width 0.6s ease; }
    .player-dist-legend { display: flex; flex-wrap: wrap; gap: 14px; }
    .player-dist-item {
      display: flex; align-items: center; gap: 6px;
      font-size: 0.78rem; color: var(--text-dim);
    }
    .player-dist-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
    .player-dist-item strong { color: var(--text); font-weight: 600; }
    .player-dist-total {
      font-size: 0.8rem; color: var(--text);
      margin-top: 10px; font-weight: 600;
    }
        /* 侦察战 侦察 卡片 */
    .recon-card { background: rgba(255,255,255,0.04); backdrop-filter: blur(12px); border: 1px solid var(--border); border-radius: 14px; padding: 14px; }
    .recon-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
    .recon-tag { background: rgba(231,76,60,0.2); color: #FF6B5E; font-size: 0.68rem; font-weight: 800; padding: 2px 10px; border-radius: 6px; letter-spacing: 0.1em; border: 1px solid rgba(231,76,60,0.4); }
    .recon-name { font-size: 0.9rem; font-weight: 700; color: var(--text); }
    .recon-sector { font-size: 0.7rem; color: var(--text-dim); }
    .recon-rate-big { font-size: 1.7rem; font-weight: 800; line-height: 1.1; }
    .recon-rate-big-good { color: #2ECC71; }
    .recon-rate-big-bad { color: #E74C3C; }
    .recon-rate-label { font-size: 0.68rem; color: var(--text-dim); letter-spacing: 0.05em; }
    .recon-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
    .recon-metric { background: rgba(255,255,255,0.03); border-radius: 10px; padding: 8px 10px; }
    .recon-metric-label { font-size: 0.62rem; color: var(--text-dim); }
    .recon-metric-val { font-size: 0.95rem; font-weight: 700; }
    .recon-metric-val-good { color: #2ECC71; }
    .recon-metric-val-bad { color: #E74C3C; }
    .recon-metric-val-info { color: #CF64F8; }
    .recon-metric-val-death { color: #9CA3AF; }
    .recon-footer { display: flex; justify-content: space-between; font-size: 0.66rem; color: var(--text-dim); margin-top: 10px; flex-wrap: wrap; gap: 4px; }
    /* 防御战双进度条 */
    .defense-bars { display: flex; flex-direction: column; gap: 5px; margin: 4px 0; }
    .defense-bar-row { display: flex; align-items: center; gap: 6px; font-size: 0.66rem; color: var(--text-dim); }
    .defense-bar-label { width: 46px; flex-shrink: 0; text-align: right; }
    .defense-bar-track { flex: 1; height: 7px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden; }
    .defense-bar-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
    .defense-bar-val { width: 44px; flex-shrink: 0; text-align: right; font-weight: 700; color: var(--text); font-size: 0.7rem; }
    .defense-meta { display: flex; justify-content: space-between; align-items: center; margin-top: 3px; font-size: 0.68rem; }
    .defense-timer { color: var(--yellow); font-weight: 600; }
    .defense-status { font-weight: 700; font-size: 0.7rem; padding: 1px 8px; border-radius: 10px; }
    .defense-status-winning { color: #2ECC71; background: rgba(46,204,113,0.15); }
    .defense-status-losing { color: #E74C3C; background: rgba(231,76,60,0.15); }
    .defense-status-stalemate { color: #F5C518; background: rgba(245,197,24,0.15); }
    .defense-alert { font-size: 0.62rem; color: #E74C3C; font-weight: 700; letter-spacing: 0.08em; }
    .stratagem-toolbar { margin-bottom: 14px; display: flex; gap: 10px; flex-wrap: wrap; }
    .stratagem-big-btn-wrap { display: flex; justify-content: center; padding: 30px 0; gap: 14px; flex-wrap: wrap; }
    .stratagem-big-btn {
      background: linear-gradient(135deg, rgba(245,197,24,0.25), rgba(245,197,24,0.08));
      border: 1px solid rgba(245,197,24,0.5);
      color: var(--yellow);
      font-size: 1.15rem;
      font-weight: 700;
      padding: 18px 48px;
      border-radius: 14px;
      cursor: pointer;
      transition: all 0.25s;
      box-shadow: 0 4px 20px rgba(245,197,24,0.15);
      letter-spacing: 0.03em;
    }
    .stratagem-big-btn:hover { background: rgba(245,197,24,0.3); transform: translateY(-2px); box-shadow: 0 6px 28px rgba(245,197,24,0.25); }
    .stratagem-big-btn:active { transform: translateY(0); }
    /* ---- 平衡随机（2026-09-29 新增）：蓝色系区分于纯随机 ---- */
    .stratagem-big-btn.strat-big-alt {
      background: linear-gradient(135deg, rgba(91,163,208,0.25), rgba(59,130,246,0.07));
      border-color: rgba(91,163,208,0.5);
      color: #93c5fd;
      font-size: 1.05rem;
      box-shadow: 0 4px 20px rgba(59,130,246,0.15);
    }
    .stratagem-big-btn.strat-big-alt:hover { background: rgba(91,163,208,0.32); box-shadow: 0 6px 28px rgba(59,130,246,0.28); }
    .stratagem-btn.strat-btn-alt {
      background: linear-gradient(135deg, rgba(91,163,208,0.2), rgba(59,130,246,0.05));
      border-color: rgba(91,163,208,0.45);
      color: #93c5fd;
    }
    .stratagem-btn.strat-btn-alt:hover { background: rgba(91,163,208,0.3); }
    /* 当前用的是哪种随机：按钮描一圈，避免"点了没反应"的错觉 */
    .stratagem-btn.strat-btn-on { box-shadow: inset 0 0 0 1px currentColor; }
    .stratagem-btn {
      background: linear-gradient(135deg, rgba(245,197,24,0.2), rgba(245,197,24,0.05));
      border: 1px solid rgba(245,197,24,0.4);
      color: var(--yellow);
      font-size: 0.9rem;
      font-weight: 600;
      padding: 10px 24px;
      border-radius: 10px;
      cursor: pointer;
      transition: all 0.2s;
    }
    .stratagem-btn:hover { background: rgba(245,197,24,0.25); transform: translateY(-1px); }
    .stratagem-btn:active { transform: translateY(0); }
    /* 布局：左卡片区 + 右评分区 */
    .stratagem-layout { display: flex; gap: 18px; align-items: flex-start; }
    .stratagem-cards { flex: 1 1 420px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .strat-card {
      position: relative;
      background: rgba(255,255,255,0.04);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 14px;
      display: flex; flex-direction: column; gap: 8px;
      transition: border-color 0.3s, box-shadow 0.3s;
    }
    /* S级光晕 */
    .strat-card.strat-card-S {
      border-color: rgba(245,197,24,0.7);
      box-shadow: 0 0 18px rgba(245,197,24,0.25), inset 0 0 12px rgba(245,197,24,0.05);
      animation: stratGlowPulse 2s ease-in-out infinite;
    }
    @keyframes stratGlowPulse {
      0%, 100% { box-shadow: 0 0 14px rgba(245,197,24,0.2), inset 0 0 10px rgba(245,197,24,0.04); }
      50% { box-shadow: 0 0 26px rgba(245,197,24,0.4), inset 0 0 16px rgba(245,197,24,0.08); }
    }
    .strat-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
    .strat-card-name { font-size: 0.88rem; font-weight: 700; color: var(--text); line-height: 1.3; flex: 1; }
    .strat-card-type {
      display: inline-block; flex-shrink: 0;
      font-size: 0.66rem; font-weight: 600;
      padding: 2px 10px; border-radius: 20px;
    }
    .strat-card-icon { width: 28px; height: 28px; object-fit: contain; flex-shrink: 0; border-radius: 4px; }
    @media (max-width: 767px) { .strat-card-icon { width: 24px; height: 24px; } }
    /* 四维进度条 */
    .strat-bar { display: flex; align-items: center; gap: 8px; font-size: 0.7rem; color: var(--text-dim); }
    .strat-bar-label { width: 52px; flex-shrink: 0; text-align: right; }
    .strat-bar-track { flex: 1; height: 7px; background: rgba(255,255,255,0.06); border-radius: 4px; overflow: hidden; }
    .strat-bar-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
    .strat-bar-val { width: 18px; flex-shrink: 0; text-align: right; font-weight: 700; color: var(--text); }
    .strat-card-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 2px; }
    .strat-card-bonus { font-size: 0.72rem; }
    .strat-bonus-pos { color: #2ECC71; }
    .strat-bonus-neg { color: #E74C3C; }
    .strat-bonus-zero { color: var(--text-dim); }
    .strat-swap-btn {
      font-size: 0.66rem;
      color: var(--text-dim);
      background: rgba(255,255,255,0.05);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 3px 10px;
      cursor: pointer;
      transition: all 0.15s;
    }
    .strat-swap-btn:hover { color: var(--yellow); border-color: rgba(245,197,24,0.5); }
    /* 右侧评分区 */
    .strat-side { flex: 0 0 280px; display: flex; flex-direction: column; gap: 14px; }
    .strat-panel {
      background: rgba(255,255,255,0.04);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 16px;
      display: flex; flex-direction: column; gap: 10px;
    }
    .strat-panel-title { font-size: 0.85rem; font-weight: 700; color: var(--text); }
    .strat-panel-row { display: flex; justify-content: space-between; font-size: 0.78rem; color: var(--text-dim); }
    .strat-panel-row strong { color: var(--text); font-weight: 600; }
    .strat-panel-divider { border-top: 1px dashed var(--border); margin: 2px 0; }
    .strat-total { font-size: 1.05rem; font-weight: 700; color: var(--text); }
    .strat-grade { font-size: 1.8rem; font-weight: 800; line-height: 1; }
    .strat-grade-S { color: #F5C518; text-shadow: 0 0 16px rgba(245,197,24,0.5); font-size: 2.3rem; }
    .strat-grade-A { color: #5BA3D0; }
    .strat-grade-B { color: #2ECC71; }
    .strat-grade-C { color: #6B7280; }
    .strat-grade-D { color: #E74C3C; }
    .strat-grade-guide { font-size: 0.66rem; color: var(--text-dim); line-height: 1.6; border-top: 1px solid var(--border); padding-top: 8px; }
    .strat-hint { font-size: 0.72rem; color: var(--text-dim); font-style: italic; }
    /* 四维柱状统计图 */
    .strat-chart {
      background: rgba(255,255,255,0.04);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 16px;
      display: flex; flex-direction: column; gap: 10px;
    }
    .strat-chart-title { font-size: 0.85rem; font-weight: 700; color: var(--text); }
    .strat-chart-bar { display: flex; align-items: center; gap: 8px; font-size: 0.72rem; color: var(--text-dim); }
    .strat-chart-label { width: 60px; flex-shrink: 0; text-align: right; }
    .strat-chart-track { flex: 1; height: 10px; background: rgba(255,255,255,0.06); border-radius: 5px; overflow: hidden; }
    .strat-chart-fill { height: 100%; border-radius: 5px; transition: width 0.6s ease; }
    .strat-chart-val { width: 32px; flex-shrink: 0; text-align: right; font-weight: 700; color: var(--text); }
    .strat-empty { color: var(--text-dim); font-size: 0.8rem; padding: 20px 0; }
    /* 换一个弹层 */
    .strat-modal-mask {
      position: fixed; inset: 0; z-index: 999;
      background: rgba(0,0,0,0.6);
      display: flex; align-items: center; justify-content: center;
      backdrop-filter: blur(4px);
    }
    .strat-modal {
      background: var(--panel-bg, #141926);
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 18px;
      width: min(480px, 90vw);
      max-height: 70vh;
      display: flex; flex-direction: column; gap: 12px;
    }
    .strat-modal-head { display: flex; justify-content: space-between; align-items: center; }
    .strat-modal-title { font-size: 0.9rem; font-weight: 700; color: var(--text); }
    .strat-modal-close { cursor: pointer; color: var(--text-dim); font-size: 1.1rem; padding: 0 4px; }
    .strat-modal-close:hover { color: var(--text); }
    .strat-modal-list { display: flex; flex-direction: column; gap: 6px; overflow-y: auto; }
    .strat-modal-item {
      display: flex; justify-content: space-between; align-items: center;
      font-size: 0.78rem;
      color: var(--text);
      background: rgba(255,255,255,0.03);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 8px 12px;
      cursor: pointer;
      transition: all 0.15s;
    }
    .strat-modal-item:hover { border-color: rgba(245,197,24,0.5); background: rgba(245,197,24,0.06); }
    .strat-modal-item-stats { color: var(--text-dim); font-size: 0.7rem; }
    @media (max-width: 767px) {
      .stratagem-layout { flex-direction: column; }
      .stratagem-cards { grid-template-columns: repeat(2, 1fr); gap: 8px; }
      .strat-side { flex-basis: 100%; }
      /* 手机端：压缩卡片，提高密度 */
      .strat-card { padding: 10px 12px; gap: 6px; border-radius: 10px; margin-bottom: 8px; }
      .strat-card-name { font-size: 0.95rem; }
      .strat-card-type { font-size: 0.62rem; padding: 1px 8px; }
      /* 评分项改两列网格，紧凑标签-数值 */
      .strat-bar { gap: 4px; font-size: 0.78rem; }
      .strat-bar-label { width: 34px; font-size: 0.72rem; }
      .strat-bar-track { height: 6px; }
      .strat-bar-val { width: 16px; font-size: 0.72rem; }
      .strat-card-footer { flex-wrap: wrap; gap: 4px; }
      .strat-card-bonus { font-size: 0.68rem; }
      .strat-swap-btn { padding: 4px 12px; font-size: 0.75rem; height: auto; }
    }
    @media (max-width: 640px) {
      /* 更窄屏：评分项改为两列网格，卡片保持两列 */
      .strat-bar { display: inline-flex; width: calc(50% - 3px); }
    }
    
.prospect-desc {
      font-size: 0.75rem;
      color: var(--text-dim);
      background: rgba(255,255,255,0.03);
      border: 1px dashed var(--border);
      border-radius: 10px;
      padding: 8px 14px;
      margin-bottom: 12px;
      line-height: 1.5;
    }
    .loading {
      color: var(--text-mute);
      font-size: 0.85rem;
      text-align: center;
      padding: 24px 0;
    }
    .error {
      color: #E08570;
      background: rgba(192, 64, 32, 0.1);
      border: 1px solid rgba(192, 64, 32, 0.3);
      border-radius: var(--radius-s);
      padding: 12px 14px;
      font-size: 0.85rem;
    }
    .empty {
      color: var(--text-mute);
      font-size: 0.85rem;
      text-align: center;
      padding: 24px 0;
    }
    .badge {
      display: inline-block;
      padding: 1px 6px;
      background: rgba(245, 197, 24, 0.15);
      color: var(--yellow);
      font-size: 0.7rem;
      font-weight: 700;
      border-radius: 3px;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }

    /* ============================================================
       响应式
       ============================================================ */
    @media (max-width: 720px) {
      .container { padding: 0 14px; }
      .hero { padding: 48px 0 28px; }
      .topnav-inner { gap: 8px; }
      .brand-title { font-size: 0.9rem; }
      .nav-cta { padding: 6px 10px; font-size: 0.78rem; }
      /* 顶栏信息栏（只含「更新于」时间戳）在窄屏保留可见：
         2026-09 前这里是 display:none，连带把时间戳一起藏掉，用户以为「加载不出来」 */
      .topnav-meta { font-size: 0.68rem; }
      .footer-grid { grid-template-columns: 1fr; gap: 20px; }
      .news-float {
        right: 10px;
        bottom: 10px;
        left: 10px;
        width: auto;
        max-height: 50vh;
      }
      .block-head { flex-wrap: wrap; }
      .block-meta { width: 100%; margin-left: 0; }
    }
  
    .trend-chart-container {
      width: 100%;
      height: 250px;
      max-height: 250px;
      min-height: 250px;
      overflow: hidden;
      position: relative;
    }
    .trend-chart-container canvas {
      width: 100% !important;
      height: 100% !important;
      display: block;
    }

    /* ============================================================
       影响力统计卡（P3：自 inline style 抽取为规范类）
       ============================================================ */
    .impact-row {
      display: flex;
      gap: 24px;
      flex-wrap: wrap;
      align-items: center;
    }
    .impact-stat .l { font-size: 0.7rem; color: var(--text-dim); }
    .impact-stat .n { font-size: 1.5rem; font-weight: 700; color: var(--text); }
    .impact-stat .n .unit { font-size: 0.8rem; font-weight: 400; color: var(--text-dim); }
    .impact-stat .n.pos { color: #22c55e; }
    .impact-stat .n.mid { color: #f59e0b; }
    .impact-stat .n.neg { color: #ef4444; }
    .impact-stat .d { font-size: 0.65rem; color: var(--text-dim); max-width: 280px; }
    .impact-trend { font-size: 0.85rem; }

    /* news 悬浮窗关闭 / 重开（P3） */
    .news-float-close {
      color: var(--text-mute);
      cursor: pointer;
      padding: 2px 6px;
      border-radius: 6px;
      font-size: 0.8rem;
    }
    .news-float-close:hover { color: var(--text); background: rgba(255,255,255,0.08); }
    .news-float.closed { display: none; }
    .news-reopen {
      position: fixed;
      right: 18px;
      bottom: 18px;
      z-index: 39;
      display: none;
      border: 1px solid var(--border);
      background: rgba(17,21,32,0.92);
      color: var(--yellow);
      border-radius: 999px;
      padding: 8px 14px;
      cursor: pointer;
      font-size: 0.85rem;
    }
    .news-reopen.show { display: block; }

    /* ============================================================
       DSS 民主空间站 —— 军事战术 HUD 版式（2026-09 改版）
       设计 token：#000 底 / #0F0F0F 面板 / #1F1F1F 描边 / #FFE600 强调
                    #FF4D2E 警告 / 斜纹分隔 45deg / 圆角一律 0
       ============================================================ */
    .dss-hud{
      --dss-panel:#0F0F0F;
      --dss-line:#1F1F1F;
      --dss-txt:#FFFFFF;
      --dss-dim:#9A9A9A;
      --dss-mute:#6E6E6E;
      --dss-y:#FFE600;
      --dss-warn:#FF4D2E;
      --dss-slot:#1A1A1A;
      --dss-stripe:repeating-linear-gradient(45deg,#1A1500 0 6px,transparent 6px 12px);
      --dss-stripe-warn:repeating-linear-gradient(45deg,#3A1200 0 6px,transparent 6px 12px);
      --dss-stripe-red:repeating-linear-gradient(45deg,#FF4D2E 0 8px,#7A1F0E 8px 16px);
      --dss-mono:"SourceHanSans","Microsoft YaHei","PingFang SC",sans-serif;   /* 2026-09-13：DSS 也并入思源黑体 */
      background:#000;
      border:1px solid var(--dss-line);
      color:var(--dss-txt);
      display:flex;flex-direction:column;gap:0;
    }
    .dss-hud *{box-sizing:border-box}
    .dss-hud .num,.dss-hud .pct,.dss-hud .n,.dss-hud .ver,.dss-hud .don,.dss-hud .lbl,
    .dss-hud .dss-bar-label,.dss-hud .box,.dss-hud .strip,.dss-hud .s{
      font-family:var(--dss-mono);font-weight:700;letter-spacing:.02em;
    }

    /* ---------- 顶部：标题（左） + 停靠位置（右）
         原「总结1 / 行动2 / 地点3」是游戏内 UI 的复刻，按用户要求删除；
         区块标题由 .block-head 移入面板，停靠位置同时从区块头挪到面板右上角 ---------- */
    .dss-hud .dss-top{
      display:flex;align-items:center;justify-content:space-between;gap:16px;
      padding:9px 12px;min-height:56px;background:var(--dss-panel);
    }
    .dss-hud .dss-title{
      margin:0;display:flex;align-items:center;gap:9px;
      font-size:15px;font-weight:700;color:var(--dss-txt);letter-spacing:.06em;
    }
    .dss-hud .dss-title::before{content:"";width:4px;height:16px;background:var(--dss-y);flex:0 0 4px}
    .dss-hud .dss-loc{
      font-family:var(--dss-mono);font-weight:700;font-size:12.5px;
      color:#C9C9C9;letter-spacing:.04em;
      min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right;
    }
    .dss-hud .dss-div{height:5px;background:var(--dss-stripe);border-top:1px solid #241F00;border-bottom:1px solid #241F00}

    /* ---------- 主体 2 列 ---------- */
    .dss-hud .dss-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:14px;padding:12px;align-items:start}
    @media (max-width:1023px){ .dss-hud .dss-grid{grid-template-columns:1fr} }

    /* 小节标题 */
    .dss-hud .dss-sec{
      display:flex;align-items:center;gap:8px;background:var(--dss-stripe);
      border:1px solid #3A3300;padding:5px 10px;
    }
    .dss-hud .dss-sec.small{margin-top:14px;padding:4px 9px}
    .dss-hud .dss-sec h4{margin:0;font-size:13px;font-weight:600;color:var(--dss-y);letter-spacing:.12em}
    .dss-hud .dss-sec .n{margin-left:auto;font-size:11px;color:var(--dss-mute)}
    .dss-hud .dss-note{
      font-size:11.5px;color:var(--dss-mute);line-height:1.6;
      margin:0;padding:7px 2px 9px;border-bottom:1px dashed #1B1B1B;
    }
    .dss-hud .dss-votes{display:flex;flex-direction:column;gap:0}

    /* ---------- 行动卡片 ---------- */
    .dss-hud .dss-buff{
      position:relative;border:1px solid var(--dss-line);background:var(--dss-panel);
      border-radius:0;padding:9px 11px;margin-top:7px;
      display:grid;grid-template-columns:16px minmax(0,1fr) auto;
      gap:10px;align-items:center;
    }
    .dss-hud .dss-buff.sel{border:2px solid var(--dss-y);padding-bottom:0}
    .dss-hud .dss-buff .ico{
      width:16px;height:16px;flex-shrink:0;background:#2A2A2A;border-radius:0;
      display:grid;place-items:center;overflow:hidden;
    }
    .dss-hud .dss-buff .ico img{width:16px;height:16px;object-fit:contain;display:block}
    .dss-hud .dss-buff .dss-emoji-fallback{font-size:12px;line-height:1}
    .dss-hud .dss-buff .mid{min-width:0}
    .dss-hud .dss-buff .t{font-size:13.5px;font-weight:600;color:var(--dss-txt);line-height:1.25;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .dss-hud .dss-buff .s{font-size:10.5px;color:var(--dss-mute);margin-top:3px;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .dss-hud .dss-buff .pct{font-size:12.5px;color:var(--dss-y);line-height:1;text-align:right}
    .dss-hud .dss-buff .dss-bar-bg{
      grid-column:1 / -1;height:3px;background:var(--dss-slot);
      border-radius:0;overflow:hidden;margin-top:8px;
    }
    .dss-hud .dss-buff .dss-bar-fill{height:100%;background:var(--dss-y);border-radius:0;transition:width .5s}
    .dss-hud .dss-buff .dss-bar-label{
      grid-column:1 / -1;font-size:10.5px;color:var(--dss-mute);margin-top:5px;
    }
    /* 激活：底部条与右栏一致改用绿色（可用时间），不再用红橙警告色 */
    .dss-hud .dss-buff .strip{
      grid-column:1 / -1;margin:8px -11px 0;padding:5px 11px;text-align:center;
      background:#1FA84A;color:#EFFFF2;font-size:12px;letter-spacing:.06em;
    }
    .dss-hud .dss-buff.active .dss-bar-bg{margin-top:6px}
    /* 冷却：右上角黄色角标（无圆角，≤18px 高） */
    .dss-hud .dss-buff .dss-pill{
      position:absolute;top:-1px;right:-1px;height:18px;display:flex;align-items:center;
      padding:0 7px;background:var(--dss-y);color:#000;font-size:10.5px;letter-spacing:.06em;
    }
    .dss-hud .dss-buff.cd{opacity:.92}
    .dss-hud .dss-buff.cd .dss-bar-bg{display:none}

    /* 常驻被动 */
    .dss-hud .dss-passive{border:1px solid var(--dss-line);background:var(--dss-panel);border-radius:0;padding:0 11px 11px;margin-top:0}
    .dss-hud .dss-passive .pv-name{font-size:13px;font-weight:600;color:var(--dss-txt);margin-top:9px}
    .dss-hud .dss-effect-desc{margin:5px 0 0;color:var(--dss-dim);font-size:12px;line-height:1.65}

    /* ---------- 右侧详情 ---------- */
    .dss-hud .dss-col-r{border:1px solid var(--dss-line);background:var(--dss-panel)}
    .dss-hud .dss-hero{
      position:relative;height:272px;overflow:hidden;border-bottom:1px solid var(--dss-line);
      background:
        radial-gradient(420px 200px at 62% 48%, rgba(120,150,190,.16), transparent 70%),
        linear-gradient(180deg,#05070C 0%,#000 100%);
    }
    /* 行动大图（素材 995×357，容器 272px 高，cover 裁切以保持满宽） */
    .dss-hud .dss-hero img{
      position:absolute;inset:0;width:100%;height:100%;
      object-fit:cover;object-position:center;display:block;border-radius:0;
    }
    .dss-hud .dss-hero svg{position:absolute;inset:0;width:100%;height:100%;display:block}
    .dss-hud .dss-jump{
      position:absolute;top:12px;right:12px;background:var(--dss-y);color:#000;
      font-family:var(--dss-mono);font-weight:700;font-size:11.5px;letter-spacing:.04em;
      padding:5px 10px;border-radius:0;white-space:nowrap;
      max-width:calc(100% - 24px);overflow:hidden;text-overflow:ellipsis;
    }
    .dss-hud .dss-detail{padding:13px 15px 15px}
    .dss-hud .dss-detail .tagline{display:flex;align-items:center;gap:8px}
    .dss-hud .dss-detail .tagline .bar-y{width:3px;height:15px;background:var(--dss-y)}
    .dss-hud .dss-detail .tagline span:last-child{font-size:12.5px;color:var(--dss-y);letter-spacing:.14em}
    .dss-hud .dss-detail h3{margin:0 0 9px;font-size:21px;font-weight:600;letter-spacing:.03em;color:var(--dss-txt)}
    .dss-hud .dss-detail .desc{
      font-size:12.5px;color:#B0B0B0;line-height:1.7;margin:0;
      border-top:1px solid #191919;padding-top:10px;
    }
    .dss-hud .dss-contrib{margin-top:14px}
    .dss-hud .dss-contrib .lbl{font-size:10.5px;color:var(--dss-mute);letter-spacing:.14em;margin-bottom:5px}
    /* 顶部数据条：只显示达成比例。
       未激活（募捐中）→ 黑底黄字；已激活 → 黄底黑字 */
    .dss-hud .dss-contrib .box{
      background:#000;color:var(--dss-y);
      border:1px solid #2A2A2A;
      text-align:center;font-size:15px;
      padding:7px 0;letter-spacing:.06em;border-radius:0;
      transition:background .2s,color .2s,border-color .2s;
    }
    .dss-hud .dss-detail.active .dss-contrib .box{
      background:var(--dss-y);color:#000;border-color:var(--dss-y);
    }
    /* 底部状态条：未激活＝红橙斜纹（募捐进度）；已激活＝绿色实心（可用时间） */
    .dss-hud .dss-count{margin-top:12px;height:24px;background:var(--dss-stripe-red);display:grid;place-items:center}
    .dss-hud .dss-count span{
      font-family:var(--dss-mono);font-weight:700;font-size:12.5px;color:#fff;
      background:#000;padding:1px 12px;letter-spacing:.05em;
    }
    .dss-hud .dss-detail.active .dss-count{background:#1FA84A}
    .dss-hud .dss-detail.active .dss-count span{color:#EFFFF2}

    /* ---------- 未停靠通知 ---------- */
    .dss-hud + .dss-notice, .dss-notice{
      border-radius:0;background:var(--dss-stripe-warn);
      border:1px solid #5A1F0A;border-left:3px solid #FF4D2E;
      color:#FFB59E;font-size:12.5px;padding:9px 12px;margin-bottom:10px;
    }
    .dss-notice b{color:#FF4D2E;font-family:var(--dss-mono);letter-spacing:.06em}

    /* ---------- 未停靠（离线）：下部面板压暗 + 居中大尺寸提示 ----------
       2026-09-21 用户要求，参照游戏内「目前无法使用」的观感：
       ① 深色遮罩只盖**下部面板**（.dss-grid），顶部标题/停靠位置保持原亮度；
       ② 红条从区块顶部移到遮罩正中央。
       遮罩 pointer-events:none —— 纯视觉层，不抢卡片点击（行动详情仍可展开）。
       2026-09-22 用户反馈「太小 + 和后面的字重叠」，据此两处加强：
       ③ 提示改成「红头 + 正文」两块的大面板（max-width 880px、正文 15px/1.7）；
       ④ 面板背景与遮罩都**不再半透明** —— 原斜纹是 transparent 打底，
          后面的正文会透出来与提示文字叠在一起；遮罩也由 .62 加深到 .82。 */
    .dss-hud .dss-grid-wrap{position:relative}
    .dss-hud .dss-offline-mask{
      position:absolute;inset:0;z-index:5;
      display:grid;place-items:center;padding:24px;
      background:rgba(2,4,8,.82);
      pointer-events:none;
    }
    .dss-hud .dss-offline-mask .dss-notice{
      margin:0;width:100%;max-width:880px;padding:0;
      background:#0B0604;                       /* 不透明，正文不再透出 */
      border:1px solid #5A1F0A;border-left:3px solid #FF4D2E;
      box-shadow:0 0 0 1px rgba(0,0,0,.75);
    }
    .dss-hud .dss-offline-mask .dss-notice-hd{
      padding:9px 20px;background:#1A0A04;border-bottom:2px solid #FF4D2E;
      color:#FF6A4A;font-family:var(--dss-mono);font-weight:700;
      font-size:14px;letter-spacing:.18em;line-height:1.3;
    }
    .dss-hud .dss-offline-mask .dss-notice-bd{
      padding:16px 20px;font-size:15px;line-height:1.7;color:#FFC9B8;
    }
    .dss-hud .dss-offline-mask .dss-notice-bd b{
      color:#FF4D2E;font-family:var(--dss-mono);letter-spacing:.06em;margin-right:8px;
    }
    @media (max-width:640px){
      .dss-hud .dss-offline-mask{padding:14px}
      .dss-hud .dss-offline-mask .dss-notice-bd{padding:13px 14px;font-size:13.5px}
      .dss-hud .dss-offline-mask .dss-notice-hd{padding:8px 14px;font-size:13px}
    }

    /* ============================================================
       星球卡片体系（2026-09-13 主页改版）
       Diegetic Tactical HUD / Diesel Punk：零圆角 · 零阴影 · 阵营色主导 · 高信息密度
       设计稿见 HD2-Galatic_war-Map/_card_demo.html；计划见根目录 HD2主页改版计划.md
       卡内局部变量 --fc / --fcd 由 .f-auto/.f-term/.f-illu/.f-hum 切换
       ============================================================ */
    /* 栅格：宽屏每行 4 张。列数 / 卡片宽 / 展开宽由 JS 的 layoutPlanetGrids() 算好后
       写进 --cols / --card-w / --band-w（页面卡片本来就全是 JS 渲染，布局交 JS 是安全的）。
       记两个坑，免得下次又踩：
       ① **minmax 的上限若是确定值，auto-fit 按「上限 + gap」算列数，不是按下限。**
          所以 repeat(auto-fit,minmax(340px,380px)) 在 1152px 可用宽下只有 2 列
          （floor((1152+14)/(380+14)) = 2；3 列要 1168px，只差 16px）。
       ② 改用 1fr 当上限虽然能自适应，但「卡片数不满一行」时空轨道会塌缩、剩余轨道被
          拉到 657px 宽，卡片被 max-width 卡在 380 后左对齐，两张卡之间出现巨大空洞。
       ③ 4 列 × 320px 需要 1322px，而 main.container 限宽 1200 → 内容仅 1152px，
          故卡片区要**突破文字栏**（--band-w 外扩），文字区仍保持 1200px。
       flex:0 0 auto 是给「卡片区落在 .mo-targets（display:flex）」的情况，
       否则 flex-shrink 会把外扩又压回去。 */
    .planet-grid{
      display:grid;gap:14px;align-items:start;justify-content:center;
      grid-template-columns:repeat(var(--cols, 2), minmax(0, var(--card-w, 380px)));
      width:var(--band-w, 100%);
      margin-left:calc(50% - var(--band-w, 100%) / 2);
      flex:0 0 auto;
    }

    .planet-card{
      --fc:var(--c-faction-hum);--fcd:var(--c-faction-hum-d);
      background:var(--bg-deep);
      border:2px solid var(--fc);
      border-radius:0;box-shadow:none;
      max-width:380px;overflow:hidden;
      display:flex;flex-direction:column;
    }
    .planet-card.f-auto{--fc:var(--c-faction-auto);--fcd:var(--c-faction-auto-d)}
    .planet-card.f-term{--fc:var(--c-faction-term);--fcd:var(--c-faction-term-d)}
    .planet-card.f-illu{--fc:var(--c-faction-illu);--fcd:var(--c-faction-illu-d)}
    .planet-card.f-hum {--fc:var(--c-faction-hum); --fcd:var(--c-faction-hum-d)}

    /* ---- 图标：尺寸只在这里控制；阵营色一律由 --fc 驱动 ---- */
    .planet-card .pc-ficon{width:18px;height:18px;flex:0 0 18px;display:block;fill:var(--fc)}
    .planet-card .pc-ficon path,.planet-card .pc-ficon polygon{fill:var(--fc)}
    .planet-card .pc-tico{width:16px;height:16px;flex:0 0 16px;display:block;fill:var(--fc)}
    .planet-card .pc-tico path,.planet-card .pc-tico polygon{fill:var(--fc)}
    .planet-card .pc-reinf{width:16px;height:16px;flex:0 0 16px;display:block}
    .planet-card .pc-campic{width:32px;height:32px;display:block}

    /* ---- ① 顶部状态条 ---- */
    .planet-card .pc-top{
      display:flex;align-items:center;gap:8px;height:38px;padding:0 10px;
      background:rgba(255,255,255,.02);border-bottom:1px solid var(--border);
    }
    .planet-card .pc-fname{
      font-size:12.5px;font-weight:700;color:var(--fc);letter-spacing:.06em;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .planet-card .pc-res{margin-left:auto;display:flex;align-items:center;gap:12px;flex-shrink:0}
    .planet-card .pc-res .item{display:flex;align-items:center;gap:5px}
    /* 原「R 申领点数」方块已移除（无数据源）；此处仅保留玩家数数字样式 */
    .planet-card .pc-res .num{
      font-family:var(--font-mono,Consolas,monospace);font-weight:700;
      font-size:13px;color:#FFF;letter-spacing:.02em;
    }

    /* ---- ② 环境图（按 biome 取 assets/biomes/，460×148） ---- */
    .planet-card .pc-landmark{
      position:relative;height:148px;flex:0 0 148px;overflow:hidden;
      border-bottom:1px solid var(--border);background:#0D1118;
    }
    .planet-card .pc-landmark img{width:100%;height:100%;object-fit:cover;display:block}
    /* 无环境图时的回退（ACCESS DENIED 等）：暗底 + 极淡斜纹，不喧宾夺主 */
    .planet-card .pc-landmark.pc-nobiome{
      background:
        repeating-linear-gradient(45deg, rgba(255,255,255,.035) 0 6px, transparent 6px 12px),
        linear-gradient(180deg,#151B26 0%,#0B0E14 100%);
    }
    .planet-card .pc-landmark.pc-nobiome::after{
      content:"NO LANDMARK";position:absolute;left:8px;bottom:6px;
      font-family:var(--font-mono,Consolas,monospace);font-size:9.5px;
      letter-spacing:.18em;color:rgba(255,255,255,.20);
    }

    /* ---- ③ 战役类型 + 星球名 ---- */
    .planet-card .pc-head{display:flex;align-items:center;gap:10px;padding:12px 12px 10px}
    .planet-card .pc-campwrap{width:34px;height:34px;flex:0 0 34px;display:grid;place-items:center}
    .planet-card .pc-headtxt{min-width:0;flex:1}
    .planet-card .pc-type{
      font-size:12px;color:var(--text);letter-spacing:.1em;line-height:1.2;display:block;
    }
    .planet-card .pc-name{
      font-size:19px;font-weight:700;color:var(--yellow);line-height:1.25;margin-top:2px;display:block;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .planet-card .pc-name.def{
      color:#FFF;font-family:var(--font-mono,Consolas,monospace);font-size:22px;
    }
    .planet-card .pc-desc{
      padding:0 12px 11px;font-size:11.5px;line-height:1.65;color:var(--text-dim);margin:0;
    }

    /* ---- ④ 进度条 ---- */
    .planet-card .pc-progress{padding:0 12px 10px}
    .planet-card .pc-bar{
      position:relative;height:9px;border-radius:0;display:flex;overflow:hidden;
    }
    .planet-card .pc-bar .fill{background:var(--fc);height:100%}
    .planet-card .pc-bar .slot{
      flex:1;height:100%;
      background:repeating-linear-gradient(45deg,var(--fcd) 0 6px,transparent 6px 12px);
    }
    .planet-card .pc-bar .cursor{
      position:absolute;left:0;top:50%;transform:translateY(-50%);z-index:1;
      width:0;height:0;border-top:5px solid transparent;border-bottom:5px solid transparent;
      border-left:6px solid var(--fc);
    }
    .planet-card .pc-stats{
      display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px;
    }
    .planet-card .pc-stats .k{font-size:11px;color:var(--text-mute)}
    .planet-card .pc-stats .v{
      font-family:var(--font-mono,Consolas,monospace);font-weight:700;font-size:11.5px;
    }
    .planet-card .pc-stats .v.dim{color:var(--text-dim)}
    .planet-card .pc-stats .r{display:flex;align-items:center;gap:6px;flex-shrink:0}
    /* 抵抗强度四档（阈值见 tokens.css） */
    .planet-card .pc-stats .v.res-low {color:var(--c-res-low)}
    .planet-card .pc-stats .v.res-mid {color:var(--c-res-mid)}
    .planet-card .pc-stats .v.res-high{color:var(--c-res-high)}
    .planet-card .pc-stats .v.res-max {color:var(--c-res-max)}

    /* ---- ④b 解放速率推演（2026-09-29 新增）：等效抵抗度 / 当前推进 / 实际推进 / 预计完成 ---- */
    .planet-card .pc-rate{
      display:flex;flex-direction:column;gap:4px;margin-top:7px;padding-top:7px;
      border-top:1px dashed rgba(255,255,255,.10);
    }
    /* ⚠ 必须允许换行：窄卡（三列布局 / 手机）上「实际推进速率 −0.624%/h」+「预计完成 预计无法完成解放」
       会超出一行宽度 —— 不给 flex-wrap 就会互相顶到一起、贴边裁切（实测过）。 */
    .planet-card .pc-rate-row{
      display:flex;align-items:baseline;justify-content:space-between;
      gap:4px 10px;flex-wrap:wrap;
    }
    .planet-card .pc-rate-row .pair{display:flex;align-items:baseline;gap:6px;min-width:0}
    .planet-card .pc-rate .k{font-size:10.5px;color:var(--text-mute);white-space:nowrap}
    .planet-card .pc-rate .v{
      font-family:var(--font-mono,Consolas,monospace);font-weight:700;font-size:11.5px;
      color:var(--text-dim);white-space:nowrap;text-align:right;
    }
    /* 预计完成那一栏可能是「预计无法完成解放」这种长文案：允许折行，避免撞到左边的速率 */
    .planet-card .pc-rate .v.warn{white-space:normal}

    /* ---- ④c 数据来源角标（实测优先 / 推演兜底） ---- */
    .planet-card .pc-rate-src{display:flex;justify-content:flex-end;margin-bottom:2px}
    .planet-card .tag{
      display:inline-block;padding:1px 6px;border:1px solid var(--line-2,rgba(255,255,255,.14));
      border-radius:999px;font-size:9.5px;letter-spacing:.04em;color:var(--text-mute);
      background:rgba(255,255,255,.03);white-space:nowrap;
    }
    .planet-card .tag.live{
      color:#0B0E14;background:var(--c-res-mid,#1FA84A);border-color:transparent;font-weight:700;
    }

    /* ---- ④d 区域（城市 / 超大型工厂）每行下面的一行速率 ---- */
    .planet-card .pc-rg-wrap{border-top:1px solid rgba(255,255,255,.04)}
    .planet-card .pc-rg-wrap:first-child{border-top:0}
    .planet-card .pc-rg-rate{
      display:flex;align-items:baseline;justify-content:space-between;gap:4px 10px;flex-wrap:wrap;
      padding:0 12px 7px 12px;font-size:10.5px;color:var(--text-mute);
    }
    .planet-card .pc-rg-rate .pair{display:flex;align-items:baseline;gap:5px}
    .planet-card .pc-rg-rate .k{font-size:10px;color:var(--text-mute);white-space:nowrap}
    .planet-card .pc-rg-rate .v{
      font-family:var(--font-mono,Consolas,monospace);font-weight:700;font-size:11px;
      color:var(--text-dim);white-space:nowrap;
    }
    .planet-card .pc-rg-rate .v.pos{color:var(--ok)}
    .planet-card .pc-rg-rate .v.neg{color:var(--warn)}
    .planet-card .pc-rg-rate .v.warn{color:var(--warn);white-space:normal}
    .planet-card .pc-rate .v.pos {color:var(--ok)}
    .planet-card .pc-rate .v.neg {color:var(--warn)}
    .planet-card .pc-rate .v.warn{color:var(--warn)}

    /* ---- ⑤ 入侵等级行（防御战）：钝角盾牌 + 等级数字 ---- */
    .planet-card .pc-invasion{
      display:flex;align-items:center;gap:12px;padding:9px 12px;
      border-top:1px solid color-mix(in srgb, var(--fc) 40%, transparent);
      border-bottom:1px solid color-mix(in srgb, var(--fc) 40%, transparent);
    }
    @supports not (background: color-mix(in srgb, red 10%, transparent)){
      .planet-card .pc-invasion{
        border-top-color:rgba(255,255,255,.14);border-bottom-color:rgba(255,255,255,.14);
      }
    }
    .planet-card .pc-shield{width:52px;height:66px;flex:0 0 52px;display:block}
    .planet-card .pc-shield svg{width:100%;height:100%;display:block}
    .planet-card .pc-invtxt{min-width:0;flex:1}
    .planet-card .pc-invtxt .k{font-size:12px;color:var(--text-mute)}
    .planet-card .pc-invtxt .timer{
      display:block;font-family:var(--font-mono,Consolas,monospace);font-weight:700;
      font-size:15px;color:var(--warn);margin-top:3px;
    }

    /* ---- ⑥ 环境图上的行动变量图标层（2026-10）----
       变种 / 增益 / 设施等词条不再铺在卡片正文（那几段长说明会把同排卡片拉得高矮不齐），
       改为小图标直接压在星球环境图底部；名称 + 完整说明见悬停 / 聚焦 / 点击浮层。
       图标 18px、按钮 26px 见方，最多两行 —— 320px 窄卡也不溢出、不挡星球主体。 */
    .planet-card .pc-fx{
      position:absolute;left:0;right:0;bottom:0;z-index:2;
      display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px;
      padding:14px 7px 6px;pointer-events:none;
      background:linear-gradient(180deg,rgba(10,10,10,0) 0%,rgba(10,10,10,.55) 55%,rgba(10,10,10,.88) 100%);
    }
    .planet-card .pc-fx-i{
      pointer-events:auto;display:inline-flex;align-items:center;justify-content:center;
      min-width:26px;height:26px;padding:0 4px;margin:0;cursor:pointer;
      border:1px solid rgba(255,255,255,.22);border-radius:0;
      background:rgba(12,12,12,.78);color:#94A3B8;font:inherit;
    }
    .planet-card .pc-fx-i:hover,
    .planet-card .pc-fx-i[aria-pressed="true"]{border-color:currentColor}
    .planet-card .pc-fx-i:focus-visible{outline:2px solid var(--yellow);outline-offset:1px}
    .planet-card .pc-fx-ic{display:block;width:18px;height:18px;line-height:0}
    .planet-card .pc-fx-ic svg{display:block;width:100%;height:100%;fill:currentColor}
    .planet-card .pc-fx-ic img{display:block;width:100%;height:100%;object-fit:contain}
    /* 取图失败（file:// / 404）降级成短文字，不留空框 */
    .planet-card .pc-fx-ic-txt{font-size:9px;line-height:1;color:inherit}
    /* 没有专用图标的效果：短标签；完整名称/说明在 aria-label 与浮层里 */
    .planet-card .pc-fx-txt{color:#E6EDF7}
    .planet-card .pc-fx-lbl{
      display:block;max-width:62px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
      font-size:10px;line-height:1;letter-spacing:.02em;
    }
    .planet-card .pc-fx-neg{color:#FF8A6A;border-color:rgba(255,77,46,.55)}
    .planet-card .pc-fx-more{color:var(--yellow);font-size:10px;font-weight:700}

    /* ---- ⑥-b 星球下属区域（城市 / 超大型工厂，2026-09-24）----
       与星图星球卡片同一套数据与口径（tables/planet_regions*.json + data.json 的 regions[]）。
       ⚠ **不列"星球本体"那一行**（2026-09-24 用户反馈）：静态表里 211 条区域没有一条与星球同名，
         游戏面板里的"<星球>城市"行不是区域；且星球自身进度条上方已有，重复且把本体误标成城市。 */
    /* ---- ⑥-b 统一折叠区（城市 / 超大型工厂 + 星球详情，2026-10 第二轮）----
       用户反馈：原来城市列表与星球详情各有一套开合，先点开卡片一次、再点区域一次 = 二重展开。
       现在整卡只有这一个入口：一次展开同时显示城市列表与详情，再点统一收起；
       没有区域数据的星球用同一个入口（不带计数，也不留空行）。
       收起时标题行下面一行紧凑提示（开放城市数量 + 进度最好的那座城市），点它也照常展开。
       ⚠ 不列「星球本体」那一行（2026-09-24 用户反馈：静态表 211 条区域没有一条与星球同名）。 */
    .planet-card .pc-sec{border-top:2px solid var(--fcd);margin-top:auto}
    .planet-card .pc-sec .rhd{
      display:flex;align-items:center;gap:6px;padding:7px 12px 6px;
      font-size:11px;font-weight:700;color:var(--yellow);letter-spacing:.06em;
    }
    /* 入口按钮：原生 button（Enter / 空格可用），aria-expanded 与 body 的 hidden
       由页面点击委托同步；卡片上不再有第二套开合。 */
    .planet-card .pc-sec-toggle{
      display:inline-flex;align-items:center;gap:6px;flex:1;min-width:0;
      padding:0;margin:0;border:0;background:none;cursor:pointer;
      color:inherit;font:inherit;letter-spacing:inherit;text-align:left;
    }
    .planet-card .pc-sec-toggle b{color:var(--text)}
    .planet-card .pc-sec-toggle .arw{font-size:9px;color:var(--text-mute);transition:transform .15s}
    .planet-card .pc-sec-toggle[aria-expanded="true"] .arw{transform:rotate(90deg)}
    .planet-card .pc-sec-toggle .tip{
      font-size:9.5px;font-weight:400;color:var(--text-mute);letter-spacing:0;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .planet-card .pc-sec-toggle .lbl{font-size:9.5px;font-weight:400;color:var(--blue);letter-spacing:0}
    .planet-card .pc-sec-toggle:hover .lbl,
    .planet-card .pc-sec-toggle:focus-visible .lbl{color:var(--yellow)}
    .planet-card .pc-sec-toggle:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}
    /* 一行城市提示；展开时保留高度，避免窗口尺寸变化后收起高度漂移。 */
    .planet-card .pc-sec-hint{
      padding:0 12px 7px;font-size:10px;line-height:1.35;color:var(--text-mute);
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;
    }
    .planet-card .pc-sec-body[hidden]{display:none}
    /* 脚本没加载成功时的兜底：原生 <details>，同一个入口语义，不靠 JS 也能开 */
    .planet-card .pc-sec-native>summary{list-style:none;cursor:pointer}
    .planet-card .pc-sec-native>summary::-webkit-details-marker{display:none}
    .planet-card .pc-rg-doc{
      flex:0 0 auto;font-size:10px;font-weight:400;color:var(--blue);
      letter-spacing:0;text-decoration:none;
    }
    .planet-card .pc-rg-doc:hover{color:var(--yellow);text-decoration:underline}
    .planet-card .pc-rg{display:flex;align-items:center;gap:7px;padding:4px 12px;font-size:11.5px}
    .planet-card .pc-rg + .pc-rg{border-top:1px solid var(--border)}
    .planet-card .pc-rg .ico{flex:0 0 14px;text-align:center;font-size:11px}
    .planet-card .pc-rg .nm{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .planet-card .pc-rg .nm i{font-style:normal;color:var(--text-mute);font-size:9.5px;margin-left:4px}
    .planet-card .pc-rg .ty{flex:0 0 66px;font-size:10px;color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    .planet-card .pc-rg .ty em{font-style:normal;color:var(--yellow);font-size:9px;margin-left:2px}
    .planet-card .pc-rg .pct{flex:0 0 48px;text-align:right;font-variant-numeric:tabular-nums;color:var(--text)}

    /* ---- ⑥-c 行动变量说明浮层（挂 body，不卡片裁剪）----
       .pc-landmark / .planet-card 都是 overflow:hidden，浮层放卡片里会被裁掉，
       故由 planet-card-effects.js 挂在 body 上按图标位置 fixed 定位。
       悬停 / Tab 聚焦 / 点击（触屏）共用同一个浮层；Esc、滚动或点别处关闭。 */
    .pc-fx-tip{
      position:fixed;z-index:var(--z-modal,999);max-width:min(300px, calc(100vw - 20px));
      padding:8px 10px;background:#0C0C0C;border:1px solid rgba(255,176,0,.55);
      box-shadow:0 8px 24px rgba(0,0,0,.6);pointer-events:none;
      font-size:11.5px;line-height:1.6;color:var(--text-dim);
    }
    .pc-fx-tip[hidden]{display:none}
    .pc-fx-tip .t{font-weight:700;font-size:12px;color:var(--yellow);letter-spacing:.04em}
    .pc-fx-tip .d{margin:4px 0 0;white-space:pre-line}
    .pc-fx-tip .c{margin:4px 0 0;font-size:10px;color:var(--text-mute)}
    .pc-fx-tip .c[hidden]{display:none}

    /* 手机（≤768px，断点规范）：图标与间距收一档，保证 320px 卡宽两行内排完 */
    @media (max-width:768px){
      .planet-card .pc-fx{gap:3px;padding:12px 5px 5px}
      .planet-card .pc-fx-i{min-width:24px;height:24px;padding:0 3px}
      .planet-card .pc-fx-ic{width:16px;height:16px}
      .planet-card .pc-fx-lbl{max-width:54px;font-size:9.5px}
    }

    /* ---- 已解放：去掉进度条区，仅保留状态行 ---- */
    .planet-card .pc-liberated{
      padding:0 12px 11px;font-size:12px;font-weight:700;
      color:var(--c-res-mid);letter-spacing:.08em;
    }

    /* ---- 防御战双进度（赛跑：敌方入侵进度 vs 我方防御进度）----
       本质是赛跑：敌方按固定速率必然在到期时打满 100%，我方必须在剩余时间内打满。
       两条轨道复用 .pc-bar（斜纹 + 三角游标），敌方轨道靠行内 --fc/--fcd 切到敌方阵营色 */
    .planet-card .pc-race{display:flex;flex-direction:column;gap:7px;padding:0 12px 10px}
    .planet-card .pc-race-row{display:flex;align-items:center;gap:8px}
    .planet-card .pc-race-row .lbl{
      flex:0 0 60px;width:60px;font-size:11px;color:var(--text-dim);
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    }
    .planet-card .pc-race-row .pc-bar{flex:1;min-width:0}
    .planet-card .pc-race-row .val{
      flex:0 0 54px;width:54px;text-align:right;
      font-family:var(--font-mono,Consolas,monospace);font-weight:700;font-size:11.5px;color:var(--text);
    }
    .planet-card .pc-race .pc-stats{margin-top:0}
    .planet-card .pc-race .v.win {color:var(--c-res-mid)}
    .planet-card .pc-race .v.lose{color:var(--c-res-max)}
    .planet-card .pc-race .v.even{color:var(--c-res-high)}

    /* ============================================================
       区块1b：进行中的战役（重要指令正下方）
       ------------------------------------------------------------
       参考 helldiverscompanion.com/#overview 的 ACTIVE CAMPAIGN。
       横幅图上游不给可公开访问的 URL -> 用阵营渐变 + 斜纹占位；
       若 data.json 的 active_campaign.banner_image 有值则自动改用真图。
       颜色沿用站内语义：失败=--c-res-max(红) / 成功=--c-res-mid(绿) / 进行中=--yellow
       ============================================================ */
    .camp-card { padding: 0; overflow: hidden; }
    .camp-card:hover { background: var(--card-bg); }

    /* ---- 战役横幅 ---- */
    .camp-banner {
      position: relative;
      min-height: 132px;
      display: flex;
      align-items: flex-end;
      background: linear-gradient(135deg, #14100E 0%, #2A1A14 55%, #3A2018 100%);
      background-size: cover;
      background-position: center;
      border-bottom: 1px solid var(--border);
    }
    .camp-banner.is-auto { background-image: linear-gradient(135deg, #2A0F07 0%, #7A2410 50%, #C2401F 100%); }
    .camp-banner.is-term { background-image: linear-gradient(135deg, #241D06 0%, #6B560A 50%, #A8891A 100%); }
    .camp-banner.is-illu { background-image: linear-gradient(135deg, #1E0F26 0%, #55236B 50%, #8A3AA8 100%); }
    .camp-banner.is-hum  { background-image: linear-gradient(135deg, #0C1723 0%, #21456A 50%, #356F9B 100%); }
    .camp-banner.has-img { background-image: none; }
    /* 横幅位图（本地 assets/campaign/ 优先，其次上游 companion /news/*.webp）；
       图片由 JS 挂 error 降级链，加载失败会自动摘掉并露出上面的阵营渐变 */
    .camp-banner-img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
      display: block;
    }
    .camp-banner::after {
      content: "";
      position: absolute;
      inset: 0;
      background: var(--stripe);
      opacity: .5;
      pointer-events: none;
    }
    .camp-banner-scrim {
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(8, 8, 8, .04) 0%, rgba(8, 8, 8, .34) 46%, rgba(8, 8, 8, .84) 100%);
      pointer-events: none;
    }
    .camp-banner-text {
      position: relative;
      z-index: 1;
      width: 100%;
      min-width: 0;
      padding: 14px 18px 12px;
    }
    /* 整体状态：斜纹层随状态变色 + 右下角 ZZZ-thick 大字（2026-10-05 战役状态判定） */
    .camp-banner::after { opacity: .5; transition: background .5s ease; }
    .camp-banner.is-camp-in_progress::after { background: var(--stripe); }
    .camp-banner.is-camp-victory::after {
      background: repeating-linear-gradient(45deg, rgba(34,197,94,.20) 0 6px, transparent 6px 12px);
    }
    .camp-banner.is-camp-defeat::after {
      background: repeating-linear-gradient(45deg, rgba(239,68,68,.22) 0 6px, transparent 6px 12px);
    }
    .camp-overall {
      position: absolute;
      right: 18px;
      bottom: 12px;
      z-index: 2;
      display: flex;
      align-items: baseline;
      gap: 8px;
      text-align: right;
      pointer-events: none;
      color: var(--yellow);
    }
    .camp-overall-main {
      font-family: var(--font-title);
      font-size: 1.5rem;
      line-height: 1;
      text-shadow: 0 2px 10px rgba(0,0,0,.75), 0 0 22px rgba(0,0,0,.45);
    }
    .camp-overall-en {
      font-size: .72rem;
      letter-spacing: .12em;
      color: var(--text-dim);
      font-family: var(--font-body);
      text-shadow: 0 1px 6px rgba(0,0,0,.8);
    }
    .camp-banner.is-camp-victory .camp-overall { color: #22c55e; }
    .camp-banner.is-camp-defeat .camp-overall { color: #ef4444; }
    .camp-banner.is-camp-in_progress .camp-overall { color: var(--yellow); }
    .camp-banner-kicker {
      font-size: .7rem;
      letter-spacing: .16em;
      color: var(--yellow);
      text-transform: uppercase;
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 8px;
    }
    .camp-kicker-en { color: var(--text-mute); letter-spacing: .12em; }
    .camp-banner-title {
      margin: 4px 0 0;
      font-family: var(--font-title);
      font-size: 1.35rem;
      line-height: 1.2;
      color: var(--text);
      overflow-wrap: anywhere;
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 10px;
    }
    .camp-banner-en {
      font-size: .72rem;
      letter-spacing: .12em;
      color: var(--text-dim);
      font-family: var(--font-body);
      overflow-wrap: anywhere;
    }
    .camp-banner-fac {
      margin-top: 4px;
      font-size: .74rem;
      color: var(--text-dim);
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 8px;
    }
    .camp-fac-en { color: var(--text-mute); letter-spacing: .08em; font-size: .68rem; }
    @media (max-width: 767px) {
      /* 窄屏：状态转 text 流内右对齐行，避免与标题/阵营行重叠 */
      .camp-overall { position: static; justify-content: flex-end; margin-top: 6px; }
      .camp-overall-main { font-size: 1.05rem; }
      .camp-overall-en { display: none; }
    }

    /* ---- 正文区 ---- */
    .camp-body { padding: 16px 18px 18px; }
    .camp-intel {
      margin: 0 0 12px;
      font-size: .95rem;
      line-height: 1.65;
      color: var(--text-dim);
      overflow-wrap: anywhere;
    }
    .camp-intel strong { color: var(--yellow); }

    /* 英文原文折叠对照 */
    .camp-en { margin: 0 0 14px; }
    .camp-en > summary {
      cursor: pointer;
      list-style: none;
      font-size: .74rem;
      letter-spacing: .08em;
      color: var(--text-mute);
      padding: 3px 0;
    }
    .camp-en > summary::-webkit-details-marker { display: none; }
    .camp-en > summary::before { content: "▸ "; color: var(--yellow-3); }
    .camp-en[open] > summary::before { content: "▾ "; }
    .camp-en > summary:hover { color: var(--yellow); }
    .camp-en > p {
      margin: 6px 0 0;
      padding: 10px 12px;
      border-left: 2px solid var(--border-h);
      background: var(--panel-2);
      font-size: .82rem;
      line-height: 1.6;
      color: var(--text-mute);
      overflow-wrap: anywhere;
    }

    /* ---- 奖励（战役奖励 / 阶段奖励） ---- */
    .camp-reward {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 10px 14px;
      padding: 10px 12px;
      border: 1px solid var(--border);
      background: linear-gradient(to right, rgba(255, 176, 0, .06), rgba(255, 176, 0, 0));
      margin-bottom: 14px;
    }
    .camp-rw-label {
      font-size: .68rem;
      letter-spacing: .16em;
      color: var(--yellow);
      text-transform: uppercase;
      white-space: nowrap;
    }
    .camp-rw-body { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
    .camp-rw-icon {
      display: inline-flex;
      width: 22px;
      height: 22px;
      flex: 0 0 22px;
      color: var(--yellow);
    }
    .camp-reward-cape .camp-rw-icon { color: var(--brass); }
    .camp-rw-svg { width: 100%; height: 100%; display: block; }
    /* 本地奖励图标（assets/campaign/reward_*.svg，来自 companion 内联 SVG 的矢量路径） */
    .camp-rw-img { width: 100%; height: 100%; display: block; object-fit: contain; }
    /* 真图标的细节比内联兜底多，给稍大的方框（companion 站点本身也是 48px 框内 30~46px 图标） */
    .camp-rw-icon-img { width: 26px; height: 26px; flex: 0 0 26px; }
    .camp-rw-name {
      font-size: .88rem;
      color: var(--text);
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 8px;
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .camp-rw-en { font-size: .68rem; letter-spacing: .1em; color: var(--text-mute); }
    .camp-rw-amt {
      font-size: .82rem;
      font-weight: 700;
      color: var(--yellow);
      font-variant-numeric: tabular-nums;
    }

    /* ---- 三个阶段 ---- */
    .camp-phases { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
    .camp-phase {
      appearance: none;
      width: 100%;
      min-width: 0;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px 10px;
      text-align: left;
      padding: 9px 11px;
      border: 1px solid var(--border);
      border-left: 3px solid var(--text-mute);
      background: var(--panel-2);
      color: var(--text);
      font-family: inherit;
      font-size: .85rem;
      cursor: pointer;
      transition: border-color .15s, background .15s;
    }
    .camp-phase:hover { background: var(--card-h); border-color: var(--border-h); }
    .camp-phase.is-failure { border-left-color: var(--c-res-max); }
    .camp-phase.is-success { border-left-color: var(--c-res-mid); }
    .camp-phase.is-in_progress { border-left-color: var(--yellow); }
    .camp-phase.is-current { background: var(--card-h); border-color: var(--border-h); }
    .camp-phase.is-current .camp-phase-name { color: var(--yellow-2); }
    .camp-phase-idx {
      flex: 0 0 auto;
      font-size: .68rem;
      letter-spacing: .1em;
      color: var(--text-mute);
      white-space: nowrap;
    }
    .camp-phase-name {
      flex: 1 1 auto;
      min-width: 0;
      overflow-wrap: anywhere;
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 8px;
    }
    .camp-phase-en { font-size: .66rem; letter-spacing: .1em; color: var(--text-mute); }
    .camp-phase-status {
      flex: 0 0 auto;
      margin-left: auto;
      font-size: .68rem;
      font-weight: 700;
      letter-spacing: .1em;
      white-space: nowrap;
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 6px;
    }
    .camp-st-en { font-size: .6rem; letter-spacing: .1em; opacity: .65; }
    .camp-phase.is-failure .camp-phase-status { color: var(--c-res-max); }
    .camp-phase.is-success .camp-phase-status { color: var(--c-res-mid); }
    .camp-phase.is-in_progress .camp-phase-status { color: var(--yellow); }

    /* ---- 简报 ---- */
    .camp-briefing { margin-bottom: 14px; }
    .camp-sub {
      font-size: .68rem;
      letter-spacing: .16em;
      color: var(--yellow);
      text-transform: uppercase;
      padding-bottom: 6px;
      margin-bottom: 8px;
      border-bottom: 1px solid var(--border);
    }
    .camp-briefing-body > p {
      margin: 0 0 10px;
      font-size: .88rem;
      line-height: 1.7;
      color: var(--text-dim);
      overflow-wrap: anywhere;
    }
    .camp-briefing-body > p:last-child { margin-bottom: 0; }
    .camp-empty { color: var(--text-mute); font-style: normal; }
    .camp-phase-reward-slot > .camp-reward { margin-bottom: 0; }

    @media (max-width: 480px) {
      .camp-banner { min-height: 108px; }
      .camp-banner-text { padding: 12px 12px 10px; }
      .camp-banner-title { font-size: 1.1rem; gap: 6px; }
      .camp-body { padding: 14px 12px 16px; }
      .camp-phase { padding: 8px 9px; font-size: .8rem; }
      .camp-phase-status { margin-left: 0; }
    }