:root{--display:"Microsoft YaHei UI","PingFang SC","Noto Sans SC","Source Han Sans SC",sans-serif}
body{font-family:var(--display);font-weight:400}
.hero h1,.section h2,.class-card h3,.system-detail h3,.system-grid h3,.download-card strong,.faq-list summary{font-family:var(--display);font-style:normal;font-weight:800;letter-spacing:0}
.hero h1{font-weight:900;text-shadow:0 5px 0 rgba(0,0,0,.14),0 18px 46px rgba(0,0,0,.38)}
.hero-title-mark{position:relative;display:inline-block;color:#fff5dd;-webkit-text-stroke:2px #63211e;text-shadow:0 3px 0 #a8412f,0 7px 0 #5b1b1c,0 12px 22px rgba(0,0,0,.42);transform:translateY(-2px) rotate(-1deg);paint-order:stroke fill}
.hero-title-mark:after{content:"";position:absolute;left:5%;right:2%;bottom:3%;height:9%;z-index:-1;background:rgba(71,17,20,.58);filter:blur(5px);transform:skewX(-14deg)}
.ember-field{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;mix-blend-mode:screen}
.ember-field i{position:absolute;left:var(--x);bottom:-12px;width:var(--size);height:var(--size);border-radius:50%;background:#ffbf68;box-shadow:0 0 5px #ff8a32,0 0 14px rgba(238,100,57,.65);opacity:0;animation:ember-rise var(--duration) var(--delay) ease-in infinite}
.ember-field i:nth-child(1){--x:9%;--size:3px;--duration:8s;--delay:-1s}.ember-field i:nth-child(2){--x:16%;--size:2px;--duration:11s;--delay:-6s}.ember-field i:nth-child(3){--x:23%;--size:4px;--duration:9s;--delay:-3s}.ember-field i:nth-child(4){--x:31%;--size:2px;--duration:13s;--delay:-9s}.ember-field i:nth-child(5){--x:38%;--size:3px;--duration:10s;--delay:-4s}.ember-field i:nth-child(6){--x:46%;--size:2px;--duration:12s;--delay:-8s}.ember-field i:nth-child(7){--x:53%;--size:4px;--duration:9s;--delay:-2s}.ember-field i:nth-child(8){--x:60%;--size:2px;--duration:14s;--delay:-11s}.ember-field i:nth-child(9){--x:66%;--size:3px;--duration:10s;--delay:-5s}.ember-field i:nth-child(10){--x:72%;--size:2px;--duration:12s;--delay:-7s}.ember-field i:nth-child(11){--x:78%;--size:4px;--duration:9s;--delay:-1s}.ember-field i:nth-child(12){--x:83%;--size:2px;--duration:13s;--delay:-10s}.ember-field i:nth-child(13){--x:88%;--size:3px;--duration:11s;--delay:-6s}.ember-field i:nth-child(14){--x:93%;--size:2px;--duration:15s;--delay:-12s}.ember-field i:nth-child(15){--x:27%;--size:2px;--duration:16s;--delay:-14s}.ember-field i:nth-child(16){--x:57%;--size:3px;--duration:15s;--delay:-13s}.ember-field i:nth-child(17){--x:74%;--size:2px;--duration:17s;--delay:-15s}.ember-field i:nth-child(18){--x:43%;--size:2px;--duration:14s;--delay:-12s}
@keyframes ember-rise{0%{opacity:0;transform:translate3d(0,18px,0) scale(.35)}12%{opacity:.9}48%{opacity:.7;transform:translate3d(16px,-42vh,0) scale(1)}78%{opacity:.35;transform:translate3d(-12px,-78vh,0) scale(.7)}100%{opacity:0;transform:translate3d(10px,-112vh,0) scale(.25)}}
.ember-field i:nth-child(19){--x:5%;--size:5px;--duration:10s;--delay:-7s}.ember-field i:nth-child(20){--x:12%;--size:2px;--duration:7s;--delay:-4s}.ember-field i:nth-child(21){--x:19%;--size:6px;--duration:12s;--delay:-9s}.ember-field i:nth-child(22){--x:28%;--size:3px;--duration:8s;--delay:-2s}.ember-field i:nth-child(23){--x:35%;--size:2px;--duration:15s;--delay:-12s}.ember-field i:nth-child(24){--x:41%;--size:5px;--duration:11s;--delay:-5s}.ember-field i:nth-child(25){--x:49%;--size:2px;--duration:9s;--delay:-6s}.ember-field i:nth-child(26){--x:55%;--size:6px;--duration:13s;--delay:-10s}.ember-field i:nth-child(27){--x:63%;--size:3px;--duration:7s;--delay:-3s}.ember-field i:nth-child(28){--x:69%;--size:2px;--duration:16s;--delay:-13s}.ember-field i:nth-child(29){--x:76%;--size:5px;--duration:10s;--delay:-8s}.ember-field i:nth-child(30){--x:81%;--size:3px;--duration:12s;--delay:-6s}.ember-field i:nth-child(31){--x:86%;--size:2px;--duration:8s;--delay:-4s}.ember-field i:nth-child(32){--x:91%;--size:6px;--duration:14s;--delay:-11s}.ember-field i:nth-child(33){--x:97%;--size:3px;--duration:9s;--delay:-5s}.ember-field i:nth-child(34){--x:14%;--size:4px;--duration:18s;--delay:-15s}.ember-field i:nth-child(35){--x:52%;--size:5px;--duration:17s;--delay:-14s}.ember-field i:nth-child(36){--x:79%;--size:4px;--duration:19s;--delay:-17s}
.ember-field i:nth-child(4n){border-radius:38% 62% 55% 45%}.ember-field i:nth-child(7n){width:calc(var(--size) * 1.8);height:calc(var(--size) * .55);border-radius:70% 30% 70% 30%;box-shadow:0 0 5px #ff8a32,0 0 18px rgba(238,100,57,.6)}
.hero h1 em,.section h2 em{font-family:var(--display);font-style:normal;font-weight:650;letter-spacing:0}
.section h2{line-height:1.06}
.primary-button{position:relative;isolation:isolate;min-width:250px;height:68px;padding:0 30px 0 20px;gap:15px;background:transparent;box-shadow:0 18px 34px rgba(108,25,17,.28);clip-path:polygon(15px 0,calc(100% - 28px) 0,100% 50%,calc(100% - 28px) 100%,15px 100%,0 calc(100% - 15px),0 15px);overflow:hidden}
.primary-button:before,.primary-button:after{content:"";position:absolute;clip-path:inherit;z-index:-2}
.primary-button:before{inset:0;background:#d7b16c}
.primary-button:after{inset:2px;background:#b93625;z-index:-1;box-shadow:inset 0 0 0 1px rgba(255,236,199,.2),inset 0 -20px 35px rgba(75,8,4,.2)}
.primary-button .flame-mark{position:relative;width:38px;height:38px;flex:0 0 38px;background:url('/assets/icon.png') center/cover no-repeat;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);filter:saturate(.85) brightness(1.1);box-shadow:0 0 18px rgba(255,178,82,.38)}
.primary-button .flame-mark:after{content:"";position:absolute;inset:5px;border:1px solid rgba(255,229,178,.55);clip-path:inherit}
.primary-button span{position:relative;z-index:1;white-space:nowrap}
.primary-button b{position:relative;z-index:1;margin-left:auto;color:#ffe5b2;text-shadow:0 0 12px rgba(255,196,103,.65)}
.primary-button:hover{transform:translateY(-3px);background:transparent;box-shadow:0 22px 42px rgba(111,25,15,.38),0 0 24px rgba(238,100,57,.18)}
.primary-button:hover:after{background:#d1492d}
.primary-button:focus-visible{outline:3px solid #fff;outline-offset:5px}
.header-cta{position:relative;border:0;clip-path:polygon(12px 0,calc(100% - 16px) 0,100% 50%,calc(100% - 16px) 100%,12px 100%,0 calc(100% - 11px),0 11px);background:#a72e23;box-shadow:inset 0 0 0 1px rgba(231,191,116,.8);font-weight:700}
.header-cta:before{content:"ᚠ";color:#e4bd78;font-size:15px}
.header-cta:hover{background:#d04a2f;color:#fff;box-shadow:inset 0 0 0 1px #efd195,0 8px 22px rgba(82,13,10,.3)}
.fire-button{min-width:315px;height:74px}
.download-card>img{width:210px;height:210px;margin:18px auto 22px;padding:0;background:transparent;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(0,0,0,.42))}
.class-card{background-color:#0d1d2c;background-repeat:no-repeat;background-size:cover;background-position:center;isolation:isolate;}
.class-card:after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(5,16,28,.18) 0%,rgba(5,16,28,.5) 46%,rgba(5,16,28,.96) 100%),linear-gradient(90deg,rgba(5,16,28,.78) 0%,rgba(5,16,28,.12) 70%);transition:background .35s,opacity .35s}
.class-card>*{position:relative;z-index:2}
.class-card.class-knight{background-image:url('/assets/hero-3.webp');background-position:center 30%}
.class-card.class-mage{background-image:url('/assets/shot-3.webp');background-position:center 35%}
.class-card.class-ranger{background-image:url('/assets/shot-5.webp');background-position:center 42%}
.class-card.class-seer{background-image:url('/assets/hero-2.webp');background-position:center 40%}
.class-card.class-barbarian{background-image:url('/assets/shot-1.webp');background-position:center 38%}
.class-card.class-dragon{background-image:url('/assets/role.webp');background-position:center 28%}
.class-card:hover:after{background:linear-gradient(180deg,rgba(8,24,39,.08) 0%,rgba(8,24,39,.35) 44%,rgba(5,16,28,.9) 100%),linear-gradient(90deg,rgba(5,16,28,.62) 0%,rgba(5,16,28,.08) 76%)}
.class-card:hover{background-color:#112536;background-size:cover}
@media(max-width:980px){.rune-orbit{right:0}}
@media(max-width:620px){.hero h1{font-size:54px;line-height:1.06}.hero h1 em{font-size:23px;line-height:1.35}.section h2{font-size:40px;line-height:1.12}.primary-button{min-width:0;width:228px;height:62px;padding:0 22px 0 14px;gap:11px}.primary-button .flame-mark{width:32px;height:32px;flex-basis:32px}.fire-button{width:min(100%,310px);height:68px}}
@media(prefers-reduced-motion:reduce){.primary-button{transition:none}}
@media(prefers-reduced-motion:reduce){.ember-field i{animation:none;opacity:.28}}