/* =====================================================================
   layout.css · 外壳骨架 / 顶栏 HUD / 竖排导航 / 舞台 / 侧栏事件流
   / 屏容器 / 面板 / 弹窗 / Toast / 响应式
   依赖 theme.css 令牌。契约 §11.1 / §11.3
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. 应用外壳
   --------------------------------------------------------------------- */
.app{
  display:flex;
  flex-direction:column;
  min-height:100vh;
  position:relative;
}
.shell{
  display:flex;
  flex-direction:column;
  height:100vh;
  overflow:hidden;
  animation:fadeUp 260ms var(--ease-out);
}

/* ---------------------------------------------------------------------
   2. 顶栏：品牌 / HUD 资源芯片 / 阶段点
   --------------------------------------------------------------------- */
.topbar{
  position:relative;
  z-index:20;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:20px;
  height:var(--topbar-h);
  padding:0 18px 0 16px;
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(180deg,rgba(255,255,255,.045),transparent 46%),
    linear-gradient(180deg,#191d23 0%,#12151a 58%,#0d0f13 100%);
  box-shadow:0 2px 0 rgba(0,0,0,.55),0 8px 22px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.055);
}
.topbar::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:var(--metal);
  opacity:.8;
  mix-blend-mode:overlay;
}
.topbar::after{
  content:"";
  position:absolute;
  left:16px;
  right:16px;
  bottom:-1px;
  height:1px;
  background:linear-gradient(90deg,var(--rust),transparent 42%,transparent 58%,var(--blue));
  opacity:.6;
}

/* 品牌 */
.brand{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:1px;
  flex:0 0 auto;
  padding-right:18px;
  border-right:1px solid var(--line);
  height:38px;
  min-width:196px;
}
.brand-mark{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:17px;
  letter-spacing:.16em;
  line-height:1.1;
  color:var(--paper);
  text-shadow:1px 0 rgba(181,80,42,.55),-1px 0 rgba(74,127,168,.35);
  white-space:nowrap;
}
.brand-mark::before{
  content:"";
  width:9px;
  height:9px;
  flex:0 0 auto;
  background:var(--sodium);
  box-shadow:0 0 10px rgba(226,163,62,.6);
  transform:rotate(45deg);
}
.brand-sub{
  font-family:var(--font-mono);
  font-size:9.5px;
  letter-spacing:.26em;
  color:var(--muted-2);
  white-space:nowrap;
}

/* HUD 资源芯片 */
.hud-chips{
  display:flex;
  align-items:center;
  gap:6px;
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  flex-wrap:nowrap;
}
.hud-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:32px;
  padding:0 10px;
  flex:0 0 auto;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.01));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
  color:var(--paper-3);
  font-size:11.5px;
  letter-spacing:.03em;
  white-space:nowrap;
  border-radius:2px;
  transition:border-color var(--t) var(--ease),background var(--t) var(--ease);
}
.hud-chip .icon,
.hud-chip .ico{opacity:.92;}
.hud-chip b{
  color:var(--paper);
  font-family:var(--font-mono);
  font-size:13px;
  font-weight:700;
  letter-spacing:0;
  font-variant-numeric:tabular-nums;
}
.hud-chip:hover{border-color:var(--line-strong);}
.hud-chip.warn{border-color:rgba(226,163,62,.42);background:linear-gradient(180deg,rgba(226,163,62,.12),transparent);}
.hud-chip.warn b{color:var(--sodium-2);}
.hud-chip.danger{border-color:rgba(163,58,58,.5);background:linear-gradient(180deg,rgba(163,58,58,.14),transparent);}
.hud-chip.danger b{color:#e79684;}

/* 阶段点：晨 / 昼 / 夜 */
.phase-track{
  position:relative;
  display:flex;
  align-items:center;
  gap:0;
  flex:0 0 auto;
  padding:0 4px 0 16px;
  border-left:1px solid var(--line);
}
.phase-track::before{
  content:"";
  position:absolute;
  left:26px;
  right:2px;
  top:50%;
  height:1px;
  background:linear-gradient(90deg,var(--line-strong),var(--line-2));
}
.phase-dot{
  position:relative;
  z-index:1;
  width:22px;
  height:22px;
  margin-right:14px;
  flex:0 0 auto;
  border:1px solid var(--line-strong);
  border-radius:50%;
  background:#0d1013;
  box-shadow:inset 0 0 0 3px #0d1013;
  transition:background var(--t) var(--ease),border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.phase-dot::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:6px;
  height:6px;
  margin:-3px 0 0 -3px;
  border-radius:50%;
  background:var(--muted-2);
  transition:background var(--t) var(--ease),transform var(--t) var(--ease);
}
.phase-dot:hover{border-color:var(--paper-2);}
.phase-dot.active{
  border-color:var(--sodium);
  box-shadow:0 0 0 3px rgba(226,163,62,.14),0 0 16px rgba(226,163,62,.45);
}
.phase-dot.active::after{
  background:var(--sodium);
  transform:scale(1.5);
  box-shadow:0 0 8px rgba(226,163,62,.9);
}

/* ---------------------------------------------------------------------
   3. 主区：导航 / 舞台 / 事件流
   --------------------------------------------------------------------- */
.main{
  flex:1 1 auto;
  display:grid;
  grid-template-columns:var(--rail-w) minmax(0,1fr) var(--side-w);
  min-height:0;
  position:relative;
}

.rail{
  position:relative;
  z-index:6;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:10px 6px 18px;
  overflow-y:auto;
  overflow-x:hidden;
  border-right:1px solid var(--line);
  background:linear-gradient(180deg,#12151a,#0d1013 70%,#0b0d10);
}
.rail::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:var(--metal);
  opacity:.5;
}
.rail-btn{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:10px 2px 9px;
  border:1px solid transparent;
  border-radius:2px;
  color:var(--muted);
  transition:color var(--t-fast) var(--ease),background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease);
}
.rail-btn:hover,.rail-btn.is-hover{
  color:var(--paper-2);
  background:rgba(231,221,200,.055);
}
.rail-btn.active{
  color:var(--sodium);
  border-color:rgba(226,163,62,.22);
  background:linear-gradient(90deg,rgba(226,163,62,.16),rgba(226,163,62,.02) 72%,transparent);
}
.rail-btn.active::before{
  content:"";
  position:absolute;
  left:-6px;
  top:7px;
  bottom:7px;
  width:3px;
  background:var(--sodium);
  box-shadow:0 0 12px rgba(226,163,62,.65);
}
.rail-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  line-height:0;
}
.rail-icon svg,.rail-icon img,.rail-icon .ico{width:22px;height:22px;}
.rail-label{
  font-size:10px;
  letter-spacing:.14em;
  line-height:1.2;
  text-align:center;
  white-space:nowrap;
}

.stage{
  position:relative;
  min-width:0;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:22px 24px 44px;
  background:
    radial-gradient(900px 420px at 50% -8%,rgba(231,221,200,.045),transparent 65%),
    linear-gradient(180deg,rgba(0,0,0,.18),transparent 200px);
}
.stage::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:var(--halftone);
  background-size:7px 7px;
  opacity:.16;
  mix-blend-mode:soft-light;
}

.sidebar{
  position:relative;
  z-index:5;
  display:flex;
  flex-direction:column;
  min-height:0;
  border-left:1px solid var(--line);
  background:linear-gradient(180deg,#0f1216,#0c0e11 60%,#0a0c0f);
}
.sidebar .panel-head{
  flex:0 0 auto;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(231,221,200,.06),rgba(231,221,200,.015));
}

/* 右侧事件流 */
.log-feed{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  padding:8px 0 24px;
  display:flex;
  flex-direction:column;
  gap:1px;
  position:relative;
}
.log-item{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:6px 14px 6px 12px;
  border-left:2px solid transparent;
  color:var(--paper-3);
  font-size:var(--fs-small);
  line-height:1.55;
  transition:background var(--t-fast) var(--ease);
  animation:fadeUp 200ms var(--ease-out);
}
.log-item:hover{background:rgba(231,221,200,.035);}
.log-item b{color:var(--paper);}
.log-time{
  flex:0 0 auto;
  min-width:30px;
  padding-top:1px;
  color:var(--muted-2);
  font-family:var(--font-mono);
  font-size:9.5px;
  letter-spacing:.02em;
  white-space:nowrap;
}
.log-item.warn{
  border-left-color:var(--alert);
  color:#dcc0b4;
  background:linear-gradient(90deg,rgba(163,58,58,.12),transparent 72%);
}
.log-item.warn .log-time{color:#c07d6c;}
.log-item.good{
  border-left-color:var(--rad);
  color:#cbd4b3;
  background:linear-gradient(90deg,rgba(147,168,106,.10),transparent 72%);
}
.log-item.good .log-time{color:var(--rad);}
.log-item.radio{
  border-left-color:var(--blue);
  color:#b9cbdc;
  font-style:italic;
  background:linear-gradient(90deg,rgba(74,127,168,.12),transparent 72%);
}
.log-item.radio .log-time{color:var(--blue-2);}
.log-item.radio::after{
  content:"";
  position:absolute;
  right:9px;
  top:9px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--blue);
  box-shadow:0 0 7px rgba(74,127,168,.8);
  animation:radioBlip 2.6s ease-in-out infinite;
}

/* ---------------------------------------------------------------------
   4. 屏容器与栅格
   --------------------------------------------------------------------- */
.screen{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:var(--gap);
  width:100%;
  max-width:var(--stage-max);
  margin:0 auto;
  animation:fadeUp 240ms var(--ease-out);
}
.screen-head{
  position:relative;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  padding-bottom:11px;
  border-bottom:1px solid var(--line);
}
.screen-head::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:56px;
  height:3px;
  background:var(--rust);
  box-shadow:0 0 12px rgba(181,80,42,.5);
}
.screen-title{
  font-size:25px;
  line-height:1.15;
  letter-spacing:.07em;
  color:var(--paper);
  text-shadow:1px 0 rgba(181,80,42,.35),-1px 0 rgba(74,127,168,.22);
  display:flex;
  align-items:center;
  gap:10px;
}
.screen-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:3px;
  color:var(--sodium);
  font-family:var(--font-mono);
  font-size:var(--fs-micro);
  letter-spacing:.24em;
  text-transform:uppercase;
}
.screen-kicker::before{
  content:"";
  width:5px;
  height:5px;
  background:var(--sodium);
  transform:rotate(45deg);
  flex:0 0 auto;
}
.screen-body{
  display:flex;
  flex-direction:column;
  gap:var(--gap);
  min-width:0;
}

/* ---------------------------------------------------------------------
   5. 面板：金属框 + 铆钉 + 栏目条
   --------------------------------------------------------------------- */
.panel{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:
    linear-gradient(180deg,rgba(255,255,255,.028),transparent 52%),
    linear-gradient(180deg,#1b1f25 0%,#14171c 55%,#101318 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 8px 20px rgba(0,0,0,.28);
}
.panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    radial-gradient(circle,rgba(231,221,200,.30) 1px,transparent 1.5px),
    radial-gradient(circle,rgba(231,221,200,.30) 1px,transparent 1.5px),
    radial-gradient(circle,rgba(231,221,200,.30) 1px,transparent 1.5px),
    radial-gradient(circle,rgba(231,221,200,.30) 1px,transparent 1.5px);
  background-repeat:no-repeat;
  background-size:3px 3px;
  background-position:5px 5px,calc(100% - 6px) 5px,5px calc(100% - 6px),calc(100% - 6px) calc(100% - 6px);
  opacity:.55;
}
.panel-head{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 14px 9px 15px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(231,221,200,.065),rgba(231,221,200,.012));
  min-height:38px;
}
.panel-head::before{
  content:"";
  position:absolute;
  left:0;
  top:8px;
  bottom:8px;
  width:3px;
  background:var(--rust);
  box-shadow:0 0 10px rgba(181,80,42,.45);
}
.panel-title{
  font-size:15px;
  letter-spacing:.06em;
  color:var(--paper);
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.panel-sub{
  color:var(--muted);
  font-size:var(--fs-tiny);
  letter-spacing:.04em;
  line-height:1.5;
}
.panel-body{
  position:relative;
  padding:14px;
  min-width:0;
}
.panel-body.tight{padding:10px;}
.panel-body.flush{padding:0;}
.panel-foot{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding:10px 14px;
  border-top:1px solid var(--line);
  background:rgba(0,0,0,.18);
}

/* ---------------------------------------------------------------------
   6. 弹窗
   --------------------------------------------------------------------- */
#modal-root{position:relative;z-index:100;}
.modal-backdrop{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:
    radial-gradient(circle at 50% 38%,rgba(14,16,20,.78),rgba(5,6,8,.94) 78%);
  animation:backdropIn 180ms var(--ease-out);
}
.modal{
  position:relative;
  display:flex;
  flex-direction:column;
  width:min(760px,94vw);
  max-height:86vh;
  border:1px solid rgba(231,221,200,.24);
  border-radius:var(--radius);
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 44%),
    linear-gradient(180deg,#191d23,#12151a 60%,#0e1014);
  box-shadow:0 34px 70px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.06);
  animation:modalIn 200ms var(--ease-out);
}
.modal::before{
  content:"";
  position:absolute;
  z-index:2;
  left:50%;
  top:-9px;
  width:132px;
  height:18px;
  margin-left:-66px;
  background:linear-gradient(180deg,rgba(231,221,200,.82),rgba(214,201,173,.66));
  box-shadow:0 3px 8px rgba(0,0,0,.5);
  transform:rotate(-1.6deg);
  pointer-events:none;
  opacity:.9;
}
.modal-wide{width:min(1120px,96vw);}
.modal-head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 18px 12px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(231,221,200,.06),transparent);
}
.modal-title{
  flex:1 1 auto;
  min-width:0;
  font-family:var(--font-head);
  font-size:19px;
  letter-spacing:.08em;
  color:var(--paper);
  text-shadow:1px 0 rgba(181,80,42,.35);
}
.modal-body{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  padding:16px 18px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.modal-foot{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding:12px 18px;
  border-top:1px solid var(--line);
  background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.12));
}

/* ---------------------------------------------------------------------
   7. Toast
   --------------------------------------------------------------------- */
.toast-wrap{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:120;
  transform:translateX(-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  pointer-events:none;
  width:min(520px,86vw);
}
.toast{
  pointer-events:auto;
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  width:auto;
  max-width:100%;
  padding:9px 16px 9px 14px;
  border:1px solid rgba(231,221,200,.26);
  border-left:3px solid var(--sodium);
  background:linear-gradient(180deg,#20252c,#15181d);
  color:var(--paper-2);
  font-size:13px;
  line-height:1.5;
  box-shadow:0 12px 30px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.06);
  animation:toastIn 200ms var(--ease-out);
}
.toast.good{border-left-color:var(--rad);}
.toast.good b{color:var(--rad-2);}
.toast.warn{border-left-color:var(--sodium);}
.toast.warn b{color:var(--sodium-2);}
.toast.bad{border-left-color:var(--alert);}
.toast.bad b{color:#e69688;}

/* ---------------------------------------------------------------------
   8. 关键帧
   --------------------------------------------------------------------- */
@keyframes modalIn{
  from{opacity:0;transform:translateY(10px) scale(.99);}
  to{opacity:1;transform:none;}
}
@keyframes backdropIn{
  from{opacity:0;}
  to{opacity:1;}
}
@keyframes toastIn{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:none;}
}
@keyframes radioBlip{
  0%,100%{opacity:.35;}
  50%{opacity:1;}
}

/* ---------------------------------------------------------------------
   9. 响应式：1280×800 ～ 1920×1080
   --------------------------------------------------------------------- */
@media (max-width:1360px){
  :root{
    --gap:14px;
    --pad:18px;
    --side-w:300px;
    --stage-max:1180px;
  }
  .stage{padding:18px 18px 38px;}
  .topbar{gap:14px;padding-right:14px;}
  .brand{min-width:178px;}
  .hud-chip{padding:0 8px;font-size:11px;}
}
@media (max-width:1180px){
  :root{--rail-w:74px;--side-w:264px;}
  .brand{min-width:0;}
  .brand-sub{display:none;}
  .rail-label{font-size:9px;letter-spacing:.08em;}
  .grid-2,.grid-3{grid-template-columns:minmax(0,1fr);}
}
@media (min-width:1680px){
  :root{
    --gap:18px;
    --stage-max:1380px;
  }
  .stage{padding:26px 32px 50px;}
  .screen-title{font-size:28px;}
}
@media (min-width:1840px){
  :root{--side-w:344px;--stage-max:1460px;}
}

/* 窄屏兜底：不出现横向滚动 */
@media (max-width:1024px){
  .main{grid-template-columns:64px minmax(0,1fr);}
  .sidebar{display:none;}
}

/* 触屏/无 hover 设备：更大点击区 + 常显关键提示 */
@media (hover:none){
  .rail-btn{padding:12px 2px;}
  .btn{min-height:40px;}
  .btn.small{min-height:32px;}
  .tab{padding:10px 13px;}
  .tooltip[data-tip]::after{
    position:static;
    display:block;
    margin-top:4px;
    transform:none;
    opacity:1;
    visibility:visible;
    max-width:none;
    box-shadow:none;
    border-style:dashed;
  }
}


/* =====================================================================
   集成修订 · 2026-11-11 · 依据 lead 实机截图（1440×900 / 1280×800）
   A. 顶栏改两行网格：品牌/位置/资源/阶段/按钮 + 目标/威胁
   B. 导航宽度、舞台内边距、侧栏标题、屏副题
   C. Toast 与 overrides.css 的右下行帖对齐
   ===================================================================== */

/* --- A. 顶栏两行网格 --- */
:root{--topbar-h:92px;}
.topbar{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr) auto auto;
  grid-template-rows:auto auto;
  grid-template-areas:
    "brand loc chips phase actions"
    "objective objective objective objective objective";
  align-items:center;
  gap:5px 14px;
  height:auto;
  min-height:92px;
  padding:9px 16px 8px;
}
.topbar::after{display:none;}
.brand{
  grid-area:brand;
  align-self:center;
  height:auto;
  min-width:0;
  min-height:32px;
  padding-right:14px;
}
.brand-mark{font-size:17px;}
.brand-sub{font-size:9px;letter-spacing:.22em;}

.hud-loc{
  grid-area:loc;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:1px;
  min-width:0;
  padding-right:8px;
}
.hud-loc .tiny{
  color:var(--muted-2);
  font-family:var(--font-mono);
  font-size:9px;
  letter-spacing:.18em;
  line-height:1.2;
  white-space:nowrap;
}
.loc-line{
  max-width:230px;
  color:var(--paper-3);
  font-size:13px;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.loc-line b{color:var(--paper);font-weight:700;}

.hud-chips{
  grid-area:chips;
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
  overflow:hidden;
  flex-wrap:nowrap;
}
.hud-chip{
  height:30px;
  padding:0 9px;
  gap:5px;
  font-size:11px;
}
.hud-chip .ico{width:15px;height:15px;}
.hud-chip .hud-label{
  color:var(--muted);
  font-size:10.5px;
  font-weight:400;
  letter-spacing:.04em;
  white-space:nowrap;
}
.hud-chip b{font-size:12.5px;}

.hud-phase{
  grid-area:phase;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:4px;
  padding:0 12px;
  border-left:1px solid var(--line);
  white-space:nowrap;
}
.hud-phase .tiny{
  color:var(--muted-2);
  font-family:var(--font-mono);
  font-size:9px;
  letter-spacing:.16em;
  line-height:1.1;
}
.hud-phase .phase-track{
  padding:0;
  border:0;
  gap:0;
}
.hud-phase .phase-track::before{left:4px;right:14px;}
.hud-phase .phase-dot{
  width:14px;
  height:14px;
  margin-right:9px;
  box-shadow:inset 0 0 0 2px #0d1013;
}
.hud-phase .phase-dot::after{width:5px;height:5px;margin:-2.5px 0 0 -2.5px;}
.hud-phase .phase-dot.active{box-shadow:0 0 0 2px rgba(226,163,62,.16),0 0 12px rgba(226,163,62,.5);}

.hud-actions{
  grid-area:actions;
  display:flex;
  align-items:center;
  gap:6px;
}
.hud-actions .btn.icon{width:30px;height:30px;}

.hud-objective{
  grid-area:objective;
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  min-width:0;
  margin-top:3px;
  padding-top:6px;
  border-top:1px dashed var(--line-2);
  color:var(--paper-2);
  font-size:12.5px;
  line-height:1.5;
}
.hud-objective > .tiny{
  flex:0 0 auto;
  color:var(--sodium);
  font-family:var(--font-mono);
  font-size:9px;
  letter-spacing:.18em;
}
.hud-objective > span:nth-child(2){
  flex:1 1 auto;
  min-width:0;
  white-space:normal;
  overflow-wrap:anywhere;
}
.hud-threat{
  display:inline-flex;
  align-items:center;
  gap:5px;
  flex:0 0 auto;
  padding:2px 8px;
  border:1px solid var(--line);
  background:rgba(231,221,200,.04);
  color:var(--paper-3);
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:.03em;
  white-space:nowrap;
}
.hud-threat .ico{width:13px;height:13px;color:var(--alert-2);}
.hud-threat.warn{color:var(--sodium-2);border-color:rgba(226,163,62,.45);background:rgba(226,163,62,.10);}
.hud-threat.danger{color:#e79684;border-color:rgba(163,58,58,.55);background:rgba(163,58,58,.13);}

/* 1440 以下收紧资源芯片，保证目标行不被挤压 */
@media (max-width:1500px){
  .hud-chip{padding:0 7px;gap:4px;}
  .hud-chip .hud-label{font-size:10px;}
  .hud-chip b{font-size:12px;}
  .hud-loc .loc-line{max-width:200px;}
}
/* 1360 以下隐藏品牌副标（品牌仍在），1280 仍不换行、不重叠 */
@media (max-width:1360px){
  .brand-sub{display:none;}
  .brand{min-width:0;padding-right:10px;}
  .brand-mark{font-size:16px;letter-spacing:.12em;}
  .hud-loc .tiny{display:none;}
  .hud-phase{padding:0 9px;}
  .hud-actions .btn.icon{width:28px;height:28px;}
  .topbar{gap:4px 12px;padding:8px 14px 7px;}
}
@media (max-width:1180px){
  .hud-loc{display:none;}
  .hud-chip .hud-label{display:none;}
}

/* --- B. 导航 / 舞台 / 侧栏 / 屏副题 --- */
.rail{width:var(--rail-w);}
.stage{padding:0;}
.sidebar-head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:10px 14px 9px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(231,221,200,.06),rgba(231,221,200,.012));
  color:var(--muted);
  letter-spacing:.16em;
}
.screen-sub{
  max-width:52ch;
  color:var(--muted);
  font-size:11px;
  letter-spacing:.05em;
  line-height:1.7;
  text-align:right;
}
@media (max-width:900px){
  .screen-sub{text-align:left;max-width:none;}
}

/* --- C. Toast 与 overrides 的右下布局对齐 --- */
.toast-wrap{
  left:auto;
  right:24px;
  bottom:26px;
  transform:none;
  align-items:flex-end;
  width:auto;
  max-width:min(440px,86vw);
}
.toast{width:auto;max-width:100%;}

/* --- D. 弹窗副标题 --- */
.modal-kicker{
  display:block;
  margin-bottom:3px;
  color:var(--sodium);
  font-family:var(--font-mono);
  font-size:9.5px;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.modal-title{line-height:1.25;}
.modal-head .spacer{flex:1 1 auto;}