:host { position: absolute; inset: 0; display: block; }
.victory-scene { position: absolute; inset: 0; overflow: hidden; background: #101713; color: #f5e8be; }
.scene-sky { position: absolute; inset: 0; background: linear-gradient(150deg,#344940 0%,#15241f 48%,#0b100e 100%); }
.scene-sun { position: absolute; top: 10%; right: 13%; width: 18vh; height: 18vh; border-radius: 50%; background: #e8c66d; box-shadow: 0 0 8vh rgba(232,198,109,.36); opacity: .62; }
.scene-grain { position: absolute; inset: 0; z-index: 20; opacity: .08; background: repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(255,255,255,.12) 4px); pointer-events: none; }
.scene-vignette { position: absolute; inset: 0; z-index: 19; box-shadow: inset 0 0 12vh 3vh rgba(0,0,0,.72); pointer-events: none; }
.scene-caption-line { position: absolute; z-index: 22; top: 5%; left: 4%; padding-left: 10px; border-left: 3px solid #df5a4d; color: rgba(255,255,255,.62); font-size: 10px; font-weight: 800; line-height: 16px; }

/* Shared figures and vehicles */
.soldier { position: absolute; z-index: 8; width: 6%; height: 31%; transform-origin: bottom; }
.soldier-head { position: absolute; top: 0; left: 30%; width: 38%; height: 16%; border-radius: 50%; background: #0c100e; }
.soldier-head::before { position: absolute; top: -22%; left: -18%; width: 136%; height: 45%; border-radius: 50% 50% 0 0; background: #252f29; content: ''; }
.soldier-body { position: absolute; top: 15%; left: 19%; width: 62%; height: 54%; background: #1a241f; clip-path: polygon(20% 0,80% 0,100% 82%,72% 100%,50% 72%,25% 100%,0 80%); }
.rifle { position: absolute; top: 20%; left: 55%; width: 7%; height: 68%; background: #070a08; transform: rotate(-23deg); transform-origin: top; }
.rifle::after { position: absolute; right: -250%; bottom: -4%; width: 500%; height: 15%; background: #111713; content: ''; }
.tank { position: absolute; z-index: 8; width: 23%; height: 18%; }
.tank::before { position: absolute; right: 7%; bottom: 16%; left: 4%; height: 50%; background: #29372e; clip-path: polygon(9% 0,82% 0,100% 70%,91% 100%,0 100%); content: ''; }
.tank-turret { position: absolute; z-index: 2; top: 2%; left: 36%; width: 35%; height: 35%; border-radius: 45% 45% 16% 16%; background: #34453a; }
.tank-barrel { position: absolute; z-index: 3; top: 13%; left: 64%; width: 48%; height: 7%; background: #17221c; transform: rotate(-5deg); transform-origin: left; }
.tank-track { position: absolute; z-index: 2; right: 0; bottom: 0; left: 0; height: 40%; border: 4px solid #0a0e0c; border-radius: 30px; background: repeating-linear-gradient(90deg,#202a24 0,#202a24 12%,#111713 13%,#111713 18%); }
.jet { position: absolute; z-index: 8; width: 14%; height: 5%; border-radius: 60% 100% 35% 60%; background: #111915; transform: rotate(-12deg); }
.jet::after { position: absolute; top: -70%; left: 42%; width: 18%; height: 120%; background: #19241e; clip-path: polygon(0 100%,100% 0,100% 100%); content: ''; }
.jet-wing { position: absolute; top: -110%; left: 32%; width: 46%; height: 300%; background: #202e27; clip-path: polygon(42% 0,100% 100%,0 66%); }
.dust-cloud,.blast,.cloud-bank { position: absolute; z-index: 4; border-radius: 50%; filter: blur(12px); }
.dust-cloud { width: 25%; height: 18%; background: rgba(181,146,91,.34); }
.blast { width: 9%; height: 13%; background: #e77746; box-shadow: 0 0 5vh #e8b75e; opacity: .8; }

/* 01 Long march */
.scene-long-march .scene-sky { background: linear-gradient(150deg,#b7c9c4 0%,#58716b 48%,#14231e 100%); }
.scene-long-march .scene-sun { opacity: .28; }
.snow-peak { position: absolute; bottom: -5%; background: #263a33; clip-path: polygon(0 100%,28% 38%,42% 55%,62% 0,100% 100%); }
.peak-a { left: -7%; width: 62%; height: 78%; opacity: .65; }.peak-b { right: -5%; width: 66%; height: 68%; background: #1c3029; }.peak-c { right: 21%; bottom: 1%; width: 45%; height: 50%; background: #101d18; }
.snow-peak::after { position: absolute; inset: 0; background: rgba(224,235,231,.55); clip-path: polygon(25% 42%,32% 38%,40% 55%,61% 0,72% 31%,64% 25%,56% 39%,47% 46%,39% 66%); content: ''; }
.march-path { position: absolute; z-index: 3; bottom: -20%; left: 34%; width: 30%; height: 76%; background: rgba(206,218,209,.42); clip-path: polygon(42% 0,58% 0,100% 100%,0 100%); transform: rotate(-8deg); }
.marcher { bottom: 13%; }.marcher.m1 { left: 30%; transform: scale(1.2); }.marcher.m2 { left: 43%; bottom: 25%; transform: scale(.82); }.marcher.m3 { left: 53%; bottom: 34%; transform: scale(.58); }
.red-flag { position: absolute; z-index: 9; bottom: 31%; left: 48%; width: 2px; height: 30%; background: #d7cec0; transform: rotate(5deg); }.flag-face { width: 9vh; height: 5.4vh; background: #b83e34; clip-path: polygon(0 0,100% 12%,84% 100%,0 82%); }
.flake { position: absolute; color: #fff; opacity: .7; animation: snow 4s linear infinite; }.flake-0{left:8%;top:12%}.flake-1{left:18%;top:48%}.flake-2{left:27%;top:23%}.flake-3{left:39%;top:61%}.flake-4{left:48%;top:8%}.flake-5{left:57%;top:37%}.flake-6{left:67%;top:18%}.flake-7{left:77%;top:55%}.flake-8{left:88%;top:28%}.flake-9{left:93%;top:72%}.flake-10{left:13%;top:77%}.flake-11{left:61%;top:78%}

/* 02 Shangganling */
.scene-shangganling .scene-sky { background: linear-gradient(#735346 0%,#30362f 46%,#0b0e0c 100%); }.scene-shangganling .scene-sun { background:#d76b48; opacity:.72; }
.battle-ridge { position:absolute; right:-4%; bottom:0; left:-4%; background:#17221d; clip-path:polygon(0 100%,0 58%,13% 39%,25% 61%,38% 31%,52% 62%,69% 24%,84% 54%,100% 36%,100% 100%); }.ridge-back{height:63%;opacity:.6}.ridge-front{z-index:3;height:40%;background:#090d0b}
.trench { position:absolute; z-index:5; right:0; bottom:0; left:0; height:24%; border-top:8px solid #2e3026; background:#080b09; transform:skewY(-2deg); }
.defender{bottom:15%}.defender.d1{left:30%;transform:scale(1.15)}.defender.d2{left:50%;transform:scale(.92)}.defender.d3{left:67%;transform:scale(.76)}.blast-a{left:15%;bottom:26%}.blast-b{right:17%;bottom:39%;transform:scale(.6)}

/* 03 Joint exercise and Zhurihe */
.scene-joint-exercise .scene-sky,.scene-zhurihe .scene-sky,.scene-joint-drill .scene-sky { background:linear-gradient(#8a8d74 0%,#4d5c4e 45%,#242d26 100%); }.scene-joint-exercise .scene-sun,.scene-zhurihe .scene-sun,.scene-joint-drill .scene-sun{opacity:.38}
.exercise-ground{position:absolute;right:-5%;bottom:-5%;left:-5%;height:48%;background:#293228;clip-path:polygon(0 32%,22% 18%,47% 31%,72% 10%,100% 24%,100% 100%,0 100%)}
.tank-a{left:18%;bottom:13%;transform:scale(1.25)}.tank-b{right:18%;bottom:25%;transform:scale(.78)}.dust-a{left:7%;bottom:9%}.dust-b{right:4%;bottom:21%}.jet-a{top:20%;right:25%}.jet-b{top:34%;right:42%;transform:rotate(-8deg) scale(.7)}
.radar-sweep{position:absolute;right:7%;bottom:7%;width:20vh;height:20vh;border:1px solid rgba(226,189,102,.35);border-radius:50%;background:conic-gradient(rgba(226,189,102,.2),transparent 22%);animation:radar 4s linear infinite}
.desert-range{position:absolute;right:0;bottom:38%;left:0;height:28%;background:#596151;clip-path:polygon(0 100%,0 70%,16% 31%,31% 72%,46% 25%,60% 68%,77% 20%,100% 64%,100% 100%)}.target-mark{position:absolute;top:15%;left:7%;padding:6px 10px;border:1px solid rgba(255,255,255,.45);color:rgba(255,255,255,.75);font-size:11px;font-weight:900}.assault-a{left:18%;bottom:11%;transform:scale(1.35)}.assault-b{right:16%;bottom:25%;transform:scale(.78)}.blast-c{right:11%;bottom:42%}

/* 04 Beiyang photo and compare */
.scene-beiyang-photo{filter:sepia(.45) saturate(.72)}.scene-beiyang-photo .scene-sky{background:linear-gradient(#988d70,#4d574d 54%,#202923)}.scene-beiyang-photo .scene-sun{opacity:.25}
.photo-frame{position:absolute;z-index:15;inset:4%;border:1px solid rgba(245,232,190,.42)}.sea,.harbor-water,.ocean{position:absolute;right:0;bottom:0;left:0;height:42%;background:repeating-linear-gradient(174deg,#263b36 0,#263b36 6px,#334a43 7px,#1d302b 13px)}
.ironclad{position:absolute;z-index:5;right:13%;bottom:21%;width:70%;height:26%}.old-ship::before{position:absolute;right:0;bottom:0;left:0;height:55%;background:#141b18;clip-path:polygon(0 0,100% 8%,91% 100%,9% 100%)}.ship-deck{position:absolute;right:10%;bottom:52%;left:13%;height:14%;background:#202721}.ship-stack{position:absolute;bottom:65%;width:6%;height:38%;background:#161a17}.ship-stack.s1{left:42%}.ship-stack.s2{left:57%}.ship-mast{position:absolute;bottom:66%;left:28%;width:2px;height:56%;background:#161a17}.ship-mast::after{position:absolute;top:28%;left:-6vh;width:12vh;height:1px;background:#161a17;content:''}.ship-gun{position:absolute;right:15%;bottom:62%;width:22%;height:5%;background:#111713;transform:rotate(-7deg)}.sailor-line{position:absolute;z-index:8;right:26%;bottom:37%;left:29%;display:flex;justify-content:space-between}.sailor{width:7px;height:18px;border-radius:5px 5px 0 0;background:#0c100e}.photo-stamp{position:absolute;z-index:16;right:6%;bottom:7%;font-family:serif;font-size:26px;font-weight:900;opacity:.5}
.scene-beiyang-ideal .scene-sky,.scene-beiyang-actual .scene-sky{background:linear-gradient(#7d8778,#43554c 55%,#15211c)}.scene-beiyang-actual{filter:sepia(.16) saturate(.75)}.harbor-horizon{position:absolute;right:0;bottom:39%;left:0;height:2px;background:rgba(255,255,255,.18)}
.dock-yard,.summer-palace{position:absolute;z-index:2;right:5%;bottom:40%;width:28%;height:38%}.dock-crane{position:absolute;right:28%;bottom:0;width:4px;height:92%;background:#1c2923}.dock-crane::before{position:absolute;top:0;right:0;width:14vh;height:4px;background:#1c2923;content:''}.dock-crane::after{position:absolute;top:0;right:8vh;width:2px;height:18vh;background:#1c2923;content:''}.new-hull{position:absolute;right:0;bottom:0;width:90%;height:25%;background:#26372f;clip-path:polygon(0 0,100% 13%,83% 100%,10% 100%)}
.palace-base{position:absolute;right:0;bottom:0;width:100%;height:28%;background:#5a4637}.palace-tower{position:absolute;right:34%;bottom:25%;width:34%;height:58%;background:#745841}.palace-roof{position:absolute;right:21%;width:60%;height:16%;background:#44362c;clip-path:polygon(0 100%,17% 22%,50% 0,83% 22%,100% 100%)}.pr1{bottom:78%}.pr2{right:27%;bottom:57%;width:48%}
.flagship{position:absolute;z-index:5;right:4%;bottom:11%;width:91%;height:40%}.flagship-hull{position:absolute;right:0;bottom:0;left:0;height:38%;background:#18221d;clip-path:polygon(0 0,100% 4%,91% 100%,8% 100%)}.flagship-deck{position:absolute;right:8%;bottom:36%;left:9%;height:12%;background:#2b3830}.flagship-stack{position:absolute;bottom:47%;left:49%;width:8%;height:43%;background:#17201b}.flagship-mast{position:absolute;bottom:48%;right:15%;width:3px;height:72%;background:#111814}.main-gun{position:absolute;right:25%;bottom:46%;width:18%;height:13%;border-radius:50% 50% 0 0;background:#35443a}.gun-barrel{position:absolute;top:20%;left:72%;width:75%;height:13%;background:#17211c;transform:rotate(-8deg);transform-origin:left}.muzzle-flash{position:absolute;top:-34%;right:-55%;width:28%;height:80%;background:#e8bf5a;clip-path:polygon(0 40%,41% 33%,50% 0,61% 35%,100% 48%,64% 62%,52% 100%,39% 65%);box-shadow:0 0 3vh #e57945}.measure-flag{position:absolute;top:78%;right:-55%;width:5px;height:30px;background:#d5bd75}.measure-flag::after{position:absolute;top:0;left:0;width:18px;height:11px;background:#b44a3f;content:''}
.shell-rack{position:absolute;bottom:8%;left:10%;width:23%;height:24%;border:2px solid #425247;background:#202b25}.shell{position:absolute;bottom:12%;width:12%;height:72%;border-radius:50% 50% 8% 8%;background:#a28f52}.sh1{left:13%}.sh2{left:42%}.sh3{left:70%}.shell-rack.damaged{transform:rotate(-5deg);border-color:#624d3d}.shell-rack.damaged .sh2{height:53%;transform:rotate(17deg);background:#796b4b}.sand-leak{position:absolute;right:35%;bottom:-12%;width:24%;height:18%;border-radius:50%;background:#b49962}
.crew{position:absolute;bottom:36%;left:35%;width:32%;height:28%}.crewman{position:absolute;bottom:0;width:8%;height:68%;border-radius:40% 40% 0 0;background:#111713}.crewman::before{position:absolute;top:-20%;left:2%;width:96%;height:28%;border-radius:50%;background:#101511;content:''}.c1{left:0}.c2{left:27%}.c3{left:54%}.c4{left:81%}.crew.slack .c1{height:25%;width:18%;border-radius:50%}.crew.slack .c2{transform:rotate(62deg);transform-origin:bottom}.crew.slack .c3{height:35%}.crew.slack .c4{transform:rotate(-36deg);transform-origin:bottom}
.commander{position:absolute;right:9%;bottom:48%;width:7%;height:39%}.commander-head{position:absolute;top:0;left:24%;width:46%;height:18%;border-radius:50%;background:#0b0f0d}.commander-body{position:absolute;bottom:0;width:100%;height:72%;background:#17221c;clip-path:polygon(25% 0,75% 0,100% 100%,0 100%)}.binoculars{position:absolute;top:12%;left:55%;width:64%;height:9%;background:#0b0f0d}.shore-lanterns{position:absolute;right:2%;bottom:55%;display:flex;gap:5px;color:#f4d17d}.shore-lanterns text{display:flex;width:22px;height:25px;align-items:center;justify-content:center;border-radius:45%;background:#a94438;font-size:9px;box-shadow:0 0 15px rgba(225,92,72,.55)}

/* 05 Border */
.scene-border-snow .scene-sky{background:linear-gradient(#aabcb9,#546b66 56%,#18251f)}.scene-border-snow .scene-sun{opacity:.18}.snow-ridge{position:absolute;right:-5%;bottom:0;left:-5%;background:#273c35;clip-path:polygon(0 100%,0 64%,17% 31%,28% 60%,42% 8%,57% 58%,70% 25%,83% 63%,100% 34%,100% 100%)}.snow-ridge.far{height:65%;opacity:.5}.snow-ridge.near{z-index:2;height:42%;background:#162720}.border-post{position:absolute;z-index:4;right:9%;bottom:20%;width:22%;height:27%;background:#202d27}.post-roof{position:absolute;top:-16%;left:-8%;width:116%;height:20%;background:#d5dfdb;clip-path:polygon(0 100%,12% 0,88% 0,100% 100%)}.post-window{position:absolute;top:22%;left:17%;width:28%;height:26%;background:#ddb65f;box-shadow:0 0 3vh rgba(221,182,95,.45)}.guard{position:absolute;z-index:7;bottom:8%;left:43%;width:13%;height:62%}.guard-hat{position:absolute;z-index:2;top:0;left:25%;width:52%;height:10%;border-radius:50% 50% 15% 15%;background:#edf3f0}.guard-head{position:absolute;top:8%;left:32%;width:38%;height:13%;border-radius:40%;background:#c4d1cd}.guard-coat{position:absolute;bottom:0;left:5%;width:90%;height:80%;background:#e5ece9;clip-path:polygon(28% 0,72% 0,100% 100%,0 100%)}.guard-rifle{position:absolute;top:26%;right:8%;width:5%;height:66%;background:#111814;transform:rotate(11deg)}.boundary-stone{position:absolute;z-index:5;bottom:5%;left:19%;display:flex;width:8%;height:31%;align-items:center;justify-content:center;background:#d9dfdc;color:#c34c42;font-size:24px;font-weight:900}.wind-line{position:absolute;z-index:12;left:-15%;width:70%;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent);transform:rotate(-9deg);animation:wind 2.6s linear infinite}.w1{top:27%}.w2{top:51%;animation-delay:-.8s}.w3{top:71%;animation-delay:-1.7s}

/* Carrier and air combat */
.scene-carrier .scene-sky,.scene-aircombat .scene-sky,.scene-escort .scene-sky{background:linear-gradient(#5e7e82,#2d4c50 54%,#10252a)}.scene-carrier .scene-sun,.scene-aircombat .scene-sun,.scene-escort .scene-sun{background:#d7e0d5;opacity:.35}.wake{position:absolute;z-index:3;bottom:10%;width:44%;height:4%;border-top:3px solid rgba(255,255,255,.55);border-radius:50%}.wake-a{left:10%;transform:rotate(8deg)}.wake-b{right:4%;bottom:24%;transform:scale(.5) rotate(-3deg)}
.carrier{position:absolute;z-index:6;left:12%;bottom:13%;width:65%;height:31%;transform:skewX(-7deg)}.carrier-hull{position:absolute;right:0;bottom:0;left:0;height:46%;background:#182629;clip-path:polygon(0 0,100% 16%,87% 100%,12% 100%)}.carrier-deck{position:absolute;right:4%;bottom:43%;left:6%;height:17%;background:#405150;clip-path:polygon(0 18%,92% 0,100% 86%,12% 100%)}.carrier-island{position:absolute;right:19%;bottom:58%;width:10%;height:39%;background:#263738}.deck-line{position:absolute;right:12%;bottom:51%;left:18%;height:2px;background:#d5d4b1}.deck-jet{left:42%;bottom:37%;transform:scale(.45) rotate(-8deg)}.airborne{right:13%;top:23%;transform:rotate(-10deg)}.jet-trail{position:absolute;top:42%;right:86%;width:280%;height:2px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55))}.escort{position:absolute;z-index:4;width:18%;height:5%;background:#182629;clip-path:polygon(0 0,100% 10%,82% 100%,10% 100%)}.escort-a{right:5%;bottom:26%}.escort-b{right:18%;bottom:14%;transform:scale(.65)}
.cloud-bank{width:35%;height:16%;background:rgba(221,231,225,.18)}.cb1{top:22%;left:5%}.cb2{right:4%;bottom:25%}.contrail{position:absolute;height:3px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.72));transform-origin:right}.trail-a{top:36%;right:52%;width:39%;transform:rotate(-14deg)}.trail-b{top:54%;right:13%;width:44%;transform:rotate(18deg)}.combat-a{top:27%;right:39%;transform:rotate(-14deg)}.combat-b{top:55%;right:11%;transform:rotate(164deg)}.target-reticle{position:absolute;z-index:11;top:18%;right:31%;width:22vh;height:22vh;border:1px solid rgba(226,189,102,.5);border-radius:50%}.target-reticle::before,.target-reticle::after{position:absolute;background:rgba(226,189,102,.5);content:''}.target-reticle::before{top:50%;left:-15%;width:130%;height:1px}.target-reticle::after{top:-15%;left:50%;width:1px;height:130%}

/* Rocket */
.scene-rocket .scene-sky{background:linear-gradient(#11182a,#191c22 58%,#261d19)}.scene-rocket .scene-sun{display:none}.night-range{position:absolute;right:0;bottom:0;left:0;height:35%;background:#0b0d10;clip-path:polygon(0 100%,0 55%,18% 38%,36% 63%,55% 26%,74% 58%,100% 31%,100% 100%)}.launch-glow{position:absolute;right:20%;bottom:8%;width:35%;height:38%;border-radius:50%;background:#e3633e;filter:blur(30px);opacity:.42}.launcher{position:absolute;z-index:5;right:21%;bottom:8%;width:42%;height:18%;background:#17211e}.launcher-cab{position:absolute;right:0;bottom:0;width:24%;height:80%;background:#26342f;clip-path:polygon(24% 0,100% 16%,100% 100%,0 100%,0 35%)}.launcher-wheel{position:absolute;bottom:-19%;width:12%;height:46%;border-radius:50%;border:4px solid #060807;background:#29322f}.lw1{left:13%}.lw2{right:13%}.missile{position:absolute;z-index:7;right:42%;bottom:19%;width:8%;height:68%;transform:rotate(23deg);transform-origin:bottom}.missile-body{position:absolute;inset:0 20% 13%;border-radius:50% 50% 8% 8%;background:#d9dfda}.missile-fin{position:absolute;right:0;bottom:10%;left:0;height:18%;background:#9fa9a4;clip-path:polygon(0 100%,24% 0,76% 0,100% 100%,62% 70%,38% 70%)}.rocket-flame{position:absolute;right:29%;bottom:-10%;left:29%;height:25%;background:#ffd06d;clip-path:polygon(50% 100%,0 0,100% 0);box-shadow:0 0 3vh #f36c3e}.rocket-smoke{position:absolute;top:83%;left:-90%;width:280%;height:40%;border-radius:50%;background:rgba(210,207,191,.35);filter:blur(9px)}.star{position:absolute;color:#fff}.star-0{left:8%;top:14%}.star-1{left:19%;top:34%}.star-2{left:31%;top:9%}.star-3{left:49%;top:26%}.star-4{left:68%;top:12%}.star-5{left:81%;top:36%}.star-6{left:91%;top:17%}.star-7{left:58%;top:7%}

/* Joint drill */
.joint-marker{position:absolute;z-index:3;top:14%;right:9%;display:flex;width:10vh;height:10vh;align-items:center;justify-content:center;border:1px solid rgba(226,189,102,.45);border-radius:50%;color:#e2bd66;font-size:11px;font-weight:900}.armored-car{position:absolute;z-index:7;width:24%;height:14%;background:#2c3b32;clip-path:polygon(10% 30%,32% 0,78% 0,100% 43%,91% 100%,0 100%)}.ac1{left:15%;bottom:15%}.ac2{right:16%;bottom:25%;transform:scale(.72)}.car-turret{position:absolute;top:-24%;left:43%;width:25%;height:30%;background:#33463a}.car-wheel{position:absolute;bottom:-20%;width:18%;height:46%;border:4px solid #0c100e;border-radius:50%;background:#27332c}.cw1{left:14%}.cw2{right:14%}.helicopter{position:absolute;z-index:8;top:20%;left:42%;width:22%;height:9%}.heli-body{position:absolute;inset:0 20% 0 0;border-radius:60% 40% 45% 55%;background:#1c2923}.heli-tail{position:absolute;top:33%;left:72%;width:55%;height:18%;background:#1c2923}.heli-rotor{position:absolute;top:-18%;left:-24%;width:130%;height:2px;background:#0b0f0d}.team-a{left:44%;bottom:10%;transform:scale(.7)}.team-b{left:53%;bottom:13%;transform:scale(.58)}

/* Escort */
.warship{position:absolute;z-index:7;left:9%;bottom:13%;width:52%;height:30%}.warship-hull{position:absolute;right:0;bottom:0;left:0;height:41%;background:#18282b;clip-path:polygon(0 0,100% 10%,82% 100%,11% 100%)}.warship-deck{position:absolute;right:9%;bottom:39%;left:13%;height:10%;background:#364c4d}.warship-tower{position:absolute;left:45%;bottom:46%;width:17%;height:39%;background:#25383a;clip-path:polygon(18% 0,82% 0,100% 100%,0 100%)}.warship-radar{position:absolute;left:53%;bottom:84%;width:2px;height:27%;background:#172528}.warship-radar::after{position:absolute;top:0;left:-5vh;width:10vh;height:2px;background:#172528;content:''}.warship-gun{position:absolute;right:16%;bottom:49%;width:17%;height:7%;background:#172528;transform:rotate(-7deg)}.merchant{position:absolute;z-index:4;width:24%;height:7%;background:#1b2b2e;clip-path:polygon(0 0,100% 10%,85% 100%,12% 100%)}.m-ship-a{right:8%;bottom:28%}.m-ship-b{right:20%;bottom:16%;transform:scale(.62)}.cargo-stack{position:absolute;right:18%;bottom:90%;width:53%;height:120%;background:repeating-linear-gradient(90deg,#6c5540 0,#6c5540 30%,#314942 31%,#314942 61%,#7b5f42 62%)}.route-arc{position:absolute;z-index:5;right:8%;bottom:10%;width:77%;height:34%;border-top:2px dashed rgba(226,189,102,.55);border-radius:50%;transform:rotate(7deg)}.watch-figure{position:absolute;z-index:9;left:29%;bottom:41%;width:2%;height:12%;border-radius:50% 50% 0 0;background:#0c1110}

.reduced .flake,
.reduced .wind-line,
.reduced .radar-sweep { animation-play-state: paused !important; }
@keyframes snow { to { transform: translate(2vh,28vh); opacity:.1; } }
@keyframes wind { from { transform:translateX(0) rotate(-9deg); } to { transform:translateX(130vw) rotate(-9deg); } }
@keyframes radar { to { transform:rotate(360deg); } }