@charset "UTF-8";
:root{--ink:#183d3c;--dark:#103635;--muted:#59706a;--cream:#fbf7ec;--gold:#c18b3e;--line:#d8c8a5;--serif:Georgia,"Noto Serif TC","Songti TC",serif;--sans:-apple-system,BlinkMacSystemFont,"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif;color:var(--ink);background:var(--cream);font-family:var(--sans);font-synthesis:none;scroll-behavior:smooth;scroll-padding-top:90px}
*{box-sizing:border-box}body{margin:0}img{max-width:100%;height:auto;display:block}a{color:inherit}button{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible,video:focus-visible{outline:3px solid #1d827f;outline-offset:5px}p{line-height:1.85}h1,h2,h3,p{margin-top:0}h1,h2{font-family:var(--serif);font-weight:700;letter-spacing:.025em;line-height:1.22}h2{font-size:clamp(32px,4vw,54px);margin-bottom:25px}h3{line-height:1.4}figure{margin:0}[hidden]{display:none!important}.wrap{width:min(1180px,calc(100% - 80px));margin-inline:auto}.eyebrow{font-size:11px;letter-spacing:.22em;font-weight:700;color:#7b5e35;margin-bottom:22px}.skip{position:fixed;top:-100px;left:20px;background:white;padding:16px;z-index:50}.skip:focus{top:10px}.site-header{height:88px;background:rgba(251,247,236,.97);border-bottom:1px solid var(--line);position:relative;z-index:10}.header-inner{height:100%;display:flex;align-items:center;gap:32px}.wordmark{text-decoration:none;display:flex;align-items:center;gap:10px;font-family:var(--serif);font-size:23px;letter-spacing:.14em;font-weight:700}.wordmark img{width:43px;height:43px;border-radius:12px}.nav{display:flex;gap:27px;margin-left:auto}.nav a{font-size:13px;text-decoration:none;white-space:nowrap}.nav a:hover,.language:hover{text-decoration:underline;text-underline-offset:6px}.language{font-size:12px;white-space:nowrap;text-decoration:none;border-left:1px solid var(--line);padding-left:23px}.header-cta{padding:11px 19px;background:var(--ink);color:var(--cream);font-size:12px;text-decoration:none;border:1px solid var(--ink);border-radius:5px;white-space:nowrap}.hero{position:relative;min-height:710px;display:flex;align-items:center;overflow:hidden;background:#d7e4d4}.hero-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 44%;filter:saturate(.88)}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(253,249,234,.96),rgba(250,247,232,.9) 29%,rgba(245,242,222,.15) 68%),linear-gradient(0deg,rgba(251,247,236,.68),transparent 24%);pointer-events:none}.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1.1fr;align-items:center;gap:0;min-height:710px}.hero-copy{padding:55px 0 65px;position:relative;z-index:2}.hero-copy .eyebrow{margin-bottom:20px}.hero-logo{width:235px;max-height:140px;object-fit:contain;object-position:left;margin-bottom:22px}.hero h1{font-size:clamp(38px,4.2vw,60px);line-height:1.25;letter-spacing:.02em;margin-bottom:22px}.hero .intro{font-size:16px;color:#435c50;margin-bottom:29px}.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:50px;padding:14px 25px;border:1px solid var(--ink);background:var(--ink);color:white;border-radius:6px;text-decoration:none;font-size:14px;font-weight:600;line-height:1.35;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-2px);box-shadow:0 5px 20px #123c3020}.button.secondary{background:#fffaf0c9;color:var(--ink);border-color:#a69778}.play-icon{border:1px solid currentColor;border-radius:50%;width:23px;height:23px;display:grid;place-items:center;font-size:10px;padding-left:2px}.availability{font-size:11px;color:#4c6256;letter-spacing:.12em;margin:19px 0 0}.party{height:600px;position:relative;align-self:end;isolation:isolate;margin:0 -80px 0 -40px;pointer-events:none}.party:before{content:"";position:absolute;width:83%;height:130px;left:5%;bottom:40px;border-radius:50%;background:#364a2838;filter:blur(24px);transform:rotate(-4deg)}.party img{position:absolute;filter:drop-shadow(0 12px 9px #254b2730);width:66%;height:auto}.party .p-mage{width:55%;top:6%;left:7%;z-index:1;transform:rotate(-7deg)}.party .p-archer{width:55%;top:9%;right:-1%;z-index:2;transform:rotate(6deg)}.party .p-priest{width:62%;right:-2%;bottom:4%;z-index:3;transform:rotate(4deg)}.party .p-warrior{width:75%;left:-8%;bottom:-1%;z-index:4;transform:rotate(-4deg)}.hero-stamp{position:absolute;right:5%;top:6%;border:1px solid #8c7756;border-radius:50%;width:88px;height:88px;display:grid;place-content:center;text-align:center;background:#f8f2dfe0;color:#695634;font-family:var(--serif);font-size:13px;line-height:1.5;letter-spacing:.1em;transform:rotate(9deg);z-index:5}.facts{display:grid;grid-template-columns:repeat(3,1fr);padding:27px 0;border-bottom:1px solid var(--line);gap:20px}.fact{display:flex;justify-content:center;align-items:center;gap:18px;border-right:1px solid var(--line)}.fact:last-child{border:0}.fact b{font:38px var(--serif);color:#906d36;letter-spacing:-.04em}.fact span{font-size:13px;color:#4f665e}.adventure{padding:100px 0 105px;display:grid;grid-template-columns:1.1fr .9fr;gap:90px;align-items:center}.body-copy{font-size:16px;color:var(--muted);max-width:520px}.pillars{margin-top:34px}.pillar{border-top:1px solid var(--line);padding:22px 0 0;margin-top:20px}.pillar h3{font-size:18px;margin-bottom:8px}.pillar p{font-size:14px;color:var(--muted);max-width:440px;margin-bottom:0}.pillar h3:before{content:"✦";color:var(--gold);font-size:15px;margin-right:12px}.film{position:relative;text-align:center;padding:24px}.film:before{content:"";position:absolute;inset:5% -8% 8%;border:1px solid var(--line);border-radius:50%;transform:rotate(-14deg);pointer-events:none}.film video{position:relative;width:260px;max-width:100%;aspect-ratio:886/1920;border:6px solid #244844;border-radius:28px;background:#153c3c;box-shadow:16px 20px 0 #d9c89e5e,0 25px 60px #163e3a1f;display:block;margin:auto;object-fit:cover}.film figcaption{font-size:11px;color:var(--muted);margin-top:28px;letter-spacing:.06em;position:relative}.film .video-link{display:inline-block;margin-top:10px;font-size:11px;color:#58756b;position:relative}.classes-section{background:var(--dark);color:var(--cream);padding:90px 0 70px;position:relative;overflow:hidden}.classes-section:before{content:"✧";position:absolute;right:2%;top:8%;font-size:460px;color:#b3d3bb0a;pointer-events:none}.classes-section .eyebrow{color:#e0be82}.classes-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:start}.class-intro{padding-top:26px}.class-intro>p:not(.eyebrow){color:#ccdbce;max-width:350px;font-size:15px}.class-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;max-width:355px;margin-top:36px}.class-tab{display:flex;align-items:center;gap:12px;min-height:73px;text-align:left;border:1px solid #b3c7b54d;border-radius:5px;background:#193e3b;color:#e4eadb;padding:8px 12px;cursor:pointer;font-weight:500;font-size:15px}.class-tab img{width:48px;height:52px;object-fit:contain}.class-tab[aria-selected=true],.class-tab:hover{background:#f0dfb8;border-color:#f0dfb8;color:#1f4540}.class-panel{text-align:center;position:relative}.class-portrait{height:380px;width:100%;object-fit:contain;filter:drop-shadow(0 16px 18px #0004);position:relative;z-index:1}.class-art{position:relative}.class-art:before{content:"";position:absolute;width:320px;max-width:90%;height:320px;left:50%;top:35px;transform:translateX(-50%);border:1px solid #b9c9aa38;border-radius:50%;background:radial-gradient(circle,#cfddb314,transparent 70%)}.class-tag{font-size:10px;letter-spacing:.14em;color:#ddbd83;margin:22px 0 8px}.class-panel h3{font:28px var(--serif);margin-bottom:15px}.class-panel>p:last-child{color:#bcd2c3;font-size:14px;max-width:450px;margin-inline:auto;min-height:75px}.world-section{padding:115px 0 105px;display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.world-art{position:relative}.world-art img{width:100%;max-height:630px;object-fit:cover;border-radius:48% 48% 4px 4px;border:7px solid #efe4c9;box-shadow:0 0 0 1px #cfb987,13px 15px 0 #e8dfca55}.world-art:after{content:"✦";position:absolute;color:#c49140;font-size:55px;right:-22px;bottom:-20px;text-shadow:2px 3px #fbf7ec}.world-copy h3{font:23px var(--serif);margin:34px 0 12px}.world-copy p:not(.eyebrow){color:var(--muted);font-size:15px}.elements{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}.element{display:flex;align-items:center;gap:8px;border:1px solid #d5cbb5;border-radius:30px;padding:9px 13px;font-size:11px}.element:before{content:"";width:8px;height:8px;border-radius:50%;background:#c55c42}.element:nth-child(2):before{background:#3d93b3}.element:nth-child(3):before{background:#739867}.element:nth-child(4):before{background:#ac8448}.element:nth-child(5):before{background:#d3b652}.element:nth-child(6):before{background:#9673ad}.life-section{padding:85px 0;background:#eee8d9;border-top:1px solid #e5d9bc}.section-heading{text-align:center;margin-bottom:48px}.screens{display:grid;grid-template-columns:repeat(3,1fr);gap:46px;width:min(980px,100%);margin:auto}.screenshot{border:1px solid #bda87d;padding:8px;border-radius:22px;background:#fff8e8;max-width:270px;margin:auto}.screenshot img{border-radius:15px;aspect-ratio:640/1391;width:100%}.screens figcaption{margin:24px 0 0}.screens h3{font-size:17px;margin-bottom:9px}.screens p{color:var(--muted);font-size:13px}.gallery-note{font-size:11px!important;color:#626d61;text-align:center;margin:24px auto 0;max-width:800px;line-height:1.8}.pet-strip{display:flex;align-items:center;justify-content:center;gap:24px;max-width:760px;margin:65px auto 0;border-top:1px solid #cfc3a6;padding-top:30px}.pet-strip img{width:145px;height:145px;object-fit:contain;flex:none;filter:drop-shadow(0 7px 10px #244b3420)}.pet-strip h3{font:24px var(--serif);margin-bottom:10px}.pet-strip p{font-size:14px;color:var(--muted);margin-bottom:0}.faq-section{padding:100px 0;width:min(850px,calc(100% - 80px));margin:auto}.faq-section h2{font-size:clamp(29px,3.6vw,41px);margin-bottom:35px}.faq-section details{border-top:1px solid var(--line)}.faq-section details:last-of-type{border-bottom:1px solid var(--line)}.faq-section summary{cursor:pointer;padding:22px 38px 22px 0;position:relative;font-size:16px;font-weight:500;list-style:none;line-height:1.6}.faq-section summary::-webkit-details-marker{display:none}.faq-section summary:after{content:"+";position:absolute;right:7px;top:19px;color:#8a7046;font:25px var(--serif)}.faq-section details[open] summary:after{content:"−"}.faq-section details p{margin:0 35px 22px 0;color:var(--muted);font-size:14px;line-height:1.9}.download-section{position:relative;background:var(--dark);color:var(--cream);text-align:center;overflow:hidden;padding:78px 24px 80px}.download-section:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,#38726855,transparent 68%);pointer-events:none}.download-inner{position:relative;max-width:760px;margin:auto}.download-section .eyebrow{color:#e1c591}.download-section h2{font-size:clamp(35px,4vw,53px)}.download-section .status{color:#c5d9ce;max-width:530px;margin:0 auto 28px;font-size:14px}.download-section .actions{justify-content:center}.store-button{background:#f0dfb8;color:var(--ink);border:1px solid #f0dfb8;min-height:56px;padding-inline:25px;cursor:pointer}.store-button[disabled]{background:#244d47;color:#d3e0d4;border:1px solid #a6bda27a;cursor:default;box-shadow:none;transform:none}.download-section .button.secondary{border:1px solid #f0dfb8;background:#f0dfb8;color:var(--ink)}.requirements{margin:22px 0 0;font-size:11px;letter-spacing:.035em;color:#a8c2b3}.footer{padding:37px 0 28px;background:#f8f3e7}.footer-top{display:flex;justify-content:space-between;align-items:center;gap:30px}.footer .wordmark{font-size:19px}.footer-links{display:flex;flex-wrap:wrap;gap:24px;font-size:12px}.footer-links a{text-decoration:none;line-height:2}.footer-links a:hover{text-decoration:underline}.footer-bottom{display:flex;justify-content:space-between;gap:25px;border-top:1px solid var(--line);margin-top:25px;padding-top:22px;color:#677269;font-size:10px;line-height:1.9}.footer-bottom p{margin:0}.back-top{text-decoration:none;white-space:nowrap}.en h1{font-size:clamp(41px,4.5vw,64px);letter-spacing:-.035em}.en h2{letter-spacing:-.025em}.en .wordmark{font-size:21px}.en .hero-copy .intro{font-size:15px}.en .nav{gap:21px}.en .fact span{font-size:12px;max-width:150px}.en .class-panel h3{font-size:25px}
@media(min-width:1600px){.hero-inner{min-height:780px}.party{height:650px}}
@media(max-width:1100px){.wrap{width:calc(100% - 56px)}.header-inner{gap:22px}.nav{gap:18px}.header-cta{display:none}.hero-inner{grid-template-columns:1fr 1fr;min-height:640px}.hero{min-height:640px}.hero h1{font-size:45px}.hero .intro{font-size:14px}.party{height:515px;margin:0 -60px 15px -60px}.hero-stamp{display:none}.hero-logo{width:210px}.adventure{gap:50px}.world-section{gap:60px}.screens{gap:30px}.classes-layout{gap:30px}.en .hero h1{font-size:48px}}
@media(max-width:780px){.site-header{height:74px}.nav{display:none}.header-inner{gap:20px}.language{margin-left:auto}.header-cta{display:block}.wrap{width:calc(100% - 44px)}.hero{min-height:auto}.hero-inner{min-height:auto;display:flex;flex-direction:column}.hero:after{background:linear-gradient(180deg,#fff9e7f5 0%,#fff9e7d9 42%,#fff9e71a 79%,#fbf7ec88)}.hero-backdrop{object-position:50% 56%}.hero-copy{text-align:center;padding:36px 0 0;width:100%}.hero-logo{margin:0 auto 18px;width:195px;height:120px;object-position:center}.hero h1,.en .hero h1{font-size:47px;line-height:1.18;margin-bottom:20px}.hero-copy .eyebrow{font-size:9px;letter-spacing:.2em;margin-bottom:18px}.hero .intro,.en .hero-copy .intro{font-size:14px;line-height:1.8;margin-bottom:24px}.hero .actions{justify-content:center}.hero .availability{margin-top:15px}.party{height:390px;width:540px;max-width:112%;margin:-4px -6% -10px;align-self:center}.party .p-mage{width:51%;left:9%;top:0}.party .p-archer{width:51%;right:2%;top:2%}.party .p-priest{width:55%;right:3%;bottom:1%}.party .p-warrior{width:67%;left:0%;bottom:-3%}.facts{padding:24px 0;gap:5px}.fact{display:block;text-align:center;padding-inline:5px}.fact b{display:block;font-size:30px;margin-bottom:8px}.fact span,.en .fact span{font-size:10px;line-height:1.5;display:block}.adventure{padding:65px 0;gap:45px}.adventure h2{font-size:34px}.body-copy{font-size:14px}.pillar h3{font-size:15px}.pillar p{font-size:12px}.film{padding:10px}.film video{width:225px;border-width:5px;border-radius:24px}.film:before{inset:10% -4% 12%}.classes-section{padding:60px 0 45px}.classes-layout{grid-template-columns:1fr 1fr;gap:20px}.class-intro{padding-top:15px}.class-intro h2{font-size:32px}.class-intro>p:not(.eyebrow){font-size:13px}.class-tabs{gap:9px;grid-template-columns:1fr;margin-top:25px;max-width:200px}.class-tab{min-height:56px;padding:5px 12px}.class-tab img{width:35px;height:40px}.class-portrait{height:330px}.class-art:before{width:240px;height:240px}.class-panel h3,.en .class-panel h3{font-size:22px}.class-panel>p:last-child{font-size:13px}.world-section{gap:40px;padding:70px 0}.world-section h2{font-size:34px}.world-copy p:not(.eyebrow){font-size:13px}.world-copy h3{font-size:21px}.elements{gap:6px}.element{font-size:10px;padding:7px 9px}.life-section{padding:60px 0}.screens{gap:21px}.screens h3{font-size:14px}.screens p{font-size:12px}.screenshot{padding:5px;border-radius:16px}.screenshot img{border-radius:11px}.pet-strip{margin-top:40px}.faq-section{width:calc(100% - 56px);padding:70px 0}.footer-top{align-items:flex-start}.footer-links{gap:10px 18px;max-width:290px}.footer-bottom{font-size:9px}.en .header-cta{font-size:11px}}
@media(max-width:540px){.wrap{width:calc(100% - 40px)}.site-header{height:66px}.wordmark,.en .wordmark{font-size:17px;letter-spacing:.12em}.wordmark img{width:32px;height:32px;border-radius:9px}.header-inner{gap:12px}.language{font-size:11px;border:0;padding-left:0}.header-cta{display:none}.hero h1,.en .hero h1{font-size:39px}.hero-logo{width:174px;height:108px}.hero-copy{padding-top:28px}.hero-copy .eyebrow{font-size:8px;letter-spacing:.18em}.hero .intro,.en .hero-copy .intro{font-size:13px}.hero .intro br{display:none}.button{padding:13px 16px;font-size:12px;min-height:46px}.hero .actions{gap:10px}.hero .availability{font-size:9px}.party{height:315px;max-width:116%;width:430px;margin:-1px -8% -10px}.facts{padding:22px 0}.fact b{font-size:27px}.fact span,.en .fact span{font-size:9px}.adventure{display:flex;flex-direction:column;gap:32px;padding:58px 0}.eyebrow{font-size:9px;margin-bottom:18px}.adventure h2,.world-section h2{font-size:36px}.body-copy{font-size:14px}.pillar h3{font-size:16px}.pillar p{font-size:13px}.film{width:100%;padding:15px}.film video{width:232px}.film:before{inset:10% 4% 12%}.film figcaption{font-size:10px}.classes-layout{display:block}.class-intro{padding-top:0}.class-intro h2{font-size:36px}.class-intro>p:not(.eyebrow){max-width:100%;font-size:14px}.class-tabs{grid-template-columns:repeat(4,minmax(0,1fr));max-width:none;margin-top:24px;gap:7px}.class-tab{flex-direction:column;gap:4px;padding:7px 2px 10px;text-align:center;font-size:12px}.en .class-tab{font-size:11px}.class-tab img{width:45px;height:48px}.class-portrait{height:315px;margin-top:22px}.class-art:before{top:40px;width:260px;height:260px}.class-tag{margin-top:14px;font-size:9px}.class-panel h3,.en .class-panel h3{font-size:23px}.class-panel>p:last-child{max-width:315px;min-height:0;font-size:13px}.world-section{display:flex;flex-direction:column-reverse;gap:36px;padding:60px 0}.world-art{width:85%;max-width:340px}.world-art img{max-height:460px;object-fit:cover}.world-copy p:not(.eyebrow){font-size:14px}.world-copy h3{font-size:23px}.elements{gap:8px}.element{font-size:11px;padding:8px 10px}.section-heading{margin-bottom:30px}.section-heading h2{font-size:33px}.screens{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:23px;padding:0 5px 12px;overscroll-behavior-x:contain}.screens figure{width:76%;flex-shrink:0;scroll-snap-align:center}.screens .screenshot{max-width:210px;padding:6px;border-radius:20px}.screenshot img{border-radius:14px}.screens h3{font-size:16px}.screens p{font-size:13px}.gallery-note{font-size:10px!important;margin-top:16px}.pet-strip{gap:10px;align-items:flex-start}.pet-strip img{width:88px;height:105px}.pet-strip h3{font-size:21px}.pet-strip p{font-size:12px}.faq-section{width:calc(100% - 40px);padding:60px 0}.faq-section h2{font-size:28px}.faq-section summary{font-size:14px;padding-block:20px}.faq-section details p{font-size:13px;margin-right:15px}.download-section{padding:58px 24px}.download-section h2{font-size:37px}.download-section .status{font-size:13px}.download-section .actions{flex-direction:column}.download-section .button{width:270px;max-width:100%;min-height:52px;font-size:14px}.requirements{font-size:9px;line-height:1.8}.footer{padding:28px 0 24px}.footer-top{flex-direction:column;gap:22px}.footer .wordmark{font-size:18px}.footer-links{max-width:none;gap:15px;font-size:11px}.footer-bottom{display:block;line-height:1.8;font-size:9px}.back-top{display:inline-block;margin-top:15px}.en .hero h1{font-size:42px}.en .hero .intro{max-width:340px;margin-inline:auto}}
@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto}.button{transition:none}.button:hover{transform:none}}
/* Stagger the party in two clear rows so rear heroes' faces remain visible. */
@media(min-width:1101px){.party{height:670px}.party .p-mage{top:0}.party .p-archer{top:3%}}
@media(min-width:781px) and (max-width:1100px){.party{height:595px}.party .p-mage{top:0}.party .p-archer{top:3%}}
@media(min-width:541px) and (max-width:780px){.party{height:450px}}
@media(max-width:540px){.party{height:385px}}
/* Override the video's intrinsic HTML height when its responsive width changes. */
.film video{height:auto}
/* Keep the rotated decorative orbit inside the available column. */
.film:before{inset:12% 16% 14%}
@media(min-width:781px){.party .p-mage{top:-7%}.party .p-archer{top:-4%}}
