/* Full-body artwork and individually themed action, preserving the site palette. */
.motion-toggle{background:transparent;border:1px solid #5b4c3b;color:#e7d4b8;border-radius:3px;font-size:10px;padding:8px;cursor:pointer;max-width:105px;line-height:1.3;flex-shrink:0}.site-header{gap:16px}.motion-toggle:hover{border-color:var(--gold)}
.character-image,.villain-cards .character-image{height:460px;padding:20px 10px 10px;background:radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--accent),transparent 83%),transparent 70%)}
.character-image img{object-fit:contain;object-position:center;filter:none;height:100%;width:100%}.character-image:after{display:none}.character-info{margin-top:0;padding-top:16px;background:linear-gradient(#17151b,#110f16)}.character-card:hover .character-image img{transform:scale(1.025)}.character-card{background:radial-gradient(ellipse at 50% 30%,#332331,#0c0c13 75%)}.villain-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.villain-cards .character-image{height:520px}.character-info p,.villain-cards .character-info p{min-height:46px}.character-card.figure-animal .character-image{background:radial-gradient(ellipse,#33351f50,transparent 70%)}
.detail{position:relative}.detail-hero{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);min-height:750px;background:linear-gradient(120deg,#11111b,#19121c);isolation:isolate;overflow:hidden}.detail-image{min-height:750px;display:grid;place-items:center;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 55%,color-mix(in srgb,var(--accent),transparent 84%),transparent 70%)}.detail-image:after{display:none}.detail-image .full-character{position:relative;z-index:2;object-fit:contain;object-position:center;width:100%;height:730px;padding:35px 22px 40px;filter:drop-shadow(0 22px 14px #0008)}.detail-copy{padding:42px 36px;z-index:4}.detail h1{font-size:clamp(48px,5.5vw,88px);overflow-wrap:normal}.detail-image .power-layer{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}.detail-image:before{content:'';position:absolute;inset:auto 8% 25px;height:44px;border-radius:50%;background:radial-gradient(ellipse,#bd946633,transparent 70%);box-shadow:0 0 45px #ffc15f13;transform:perspective(250px) rotateX(20deg)}
.team-stage{height:580px;overflow:hidden;background:radial-gradient(ellipse at 50% 70%,#67462655,#13121b 70%);border-color:#866b43;box-shadow:16px 20px 0 #090a10}.team-stage img{position:absolute;bottom:55px;height:85%;width:58%;object-fit:contain;filter:drop-shadow(0 14px 8px #0009)}.team-stage .team-black{left:-6%;height:78%;z-index:1}.team-stage .team-blond{left:22%;z-index:3}.team-stage .team-silver{right:-7%;height:78%;z-index:2}.team-stage:after{display:none}.team-glow{position:absolute;inset:10%;background:radial-gradient(ellipse,#ffc15f15,transparent 65%)}.brand .brand-avatar{object-fit:contain;background:#000}.book-image:hover img{transform:rotate(-2deg);transition:transform .2s}.hero-cover{cursor:default}
.motion-paused *, .motion-paused *:before, .motion-paused *:after{animation-play-state:paused!important}
@media(max-width:1150px){.site-header{flex-wrap:wrap}.site-header nav{order:3;width:100%;justify-content:center}.motion-toggle{margin-left:auto}.detail-hero{grid-template-columns:1fr 1fr}.detail-copy{padding:32px 24px}.detail-image,.detail-hero{min-height:650px}.detail-image .full-character{height:630px}.hero-cards .character-image{height:370px}}
@media(max-width:720px){.site-header{gap:7px}.motion-toggle{font-size:9px;padding:6px;max-width:74px}.brand .brand-wordmark{width:115px}.site-header nav{justify-content:flex-start}.detail{padding:22px 16px 60px}.detail-hero{grid-template-columns:1fr}.detail-image{min-height:0;height:620px}.detail-image .full-character{height:600px;padding:25px 14px 45px}.detail-copy{padding:30px 25px 38px}.detail h1{font-size:58px}.hero-cards .character-image,.villain-cards .character-image{height:390px}.team-stage{height:490px}.orbit-camera{width:82px}.camera-1{width:66px}.camera-2{width:55px}.hero-camera-layer .camera-0{width:75px}.hero-camera-layer .camera-1{width:60px}.villain-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.character-info{padding:16px}.character-info h3,.villain-cards .character-info h3{font-size:32px}}
@media(max-width:480px){.hero-cards,.villain-cards{grid-template-columns:1fr}.hero-cards .character-image,.villain-cards .character-image{height:460px}.detail-image{height:535px}.detail-image .full-character{height:520px}.detail-copy{padding:26px 20px 34px}.detail h1{font-size:50px}.team-stage{height:420px}.brand .brand-wordmark{width:100px}.brand .brand-avatar{width:35px;height:35px}.language button{padding:6px 8px}.hero-camera-layer{inset:0}.character-info h3,.villain-cards .character-info h3{font-size:39px}}
@media(prefers-reduced-motion:reduce){body:not(.motion-enabled) *,body:not(.motion-enabled) *:before,body:not(.motion-enabled) *:after{animation:none!important;scroll-behavior:auto!important}body:not(.motion-enabled) .steel-bay{opacity:1}body:not(.motion-enabled) .mini-traveller{left:calc(5% + var(--i) * 18%)}body:not(.motion-enabled) .chrome-pool{animation:none}}

/* The opening tableau: three originals, one shared scene. */
.trio-hero{display:flex;flex-direction:column;gap:0;min-height:0;padding:34px 5vw 55px;background:radial-gradient(ellipse at 30% 60%,#42291588,transparent 45%),radial-gradient(ellipse at 76% 52%,#25364c88,transparent 45%),#090a10}
.trio-hero:before{display:none}.trio-hero:after{height:100px;pointer-events:none}
.trio-hero .hero-copy{text-align:center;max-width:100%;width:100%}.trio-hero .eyebrow{justify-content:center}
.trio-hero .hero-origin{display:flex;justify-content:center;gap:.35em;margin:19px auto 6px;max-width:none;font:800 clamp(24px,3.7vw,49px)/1.1 'Barlow',Arial,sans-serif;letter-spacing:.025em;text-transform:uppercase;color:#f6dfb4}
.trio-hero h1{margin:auto;max-width:660px;filter:none;background:none;-webkit-text-fill-color:initial}
.trio-hero .hero-wordmark{width:min(570px,75vw);margin:0 auto;height:auto;filter:drop-shadow(0 9px 12px #000)}
.hero-trio{position:relative;isolation:isolate;width:min(1120px,100%);height:clamp(410px,48vw,610px);margin:-12px auto 0}
.trio-ground{position:absolute;inset:78% 0 0;background:radial-gradient(ellipse,#dfb27222,transparent 68%);border-radius:50%}
.hero-trio .trio-character{position:absolute;bottom:35px;height:94%;width:40%;object-fit:contain;filter:drop-shadow(0 18px 13px #0009)}
.hero-trio .trio-blond{left:0;z-index:2}.hero-trio .trio-black{left:29%;width:42%;height:100%;z-index:1}.hero-trio .trio-silver{right:0;z-index:3}
.hero-camera-layer{position:absolute;inset:0;z-index:4;pointer-events:none}
.orbit-camera{position:absolute;width:88px;filter:drop-shadow(0 7px 6px #0009);animation:camera-orbit 13s ease-in-out infinite}
.orbit-camera img{width:100%;height:auto}.camera-0{left:7%;top:1%;--dx:110px;--dy:24px}.camera-1{right:2%;top:10%;width:75px;--dx:-105px;--dy:-35px;animation-delay:-5s;animation-duration:16s}
@keyframes camera-orbit{0%,100%{transform:translate(0,0) rotate(-8deg)}35%{transform:translate(var(--dx),var(--dy)) rotate(10deg)}70%{transform:translate(calc(var(--dx) * .4),calc(var(--dy) * -.3)) rotate(-3deg)}}
.hero-mini-stage{position:absolute;right:0;bottom:0;width:38%;height:200px;z-index:5;pointer-events:none;overflow:hidden}.home-march-canvas{position:absolute;inset:0;width:100%;height:100%}
.trio-hero .hero-caption{position:relative;z-index:5;text-align:center;max-width:720px;margin:10px auto 0}.trio-hero .hero-caption p{max-width:650px;margin:0 auto 20px;font-size:16px;line-height:1.65}.trio-hero .hero-actions{justify-content:center}
body[data-page="character"] *,body[data-page="character"] *:before,body[data-page="character"] *:after{animation:none!important}
@media(max-width:720px){.trio-hero{padding:28px 12px 45px}.trio-hero .hero-origin{flex-wrap:wrap;gap:0 .28em;font-size:clamp(23px,5vw,36px);margin-top:16px}.hero-trio{height:clamp(300px,68vw,470px);width:100%;margin:0 auto}.hero-trio .trio-character{width:42%;bottom:28px}.hero-trio .trio-blond{left:-2%}.hero-trio .trio-black{left:27%;width:46%}.hero-trio .trio-silver{right:-2%}.hero-mini-stage{height:135px;width:40%;right:0;bottom:0}.orbit-camera{width:58px}.camera-0{left:1%;--dx:55px;--dy:18px}.camera-1{width:50px;right:0;--dx:-45px;--dy:-20px}.trio-hero .hero-caption{margin:10px 12px 0}.trio-hero .hero-caption p{font-size:14px}.trio-hero .hero-actions{gap:8px}.trio-hero .button{font-size:10px;padding:12px 14px}}

.trio-hero .hero-trio{margin-top:10px}
@media(max-width:720px){.hero-trio .camera-0{top:-4%;width:42px;--dy:-10px}.hero-trio .camera-1{top:-4%;width:40px;--dy:-10px}}

/* The cover group is a single cutout, preserving its original arrangement. */
.site-header{position:sticky;top:0;z-index:100;background:#090a10f5;box-shadow:0 6px 24px #0005;backdrop-filter:blur(12px)}
html{scroll-padding-top:calc(var(--header-height,130px) + 18px)}
.trio-hero .hero-trio{width:min(860px,100%);height:clamp(340px,65vw,680px);margin-top:16px}
.cover-trio{position:absolute;inset:0 0 30px;width:100%;height:calc(100% - 30px);object-fit:contain;filter:drop-shadow(0 15px 12px #0008);z-index:2}
.hero-mini-stage{right:3%;width:36%;height:190px;bottom:0}
.hero-trio .camera-0{left:1%;top:7%;--dx:55px;--dy:-28px}.hero-trio .camera-1{right:0;top:4%;--dx:-35px;--dy:-25px}
@media(max-width:720px){.trio-hero .hero-trio{height:auto;aspect-ratio:1/1;margin-top:16px}.cover-trio{height:calc(100% - 20px)}.hero-mini-stage{height:125px;right:0;width:38%}.hero-trio .camera-0{left:0;top:4%;--dx:24px;--dy:-12px}.hero-trio .camera-1{right:0;top:3%;--dx:-20px;--dy:-10px}}

/* Static supporting characters in Silver's roster illustration. */
.figure-silver.character-card .character-image>img{height:calc(100% - 28px)}
.silver-still-helpers{position:absolute;inset:0;pointer-events:none}
.character-image .silver-still-helpers img{position:absolute;object-fit:contain;object-position:center;filter:drop-shadow(0 5px 4px #0009);animation:none;transition:none;transform:none}
.character-image .silver-still-helpers .still-camera{width:20%;height:15%}
.character-image .silver-still-helpers .still-camera-left{left:4%;top:12%;transform:rotate(-12deg)}
.character-image .silver-still-helpers .still-camera-right{right:3%;top:29%;transform:rotate(12deg);width:17%}
.character-image .silver-still-helpers .still-mini{height:18%;width:15%;bottom:7px}
.character-image .silver-still-helpers .still-mini-0{left:19%;height:13%;bottom:26px}
.character-image .silver-still-helpers .still-mini-1{left:40%;height:12%;bottom:28px}
.character-image .silver-still-helpers .still-mini-2{left:29%}
.character-image .silver-still-helpers .still-mini-3{left:52%;height:19%}
.character-image .silver-still-helpers .still-mini-4{left:72%;height:16%;bottom:12px}

/* Silver's detail illustration uses the same young Mini-BROs and cameras as the homepage. */
.figure-silver.detail-hero .detail-image .silver-still-helpers{z-index:3}
.detail-image .silver-still-helpers img{position:absolute;object-fit:contain;object-position:center;filter:drop-shadow(0 5px 4px #0009);animation:none;transition:none;transform:none}
.detail-image .silver-still-helpers .still-camera{width:23%;height:15%}
.detail-image .silver-still-helpers .still-camera-left{left:3%;top:13%;transform:rotate(-12deg)}
.detail-image .silver-still-helpers .still-camera-right{right:3%;top:30%;transform:rotate(12deg);width:20%}
.detail-image .silver-still-helpers .still-mini{height:18%;width:17%;bottom:12px}
.detail-image .silver-still-helpers .still-mini-0{left:8%;height:13%;bottom:34px}
.detail-image .silver-still-helpers .still-mini-1{left:28%;height:12%;bottom:38px}
.detail-image .silver-still-helpers .still-mini-2{left:38%}
.detail-image .silver-still-helpers .still-mini-3{left:59%;height:19%}
.detail-image .silver-still-helpers .still-mini-4{left:78%;height:16%;bottom:18px}
