/* 首页专用样式（几何位置由 pages/index.js 按视口计算） */

/* 巨型字标 */
.wm { left: 0; top: 0; width: 100%; z-index: 6; pointer-events: none; }
.wm-l {
  position: absolute; left: 0; top: 0; display: block;
  font: italic 800 23vw/0.88 var(--f-en); letter-spacing: -.055em;
  color: #fff;
  text-shadow:
    1px 0 0 rgba(255,228,190,.7),
    0 1px 0 rgba(255,255,255,.95),
    0 6px 8px rgba(110,45,0,.2),
    0 22px 28px rgba(160,60,0,.16);
  transform-origin: 50% 50%;
}
.wm-floor {
  position: absolute; left: 50%; width: 46vw; height: 7vh; margin-left: -23vw;
  border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(140,60,0,.32), transparent 70%);
  filter: blur(10px);
}
.wm-subs { left: 0; top: 0; z-index: 3; pointer-events: none; }
.wm-sub { position: absolute; left: 0; top: 0; text-align: center; transform: translate(-50%, 0); white-space: nowrap; opacity: 0; }
.wm-sub b { display: block; font: 600 22px/1.3 var(--f-en); color: var(--ink); letter-spacing: -.005em; }
.wm-sub span { display: block; margin-top: 4px; font: 500 18px/1.3 var(--f-cn); color: var(--ink-2); }

/* 主胶囊（DOM 真玻璃；几何由 clip-path 控制，不改布局） */
.cap { z-index: 5; pointer-events: none; }
.cap-in, .cap-breath { position: absolute; inset: 0; }
.cap-glass {
  position: absolute; inset: 0; overflow: hidden;
  -webkit-backdrop-filter: blur(18px) saturate(190%) brightness(1.06); backdrop-filter: blur(18px) saturate(190%) brightness(1.06);
  background: linear-gradient(160deg, rgba(255,255,255,.52), rgba(255,250,240,.24) 52%, rgba(255,244,226,.40));
}
.cap-flow {
  position: absolute; left: 0; top: 0; width: 300%; height: 100%; opacity: .18; mix-blend-mode: screen;
  background: linear-gradient(90deg, #FF9900, #407AAA 16.6%, #587B3B 33.3%, #A85F34 50%, #FF9900 66.6%, #407AAA 83.3%, #587B3B 100%);
}
.cap-spec { position: absolute; inset: 0; background: radial-gradient(28% 60% at var(--gx, 32%) var(--gy, 18%), rgba(255,255,255,.7), transparent 70%); mix-blend-mode: soft-light; }
.cap-edge { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; }
.cap-edge rect.e { fill: none; stroke: rgba(255,255,255,.95); stroke-width: 1; }
.cap-edge rect.w { fill: none; stroke: url(#capWarm); stroke-width: 1.5; }
.cap-shadow { position: absolute; left: 10%; right: 10%; top: 60%; height: 50%; border-radius: 50%; background: rgba(170,95,20,.16); filter: blur(26px); transform-origin: 50% 0; }
.cap-text { z-index: 6; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); white-space: nowrap; font: 600 20px/1 var(--f-cn); color: var(--ink); letter-spacing: .02em; opacity: 0; }

/* 首屏说明：字标仍是动画主体，说明落在字标上方与下方的空位 */
.tz-0 { left: 0; right: 0; top: 0; height: 100%; text-align: center; opacity: 1; }
.tz-0 .hero-in { position: absolute; inset: 0; }
.tz-0 .eyebrow {
  position: absolute; left: 0; right: 0;
  font: 600 18px/1 var(--f-cn); letter-spacing: .22em; color: rgba(70,32,0,.88);
}
.tz-0 .hero-copy { position: absolute; left: 8vw; right: 8vw; }
.tz-0 .hero-name { font: 700 34px/1.2 var(--f-cn); color: var(--ink); letter-spacing: .04em; }
.tz-0 .slogan { margin-top: 10px; font: 500 18px/1.55 var(--f-cn); color: var(--ink-2); }
.tz-0 .slogan-en { margin-top: 8px; font: 600 16px/1.4 var(--f-cn); letter-spacing: .08em; color: var(--ink-2); }
.scroll-hint { left: 50%; bottom: 26px; width: 1px; height: 56px; margin-left: -.5px; z-index: 6; overflow: hidden; }
.scroll-hint i { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,17,21,0), rgba(15,17,21,.55)); transform-origin: 50% 0; }

/* 文字保护区 */
.tz-2 { left: 6vw; top: 11vh; width: 56vw; }
.tz-2n { right: 5.5vw; top: 12.2vh; display: flex; gap: 12px; }
.tz-2n .cnt { width: 104px; text-align: left; }
.tz-2n b { display: block; font: 700 48px/1 var(--f-en); color: var(--ink); letter-spacing: -.02em; }
.tz-2n span { display: block; margin-top: 8px; font: 500 14px/1.3 var(--f-cn); color: var(--ink-3); white-space: nowrap; }
.tz-3 { left: 6vw; bottom: 6vh; width: 36vw; min-width: 460px; }
.tz-4 { left: 6vw; right: 6vw; bottom: 5vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4vw; align-items: end; }
.tz-4 ul.scenes { margin: 0; }
.tz-5 { left: 6vw; top: 11vh; width: 52vw; }
.tz-6 { left: 0; right: 0; top: 11vh; text-align: center; }
.tz-6 p.desc { margin-left: auto; margin-right: auto; }
.tz-7 { left: 0; right: 0; top: 18.5vh; text-align: center; }
.tz-8 { left: 5vw; top: 11vh; width: 70vw; }
.tz-9 { left: 0; right: 0; top: 0; text-align: center; }
.tz-9 .enter {
  position: absolute; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 12px;
  padding: 10px 22px; border-radius: 28px; font: 600 20px/1.2 var(--f-cn); color: var(--ink); pointer-events: auto;
  background: rgba(255,255,255,.55); box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), var(--sh-1);
}
.tz-9 .enter svg { width: 40px; height: 16px; color: var(--c-med-ink); overflow: visible; }
.tz-9 .enter .ar-l { transition: d .4s var(--ease-out); }
.tz-9 .enter .ar-h { transition: transform .4s var(--ease-out); }
.tz-9 .enter:hover .ar-l { d: path("M2 8H38"); }
.tz-9 .enter:hover .ar-h { transform: translateX(8px); }

/* 画布标签（世界坐标，DOM 渲染） */
.st-label { font: 500 15px/1 var(--f-cn); color: var(--ink-2); white-space: nowrap; opacity: 0; }
.dock { opacity: 0; }
.dock .flash { position: absolute; inset: -3px; border-radius: 21px; box-shadow: 0 0 0 3px var(--c), 0 0 28px color-mix(in oklch, var(--c) 60%, transparent); opacity: 0; pointer-events: none; }
.m-label { font: 600 17px/1.2 var(--f-cn); color: var(--ink); white-space: nowrap; text-align: center; opacity: 0; }
.m-label small { display: block; font: 500 14px/1.3 var(--f-cn); color: var(--ink-3); margin-bottom: 2px; }
.m-label.chip-l { font-weight: 600; display: flex; align-items: center; gap: 8px; }
.m-label.chip-l i { width: 9px; height: 9px; border-radius: 50%; background: var(--c); flex: none; }
.m-label.gold-l { color: var(--c-gold-ink); font-weight: 700; }
.m-label.cap-l { color: var(--ink); }
.seg-label { font: 600 16px/1.2 var(--f-cn); color: var(--ink-2); white-space: nowrap; transform: translate(-50%, 0); opacity: 0; }
.hourglass { width: 30px; height: 30px; color: var(--c-ops); opacity: 0; }
.hourglass svg { width: 100%; height: 100%; }

/* 屏幕层：时钟、决定点 */
.clock { width: 120px; height: 120px; border-radius: 50%; opacity: 0; }
.clock svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.dec-label { font: 500 15px/1.2 var(--f-cn); color: var(--ink-2); white-space: nowrap; opacity: 0; }
.stack-l { font: 500 15px/1 var(--f-cn); color: var(--ink); white-space: nowrap; transform: translate(-50%, -50%); opacity: 0; }
.approve { display: flex; align-items: center; gap: 8px; font: 600 16px/1.2 var(--f-cn); color: var(--ink); white-space: nowrap; opacity: 0; }
.approve .person { width: 30px; height: 30px; color: var(--c-gold); }
.approve .person svg { width: 100%; height: 100%; }

/* 系统方块（DOM 接管） */
.world .overlay .tile { opacity: 0; visibility: hidden; }

/* 四块面板 */
.fpanel {
  --c: var(--c-med);
  position: absolute; display: flex; flex-direction: column; padding: 20px 20px 18px; border-radius: 28px; overflow: hidden; color: var(--ink);
  opacity: 0; visibility: hidden;
}
.fpanel header { display: flex; align-items: baseline; gap: 10px; }
.fpanel header b { font: 700 20px/1.2 var(--f-en); letter-spacing: .01em; }
.fpanel header span { font: 500 15px/1.2 var(--f-cn); color: var(--ink-2); }
.fpanel header::after { content: ""; margin-left: auto; width: 10px; height: 10px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 4px color-mix(in oklch, var(--c) 22%, transparent); align-self: center; }
.fpanel .vig { position: relative; flex: 1; margin: 14px 0; border-radius: 18px; overflow: hidden; background: rgba(255,255,255,.55); box-shadow: inset 0 0 0 1px rgba(15,17,21,.06); }
.fpanel > p { font: 500 16px/1.5 var(--f-cn); color: var(--ink-2); text-wrap: pretty; }
.vig > * { position: absolute; }
.vig .page { left: 12px; top: 12px; width: 56%; bottom: 12px; overflow: hidden; border-radius: 10px; background: #fff; box-shadow: var(--sh-1); }
.vig .page .lines { position: absolute; left: 0; top: 0; right: 0; padding: 10px 12px; }
.vig .page .lines p { font: 400 14px/1.55 var(--f-cn); color: var(--ink-3); white-space: nowrap; }
.vig .page .lines p.h { font-weight: 700; color: var(--ink); }
.vig .rchip { right: 10px; height: 30px; padding: 0 10px 0 8px; display: flex; align-items: center; gap: 6px; border-radius: 15px; font: 500 14px/1 var(--f-cn); color: var(--ink); white-space: nowrap; background: rgba(255,255,255,.95); box-shadow: inset 0 0 0 1px color-mix(in oklch, var(--c) 45%, white), var(--sh-1); }
.vig .rchip i { width: 7px; height: 7px; border-radius: 50%; background: var(--c); }
.vig .scan { left: 12px; top: 12px; width: 44%; bottom: 12px; border-radius: 10px; background: linear-gradient(180deg, #F3F1EC, #E9E6DF); box-shadow: var(--sh-1); overflow: hidden; }
.vig .scan u { position: absolute; left: 10%; height: 6px; border-radius: 3px; background: rgba(90,80,70,.22); }
.vig .scan .beam { position: absolute; left: 0; right: 0; top: 0; height: 26px; background: linear-gradient(180deg, transparent, rgba(255,153,0,.35), transparent); }
.vig .cl { right: 10px; top: 14px; width: 48%; display: grid; gap: 8px; }
.vig .cl div { display: flex; align-items: center; gap: 6px; font: 500 14px/1.25 var(--f-cn); color: var(--ink-2); }
.vig .cl s { flex: none; width: 18px; height: 18px; border-radius: 5px; box-shadow: inset 0 0 0 1.5px rgba(15,17,21,.2); display: grid; place-items: center; text-decoration: none; }
.vig .cl s svg { width: 12px; height: 12px; color: var(--c-dms); opacity: 0; }
.vig .cl em { font-style: normal; font-size: 14px; color: #9A5B00; background: rgba(255,204,0,.35); border-radius: 4px; padding: 0 4px; opacity: 0; }
.vig .tbl { left: 12px; right: 12px; top: 12px; bottom: 12px; overflow: hidden; }
.vig .tbl .rows { position: absolute; left: 0; right: 0; top: 0; }
.vig .tbl .r { display: grid; grid-template-columns: 1.1fr .8fr 1.2fr; gap: 6px; padding: 6px 8px; border-radius: 8px; font: 500 14px/1.3 var(--f-en); color: var(--ink-3); white-space: nowrap; }
.vig .tbl .r.hd { color: var(--ink); font-weight: 700; }
.vig .tbl .r.hot { color: var(--ink); }
.vig .tbl .hl { position: absolute; left: 0; right: 0; height: 30px; border-radius: 8px; background: rgba(255,153,0,.22); box-shadow: inset 0 0 0 1.5px rgba(255,153,0,.6); }
.vig .bubble { right: 12px; bottom: 14px; width: 74%; padding: 10px 12px; border-radius: 14px 14px 4px 14px; font: 500 14px/1.45 var(--f-cn); color: var(--ink); background: #fff; box-shadow: inset 0 0 0 1.5px color-mix(in oklch, var(--c) 50%, white), var(--sh-2); white-space: normal; }
.vig .bubble b { display: block; font: 700 13px/1.2 var(--f-en); color: var(--c-med-ink); margin-bottom: 3px; }
.vig .tfl { left: 12px; right: 12px; top: 12px; padding: 10px 12px; border-radius: 10px; background: #fff; box-shadow: var(--sh-1); }
.vig .tfl h6 { margin: 0 0 6px; font: 700 14px/1.3 var(--f-cn); color: var(--ink); }
.vig .tfl div { display: flex; justify-content: space-between; font: 500 14px/1.6 var(--f-cn); color: var(--ink-3); }
.vig .tfl div b { font: 700 14px/1.6 var(--f-en); color: var(--ink); }
.vig .csr { left: 12px; right: 12px; bottom: 12px; padding: 10px 12px; border-radius: 10px; background: rgba(255,255,255,.9); box-shadow: inset 0 0 0 1px rgba(15,17,21,.07); font: 400 14px/1.7 var(--f-cn); color: var(--ink-2); }
.vig .csr .slot { display: inline-block; min-width: 46px; height: 1.2em; vertical-align: -2px; border-radius: 4px; background: rgba(88,123,59,.14); }
.vig .csr .para-on { color: var(--ink); }
.vig .fly { font: 700 14px/1 var(--f-en); color: var(--c-dms); white-space: nowrap; }

/* 正文区：部门卡 */
.dept-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; perspective: 1400px; }
@media (min-width: 1280px) { .dept-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } .dcard { padding: 26px 22px 24px; } }
.dcard { --c: var(--c-med); padding: 28px 26px 26px; border-radius: 26px; color: var(--ink-2); }
.dcard .d-top { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.dcard .d-top i { width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; color: var(--c); background: color-mix(in oklch, var(--c) 14%, white); }
.dcard .d-top i svg { width: 20px; height: 20px; }
.dcard h3 { font-size: 22px; line-height: 1.3; }
.dcard dl { margin: 0; display: grid; gap: 16px; }
.dcard dt { font: 700 15px/1.3 var(--f-cn); color: var(--ink); margin-bottom: 4px; }
.dcard dd { margin: 0; font-size: 16px; line-height: 1.6; }
.dcard dd.who { color: var(--c-gold-ink); }
.vig .fly { left: 0; top: 0; }
.vig .rchip { top: 0; }
.ring-l b { display: block; font: 700 16px/1.3 var(--f-cn); color: var(--c-gold-ink); margin-bottom: 2px; }
[data-scroll-view] { -webkit-mask: linear-gradient(180deg, transparent 0, #000 14px, #000 calc(100% - 22px), transparent 100%); mask: linear-gradient(180deg, transparent 0, #000 14px, #000 calc(100% - 22px), transparent 100%); }

/* 返修：关键节点有名（16.1-5） */
.core-l { font: 600 16px/1.2 var(--f-cn); color: var(--ink); white-space: nowrap; opacity: 0; display: flex; gap: 6px; align-items: baseline; }
.core-l b { font: 800 16px/1.2 var(--f-en); color: var(--c-med-ink); letter-spacing: .04em; }
.seg-in { font: 600 16px/1 var(--f-cn); color: var(--ink); white-space: nowrap; opacity: 0; }
.aegis-l { display: flex; gap: 6px; align-items: baseline; padding: 4px 12px; border-radius: 14px; background: #F7F5F1; box-shadow: inset 0 0 0 1.5px #52627A; font: 600 15px/1.2 var(--f-cn); color: var(--ink); white-space: nowrap; opacity: 0; }
.aegis-l b { font: 800 15px/1.2 var(--f-en); color: #52627A; letter-spacing: .04em; }
.m-label.pk-l { display: grid; gap: 4px; text-align: left; font: 500 15px/1.3 var(--f-cn); color: var(--ink-2); }
.m-label.pk-l b { font: 700 17px/1.3 var(--f-cn); color: var(--c-gold-ink); margin-bottom: 2px; }
.dec-label.s-l { font: 600 16px/1.2 var(--f-cn); color: var(--ink); }
.dock.cmp .flash { border-radius: 17px; }
