/* 铜匠汽车 · 整车制造基地 —— 基地页面自己的覆盖层（HUD 主体用 series/hud/hud.css；配色同规划 §3.2） */
html, body { margin:0; height:100%; overflow:hidden; background:#0e1316; }
.tb { --panel:rgba(14,20,24,.78); --line:rgba(255,255,255,.10); --text:#d6dde0; --dim:#8b989e; --accent:#f2c230; --copper:#b87333;
  position:absolute; inset:0; pointer-events:none; z-index:5; color:var(--text); font:13px/1.5 -apple-system,"PingFang SC","Helvetica Neue",sans-serif; }
.tb > * { pointer-events:auto; }
.tb .glass { background:var(--panel); border:1px solid var(--line); border-radius:10px; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); box-shadow:0 6px 24px rgba(0,0,0,.28); }
.tb button { font:inherit; color:inherit; cursor:pointer; }
.tb-act { position:absolute; left:50%; top:14px; transform:translateX(-50%); display:flex; gap:4px; padding:4px; }
.tb-act button { padding:6px 12px; border:0; border-radius:6px; background:none; font-size:12.5px; white-space:nowrap; }
.tb-act button:hover { background:rgba(255,255,255,.08); }
.tb-act button.on { background:var(--accent); color:#111; }
.tb-act button.go { background:var(--copper); color:#fff; font-weight:600; }
.tb-act button.go:hover { background:#c98444; }
.tb-act button[disabled] { opacity:.38; cursor:default; background:none; color:var(--dim); }
.tb-act .sep { width:1px; background:var(--line); margin:4px 2px; }
.tb-chip { position:absolute; left:50%; top:60px; transform:translateX(-50%); padding:5px 14px; font-size:12px; display:none; align-items:center; gap:10px; }
.tb-chip.show { display:flex; } .tb-chip .bar { width:120px; height:3px; background:rgba(255,255,255,.12); border-radius:2px; overflow:hidden; } .tb-chip .bar i { display:block; height:100%; background:var(--copper); width:0; }
.tb-chip.err { color:#f08a6c; }
/* 建筑名标签（投影坐标；被遮挡 / 进入车间时隐藏） */
.tb-labels { position:absolute; inset:0; pointer-events:none; z-index:2; }
.tb-lb { position:absolute; transform:translate(-50%, -100%); padding:2px 8px; border-radius:4px; background:rgba(14,20,24,.62); color:#e8edef; font-size:12px; white-space:nowrap; border-left:3px solid var(--copper, #b87333); }
.tb-lb small { color:#9fb0b6; margin-left:6px; font-size:10.5px; display:none; } .tb-lb.on small { display:inline; } .tb-lb.fac { border-left-color:#7d98a6; } .tb-lb.on { background:rgba(242,194,48,.92); color:#111; } .tb-lb.on small { color:#333; }
.tb-lb.lay { border-left-color:#f2c230; font-weight:600; }
/* 跟随一台车：跨车间时间轴（各段停留与库存等待，按泳道） */
.tb-follow { position:absolute; left:50%; top:58px; transform:translateX(-50%); width:min(64vw, 900px); padding:8px 12px 10px; display:none; }
.tb-follow.show { display:block; }
.tb-follow .hd { display:flex; gap:10px; align-items:baseline; font-size:12px; }
.tb-follow .hd b { color:#fff; font-size:13.5px; } .tb-follow .hd .leg { color:var(--accent); } .tb-follow .hd .sp { margin-left:auto; color:var(--dim); }
.tb-follow .hd button { border:1px solid var(--line); background:rgba(255,255,255,.06); border-radius:5px; padding:1px 8px; font-size:11.5px; }
.tb-lanes { position:relative; margin-top:6px; }
.tb-lane { position:relative; height:14px; margin:3px 0; border-radius:3px; background:rgba(255,255,255,.04); }
.tb-lane > span { position:absolute; left:0; top:0; width:64px; font-size:10.5px; line-height:14px; color:var(--dim); }
.tb-lane .seg { position:absolute; top:1px; bottom:1px; border-radius:2px; min-width:2px; opacity:.9; }
.tb-lane .seg.wait { background:repeating-linear-gradient(135deg, rgba(255,255,255,.22) 0 3px, rgba(255,255,255,.06) 3px 6px); }
.tb-lane .seg.on { outline:2px solid #fff; z-index:2; } .tb-lane .seg.done { opacity:.45; }
.tb-axis { position:relative; height:12px; margin-left:64px; font-size:9.5px; color:var(--dim); }
.tb-axis i { position:absolute; top:0; transform:translateX(-50%); font-style:normal; }
.tb-cursor { position:absolute; top:0; bottom:0; width:2px; background:#fff; box-shadow:0 0 4px #000; pointer-events:none; }
.tb-follow .cap { margin-top:4px; font-size:11.5px; color:#c3cdd1; display:flex; gap:12px; } .tb-follow .cap b { color:var(--accent); font-weight:600; }
.tb-follow .legend { margin-top:3px; font-size:10px; color:var(--dim); }
body.tj-clean .tb > :not(.tb-keep) { display:none; }
@media (max-width: 640px) {
  .tb-act { top:auto; bottom:150px; left:8px; right:8px; transform:none; flex-wrap:wrap; justify-content:center; }
  .tb-act button { padding:5px 8px; font-size:11.5px; }
  .tb-follow { top:46px; width:calc(100vw - 16px); left:8px; transform:none; padding:6px 8px; }
  .tb-lane > span { width:44px; font-size:9.5px; } .tb-axis { margin-left:44px; }
  .tb-chip { top:46px; }
}
/* 跟随一台车：收起左栏、详情卡只留上半截，给 3D 视口让地方（时间轴在顶部、外壳跟随条在底部） */
body.tb-following .tj-nav, body.tb-following .tj-toggle.nav { display:none; }
body.tb-following .tj-card { max-height:min(36vh, 300px); top:auto; bottom:150px; }
body.tb-following .tj-card p { display:none; }
/* 观感打磨 ③：宽屏下左侧工位栏收成细条、右侧详情卡只留标题和实时数；鼠标移上去再展开。3D 主体（主轴厂房、发运场、跑道）不被压住
   （选择器带 .tj-hud 前缀：hud.css 是运行时后加载的，同权重会被它盖掉） */
@media (min-width: 641px) {
  .tj-hud .tj-nav { width:128px; padding:6px; max-height:calc(100% - 255px); background:rgba(14,20,24,.58); transition:width .18s ease; }
  .tj-hud .tj-nav h3 { font-size:10px; margin:0 0 4px; opacity:.7; white-space:nowrap; overflow:hidden; }
  .tj-hud .tj-nav button { padding:4px 6px; gap:6px; }
  .tj-hud .tj-nav button em, .tj-hud .tj-nav button small { display:none; }
  .tj-hud .tj-nav:hover { width:236px; background:var(--panel); }
  .tj-hud .tj-nav:hover button small, .tj-hud .tj-nav:hover button em { display:block; }
  .tj-hud .tj-card { width:232px; max-height:calc(100% - 200px); padding:9px 11px; background:rgba(14,20,24,.62); transition:width .18s ease; }
  .tj-hud .tj-card p, .tj-hud .tj-card table, .tj-hud .tj-card .src { display:none; }
  .tj-hud .tj-card:hover { width:300px; background:var(--panel); }
  .tj-hud .tj-card:hover p, .tj-hud .tj-card:hover .src { display:block; } .tj-hud .tj-card:hover table { display:table; }
}