:root{--blue:#294a68;--deep:#233c57;--gold:#b39964;--cream:#fff8e7;--ink:#554b3a;--serif:"Songti SC","STSong","SimSun",serif;--sans:"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:#eee9da;color:var(--ink);font-family:var(--sans)}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #e9b860;outline-offset:5px}button{color:inherit}.topbar{position:absolute;top:0;left:0;right:0;height:82px;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:0 5%;color:#fff9e8;background:linear-gradient(#1e3f59d9,#31526c7d);border-bottom:1px solid #e2d5a56b;box-shadow:0 2px 15px #16344915;gap:30px}.brand{text-align:center;flex-shrink:0}.brand strong{font:700 29px var(--serif);letter-spacing:3px;text-shadow:0 2px 2px #142c46}.brand small{display:block;font:8px Georgia;letter-spacing:3px;margin-top:4px}.topbar nav{display:flex;gap:52px;font-size:14px;letter-spacing:2px}.topbar nav a{padding:30px 0;transition:color .2s;text-shadow:0 2px 3px #193b52}.topbar nav a:hover{color:#f7d193}.nav-register{border:1px solid #e1ca91;background:#14365040;color:#fff2cc;padding:11px 22px;font-size:12px;box-shadow:inset 0 0 0 3px #17354b40}.world-hero{height:100svh;min-height:850px;max-height:1250px;position:relative;isolation:isolate;background:#83bfde url('./image/prontera-world.jpg') center 55%/cover no-repeat;overflow:hidden}.world-hero:after{content:"";position:absolute;z-index:-1;inset:60% 0 0;background:linear-gradient(transparent,#17374930 60%,#122b3f99)}.hero-haze{position:absolute;z-index:-1;inset:10% 29% 24% 0;background:radial-gradient(ellipse,#f5fbfba6,transparent 67%)}.hero-title{position:absolute;top:19%;left:8%;width:600px;text-align:center;color:#244c71;text-shadow:0 2px 10px #ffffffae}.hero-kicker{margin:0 0 22px;letter-spacing:6px;font-size:13px;font-weight:600}.logo-flourish{position:absolute;top:11px;left:50%;transform:translateX(-50%);font-size:110px;opacity:.18;color:white;z-index:-1}.hero-title h1{font:900 clamp(75px,8.5vw,132px)/1.05 var(--serif);letter-spacing:-7px;margin:0;color:#fdf8e9;-webkit-text-stroke:1px #365c81;text-shadow:0 3px 0 #416687,0 6px 0 #244464,0 8px 1px #c5b489,0 10px 25px #21496377;transform:skew(-5deg)}.logo-en{font:700 23px/1 Georgia;letter-spacing:8px;margin:23px 0 0;color:#274d70;text-shadow:0 1px 3px white}.logo-en span{font-size:11px;letter-spacing:4px}.title-rule{height:1px;width:230px;background:linear-gradient(90deg,transparent,#5f7890,transparent);margin:28px auto 22px}.hero-title h2{font:700 34px var(--serif);letter-spacing:5px;margin:0 0 16px;color:#234564;text-shadow:0 1px 7px #fff}.hero-description{font-size:13px;line-height:2;letter-spacing:2px;margin:0 0 27px;font-weight:500;color:#264968;text-shadow:0 0 8px #fff,0 0 12px #fff}.hero-buttons{display:flex;justify-content:center;gap:16px}.game-button{position:relative;min-width:196px;min-height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #fff1b9;color:#fff6dc;background:linear-gradient(#6194b8,#315c85 52%,#284c72);box-shadow:0 0 0 2px #496280,0 0 0 3px #d1bd85,inset 0 0 0 4px #f6e8b421,0 7px 15px #12304933;text-shadow:0 2px 2px #203751;transition:filter .2s,transform .2s}.game-button:before,.game-button:after{content:"✦";position:absolute;top:25px;color:#ead5a0;font-size:12px}.game-button:before{left:12px}.game-button:after{right:12px}.game-button strong{font:700 23px var(--serif);letter-spacing:5px}.game-button small{font:8px Georgia;letter-spacing:2px;margin-top:7px}.game-button.light{background:linear-gradient(#fff8df,#e9d8af);color:#6c5838;text-shadow:0 1px #fff;border-color:#fff9de;box-shadow:0 0 0 2px #b09b70,0 0 0 3px #fff0c9,inset 0 0 0 4px #b49a6430,0 7px 15px #12304933}.game-button.light:before,.game-button.light:after{color:#a68a4f}.game-button:hover{filter:brightness(1.1);transform:translateY(-2px)}.hero-caption{font-size:10px;letter-spacing:2px;margin-top:22px;color:#24425d;text-shadow:0 0 6px white,0 0 12px white}.hero-caption span{font-size:9px;padding:0 8px}.world-coordinate{position:absolute;right:5%;bottom:200px;text-align:right;color:white;text-shadow:0 2px 7px #132d40}.world-coordinate span{font-size:10px;letter-spacing:4px}.world-coordinate strong{display:block;font:italic 30px Georgia;letter-spacing:3px;margin:9px 0}.world-coordinate small{font-size:10px;letter-spacing:2px}.scene-bottom{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);width:min(920px,88%);min-height:102px;display:grid;grid-template-columns:repeat(3,1fr);background:linear-gradient(90deg,#173f61e8,#32546cd9,#173f61e8);border:1px solid #dbc997;outline:1px solid #dbc99777;outline-offset:5px;box-shadow:0 10px 30px #16324666,inset 0 0 0 5px #f7eccc0e;color:#fff4d6}.scene-bottom a{display:flex;align-items:center;justify-content:center;gap:20px;position:relative;padding:16px}.scene-bottom a+a:before{content:"";position:absolute;left:0;height:50%;width:1px;background:#cebb8659}.scene-bottom strong{font:600 20px var(--serif);letter-spacing:3px}.scene-bottom small{display:block;font-size:9px;margin-top:8px;letter-spacing:1px;color:#c4d7e1}.scene-bottom img{width:50px;height:50px;object-fit:contain}.menu-symbol{font:45px Georgia;color:#e0c997}.motes{pointer-events:none;position:absolute;inset:0;z-index:3}.motes i{position:absolute;width:5px;height:5px;background:#fff4a5;border-radius:50%;box-shadow:0 0 13px #fffbc1;animation:drift 8s ease-in-out infinite;left:22%;top:60%}.motes i:nth-child(2){left:80%;top:32%;animation-delay:-2s}.motes i:nth-child(3){left:63%;top:75%;animation-delay:-5s}.motes i:nth-child(4){left:15%;top:82%;animation-delay:-3s}.motes i:nth-child(5){left:90%;top:61%;animation-delay:-6s}@keyframes drift{50%{transform:translate(15px,-35px);opacity:.2}}.jobs-section{padding:90px 6% 100px;background:radial-gradient(ellipse at 50% 30%,#fffcf2,#ece5d4);position:relative;border-top:5px solid #b2a278}.section-heading{text-align:center;margin:0 auto 43px}.section-heading>p{font:10px Georgia;letter-spacing:4px;color:#9d8459;margin:0 0 14px}.section-heading h2{font:600 38px var(--serif);letter-spacing:3px;color:#405e70;margin:0 0 18px}.section-heading>span{font-size:12px;color:#8b887b;letter-spacing:1px}.job-book{max-width:1120px;margin:auto;background:linear-gradient(90deg,#ece2c7 0,#fff9e9 5%,#f9f3e3 48%,#e5d9bd 49.8%,#fbf5e5 50.3%,#fff9eb 95%,#eee4ce);border:1px solid #c4ae7e;box-shadow:0 5px 0 #d9c9a8,0 6px 0 #bba577,0 18px 40px #5d563222;padding:19px 28px 26px;position:relative;outline:1px solid #d2c1a0;outline-offset:7px}.book-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #cdbc986b;padding:1px 0 17px;color:#9c885f;font:8px Georgia;letter-spacing:2px}.book-heading strong{font:12px var(--serif);letter-spacing:3px}.classes-layout{display:grid;grid-template-columns:165px 1fr 310px;gap:25px;min-height:510px;align-items:center}.class-tabs{display:flex;flex-direction:column;gap:10px}.class-tab{display:flex;align-items:center;gap:14px;border:1px solid #cdbd99;background:#efe5cf80;height:69px;position:relative;padding:0 10px;font:16px var(--serif);letter-spacing:2px}.class-tab img{height:56px;width:40px;object-fit:cover;object-position:top;mask-image:linear-gradient(#000 60%,transparent)}.class-tab[aria-selected=true]{background:linear-gradient(90deg,#345879,#668298);border-color:#bba372;color:#fff5dc;box-shadow:inset 0 0 0 3px #e1d1a640}.class-portrait{height:485px;position:relative;display:grid;place-items:center}.class-portrait>img{height:442px;position:relative;filter:drop-shadow(0 15px 11px #4d56422b)}.magic-circle{position:absolute;width:310px;height:310px;border:1px solid #bca7756b;border-radius:50%;box-shadow:0 0 0 9px #bca7750d,0 0 0 10px #bca7754d}.magic-circle:before{content:"✧";display:grid;place-items:center;font:290px Georgia;color:#bfa67029;position:absolute;inset:0}.portrait-label{position:absolute;bottom:6px;font:9px Georgia;letter-spacing:4px;color:#b09c78}.class-info{padding:18px 10px}.job-note{font:12px var(--serif);letter-spacing:2px;color:#a59476;margin:0 0 21px}.class-en{font:italic 26px Georgia;color:#ba9f6d}.class-info h3{font:600 48px var(--serif);letter-spacing:5px;color:#405d70;margin:8px 0 15px}.small-rule{height:1px;width:80px;background:#baa47a;margin-bottom:23px}.class-info #classDescription{font-size:12px;line-height:2.1;color:#89806b}.class-tags{display:flex;gap:10px;margin:22px 0 28px}.class-tags span{padding:6px 11px;border:1px solid #c8b797;color:#8e7955;font-size:10px}.book-button{display:inline-block;padding:12px 27px;background:#405f78;color:#fff1ce;border:1px solid #a28c62;box-shadow:inset 0 0 0 3px #d9c69b38;font-size:12px;letter-spacing:2px}.bestiary{padding:85px 5% 80px;background:linear-gradient(#dce8e9e8,#e8eeeee8),url('./image/prontera-world.jpg') center/cover;border-top:1px solid #c7d6d4}.collection-toolbar{display:flex;justify-content:space-between;max-width:1240px;margin:0 auto 28px;border-bottom:1px solid #91a5aa59;padding-bottom:14px;color:#6f8994;font-size:10px;letter-spacing:2px}.monster-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:19px;max-width:1240px;margin:auto;align-items:start}.monster-card{margin:0;padding:7px 7px 0;background:#f8f1e1;border:1px solid #a89d80;box-shadow:0 7px 16px #293f4c26;transition:transform .25s}.monster-card:nth-child(even){margin-top:26px}.monster-card:hover{transform:translateY(-10px) rotate(-2deg)}.card-art{border:1px solid #b5a27c;overflow:hidden}.card-art img{width:100%;aspect-ratio:680/906;object-fit:cover}.monster-card figcaption{padding:14px 3px 12px;text-align:center}.monster-card figcaption small{display:block;font:8px Georgia;color:#a28b62;margin-bottom:6px;letter-spacing:2px}.monster-card figcaption strong{font:10px Georgia;letter-spacing:1px;color:#4c6270}.monster-card figcaption span{display:block;margin-top:9px;font-size:10px;color:#ac9362}.collection-note{text-align:center;font:13px var(--serif);letter-spacing:3px;color:#83969a;margin:42px 0 0}.dispatch{position:relative;overflow:hidden;min-height:560px;display:flex;align-items:center;justify-content:center;gap:80px;background:linear-gradient(90deg,#244d75de,#365f7cbb),url('./image/prontera-world.jpg') center 64%/cover;color:#fff5db;padding:65px 8%;border-block:4px double #b6a075}.dispatch-content{position:relative;z-index:1;max-width:560px}.dispatch-content>p{font:9px Georgia;letter-spacing:4px;color:#d2c398}.dispatch-content h2{font:500 47px/1.5 var(--serif);letter-spacing:5px;margin:17px 0}.dispatch-description{font-size:12px;line-height:2.1;color:#c7d8e3;letter-spacing:1px}.dispatch .hero-buttons{justify-content:start;margin-top:29px}.dispatch-character{height:460px;width:auto;filter:drop-shadow(0 10px 15px #19385450)}.site-footer{background:#1f3549;color:#9eb0bc;display:flex;justify-content:space-between;align-items:center;padding:30px 6%;gap:25px;font-size:10px}.footer-brand{font:600 25px var(--serif);color:#daceaa;letter-spacing:3px}.footer-brand small{display:block;font:8px Georgia;letter-spacing:2px;margin-top:6px}.footer-copy{line-height:1.9;font-size:9px}.footer-copy p{margin:0}.site-footer>a{color:#ddd0ac;letter-spacing:2px}.guild-overlay{display:none;position:fixed;inset:0;z-index:100;background:#102942b8;backdrop-filter:blur(6px);padding:20px;place-items:center}.guild-overlay.is-open{display:grid}.modal-open{overflow:hidden}.guild-passport{position:relative;max-height:calc(100dvh - 40px);overflow:auto;width:min(510px,100%);padding:38px 45px;background:linear-gradient(#fffaeb,#eee1c7);border:4px double #b69c67;outline:1px solid #f9edcf;box-shadow:0 25px 100px #102a4680}.guild-scene{height:95px;position:relative;border-bottom:1px solid #c4b18a;margin:-38px -45px 25px;padding:24px 35px;background:linear-gradient(90deg,#355f7ee6,#547a9480),url('./image/prontera-world.jpg') center 35%/cover}.guild-character{position:absolute;right:35px;bottom:0;height:105px;width:auto}.guild-seal{font:10px/1.7 Georgia;color:#f6eacb;letter-spacing:2px;max-width:180px}.guild-close{position:absolute;right:10px;top:9px;z-index:2;font-size:26px;line-height:30px;width:32px;height:32px;border:1px solid #bcab86;background:#faf0d8;color:#6d5d40}.guild-kicker{font:9px Georgia;letter-spacing:2px;color:#a58b5c}.guild-title{font:600 30px var(--serif);color:#345572;margin:13px 0}.guild-desc,.form-help,.modal-login-note{font-size:11px;color:#978970;line-height:1.8}.form-field{margin-top:17px}.form-field label{font-size:11px;display:block;margin-bottom:8px}.form-field input{height:46px;background:#fffbee;border:1px solid #c5b18b;box-shadow:inset 0 2px 4px #a08b6020;padding:0 13px;width:100%;font-size:12px;border-radius:0;color:#3b5266}.form-status{font-size:11px;color:#b04b45;min-height:18px}.form-status.success{color:#397754}.submit-button{width:100%;border:1px solid #ac9364;background:linear-gradient(#587d9b,#345775);color:#fff2cd;padding:15px;box-shadow:inset 0 0 0 3px #cbb88544;letter-spacing:2px}.submit-button:disabled{opacity:.6}.modal-login-note{text-align:center}
@media(min-width:1700px){.hero-title{left:14%;top:22%}.world-hero{background-position:center 65%}}@media(max-width:1100px){.topbar nav{gap:28px}.hero-title{left:4%;width:560px}.hero-title h1{font-size:105px}.classes-layout{grid-template-columns:140px 1fr 250px;gap:10px}.magic-circle{width:240px;height:240px}.class-info h3{font-size:40px}.monster-grid{gap:12px}.monster-card figcaption strong{font-size:9px}.dispatch{gap:40px}.dispatch-character{height:410px}}@media(max-width:760px){html{scroll-padding-top:20px}.topbar{height:68px;padding:0 5%;gap:15px}.brand strong{font-size:24px}.brand small{font-size:7px}.topbar nav{display:none}.nav-register{padding:10px 17px;font-size:11px}.world-hero{height:950px;min-height:0;max-height:none;background-position:57% center}.hero-haze{inset:8% 0 36%;background:radial-gradient(ellipse,#effaffbf,transparent 75%)}.hero-title{top:135px;left:5%;width:90%}.hero-kicker{font-size:10px;letter-spacing:3px;margin-bottom:27px}.hero-title h1{font-size:clamp(64px,17vw,108px);letter-spacing:-3px}.logo-en{font-size:16px;letter-spacing:5px;margin-top:16px}.logo-en span{font-size:8px;letter-spacing:2px}.hero-title h2{font-size:26px;letter-spacing:3px}.hero-description{font-size:11px;letter-spacing:1px}.title-rule{margin:23px auto 19px}.hero-buttons{gap:13px}.game-button{min-width:0;width:160px;min-height:65px}.game-button strong{font-size:20px;letter-spacing:3px}.game-button small{font-size:7px}.game-button:before,.game-button:after{font-size:8px;top:25px}.game-button:before{left:7px}.game-button:after{right:7px}.hero-caption{font-size:9px;letter-spacing:0}.world-coordinate{right:7%;bottom:225px}.world-coordinate strong{font-size:25px}.scene-bottom{width:86%;bottom:25px;grid-template-columns:1fr;min-height:0}.scene-bottom a{padding:12px 20px;justify-content:start;gap:17px}.scene-bottom strong{font-size:16px;letter-spacing:2px}.scene-bottom small{display:inline;margin-left:14px;font-size:8px;letter-spacing:0}.scene-bottom a+a:before{height:1px;width:86%;left:7%;top:0}.scene-bottom img{height:32px;width:32px}.menu-symbol{font-size:29px;width:32px;text-align:center}.jobs-section{padding:58px 6% 65px}.section-heading{margin-bottom:32px}.section-heading h2{font-size:27px;letter-spacing:1px;line-height:1.6}.section-heading>p{font-size:8px;letter-spacing:2px}.section-heading>span{font-size:11px;line-height:1.9;display:block}.job-book{padding:15px;background:linear-gradient(100deg,#f0e5ce,#fff9e9 20%,#f7efd9)}.book-heading{padding-bottom:13px}.book-heading strong{font-size:10px;letter-spacing:1px}.book-heading>span:first-child{display:none}.classes-layout{display:flex;flex-direction:column;gap:0}.class-tabs{flex-direction:row;width:100%;justify-content:space-between;gap:5px;margin-top:18px}.class-tab{height:70px;flex:1;min-width:0;padding:3px;flex-direction:column;gap:0;font-size:11px;letter-spacing:0}.class-tab img{height:43px;width:30px}.class-portrait{height:365px;width:100%}.class-portrait>img{height:340px}.class-info{padding:23px 12px;width:100%;border-top:1px solid #c7b994}.job-note{display:none}.class-en{font-size:22px}.class-info h3{font-size:35px}.small-rule{margin-bottom:16px}.class-info #classDescription{font-size:12px}.class-tags{margin:16px 0 22px}.book-button{width:100%;text-align:center}.bestiary{padding:55px 6%}.monster-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 10px}.monster-card{padding:4px 4px 0}.monster-card:nth-child(even){margin-top:0}.monster-card figcaption{padding:10px 0 7px}.monster-card figcaption strong{font-size:8px;letter-spacing:0}.monster-card figcaption span{margin-top:6px}.collection-toolbar{font-size:8px;letter-spacing:1px}.collection-note{font-size:11px;letter-spacing:1px;margin-top:30px}.dispatch{min-height:530px;padding:45px 7%;display:block}.dispatch-character{position:absolute;right:-40px;height:380px;bottom:-60px;opacity:.38}.dispatch-content h2{font-size:35px;letter-spacing:3px}.dispatch-content>p{font-size:8px;letter-spacing:2px}.dispatch-description{max-width:250px;font-size:11px}.dispatch .hero-buttons{margin-top:30px}.site-footer{display:block;text-align:center;padding:30px 6%}.footer-copy{margin:18px 0}.guild-passport{padding:30px 24px}.guild-scene{margin:-30px -24px 25px;padding:23px}.guild-title{font-size:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}