/* ============================================================
   tech.css — 科技风结构层（深蓝科技青 v4 · 主大屏深蓝改版方案）
   在 tokens.css / base.css / tokens-tech.css 之后引入。
   tokens-tech.css 管令牌重映射；本文件管改版新增的结构与动效：
   顶栏居中标题+翼线、斜切徽章、卡片角标/顶缘光线/扫描线/标题条、
   图层栏六角容器、模块导航 3D 图标、动效 keyframes 全套。
   动效体系（README §动效）：入场编排一次性 / 数据充能 / 待机微动 / 交互反馈。
   ⚠ 水平居中元素的入场动画必须用带 translate(-50%) 的 v5inUpC/v5inDownC。
   ============================================================ */

/* ---- keyframes 全套（设计稿 helmet <style> 原值） ---- */
@keyframes v3breathe { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes v4scan { 0% { top: 8%; opacity: 0; } 12% { opacity: 1; } 88% { opacity: 1; } 100% { top: 92%; opacity: 0; } }
@keyframes v4spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes v4spinr { from { transform: rotate(360deg); } to { transform: rotate(0deg); } }
@keyframes v4streak { 0% { left: -30%; } 100% { left: 110%; } }
@keyframes v4gridmove { 0% { background-position: 0 0; } 100% { background-position: 0 88px; } }
@keyframes v4rise { 0% { transform: translateY(0); opacity: 0; } 12% { opacity: .9; } 85% { opacity: .5; } 100% { transform: translateY(-46vh); opacity: 0; } }
@keyframes v4pulse { 0%, 100% { text-shadow: 0 0 22px rgba(0,216,255,.5), 0 0 4px rgba(0,216,255,.3); } 50% { text-shadow: 0 0 34px rgba(0,216,255,.8), 0 0 8px rgba(0,216,255,.5); } }
@keyframes v5inL { from { opacity: 0; transform: translateX(-26px); } to { opacity: 1; transform: none; } }
@keyframes v5inR { from { opacity: 0; transform: translateX(26px); } to { opacity: 1; transform: none; } }
@keyframes v5inUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes v5inDown { from { opacity: 0; transform: translateY(-14px); } to { opacity: 1; transform: none; } }
@keyframes v5pop { from { opacity: 0; transform: translateY(6px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes v5shimmer { 0% { transform: translateX(-120%); } 55%, 100% { transform: translateX(300%); } }
@keyframes v5float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes v5inUpC { from { opacity: 0; transform: translate(-50%, 22px); } to { opacity: 1; transform: translate(-50%, 0); } }
@keyframes v5inDownC { from { opacity: 0; transform: translate(-50%, -14px); } to { opacity: 1; transform: translate(-50%, 0); } }

/* ============================================================
   顶栏 HUD（64px；居中主标题 + 对称翼线 + 鎏金副行）
   DOM 由 app.js mountV2Chrome 生成：.v2-tb-left / .v2-tb-center / .v2-tb-right
   ============================================================ */
.v2-topbar {
  position: relative;
  border-bottom: 1px solid rgba(0, 216, 255, .25);
  animation: v5inDown .5s ease-out both;
}
.v2-topbar::after {           /* 底缘中央渐变光线 */
  content: ''; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%);
  width: calc(560 * var(--u)); height: 2px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0, 216, 255, .9), transparent);
  box-shadow: 0 0 10px rgba(0, 216, 255, .6);
}
/* .v2-tb-left 已删（2026-08-07 顶栏左区 logo/系统正常/页名整体移除） */
.v2-tb-right { display: flex; align-items: center; gap: calc(10 * var(--u)); flex: none; margin-left: auto; }
.v2-tb-center {
  position: absolute; left: 50%; top: 0; height: 100%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; pointer-events: none; z-index: 1;
}
.v2-tb-center .row { display: flex; align-items: center; gap: calc(14 * var(--u)); }
.v2-tb-center .wing { width: calc(140 * var(--u)); height: 1px; background: linear-gradient(90deg, transparent, var(--gold)); }
.v2-tb-center .wing.r { background: linear-gradient(270deg, transparent, var(--gold)); }
.v2-tb-center .dia { width: 6px; height: 6px; flex: none; background: var(--gold);
  transform: rotate(45deg); box-shadow: 0 0 8px rgba(0, 216, 255, .9); }
.v2-tb-center .main {
  font-size: calc(23 * var(--u)); font-weight: 700; letter-spacing: 5px; line-height: 1.1;
  color: var(--t-1); white-space: nowrap;
  text-shadow: 0 0 18px rgba(0, 216, 255, .55), 0 0 4px rgba(0, 216, 255, .3);
}
.v2-tb-center .sub { font-size: calc(12 * var(--u)); letter-spacing: 2px; color: #C9A96E; white-space: nowrap; }
.v2-tb-center .sub .dim { color: var(--t-3); }
/* 🔴 勿删（曾于 6eb69ae 整块重构时被误删、用户二次反馈）：居中标题为绝对定位块，
   两侧翼线 + 菱形端点共 ~300*u 宽，在 iPad 档会插进右侧「未处理告警」徽章底下
   （1180 实测重叠 42px、1024 达 120px）。翼线菱形属纯装饰，窄档让位；标题文本
   本体各档实测不相撞。首页竖屏 stage 内按 1920 桌面构图渲染，故排除。 */
@media (max-width: 1280px) {
  html:not(.stage-portrait) .v2-tb-center .wing,
  html:not(.stage-portrait) .v2-tb-center .dia { display: none; }
}

/* 触屏档隐藏 ⛶ 全屏按钮（2026-08-12 用户指定）：iOS/iPadOS Safari 对
   documentElement.requestFullscreen 支持不稳（app.js 处理器本就有 && 守卫、点了
   静默无事），演示屏上留个按不动的按钮反显廉价。隐藏整个 .v2-iconbtns 容器
   （现仅此一枚按钮）连带收掉 flex 间隙；桌面 pointer:fine 不进规则。 */
@media (pointer: coarse) {
  .v2-tb-right .v2-iconbtns { display: none; }
}

/* .v2-logo / .v2-pagename 覆盖规则已随顶栏左区移除（2026-08-07） */
/* 徽章统一平行四边形斜切 */
.v2-cap { border-radius: 0; clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
.v2-cap.ok { border-color: rgba(70, 192, 142, .4); color: var(--ok); background: rgba(70, 192, 142, .08); }
.v2-cap.ok .dot { box-shadow: 0 0 6px rgba(70, 192, 142, .9); }
.v2-cap.crit { border-color: rgba(240, 82, 74, .45); color: var(--crit); background: rgba(240, 82, 74, .08); }
/* 「未处理告警」徽章可点（铃铛入口合并至此）：悬停加亮提示可交互 */
#v2-alarmcap { transition: background .2s, box-shadow .2s; }
#v2-alarmcap:hover { background: rgba(240, 82, 74, .18); box-shadow: 0 0 10px rgba(240, 82, 74, .35); }

/* ============================================================
   浮层卡片科技化（首页 .v2-card；渐变面板 + 角标 + 顶缘光线 + hover 辉光）
   ============================================================ */
.v2-card {
  background: linear-gradient(160deg, rgba(5, 24, 44, .92), rgba(2, 12, 24, .86));
  backdrop-filter: blur(8px);
  border: 1px solid rgba(0, 216, 255, .22);
  border-radius: 0;
  box-shadow: 0 0 20px rgba(0, 216, 255, .06);
  transition: border-color .25s, box-shadow .25s;
}
.v2-card:hover { border-color: rgba(0, 216, 255, .5); box-shadow: 0 0 28px rgba(0, 216, 255, .14); }
.v2-card::before {            /* 顶缘中央渐变光线（12%~88% 宽） */
  content: ''; position: absolute; top: -1px; left: 12%; right: 12%; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0, 216, 255, .7), transparent);
}
.v2-card.v2-corners::after {  /* 四角角标 10×10 2px 青色——仅重点卡（原型 6 卡中只有总体安全指数/消防设施有效性带角标，2026-08-07 二次核对） */
  content: ''; position: absolute; inset: -1px; pointer-events: none;
  background:
    linear-gradient(var(--gold), var(--gold)) left top    / 10px 2px,
    linear-gradient(var(--gold), var(--gold)) left top    / 2px 10px,
    linear-gradient(var(--gold), var(--gold)) right top   / 10px 2px,
    linear-gradient(var(--gold), var(--gold)) right top   / 2px 10px,
    linear-gradient(var(--gold), var(--gold)) left bottom / 10px 2px,
    linear-gradient(var(--gold), var(--gold)) left bottom / 2px 10px,
    linear-gradient(var(--gold), var(--gold)) right bottom/ 10px 2px,
    linear-gradient(var(--gold), var(--gold)) right bottom/ 2px 10px;
  background-repeat: no-repeat;
}
/* 面板扫描线（待机微动，8~10s 错峰由页内 style 指定 delay） */
.v2-card .scanline {
  position: absolute; left: 6px; right: 6px; top: 10%; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0, 216, 255, .3), transparent);
  animation: v4scan 8s linear infinite;
}
/* 四角角标仅重点卡：.v2-card.v2-corners::after（2026-08-07 二次核对原型）；旧 span 方案已移除 */
/* 标题条：斜切色块 ×2 + 底部渐变分隔线 + 左端 46×2 亮条 */
.v2-card-title { position: relative; padding-bottom: 7px; margin-bottom: 12px; border-bottom: 0; }
.v2-card-title::before {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: linear-gradient(90deg, rgba(0, 216, 255, .5), rgba(0, 216, 255, .06) 60%, transparent);
}
.v2-card-title::after {
  content: ''; position: absolute; left: 0; bottom: 0; width: 46px; height: 2px;
  background: var(--gold); box-shadow: 0 0 6px rgba(0, 216, 255, .8);
}
.v2-card-title .sk { width: calc(8 * var(--u)); height: calc(13 * var(--u)); flex: none; background: var(--gold); transform: skewX(-16deg); }
.v2-card-title .sk2 { width: 3px; height: calc(13 * var(--u)); flex: none; background: var(--gold); opacity: .45; transform: skewX(-16deg); margin-left: -4px; }
.v2-card-title .tt { font-size: calc(16 * var(--u)); font-weight: 600; color: var(--t-1); letter-spacing: 1px; }

/* 入场编排：左右栏卡片 0 / .12s / .24s 交错 */
.v2-col.left  .v2-card { animation: v5inL .55s cubic-bezier(.22, .85, .35, 1) both; }
.v2-col.right .v2-card { animation: v5inR .55s cubic-bezier(.22, .85, .35, 1) both; }
.v2-col .v2-card:nth-child(2) { animation-delay: .12s; }
.v2-col .v2-card:nth-child(3) { animation-delay: .24s; }

/* ---- 三维区顶部状态徽章（斜切） ---- */
.v2-scenechips { animation: v5inDownC .45s ease-out .15s both; }
.v2-scenechip {
  border-radius: 0; clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  background: rgba(3, 17, 32, .85); backdrop-filter: blur(8px);
  border: 1px solid rgba(0, 216, 255, .2);
}
.v2-scenechip .sq { border-radius: 1px; box-shadow: 0 0 5px currentColor; }

/* ---- 三维区叠加：青色网格纹理 ---- */
.v2-gridtex {
  position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background-image: linear-gradient(rgba(0, 216, 255, .028) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(0, 216, 255, .028) 1px, transparent 1px);
  background-size: 64px 64px;
}
.v2-glow {                    /* 中心青色光晕 + 底部压暗（覆盖 index 旧定义） */
  background: radial-gradient(ellipse 34% 22% at 50% 62%, rgba(0, 216, 255, .08), transparent 72%),
              radial-gradient(ellipse 120% 60% at 50% 108%, rgba(2, 10, 20, .75), transparent 60%) !important;
  z-index: 2;
}

/* ---- 图层悬浮栏：六角斜切容器 ---- */
.v2-layerbar {
  border-radius: 0;
  background: rgba(3, 17, 32, .85); backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 216, 255, .2);
  clip-path: polygon(10px 0, calc(100% - 10px) 0, 100% 50%, calc(100% - 10px) 100%, 10px 100%, 0 50%);
  padding: calc(6 * var(--u-nav)) calc(18 * var(--u-nav));
  animation: v5inUp .5s cubic-bezier(.22, .85, .35, 1) .25s both;  /* margin 居中后不再需要 *C 变体 */
  flex-wrap: wrap; justify-content: center;   /* chips 永不断字：窄档整枚换行（设计稿单行是 1920 基准） */
  /* left:50% 会把 absolute 盒可用宽砍半逼出换行；改 left/right 撑满 + margin 居中 + max-content */
  left: 0; right: 0; transform: none; margin: 0 auto; width: max-content; max-width: 100%;
}
.v2-layer { border-radius: 0; clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); white-space: nowrap; flex: none; }
.v2-layerbar .lb-label { white-space: nowrap; flex: none; }
.v2-layer .dot { box-shadow: 0 0 5px currentColor; }
.v2-layer.xr.on { border-color: var(--gold); color: var(--t-1); background: rgba(0, 216, 255, .12); }
.v2-lb-sep { width: 1px; height: calc(18 * var(--u-nav)); background: rgba(0, 216, 255, .25); margin: 0 2px; flex: none; }

/* ---- 悬浮模块导航（3D 图标版） ---- */
.v2-modnav { animation: v5inUpC .55s cubic-bezier(.22, .85, .35, 1) .35s both; }
.v2-modnav .wrap {
  position: relative; border-radius: 0;
  background: rgba(2, 12, 24, .92); backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 216, 255, .4);
  box-shadow: 0 0 26px rgba(0, 216, 255, .12);
  overflow: hidden; padding: calc(5 * var(--u-nav)); gap: calc(2 * var(--u-nav));
}
.v2-modnav .wrap::before {    /* 顶缘流光 */
  content: ''; position: absolute; top: 0; width: 30%; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0, 216, 255, .9), transparent);
  animation: v4streak 5s linear infinite;
}
.v2-mod {
  position: relative; height: calc(52 * var(--u-nav)); padding: 0 calc(13 * var(--u-nav)) 0 calc(9 * var(--u-nav)); gap: calc(6 * var(--u-nav));
  border-radius: 0; clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
}
.v2-mod .ico3d { width: calc(42 * var(--u-nav)); height: calc(42 * var(--u-nav)); flex: none; transition: transform .25s; }
.v2-mod:hover { transform: none; }
.v2-mod:hover .ico3d { transform: translateY(-3px) scale(1.06); }
.v2-mod.active .ico3d { animation: v5float 3.2s ease-in-out infinite; }
.v2-mod.active .nm { color: var(--gold-bright); }
.v2-mod.active::after {       /* 底部青色亮条（覆盖 base 定位） */
  content: ''; position: absolute; left: calc(14 * var(--u-nav)); right: calc(14 * var(--u-nav)); bottom: 2px; height: 2px;
  background: var(--gold); box-shadow: 0 0 8px rgba(0, 216, 255, .9);
}

/* ---- 点位信息卡（302px 角标面板） ---- */
.v2-infocard {
  background: linear-gradient(165deg, rgba(4, 24, 44, .95), rgba(2, 12, 24, .92));
  backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 216, 255, .45); border-radius: 0;
  box-shadow: 0 0 26px rgba(0, 216, 255, .15);
}
.v2-infocard.show { animation: v5pop .22s ease-out both; }
.v2-infocard .ic-corner { position: absolute; width: 10px; height: 10px; pointer-events: none; }
.v2-infocard .ic-corner.tl { top: -1px; left: -1px; border-top: 2px solid var(--gold); border-left: 2px solid var(--gold); }
.v2-infocard .ic-corner.tr { top: -1px; right: -1px; border-top: 2px solid var(--gold); border-right: 2px solid var(--gold); }
.v2-infocard .ic-corner.bl { bottom: -1px; left: -1px; border-bottom: 2px solid var(--gold); border-left: 2px solid var(--gold); }
.v2-infocard .ic-corner.br { bottom: -1px; right: -1px; border-bottom: 2px solid var(--gold); border-right: 2px solid var(--gold); }

/* ---- 通用按钮斜切（首页 v2-btn） ---- */
.v2-btn { border-radius: 0; clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }

/* ---- 滚动条（青色） ---- */
::-webkit-scrollbar-thumb { background: rgba(0, 216, 255, .22); }
::-webkit-scrollbar-thumb:hover { background: rgba(0, 216, 255, .4); }

/* ---- 自绘下拉（2026-08-07：原生 select 弹出菜单是 OS 样式管不到，换深蓝自绘；
        DOM 由 app.enhanceSelects 生成——触发框 .sel-trigger + 全局单例菜单 #sel-menu） ---- */
.sel-trigger {
  display: inline-flex; align-items: center; gap: 7px;
  height: calc(28 * var(--u)); padding: 0 calc(10 * var(--u));
  background: var(--bg-2); border: 1px solid var(--line); border-radius: 3px;
  font-size: calc(13 * var(--u)); color: var(--t-2);
  font-style: normal;   /* 兜底：文案子元素若被写成 <i> 也不得斜体（2026-08-07） */
  cursor: pointer; user-select: none; white-space: nowrap;
  transition: border-color .2s, color .2s;
}
.sel-trigger > * { font-style: normal; }
.sel-trigger:hover, .sel-trigger:focus { border-color: rgba(0, 216, 255, .5); color: var(--t-1); outline: none; }
.sel-trigger b { font-weight: 400; font-size: calc(10 * var(--u)); color: var(--gold); transform: scaleY(.8); }
.sel-menu {
  position: fixed; z-index: 960;               /* modal 950 之上、tooltip 980 之下：弹窗内下拉也能盖住弹窗 */
  min-width: calc(120 * var(--u)); max-height: calc(280 * var(--u)); overflow-y: auto;
  background: rgba(3, 17, 32, .96); backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 216, 255, .25); border-radius: 3px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .5), 0 0 16px rgba(0, 216, 255, .08);
  padding: 4px; display: none;
}
.sel-menu.show { display: block; animation: v5pop .18s ease-out both; }
.sel-menu .sel-item {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  padding: calc(6 * var(--u)) calc(10 * var(--u));
  font-size: calc(13 * var(--u)); color: var(--t-2);
  border-radius: 2px; cursor: pointer; white-space: nowrap;
}
.sel-menu .sel-item:hover { background: rgba(0, 216, 255, .10); color: var(--t-1); }
.sel-menu .sel-item.on { color: var(--gold-bright); }
.sel-menu .sel-item .ck { color: var(--gold); font-size: calc(12 * var(--u)); }

/* 二级页 --u-nav 全方向修正（2026-08-11）：tokens.css 的 --nav-band 扣除首页两侧列宽
   （744u），无侧列的二级页横竖屏都被错误挤压（1180 横屏名字仅 6.5px、820 竖屏两行）。
   非首页按全幅带宽取值：桌面 1920 取值不变（=1），1366/1180 横屏回到 0.85 单行，
   820 竖屏 ×0.75 单行。首页横屏保持原公式（两侧列真实存在）、首页竖屏走 stage。 */
html:not(.page-home):not(.stage-portrait) { --u-nav: min(var(--u), calc((100vw - 48px) / 1030)); }

/* 底部悬浮模块导航（~62*u-nav 高 + 38*u 离底）会盖住滚动到底的最后内容
   （灭火器台账翻页行实测被盖、iPad 上划不出）：main-area 底衬从 48*u 加大到
   130*u，滚到底时最后一行完整露在导航上方。桌面同收益（同样被盖，只是没人报）。 */
.main-area { padding-bottom: calc(130 * var(--u)); }

/* ============================================================
   iPad 适配（2026-08-11，《大屏适配与提速》复用）
   横屏 1024~1366：既有响应式（--u clamp 0.85）覆盖，实测三档零重叠零溢出。
   竖屏主页：孙桥式整幅缩放（html.stage-portrait，fitApp 判定 portrait+.home-body）
   ——保持 1920×1080 大屏构图整体等比缩放、上下留边居中；原堆叠布局方案废弃。
   ============================================================ */
html.stage-portrait, html.stage-portrait body { overflow: hidden; background: var(--bg-0, #020A14); }
/* --u/--u-nav 的 clamp 公式按真视口在竖屏会算出 0.85 / 塌缩值：stage 内强制回桌面基准 1 */
html.stage-portrait { --u: 1px; --u-nav: 1px; }
html.stage-portrait #app {
  width: 1920px; height: 1080px;
  position: absolute; left: 0; top: 50%;
  transform: translateY(-50%) scale(var(--stage-scale, .5));
  transform-origin: left center;
}

/* 二级页竖屏适配（2026-08-11）：--u-nav 带宽公式按首页两侧列推导（tokens.css --nav-band），
   无侧列的二级页竖屏塌缩（820 档算得 0.135px → 导航压成细带）。非 stage（首页竖屏走
   stage-portrait 不受此块影响）竖屏：导航令牌回 --u 基准、导航盒放宽全幅并允许换行。 */
@media (max-width: 900px) and (orientation: portrait) {

  /* v5inUpC 终帧带 translate(-50%)：left/right 撑满后会把整条拖出左界 → 换非居中变体 */
  html:not(.stage-portrait) .v2-modnav { left: 8px; right: 8px; transform: none; animation: v5inUp .55s cubic-bezier(.22, .85, .35, 1) .35s both; }
  html:not(.stage-portrait) .v2-modnav .wrap { flex-wrap: wrap; justify-content: center; }
  /* 双/三列卡片行（base.css .grid.g2/.g3，6 页 18 处）竖屏改单列堆叠：
     1fr 网格受右格表格 min-content 顶压，左格会被挤到远小于半宽
     （02 页压力趋势卡实测被压成 ~170px 竖条、04 页机位九宫格文字叠压） */
  html:not(.stage-portrait) .grid.g2,
  html:not(.stage-portrait) .grid.g3 { grid-template-columns: 1fr; }
  /* KPI 行降列（2026-08-12 用户竖屏 03 判定链截图）：g5/g6 在 622px 内容区里每格
     仅 ~120px，标签「电气系统单元等级」断成三行、数值「局部高」被逐字竖排、卡高
     参差。g4→2 列（2+2 均衡）、g5/g6→3 列（每格 ~198px，标签/数值/脚注均单行）。 */
  html:not(.stage-portrait) .kpi-row.g4 { grid-template-columns: repeat(2, 1fr); }
  html:not(.stage-portrait) .kpi-row.g5,
  html:not(.stage-portrait) .kpi-row.g6 { grid-template-columns: repeat(3, 1fr); }
  /* 台账只留一个滚动方向（2026-08-12 用户指定）：内层滚动壳原本既限高纵滚、又
     横滚，竖屏行高一涨就变成"滚动套滚动"。竖屏取消限高 → 纵向交还页面主滚动区，
     壳内只保留横滑；工具条与分页在壳外，横滑时不跟着跑。 */
  html:not(.stage-portrait) .lt-scroll { max-height: none; overflow-y: visible; }
}

/* 宽台账表卡内横滑（2026-08-12 由仅竖屏放宽到 ≤1440 全方向）：ledger 列多带
   nowrap，min-content 可超卡宽——竖屏实测 726>622，横屏 1180 灭火器台账「最近
   扫码」列同样被裁且划不动（用户反馈「无法滑动」）。≤1440 卡内横向滑动
   （iPad 惯例、桌面窄窗得滚动条），页面级横滚一律禁止；1920 大屏不进规则。 */
@media (max-width: 1440px) {
  html:not(.stage-portrait) .main-area .card,
  html:not(.stage-portrait) .main-area .danger-zone { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  /* body 双轴 overflow:hidden 由 base.css html,body 全局兜底（页面级从不横滚），
     此处无需重复声明（曾试 overflow-x:clip，规范规定与另一轴 hidden 混用会折算回
     hidden，等效冗余，删）。 */
}

/* 主滚动区动量滚动（iOS 触摸惯性；桌面无感） */
.main-area { -webkit-overflow-scrolling: touch; }

/* 悬浮导航改入流（2026-08-12 用户录屏确诊，≤1440 非首页全方向）：浮层导航盖住
   滚动到底的最后行/翻页栏，且 iOS 上从导航区起手的上滑手势无可滚目标（导航为
   浮层、body overflow:hidden）——手势死区，"往上滑没效果"。入流后导航钉在
   内容流末尾（#app 弹性列，portrait 堆叠早已验证此形态）：内容区高度自然扣除
   导航、永不被盖，上滑手势全部落在 main-area 可滚区域。1920 大屏保持浮层设计。 */
@media (max-width: 1440px) {
  html:not(.stage-portrait):not(.page-home) .v2-modnav {
    position: static; margin: 6px auto; left: auto; transform: none;
    animation: v5inUp .55s cubic-bezier(.22, .85, .35, 1) .35s both;
  }
  /* 导航不再悬浮 → 130u 底衬回收（保留一点呼吸位即可） */
  html:not(.stage-portrait):not(.page-home) .main-area { padding-bottom: calc(24 * var(--u)); }
}

@media (max-width: 900px) {
  /* 非 stage 窄档（手机横屏等）：顶栏居中标题与右群相撞 → 副行/翼线隐藏、时钟让位 */
  html:not(.stage-portrait) .v2-tb-center .sub { display: none; }
  html:not(.stage-portrait) .v2-tb-center .main { font-size: 17px; letter-spacing: 2px; }
  html:not(.stage-portrait) .v2-tb-right { gap: 6px; }
  html:not(.stage-portrait) .v2-tb-right .v2-clockbox { display: none; }
  /* 二级页顶栏/页签：禁断行改横向滚动（§1.3 竖屏最右被裁；二级页不走 stage） */
  .topbar { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; }
  .topbar::-webkit-scrollbar { height: 0; }
  .topbar > * { flex: 0 0 auto; }
}
}