/* ── 世界观皮肤：三个世界的首屏 + 全页调色 + 各模块归属皮肤 ──────────────────── */
body[data-world="desk"] { --w-accent: #d0452b; --w-accent2: #2b5aa8; --w-paper: #fbf5e8; --w-bg1: #ffe9d2; --w-bg2: #dcecff; }
body[data-world="airship"] { --w-accent: #e6c477; --w-accent2: #ff7a59; --w-paper: #fbf3e2; --w-bg1: #2a1f4d; --w-bg2: #1b1626; }
body[data-world="popup"] { --w-accent: #ff8a65; --w-accent2: #2b5aa8; --w-paper: #fffdf6; --w-bg1: #fff5d6; --w-bg2: #cfe9ff; }
body[data-world] { background: #eef1f6; } body[data-world]::before { content: ''; position: fixed; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(180deg, var(--w-bg1), var(--w-bg2) 60%, #eef1f6 100%); }
body[data-world="airship"] .en-wrap { color: #fbf3e2; }
body[data-world="airship"] .en-wrap .en-section { background: rgba(43,34,51,.72); color: #fbf3e2; border-color: #4a4058; } body[data-world="airship"] .en-wrap .en-section .en-muted, body[data-world="airship"] .en-wrap .en-item .src, body[data-world="airship"] .en-wrap .lb-row .rk, body[data-world="airship"] .en-meta-line { color: #cbbfd6; }
body[data-world="airship"] .en-wrap .en-item, body[data-world="airship"] .en-wrap .dy-row, body[data-world="airship"] .en-wrap .lb-row.me { background: rgba(255,255,255,.06); border-color: #4a4058; } body[data-world="airship"] .en-wrap .en-tool { background: rgba(255,255,255,.08); color: #fbf3e2; border-color: #4a4058; } body[data-world="airship"] .en-wrap .en-tabs button { color: #fbf3e2; }
.season-decor { position: fixed; inset: 0; pointer-events: none; z-index: 1; }
.en-wrap { position: relative; z-index: 2; }
.scene { position: relative; border-radius: 26px; overflow: hidden; contain: paint inline-size; max-width: 100%; min-width: 0; min-height: 420px; box-shadow: 0 24px 60px rgba(28,42,58,.16); }
.scene .sw { position: absolute; right: 12px; top: 12px; z-index: 6; display: flex; gap: 6px; }
.scene .sw button { padding: 4px 10px; border-radius: 999px; font-size: 12px; background: rgba(255,255,255,.7); border: 1px solid rgba(0,0,0,.12); } .scene .sw button.on { background: #1c2a3a; color: #fff; }
.scene .festival { position: absolute; left: 14px; top: 12px; z-index: 6; background: rgba(255,255,255,.85); border-radius: 999px; padding: 5px 12px; font-size: 13px; }
/* 通用：入口物件 */
.scene .sc-go { all: unset; box-sizing: border-box; display: block; cursor: pointer; text-align: left; color: inherit; font: inherit; -webkit-tap-highlight-color: transparent; } .scene .sc-go:focus-visible { outline: 3px solid #ffd37a; outline-offset: 3px; }

/* A 桌面 */
.scene-desk { background: linear-gradient(180deg, #ffe9d2 0%, #ffd9b8 18%, #c98a52 18%, #a86e3e 100%); perspective: 1400px; perspective-origin: 50% 20%; padding: 56px 12px 22px; }
.scene-desk .desk { position: relative; width: 100%; transform: rotateX(15deg); transform-style: preserve-3d; transform-origin: 50% 0; }
.scene-desk .map { position: relative; aspect-ratio: 16/8.4; border-radius: 6px; background: linear-gradient(180deg, rgba(255,250,235,.35), rgba(255,250,235,.15)), url('assets/english/map-paper.jpg') center/cover; filter: saturate(1.15) brightness(1.06); box-shadow: 0 40px 80px rgba(60,30,10,.45), inset 0 0 0 2px rgba(255,255,255,.35); animation: unfold 1.2s cubic-bezier(.2,.9,.3,1) both; }
@keyframes unfold { from { transform: rotateX(-60deg) scaleY(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.scene-desk .route { position: absolute; inset: 0; width: 100%; height: 100%; } .scene-desk .route path { fill: none; stroke: #d0452b; stroke-width: 3; stroke-dasharray: 8 8; opacity: .85; } .scene-desk .route .glow { stroke: #fff; stroke-width: 7; opacity: .35; stroke-dasharray: none; }
.scene-desk .pin { position: absolute; z-index: 3; transform: translate(-50%, -100%); text-align: center; font: 600 10.5px/1.2 "IBM Plex Mono", ui-monospace, monospace; letter-spacing: .08em; color: #1c2a3a; animation: bob 3s ease-in-out infinite; }
.scene-desk .pin i { display: block; width: 16px; height: 16px; margin: 0 auto 4px; border-radius: 50% 50% 50% 0; transform: rotate(-45deg); background: #2b5aa8; border: 2px solid #fff; box-shadow: 0 6px 10px rgba(0,0,0,.25); } .scene-desk .pin.now i { background: #d0452b; width: 22px; height: 22px; } .scene-desk .pin.locked { opacity: .55; } .scene-desk .pin.locked i { background: #9aa4ad; } .scene-desk .pin span { background: rgba(255,255,255,.9); padding: 2px 6px; border-radius: 4px; }
@keyframes bob { 0%,100% { transform: translate(-50%, -100%); } 50% { transform: translate(-50%, -112%); } }
.scene-desk .plane { position: absolute; font-size: 26px; offset-path: path('M 120 340 C 260 240, 380 300, 520 200 S 820 160, 1040 120'); offset-rotate: auto; animation: fly 14s linear infinite; filter: drop-shadow(0 8px 6px rgba(0,0,0,.25)); }
@keyframes fly { from { offset-distance: 0%; } to { offset-distance: 100%; } }
.scene-desk .obj { position: absolute; z-index: 4; transform-style: preserve-3d; transition: transform .25s; } .scene-desk .obj:hover { transform: translateZ(40px) !important; }
.scene-desk .obj .card { position: relative; border-radius: 10px; box-shadow: 0 24px 40px rgba(60,30,10,.35); overflow: visible; height: 120px; background: var(--art) center/cover; background-clip: padding-box; border: 6px solid #fffdf6; border-bottom-width: 44px; box-sizing: content-box; }
.scene-desk .obj .lbl { position: absolute; left: 4px; right: 4px; bottom: -42px; height: 38px; font: 800 14px/1.2 -apple-system, "PingFang SC", sans-serif; color: #1c2a3a; display: flex; flex-direction: column; justify-content: center; } .scene-desk .obj .lbl small { display: block; font: 600 9.5px/1.3 "IBM Plex Mono", monospace; letter-spacing: .08em; color: #6b7684; }
.scene-desk .obj .go { position: absolute; right: 8px; bottom: -34px; font: 800 11px sans-serif; color: #fff; background: #d0452b; padding: 4px 10px; border-radius: 999px; box-shadow: 0 4px 10px rgba(208,69,43,.35); }
.scene-desk .obj.passport { left: 3%; top: 46%; width: 24%; transform: rotate(-6deg); } .scene-desk .obj.letter { left: 34%; top: 54%; width: 26%; transform: rotate(3deg); } .scene-desk .obj.recorder { right: 3%; top: 48%; width: 24%; transform: rotate(5deg); }
.scene-desk .obj { animation: floaty 5s ease-in-out infinite; } .scene-desk .obj.letter { animation-delay: 1.3s; } .scene-desk .obj.recorder { animation-delay: 2.6s; } @keyframes floaty { 0%,100% { translate: 0 0; } 50% { translate: 0 -6px; } }
.scene-desk .obj .seal { position: absolute; right: 10px; top: 8px; width: 42px; height: 42px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #e6664a, #b23a22 70%); box-shadow: 0 6px 12px rgba(120,40,20,.4); display: grid; place-items: center; } .scene-desk .obj .seal img { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; border: 2px solid #f3d3c5; }
.scene-desk .parrot { position: absolute; right: 5%; top: -9%; width: 14%; min-width: 96px; } .scene-desk .parrot img { width: 100%; filter: drop-shadow(0 24px 22px rgba(60,30,10,.4)); animation: bob 4s ease-in-out infinite; } .scene-desk .parrot .lbl { position: absolute; left: 0; right: 0; bottom: -14px; text-align: center; font: 700 12px -apple-system, sans-serif; background: rgba(255,255,255,.88); border-radius: 8px; padding: 4px 6px; }
.scene-desk .ticket { position: absolute; z-index: 2; left: 22%; top: -7%; width: 25%; min-width: 200px; transform: rotate(3deg); background: #fff; border-radius: 10px; box-shadow: 0 18px 30px rgba(60,30,10,.35); font-family: "IBM Plex Mono", ui-monospace, monospace; overflow: hidden; color: #1c2a3a; }
.scene-desk .ticket .stripe { height: 7px; background: repeating-linear-gradient(135deg, #d0452b 0 14px, #fff 14px 20px, #2b5aa8 20px 34px, #fff 34px 40px); } .scene-desk .ticket .body { padding: 8px 12px 10px; } .scene-desk .ticket .k { font-size: 9px; letter-spacing: .14em; color: #6b7684; } .scene-desk .ticket .big { font: 800 24px/1 Georgia, serif; color: #2b5aa8; margin: 4px 0 2px; }
.scene-desk .say { margin: 22px 0 0; padding: 14px 18px; color: #fff; background: rgba(40,20,8,.62); border-radius: 14px; text-shadow: 0 2px 8px rgba(0,0,0,.5); display: flex; gap: 16px; align-items: baseline; flex-wrap: wrap; } .scene-desk .say h2 { font: italic 700 clamp(20px, 3vw, 30px)/1.2 Georgia, "Songti SC", serif; margin: 0; } .scene-desk .say p { margin: 0; font: 13px "IBM Plex Mono", monospace; opacity: .95; }

/* B 舷窗 */
.scene-airship { background: linear-gradient(180deg, #2a1f4d 0%, #6a3e78 35%, #f0885a 70%, #ffd37a 100%); color: #fbf3e2; }
.scene-airship .window { position: relative; height: 380px; overflow: hidden; }
.scene-airship .layer { position: absolute; inset: 0; background-position: center bottom; background-size: cover; }
.scene-airship .clouds { background: radial-gradient(ellipse at 20% 40%, rgba(255,255,255,.35), transparent 40%), radial-gradient(ellipse at 70% 30%, rgba(255,255,255,.28), transparent 45%); animation: drift 40s linear infinite alternate; }
.scene-airship .near { background-image: url('assets/english/ny-clay-skyline.jpg'); background-size: 120% auto; background-position: 40% 100%; animation: drift 60s linear infinite alternate-reverse; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 25%); mask-image: linear-gradient(180deg, transparent 0%, #000 25%); }
@keyframes drift { from { background-position-x: 30%; } to { background-position-x: 60%; } }
.scene-airship .lights i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: #fff2b0; box-shadow: 0 0 8px 2px #ffd37a; animation: twinkle 2.6s ease-in-out infinite; } @keyframes twinkle { 0%,100% { opacity: .2; } 50% { opacity: 1; } }
.scene-airship .frame { position: absolute; inset: 0; pointer-events: none; box-shadow: inset 0 0 0 12px #2a2233, inset 0 0 0 17px #b98a3c, inset 0 0 100px rgba(0,0,0,.5); border-radius: 0 0 200px 200px / 0 0 80px 80px; }
.scene-airship .frame::before, .scene-airship .frame::after { content: ''; position: absolute; top: 0; bottom: 0; width: 17px; background: #b98a3c; left: 33%; box-shadow: 0 0 0 4px #2a2233; } .scene-airship .frame::after { left: auto; right: 33%; }
.scene-airship .greet { position: absolute; left: 6%; top: 16%; z-index: 3; max-width: 60%; } .scene-airship .greet .eyebrow { font: 600 10.5px/1 "IBM Plex Mono", monospace; letter-spacing: .2em; color: #ffd37a; } .scene-airship .greet h2 { font: 700 clamp(24px, 4vw, 42px)/1.1 Georgia, "Songti SC", serif; margin: 8px 0; text-shadow: 0 4px 24px rgba(0,0,0,.45); } .scene-airship .greet p { font: italic 14px/1.6 "Kaiti SC", "STKaiti", cursive; margin: 0; opacity: .92; }
.scene-airship .parrot { position: absolute; right: 7%; bottom: 6%; width: 150px; z-index: 3; filter: drop-shadow(0 30px 30px rgba(0,0,0,.5)); animation: hoverp 5s ease-in-out infinite; } @keyframes hoverp { 0%,100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-12px) rotate(2deg); } }
.scene-airship .console { position: relative; padding: 24px 18px 22px; background: linear-gradient(180deg, #2a2233, #1b1626); border-top: 5px solid #b98a3c; display: grid; grid-template-columns: 190px 1fr; gap: 18px; align-items: center; }
.scene-airship .gauge { position: relative; display: grid; width: 190px; height: 190px; border-radius: 50%; background: radial-gradient(circle at 50% 40%, #3b3149, #1f1a2b 70%); box-shadow: 0 0 0 8px #2a2233, 0 0 0 11px #b98a3c, 0 24px 40px rgba(0,0,0,.6); display: grid; place-items: center; color: #fbf3e2; }
.scene-airship .gauge .tick { position: absolute; inset: 14px; border-radius: 50%; background: conic-gradient(from 225deg, #ffd37a 0deg, #ffd37a var(--p, 0deg), rgba(255,255,255,.08) var(--p, 0deg), rgba(255,255,255,.08) 270deg, transparent 270deg); -webkit-mask: radial-gradient(circle, transparent 60%, #000 61%); mask: radial-gradient(circle, transparent 60%, #000 61%); }
.scene-airship .gauge .needle { position: absolute; left: 50%; top: 50%; width: 3px; height: 74px; margin-left: -1.5px; background: linear-gradient(#ff7a59, #ffd37a); border-radius: 3px; transform-origin: 50% 100%; transform: translateY(-100%) rotate(var(--r, -135deg)); animation: swing 2s ease-in-out both; }
@keyframes swing { 0% { transform: translateY(-100%) rotate(-135deg); } 60% { transform: translateY(-100%) rotate(calc(var(--r) + 14deg)); } 100% { transform: translateY(-100%) rotate(var(--r)); } }
.scene-airship .gauge .num { position: relative; text-align: center; margin-top: 56px; } .scene-airship .gauge .num b { display: block; font: 800 28px/1 Georgia, serif; color: #ffd37a; } .scene-airship .gauge .num small { font: 600 9.5px "IBM Plex Mono", monospace; letter-spacing: .18em; opacity: .85; }
.scene-airship .levers { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.scene-airship .lever { position: relative; display: block; color: #fbf3e2; background: linear-gradient(180deg, #3b3149, #2a2233); border: 1px solid #4a4058; border-top: 3px solid #b98a3c; border-radius: 14px; padding: 14px 12px 12px; min-height: 118px; box-shadow: 0 16px 30px rgba(0,0,0,.45); transition: transform .2s; overflow: hidden; } .scene-airship .lever:hover { transform: translateY(-5px); }
.scene-airship .lever::after { content: ''; position: absolute; right: -30px; bottom: -30px; width: 100px; height: 100px; border-radius: 50%; background: var(--art) center/cover; opacity: .35; }
.scene-airship .lever .plate { display: inline-block; font: 600 9.5px "IBM Plex Mono", monospace; letter-spacing: .16em; color: #1b1626; background: #e6c477; padding: 3px 7px; border-radius: 4px; } .scene-airship .lever b { display: block; font-size: 16px; margin: 10px 0 3px; } .scene-airship .lever span { font-size: 12px; opacity: .85; line-height: 1.45; display: block; max-width: 100%; position: relative; z-index: 1; }
.scene-airship .lever .handle { position: absolute; left: 12px; bottom: 12px; width: 9px; height: 30px; border-radius: 6px; background: linear-gradient(#ff7a59, #b23a22); }
.scene-airship .ticker { position: relative; height: 34px; background: #1b1626; font: 600 11px/18px "IBM Plex Mono", monospace; letter-spacing: .12em; color: #e6c477; white-space: nowrap; overflow: hidden; contain: paint inline-size; } .scene-airship .ticker span { position: absolute; left: 0; top: 8px; display: inline-block; will-change: transform; animation: tick 28s linear infinite; } @keyframes tick { from { transform: translateX(100vw); } to { transform: translateX(-100%); } }

/* C 立体书 */
.scene-popup { background: radial-gradient(circle at 50% 0%, #fff5d6 0%, #cfe9ff 45%, #b9d7f5 100%); perspective: 1500px; perspective-origin: 50% 30%; padding: 40px 14px 26px; }
.scene-popup .book { position: relative; transform-style: preserve-3d; transform: rotateX(18deg); animation: bookopen 1.4s cubic-bezier(.2,.9,.2,1) both; } @keyframes bookopen { from { transform: rotateX(55deg) scale(.9); opacity: 0; } to { transform: rotateX(18deg) scale(1); opacity: 1; } }
.scene-popup .page { position: relative; height: 440px; background: linear-gradient(180deg, #fffdf6, #f5eddc); border-radius: 18px; box-shadow: 0 50px 90px rgba(28,42,58,.3), inset 0 0 0 1px #fff; transform-style: preserve-3d; }
.scene-popup .page::before { content: ''; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: linear-gradient(#e6dcc4, #cbbf9f); }
.scene-popup .cut { position: absolute; left: 5%; right: 27%; bottom: 30px; height: 230px; transform-style: preserve-3d; }
.scene-popup .sky { position: absolute; inset: 0 0 20px 0; background: url('assets/english/poster-newyork.jpg') center 30%/cover; border-radius: 14px; -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent); mask-image: linear-gradient(180deg, #000 60%, transparent); transform: translateZ(-30px) rotateX(-6deg); opacity: .75; }
.scene-popup .city { position: absolute; left: 0; right: 0; bottom: 0; height: 200px; transform: translateZ(14px) rotateX(-90deg); transform-origin: bottom center; animation: popup 1.1s cubic-bezier(.2,.9,.2,1) .4s both; } @keyframes popup { from { transform: translateZ(14px) rotateX(-90deg); } to { transform: translateZ(14px) rotateX(-14deg); } }
.scene-popup .city img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; border-radius: 12px; filter: drop-shadow(0 30px 24px rgba(28,42,58,.35)); }
.scene-popup .who { position: absolute; bottom: -6px; width: 80px; transform: translateZ(36px) rotateX(-16deg); transform-origin: bottom center; animation: popup2 1s cubic-bezier(.2,.9,.2,1) .9s both; filter: drop-shadow(0 18px 14px rgba(28,42,58,.35)); } @keyframes popup2 { from { transform: translateZ(36px) rotateX(-90deg); opacity: 0; } to { transform: translateZ(36px) rotateX(-16deg); opacity: 1; } }
.scene-popup .who img { width: 100%; animation: breathe 3.5s ease-in-out infinite; } @keyframes breathe { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
.scene-popup .who.tony { left: 8%; } .scene-popup .who.rosa { left: 30%; width: 74px; } .scene-popup .who.maya { right: 30%; width: 70px; } .scene-popup .who.kofi { right: 6%; }
.scene-popup img.echo { position: absolute; left: 44%; bottom: 84px; width: 74px; transform: translateZ(50px); animation: hovere 4s ease-in-out infinite; filter: drop-shadow(0 20px 16px rgba(28,42,58,.35)); } @keyframes hovere { 0%,100% { transform: translateZ(50px) translateY(0) rotate(-3deg); } 50% { transform: translateZ(50px) translateY(-10px) rotate(3deg); } }
.scene-popup .lamp { position: absolute; width: 10px; height: 10px; border-radius: 50%; background: #ffb347; box-shadow: 0 0 18px 6px rgba(255,179,71,.6); animation: glow 2.4s ease-in-out infinite; transform: translateZ(20px); } @keyframes glow { 0%,100% { opacity: .5; } 50% { opacity: 1; } }
.scene-popup .tabs { position: absolute; right: -12px; top: 34px; display: flex; flex-direction: column; gap: 9px; transform: translateZ(60px); z-index: 5; }
.scene-popup .tab { display: flex !important; align-items: center; gap: 10px; color: #1c2a3a; background: var(--bg, #fff); border-radius: 12px 16px 16px 12px; padding: 9px 14px 9px 12px; box-shadow: 6px 8px 16px rgba(28,42,58,.25); transition: transform .2s; font-weight: 700; font-size: 14px; min-width: 176px; } .scene-popup .tab:hover { transform: translateX(10px); } .scene-popup .tab small { display: block; font: 500 11px/1.3 "Kaiti SC", "STKaiti", cursive; opacity: .8; } .scene-popup .tab .ico { font-size: 20px; }
.scene-popup .diary { position: absolute; left: 5%; top: 26px; width: 58%; z-index: 4; } .scene-popup .diary .date { font: 600 10.5px "IBM Plex Mono", monospace; letter-spacing: .16em; color: #6b7684; } .scene-popup .diary h2 { font: 700 clamp(18px, 2.4vw, 26px)/1.25 "Kaiti SC", "STKaiti", Georgia, cursive; margin: 6px 0 6px; } .scene-popup .diary p { font: 14px/1.6 "Kaiti SC", "STKaiti", cursive; margin: 0; color: #2a3a4f; }
.scene-popup .note { position: absolute; right: 3%; bottom: 34px; width: 230px; background: #ffe08a; padding: 10px 12px; border-radius: 4px; box-shadow: 0 14px 24px rgba(28,42,58,.25); transform: rotate(-3deg) translateZ(40px); color: #1c2a3a; font-family: "Kaiti SC", "STKaiti", cursive; z-index: 6; } .scene-popup .note::before { content: ''; position: absolute; left: 50%; top: -10px; width: 20px; height: 20px; margin-left: -10px; border-radius: 50%; background: #ff8a65; box-shadow: 0 3px 6px rgba(0,0,0,.25); } .scene-popup .note b { font-size: 17px; display: block; } .scene-popup .note span { font-size: 12.5px; } .scene-popup .note .prog { display: flex; gap: 6px; margin-top: 6px; } .scene-popup .note .prog i { width: 12px; height: 12px; border-radius: 50%; border: 2px solid #1c2a3a; } .scene-popup .note .prog i.on { background: #1c2a3a; }

/* 各模块归属皮肤 */
#ml-layer .ml-top { background: linear-gradient(180deg, #2a2233, #1b1626); color: #fbf3e2; border-bottom: 4px solid #b98a3c; } #ml-layer .ml-top .title, #ml-layer .ml-top .en-muted { color: #fbf3e2; } #ml-layer .ml-top button { color: #fbf3e2; border-color: #4a4058; background: #2a2233; }
#ml-layer { background: linear-gradient(180deg, #6a3e78 0%, #eef1f6 26%); }
#wt-layer .ml-top { background: linear-gradient(180deg, #c98a52, #a86e3e); color: #fff; border-bottom: 0; } #wt-layer .ml-top .title, #wt-layer .ml-top .en-muted { color: #fff; } #wt-layer { background: linear-gradient(180deg, #ffe9d2, #eef1f6 30%); }
#ec-layer .ml-top { background: linear-gradient(180deg, #dff3ea, #cfe9ff); } #ec-layer { background: radial-gradient(circle at 50% 0%, #fff5d6 0%, #cfe9ff 45%, #eef1f6 100%); }
#sh-layer .sh-top { background: linear-gradient(180deg, #fbf5e8, #f1e7d2); border-bottom: 3px solid #d0452b; }
@media (max-width: 760px) { .scene-desk .plane { display: none; } .scene-desk .obj { width: 30% !important; } .scene-desk .ticket { width: 44%; } .scene-airship .console { grid-template-columns: 1fr; justify-items: center; } .scene-airship .levers { grid-template-columns: 1fr 1fr; width: 100%; } .scene-airship .window { height: 300px; } .scene-airship .parrot { width: 100px; } .scene-popup .page { height: 560px; } .scene-popup .tabs { right: 8px; top: auto; bottom: 16px; flex-direction: row; flex-wrap: wrap; } .scene-popup .tab { min-width: 0; } .scene-popup .note { bottom: 110px; width: 200px; } .scene-popup .cut { bottom: 170px; right: 5%; } .scene-popup .diary { width: 88%; } }

/* 焦点轮转：每几秒把一个入口点亮一下，告诉孩子哪里能点；鼠标碰到就停 */
.scene .sc-go[data-open] { transition: transform .35s cubic-bezier(.2,.9,.3,1), filter .35s; }
.scene .sc-go.focus { filter: drop-shadow(0 0 18px rgba(255,211,122,.9)) brightness(1.06); z-index: 7 !important; }
.scene-desk .obj.focus { transform: rotate(0) translateZ(50px) scale(1.08) !important; animation: none; } .scene-desk .parrot.focus img { transform: scale(1.1); } .scene-desk .ticket.focus { transform: rotate(0) scale(1.06); }
.scene-airship .lever.focus { transform: translateY(-8px) scale(1.04); border-top-color: #ffd37a; } .scene-airship .gauge.focus { box-shadow: 0 0 0 8px #2a2233, 0 0 0 11px #ffd37a, 0 0 40px rgba(255,211,122,.8); }
.scene-popup .tab.focus { transform: translateX(14px) scale(1.06); } .scene-popup .note.focus { transform: rotate(0) translateZ(60px) scale(1.06); }
.scene .sc-go.focus::before { content: '点这里'; position: absolute; left: 50%; top: -14px; transform: translateX(-50%); z-index: 9; font: 800 11px "PingFang SC", sans-serif; color: #2b0812; background: linear-gradient(135deg, #ffe08a, #ffb347); padding: 3px 10px; border-radius: 999px; box-shadow: 0 6px 14px rgba(0,0,0,.25); animation: hintbob 1s ease-in-out infinite; white-space: nowrap; }
@keyframes hintbob { 0%,100% { translate: 0 0; } 50% { translate: 0 -4px; } }
#scene { transition: opacity .6s ease; } #scene.fade { opacity: 0; }
.scene .sw .dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.7); margin: 0 3px; }