/* ================= 第八幕 照片星空 ================= */
.ph-stage { touch-action: pan-y; }
.ph-head { position: absolute; top: calc(7% + var(--st)); left: 0; right: 0; z-index: 250; pointer-events: none; padding: 0 20px; }
.ph-sphere { position: absolute; inset: 0; touch-action: pan-y; }
.ph-orb { position: absolute; left: 0; top: 0; padding: 4px; background: #fff6e8; border: 2.5px solid var(--ink); border-radius: 12px; box-shadow: 0 6px 14px rgba(8, 6, 40, .35); will-change: transform, opacity; }
.ph-orb img { width: 100%; height: 100%; object-fit: cover; border-radius: 7px; pointer-events: none; }
.ph-orb .bd { position: absolute; right: -8px; top: -8px; width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-style: normal; font-size: 12px; color: var(--ink); background: var(--gold); border: 2.5px solid var(--ink); font-family: var(--f-num); font-weight: 700; }
.ph-orb.t-video .bd { background: var(--pink); padding-left: 2px; }
.ph-orb.t-scratch img { filter: grayscale(1) brightness(1.25) contrast(.4); }
.ph-orb.t-scratch::after { content: '刮刮乐'; position: absolute; inset: 4px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-family: var(--f-cute); font-size: 13px; color: #6a5a98; background: repeating-linear-gradient(-45deg, #e6e1f3 0 6px, #d4cdea 6px 12px); }
.ph-orb.t-develop img { filter: brightness(.22) sepia(1) blur(1.5px); }
.ph-orb.picked { animation: picked 1s var(--ease-pop); box-shadow: 0 0 0 4px var(--gold), 0 0 40px rgba(255, 211, 107, .9); }
@keyframes picked { 0% { filter: brightness(1); } 40% { filter: brightness(1.6); } 100% { filter: brightness(1); } }
.ph-center { position: absolute; left: 0; top: 0; z-index: 100; display: flex; flex-direction: column; align-items: center; gap: 6px; pointer-events: none; opacity: 0; }
.ph-her { width: 96px; height: 96px; border-radius: 50%; border: 4px solid #fff; box-shadow: 0 0 0 3px var(--ink), 0 0 50px rgba(255, 190, 220, .9); overflow: hidden; position: relative; z-index: 1; }
.ph-her img { width: 100%; height: 100%; object-fit: cover; }
.ph-halo { position: absolute; left: 50%; top: 48px; width: 230px; height: 230px; margin: -115px 0 0 -115px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 220, 240, .55), rgba(255, 160, 210, .18) 45%, rgba(255, 160, 210, 0) 70%); animation: halo 3s ease-in-out infinite; }
@keyframes halo { 0%, 100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.12); opacity: 1; } }
.ph-center span { position: relative; z-index: 1; font-size: 15px; color: var(--ink); background: var(--pink3); border: 2.5px solid var(--ink); padding: 0 12px; border-radius: 99px; }
.ph-ui { position: absolute; left: 0; right: 0; bottom: calc(max(9%, 70px) + var(--sb)); z-index: 250; display: flex; flex-direction: column; align-items: center; gap: 8px; opacity: 0; }
.ph-tip { font-size: 13.5px; color: var(--txt2); }