:root{font-family:'Microsoft YaHei','PingFang SC',sans-serif;color:#f5e8ca;background:#040e1e;color-scheme:dark}*{box-sizing:border-box}body{margin:0;padding:18px 24px 32px}button{font:inherit;min-height:44px;padding:10px 16px;border:1px solid #486078;border-radius:6px;background:#11273c;color:#e9f0f7;cursor:pointer}button:disabled{opacity:.45;cursor:wait}button:hover{background:#2a4659;border-color:#e9cb8f}button:focus-visible,input:focus-visible{outline:3px solid #ffeab0;outline-offset:3px}.review{max-width:1600px;margin:0 auto 13px;display:flex;justify-content:space-between;gap:15px;color:#b7cada;font-size:15px}.review span{color:#e4c78c}#player{max-width:1600px;margin:auto;box-shadow:0 16px 70px #0006;background:#071525}#viewport{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden}#stage{position:absolute;width:1920px;height:1080px;transform-origin:top left;overflow:hidden;isolation:isolate}.earth{position:absolute;inset:0;width:100%;height:100%}h1{position:absolute;top:26px;left:55px;font-size:27px;letter-spacing:7px;font-weight:500;margin:0;color:#f4dfa9;text-shadow:0 2px 10px #000}.china{position:absolute;left:944px;top:515px;font-size:34px;letter-spacing:12px;color:#ffedb3;text-shadow:0 3px 15px #30290a}#lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}.flight-path{fill:none;stroke:#ffdf93;stroke-width:2.6;stroke-linecap:round;filter:drop-shadow(0 0 7px #ffba52)}.photo-link{fill:none;stroke:#f4d596;stroke-width:1.25;stroke-dasharray:4 6}.pin{position:absolute;width:44px;height:45px;z-index:7;transform-origin:10px 43px;pointer-events:none;filter:drop-shadow(0 2px 5px #001123)}.pin svg{width:100%;height:100%}.dot{position:absolute;width:16px;height:9px;border-radius:50%;border:1.5px solid #ffe4a2;box-shadow:0 0 12px #ffc872;background:#f7d18255;z-index:5}.place-name{position:absolute;white-space:nowrap;color:#ffe7a7;font-size:16px;letter-spacing:1px;text-shadow:0 2px 6px #06101f,0 0 10px #06101f;z-index:5;pointer-events:none}.photo-wrap{position:absolute;width:290px;height:254px;z-index:8;transform-origin:center;will-change:transform,opacity}.photo-btn{padding:0;display:block;width:290px;height:214px;min-height:0;overflow:hidden;border-radius:15px;border:2px solid #efd394;background:#071725e8;box-shadow:0 6px 18px #0009;position:relative}.photo-btn:hover{border-color:#fff2bf;background:#0d2940;box-shadow:0 0 23px #ffd37b66}.photo-btn img{display:block;width:100%;height:100%;object-fit:contain}.photo-title{margin:9px -10px 0;white-space:nowrap;text-align:center;font-size:24px;line-height:1.2;font-weight:600;color:#fff0d0;text-shadow:0 2px 8px #031424,0 2px 3px #031424}.friend{position:absolute;width:70px;height:70px;z-index:9;pointer-events:none;will-change:left,top}.friend img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 6px 8px #0005)}.settled .friend img{animation:float 3.8s ease-in-out infinite;animation-delay:var(--delay)}@keyframes float{0%,100%{transform:translateY(-2px) rotate(-1deg)}50%{transform:translateY(3px) rotate(1deg)}}.paused .friend img,.paused #lead img{animation-play-state:paused!important}.reduced .friend img,.capture .friend img,.reduced #lead img,.capture #lead img{animation:none!important}#lead{position:absolute;left:900px;top:745px;width:150px;z-index:10;pointer-events:none;transition:opacity .3s}#lead img{width:100%;filter:drop-shadow(0 8px 15px #00142b);transform:none}.controls{display:flex;flex-wrap:wrap;align-items:center;gap:9px;padding:11px 14px}.primary{background:#eecb86;border-color:#eecb86;color:#11283b;font-weight:700}.primary:hover{background:#ffe1a4}.controls label{display:flex;align-items:center;gap:6px;font-size:14px;color:#bdd0df}.controls input{width:17px;height:17px;accent-color:#eecb86}#status{flex:1;color:#afc5d7;font-size:14px;margin:0 6px}progress{display:block;height:3px;width:100%;border:0}progress::-webkit-progress-bar{background:#0f2b43}progress::-webkit-progress-value{background:#dfc085}.notes{max-width:1600px;margin:18px auto 0;color:#a9bdcc;font-size:14px;line-height:1.8}.notes p{margin:9px 0}.notes b{color:#e7d1a4;font-size:16px}.states{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}.states button{font-size:13px;min-height:38px;padding:8px 13px}dialog{width:min(1200px,95vw);max-height:95vh;background:#0b1c2c;color:#f6e8c9;border:1px solid #d5b879;border-radius:8px;padding:18px;box-shadow:0 20px 80px #000a}dialog::backdrop{background:#020812d9}dialog header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}dialog h2{margin:0;font-size:22px}#full-photo{display:block;width:100%;height:min(74vh,780px);object-fit:contain;background:#04121d}#player:fullscreen{max-width:none;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;background:#030a14}#player:fullscreen #viewport{width:min(100%,calc((100vh - 72px)*16/9));max-height:calc(100vh - 72px);margin:auto auto 0}#player:fullscreen .controls{justify-content:center;margin:0 0 auto;width:100%}.capture{padding:0}.capture .review,.capture .controls,.capture .notes,.capture progress{display:none}.capture #player{width:1920px;max-width:none}.capture #viewport{width:1920px;height:1080px}.capture #stage{transform:none!important}.capture *{transition:none!important}@media(max-width:650px){body{padding:10px}.review{font-size:12px;flex-wrap:wrap}.controls{padding:9px;gap:7px}.controls button{font-size:13px;padding:9px 11px}#status{flex-basis:100%;order:10}.notes{font-size:13px}.notes b{font-size:14px}}@media(prefers-reduced-motion:reduce){.friend img{animation:none!important}}
