/* Character accents share the COSMO palette; products remain the focus. */
.companionSprite{overflow:hidden;mix-blend-mode:lighten;mask-image:radial-gradient(ellipse at center,#000 40%,#000b 57%,transparent 73%);-webkit-mask-image:radial-gradient(ellipse at center,#000 40%,#000b 57%,transparent 73%)}
.companionSprite>img{display:block;position:absolute;max-width:none!important;height:auto!important;border-radius:0!important;pointer-events:none}
.pikachuCompanion.companionSprite>img{width:307.2%;left:0;top:-49%}
.charmanderCompanion.companionSprite>img{width:303.56%;left:-203.55%;top:-77.36%}
.bulbasaurCompanion.companionSprite>img{width:320%;left:-108.33%;top:-106.67%}
.mewCompanion.companionSprite>img{width:295.38%;left:-96.15%;top:-4.55%}
.pageCompanion{display:block;object-fit:contain;pointer-events:none;filter:drop-shadow(0 10px 25px #6a4fbf30)}
.companionWelcome{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;min-height:240px;margin:28px 0;padding:28px 38px;overflow:hidden;border:1px solid #8062a56b;border-radius:13px;background:radial-gradient(ellipse at 80% 80%,#6a4fbf35,transparent 60%),linear-gradient(120deg,#12152c,#0a1026)}
.companionWelcome::after{content:'';position:absolute;bottom:0;left:38px;height:2px;width:70px;background:var(--lime);box-shadow:0 0 20px #a6ce3950}
.companionWelcome>div{position:relative;z-index:1;max-width:60%}
.companionWelcome h2{font-size:29px;line-height:1.18;margin:11px 0;letter-spacing:-1px}
.companionWelcome p{font-size:12px;color:#b9b2ce;max-width:330px;margin:0 0 16px}
.companionWelcome .eyebrow{font-size:8px;letter-spacing:1.5px}
.companionLink{display:inline-flex;align-items:center;gap:12px;font-size:11px;color:#d9c6f8;min-height:35px}
.companionLink .icon{width:15px;height:15px;color:var(--lime)}
.pikachuCompanion{position:absolute;right:35px;bottom:2px;width:240px;height:240px}
.catalogIntro.companionCatalog{position:relative;display:flex;align-items:center;isolation:isolate;min-height:245px;margin:0 0 25px;padding:31px 38px;border:1px solid #82629f66;border-radius:13px;overflow:hidden;background:radial-gradient(ellipse at 85% 70%,#6a4fbf35,transparent 60%),#0d1429}
.companionCatalog>div{position:relative;z-index:1;max-width:70%}
.catalogIntro.companionCatalog h2{font-size:35px;line-height:1.16;letter-spacing:-1.2px;margin:13px 0}
.catalogIntro.companionCatalog p{font-size:12px;color:#bfb4d0;margin:0}
.charmanderCompanion{position:absolute;right:40px;bottom:0;width:235px;height:235px}
.brandClosing.companionCommunity{position:relative;display:flex;align-items:center;min-height:345px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 83% 70%,#6a4fbf3d,transparent 65%),#0b1228}
.brandClosing.companionCommunity::before,.brandClosing.companionCommunity::after{display:none}
.brandClosing.companionCommunity>div{position:relative;z-index:1;max-width:58%}
.bulbasaurCompanion{position:absolute;right:25px;bottom:18px;width:350px;height:300px}
.accountWelcome{position:relative;min-height:205px;isolation:isolate;display:flex;align-items:center;padding:0 28px 0 0;margin-bottom:25px;border-bottom:1px solid #75568e66;background:radial-gradient(ellipse at 90% 60%,#6a4fbf25,transparent 50%)}
.accountWelcome>.pageHeading{position:relative;z-index:1;margin:0;padding:12px 0 25px;width:calc(100% - 180px)}
.accountWelcome .pageHeading h1{font-size:clamp(29px,4.2vw,50px)}
.mewCompanion{position:absolute;right:10px;bottom:6px;width:200px;height:200px;opacity:.87}
@media(max-width:1050px){
 .companionWelcome{padding:26px 30px}.pikachuCompanion{right:10px;width:215px;height:215px}
 .catalogIntro.companionCatalog{padding:29px 30px}.catalogIntro.companionCatalog h2{font-size:31px}.charmanderCompanion{right:15px;width:215px;height:215px}
 .bulbasaurCompanion{width:300px;height:260px;right:8px}
}
@media(max-width:760px){
 .companionWelcome{min-height:310px;padding:25px 23px 115px;margin:22px 0}
 .companionWelcome>div{max-width:100%}.companionWelcome h2{font-size:25px}.companionWelcome p{font-size:11px;max-width:250px}.companionWelcome .eyebrow{font-size:7px;letter-spacing:1px}
 .companionWelcome::after{left:23px}.companionLink{font-size:10px}.pikachuCompanion{right:4px;bottom:-3px;width:160px;height:160px}
 .catalogIntro.companionCatalog{min-height:265px;padding:25px 22px 105px}.companionCatalog>div{max-width:100%}.catalogIntro.companionCatalog h2{font-size:27px}.catalogIntro.companionCatalog p{font-size:11px;max-width:215px}.charmanderCompanion{right:0;bottom:0;width:145px;height:145px}
 .brandClosing.companionCommunity{min-height:500px;padding-bottom:190px}.brandClosing.companionCommunity>div{max-width:100%}.bulbasaurCompanion{right:2px;bottom:6px;width:245px;height:205px}
 .accountWelcome{min-height:200px;padding:0;margin-bottom:22px;align-items:start}.accountWelcome>.pageHeading{width:calc(100% - 100px);padding:12px 0 25px}.accountWelcome .pageHeading h1{font-size:32px;line-height:1.12;letter-spacing:-1px}.accountWelcome .pageHeading .eyebrow{font-size:7px;letter-spacing:1px;line-height:1.8}.accountWelcome .pageHeading p{font-size:11px;line-height:1.7}.mewCompanion{width:125px;height:145px;right:-10px;bottom:0;opacity:.8}
}
.pikachuCompanion.companionSprite{width:210px;height:auto;aspect-ratio:500 / 630}
.charmanderCompanion.companionSprite{width:220px;height:auto;aspect-ratio:506 / 530}
.bulbasaurCompanion.companionSprite{width:310px;height:auto;aspect-ratio:480 / 450}
.mewCompanion.companionSprite{width:200px;height:auto;aspect-ratio:520 / 440}
@media(max-width:760px){
 .pikachuCompanion.companionSprite{width:130px;bottom:0}
 .charmanderCompanion.companionSprite{width:140px}
 .bulbasaurCompanion.companionSprite{width:220px}
 .mewCompanion.companionSprite{width:125px}
}

/* Shared galaxy flows through copy and character, instead of a flat panel. */
.companionWelcome,.catalogIntro.companionCatalog,.brandClosing.companionCommunity,.accountWelcome{
 background:linear-gradient(100deg,#090e24bb 0%,#0b102657 55%,#0c112629 100%),url('assets/galaxy-atmosphere.webp') center / cover no-repeat;
 box-shadow:inset 0 0 60px #080e2433,0 12px 35px #0003;
}
.companionWelcome>div,.companionCatalog>div,.brandClosing.companionCommunity>div,.accountWelcome>.pageHeading{text-shadow:0 2px 18px #05081ec9}
.companionWelcome p,.catalogIntro.companionCatalog p{color:#d2c8e3}
.companionWelcome{min-height:280px}
.companionWelcome .pikachuCompanion{right:35px;width:235px}
.catalogIntro.companionCatalog{min-height:280px}
.catalogIntro.companionCatalog .charmanderCompanion{right:30px;width:245px}
.brandClosing.companionCommunity .bulbasaurCompanion{width:350px;right:15px;bottom:0}
.accountWelcome{border:1px solid #8165a05e;border-radius:12px;padding:18px 30px;background-position:center 45%}
.accountWelcome>.pageHeading{padding:10px 0 20px}
.accountWelcome .mewCompanion{right:10px;bottom:5px}
@media(max-width:760px){
 .companionWelcome,.catalogIntro.companionCatalog,.brandClosing.companionCommunity{background-image:linear-gradient(150deg,#080e24b0 0%,#080e245c 38%,#080e240d 75%),url('assets/galaxy-atmosphere.webp');background-position:58% center}
 .companionWelcome{min-height:370px;padding:26px 23px 170px}
 .companionWelcome .pikachuCompanion{right:5px;bottom:0;width:170px}
 .companionWelcome p{max-width:260px}
 .companionWelcome .companionLink{position:relative;z-index:2}
 .catalogIntro.companionCatalog{min-height:330px;padding:25px 22px 155px}
 .catalogIntro.companionCatalog .charmanderCompanion{right:2px;bottom:0;width:170px}
 .catalogIntro.companionCatalog p{max-width:240px}
 .brandClosing.companionCommunity{min-height:510px;padding-bottom:220px}
 .brandClosing.companionCommunity .bulbasaurCompanion{width:245px;right:0;bottom:2px}
 .accountWelcome{padding:18px;min-height:220px;background-image:linear-gradient(100deg,#090e24bb,#090e2455),url('assets/galaxy-atmosphere.webp')}
 .accountWelcome>.pageHeading{width:calc(100% - 80px)}
 .accountWelcome .mewCompanion{width:135px;right:-8px;bottom:10px}
}
