*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0b0917;color:#f9f5ff;font:16px Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}header{height:88px;background:linear-gradient(110deg,#0b0919,#141024);display:flex;align-items:center;justify-content:space-between;padding:8px 4.7%;border-bottom:1px solid #754295}header .logo{display:block;width:275px;height:75px;object-fit:contain;object-position:left center}nav{display:flex;gap:clamp(15px,4.5vw,76px)}nav a{color:#ded5ed;font-size:19px}nav a:hover,nav a.active{color:#fff;text-shadow:0 0 14px #bd47ff}nav a.active{border-bottom:2px solid #c139ff;padding-bottom:8px}.hero{min-height:620px;position:relative;display:grid;grid-template-columns:44% 56%;overflow:hidden;border-bottom:2px solid #66308b;background:radial-gradient(ellipse at 58% 10%,#562b9e90,transparent 45%),linear-gradient(110deg,#10071c 0%,#1d0b39 55%,#0b0818 100%)}.hero:before{content:'';position:absolute;inset:0;background-image:linear-gradient(90deg,#0d061ae8 0%,#0e0614ad 32%,transparent 77%),url('/hero-castle.webp');background-size:cover,68% 44%;background-repeat:no-repeat;background-position:center,65% top;opacity:.87}.hero:after{content:'';position:absolute;right:0;top:0;bottom:0;width:26%;background:url('/hero-knight.webp') right center/cover no-repeat;mask-image:linear-gradient(90deg,transparent,#000 36%);opacity:.95}.hero-content{position:relative;z-index:2;padding:38px 1.2vw 40px 4.7vw;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.hero-logo{display:block;width:min(100%,585px);height:245px;object-fit:contain;object-position:left center;filter:drop-shadow(0 0 16px #a82afa70)}.hero p{font:clamp(19px,2vw,25px)/1.35 Georgia,serif;max-width:570px;text-shadow:0 2px 8px #000}.stats{display:flex;justify-content:space-between;gap:12px;width:100%;max-width:565px;margin:16px 0 29px}.stat{text-align:center;font-size:13px;white-space:nowrap}.stat svg{display:block;width:33px;height:33px;margin:0 auto 9px;fill:none;stroke:#c3b0f5;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.download{display:inline-flex;gap:15px;align-items:center;justify-content:center;padding:18px 36px;min-width:355px;background:linear-gradient(#341052,#210b38);border:2px solid #bb35ff;box-shadow:0 0 18px #a92cff99,inset 0 0 19px #9123f54f;border-radius:15px;color:white;font:700 26px Georgia,serif;cursor:pointer}.download:hover{filter:brightness(1.2)}.download svg{width:29px;height:29px;stroke:white;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.section{padding:29px 4.7% 55px}.section h1{font:700 44px Georgia,serif;margin:0 0 22px}.section h1:after{content:'';display:block;width:125px;height:3px;background:linear-gradient(90deg,#b72bff,transparent);margin-top:14px}.cards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px}.card{min-width:0;background:#121020;border:1px solid #60417d;border-radius:22px;overflow:hidden;position:relative}.card img{display:block;width:100%;height:270px;object-fit:contain;background:#100a20}.card .content{padding:16px 20px}.card h2{font:700 25px Georgia,serif;margin:0 0 8px}.card p{color:#ddd4eb;line-height:1.45}.card .link{color:#d9a0ff;font-weight:bold}.card.minigame{display:flex;align-items:center;justify-content:center;gap:22px;padding:30px}.gamepad svg{width:65px;height:65px;fill:none;stroke:#aa3be8;stroke-width:2}.card.minigame h2{font-size:32px}.modal-backdrop{display:none;position:fixed;inset:0;background:#05030cbb;z-index:100;align-items:center;justify-content:center;padding:14px}.modal-backdrop.open{display:flex}.modal{background:linear-gradient(145deg,#20192f,#100f1f);border:2px solid #9639c9;border-radius:24px;box-shadow:0 0 35px #9b25dc77;padding:26px 30px;width:min(610px,100%);max-height:95dvh;overflow:auto;position:relative}.modal h2{font:700 30px Georgia,serif;text-align:center;margin:0 0 9px}.modal>p{text-align:center;color:#ddd6e7}.close{position:absolute;right:17px;top:11px;background:none;border:0;color:white;font-size:30px;cursor:pointer}.platforms{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:23px 0}.platform{background:#171628;color:#fff;border:1px solid #544a72;border-radius:13px;min-height:115px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer}.platform:hover,.platform.active{border-color:#b338f4;box-shadow:0 0 15px #9a2fd866}.platform svg{width:32px;height:32px;fill:none;stroke:#d7b5ff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.platform strong{font-size:17px}.platform small{color:#d5cce0}.guide{border-top:1px solid #5a4770;padding-top:15px;line-height:1.6}.guide a{color:#d6a0ff;text-decoration:underline}.guide ol{padding-left:24px}.guide h3{margin:0}.subpage{padding:40px 5%;max-width:1300px;margin:auto}.subpage h1{font:700 44px Georgia,serif}.subpage .feature{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;padding:24px;margin:22px 0;background:#181329;border:1px solid #674080;border-radius:20px}.subpage .feature img{width:100%;height:320px;object-fit:contain}.subpage .feature h2{font:700 32px Georgia,serif}.subpage p{line-height:1.65;color:#ddd5eb}.subpage .download{font-size:21px;min-width:220px;padding:12px 25px}footer{padding:35px;text-align:center;border-top:1px solid #4b3569;color:#c7b6db}@media(max-width:850px){header{padding:8px 3%}header .logo{width:155px}nav{gap:12px}nav a{font-size:13px}.hero{grid-template-columns:1fr;min-height:0}.hero-content{padding:40px 5%}.hero:after{width:40%;opacity:.5}.cards{grid-template-columns:1fr 1fr}.card.minigame{grid-column:1/-1}.stats{max-width:540px}}@media(max-width:520px){header{height:70px}header .logo{width:110px;height:54px}nav{gap:8px}nav a{font-size:11px}.hero-content{padding:25px 4% 34px}.hero-logo{width:100%;height:175px}.hero:after{opacity:.24}.stats{gap:4px}.stat{font-size:10px}.stat svg{width:24px;height:24px}.download{width:100%;min-width:0;font-size:23px}.cards{grid-template-columns:1fr}.card.minigame{grid-column:auto}.section{padding:30px 4%}.modal{padding:24px 15px}.platform{min-height:100px}.subpage .feature{grid-template-columns:1fr}.subpage{padding:25px 4%}}

/* v27: screenshot-matched dimensions and composition, without changing source logos */
body{background:#090816;font-family:Arial,Helvetica,sans-serif}
header{height:clamp(48px,5.8vw,76px);padding:3px 4.7%;background:linear-gradient(90deg,#100b23,#10101f);border-bottom:1px solid #71328e}
header .logo{width:clamp(155px,23vw,250px);height:clamp(43px,5.6vw,68px);object-fit:contain}
nav{gap:clamp(20px,4.5vw,55px)}nav a{font-size:clamp(12px,1.45vw,16px)}
.hero{height:clamp(330px,40.3vw,550px);min-height:0;display:block;overflow:hidden;background:linear-gradient(90deg,#10071a 0%,#21103b 42%,#10091c 100%)}
.hero:before{background-image:linear-gradient(90deg,#0b0616 0%,#10061d9c 36%,#120a1b00 75%),url('/hero-castle.webp');background-size:cover,100% auto;background-position:center,center 22%;opacity:1}
.hero:after{width:clamp(140px,29%,390px);background-size:cover;background-position:right 35%;opacity:1;mask-image:linear-gradient(90deg,transparent,#000 32%)}
.hero-content{width:44%;height:100%;padding:clamp(10px,1.9vw,26px) 0 clamp(14px,2vw,25px) 4.7%;justify-content:space-between}
.hero-logo{width:100%;height:clamp(120px,16.5vw,220px);object-fit:contain;object-position:left center;filter:drop-shadow(0 0 10px #8c24e777)}
.hero p{font-size:clamp(13px,1.56vw,19px);line-height:1.25;margin:4px 0 7px;max-width:390px}
.stats{gap:5px;max-width:100%;margin:4px 0 10px}
.stat{font-size:clamp(8px,.94vw,12px)}.stat svg{width:clamp(17px,2.3vw,27px);height:clamp(17px,2.3vw,27px);margin-bottom:4px}
.download{min-width:0;width:83%;max-width:355px;padding:clamp(8px,1.2vw,14px) 14px;font-size:clamp(15px,1.9vw,23px);border-radius:9px;gap:10px}
.download svg{width:23px;height:23px}
.section{padding:14px 4.7% 45px}.section h1{font-size:clamp(25px,3vw,38px);margin-bottom:14px}.section h1:after{margin-top:7px;width:65px;height:2px}
.cards{gap:clamp(12px,2.4vw,25px)}.card{border-radius:12px}.card img{height:clamp(105px,14vw,195px);object-fit:contain}.card .content{padding:10px 12px}.card h2{font-size:clamp(15px,2vw,22px)}.card p{font-size:13px}.card.minigame{gap:12px;padding:15px}.card.minigame h2{font-size:clamp(18px,2.3vw,28px)}.gamepad svg{width:45px;height:45px}
.modal{width:min(440px,95vw);border-radius:13px;padding:17px 17px;box-shadow:0 0 22px #ad25f47d;border-width:1px}.modal h2{font-size:clamp(21px,2.3vw,26px);margin-bottom:4px}.modal>p{font-size:12px;margin:3px 0 12px}.platforms{gap:9px;margin:14px 0}.platform{min-height:83px;border-radius:9px;gap:2px}.platform svg{width:25px;height:25px}.platform strong{font-size:13px}.platform small{font-size:10px}.guide{font-size:12px;line-height:1.4;padding-top:9px}.guide h3{font-size:13px}.close{font-size:23px}
@media(max-width:620px){header{padding:3px 3%}header .logo{width:120px;height:45px}nav{gap:9px}nav a{font-size:11px}.hero{height:auto;min-height:400px}.hero-content{width:70%;min-height:400px;padding:15px 0 20px 4%;justify-content:space-between}.hero-logo{height:150px}.hero:before{background-size:cover,auto 100%;background-position:center,62% center}.hero:after{width:43%;opacity:.8}.hero p{font-size:13px}.stats{gap:4px;flex-wrap:wrap;justify-content:flex-start}.stat{font-size:9px;width:31%}.download{width:95%;font-size:17px}.cards{grid-template-columns:1fr}.card img{height:175px}.card.minigame{grid-column:auto}.section{padding:19px 4% 35px}}
@media(max-width:390px){header .logo{width:95px}nav{gap:6px}nav a{font-size:10px}.hero-content{width:77%}.hero:after{opacity:.5}}


/* v28 visual correction: target reference proportions, responsive layout */
:root{--bg:#0b0917;--purple:#b738ff}
body{margin:0;background:var(--bg);color:#fff;font-family:Arial,Helvetica,sans-serif}
header{height:62px;padding:0 4.6%;display:flex;align-items:center;justify-content:space-between;background:#110e20;border-bottom:1px solid #704083}
header .logo{width:190px;height:54px;object-fit:contain;object-position:left center;mix-blend-mode:screen;mask-image:radial-gradient(ellipse 72% 72% at 50% 50%,black 48%,transparent 100%)}
nav{display:flex;gap:clamp(12px,3vw,32px)}nav a{font-size:14px;white-space:nowrap}
.hero{height:375px;min-height:0;position:relative;overflow:hidden;display:block;background:linear-gradient(90deg,#10071c,#1d0a31)}
.hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b0719e8 0%,#100719a6 32%,transparent 75%),url('/hero-castle.webp') center top/100% auto no-repeat;opacity:1}
.hero:after{content:'';position:absolute;right:0;top:0;bottom:0;width:33%;background:url('/hero-knight.webp') right center/cover no-repeat;mask-image:linear-gradient(90deg,transparent 0%,black 34%);opacity:1}
.hero-content{position:relative;z-index:2;width:45%;height:100%;padding:12px 0 16px 4.6%;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between}
.hero-logo{width:100%;height:142px;object-fit:contain;object-position:left center;mix-blend-mode:screen;mask-image:radial-gradient(ellipse 75% 77% at 50% 50%,black 55%,transparent 100%);filter:drop-shadow(0 0 9px #9922ed)}
.hero p{font:15px/1.28 Georgia,serif;margin:0 0 4px;max-width:370px}
.stats{display:flex;flex-wrap:nowrap;gap:4px;margin:8px 0 11px;width:100%;justify-content:space-between}.stat{font-size:9px;text-align:center;white-space:nowrap}.stat svg{width:21px;height:21px;margin:0 auto 4px}
.download{width:80%;min-width:0;max-width:260px;padding:10px 12px;font:700 17px Georgia,serif;border-radius:9px;gap:8px}.download svg{width:21px;height:21px}
.section{padding:18px 4.6% 40px}.section h1{font-size:29px;margin-bottom:12px}.section h1:after{margin-top:8px;width:63px}.cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.card{border-radius:12px}.card img{height:130px;object-fit:contain}.card .content{padding:9px}.card h2{font-size:17px}.card p{font-size:12px}.card.minigame{grid-column:auto;padding:12px;gap:8px}.card.minigame h2{font-size:19px}.gamepad svg{width:36px;height:36px}
.modal-backdrop{background:#05030cbd}.modal{width:min(440px,calc(100vw - 26px));padding:17px;border-radius:13px}.modal h2{font-size:24px}.modal>p{font-size:12px}.platforms{gap:9px;margin:14px 0}.platform{min-height:88px;gap:3px}.platform svg{width:26px;height:26px}.platform strong{font-size:13px}.platform small{font-size:10px}.guide{font-size:12px;padding-top:10px}
@media(min-width:1100px){header{height:76px}.hero{height:470px}.hero-content{padding-top:22px;padding-bottom:22px}.hero-logo{height:175px}.hero p{font-size:19px}.stat{font-size:12px}.stat svg{width:28px;height:28px}.download{font-size:21px;max-width:330px;padding:14px}.section h1{font-size:37px}.card img{height:180px}.card h2{font-size:22px}}
/* Mobile is deliberately compact: preserve the desktop composition, not a 1000px-tall stacked hero */
@media(max-width:650px){
header{height:56px;padding:0 3%}header .logo{width:120px;height:46px}nav{gap:10px}nav a{font-size:11px}
.hero{height:430px;min-height:0}.hero:before{background:linear-gradient(90deg,#0b061bdc 0%,#12091b9c 53%,#0b061b33 100%),url('/hero-castle.webp') center 0/auto 46% no-repeat;background-color:#170c2b}.hero:after{width:44%;background-position:right center;opacity:.85}
.hero-content{width:76%;height:100%;padding:16px 0 20px 4%;justify-content:space-between}.hero-logo{height:124px;width:100%;max-width:330px}.hero p{font-size:14px;max-width:270px;line-height:1.35;margin:0}
.stats{max-width:280px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;margin:0}.stat{font-size:8px;white-space:normal;line-height:1.2}.stat svg{width:20px;height:20px;margin:0 auto 5px}
.download{width:76%;max-width:230px;font-size:17px;padding:11px 8px}
.section{padding:19px 4% 32px}.section h1{font-size:28px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card img{height:112px}.card h2{font-size:15px}.card p{font-size:11px}.card.minigame{grid-column:1/-1;min-height:90px;justify-content:flex-start}.card.minigame h2{font-size:20px}
}
@media(max-width:380px){header .logo{width:103px}nav{gap:7px}nav a{font-size:10px}.hero-content{width:80%}.hero p{max-width:245px}}