/* Vivid Flash-era illustration, dark carved panels, warm brass bevels. */
:root{--panel:#30231c;--race-color:#73b5e7;--display:"STKaiti","KaiTi","Noto Serif CJK SC",serif}
.icon{width:22px;height:22px;flex-shrink:0}
.world-art{background-image:url('./assets/login.png');transition:filter .7s,transform 1s}
.scene-shade{background:linear-gradient(180deg,#14395933,transparent 26%,transparent 70%,#172b32b5),linear-gradient(90deg,transparent 48%,#14262122 78%,#0a233d44)}
.topbar{padding:22px 34px}.edition{color:#fff7dc;font-weight:500}
.screen{padding:94px 6.2vw 78px;position:relative;z-index:1}
.login-composition{min-height:calc(100svh - 172px);display:flex;align-items:center;justify-content:flex-end}
.splash-brand{position:absolute;left:27%;top:11%;width:32%;text-align:center;pointer-events:none;filter:drop-shadow(0 5px 8px #162d4550)}
.game-title{display:inline-block;position:relative;text-align:center}
.title-overline{display:flex;align-items:center;justify-content:center;gap:14px;font-size:13px;letter-spacing:5px;color:#fffbdf;text-shadow:0 2px 3px #195079}
.title-overline span{width:32px;height:1px;background:#ffffd6aa;box-shadow:0 1px 1px #406c95}
.game-title h1{position:relative;margin:12px 0 -6px;font-family:"Microsoft YaHei","PingFang SC",sans-serif;font-size:clamp(66px,6.5vw,106px);font-weight:1000;letter-spacing:-5px;line-height:1.2;white-space:nowrap;transform:skew(-9deg) rotate(-4deg);color:#fff09b;-webkit-text-stroke:2px #33271d;text-shadow:0 2px 0 #6c501b,0 5px 0 #3f2d1c,3px 7px 0 #281d17,-3px -3px 0 #fff7dc,3px -3px 0 #fff7dc,-3px 3px 0 #fff7dc,5px 0 0 #28211c,-5px 0 0 #28211c,0 -5px 0 #28211c,0 9px 0 #28211c}
.game-title h1::after{content:attr(data-text);position:absolute;inset:0;color:transparent;-webkit-text-stroke:0;background:linear-gradient(#fffce0 18%,#fff3a1 45%,#f1bb35 72%,#e29c23);background-clip:text;-webkit-background-clip:text;z-index:1}
.english-title{position:relative;margin:0 -10px 0 25px;font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:clamp(24px,2.2vw,35px);font-style:italic;letter-spacing:-1px;transform:rotate(-4deg);color:#fff0a3;-webkit-text-stroke:.6px #413018;text-shadow:0 2px 0 #2f261b,2px 0 0 #2f261b,-2px 0 0 #2f261b,0 -2px 0 #2f261b,0 4px 0 #ffedb4}
.splash-caption{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:20px;color:#faffdf;text-shadow:0 1px 3px #215277}
.splash-caption p{font-family:var(--display);font-weight:700;font-size:18px;letter-spacing:5px;margin:0}.caption-rule{width:18px;height:1px;background:#f4ecc988}
.frame{position:relative;background:linear-gradient(105deg,#39291ff7,#291e19f5 48%,#39291ff8);border:1px solid #edc276;outline:3px solid #4e351e;box-shadow:inset 0 0 0 4px #5d432b,inset 0 0 0 5px #a17b44,inset 0 0 38px #0005,0 0 0 5px #bea06c,0 16px 48px #182c4d77}
.login-panel{width:420px;flex-shrink:0;padding:25px 30px 18px;border-radius:3px;margin-top:6px}
.frame-corner{position:absolute;width:20px;height:20px;border:2px solid #e1b96d;background:#563c24;transform:rotate(45deg);box-shadow:inset 0 0 0 3px #7b552e,inset 0 0 0 4px #e1b96d;z-index:1}
.frame-corner::after{content:'';position:absolute;inset:6px;background:#f5d47e;box-shadow:0 1px 3px #17110c}
.tl{top:-10px;left:-10px}.tr{top:-10px;right:-10px}.bl{bottom:-10px;left:-10px}.br{bottom:-10px;right:-10px}
.panel-heading{display:flex;align-items:center;justify-content:center;gap:16px;height:35px;color:var(--gold)}
.panel-heading .icon{width:24px;height:24px}.heading-rule{height:1px;width:55px;background:linear-gradient(90deg,transparent,#a88449)}.heading-rule:last-child{transform:rotate(180deg)}
.welcome-kicker{font-family:Georgia,serif;font-size:11px;letter-spacing:4px;line-height:1.4;color:#bc9c65;text-align:center;margin:9px 0 6px}
.login-panel h2{font-family:var(--display);font-weight:700;font-size:28px;letter-spacing:1px;line-height:1.4;text-align:center;margin:0;color:#f5db9f;text-shadow:0 2px 2px #140d09}
.panel-intro{text-align:center;font-size:13px;color:#c4ae8a;margin:7px 0 21px}
.race-fieldset{margin:0;padding:0;border:0;min-width:0}.race-fieldset legend{font-size:14px;color:#ebd8b4;padding:0;display:flex;width:100%;justify-content:space-between;align-items:center;margin-bottom:11px}.race-fieldset legend span{font:9px/1.5 Georgia,serif;letter-spacing:2px;color:#ad936b}
.race-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.race-option{position:relative;display:flex;flex-direction:column;align-items:center;padding:10px 5px 12px;background:linear-gradient(#3d3025,#281e18);border:1px solid #746041;box-shadow:inset 0 0 0 3px #30231a;transition:background .2s,border-color .2s,transform .2s;min-height:115px;color:#bfa984}
.race-option:hover{border-color:#e2bb6a;background:linear-gradient(#58432b,#34271c);transform:translateY(-2px)}
.race-icon{width:42px;height:42px;display:grid;place-items:center;color:#c8b485;background:#271e1acc;border:1px solid #927a4b;border-radius:50%;box-shadow:inset 0 0 0 3px #423120,0 3px 6px #0003;margin-bottom:7px}
.race-icon .icon{width:22px;height:22px}.race-option strong{font-size:15px;line-height:1.5;font-weight:500}.race-english{font:9px/1.5 Georgia,serif;letter-spacing:2px;margin-top:2px;opacity:.65}
.race-option.selected{border:1px solid #f4d382;background:linear-gradient(#604b2d,#40301f);box-shadow:inset 0 0 0 3px #45311e,inset 0 0 0 4px #9b793f,0 0 15px #d6a64b1a;color:#ffedb3}
.race-option.selected .race-icon{color:var(--race-color);border-color:#f0c779;background:#27363b;box-shadow:inset 0 0 0 3px #493a27,0 0 14px #e5b33b14}
.selected-gem{display:none;position:absolute;bottom:-4px;width:7px;height:7px;background:#ffe39a;transform:rotate(45deg);border:1px solid #ffefc0;box-shadow:0 0 9px #ffdb8290}.selected .selected-gem{display:block}
.race-description{position:relative;padding:15px 0 14px;min-height:115px;border-bottom:1px solid #9f7b4438;margin-bottom:17px;text-align:center}
.race-description h3{font-family:var(--display);font-size:17px;color:#e1c790;margin:0 0 5px;letter-spacing:1px}.race-description p{font-size:12px;line-height:1.8;color:#bda585;margin:0}.race-trait{font-size:10px;letter-spacing:3px;color:#a08a64;margin-top:7px}
.field-label{display:flex;align-items:center;justify-content:space-between;font-size:14px;color:#ead6b3;margin-bottom:8px}.field-label span{font-size:11px;color:#ad9672}
.name-field{display:flex;align-items:center;height:46px;background:#211910;box-shadow:inset 0 2px 8px #0006,0 1px 0 #92744955;border:1px solid #877046;transition:border-color .2s}.name-field:focus-within{border-color:#e0bd7a}.input-icon{display:flex;color:#a58b58;margin-left:13px}.input-icon .icon{width:18px;height:18px}
.name-field input{width:100%;min-width:0;height:100%;padding:0 10px;background:none;border:0;color:#fff0c5;font-size:14px;outline:none}.name-field input::placeholder{color:#8f7b60;font-size:13px}.name-field input:focus-visible{outline:none}.name-field:has(input[aria-invalid=true]){border-color:#fb9080}
.random-name{border:0;background:none;color:#c2a76e;padding:6px 12px;display:grid;place-items:center;height:32px;border-left:1px solid #665032}.random-name .icon{width:18px;height:18px;stroke-width:2}.random-name:hover{color:#fff0b2}
.field-error{font-size:12px;line-height:1.5;min-height:19px;color:#ffa591;padding-top:3px}
.remember-control{position:relative;display:flex;align-items:center;gap:8px;font-size:12px;color:#cbb590;cursor:pointer;margin:3px 0 19px;user-select:none}.remember-control input{position:absolute;opacity:0;width:17px;height:17px;left:0;top:0}.checkbox-mark{width:16px;height:16px;display:grid;place-items:center;border:1px solid #ac8a48;background:#201811;box-shadow:inset 0 1px 3px #0009;color:#e7bd66}.checkbox-mark .icon{width:12px;height:12px;stroke-width:3;opacity:0}.remember-control input:checked+.checkbox-mark .icon{opacity:1}.remember-control input:focus-visible+.checkbox-mark{outline:2px solid #fff0b2;outline-offset:3px}.local-label{margin-left:auto;color:#8e7a5c;font-size:11px}
.enter-button{position:relative;isolation:isolate;width:100%;height:60px;display:flex;align-items:center;justify-content:center;gap:16px;color:#fff2c3;font-family:var(--display);font-size:25px;font-weight:700;letter-spacing:4px;border:1px solid #ffe1a0;border-radius:2px;background:linear-gradient(#c48632 0%,#a96621 12%,#b97523 45%,#834112 49%,#a65d1c 95%);box-shadow:inset 0 0 0 3px #6c3a18,inset 0 0 0 4px #e7b65f,0 0 0 2px #241910,0 0 0 3px #977043,0 6px 12px #120b0977;text-shadow:0 2px 2px #4c220a;transition:filter .2s,transform .2s}
.enter-button:hover{filter:brightness(1.19);transform:translateY(-2px);box-shadow:inset 0 0 0 3px #6c3a18,inset 0 0 0 4px #e7b65f,0 0 0 2px #241910,0 0 0 3px #bd9858,0 8px 20px #d69b4322}.enter-button:active{transform:translateY(1px);filter:brightness(.94)}.enter-button>.icon{width:20px;height:20px}.button-ornament{font-size:11px;letter-spacing:0;opacity:.7}
.panel-footer{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:19px;font-size:11px;color:#b89f74}.status-gem{width:5px;height:5px;transform:rotate(45deg);background:#b6c17c;box-shadow:0 0 6px #c8d48755}.server-divider{margin:0 4px;color:#7a684a}
.ambient-particles{pointer-events:none;position:absolute;inset:0;z-index:0;overflow:hidden}.ambient-particles i{position:absolute;bottom:-10px;left:var(--x);width:var(--size);height:var(--size);border-radius:50%;background:#fffbd0;box-shadow:0 0 9px #f1e7ae;opacity:0;animation:drift var(--duration) var(--delay) linear infinite}
@keyframes drift{0%{transform:translate(0,0);opacity:0}20%{opacity:.65}70%{opacity:.35}100%{transform:translate(38px,-65vh);opacity:0}}
@keyframes arrive{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.login-panel{animation:arrive .65s ease-out}.dialog-kicker{font:10px Georgia,serif;letter-spacing:4px;color:#987b42;display:block;margin-bottom:10px}.source-link{padding-top:15px;border-top:1px solid #af8a4966}.detail-pairs{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;padding:18px 0;border-block:1px solid #b49b68}.detail-pairs strong{text-align:right;color:#614425}.detail-pairs span{color:#8c734c}.demo-note{color:#8c734c}.profile-emblem{display:grid;place-items:center;margin:0 auto 20px;width:64px;height:64px;border:3px double #aa834a;border-radius:50%;color:#846035}.profile-emblem .icon{width:32px;height:32px}
.is-loading .world-art{filter:blur(5px) brightness(.45);transform:scale(1.025)}.is-loading .scene-shade{background:#15252e66}.loading-screen{height:calc(100svh - 172px);min-height:550px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;animation:arrive .5s}.game-title.compact h1{font-size:70px}.game-title.compact .title-overline{display:none}.game-title.compact .english-title{font-size:27px}.loading-medallion{width:76px;height:76px;border:3px double #dec388;box-shadow:0 0 0 4px #293137,inset 0 0 20px #ffe89022,0 0 30px #ead08422;border-radius:50%;margin-top:44px;display:grid;place-items:center;background:#293137c9;color:var(--race-color)}.loading-medallion .icon{width:35px;height:35px}.loading-screen h2{font:700 27px var(--display);margin:25px 0 4px;color:#f4e0ac}.loading-screen>p{font-size:13px;color:#dbd2b3;margin:9px 0 24px}.loading-track{width:280px;height:11px;padding:2px;border:1px solid #b39a67;background:#1d201b;box-shadow:0 0 0 3px #172525;overflow:hidden}#load-progress{height:100%;width:0;background:linear-gradient(#ffe9ae,#bc842e);box-shadow:0 0 10px #ddaa56;transition:width .16s}.loading-label{font-size:11px;color:#cfbd92;margin-top:13px}.back-button{border:1px solid #b99a6477;background:#2b271ed9;color:#ead7b4;font-size:13px;padding:9px 15px;display:flex;align-items:center;gap:9px;transition:.2s}.back-button:hover{border-color:#f3d493;background:#50402c}.back-button .icon{width:16px;height:16px}.loading-screen>.back-button{margin-top:34px;background:none;border-color:transparent}
.in-city .world-art{background-image:url('./assets/city.png');filter:none;transform:none;background-position:center}.in-city .scene-shade{background:linear-gradient(180deg,#20351877,transparent 35%,transparent 65%,#12282180)}.in-city .screen{padding:84px 34px 66px}.in-city .edition{font-size:11px}.in-city .topbar{padding:14px 34px}.in-city .utility{height:35px;width:35px}.in-city .footer{background:#192820b0;font-size:11px;padding-block:13px}
.city-screen{min-height:calc(100svh - 150px);animation:arrive .7s}.city-top{display:flex;align-items:center;gap:28px}.lord-badge{display:flex;align-items:center;gap:13px;background:linear-gradient(90deg,#30271bea,#30271b00);padding:8px 45px 8px 8px;min-width:255px}.lord-emblem{width:65px;height:65px;background:#3d4936;border:3px double #ebc579;border-radius:12px 12px 24px 24px;display:grid;place-items:center;box-shadow:0 4px 8px #13221966;color:var(--race-color)}.lord-emblem .icon{width:32px;height:32px}.lord-badge h2{font-family:var(--display);font-size:23px;line-height:1.2;margin:4px 0 2px;letter-spacing:2px;color:#fff0c3}.lord-level{font-size:10px;letter-spacing:1px;color:#d6c295}.lord-badge div>span:last-child{font-size:11px;color:#c7b998}.resource-bar{display:flex;background:#2f271edf;border:3px double #bb9b63;box-shadow:0 3px 9px #0a2a1577;padding:7px 4px}.resource-bar>span{display:flex;align-items:center;gap:10px;padding:0 24px;border-right:1px solid #9d7e4744;min-width:110px}.resource-bar>span:last-child{border:0}.resource-bar .icon{width:20px;height:20px;color:#f1c969}.resource-bar b{font-size:14px;font-weight:500;color:#fff1cf}.city-top>.back-button{margin-left:auto}
.city-location{position:absolute;left:5%;top:225px;color:#fff3ca;text-shadow:0 2px 4px #193212,0 0 20px #163214c0}.city-location>span{font:10px Georgia,serif;letter-spacing:4px}.city-location h2{font:700 35px var(--display);letter-spacing:4px;margin:4px 0}.city-location p{font-size:12px;letter-spacing:5px;margin:0;opacity:.8}
.castle-hotspot{position:absolute;left:48%;top:39%;transform:translate(-50%,-50%);background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:7px;filter:drop-shadow(0 3px 4px #16381966)}.hotspot-icon{width:44px;height:44px;border:3px double #fee7a2;background:#634322e6;border-radius:50%;display:grid;place-items:center;color:#ffe4a0;transition:.2s}.hotspot-label{color:#fff0c2;background:#39281ad9;border:1px solid #e6be72;padding:3px 12px;font-size:12px;box-shadow:0 2px 3px #12281666;white-space:nowrap}.castle-hotspot:hover .hotspot-icon{background:#a56d26;transform:translateY(-4px);box-shadow:0 0 25px #ffe88a99}
.arrival-note{position:absolute;left:50%;bottom:145px;transform:translateX(-50%);width:min(680px,85vw);display:flex;align-items:center;gap:20px;padding:20px 24px;transition:opacity .35s,translate .35s}.arrival-note .welcome-kicker{text-align:left;font-size:9px;letter-spacing:3px;margin:0 0 5px}.arrival-note h3{font:700 24px var(--display);margin:0;color:#f4dcac;letter-spacing:1px}.arrival-note p{font-size:12px;color:#c8b695;margin:7px 0 0}.arrival-seal{width:55px;height:55px;display:grid;place-items:center;color:#d6b170;border:1px solid #b4915855;border-radius:50%;flex-shrink:0}.arrival-seal .icon{width:30px;height:30px}.small-gold-button{margin-left:auto;flex-shrink:0;padding:9px 14px;background:linear-gradient(#a87734,#764519);border:3px double #f6d58f;color:#fff1c0;display:flex;align-items:center;gap:6px;font-size:14px}.small-gold-button:hover{filter:brightness(1.2)}.small-gold-button .icon{width:16px;height:16px}.arrival-note.dismissed{opacity:0;pointer-events:none;translate:0 16px}.city-bottom{position:absolute;bottom:76px;left:34px;right:34px;display:flex;align-items:center;justify-content:space-between}.city-bottom>span{display:flex;align-items:center;gap:9px;font-size:12px;color:#ffe7b3;text-shadow:0 2px 3px #163a13}.city-bottom>span .icon{width:18px;height:18px}.city-icon-button{background:#3b2c1fec;border:3px double #d5af65;color:#f5d897;display:flex;gap:8px;align-items:center;padding:9px 17px;font-size:13px}.city-icon-button:hover{filter:brightness(1.3)}
@media(min-width:1800px){.login-panel{width:460px;padding:30px 36px 22px}.login-panel h2{font-size:31px}.race-option{min-height:125px}.race-description{padding:20px 0}.race-description p{font-size:13px}.panel-intro{font-size:14px}.screen{padding-right:9vw}}
@media(max-height:790px) and (min-width:951px){.game-shell{min-height:730px}.screen{padding-top:76px;padding-bottom:64px}.login-composition{min-height:590px}.login-panel{padding-top:16px;padding-bottom:14px;width:398px}.panel-heading{height:27px}.panel-intro{margin-bottom:17px}.race-option{min-height:105px;padding-top:8px;padding-bottom:10px}.race-icon{width:36px;height:36px;margin-bottom:4px}.race-description{padding:12px 0 10px;min-height:108px;margin-bottom:13px}.remember-control{margin-bottom:16px}.enter-button{height:54px}.welcome-kicker{margin-top:6px}.panel-footer{margin-top:15px}.splash-brand{top:13%;left:26%;width:31%}.game-title h1{font-size:clamp(65px,6.4vw,96px)}}
@media(max-width:1150px) and (min-width:951px){.screen{padding-right:4vw}.splash-brand{left:18%;width:37%}.game-title h1{font-size:75px}.login-panel{width:380px;padding-inline:24px}.city-top{gap:16px}.resource-bar>span{padding-inline:13px;min-width:93px}.lord-badge{min-width:220px;padding-right:24px}}
@media(max-width:950px){.game-shell{height:auto;min-height:100svh;overflow:hidden}.world-art{background-position:28% top;background-size:auto 800px;background-repeat:no-repeat;background-color:#6f992f}.scene-shade{background:linear-gradient(180deg,transparent 0%,#162b2811 26%,#1d302675 58%,#152820e8 100%)}.screen{padding:300px 25px 100px}.login-composition{min-height:0;justify-content:center}.splash-brand{top:99px;left:40%;width:55%;max-width:460px}.game-title h1{font-size:76px;letter-spacing:-4px}.title-overline{font-size:11px;letter-spacing:3px;gap:9px}.title-overline span{width:20px}.english-title{font-size:27px}.splash-caption{margin-top:17px}.splash-caption p{font-size:14px;letter-spacing:3px}.login-panel{width:420px;padding:27px 30px 20px}.topbar{padding:20px 24px}.footer{padding:18px 24px;gap:18px}.footer-right{display:none}.race-description p{font-size:13px}.panel-intro{font-size:14px}.field-label span,.remember-control,.local-label,.panel-footer{font-size:12px}.race-trait{font-size:11px}.in-city{height:100svh;min-height:760px}.in-city .world-art{background-size:cover;background-position:center}.in-city .screen{padding:85px 22px 70px}.city-top{flex-wrap:wrap;gap:12px}.city-top>.back-button{position:absolute;right:24px;top:108px}.lord-badge{min-width:240px}.resource-bar{order:3;margin-top:2px}.resource-bar>span{padding-inline:14px}.city-location{top:260px;left:28px}.city-location h2{font-size:28px}.arrival-note{bottom:152px;padding:20px}.arrival-note h3{font-size:21px}.arrival-note .arrival-seal{display:none}.city-bottom{left:24px;right:24px}.loading-screen{min-height:620px;height:calc(100svh - 160px)}.is-loading .screen{padding-top:80px}.castle-hotspot{top:42%;left:48%}}
@media(max-width:560px){.topbar{padding:17px 18px}.edition{font-size:10px;letter-spacing:1px;gap:8px}.utility{width:35px;height:35px}.utilities{gap:7px}.screen{padding:250px 21px 95px}.world-art{background-size:auto 650px;background-position:31% top}.splash-brand{top:94px;left:38%;width:58%}.game-title h1{font-size:55px;-webkit-text-stroke:1.5px;letter-spacing:-3px}.title-overline{font-size:8px;letter-spacing:2px;gap:5px}.title-overline span{width:12px}.english-title{font-size:21px;margin-left:10px}.splash-caption{margin-top:13px;gap:7px}.splash-caption p{font-size:11px;letter-spacing:2px}.caption-rule{width:12px}.login-panel{width:100%;max-width:420px;padding:21px 24px 19px}.login-panel h2{font-size:26px}.panel-intro{font-size:12px;margin-bottom:19px}.race-options{gap:9px}.race-option{min-height:111px}.race-fieldset legend span{font-size:8px;letter-spacing:1.5px}.race-description{min-height:116px}.race-description h3{font-size:17px}.race-description p{font-size:12px}.race-trait{font-size:10px}.panel-footer{font-size:11px}.field-label span{font-size:11px}.field-label{font-size:13px}.enter-button{font-size:24px;height:58px}.footer{padding:16px 20px;justify-content:space-between;gap:10px}.footer>span{font-size:10px}.text-button{font-size:11px}.arrival-note{flex-direction:column;align-items:flex-start;gap:15px;width:calc(100% - 52px);bottom:155px}.arrival-note .small-gold-button{margin-left:0;width:100%;justify-content:center}.arrival-note h3{font-size:22px}.city-location{top:267px}.city-location>span{font-size:9px}.city-location h2{font-size:25px}.city-top>.back-button{right:21px;top:171px;font-size:12px;padding:8px 10px}.resource-bar{position:relative;top:10px;padding:5px 3px}.resource-bar>span{min-width:auto;padding:0 8px;gap:5px}.resource-bar b{font-size:11px}.resource-bar .icon{width:15px;height:15px}.lord-badge{padding-right:20px}.city-bottom>span{font-size:10px}.city-icon-button{font-size:12px;padding:8px 10px}.castle-hotspot{top:43%;left:49%}.in-city .topbar{padding-inline:20px}.in-city .footer{padding-inline:20px}.parchment-dialog{padding:28px}.parchment-dialog h2{font-size:25px}.parchment-dialog p{font-size:14px}.loading-screen{min-height:570px}.game-title.compact h1{font-size:64px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.ambient-particles{display:none}}