/* Reference refinement • closer composition to the supplied Perfect World-style page.
   Original game identity and artwork retained. Loaded after styles.css. */

:root{--pale:#e5eff8;--royal-blue:#164f83;--soft-gold:#f3d99f}
html{scroll-padding-top:clamp(46px,6.25vw,76px)}
body{background:var(--pale)}
.site-header{height:clamp(46px,6.25vw,76px);background:#0b0d15f7;box-shadow:none;border-bottom-color:#233244}
.header-inner{width:min(1260px,calc(100% - 18%));gap:clamp(15px,3vw,44px)}
.brand{gap:6px}
.brand-glyph{font-size:clamp(15px,1.9vw,26px)}
.brand-name{font:600 clamp(11px,1.2vw,17px)/.91 var(--serif);letter-spacing:.002em}
.brand-name span{font-size:.77em;letter-spacing:.14em}
.primary-nav{gap:clamp(16px,3.4vw,50px)}
.nav-link{font:700 clamp(8px,.75vw,12px)/1 var(--sans);letter-spacing:.04em;padding:14px 0}
.nav-link::after{bottom:8px}
.header-cta{margin-left:auto;border:0;background:linear-gradient(180deg,#40adfb,#2188e0);box-shadow:0 1px #ffffff55 inset,0 3px 9px #068af438;border-radius:25px;font-size:clamp(8px,.75vw,11px);padding:clamp(8px,1.05vw,14px) clamp(14px,2vw,28px);letter-spacing:.02em}
.header-cta span{font-size:7px}
.menu-toggle{display:none}

/* panoramic magical hero: same visual reading order as supplied reference */
.hero{height:clamp(420px,56vw,785px);min-height:0;background:#547b98;overflow:hidden}
.hero-photo{background:radial-gradient(ellipse at 65% 23%,#f5e5bb5e,transparent 42%),linear-gradient(90deg,#1a3c5b88 0%,#6d9bbc22 49%,#b0987366 100%),url('https://images.unsplash.com/photo-1772974855212-eb5cb569c2b1?auto=format&fit=crop&w=1900&q=85') center 44%/cover no-repeat;filter:saturate(.66) brightness(1.18)}
.hero-skyline{background:url('/skyline.svg') center 2%/cover no-repeat;opacity:.42;mix-blend-mode:screen}
.hero-mist{background:radial-gradient(ellipse 40% 32% at 50% 22%,#b5daf2bb,transparent 80%),radial-gradient(ellipse 44% 58% at 87% 37%,#eddfb966,transparent 78%),linear-gradient(180deg,#19384a24,transparent 23%,transparent 44%,#203d5955 72%,#0c2b4da8)}
.hero-vignette{background:linear-gradient(180deg,#0614264d,transparent 15%,transparent 40%,#18375138 64%,#082747 100%);z-index:-2}
.hero-copy{padding-top:clamp(65px,8.7vw,126px)}
.hero-eyebrow{font-size:clamp(7px,.8vw,11px);letter-spacing:.22em;opacity:.9;gap:12px;color:#fbebc9}
.hero-eyebrow span{width:clamp(20px,4.4vw,60px)}
.hero h1{font:500 clamp(49px,6.7vw,106px)/.83 var(--serif);letter-spacing:-.082em;text-shadow:0 2px 2px #102940,0 5px 10px #243a51b3,0 0 1px #fff;padding:0 10px;margin:clamp(8px,1vw,15px) 0 0}
.hero h1 em{font-size:.7em;line-height:1.16;letter-spacing:.055em}
.title-rule{margin:clamp(6px,.8vw,12px) auto 0;font-size:11px;width:28%;opacity:.9}
.hero-tagline{margin:3px 0 0;font-size:clamp(7px,.65vw,10px);letter-spacing:.34em}
.hero-art{top:clamp(82px,10.4vw,147px);left:0;right:0;bottom:0;overflow:visible;display:block;pointer-events:none}
.hero-art img{display:block;position:absolute;left:50%;top:0;transform:translateX(-50%);max-width:none;max-height:none;width:clamp(710px,106vw,1560px);height:auto;object-fit:contain;object-position:top center;filter:drop-shadow(0 8px 16px #18304440)}
.hero-stars{opacity:.6}
.hero-bottom{width:min(1240px,calc(100% - 18%));grid-template-columns:1.08fr .96fr 1.08fr;bottom:clamp(89px,12.8vw,179px);gap:clamp(7px,2.4vw,35px);align-items:end}
.hero-panel{height:clamp(96px,13.3vw,172px);border:1px solid #d7c49799;background:linear-gradient(135deg,#12171de8,#1a2228d7 68%,#080f17d9);box-shadow:0 7px 15px #0b1e3180,inset 0 0 14px #191b2d80;padding:5px;clip-path:polygon(4% 0,96% 0,100% 8%,100% 92%,96% 100%,4% 100%,0 92%,0 8%)}
.hero-panel::before{inset:3px;border:1px solid #d0b37d4a;clip-path:polygon(4% 0,96% 0,100% 8%,100% 92%,96% 100%,4% 100%,0 92%,0 8%)}
.panel-corner{display:none}
.hero-panel .panel-small{color:#f8dbae;font-size:clamp(6px,.7vw,10px);letter-spacing:.07em;margin-bottom:clamp(3px,.5vw,9px)}
.hero-panel strong{font:700 clamp(15px,2vw,30px)/1.12 var(--serif);color:#fff}
.panel-line{margin:clamp(4px,.7vw,10px) auto;width:83%;background:linear-gradient(90deg,transparent,#d7bb8c7a,transparent)}
.platform-pill{width:clamp(42px,5.2vw,69px);height:clamp(32px,4.1vw,49px);border-radius:4px;border:1px solid #d4d6d36b;background:#0c141d;gap:3px}
.platform-symbol{font-size:clamp(12px,1.65vw,20px)}.platform-pill small{font-size:clamp(6px,.68vw,9px)}
.hero-panel.count-panel strong{font:700 clamp(29px,3.65vw,50px)/1 var(--serif);letter-spacing:.025em}
.hero-panel.count-panel strong span{font-size:.4em}
.hero-panel.count-panel p{max-width:78%;font-size:clamp(9px,1.05vw,14px);color:#edf2f4;line-height:1.35}
.hero-action{align-items:center;justify-content:flex-end;min-height:clamp(98px,13vw,170px)}
.play-button{width:clamp(33px,4.1vw,60px);height:clamp(33px,4.1vw,60px);border:2px solid #fbe1a3;box-shadow:0 0 0 4px #1d2c3e99,0 0 15px #ffefc268}
.play-triangle{border-left-width:12px;border-top-width:7px;border-bottom-width:7px}
.hero-ornament{font-size:clamp(12px,1.5vw,22px);margin:0;line-height:1.3;white-space:nowrap;opacity:.85}
.hero-register{height:clamp(32px,4vw,55px);min-height:32px;min-width:unset;width:92%;font-size:clamp(8px,.8vw,11px);letter-spacing:.025em;box-shadow:inset 0 1px 0 #fff8,0 0 12px #3db7f17a;border-radius:35px}
.hero-register .btn span{margin:0 6px}
.store-badges{display:flex;gap:6px;margin:clamp(4px,.8vw,10px) 0 0;justify-content:center;width:100%}
.store-badge{display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #c3c3c385;border-radius:4px;color:white;background:#090d13df;height:clamp(23px,2.9vw,39px);padding:0 clamp(5px,.85vw,12px);font-size:clamp(8px,.85vw,13px);font-weight:700;line-height:1.1;white-space:nowrap}
.store-badge:hover{background:#273b53}
.store-badge .store-icon{font-size:clamp(12px,1.65vw,22px);line-height:1}
.store-badge small{display:block;font-weight:500;font-size:.7em;color:#d4dae0;text-align:left}
.store-badge .store-text{display:block;text-align:left}
.hero-social{top:33%;right:0;border-radius:8px 0 0 8px;padding:4px 6px;gap:0}
.hero-social button{font-size:clamp(13px,1.5vw,19px)}
.hero-wave{z-index:8;bottom:-2px;height:clamp(154px,20.5vw,285px);background:url('/wave.svg') center bottom/100% 100% no-repeat;pointer-events:none}
.hero-wave svg{display:none}

/* paper, sweeping rewards, and five vertically staggered relic cards */
.rewards{background:#e4f0f7;min-height:unset;padding:clamp(30px,4.3vw,68px) 0 clamp(40px,5.3vw,85px);margin-top:-1px;overflow:hidden}
.rewards::before{inset:0;background:radial-gradient(ellipse 55% 35% at 10% 49%,#fff7cf80,transparent 90%),radial-gradient(ellipse 30% 25% at 94% 44%,#fff0c48e,transparent),radial-gradient(ellipse 45% 35% at 57% 72%,#f0f8ff,transparent),repeating-linear-gradient(120deg,transparent 0,transparent 120px,#d6ae6114 121px,transparent 123px);opacity:1}
.rewards::after{content:"";position:absolute;top:47%;left:-12%;width:124%;height:26%;border-radius:50%;border-top:clamp(12px,2vw,28px) solid #fff1c57a;border-bottom:clamp(11px,1.6vw,21px) solid #e9c2784b;transform:rotate(-9deg);pointer-events:none;opacity:.75}
.section-inner{width:min(1200px,calc(100% - 18%));position:relative}
.section-heading{max-width:850px}
.section-heading .small-caps{font-size:clamp(7px,.72vw,10px);letter-spacing:.25em}
.section-heading h2{font:700 clamp(20px,2.5vw,39px)/1.2 var(--serif);margin:clamp(3px,.45vw,8px) 0 4px;color:#235987;letter-spacing:.015em}
.section-heading h2 span{color:#235987}
.ornate-divider{font-size:clamp(14px,1.6vw,23px);letter-spacing:.26em}
.rewards .section-heading>p{display:none}
.rewards-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.8vw,25px);margin:clamp(34px,4.4vw,65px) 0 0;align-items:start;padding:0;overflow:visible}
.reward-card,.reward-card.tier-three{height:clamp(135px,18.4vw,264px);padding:17px 8px 14px;border:1px solid #ecf5fc;outline:1px solid #79a8cb;box-shadow:0 8px 14px #4f81a63d,inset 0 0 20px #ffffff8c;background:linear-gradient(150deg,#d4ebfa,#9fcbeb 39%,#80accd 80%,#a3c9e3);border-radius:4px;clip-path:polygon(9% 0,91% 0,100% 9%,100% 91%,91% 100%,9% 100%,0 91%,0 9%)}
.reward-card.tier-one{margin-top:clamp(50px,6.6vw,97px)}
.reward-card.tier-two{margin-top:0}
.reward-card.tier-three{margin-top:clamp(21px,3vw,42px);height:clamp(161px,21.6vw,309px);background:linear-gradient(150deg,#e3f4ff,#b2d5ee 39%,#7ca6cf 80%,#d5edfa)}
.reward-card.tier-four{margin-top:0}
.reward-card.tier-five{margin-top:clamp(47px,6.4vw,91px)}
.reward-card::before,.reward-card::after{border-color:#ebd69d;width:14px;height:14px}
.milestone{top:clamp(-17px,-2.1vw,-12px);font:600 clamp(11px,1.35vw,18px)/1 var(--serif);padding:clamp(5px,.75vw,10px) clamp(7px,1vw,15px);background:linear-gradient(180deg,#4b4f53,#2a3237 85%);border:1px solid #e8d0a0;box-shadow:0 0 0 2px #fff4cd80,inset 0 1px #fff5;z-index:5}
.reward-image,.tier-three .reward-image{width:clamp(80px,12vw,163px);height:clamp(80px,12vw,163px);margin:auto auto;filter:drop-shadow(0 7px 5px #34618d61)}
.tier-three .reward-image{width:clamp(101px,15vw,200px);height:clamp(101px,15vw,200px)}
.reward-glow{width:95%;left:2.5%;height:85%;top:8%;background:radial-gradient(ellipse,#fffef5dd 0%,#d6edf8aa 43%,transparent 75%);filter:blur(4px)}
.reward-name,.reward-caption,.reward-order{display:none}
.reward-card:hover{transform:translateY(-5px)}
.progress-area{margin:clamp(10px,1.5vw,24px) auto 0;max-width:none}
.progress-label{font-size:clamp(10px,1.23vw,16px);font-weight:500;color:#315d81;margin-bottom:clamp(5px,.65vw,9px)}
.progress-label strong{font-size:clamp(10px,1.23vw,17px);color:#265c87}
.progress-track{height:clamp(8px,1.05vw,15px);background:linear-gradient(180deg,#43b2ef,#70c2f7 55%,#307fc4);border:2px solid #edf8ff;box-shadow:0 2px 3px #448eb76e,inset 0 1px 2px #2478ab9e;padding:0;border-radius:3px}
.progress-track .progress-shine{inset:2px 5px auto;height:2px;width:calc(100% - 10px);opacity:.65;background:#e8fbff}
.progress-footnote{display:none}
.reward-register{display:block;width:clamp(160px,21vw,290px);min-height:0;height:clamp(32px,4vw,54px);font-size:clamp(8px,.85vw,12px);margin:clamp(15px,2vw,28px) auto 0}
.paper-flower{z-index:1;color:#d7af5c}.f1{left:1.5%;top:35%;font-size:22px}.f2{left:4%;top:65%;font-size:27px}.f3{right:1.8%;top:45%;font-size:22px}.f4{right:14%;bottom:18%;font-size:23px}

/* framed game introduction panel precisely beneath rewards */
.world-section{padding:clamp(9px,1.1vw,17px) 0 clamp(48px,7vw,115px);background:#e4f0f7}
.world-panel{width:min(1200px,calc(100% - 18%));padding:clamp(7px,1vw,12px);background:linear-gradient(135deg,#245b89,#4a86b2 40%,#3874a2 83%,#245d89);clip-path:polygon(2% 0,98% 0,100% 4%,100% 96%,98% 100%,2% 100%,0 96%,0 4%);box-shadow:0 9px 25px #3677a24a}
.world-panel::before{inset:3px;opacity:1;border-color:#f2dfb9}
.world-panel-inner{min-height:clamp(265px,37vw,516px);padding:clamp(15px,1.8vw,31px) clamp(21px,2.7vw,40px) clamp(17px,2.3vw,43px);background:radial-gradient(ellipse at 65% 80%,#80afd14d,transparent 58%),linear-gradient(#5087b331,#3674a544),url('/skyline.svg') center 60%/cover no-repeat;border:1px solid #88b1d1}
.world-heading{gap:9px;margin-bottom:clamp(13px,1.6vw,27px)}
.world-heading h2{font:700 clamp(15px,2vw,31px)/1.2 var(--serif);white-space:nowrap}
.world-heading .ornate-divider{font-size:clamp(17px,2vw,29px);line-height:1}
.world-content{grid-template-columns:1fr 1.03fr;gap:clamp(13px,2.1vw,33px);padding:0;align-items:center}
.image-border{height:clamp(175px,24vw,333px);padding:3px;border-color:#eacb8f;box-shadow:0 0 0 2px #8aacca,0 7px 19px #17385359}
.image-caption{bottom:8px;left:8px;font-size:clamp(6px,.7vw,10px);padding:4px 6px}
.world-description{padding-right:0;align-self:start}
.world-kicker{font-size:clamp(7px,.78vw,12px);color:#f5d39d;letter-spacing:.14em}
.world-description h3{font:700 clamp(13px,1.45vw,24px)/1.25 var(--serif);margin:clamp(4px,.8vw,12px) 0 clamp(5px,.8vw,13px)}
.world-description p{font-size:clamp(9px,.95vw,13px);line-height:1.52;margin-bottom:clamp(5px,.7vw,10px);color:#f4f8fd}
.world-features{margin-top:clamp(7px,1.2vw,20px);font-size:clamp(7px,.7vw,10px);gap:7px}
.carousel-arrow{height:clamp(34px,4.1vw,50px);width:clamp(34px,4.1vw,50px);top:51%;border-color:#e1c48c;box-shadow:0 0 0 2px #5482aa,0 4px 10px #1a3c5c77}
.carousel-arrow.prev{left:clamp(-27px,-2.5vw,-18px)}.carousel-arrow.next{right:clamp(-27px,-2.5vw,-18px)}
.world-dots{margin-top:clamp(12px,1.5vw,23px);gap:7px}
.dot{height:clamp(7px,.8vw,10px);width:clamp(7px,.8vw,10px)}

@media(min-width:561px) and (max-width:900px){
.site-header{height:46px}.header-inner{width:calc(100% - 18%);gap:18px}
.primary-nav{display:flex;position:static;flex-direction:row;align-items:center;margin-left:auto;gap:clamp(15px,3vw,26px);padding:0;background:transparent;border:0}
.primary-nav .nav-link{padding:15px 0;font-size:9px}
.header-cta{font-size:8px;letter-spacing:0;padding:10px 15px}
.hero-bottom{bottom:89px;gap:10px}
.hero-action{min-height:100px}
.hero-ornament{font-size:15px}
.hero-register{height:33px}
.hero-art{top:82px}.hero-art img{width:105%}
.rewards-grid{margin-top:36px}
.reward-card{height:137px}.reward-card.tier-three{height:166px}
.reward-image{width:86px;height:86px}.tier-three .reward-image{width:111px;height:111px}
.reward-card.tier-one{margin-top:50px}.reward-card.tier-five{margin-top:47px}.reward-card.tier-three{margin-top:22px}
.world-panel-inner{min-height:271px}
.world-features{margin-top:9px}
}
@media(max-width:560px){
.site-header{height:58px}.header-inner{width:calc(100% - 20px);gap:8px}.brand-name{font-size:12px}.brand-name span{font-size:9px}
.header-cta{font-size:8px;margin-left:auto;padding:10px 11px}.header-cta span{display:none}
.menu-toggle{display:flex;width:33px;height:34px}
.primary-nav{display:none;position:absolute;top:58px;right:0;left:0;background:#081521f5;flex-direction:column;align-items:stretch;gap:0;padding:14px 20px 19px;border-bottom:1px solid #edc77577}
.primary-nav.open{display:flex}.primary-nav .nav-link{padding:14px;font-size:11px;text-align:center}
.hero{height:660px}.hero-copy{padding-top:91px}
.hero h1{font-size:clamp(36px,9vw,54px)}
.hero-art{top:139px;left:50%;right:auto;width:750px;transform:translateX(-50%)}.hero-art img{width:750px}
.hero-bottom{bottom:100px;width:calc(100% - 24px);grid-template-columns:1fr 1fr;gap:10px}
.hero-action{grid-column:1/3;grid-row:1;min-height:0;margin-bottom:11px}
.hero-panel{height:112px}.hero-panel strong{font-size:17px}.hero-panel .panel-small{font-size:8px}
.hero-panel.count-panel strong{font-size:28px}.hero-panel.count-panel p{font-size:10px}
.platform-pill{width:45px;height:33px}
.hero-register{height:39px;font-size:9px;max-width:225px}
.hero-wave{height:151px}.store-badge{height:29px;padding:0 8px;font-size:9px}.store-badge .store-icon{font-size:13px}
.rewards{padding:27px 0 45px}
.section-inner{width:calc(100% - 30px)}
.rewards .section-heading h2{font-size:clamp(19px,5vw,25px)}
.rewards-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(5px,1.3vw,11px);margin:43px 0 0}
.reward-card,.reward-card.tier-three{height:clamp(100px,21vw,130px);padding:0}
.reward-card.tier-one,.reward-card.tier-five{margin-top:43px}
.reward-card.tier-two,.reward-card.tier-four{margin-top:0}
.reward-card.tier-three{height:clamp(127px,26vw,154px);margin-top:19px}
.milestone{font-size:clamp(8px,2vw,11px);top:-12px;padding:6px}
.reward-image{width:100%;height:78%;margin:auto}.tier-three .reward-image{width:100%;height:88%}
.progress-label{font-size:10px}.progress-label strong{font-size:10px}
.progress-area{margin-top:10px}
.reward-register{height:35px;width:195px;margin-top:16px}
.world-section{padding:12px 0 55px}
.world-panel{width:calc(100% - 28px);padding:7px}
.world-panel-inner{min-height:0;padding:20px 24px 28px}
.world-content{grid-template-columns:1fr;gap:18px}
.image-border{height:190px}.world-description h3{font-size:19px}.world-description p{font-size:12px;line-height:1.65}
.world-heading h2{font-size:17px}.world-dots{margin-top:15px}
.carousel-arrow.prev{left:-25px}.carousel-arrow.next{right:-25px}
}
@media(max-width:360px){
.header-cta{padding:9px 7px}.brand-glyph{display:none}.brand-name{font-size:11px}
.hero-panel strong{font-size:14px}.platform-pill{width:40px}.store-badge{font-size:8px}
}

/* Keep three evenly spaced hero columns at tablet/reference widths (override legacy stacking). */
@media(min-width:561px) and (max-width:900px){.hero-action{grid-column:auto;grid-row:auto;justify-self:stretch;margin-bottom:0}.hero-bottom{align-items:end}}

/* Realistic gameplay-concept frame overlays */
.image-border{overflow:hidden}.game-hud{position:absolute;inset:6px;color:white;font:600 clamp(5px,.57vw,8px)/1.15 var(--sans);text-shadow:0 1px 3px #071929;pointer-events:none}.game-hud-top{position:absolute;top:5px;left:7px;right:7px;display:flex;justify-content:space-between;gap:6px}.hud-quest{color:#ffdc89;background:#19382b9c;padding:3px 6px;border:1px solid #f5d99b70}.hud-map{display:grid;place-items:center;width:clamp(25px,3.5vw,45px);height:clamp(25px,3.5vw,45px);border:1px solid #d9c79493;border-radius:50%;background:radial-gradient(circle,#5e816dbb,#193d39db);font-family:var(--serif);font-size:9px}.hud-map::after{content:'✧';position:absolute;color:#fff6c2;font-size:clamp(10px,1.2vw,16px)}.hud-compass{position:absolute;top:30%;left:43%;display:flex;flex-direction:column;align-items:center;gap:4px;color:#ffee8a}.hud-compass b{font-size:clamp(12px,1.6vw,21px);filter:drop-shadow(0 1px 3px #151e2a)}.hud-compass small{font:600 clamp(5px,.6vw,8px) var(--sans);color:white}.hud-character{position:absolute;bottom:12%;left:48%;width:clamp(25px,3.7vw,54px);height:clamp(62px,9vw,124px);filter:drop-shadow(0 2px 4px #152735)}.hud-skillbar{position:absolute;bottom:4px;left:6px;right:6px;display:flex;justify-content:center;gap:3px}.hud-skillbar i{width:clamp(12px,1.7vw,23px);height:clamp(11px,1.4vw,19px);border:1px solid #dabf8f9c;background:linear-gradient(145deg,#315f69c7,#071f2bc9);box-shadow:inset 0 0 3px #9bcbd25c;font:normal 7px serif;display:grid;place-items:center;font-style:normal;color:#e4ce8b}.hud-level{position:absolute;bottom:23px;left:7px;background:#0e302e99;border:1px solid #d5ba7877;padding:3px 5px;font-size:clamp(6px,.66vw,10px);color:#e5edcf}.game-hud .hud-map{position:relative}.image-caption{z-index:5;background:#0c243abd}

/* The reference places the large game mark directly beneath the header, without a tagline above it. */
.hero-eyebrow{display:none}

/* Display milestone labels in full above the reward frames. A polygon clip on the card would cut them off. */
.reward-card,.reward-card.tier-three{clip-path:none;overflow:visible;border-radius:7px 7px 12px 12px}
.reward-card .milestone{z-index:10;top:-17px;box-shadow:0 2px 6px #16354c6a,0 0 0 2px #ebdca9}


/* November 2026: AAA-style original reward equipment assets, no flat glyphs. */
.reward-card,.reward-card.tier-three{
  background:
    radial-gradient(ellipse 80% 65% at 50% 40%,rgba(242,253,255,.93),rgba(173,215,243,.72) 57%,transparent 87%),
    linear-gradient(155deg,#b9d8f4 0%,#8bbee3 53%,#517faa 100%);
  border:1px solid rgba(234,216,162,.86);
  outline:1px solid rgba(103,157,194,.76);
  box-shadow:0 9px 15px #48739942,0 0 0 2px #e7f7ff78 inset,0 -15px 24px #26598531 inset;
  overflow:visible;
  isolation:isolate;
}
.reward-card.tier-three{
  background:
    radial-gradient(ellipse 90% 60% at 50% 45%,#f3fbff,rgba(172,212,243,.86) 60%,transparent 91%),
    linear-gradient(155deg,#c7e4f8 0%,#8fb8d8 55%,#5a8bb4 100%);
}
.reward-card .reward-glow{
  position:absolute;left:2%;top:7%;width:96%;height:93%;z-index:0;
  background:radial-gradient(ellipse,#ecfdff 0%,#c6f1ff8a 47%,transparent 74%);
  filter:blur(8px);pointer-events:none;
}
.reward-card img.reward-art,
.reward-card.tier-three img.reward-art{
  position:absolute;
  display:block;
  z-index:2;
  left:-7%;top:2%;
  width:114%;height:99%;
  max-width:none;max-height:none;
  margin:0;padding:0;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 10px 7px #1a537155) saturate(1.09) contrast(1.04);
  transition:transform .35s ease,filter .35s ease;
  transform:translateZ(0);
}
.reward-card.tier-three img.reward-art{width:134%;height:109%;left:-17%;top:-2%}
.reward-card.tier-one img.reward-art{width:121%;left:-10.5%;height:103%;top:1%}
.reward-card.tier-two img.reward-art{width:125%;left:-12.5%;height:107%;top:0}
.reward-card.tier-four img.reward-art{width:118%;left:-9%;height:108%;top:-1%}
.reward-card.tier-five img.reward-art{width:126%;left:-13%;height:105%;top:-1%}
.reward-card:hover img.reward-art{
  transform:translateY(-9px) scale(1.045) rotate(-1.6deg);
  filter:drop-shadow(0 15px 11px #14587970) saturate(1.18) contrast(1.08);
}
.reward-card .milestone{
  z-index:5;
  border:1px solid #e4c788;
  box-shadow:0 3px 9px #183f6080,inset 0 1px #fff7;
  background:linear-gradient(#4c5051,#222a31 90%);
}
.reward-card .reward-name,.reward-card .reward-caption{display:none}
.image-border img#world-image{object-fit:cover;object-position:center 48%;filter:saturate(1.12) contrast(1.025)}
.image-border .image-shine{background:linear-gradient(118deg,#c8f6ff0c,transparent 51%,#f0d0931a)}
@media(max-width:560px){
  .reward-card img.reward-art,.reward-card.tier-three img.reward-art{
    width:128%;height:110%;top:-2%;left:-14%;
    filter:drop-shadow(0 4px 4px #275a785c) saturate(1.05);
  }
  .reward-card.tier-three img.reward-art{width:150%;height:112%;left:-25%;top:-1%}
  .reward-card.tier-two img.reward-art{width:135%;left:-17.5%}
  .reward-card.tier-five img.reward-art{width:133%;left:-16.5%}
}
@media(prefers-reduced-motion:reduce){
  .reward-card img.reward-art{transition:none}
}