/* 模拟实况页 /os/sim（2026-10-04《子页改版》6.1，子代理 SIM）：页面 sitegen/sim_page.py，脚本 assets/sim.js 的 initSim。类名前缀 sp-。
   页首 = 首页首屏同款整屏舞台（尺寸、白色渐变、标题和按钮的位置照 index.html 内联样式 .home-demo 几条）：
   - .sp-hero 伸出 .wrap 铺满视口宽（--bleed，同 site.css「全屏铺满」）；文字仍和导航 Logo 对齐。
   - .sp-box = 舞台 .sp-stage + 紧贴下面的段落条 .sp-bar，一起占导航下面一整屏（100svh − 57px，560–1000px）；全屏时两者一起全屏。
   - .sp-txt 叠在舞台左上（kicker、H1、副题）和左下（两个按钮、示意说明）；只有链接和按钮接手点击，其余地方的拖动、点击都到 3D。
   - 手机和窄屏（≤980px）同首页手机舞台：文字浮在画面上方的白色渐变里（副题不显示），直接跑 3D，段落条横向滑。 */
.sp-hero{--sp-bar:52px;position:relative;isolation:isolate;margin-inline:calc(-1 * var(--bleed,0px));background:#fff}
.sp-box{display:flex;flex-direction:column;height:calc(100vh - 57px);height:calc(100svh - 57px);min-height:560px;max-height:1000px;background:#fff}
.sp-stage{position:relative;flex:1;min-height:0;overflow:hidden;background:#E6E9EC}
.sp-stage img,.sp-stage video,.sp-stage iframe{position:absolute;left:0;top:0;display:block;width:100%;height:100%;border:0}
.sp-stage img,.sp-stage video{object-fit:cover;object-position:62% 50%;transition:opacity .8s}
.sp-stage iframe{transform-origin:0 0;opacity:0;transition:opacity .8s}
.sp-stage video{opacity:0}
.sp-stage.live iframe,.sp-stage.vid-on video{opacity:1}
.sp-stage.live img,.sp-stage.vid-on img{opacity:0}
.sp-stage::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:
  radial-gradient(ellipse 50% 58% at 0 0,rgba(255,255,255,.97) 0,rgba(255,255,255,.92) 42%,rgba(255,255,255,.6) 68%,rgba(255,255,255,0) 100%),
  radial-gradient(ellipse 30% 30% at 0 100%,rgba(255,255,255,.92) 0,rgba(255,255,255,.7) 45%,rgba(255,255,255,0) 100%)}

.sp-txt{position:absolute;z-index:3;top:0;left:0;bottom:var(--sp-bar);display:grid;grid-template-rows:auto auto auto 1fr auto auto;justify-items:start;
  width:calc(620px + var(--bleed,0px));max-width:100%;padding:56px var(--gut) 20px calc(var(--bleed,0px) + var(--gut));pointer-events:none}   /* 上 56：栏目名、H1 同其余子页（2026-10-05，site.css「页首主文案同一位置」） */
.sp-txt a,.sp-txt button{pointer-events:auto}
.sp-txt .kicker{margin-bottom:14px}
.sp-txt h1{font-size:clamp(40px,4.4vw,60px);line-height:1.08;white-space:nowrap}
.sp-txt .lead{margin-top:18px;max-width:420px;font-size:15px;line-height:1.75;color:var(--ink-2);white-space:nowrap}
.sp-txt .phead-cta{grid-row:5;margin-top:0}
.sp-txt .phead-note{grid-row:6;position:static;margin:12px 0 0;font-size:11px;color:var(--ink-3)}

/* 减少动态效果、手机省流量（.manual，2026-10-05 起手机默认同首页直接跑 3D）：封面上两个按钮，访客自己选；选了以后（.started）收起，加载时一枚小签 */
.sp-pick{position:absolute;z-index:2;left:50%;top:50%;display:none;gap:10px;width:max-content;transform:translate(-50%,-50%)}
.sp-pick .btn{white-space:nowrap}
.sp-hero [hidden],.sp-hero .beam-wrap:has(>[hidden]){display:none!important}   /* 不支持 WebGL 时 sim.js 藏起「运行 3D」；全屏不可用时藏起「全屏」（.btn 的 display 会盖过 [hidden]） */
.sp-hero.manual .sp-pick{display:flex}
.sp-stage.started .sp-pick{display:none}
.sp-pick .btn:not(.btn-primary){background:rgba(255,255,255,.94)}
.sp-loading{position:absolute;z-index:2;left:50%;top:50%;margin:0;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.92);font-size:12px;color:var(--ink-2);
  white-space:nowrap;transform:translate(-50%,-50%);opacity:0;pointer-events:none;transition:opacity .3s}
.sp-hero.manual .sp-stage.loading .sp-loading{opacity:1;transition-delay:.6s}   /* 访客点了「运行 3D」才提示；自动加载时同首页，封面淡出就是提示 */

/* 段落条：首页 chip 的样子（白底细线小签）；当前段落浅蓝，底边一条进度（这一段放到哪了），iframe 每 0.25 秒报一次时刻 */
.sp-bar{flex:none;display:flex;align-items:center;gap:16px;height:var(--sp-bar);padding:0 calc(var(--bleed,0px) + var(--gut));border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
.sp-chips{position:relative;display:flex;align-items:center;gap:6px;min-width:0;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.sp-chips::-webkit-scrollbar{display:none}
.sp-chips>span{flex:none;margin-right:6px;font-size:11px;letter-spacing:.06em;color:var(--ink-3)}
.sp-chips .chip{position:relative;flex:none;overflow:hidden;font-family:inherit;line-height:18px;cursor:pointer;transition:color .2s,border-color .2s,background .2s}
.sp-chips .chip:hover{color:var(--ink);border-color:var(--ink-3)}
.sp-chips .chip:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.sp-chips .chip[aria-pressed="true"]{color:var(--blue);border-color:var(--blue-100);background:var(--blue-soft)}
.sp-chips .chip i{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--blue);transform:scaleX(var(--p,0));transform-origin:0 50%;opacity:0;transition:transform .25s linear}
.sp-chips .chip[aria-pressed="true"] i{opacity:1}
.sp-hint{flex:none;margin-left:auto;font-size:12px;color:var(--ink-3);white-space:nowrap}
.sp-fs{flex:none;height:32px;padding:0 14px;font-size:13px;white-space:nowrap}
.sp-bar>.beam-wrap{flex:none}   /* site.js 给按钮套的流光外框（它裁掉外沿）：在 flex 里不许被压窄 */
.sp-box:fullscreen{height:100%;min-height:0;max-height:none}
.sp-box:-webkit-full-screen{height:100%;min-height:0;max-height:none}
.sp-box:fullscreen .sp-bar{padding-inline:var(--gut)}
.sp-box:-webkit-full-screen .sp-bar{padding-inline:var(--gut)}

@media (max-width:980px){
  .sp-hero{--sp-bar:48px}
  .sp-box{min-height:480px}
  .sp-txt{right:0;bottom:auto;display:block;width:auto;max-width:none;padding:28px var(--gut) 40px;
    background:linear-gradient(180deg,rgba(255,255,255,.96) 0,rgba(255,255,255,.9) calc(100% - 44px),rgba(255,255,255,0))}
  .sp-txt .kicker{margin-bottom:14px}
  .sp-txt a.kicker{display:block;width:fit-content}   /* 栏目名、H1 同其余子页：导航下 28 / 54px（2026-10-05） */
  .sp-txt h1{font-size:max(26px,min(40px,calc((100vw - 2 * var(--gut)) / var(--h1n,8.6))));line-height:1.12}
  .sp-txt .lead{display:none}
  .sp-txt .phead-cta{margin-top:12px;gap:8px}
  .sp-txt .phead-cta .btn{height:34px;padding:0 14px;font-size:13px}
  .sp-txt .phead-cta .btn:not(.btn-primary){background:rgba(255,255,255,.92)}
  .sp-txt .phead-note{margin-top:8px}
  .sp-stage::after{display:none}
  .sp-stage img,.sp-stage video{object-position:50% 100%}   /* 竖屏封面和视频底边对齐（主卡片在底部），上面被文字区盖住的一截先裁 */
  .sp-pick,.sp-loading{top:calc(50% + var(--sp-inset,0px) / 2)}   /* 文字区下面那块画面的正中（--sp-inset 由 sim.js 写入） */
  .sp-chips>span,.sp-hint{display:none}
  .sp-chips{padding-right:20px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}   /* 右边淡出：还能往左滑 */
  .sp-bar{gap:10px}
  .sp-bar>.sp-fs,.sp-bar>.beam-wrap{margin-left:auto}
}

/* 更多场景：本页卡片放 5 秒循环（sitegen/sim_page.py sim_loop），和现场重放的封面一样 16:10 */
.sp-more .sp-fig{position:relative;display:block;aspect-ratio:16/10;margin-bottom:6px;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:#E6E9EC}
.sp-more .sp-fig img,.sp-more .sp-fig video{position:absolute;inset:0;display:block;width:100%;height:100%;margin:0;border:0;border-radius:0;aspect-ratio:auto;object-fit:cover}
.sp-more .sp-fig video{object-position:50% 70%}