*{box-sizing:border-box}html,body{margin:0;background:#06090b;color:#fff;font-family:Arial,sans-serif}body{min-height:100svh}header{position:absolute;top:0;left:0;width:100%;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:25px 42px;background:linear-gradient(#0009,transparent)}header img{width:115px}header>span{font-size:10px;letter-spacing:5px;color:#efe3c7}button{background:#0004;border:1px solid #ffffff40;color:#fff;padding:10px 15px;cursor:pointer}main{display:flex;height:100svh;min-height:660px;overflow:hidden;direction:ltr}.world{position:relative;flex:1;min-width:0;display:grid;place-items:center;isolation:isolate;transition:flex 1.2s cubic-bezier(.22,.7,.18,1);overflow:hidden}.world+.world{border-left:1px solid #e0c48365}.world:hover,.world:focus-within{flex:1.3}.art,.shade{position:absolute;inset:0;z-index:-2}.art{background-size:cover;background-position:center;transform:scale(1.025);transition:transform 2s ease,filter 1.2s;filter:saturate(.85)}.classic .art{background-image:url('legacy-6159-poster-v1.jpg');background-position:46% center}.next .art{background-image:url('background.png');background-position:60% center}.shade{z-index:-1;background:linear-gradient(0deg,#02070ceb,transparent 38%,#0002 70%,#02070c80),linear-gradient(90deg,#0003,#0005,#0003)}.world:hover .art,.world:focus-within .art{transform:scale(1.08);filter:saturate(1.15)}.content{text-align:center;width:min(92%,520px);padding:32px 30px 28px;border-radius:14px;background:linear-gradient(180deg,#00000055,#00000088);border:1px solid #ffffff22;box-shadow:0 12px 40px #00000090;text-shadow:0 2px 18px #000;transform:translateY(24px);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.classic .content{background:linear-gradient(180deg,#3a240a59,#1c110666);border-color:#e8b64c33;box-shadow:0 8px 28px #00000070,0 0 30px #e8a83c14}.next .content{background:linear-gradient(180deg,#1d153359,#0b081666);border-color:#b48ae033;box-shadow:0 8px 28px #00000070,0 0 30px #7a4fd114}.eyebrow{display:block;color:#f0d898;letter-spacing:5px;font-size:10px;font-weight:bold;margin-bottom:10px}.logo{width:min(300px,80%);filter:drop-shadow(0 10px 18px #0009)}h1{font-family:'Cinzel Decorative',Georgia,serif;font-size:clamp(30px,3.4vw,50px);font-weight:900;line-height:1.25;margin:8px 0 23px;letter-spacing:3px;color:#ffe9b3;text-shadow:0 2px 0 #4a2f0c,0 5px 24px #000c}h1 span{font-size:.58em;font-weight:700;letter-spacing:2px;color:#e6c887;margin-inline-end:14px}.content p{font-size:15px;line-height:1.8;margin:0 0 28px;color:#fff7e8}.enter{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:252px;padding:15px 32px;border:1px solid #241503;border-radius:3px;outline:1px solid #f0d48a;outline-offset:-6px;color:#3a2203;background:radial-gradient(circle at 15px 50%,#fff8dc 0 2px,#7a541f 2px 4px,#241503 4px 5px,transparent 6px),radial-gradient(circle at calc(100% - 15px) 50%,#fff8dc 0 2px,#7a541f 2px 4px,#241503 4px 5px,transparent 6px),linear-gradient(180deg,#7a541f 0%,#c49a45 14%,#f4dd96 42%,#fff7d2 50%,#f0d48a 58%,#b98a35 86%,#6b4a1a 100%);box-shadow:0 0 0 4px #00000090,0 8px 26px #000000b0,0 0 26px #e8b64c33,inset 0 2px 3px #fffbe8cc,inset 0 -4px 10px #4a2c00aa;text-decoration:none;font-family:'Cinzel Decorative',Georgia,serif;font-size:14px;font-weight:900;letter-spacing:2px;text-shadow:0 1px 0 #ffedbe99;transition:filter .25s,box-shadow .3s,transform .25s cubic-bezier(.34,1.56,.64,1)}.enter::before{content:"";position:absolute;inset:9px 11px;border:1px solid #5e3a0855;border-radius:2px;pointer-events:none;box-shadow:inset 0 0 0 1px #fff3c444}.enter span,.enter b{position:relative;z-index:1}.enter::after{content:"";position:absolute;inset:-7px;border-radius:6px;background:linear-gradient(115deg,#ff3d00,#ff9100 30%,#ffd54f 50%,#ff9100 70%,#ff3d00);background-size:220% 220%;filter:blur(10px);opacity:0;transition:opacity .3s;pointer-events:none;z-index:-1}.enter:hover::after,.enter:focus-visible::after{opacity:.85;animation:enter-fire 1.1s ease-in-out infinite}@keyframes enter-fire{0%,100%{background-position:0% 40%;opacity:.6}50%{background-position:100% 60%;opacity:.95}}.enter:hover{transform:scale(1.06);filter:brightness(1.1);box-shadow:0 0 0 4px #00000090,0 8px 26px #000000b0,0 0 18px #ff9100cc,0 0 55px #ff6d00aa,inset 0 2px 3px #fffbe8cc,inset 0 -4px 10px #4a2c00aa}.enter:active{transform:translateY(2px);filter:brightness(.95)}.classic .enter{color:#062730;outline-color:#c4edf5;background:radial-gradient(circle at 15px 50%,#f2fdff 0 2px,#2a6b80 2px 4px,#0b2c38 4px 5px,transparent 6px),radial-gradient(circle at calc(100% - 15px) 50%,#f2fdff 0 2px,#2a6b80 2px 4px,#0b2c38 4px 5px,transparent 6px),linear-gradient(180deg,#0e3a4a 0%,#35849a 14%,#a5e2ef 42%,#f2fdff 50%,#a5e2ef 58%,#2a6b80 86%,#0b2c38 100%);box-shadow:0 0 0 4px #00000090,0 8px 26px #000000b0,0 0 26px #6fd3e833,inset 0 2px 3px #f2fdffcc,inset 0 -4px 10px #062730aa}.classic .enter::before{border-color:#0b2c3855;box-shadow:inset 0 0 0 1px #f2fdff44}.classic .enter:hover{filter:brightness(1.09);box-shadow:0 0 0 4px #00000090,0 8px 26px #000000b0,0 0 40px #6fd3e8aa,inset 0 2px 3px #f2fdffcc,inset 0 -4px 10px #062730aa}.enter:focus-visible,button:focus-visible{outline:3px solid white;outline-offset:6px}.content small{display:block;margin-top:22px;font-size:10px;color:#e0d6c0;letter-spacing:1px}footer{position:absolute;bottom:22px;left:0;width:100%;padding:0 42px;display:flex;justify-content:space-between;gap:20px;font-size:9px;letter-spacing:2px;color:#c4c3bf;pointer-events:none}html[lang=ar] .content p,html[lang=ar] small{direction:rtl}html[lang=ar] .enter,html[lang=ar] .eyebrow{letter-spacing:0}@media(min-width:1600px){.content{transform:translateY(5px)}}@media(max-width:640px){header{padding:14px 20px}header img{width:85px}header>span{font-size:8px;letter-spacing:2px}main{height:auto;min-height:100svh;flex-direction:column}.world{min-height:620px}.world+.world{border-left:0;border-top:1px solid #e0c48365}.content{padding:26px 20px 22px;transform:none}.logo{width:220px}h1{font-size:29px;letter-spacing:2px}.world:hover,.world:focus-within{flex:1}footer{position:relative;padding:22px;font-size:8px}.next .content{padding-top:26px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}.world:hover .art{transform:none}.enter::after{display:none}.enter:hover{transform:none}}

/* Fill the section like 6159: cover the square source, keep head visible. */
.world-video{inset:0;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}
.classic .world-video{inset:-40% 0;width:100%;height:180%;object-fit:cover;object-position:18% 50%}
.next .world-video{object-position:50% 12%}

/* Reveal both videos smoothly on hover or keyboard focus. */
.next .shade,.classic .shade{opacity:1;transition:opacity .65s ease}
.next:hover .shade,.next:focus-within .shade,
.classic:hover .shade,.classic:focus-within .shade{opacity:0}

/* Original artwork, hosted with the independent selector. */
.classic .world-video{background-image:url('legacy-6159-poster-v1.jpg');background-size:cover;background-position:18% 50%}
.next .world-video{background-image:url('background.png');background-size:cover;background-position:50% 12%}
.mobile-title{font-size:clamp(28px,2.8vw,42px);letter-spacing:1px}
@media(max-width:640px){.world{min-height:580px}.content{width:min(90%,420px)}.enter{min-width:220px;max-width:100%}.classic .world-video{height:180%;inset:-40% 0}header>span{max-width:120px;text-align:center;line-height:1.7}footer{letter-spacing:1px}}

/* Mobile dragon identity: ember red, burnished gold, warm charcoal. */
.next{border-left-color:#e78b4166}
.next .shade{background:linear-gradient(0deg,#120403ed,transparent 55%,#10040380),linear-gradient(100deg,#26090345,#811b122a,#1a08064d)}
.next .content{background:linear-gradient(145deg,#381009b8,#190807ab 55%,#400c0cb3);border:1px solid #e5944759;box-shadow:0 15px 45px #08010099,0 0 32px #cf32151c,inset 0 1px #ffd79b26}
.next .eyebrow{color:#ffc783}
.next .mobile-logo{width:min(370px,96%);height:150px;object-fit:contain;filter:drop-shadow(0 5px 18px #c7271538)}
.next .mobile-title{display:flex;align-items:center;justify-content:center;gap:12px;margin:10px 0 23px;line-height:1.3;letter-spacing:0;font-size:clamp(25px,2.7vw,40px)}
.next .mobile-title-text{font:inherit;margin:0;letter-spacing:0;background:linear-gradient(180deg,#fff1c2 10%,#ffc258 48%,#ee733b 90%);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:none;filter:drop-shadow(0 2px 2px #260400)}
.next .android-icon{width:34px;height:34px;flex-shrink:0;color:#ffc66c;filter:drop-shadow(0 0 8px #f36c233b)}
.next .content p{color:#fff1db}
.next .content small{color:#e9c4aa}
.next .enter{color:#ffe7ae;outline-color:#f3b6588c;border-color:#4e140b;background:radial-gradient(circle at 15px 50%,#ffe5a1 0 2px,#9d4b20 2px 4px,#451009 4px 5px,transparent 6px),radial-gradient(circle at calc(100% - 15px) 50%,#ffe5a1 0 2px,#9d4b20 2px 4px,#451009 4px 5px,transparent 6px),linear-gradient(180deg,#53140c 0%,#a63b1c 15%,#c64d21 42%,#a82a14 52%,#84200f 85%,#441007 100%);text-shadow:0 1px 2px #350500;box-shadow:0 0 0 4px #190300a0,0 8px 26px #0009,0 0 25px #dc4a202b,inset 0 2px 3px #ffc57680,inset 0 -4px 10px #35080099}
.next .enter:before{border-color:#ffd48c55;box-shadow:inset 0 0 0 1px #45100866}
.next .enter:hover{box-shadow:0 0 0 4px #190300a0,0 8px 26px #0009,0 0 36px #dc4a2066,inset 0 2px 3px #ffc57680;filter:brightness(1.12)}
@media(max-width:640px){.next .mobile-logo{height:125px}.next .mobile-title{font-size:clamp(22px,6.4vw,29px);gap:8px}.next .android-icon{width:28px;height:28px}}
