/* =========================================================================
   首页照片轨道（v3.7 · 2026-09-21）—— 取代原「随机漂浮 3D 相框组」
   需求（老大 2026-09-21）：照片列竖向、鼠标滚轮滚动、C 位高清、版面尺寸合理
   结构：.rail > .rail-vp（视口，沿用原 fr3d-stage 的高度）> .rail-track + .rail-zoom
   ========================================================================= */

.rail-vp{position:relative;height:clamp(250px,52vh,640px);border-radius:16px;overflow:hidden;
  background:linear-gradient(180deg,#0A3122 0%,#08291D 46%,#061E15 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 26px 54px rgba(0,0,0,.34);
  touch-action:pan-y;cursor:ns-resize;outline:none}
.rail-vp::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;
  background:
    radial-gradient(120% 62% at 84% 4%,rgba(205,232,107,.13),transparent 62%),
    linear-gradient(180deg,rgba(6,24,16,.72) 0%,rgba(6,24,16,0) 15%,rgba(6,24,16,0) 84%,rgba(6,24,16,.72) 100%)}
.rail-vp:focus-visible{box-shadow:inset 0 0 0 2px var(--lime),0 26px 54px rgba(0,0,0,.34)}

.rail-track{position:absolute;inset:0;transform-style:preserve-3d;z-index:2}

.rail-i{position:absolute;left:50%;top:50%;margin:0;padding:6px;border:0;border-radius:12px;
  background:rgba(255,255,255,.09);box-shadow:0 18px 40px rgba(0,0,0,.42);
  transform-origin:50% 50%;will-change:transform;cursor:pointer;
  display:flex;flex-direction:column}
.rail-i img{display:block;width:100%;height:100%;object-fit:contain;border-radius:8px;background:#0F4630}
.rail-i .rail-shade{position:absolute;inset:6px;border-radius:8px;background:#061A12;
  opacity:0;pointer-events:none}
.rail-i .rail-cap{position:absolute;left:14px;right:14px;bottom:12px;z-index:3;
  font-size:11.5px;color:#EAF3EC;letter-spacing:.02em;
  text-shadow:0 2px 8px rgba(0,0,0,.75);opacity:0;transition:opacity .2s ease;pointer-events:none}
.rail-i.is-c .rail-cap{opacity:1}
/* C 位不显示左上角小标签，避免遮挡照片内容 */
.rail-i.is-c .rail-tip{opacity:0}
.rail-i .rail-tip{position:absolute;left:12px;top:12px;z-index:3;background:rgba(6,36,24,.84);
  color:#EAF3EC;font-size:10.5px;padding:3px 8px;border-radius:999px;letter-spacing:.04em}
/* 示意图角标（AI 生成或合成图 · 实拍替换后移除） */
.rail-i .rail-ai{position:absolute;right:14px;top:14px;z-index:4;background:rgba(255,196,71,.92);
  color:#3A2400;font-size:10.5px;letter-spacing:.06em;padding:2px 8px;border-radius:4px;font-weight:600}
.rail-i.is-c{cursor:zoom-in}
.rail-i:focus-visible{outline:3px solid var(--lime);outline-offset:4px}
.rail-i.is-c{box-shadow:0 30px 60px rgba(0,0,0,.55),0 0 0 1px rgba(205,232,107,.5)}

.rail-hint{position:absolute;left:14px;bottom:12px;z-index:5;font-size:12.5px;color:#DCEAE0;
  letter-spacing:.02em;pointer-events:none;background:rgba(6,32,21,.78);padding:6px 12px;
  border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.rail-hint b{color:var(--lime);font-weight:600}
.rail-hint .idx{color:#CDE86B;font-weight:600;margin-right:6px}

.rail-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:12.5px;
  letter-spacing:.03em;color:#8FBBA3}
.rail-legend .k{display:flex;align-items:center;gap:7px}
.rail-legend .k i{width:11px;height:11px;border-radius:3px;display:inline-block}
.rail-legend .k.a i{background:#CDE86B}
.rail-legend .k.b i{background:#63C7A6}
.rail-legend .k.c i{background:#E8C36B}
.rail-legend .k.d i{background:#9FB4C9}

/* 点击 C 位 → 全屏放大层 */
.rail-zoom{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;
  background:rgba(4,18,12,.9);backdrop-filter:blur(3px);padding:24px}
.rail-zoom.on{display:flex}
.rail-zoom img{max-width:min(1180px,92vw);max-height:82vh;width:auto;height:auto;border-radius:12px;
  box-shadow:0 40px 90px rgba(0,0,0,.6);background:#0F4630}
.rail-zoom .zcap{position:absolute;left:0;right:0;bottom:26px;text-align:center;color:#EAF3EC;
  font-size:13px;letter-spacing:.03em}
.rail-zoom .zclose{position:absolute;right:26px;top:22px;border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);color:#fff;font-size:13px;padding:8px 14px;border-radius:999px;
  cursor:pointer}

@media (max-width:980px){
  .rail-vp{height:520px}
}
@media (max-width:820px){
  .rail-vp{height:400px;border-radius:14px}
  .rail-i .rail-cap{font-size:11px}
  .rail-hint{font-size:11px}
}

@media (prefers-reduced-motion:reduce){
  .rail-i .rail-cap{transition:none}
}

/* 注册商标标记（悠芯鲜®）—— 小号上标，不改变品牌字体 */
.reg{font-size:.5em;vertical-align:super;letter-spacing:0;margin-left:2px;opacity:.92;font-family:var(--latin)}
.bcard h3 .reg,.tag .reg{font-size:.62em}