@font-face{font-family:Cinzel;src:url('/static/cinzel.ttf') format('truetype');font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:#101b22;color:#e8e7de;font-family:Arial,Helvetica,sans-serif;font-size:16px;line-height:1.65}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{color:inherit;cursor:pointer}button:disabled{opacity:.6;cursor:wait}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #e2bd7a;outline-offset:6px}img{display:block;max-width:100%}em{font-style:normal;color:#d8b675}h1,h2,h3,p{margin:0}h1,h2,h3,.brand{font-family:Cinzel,Georgia,serif;font-weight:400}h1{font-size:clamp(52px,5.7vw,94px);line-height:1.14;letter-spacing:-3px}h2{font-size:clamp(35px,3.3vw,54px);line-height:1.25;letter-spacing:-1.3px}button{border:0}.nav{height:94px;display:flex;align-items:center;justify-content:space-between;padding:0 5.2%;position:absolute;z-index:5;width:100%;border-bottom:1px solid #d8b67535;background:linear-gradient(#0c171edb,#0c171e55);gap:28px}.brand{display:flex;align-items:center;gap:12px;line-height:1.1;font-size:24px;letter-spacing:3.5px}.brand-sub{display:block;font-family:Arial,sans-serif;font-size:8px;letter-spacing:4.7px;margin-top:7px;color:#c6bd9f}.nav-links{display:flex;gap:34px;font-size:13px;color:#d0d6d3}.nav-links a:hover,.account-button:hover{color:#e5bd78}.account-button{font-size:13px;background:transparent;display:flex;gap:25px;align-items:center}.account-button span{color:#d8b675}.menu-toggle{display:none;background:none;font-size:25px}.hero{height:min(900px,100svh);min-height:730px;position:relative;overflow:hidden}.hero-scene,.hero-shade,.hero-grain{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero-scene{object-position:70% 50%;filter:saturate(.8) brightness(.73);transform:scale(1.02)}.hero-shade{background:linear-gradient(90deg,#0d1b21 2%,#0d1b21f2 24%,#0d1b21a1 49%,#0d1b210d 85%),linear-gradient(0deg,#101b22 0%,transparent 24%)}.hero-grain{opacity:.14;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.35' d='M0 0h180v180H0z'/%3E%3C/svg%3E");pointer-events:none}.hero-content{position:relative;padding:205px 0 130px 7.5%;width:75%}.eyebrow{font-size:10px;letter-spacing:3px;font-weight:600;color:#d8b675;margin-bottom:24px}.eyebrow span{display:inline-block;width:6px;height:6px;border-radius:50%;background:#cdb27c;box-shadow:0 0 20px #d7b577;margin-right:12px;vertical-align:2px}.hero-description{max-width:530px;color:#c0c9c5;font-size:16px;line-height:1.9;margin-top:26px}.hero-actions{display:flex;align-items:center;gap:38px;margin-top:34px}.button{padding:17px 25px;display:inline-flex;align-items:center;justify-content:space-between;gap:42px;font-size:13px;font-weight:700;letter-spacing:.3px;min-width:220px;transition:background .2s,transform .2s}.button:hover{transform:translateY(-2px)}.gold{background:#d8b675;color:#152027;box-shadow:inset 0 0 0 1px #ead5ab}.gold:hover{background:#ebca8d}.text-link{display:inline-flex;gap:25px;align-items:center;font-size:12px;font-weight:600;background:none;padding:0}.text-link span{color:#d8b675}.hero-note{font-size:10px;color:#8faaa4;margin-top:17px}.hero-bottom{position:absolute;bottom:40px;left:7.5%;right:7.5%;display:flex;justify-content:space-between;border-top:1px solid #c8c7ad30;padding-top:22px;font-size:9px;letter-spacing:2px;color:#a2aca8}.hero-bottom a span{margin-left:28px;color:#d8b675}.section{padding:110px 7.5%}.intro{display:grid;grid-template-columns:1fr 1fr;gap:50px 90px}.intro-copy{padding-top:35px;color:#9eafad;font-size:15px;line-height:1.9;max-width:510px}.intro-copy p+p{margin-top:20px}.intro-copy a{margin-top:27px;color:#e1decf}.realm-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #c7b17a2b;border-bottom:1px solid #c7b17a2b;padding:34px 0;margin-top:18px}.realm-stats div{display:flex;align-items:center;gap:20px;padding-left:30px;border-right:1px solid #c7b17a2b}.realm-stats div:first-child{padding-left:0}.realm-stats div:last-child{border:0}.realm-stats strong{font:42px Cinzel,Georgia,serif;color:#d8b675}.realm-stats span{font-size:11px;line-height:1.5;color:#a8b7b1;max-width:85px}.section-top{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px}.section-top>p{font-size:13px;color:#91aaa5;line-height:1.9;padding-bottom:5px}.champions{background:radial-gradient(ellipse at 26% 75%,#25413c66,transparent 45%),#122229;border-top:1px solid #bda56e14;border-bottom:1px solid #bda56e14}.champion-tabs{display:flex;border-bottom:1px solid #c6b47b35;margin-top:50px}.champion-tabs button{flex:1;text-align:left;padding:18px 0;background:none;color:#849c98;font-size:11px;border-bottom:2px solid transparent}.champion-tabs button[aria-selected=true]{color:#e5c485;border-bottom-color:#d8b675}.champion-stage{display:grid;grid-template-columns:1.1fr 1fr;min-height:510px;padding-top:25px;align-items:center;gap:80px}.champion-art{height:480px;position:relative;display:grid;place-items:center}.champion-art img{height:98%;max-width:100%;object-fit:contain;position:relative;filter:drop-shadow(0 15px 25px #0006);transition:opacity .15s}.champion-rune{position:absolute;font:430px Georgia;color:#d7bb7b10;line-height:1}.champion-description{max-width:420px}.champion-description .eyebrow{font-size:9px;margin-bottom:17px}.champion-description h3{font-size:60px;color:#f0e6cb;line-height:1.2}.champion-description>p:not(.eyebrow){font-size:15px;color:#9fb4ad;line-height:1.9;margin-top:20px}.champion-ability{display:flex;align-items:center;gap:18px;border-top:1px solid #d8b67530;padding:22px 0;margin-top:26px}.champion-ability>span{font-size:29px;color:#d8b675}.champion-ability small{font-size:8px;letter-spacing:2px;color:#859d98;display:block}.champion-ability strong{font-family:Cinzel,Georgia,serif;font-size:17px;display:block;font-weight:400;color:#d8b675;margin-top:3px}.champion-description>.text-link{margin-top:20px}.world-grid{display:flex;height:370px;gap:12px}.realm{position:relative;overflow:hidden;flex:1;min-width:0;text-align:left;padding:0;background:#12232b;transition:flex .4s}.realm.active{flex:1.7}.realm img{width:100%;height:100%;object-fit:cover;filter:saturate(.7) brightness(.7);transition:transform .5s,filter .4s}.realm:hover img{transform:scale(1.05);filter:saturate(1) brightness(.9)}.realm:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#0c1a24f2,transparent 70%);border:1px solid #d3ba7a30}.realm.active:after{border-color:#d8b67590}.realm>span{position:absolute;left:23px;bottom:28px;z-index:1}.realm small{display:block;font-size:7px;letter-spacing:2px;color:#d8b675;margin-bottom:10px;white-space:nowrap}.realm strong{font-family:Cinzel,Georgia,serif;font-size:22px;font-weight:400}.world-description{font-size:12px;color:#8ca39b;max-width:680px;margin-top:24px;min-height:40px}.beyond{background:#14232a;display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}.beyond-visual{position:relative;border:1px solid #d8b67540;padding:10px;background:#0d191f;transform:rotate(-2deg);box-shadow:0 25px 55px #0004}.beyond-visual img{width:100%;aspect-ratio:1.45;object-fit:cover;object-position:30% center}.image-label{position:absolute;bottom:20px;left:20px;padding:5px 9px;background:#0b1721b3;font-size:7px;letter-spacing:2px;color:#d8b675}.mode{display:flex;gap:22px;margin-top:26px}.mode>span{color:#d8b675;font-family:Georgia,serif;font-size:12px;padding-top:4px}.mode h3{font-size:18px}.mode p{font-size:12px;line-height:1.8;color:#8fa69f;max-width:340px;margin-top:5px}.gallery-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:20px}.gallery-grid button{background:#14242b;padding:0;text-align:left;position:relative;overflow:hidden;border:1px solid #c7b37a20}.gallery-grid button:first-child{grid-row:span 2}.gallery-grid img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/9;transition:transform .4s}.gallery-grid button:first-child img{aspect-ratio:1.3}.gallery-grid button:hover img{transform:scale(1.025)}.gallery-grid span{position:absolute;bottom:0;left:0;right:0;padding:35px 22px 18px;background:linear-gradient(transparent,#0b1926ed);font-size:12px;display:flex;justify-content:space-between}.gallery-grid b{color:#d8b675}.play{text-align:center;background:radial-gradient(ellipse at 50% 50%,#25463e80,transparent 65%),#122229;border-block:1px solid #d8b67520;position:relative;overflow:hidden;padding-block:100px}.play-crest{position:absolute;font:570px Georgia;left:50%;top:50%;transform:translate(-50%,-50%);color:#d8b67506;pointer-events:none}.play h2{font-size:clamp(40px,4.6vw,70px);position:relative}.play .button{margin-top:36px;position:relative}.play>p:last-child{margin-top:16px;font-size:10px;color:#91a49c}.faq{max-width:1000px;margin:auto;padding-inline:40px}.faq details{border-bottom:1px solid #c7b37a25}.faq summary{display:flex;justify-content:space-between;list-style:none;cursor:pointer;padding:24px 0;font-size:14px}.faq summary::-webkit-details-marker{display:none}.faq summary span{color:#d8b675}.faq details[open] summary span{transform:rotate(45deg)}.faq details p{color:#91aaa3;font-size:13px;padding:0 0 24px;max-width:760px}footer{padding:38px 7.5%;border-top:1px solid #c7b37a20;display:flex;align-items:center;justify-content:space-between;gap:25px}footer .brand{font-size:18px}footer .brand-sub{font-size:6px;letter-spacing:3.7px}footer>p{font-size:12px;color:#8ca19b}footer>span{font-size:10px;color:#687e79}dialog{color:#ece5d3;border:1px solid #c9aa66;background:#14262e;padding:46px 42px;max-width:490px;width:calc(100% - 32px);box-shadow:0 30px 120px #0009}dialog::backdrop{background:#06131cd9;backdrop-filter:blur(8px)}dialog h2{font-size:28px;line-height:1.4;margin-bottom:23px}dialog .eyebrow{font-size:8px;letter-spacing:2px}.dialog-close{position:absolute;right:14px;top:9px;font-size:26px;line-height:1;background:none;color:#b8b6a4;padding:5px}.dialog-crest{margin-bottom:25px}.auth-tabs{display:flex;border-bottom:1px solid #c7b37a30;margin-bottom:22px}.auth-tabs button{flex:1;background:none;color:#8da59b;padding:10px;font-size:12px;border-bottom:1px solid transparent}.auth-tabs button.active{border-bottom-color:#d8b675;color:#e7c58a}label{display:block;font-size:11px;color:#adc0b6;margin-top:17px}input{display:block;width:100%;border:1px solid #c4ac7135;background:#0c1b23;color:#f0e6d0;padding:12px 14px;margin-top:7px;font-size:13px;border-radius:0}input:focus{outline:1px solid #d8b675}input::placeholder{color:#6b837b}.form-message{font-size:12px;color:#edaf91;min-height:20px;margin-top:15px}form .button{width:100%;margin-top:8px}#account-summary{font-size:14px;line-height:1.9;color:#a0b4aa;margin-bottom:28px}.logout{display:block;margin:20px auto 0;color:#a6b5ab}#lightbox{max-width:1400px;padding:15px;background:#0a1720}#lightbox img{width:100%;max-height:85svh;object-fit:contain}.toast{position:fixed;z-index:50;bottom:25px;left:50%;transform:translateX(-50%);background:#233e3c;border:1px solid #b7a56e;color:#eee4d0;padding:14px 24px;font-size:13px;max-width:90vw}@media(min-width:1700px){.hero-content{padding-top:240px}.section{padding-inline:max(7.5%,calc((100% - 1450px)/2))}}@media(max-width:1000px){.nav-links{gap:22px}.hero-content{width:90%;padding-top:200px}.intro,.beyond{gap:45px}.realm-stats div{gap:12px;padding-left:20px}.champion-stage{gap:20px}.champion-description h3{font-size:48px}.realm small{font-size:6px;letter-spacing:1px}.realm>span{left:15px}.realm strong{font-size:17px}.section-top{align-items:start}.section-top>p{max-width:240px}.beyond{grid-template-columns:1fr 1fr}.beyond h2{font-size:32px}}@media(max-width:700px){.nav{height:76px;padding-inline:6%;gap:18px}.brand{font-size:19px;letter-spacing:2px}.brand-sub{font-size:6px;letter-spacing:3.7px}.brand img{width:26px}.menu-toggle{display:block;margin-left:auto}.nav-links{display:none;position:absolute;top:76px;left:0;right:0;background:#10232c;padding:25px 6%;border-bottom:1px solid #d8b67540}.nav-links.open{display:flex;flex-direction:column;gap:20px}.account-button{font-size:11px;gap:10px}.hero{min-height:760px;height:95svh}.hero-content{width:100%;padding:180px 7% 120px}.hero h1{font-size:48px;letter-spacing:-2px}.hero-scene{object-position:65%;opacity:.7}.hero-shade{background:linear-gradient(90deg,#0d1b21ee,#0d1b21a8),linear-gradient(0deg,#101b22,transparent 50%)}.eyebrow{font-size:8px;letter-spacing:2px}.hero-description{font-size:14px;max-width:360px}.hero-description br{display:none}.hero-actions{gap:23px;align-items:start;flex-direction:column;margin-top:29px}.button{font-size:12px;padding:15px 21px;min-width:220px}.hero-note{font-size:9px;margin-top:18px;max-width:240px}.hero-bottom{bottom:26px;left:7%;right:7%;font-size:7px;letter-spacing:1px}.hero-bottom>a{max-width:120px;text-align:right}.hero-bottom a span{margin-left:7px}.section{padding:75px 7%}.intro{grid-template-columns:1fr;gap:28px}.intro-copy{padding-top:0;font-size:14px}.realm-stats{grid-template-columns:1fr 1fr;gap:25px 15px;padding:25px 0;margin-top:5px}.realm-stats div{padding-left:0;border:0;gap:16px}.realm-stats strong{font-size:38px;min-width:48px}.realm-stats span{font-size:10px}.section-top{display:block;margin-bottom:30px}.section-top>p{max-width:100%;margin-top:22px;font-size:12px}.champion-tabs{margin-top:25px;gap:15px;overflow-x:auto}.champion-tabs button{flex:0 0 auto;font-size:9px;padding:12px 0}.champion-stage{grid-template-columns:1fr;gap:8px;padding-top:10px}.champion-art{height:370px}.champion-rune{font-size:350px}.champion-description{padding:0 10px 10px}.champion-description h3{font-size:44px}.champion-description>p:not(.eyebrow){font-size:14px}.champion-ability{margin-top:18px;padding:17px 0}.champion-description>.text-link{margin-top:5px}.world-grid{display:grid;grid-template-columns:1fr 1fr;height:auto;gap:10px}.realm{height:215px}.realm:first-child{grid-column:span 2;height:260px}.realm img{object-position:center}.realm strong{font-size:22px}.realm small{font-size:7px;letter-spacing:1.3px}.realm>span{bottom:20px;left:18px}.world-description{font-size:11px;margin-top:18px}.beyond{grid-template-columns:1fr;gap:42px}.beyond h2{font-size:36px}.beyond-visual{margin:0 6px}.mode{margin-top:24px}.mode p{max-width:100%}.gallery-grid{grid-template-columns:1fr;gap:15px}.gallery-grid button:first-child{grid-row:auto}.gallery-grid button:first-child img{aspect-ratio:16/9}.play{padding-block:80px}.play h2{font-size:40px}.play .eyebrow{letter-spacing:1.3px}.faq{padding:65px 7%}.faq summary{font-size:13px;gap:20px}.faq details p{font-size:12px}footer{padding:32px 7%;flex-wrap:wrap;gap:22px}footer>p{display:none}footer>span{font-size:8px}dialog{padding:40px 25px}dialog h2{font-size:25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* Keep the transparent champion within its stage at every intrinsic image size. */
.champion-art{overflow:hidden}.champion-art img{position:absolute;inset:0;margin:auto;width:100%;height:100%;max-height:100%;object-fit:contain}
@media(max-width:700px){.realm strong{font-size:18px}}

/* Reading sizes and an independently constrained FAQ column. */
.nav-links,.account-button,.text-link{font-size:15px}
.eyebrow,.champion-description .eyebrow{font-size:12px;letter-spacing:2px}
.button{font-size:16px}
.hero-description,.intro-copy,.section-top>p,.champion-description>p:not(.eyebrow),.mode p{font-size:16px}
.hero-note{font-size:14px;color:#abc0b7}
.hero-bottom{font-size:12px;letter-spacing:1px}
.brand-sub,footer .brand-sub{font-size:10px;letter-spacing:3px}
.realm-stats span{font-size:14px;max-width:120px}
.champion-tabs button{font-size:14px;padding-right:14px}
.champion-ability small{font-size:12px;letter-spacing:1px}
.champion-ability strong{font-size:20px}
.realm small{font-size:12px;letter-spacing:1px;white-space:normal;max-width:150px}
.realm>span{right:15px}
.world-description{font-size:16px;max-width:850px;min-height:52px}
.image-label{font-size:12px;letter-spacing:1px}
.gallery-grid span{font-size:16px}
.play>p:last-child{font-size:14px;color:#abc0b7}
.faq.section{width:min(100% - 80px,1000px);max-width:1000px;min-width:0;margin-inline:auto;padding:90px 0}
.faq summary{font-size:20px;line-height:1.5;gap:24px;padding:24px 0}
.faq summary span{flex:0 0 auto;margin-left:auto;font-size:24px;line-height:1.25}
.faq details p{font-size:17px;line-height:1.85;color:#abc0b7;max-width:850px}
footer>p,footer>span{font-size:14px;color:#a0b5ad}
.auth-tabs button,label,.form-message,.toast,input{font-size:15px}
dialog .eyebrow{font-size:12px;letter-spacing:1px}
@media(max-width:1000px){
  .realm-stats div{gap:14px;padding-left:12px}
  .realm-stats div:first-child{padding-left:0}
  .champion-tabs{gap:20px;overflow-x:auto}
  .champion-tabs button{flex:0 0 auto;font-size:14px}
  .realm small{font-size:11px}
}
@media(max-width:700px){
  .nav{gap:12px}.brand-sub{font-size:9px;letter-spacing:2.5px}
  .account-button{font-size:14px;white-space:nowrap}.nav-links{font-size:16px}
  .hero{height:auto;min-height:900px}
  .hero-content{padding:155px 7% 150px}
  .hero h1{font-size:46px}
  .eyebrow,.champion-description .eyebrow{font-size:12px;letter-spacing:1.5px}
  .hero-description{font-size:16px;line-height:1.8}
  .hero-actions{gap:24px}.hero-note{font-size:14px;max-width:290px}
  .hero-bottom{font-size:11px;gap:24px}.hero-bottom>a{max-width:145px}
  .realm-stats{gap:24px 18px}.realm-stats div{padding:0;gap:10px}
  .realm-stats span{font-size:14px;max-width:100px}.realm-stats strong{font-size:36px;min-width:44px}
  .intro-copy,.section-top>p,.champion-description>p:not(.eyebrow),.mode p{font-size:16px}
  .champion-tabs{gap:22px}.champion-tabs button{font-size:14px}
  .realm small{font-size:11px}.realm strong{font-size:17px}
  .world-description{font-size:16px}
  .gallery-grid span{font-size:16px}
  .faq.section{width:calc(100% - 48px);padding:65px 0}
  .faq summary{font-size:18px;gap:18px}.faq details p{font-size:16px}
  footer{gap:20px}footer .brand-sub{font-size:9px}footer>span{font-size:13px}
}

.realm-announcement{position:relative;z-index:20;margin-top:90px;padding:18px max(24px,calc((100vw - 1350px)/2));background:#b8904130;color:#ffe0a0;border-bottom:1px solid #a8824344;font:16px/1.6 system-ui,sans-serif}
