:root{--bg: #0d1117;--panel: rgba(14, 18, 26, .86);--panel-solid: #121823;--line: rgba(224, 164, 58, .35);--gold: #e0a43a;--gold-hi: #ffd27a;--text: #e8e6e1;--muted: #9aa3ad;--hp: #d9483b;--mp: #3b82d9;--sp: #3fae5a;--exp: #e0a43a;--danger: #e5534b;--radius: 10px;--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px);--safe-r: env(safe-area-inset-right, 0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:Kanit,system-ui,sans-serif;font-size:15px;user-select:none;-webkit-user-select:none;touch-action:none}canvas#c{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;outline:none;display:block}#ui{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;zoom:var(--ui-zoom, 1)}#ui>.world-ui,#ui>.weather-veil{zoom:var(--ui-unzoom, 1)}#ui>*{pointer-events:auto}button,input{font:inherit;color:inherit}input{user-select:text;-webkit-user-select:text}.btn{background:linear-gradient(#2a3242,#1a202b);border:1px solid var(--line);border-radius:8px;padding:9px 18px;cursor:pointer;transition:border-color .15s,transform .05s;white-space:nowrap}.btn:hover{border-color:var(--gold)}.btn:active{transform:translateY(1px)}.btn.gold{background:linear-gradient(#f0b85a,#b97d1f);color:#1a1205;border-color:var(--gold-hi);font-weight:600}.btn.danger{border-color:#e5534b80;color:#ffb3ad}.btn:disabled{opacity:.45;cursor:default}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.title{font-weight:600;color:var(--gold-hi);letter-spacing:.5px}.muted{color:var(--muted);font-size:13px}.field{width:100%;background:#0b0f15;border:1px solid #2c3442;border-radius:8px;padding:10px 12px;outline:none}.field:focus{border-color:var(--gold)}.login{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 30%,#0d111733,#0d1117d9)}.login .box{width:min(360px,calc(100vw - 32px));padding:26px 24px;display:grid;gap:14px;text-align:center}.logo{font-size:44px;font-weight:600;color:var(--gold);text-shadow:0 0 24px rgba(224,164,58,.5);letter-spacing:3px;line-height:1}.logo small{display:block;font-size:13px;color:var(--muted);letter-spacing:1px;margin-top:6px}.select-bar{position:absolute;left:50%;bottom:calc(18px + var(--safe-b));transform:translate(-50%);display:flex;gap:10px;padding:10px;flex-wrap:wrap;justify-content:center;max-width:calc(100vw - 24px)}.select-head{position:absolute;top:14px;left:50%;transform:translate(-50%);text-align:center;padding:8px 20px}.slot-label{position:absolute;transform:translate(-50%);text-align:center;padding:6px 12px;pointer-events:auto;cursor:pointer;min-width:110px}.slot-label.sel{border-color:var(--gold-hi);box-shadow:0 0 16px #e0a43a59}.create-left,.create-right{position:absolute;top:14px;width:290px;max-height:calc(100vh - 120px);overflow:auto;padding:14px;display:grid;gap:12px}.create-left{left:calc(14px + var(--safe-l))}.create-right{right:calc(14px + var(--safe-r))}.step h4{margin:0 0 8px;font-weight:600;color:var(--gold-hi);font-size:14px}.choices{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:6px}.choice{border:1px solid #2c3442;background:#0f141c;border-radius:8px;padding:8px 6px;text-align:center;cursor:pointer;font-size:13px;line-height:1.25}.choice.on{border-color:var(--gold);background:#231c0f;color:var(--gold-hi)}.choice .dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-bottom:4px}.desc{font-size:13px;color:var(--muted);min-height:36px}.stepper{display:flex;align-items:center;justify-content:space-between;gap:8px}.stepper .btn{padding:6px 12px}.swatches{display:flex;gap:8px;flex-wrap:wrap}.swatch{width:28px;height:28px;border-radius:50%;border:2px solid transparent;cursor:pointer}.swatch.on{border-color:var(--gold-hi);box-shadow:0 0 0 2px #000 inset}.create-bottom{position:absolute;left:50%;bottom:calc(14px + var(--safe-b));transform:translate(-50%);display:flex;gap:8px;padding:10px;width:min(520px,calc(100vw - 24px))}.create-bottom .field{flex:1}.stats-preview{display:grid;grid-template-columns:1fr auto;gap:2px 10px;font-size:13px}.stats-preview span:nth-child(2n){color:var(--gold-hi);text-align:right}.hud-me{position:absolute;top:10px;left:calc(10px + var(--safe-l));width:250px;padding:8px 10px;display:grid;gap:4px}.hud-me .name{display:flex;justify-content:space-between;font-size:14px}.bar{position:relative;height:14px;background:#06080c;border-radius:4px;overflow:hidden;border:1px solid #1f2632}.bar>i{position:absolute;top:0;right:0;bottom:0;left:0;width:0;transition:width .15s}.bar>span{position:absolute;top:0;right:0;bottom:0;left:0;font-size:10px;line-height:13px;text-align:center;text-shadow:0 1px 2px #000}.bar.hp>i{background:linear-gradient(#ee6a5e,#b0332a)}.bar.mp>i{background:linear-gradient(#5c9ff0,#2a63ad)}.bar.sp>i{background:linear-gradient(#5ccf77,#2b8443)}.buffs{display:flex;gap:4px;flex-wrap:wrap}.buff{font-size:10px;padding:1px 6px;border-radius:6px;background:#1d2a1d;border:1px solid #3fae5a55}.hud-target{position:absolute;top:10px;left:50%;transform:translate(-50%);width:min(300px,46vw);padding:6px 10px;display:none;gap:4px;text-align:center}.hud-target.on{display:grid}.hud-target .bar{height:12px}.hud-exp{position:absolute;left:0;right:0;bottom:0;height:6px;background:#06080c}.hud-exp>i{display:block;height:100%;width:0;background:linear-gradient(90deg,#b97d1f,#ffd27a);transition:width .3s}.hud-exp>span{position:absolute;right:8px;bottom:8px;font-size:11px;color:var(--muted)}.hud-menu{position:absolute;top:10px;right:calc(10px + var(--safe-r));display:flex;gap:6px}.hud-menu .btn{padding:6px 10px;font-size:13px;position:relative}.badge{position:absolute;top:-6px;right:-6px;background:var(--danger);color:#fff;border-radius:10px;font-size:10px;padding:0 5px;line-height:16px}.skillbar{position:absolute;right:calc(10px + var(--safe-r));bottom:calc(16px + var(--safe-b));display:grid;grid-template-columns:repeat(5,54px);gap:6px;align-items:end}.slot{position:relative;width:54px;height:54px;border-radius:10px;border:1px solid var(--line);background:#0d121a;cursor:pointer;overflow:hidden;display:grid;place-items:center;font-size:10px;text-align:center;line-height:1.1;padding:3px}.slot.empty{opacity:.45}.slot .key{position:absolute;top:2px;left:4px;font-size:10px;color:var(--muted)}.slot .cd{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000a6;display:grid;place-items:center;font-size:15px;font-weight:600;color:#fff}.slot .ic{width:26px;height:26px;border-radius:6px;margin-bottom:2px;display:grid;place-items:center;font-size:14px;font-weight:600;color:#0d121a}.ic{position:relative;overflow:hidden}.ic img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.slot .ic{width:32px;height:32px}.slot.atk{width:74px;height:74px;border-radius:50%;grid-column:5;grid-row:1 / span 2;background:radial-gradient(#3b2a12,#1b140a);border-color:var(--gold);font-size:13px}.slot.picking{outline:2px dashed var(--gold-hi)}.joy{position:absolute;left:calc(18px + var(--safe-l));bottom:calc(24px + var(--safe-b));width:130px;height:130px;border-radius:50%;background:#ffffff0f;border:1px solid rgba(255,255,255,.15);display:none;touch-action:none}.joy i{position:absolute;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:#e0a43a8c}body.touch .joy{display:block}.win{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 20px));max-height:calc(100vh - 40px);overflow:auto;padding:14px 16px;display:none}.win.on{display:block}.win-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.win-head .btn{padding:2px 10px}.stat-row{display:grid;grid-template-columns:60px 1fr auto auto;gap:8px;align-items:center;padding:4px 0;border-bottom:1px solid #1d2430}.stat-row .btn{padding:2px 10px}.derived{display:grid;grid-template-columns:1fr auto 1fr auto;gap:4px 12px;font-size:13px;margin-top:10px}.derived b{color:var(--gold-hi);font-weight:400;text-align:right}.hint{font-size:12px;color:var(--muted);margin-top:8px;line-height:1.5}.sk-list{display:grid;gap:6px}.sk{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:6px;border-radius:8px;border:1px solid #1f2632;cursor:pointer}.sk.locked{opacity:.45;cursor:default}.sk .ic{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;font-weight:600;color:#0d121a}.sk small{color:var(--muted);display:block;font-size:11px}.dead{position:absolute;top:0;right:0;bottom:0;left:0;display:none;place-items:center;background:#28000073}.dead.on{display:grid}.dead .panel{padding:22px 28px;text-align:center;display:grid;gap:12px}.toast{position:absolute;top:70px;left:50%;transform:translate(-50%);display:grid;gap:4px;pointer-events:none}.toast div{background:#000000a6;padding:4px 12px;border-radius:6px;font-size:13px;animation:fade 2.4s forwards;text-align:center}.toast div.big{font-size:22px;color:var(--gold-hi);background:none;text-shadow:0 0 12px rgba(224,164,58,.7)}@keyframes fade{0%,75%{opacity:1}to{opacity:0}}.chat{position:absolute;left:calc(10px + var(--safe-l));bottom:calc(20px + var(--safe-b));width:min(340px,40vw);display:grid;gap:4px}.chat-log{max-height:120px;overflow:auto;font-size:12px;text-shadow:0 1px 2px #000;display:grid;gap:2px}.chat-log b{color:var(--gold-hi);font-weight:400}.chat input{display:none}.chat.typing input{display:block}body.touch .chat{bottom:calc(170px + var(--safe-b))}.loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:var(--bg);font-size:18px;color:var(--gold)}@media(max-width:760px),(max-height:500px){body{font-size:13px}.hud-me{width:190px;padding:6px 8px}.create-left,.create-right{width:calc(50vw - 12px);top:50px;padding:8px;gap:6px;max-height:44vh;font-size:12px}.create-left{left:6px}.create-right{right:6px}.choices{grid-template-columns:repeat(2,1fr)}.choice{padding:6px 4px;font-size:12px}.desc{display:none}.skillbar{grid-template-columns:repeat(5,48px);gap:5px}.slot{width:48px;height:48px;font-size:9px}.slot.atk{width:66px;height:66px}.hud-menu .btn{padding:5px 8px;font-size:12px}}@media(max-height:420px){.create-left,.create-right{top:8px;max-height:calc(100vh - 76px)}.create-bottom{bottom:6px;padding:6px}}.world-ui{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none!important;overflow:hidden;contain:strict}.world-ui *{pointer-events:none}.plate{position:absolute;left:0;top:0;display:grid;justify-items:center;gap:2px;will-change:transform;font-size:12px;white-space:nowrap;text-shadow:0 0 3px #000,0 1px 2px #000}.pbar{width:64px;height:5px;background:#0009;border-radius:2px;overflow:hidden}.pbar i{display:block;height:100%;width:100%;background:#3fae5a}.pbar.m i{background:#d9483b}.float{position:absolute;transform:translate(-50%,-50%);font-weight:600;white-space:nowrap;will-change:transform,opacity;text-shadow:0 0 4px #000,0 2px 2px #000;animation:rise 1s ease-out forwards}@keyframes rise{0%{transform:translate(-50%,-50%) scale(1.25);opacity:1}15%{transform:translate(-50%,-60%) scale(1)}70%{opacity:1}to{transform:translate(-50%,-220%);opacity:0}}.portal-label{font-size:14px;font-weight:600}.zone-name{position:absolute;top:112px;left:calc(14px + var(--safe-l));font-size:12px;color:var(--muted);text-shadow:0 1px 2px #000;pointer-events:none}@media(max-width:760px),(max-height:500px){.zone-name{top:96px}}.tabs{display:flex;gap:6px;margin-bottom:8px;flex-wrap:wrap}.tab{padding:5px 12px;font-size:13px}.tab.on{border-color:var(--gold);color:var(--gold-hi);background:#231c0f}.sk{grid-template-columns:34px 1fr auto}.sk-btns{display:flex;gap:4px;flex-direction:column}.sk-btns .btn{padding:4px 10px;font-size:12px}.sk.locked-soft{opacity:.78}.req-ok{color:#8fd19e!important}.req-bad{color:#e9a19b!important}.potbar{position:absolute;right:calc(10px + var(--safe-r));bottom:calc(146px + var(--safe-b));display:flex;gap:6px}.pot{position:relative;width:52px;height:40px;border-radius:10px;border:1px solid var(--line);background:#0d121a;display:grid;place-items:center;font-size:11px;line-height:1;cursor:pointer;padding-top:4px}.pot b{font-size:12px;font-weight:600}.pot .key{position:absolute;top:2px;left:4px;font-size:9px;color:var(--muted)}.pot.hp{box-shadow:inset 0 -3px #d9483b}.pot.mp{box-shadow:inset 0 -3px #3b82d9}.pot.sp{box-shadow:inset 0 -3px #3fae5a}.auto-row{display:grid;grid-template-columns:1fr 120px 44px;gap:8px;align-items:center;margin-top:10px;font-size:13px}.auto-row input[type=checkbox]{justify-self:start;width:18px;height:18px}.auto-badge{position:absolute;top:56px;right:calc(10px + var(--safe-r));background:#3a2a0c;border:1px solid var(--gold);color:var(--gold-hi);font-size:12px;padding:3px 10px;border-radius:10px;display:none;animation:pulse 1.2s infinite;pointer-events:none}.auto-badge.on{display:block}@keyframes pulse{50%{opacity:.55}}.party{position:absolute;top:132px;left:calc(10px + var(--safe-l));width:190px;padding:6px 8px;display:grid;gap:6px}.party-head{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--gold-hi)}.pm{display:grid;gap:2px}.pm-name{font-size:12px;display:flex;justify-content:space-between;align-items:center;gap:4px}.bar.thin{height:5px}.btn.mini{padding:1px 7px;font-size:11px;border-radius:6px}.hud-target .btn.mini{justify-self:center;margin-top:2px}.invite{position:absolute;top:120px;left:50%;transform:translate(-50%);padding:12px 16px;display:grid;gap:8px;text-align:center;z-index:5}.invite .sk-btns{flex-direction:row;justify-content:center}@media(max-width:760px),(max-height:500px){.potbar{bottom:calc(126px + var(--safe-b))}.party{top:112px;width:160px}}.minimap{position:absolute;top:52px;right:calc(10px + var(--safe-r));width:198px;padding:4px;cursor:pointer}.minimap canvas{display:block;width:190px;height:190px;border-radius:6px}.mm-z{font-size:11px;text-align:center;color:var(--muted);margin-top:2px}.auto-badge{top:232px!important}.worldmap{width:min(1100px,calc(100vw - 16px),calc(100vh - 20px))}.worldmap canvas{width:min(100%,calc(100vh - 118px));touch-action:none;height:auto;aspect-ratio:1;border-radius:8px;cursor:crosshair;display:block;margin:0 auto}@media(max-width:760px),(max-height:500px){.minimap{width:110px;top:44px}.minimap canvas{width:102px;height:102px}.auto-badge{top:176px!important}}.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#05070b;display:flex;flex-direction:column;transition:opacity .35s}.loading-screen.out{opacity:0;pointer-events:none}.loading-screen .ls-img{flex:1;background:center / cover no-repeat}.loading-screen .ls-bottom{padding:14px 18px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(transparent,#05070b 40%);margin-top:-90px;position:relative}.loading-screen .ls-title{color:var(--gold-hi, #ffd27a);font-weight:600;font-size:15px;margin-bottom:8px;text-shadow:0 1px 3px #000}.loading-screen .ls-bar{height:8px;border-radius:4px;background:#ffffff1f;overflow:hidden}.loading-screen .ls-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#e0a43a,#ffd27a);transition:width .2s}.loading-screen .ls-tip{color:#c9d1db;font-size:12px;margin-top:8px;text-shadow:0 1px 2px #000}.perf-btn{min-width:0}.power-badge{position:absolute;left:50%;top:56px;transform:translate(-50%);font-size:11px;color:#9fd7a8;background:#00000073;padding:3px 10px;border-radius:10px;pointer-events:none}@media(max-width:560px)and (orientation:portrait){.hud-menu{top:200px;flex-direction:column;align-items:stretch;gap:4px}.hud-menu .btn{padding:5px 7px;font-size:11px}}#wInv{width:min(520px,calc(100vw - 20px))}.inv-top{display:flex;gap:12px;align-items:flex-start;margin-bottom:8px}.doll{display:flex;gap:6px}.dcol{display:grid;gap:4px}.dslot{width:44px;height:44px;border-radius:8px;border:1px solid #2a3340;background:#0d121a;display:grid;place-items:center;cursor:pointer;font-size:10px;color:var(--muted);text-align:center}.dslot.empty{border-style:dashed}.dslot.sel,.cell.sel{outline:2px solid var(--gold-hi)}.inv-sum{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;font-size:13px;flex:1}.inv-sum b{color:var(--gold-hi);font-weight:500}.bag-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:4px}.cell{aspect-ratio:1;border-radius:7px;border:1px solid #1f2632;background:#0d121a;display:grid;place-items:center;cursor:pointer}.cell.empty{cursor:default;opacity:.5}.iic{position:relative;width:36px;height:36px;border-radius:6px;overflow:hidden;background:#141a24}.iic img{width:100%;height:100%;object-fit:cover;display:block}.iic b{position:absolute;right:2px;bottom:0;font-size:11px;text-shadow:0 0 3px #000,0 0 3px #000}.stacks{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.stack{display:flex;align-items:center;gap:4px;padding:3px 6px;border-radius:8px;border:1px solid #1f2632;cursor:pointer;font-size:12px}.stack .ic,.stack .iic{width:26px;height:26px;font-size:10px;border-radius:6px;display:grid;place-items:center;font-weight:600;color:#0d121a}.idetail{border:1px solid #2a3340;border-radius:10px;padding:8px 10px;margin:6px 0 8px;background:#ffffff05}.ihead{display:flex;gap:8px;align-items:center}.ihead .iic{width:44px;height:44px}.iname{font-weight:600;font-size:14px}.istats{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px;font-size:12px;margin:6px 0}.istats b{color:#fff;font-weight:500}.istats i.up{color:#5ccf77;font-style:normal}.istats i.down{color:#ff6b5b;font-style:normal}.ibtns{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.shop-row{margin-bottom:8px}@media(max-width:560px){.bag-grid{grid-template-columns:repeat(6,1fr)}.inv-top{flex-direction:column}.iic{width:32px;height:32px}}.chat-tabs{display:none;gap:2px;font-size:11px}.chat.typing .chat-tabs{display:flex;flex-wrap:wrap}.chat-tabs span{padding:2px 7px;border-radius:6px;background:#00000073;color:var(--muted);cursor:pointer}.chat-tabs span.on{color:#fff;background:#e0a43a59}.chat-in{display:none;gap:4px}.chat.typing .chat-in{display:flex}.chat.typing .chat-in input{display:block;flex:1;min-width:0}.chat-in input.to{flex:0 0 76px}.chat-in select.chan{font:inherit;font-size:12px;background:#0d121a;color:#fff;border:1px solid var(--line);border-radius:8px;padding:4px 6px}.chat-log .c-near b{color:#9fd7a8}.chat-log .c-party b{color:#7fb3ff}.chat-log .c-whisper b{color:#e39bff}.chat-log .c-system,.chat-log .c-system b{color:#ffd27a}.adm{color:#ff5a4a;font-style:normal;font-weight:700;font-size:.85em;letter-spacing:.5px}.plate .adm{display:block;font-size:10px}:root{--panel: rgba(10, 13, 20, .88);--line: rgba(224, 164, 58, .45)}.panel{box-shadow:0 10px 30px #00000073,inset 0 1px #ffffff0f,inset 0 0 0 1px #00000080;background:linear-gradient(160deg,#161b26eb,#080a0feb);border-color:var(--line)}.btn{background:linear-gradient(#2e3748,#171c26);box-shadow:inset 0 1px #ffffff12,0 2px 6px #0006;transition:border-color .15s,box-shadow .15s,transform .05s}.btn:hover{border-color:var(--gold-hi);box-shadow:0 0 12px #e0a43a59,inset 0 1px #ffffff14}.btn.gold{background:linear-gradient(#ffd27a,#c88a24 60%,#a86f12);text-shadow:0 1px 0 rgba(255,255,255,.35);box-shadow:0 0 14px #ffd27a59,inset 0 1px #fff6}.title{text-shadow:0 0 10px rgba(224,164,58,.35)}.bar{height:15px;border-radius:7px;border:1px solid #2a3140;background:linear-gradient(#05070a,#0e131b);box-shadow:inset 0 2px 4px #000000b3}.bar>i{border-radius:6px;box-shadow:inset 0 -5px 8px #00000040,inset 0 2px #ffffff59}.bar.hp>i{background:linear-gradient(#ff8a7d,#d9483b 55%,#8e2219)}.bar.mp>i{background:linear-gradient(#7fb6ff,#3b82d9 55%,#1f4f91)}.bar.sp>i{background:linear-gradient(#7fe59a,#3fae5a 55%,#1f6f35)}.bar>span{font-size:10px;letter-spacing:.3px;font-weight:600}.hud-me{border-left:3px solid var(--gold);padding-left:12px}.hud-me .name{font-weight:600;letter-spacing:.3px}.hud-target{border-top:2px solid #ff5a4a}.hud-exp{height:7px;background:linear-gradient(#05070a,#10151d);border-top:1px solid #1a212c}.hud-exp>i{background:linear-gradient(90deg,#8a5a12,#ffd27a 70%,#fff1c2);box-shadow:0 0 10px #ffd27a99}.slot{border-radius:9px;border:1px solid #3a4151;background:radial-gradient(circle at 50% 30%,#1a2030,#0a0d13 75%);box-shadow:inset 0 0 0 1px #0009,0 3px 8px #00000080;font-size:10px}.slot:not(.empty):not(.atk){border-color:#e0a43a8c;box-shadow:inset 0 0 0 1px #0009,0 0 8px #e0a43a2e}.slot .key{background:#0009;border-radius:4px;padding:0 4px;color:var(--gold-hi);font-weight:600}.slot .ic{border-radius:7px;box-shadow:inset 0 0 0 1px #ffffff1f,0 2px 4px #0009}.slot.atk{background:radial-gradient(circle at 50% 35%,#5a3b12,#1b140a 70%);border:2px solid var(--gold);box-shadow:0 0 18px #e0a43a59,inset 0 0 12px #0009;color:var(--gold-hi);font-weight:600}.slot .cd{-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:#000000b3;color:var(--gold-hi)}.pot{background:radial-gradient(circle at 50% 30%,#1a2030,#0a0d13 75%);border-radius:10px;box-shadow:0 3px 8px #00000080}.plate{font-size:12px;font-weight:600;text-shadow:0 1px 2px #000,0 0 6px rgba(0,0,0,.8)}.pbar{height:6px;border-radius:3px;border:1px solid rgba(0,0,0,.7);box-shadow:0 1px 3px #0009}.pbar i{background:linear-gradient(#7fe59a,#3fae5a)}.pbar.m i{background:linear-gradient(#ff8a7d,#d9483b)}.float{text-shadow:0 2px 3px #000,0 0 8px rgba(0,0,0,.7)}.toast div{background:linear-gradient(90deg,#0000,#0a0d14cc 20%,#0a0d14cc 80%,#0000);border-top:1px solid rgba(224,164,58,.25);border-bottom:1px solid rgba(224,164,58,.25);padding:5px 28px;font-size:13px}.toast div.big{font-size:24px;letter-spacing:.5px;border:none;background:none;text-shadow:0 0 16px rgba(224,164,58,.9),0 2px 4px #000}.win{border-radius:14px;padding:0 16px 14px}.win-head{margin:0 -16px 12px;padding:10px 16px;border-bottom:1px solid var(--line);background:linear-gradient(90deg,#e0a43a2e,#e0a43a00 70%);border-radius:14px 14px 0 0}.win-head .title{font-size:16px}.tabs .btn.on,.btn.tab.on{background:linear-gradient(#f0b85a,#b97d1f);color:#1a1205;border-color:var(--gold-hi)}.sk{border-radius:10px;border:1px solid rgba(255,255,255,.06);background:linear-gradient(90deg,#ffffff08,#fff0);transition:background .15s,border-color .15s}.sk:hover{border-color:#e0a43a73;background:#e0a43a0f}.dslot,.cell{border-radius:9px;background:radial-gradient(circle at 50% 30%,#161c28,#0a0d13 80%);box-shadow:inset 0 0 0 1px #0009}.dslot.sel,.cell.sel{outline:2px solid var(--gold-hi);box-shadow:0 0 10px #ffd27a80}.idetail{background:linear-gradient(160deg,#e0a43a14,#0000);border-color:#e0a43a59}.zone-name{font-size:13px;color:var(--gold-hi);letter-spacing:1px}.minimap{border-radius:12px;padding:5px}.minimap canvas{border-radius:9px;box-shadow:inset 0 0 0 1px #0009}.auto-badge{border-radius:10px;box-shadow:0 0 14px #e0a43a66;animation:pulse 1.6s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.hud-menu .btn{padding:6px 11px;font-size:12.5px;border-radius:8px}.chat-log{background:linear-gradient(0deg,#00000059,#0000);border-radius:8px;padding:4px 6px}.loading-screen .ls-bar{height:9px;border:1px solid rgba(224,164,58,.35);background:#0000008c}.loading-screen .ls-bar i{box-shadow:0 0 12px #ffd27a99}.login .box,.create{border-radius:16px}.modal{position:absolute;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;place-items:center;background:#0000008c}.modal-box{width:min(340px,calc(100vw - 32px));padding:18px 18px 14px;text-align:center}.modal-text{font-size:15px;line-height:1.5;margin-bottom:14px}.modal-btns{display:flex;gap:10px;justify-content:center}.modal-btns .btn{min-width:96px}.stepper{display:inline-flex;align-items:center;gap:6px}.stepper b{min-width:58px;text-align:center;color:var(--gold-hi);font-weight:500}.stepper .btn.mini{width:30px;height:30px;padding:0;font-size:18px;line-height:1}.auto-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0}.menu-toggle{display:none}.menu-items{display:flex;gap:6px}.online-tag{position:absolute;top:132px;left:calc(14px + var(--safe-l));font-size:11px;color:#9fd7a8;text-shadow:0 1px 2px #000;pointer-events:none}.safe-tag{color:#7fe59a;font-size:11px;border:1px solid rgba(127,229,154,.5);border-radius:6px;padding:0 5px;margin-left:4px}.gold-amt{color:var(--gold-hi);font-weight:600;margin-left:auto;margin-right:10px}#wStat{width:min(460px,calc(100vw - 20px))}.char-top{display:flex;gap:14px;align-items:flex-start;margin-bottom:8px}.char-top .derived{flex:1;margin-top:0;grid-template-columns:auto 1fr;gap:3px 10px}.dslot{width:52px;height:52px;position:relative;flex-direction:column}.dslot span{font-size:9px;color:var(--muted)}.dslot .iic+span{position:absolute;bottom:1px;left:0;right:0;text-shadow:0 1px 2px #000;color:#cfd6de}.dslot .iic{width:40px;height:40px}.stat-title{display:flex;justify-content:space-between;margin:10px 0 4px}.pts{font-size:13px;color:var(--muted);font-weight:400}.pts.on{color:#7fe59a}.stat-row{grid-template-columns:48px 1fr 40px auto}.stat-row .sv{text-align:right;color:var(--gold-hi)}.stat-row .sbtn{display:flex;gap:4px;min-width:76px;justify-content:flex-end}.stack span{max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:860px),(max-height:500px){.hud-menu{top:8px!important;flex-direction:column!important;align-items:flex-end!important;z-index:20}.menu-toggle{display:block;padding:6px 12px!important}.menu-items{display:none;flex-direction:column;align-items:stretch;gap:4px;padding:6px;border-radius:10px;background:#080a0ff0;border:1px solid var(--line)}.hud-menu.open .menu-items{display:flex}.menu-items .btn{padding:9px 14px!important;font-size:13px!important;text-align:left}.minimap{top:46px}.char-top{flex-direction:column}.char-top .doll{align-self:center}.dcol{grid-auto-flow:column}.doll{flex-direction:column}.win{max-height:calc(100vh - 20px)}.online-tag{top:118px}}.maint{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;display:grid;place-items:center;background:#000000c7}.maint-box{width:min(380px,calc(100vw - 32px));padding:22px 20px;text-align:center;display:grid;gap:10px}.maint-title{font-size:20px;font-weight:600;color:var(--gold)}.maint-sub{font-size:13px;color:#cfd6dd;line-height:1.5}.maint-dots{font-size:13px;color:var(--muted)}.maint-dots span{animation:maintBlink 1.2s infinite}.maint-dots span:nth-child(2){animation-delay:.4s}.maint-dots span:nth-child(3){animation-delay:.8s}@keyframes maintBlink{0%,to{opacity:.2}50%{opacity:1}}.outer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background:#05070b url(/ui/login/bg_0.webp) center / cover no-repeat;font-family:Tahoma,Noto Sans Thai,sans-serif}.outer-bar{position:absolute;left:0;right:0;height:76px;background:url(/ui/login/outer_up_image.png) left top / auto 100% repeat-x;pointer-events:none}.outer-bar.top{top:0}.outer-bar.bottom{bottom:0;height:77px;background-image:url(/ui/login/outer_dn_image.png)}.outer-full{position:absolute;right:calc(8px + var(--safe-r, 0px));top:8px;width:28px;height:28px;border:0;cursor:pointer;background:url(/ui/login/fullscreen_outer.png) center / 100% 100% no-repeat;opacity:.85}.outer-full:hover{opacity:1}.outer-mark{position:absolute;left:50%;top:21%;width:min(440px,80vw);transform:translate(-50%,-50%);pointer-events:none;filter:drop-shadow(0 4px 12px rgba(0,0,0,.8))}.outer-copy{position:absolute;left:0;right:0;bottom:calc(10px + var(--safe-b, 0px));text-align:center;font-size:12px;color:#c9d1d9;text-shadow:0 1px 2px #000;pointer-events:none}.owin{position:absolute;left:50%;top:56%;transform:translate(-50%,-50%);width:min(330px,calc(100vw - 24px));color:#fff;font-size:13px;filter:drop-shadow(0 6px 18px rgba(0,0,0,.7))}.reg-win{width:min(430px,calc(100vw - 24px));top:54%}.owin-title{height:30px;line-height:30px;padding-left:14px;font-weight:600;font-size:14px;letter-spacing:.5px;text-shadow:0 1px 0 #000;border-image:url(/ui/login/outer_title.png) 0 8 0 8 fill / 0 13px 0 13px stretch;border-style:solid;border-width:0 13px;box-sizing:border-box}.owin-body{border-image:url(/ui/login/outer_body.png) 2 fill / 3px stretch;border-style:solid;border-width:3px;padding:14px 16px 12px;display:grid;gap:10px;box-sizing:border-box}.owin-bottom{height:10px;background:url(/ui/login/login_bottom.png) center / 100% 100% no-repeat}.orow{display:grid;grid-template-columns:78px 1fr;align-items:center;gap:8px}.orow.wide{grid-template-columns:128px 1fr 48px}.orow span{text-align:right;color:#fff;text-shadow:0 1px 0 #000;font-size:13px}.orow .field{width:100%;min-width:0;height:28px;font-size:14px;box-sizing:border-box}.orow .btn.mini{height:24px;padding:0 4px;font-size:11px}.ochk{display:flex;align-items:center;gap:7px;cursor:pointer;-webkit-user-select:none;user-select:none;color:#ddd;font-size:12px;padding-left:86px}.ochk i{width:16px;height:16px;flex:none;background:url(/ui/login/login_page_idsave_button.png) center / 100% 100% no-repeat}.ochk.on i{background-image:url(/ui/login/login_page_idsave_button_f.png)}.obtns{display:flex;gap:8px}.obtns .btn{flex:1;height:30px;font-size:13px}.oinfo{font-size:12px;color:#b9c3cf;line-height:1.5;min-height:2.8em}.oinfo.bad{color:#ff9d94}@media(max-width:480px){.orow{grid-template-columns:64px 1fr}.orow.wide{grid-template-columns:96px 1fr 44px}.ochk{padding-left:72px}.outer-mark{top:15%}.owin{top:58%}.outer-bar,.outer-bar.bottom{height:44px}}.outer.lobby{background:none;pointer-events:none}.outer.lobby .outer-full{pointer-events:auto}.outer.lobby .outer-mark{display:none}.outer.lobby .owin{pointer-events:auto}.selwin{left:auto;right:calc(16px + var(--safe-r, 0px));top:50%;transform:translateY(-50%);width:min(300px,calc(100vw - 24px))}.sel-info{display:grid;gap:4px;padding:4px 2px 8px;border-bottom:1px solid rgba(255,255,255,.15)}.sel-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#e8eef5;text-shadow:0 1px 0 #000}.sel-row b{color:var(--gold-hi, #ffd27a);font-weight:600}.sel-exp i{flex:1;margin-left:10px;height:10px;background:url(/ui/login/select_character_exp.png) center / 100% 100% no-repeat;position:relative}.sel-exp i b{position:absolute;left:0;top:0;bottom:0;background:url(/ui/login/select_character_exp_overimage.png) left / auto 100% repeat-x}.sel-list{display:grid;gap:4px;max-height:300px;overflow:auto;padding:2px}.sel-item{display:grid;grid-template-columns:100px 1fr;align-items:center;gap:8px;height:50px;padding:4px;cursor:pointer;border:1px solid transparent;background:#00000059}.sel-item img{width:100px;height:40px;display:block;image-rendering:auto}.sel-item .sel-lv{font-size:12px;color:#b9c3cf}.sel-item .sel-lv small{color:#8fa3b8}.sel-item .sel-name{font-size:14px;color:#fff;text-shadow:0 1px 0 #000}.sel-item.sel{border-image:url(/ui/login/select_char_window_select.png) 3 fill / 3px stretch;border-style:solid;border-width:3px;background:none}.sel-item.sel .sel-name{color:var(--gold-hi, #ffd27a)}.sel-server{font-size:11px;color:#9aa6b3;text-align:center;padding:2px 0}@media(max-width:720px){.selwin{right:50%;left:auto;top:auto;bottom:calc(52px + var(--safe-b, 0px));transform:translate(50%);width:min(340px,calc(100vw - 16px))}.selwin .sel-list{max-height:112px}.selwin .owin-body{padding:8px 10px;gap:6px}.sel-item{height:44px}}.party-head{display:flex;align-items:center;gap:6px}.party-head>span:first-child{flex:1}.party-sum{font-size:10px;color:var(--muted);white-space:nowrap}.pset{display:grid;gap:4px;padding:4px 0 6px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:4px}.pset-row{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px}.pset-row .btn.mini{min-width:86px}.pset-row .btn.ro{opacity:1;filter:none;color:#ddd;cursor:default}.pset-note{font-size:10px;color:var(--muted)}.hud-tl .party{pointer-events:auto;margin-top:4px}@media(max-width:560px)and (orientation:portrait){.zone-name{font-size:11px;max-width:190px}.online-tag{font-size:10px;max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.party{width:176px;padding:5px 7px;gap:4px;max-height:190px;overflow:auto}.party-sum{display:none}.party-head .btn.mini{padding:1px 5px}.pm-name{font-size:11px}.tut{width:min(176px,50vw)}.chat.typing .chat-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.chat-tabs span{white-space:nowrap;padding:2px 5px;font-size:10px}.hud-exp>span{left:calc(50px + var(--safe-l));transform:none;bottom:12px}}@media(orientation:landscape)and (max-height:500px){.hud-tl{max-height:calc(100vh - 60px);overflow:hidden;gap:2px}.hud-tl>*{flex-shrink:0}.hud-tl .tut{flex-shrink:1;min-height:0;overflow:hidden}.hud-tl .party{max-height:110px;overflow:auto;width:200px;padding:4px 6px;gap:3px}.hud-tl .party .pset-note,.hud-tl .party .party-sum{display:none}.hud-tl .party .pset-row .btn.mini{min-width:76px}.hud-tl .tut{width:min(220px,30vw);font-size:10.5px;padding:4px 8px}.hud-tl .tut .tut-text{max-height:3.9em;overflow:hidden}.chat.typing .chat-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.chat-tabs span{white-space:nowrap;padding:2px 5px;font-size:10px}.hud-exp>span{left:calc(50px + var(--safe-l));transform:none;bottom:12px}}#wPet{width:min(460px,calc(100vw - 20px))}.pet-list,.pet-skills{display:grid;gap:4px;max-height:32vh;overflow:auto;margin:6px 0}.pet-row,.pet-sk{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:4px 6px;background:#0000004d}.pet-row.sel,.pet-sk.on{box-shadow:0 0 0 1px var(--gold-hi, #ffd27a) inset}.pet-sk.no{opacity:.7}.pet-row b,.pet-sk b{display:block;font-size:13px}.pet-row small,.pet-sk small{display:block;font-size:11px;color:var(--muted)}.pet-ic{width:32px;height:32px;display:block}.pet-sk-head{display:flex;align-items:center;gap:8px;margin-top:8px}.pet-sk-head b{flex:1}.ps-h{margin:8px 0 4px;color:var(--gold-hi, #ffd27a);font-weight:600;font-size:13px}.plate.champ .pname{font-weight:700;text-shadow:0 0 6px rgba(255,140,40,.8),0 1px 2px #000}.champ-tags{display:flex;gap:4px;justify-content:center;font-size:10px;margin-bottom:1px}.champ-tags b{font-weight:600;text-shadow:0 1px 2px #000,0 0 3px #000}:root{--ui-scale: 1;--rp: calc(var(--ui-scale) * 2px);--gp: calc(var(--ui-scale) * 1px);--ran-ink: #ebe4d2;--ran-hi: #ffe9a8;--ran-dim: #a39c8c;--ran-line: #5a5145;--ran-fill: rgba(0, 0, 0, .6);--panel: var(--ran-fill);--line: var(--ran-line);--radius: 0px}@media(max-width:560px){:root{--ui-scale: 1.1}}.panel,.win-head,.btn,.slot,.pot,.cell,.dslot,.bar,.bar>i,.hud-exp,.hud-exp>i,.pbar,.pbar i,.field,.sk,.choice,.stack,.idetail,.tip,.minimap:before,.chat-tabs span,.ran-check,.ran-icon,.ls-bar,.ls-bar i,.auto-row input[type=checkbox]{image-rendering:pixelated}.panel img,.panel canvas,.slot img,.cell img,.dslot img,.iic img,.ic img{image-rendering:auto}.panel{background:none;border:calc(2 * var(--rp)) solid transparent;border-image:url(/ui/panel_box.png) 2 fill / calc(2 * var(--rp)) stretch;border-radius:0;box-shadow:0 calc(3 * var(--rp)) calc(9 * var(--rp)) #0006;color:var(--ran-ink)}.title{color:var(--ran-hi);text-shadow:0 1px 0 #000,0 0 6px rgba(0,0,0,.8);letter-spacing:.3px}.muted{color:var(--ran-dim)}.hud-me{border-left:calc(2 * var(--rp)) solid transparent;padding-left:calc(8px * var(--ui-scale))}.hud-target{border-top:calc(2 * var(--rp)) solid transparent}.slot-label.sel{box-shadow:0 0 0 calc(1 * var(--rp)) var(--ran-hi),0 0 16px #ffe9a859}.win{--win-pad: calc(12px * var(--ui-scale));border-width:0 0 calc(2 * var(--rp)) 0;border-image:url(/ui/win_box.png) 2 fill / 0 calc(2 * var(--rp)) calc(2 * var(--rp)) calc(2 * var(--rp)) stretch;padding:0 var(--win-pad) var(--win-pad);width:min(420px,calc(100vw - 16px));max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}.win-head{position:sticky;top:0;z-index:3;box-sizing:border-box;height:calc(18 * var(--rp));min-height:calc(18 * var(--rp));margin:0 calc(-1 * var(--win-pad)) calc(8px * var(--ui-scale));padding:0 calc(5 * var(--rp)) 0 calc(9 * var(--rp));gap:calc(4 * var(--rp));border:0 solid transparent;border-image:url(/ui/win_title.png) 0 24 0 7 fill / 0 calc(24 * var(--rp)) 0 calc(7 * var(--rp)) stretch;background:#0d0b0a;border-radius:0}.win-head .title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:calc(14px * var(--ui-scale));font-weight:600;line-height:1}.win-head .title small{font-weight:400}.win-head .btn,.ran-close{flex:none;width:calc(14 * var(--rp));height:calc(18 * var(--rp));min-height:0;padding:0;border:0;border-image:none;border-radius:0;box-shadow:none;transform:none;background:url(/ui/win_close.png) center / 100% 100% no-repeat;font-size:0;color:transparent;text-shadow:none;cursor:pointer}.win-head .btn:hover,.ran-close:hover{border-image:none;box-shadow:none;background-image:url(/ui/win_close_over.png)}.win-head .btn:active,.ran-close:active{border-image:none;transform:none;background-image:url(/ui/win_close_down.png)}.btn{border:0 solid transparent;border-radius:0;background:none;border-image:url(/ui/btn.png) 7 7 4 7 fill / calc(7 * var(--rp)) calc(7 * var(--rp)) calc(4 * var(--rp)) calc(7 * var(--rp)) stretch;box-shadow:none;transition:none;min-height:calc(13 * var(--rp));padding:calc(3px * var(--ui-scale)) calc(9 * var(--rp));color:var(--ran-ink);text-shadow:0 1px 0 #000;line-height:1.25}.btn:hover{border-image-source:url(/ui/btn_over.png);box-shadow:none;color:#fff}.btn:active{border-image-source:url(/ui/btn_down.png);transform:none;color:var(--ran-hi)}.btn.gold{border-image-source:url(/ui/btn_down.png);background:none;color:var(--ran-hi);font-weight:600;box-shadow:none;text-shadow:0 1px 0 #000}.btn.gold:hover{filter:brightness(1.3)}.btn.gold:active{filter:brightness(.85)}.btn.danger{color:#ff9d94}.btn:disabled{opacity:.45;filter:grayscale(1);border-image-source:url(/ui/btn.png)}.hud-menu .btn{padding:calc(2px * var(--ui-scale)) calc(8 * var(--rp));font-size:calc(12px * var(--ui-scale))}.stat-row .btn,.sk-btns .btn,.stepper .btn{padding:calc(1px * var(--ui-scale)) calc(8 * var(--rp))}.btn.mini{border-image:url(/ui/btn14.png) 5 5 4 5 fill / calc(5 * var(--rp)) calc(5 * var(--rp)) calc(4 * var(--rp)) calc(5 * var(--rp)) stretch;min-height:calc(10 * var(--rp));padding:0 calc(6 * var(--rp));font-size:calc(11px * var(--ui-scale));border-radius:0}.btn.mini:hover{border-image-source:url(/ui/btn14_over.png)}.btn.mini:active,.btn.mini.gold{border-image-source:url(/ui/btn14_down.png)}.btn.blue{border-image:url(/ui/btn_blue.png) 3 fill / calc(3 * var(--rp)) stretch}.btn.blue:hover{border-image-source:url(/ui/btn_blue_over.png)}.btn.blue:active{border-image-source:url(/ui/btn_blue_down.png)}.btn.red{border-image:url(/ui/btn_red.png) 3 fill / calc(3 * var(--rp)) stretch;color:#fff}.btn.red:hover{border-image-source:url(/ui/btn_red_over.png)}.btn.red:active{border-image-source:url(/ui/btn_red_down.png)}.tabs{gap:calc(1 * var(--rp))}.btn.tab,.tabs .btn{border-image:url(/ui/tab_off.png) 6 5 4 5 fill / calc(6 * var(--rp)) calc(5 * var(--rp)) calc(4 * var(--rp)) calc(5 * var(--rp)) stretch;padding:calc(2px * var(--ui-scale)) calc(7 * var(--rp));font-size:calc(13px * var(--ui-scale));color:var(--ran-dim)}.btn.tab:hover,.tabs .btn:hover{border-image-source:url(/ui/tab_off.png);color:var(--ran-ink)}.tabs .btn.on,.btn.tab.on,.tabs .btn.on:hover,.btn.tab.on:hover{border-image-source:url(/ui/tab_on.png);background:none;color:var(--ran-hi)}.chat-tabs{gap:1px}.chat-tabs span{border:0 solid transparent;border-radius:0;background:none;border-image:url(/ui/tab_off.png) 6 5 4 5 fill / calc(6 * var(--gp)) calc(5 * var(--gp)) calc(4 * var(--gp)) calc(5 * var(--gp)) stretch;padding:calc(2px * var(--ui-scale)) calc(8 * var(--gp));min-height:calc(19 * var(--gp));line-height:calc(15 * var(--gp));font-size:calc(11px * var(--ui-scale));color:var(--ran-dim)}.chat-tabs span.on{border-image-source:url(/ui/tab_on.png);background:none;color:var(--ran-hi)}.field,.chat-in select.chan{border:calc(1 * var(--rp)) solid transparent;border-radius:0;background:none;border-image:url(/ui/edit_box.png) 1 fill / calc(1 * var(--rp)) stretch;color:#fff;text-shadow:0 1px 1px rgba(0,0,0,.8);padding:calc(7px * var(--ui-scale)) calc(10px * var(--ui-scale));-webkit-appearance:none;-moz-appearance:none;appearance:none}.field::placeholder{color:#d8d2c4;opacity:.8}.field:focus{outline:calc(1 * var(--gp)) solid var(--ran-hi);outline-offset:0}.chat-in select.chan{padding:calc(3px * var(--ui-scale)) calc(6px * var(--ui-scale))}.bar{height:calc(14 * var(--gp));border:0 solid transparent;border-radius:0;background:none;box-shadow:none;border-image:url(/ui/gauge_frame.png) 0 3 0 3 fill / 0 calc(3 * var(--gp)) stretch}.bar>i{inset:auto;top:calc(1 * var(--gp));left:calc(1 * var(--gp));bottom:0;max-width:calc(100% - 2 * var(--gp));border:0 solid transparent;border-radius:0;background:none;box-shadow:none;border-image:url(/ui/gauge_hp.png) 0 3 0 3 fill / 0 calc(3 * var(--gp)) stretch}.bar.hp>i{background:none}.bar.mp>i{background:none;border-image-source:url(/ui/gauge_mp.png)}.bar.sp>i{background:none;border-image-source:url(/ui/gauge_sp.png)}.bar.exp>i{background:none;border-image-source:url(/ui/gauge_exp.png)}.bar>span{font-size:calc(10px * var(--ui-scale));line-height:calc(14 * var(--gp));font-weight:600;text-shadow:0 0 2px #000,0 1px 1px #000}.hud-target .bar{height:calc(14 * var(--gp))}.bar.thin{height:calc(5 * var(--gp));border-image:url(/ui/target_gauge_frame.png) 0 2 0 2 fill / 0 calc(2 * var(--gp)) stretch}.bar.thin>i{top:0;left:0;max-width:100%;border-image:url(/ui/target_gauge.png) 0 2 0 2 fill / 0 calc(2 * var(--gp)) stretch}.bar.thin.mp>i{filter:hue-rotate(225deg) saturate(1.2)}.bar.thin.sp>i{filter:hue-rotate(115deg)}.pbar{height:calc(5 * var(--gp));border:0;border-radius:0;box-shadow:none;background:url(/ui/target_gauge_frame.png) center / 100% 100% no-repeat}.pbar i,.pbar.m i{background:url(/ui/target_gauge.png) left center / auto 100% repeat-x}.pbar:not(.m) i{filter:hue-rotate(115deg)}.hud-exp{height:calc(5 * var(--rp));border:0;background:url(/ui/option_gauge_frame.png) center / 100% 100% no-repeat}.hud-exp>i{background:url(/ui/option_gauge.png) left center / auto 100% repeat-x;box-shadow:none}.hud-exp>span{bottom:calc(6 * var(--rp));color:var(--ran-ink);text-shadow:0 1px 2px #000}.loading-screen .ls-bar{height:calc(5 * var(--rp));border:0;border-radius:0;background:url(/ui/option_gauge_frame.png) center / 100% 100% no-repeat}.loading-screen .ls-bar i{background:url(/ui/option_gauge.png) left center / auto 100% repeat-x;box-shadow:none}.slot{border:calc(6 * var(--gp)) solid transparent;border-radius:0;background:none;box-shadow:none;padding:0;border-image:url(/ui/skill_slot.png) 6 fill / calc(6 * var(--gp)) stretch;color:var(--ran-ink)}.slot:not(.empty):not(.atk){border-color:transparent;box-shadow:none}.slot:not(.atk):hover:after,.slot.picking:after{content:"";position:absolute;inset:calc(-2 * var(--gp));pointer-events:none;border:calc(3 * var(--gp)) solid transparent;border-image:url(/ui/skill_slot_over.png) 3 / calc(3 * var(--gp)) stretch;image-rendering:pixelated}.slot.picking{outline:none}.slot .ic{border-radius:0;box-shadow:none;width:100%;height:100%;margin:0;position:absolute;top:0;right:0;bottom:0;left:0}.slot .key{z-index:1;top:0;left:0;border-radius:0;background:#000000b3;color:var(--ran-hi);line-height:1.2;padding:0 3px}.slot .cd{z-index:1;-webkit-backdrop-filter:none;backdrop-filter:none}.slot.atk{border:0;border-image:none;border-radius:50%;padding:12%;background:url(/ui/minimap_frame.png) center / 100% 100% no-repeat,radial-gradient(circle at 50% 40%,#4a3c22 0,#17120b 62%,transparent 64%);box-shadow:none;color:var(--ran-hi);text-shadow:0 1px 0 #000}.slot.atk .muted{color:var(--ran-dim)}.cell,.dslot{border:calc(1 * var(--gp)) solid transparent;border-radius:0;background:none;box-shadow:none;border-image:url(/ui/slot.png) 1 fill / calc(1 * var(--gp)) stretch}.dslot.empty{border-style:solid}.cell:not(.empty):hover,.dslot:not(.empty):hover,.dslot.sel,.cell.sel{outline:none;box-shadow:none;background:#00000087;background-clip:padding-box;border-width:calc(3 * var(--gp));border-image:url(/ui/slot_over.png) 3 / calc(3 * var(--gp)) stretch}.dslot.sel,.cell.sel{background-color:#78602873}.iic{border-radius:0;background:none}.stack .ic,.stack .iic,.sk .ic{border-radius:0}.pot{border:0 solid transparent;border-radius:0;background:none;border-image:url(/ui/quick_slot.png) 6 6 6 8 fill / calc(6 * var(--gp)) calc(6 * var(--gp)) calc(6 * var(--gp)) calc(8 * var(--gp)) stretch;min-height:calc(41 * var(--gp));color:var(--ran-ink)}.pot.hp,.pot.mp,.pot.sp{box-shadow:none}.pot.hp b{color:#ff8d86}.pot.mp b{color:#8fbfff}.pot.sp b{color:#9fe8a8}.pot .key{top:calc(5 * var(--gp));left:calc(8 * var(--gp));color:var(--ran-hi)}.sk{border:calc(1 * var(--gp)) solid transparent;border-radius:0;background:none;transition:none;border-image:url(/ui/skill_box.png) 1 fill / calc(1 * var(--gp)) stretch}.sk:hover{background:#ffe9a812;border-image:url(/ui/white_box.png) 1 / calc(1 * var(--gp)) stretch}.choice,.stack{border:calc(1 * var(--gp)) solid transparent;border-radius:0;background:none;border-image:url(/ui/line_box.png) 1 fill / calc(1 * var(--gp)) stretch}.choice.on{background:#78602859;color:var(--ran-hi);border-width:calc(3 * var(--gp));border-image:url(/ui/box_yellow.png) 3 / calc(3 * var(--gp)) stretch}.stat-row{border-bottom:calc(1 * var(--rp)) solid transparent;border-image:url(/ui/sep.png) 0 0 2 0 / 0 0 calc(1 * var(--rp)) 0 stretch}.idetail,.tip{border:calc(4 * var(--gp)) solid transparent;border-radius:0;background:none;border-image:url(/ui/tooltip.png) 4 fill / calc(4 * var(--gp)) stretch;padding:calc(4px * var(--ui-scale)) calc(6px * var(--ui-scale))}.tip{display:inline-block;max-width:min(260px,calc(100vw - 24px));font-size:calc(12px * var(--ui-scale));line-height:1.45;color:var(--ran-ink)}.tip b{color:var(--ran-hi);font-weight:600}.ran-sep{height:calc(1 * var(--rp));border:0;margin:calc(6px * var(--ui-scale)) 0;background:url(/ui/sep.png) center / 100% 100% no-repeat}.auto-row input[type=checkbox],input.ran-check,.ran-check{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;flex:none;margin:0;border:0;border-radius:0;cursor:pointer;width:calc(11 * var(--rp));height:calc(11 * var(--rp));background:url(/ui/check_off.png) center / 100% 100% no-repeat}.auto-row input[type=checkbox]:checked,input.ran-check:checked,.ran-check.on{background-image:url(/ui/check_on.png)}input.ran-radio,.ran-radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:inline-block;flex:none;margin:0;border:0;cursor:pointer;image-rendering:pixelated;width:calc(13 * var(--rp));height:calc(13 * var(--rp));background:url(/ui/radio_off.png) center / 100% 100% no-repeat}input.ran-radio:checked,.ran-radio.on{background-image:url(/ui/radio_on.png)}.ran-icon{display:inline-block;flex:none;padding:0;border:0;background:center / 100% 100% no-repeat;cursor:pointer;vertical-align:middle}.ran-icon.plus{width:calc(10 * var(--rp));height:calc(12 * var(--rp));background-image:url(/ui/plus.png)}.ran-icon.plus:hover{background-image:url(/ui/plus_over.png)}.ran-icon.minus{width:calc(10 * var(--rp));height:calc(12 * var(--rp));background-image:url(/ui/minus.png)}.ran-icon.minus:hover{background-image:url(/ui/minus_over.png)}.ran-icon.statup{width:calc(15 * var(--rp));height:calc(10 * var(--rp));background-image:url(/ui/stat_up.png)}.ran-icon.statup:hover{background-image:url(/ui/stat_up_over.png)}.ran-icon.statup:disabled,.ran-icon.statup.off{background-image:url(/ui/stat_up_disabled.png);cursor:default}.minimap{border:0;border-image:none;background:none;box-shadow:none;padding:0;backdrop-filter:none;-webkit-backdrop-filter:none}.minimap canvas{width:86%;height:auto;aspect-ratio:1;margin:7%;border-radius:50%;box-shadow:none}.minimap:before{content:"";position:absolute;left:0;top:0;width:100%;aspect-ratio:1;pointer-events:none;z-index:1;background:url(/ui/minimap_frame.png) center / 100% 100% no-repeat}.mm-z{margin-top:calc(-4px * var(--ui-scale));color:var(--ran-ink);text-shadow:0 1px 2px #000}.worldmap canvas{border-radius:0}.win::-webkit-scrollbar,.chat-log::-webkit-scrollbar,.create-left::-webkit-scrollbar,.create-right::-webkit-scrollbar{width:9px;height:9px}.win::-webkit-scrollbar-track,.chat-log::-webkit-scrollbar-track,.create-left::-webkit-scrollbar-track,.create-right::-webkit-scrollbar-track{background:#000000b3}.win::-webkit-scrollbar-thumb,.chat-log::-webkit-scrollbar-thumb,.create-left::-webkit-scrollbar-thumb,.create-right::-webkit-scrollbar-thumb{image-rendering:pixelated;min-height:26px;background:url(/ui/scroll_thumb_top.png) top / 100% 9px no-repeat,url(/ui/scroll_thumb_bottom.png) bottom / 100% 9px no-repeat,url(/ui/scroll_thumb_mid.png) center / 100% calc(100% - 16px) no-repeat}.win::-webkit-scrollbar-track{margin:36px 0 4px}@media(max-width:560px){.win::-webkit-scrollbar-track{margin:45px 0 5px}}@supports not selector(::-webkit-scrollbar){.win,.chat-log,.create-left,.create-right{scrollbar-width:thin;scrollbar-color:#6b6152 rgba(0,0,0,.55)}}.buff{border-radius:0;background:#0009;border-color:#3c5a3c}.badge,.chat-log,.toast div,.auto-badge,.power-badge{border-radius:0}.zone-name{color:var(--ran-hi)}.login .box,.create{border-radius:0}@media(max-width:560px){.win{--win-pad: 10px;width:calc(100vw - 12px)}.bag-grid{gap:2px}.hud-me{width:min(190px,52vw)}}@media(max-width:760px),(max-height:500px){.minimap canvas{width:86%;height:auto}}.hud-tl{position:absolute;top:10px;left:calc(10px + var(--safe-l));display:flex;flex-direction:column;align-items:flex-start;gap:3px;pointer-events:none}.hud-tl>*{position:static!important}.hud-tl .hud-me{pointer-events:auto}.slot.atk{justify-self:end}.hud-exp>span{right:auto;left:50%;transform:translate(-50%);white-space:nowrap}@media(max-width:560px)and (orientation:portrait){.joy{bottom:calc(150px + var(--safe-b))}body.touch .chat{bottom:calc(290px + var(--safe-b))}}.hud-target{top:calc(46px * var(--ui-scale))}.win{z-index:30}.bnodes{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 8px}.bnode{flex:1 1 150px;padding:3px 7px;border:1px solid var(--ran-line);background:#00000059;font-size:11px;color:var(--ran-dim);line-height:1.35}.bnode b{color:var(--ran-ink);font-weight:600}.bnode small{display:block;opacity:.85}.bnode.on{border-color:#c8a04a;color:var(--ran-hi);background:#785a1447}.bnode.on b{color:var(--ran-hi)}.mastery{margin:0 0 8px}.row-end{display:flex;justify-content:flex-end;margin-top:6px}.portal-ask{position:absolute;left:50%;bottom:calc(150px + var(--safe-b));transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:8px 12px;z-index:25;white-space:nowrap;pointer-events:auto}.portal-ask span{color:var(--ran-hi);font-size:calc(14px * var(--ui-scale))}@media(max-width:560px)and (orientation:portrait){.portal-ask{bottom:calc(310px + var(--safe-b));flex-wrap:wrap;justify-content:center;white-space:normal;max-width:92vw}}#wAdmin{width:min(560px,calc(100vw - 20px))}.adm-grid .title{margin:10px 0 4px}.adm-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:6px}.adm-row .field{flex:1 1 120px;min-width:90px}.adm-row input[type=number].field{flex:0 1 90px}.adm-row select.field{flex:1 1 200px}.qicon{width:34px;height:34px;display:grid;place-items:center;font-weight:700;font-size:18px;border:1px solid var(--ran-line);background:#0006;color:var(--ran-dim)}.qicon.ready{color:#ffe14a;border-color:#ffe14a;animation:qpulse 1s infinite alternate}.qicon.done{color:#7ddc4a}@keyframes qpulse{0%{box-shadow:0 0 #ffe14a00}to{box-shadow:0 0 10px #ffe14ab3}}.qbar{position:relative;height:10px;margin:3px 0;background:#00000080;border:1px solid var(--ran-line)}.qbar i{display:block;height:100%;background:linear-gradient(90deg,#8a5a12,#ffd27a)}.qbar span{position:absolute;top:0;right:0;bottom:0;left:0;text-align:center;font-size:9px;line-height:10px;color:#fff;text-shadow:0 1px 1px #000}.trait{margin:4px 0;padding:4px 8px;color:#e9c9ff;border:1px solid #6a4d8a;background:#5a328240;font-size:12px}.exp{color:#ffb347;font-size:10px;margin-left:4px}.stack small.exp{display:block;margin:0}.doll{gap:6px}.char-preview{width:150px;height:190px;border:1px solid var(--ran-line);background:radial-gradient(ellipse at 50% 80%,#78643c59,#00000080);touch-action:none;flex:0 0 auto}@media(max-width:760px){.char-top{flex-direction:row!important;flex-wrap:wrap;justify-content:center}.char-preview{width:130px;height:170px}}.tut{width:min(300px,calc(100vw - 24px));padding:6px 10px;pointer-events:auto;font-size:12px;margin-top:4px}.tut-head{display:flex;justify-content:space-between;align-items:center;color:var(--ran-hi)}.tut-title{font-weight:600;margin-top:2px}.tut-title small{color:var(--ran-dim);font-weight:400}.tut-text{color:var(--ran-ink);line-height:1.35;margin:2px 0}.tut-reward{color:#ffd27a;font-size:11px}@media(max-width:760px){.tut{width:min(240px,60vw);font-size:11px}}.install-banner{position:fixed;left:50%;bottom:14px;transform:translate(-50%);z-index:1000;display:flex;align-items:center;gap:10px;padding:8px 10px;width:min(420px,calc(100vw - 20px));font-size:13px}.install-banner img{width:40px;height:40px;border-radius:8px}.install-banner>div{flex:1}#wShop{width:min(520px,calc(100vw - 20px))}.shop-grid{grid-template-columns:repeat(8,1fr);margin-top:8px}.shop-cell{position:relative}.shop-cell small{position:absolute;right:2px;bottom:1px;font-size:9px;color:#ffd27a;text-shadow:0 1px 1px #000}.shop-cell .ic{width:70%;height:70%;border-radius:4px;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff}.shop-row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:8px}@media(max-width:560px){.shop-grid{grid-template-columns:repeat(6,1fr)}}.skillbar .sk-pages{grid-column:1 / 5;grid-row:1;display:flex;gap:4px;justify-content:flex-start}.skillbar .sk-pages .btn.mini{padding:1px 0;min-width:0;flex:1;font-size:11px;line-height:1.5;opacity:.75}.skillbar .sk-pages .btn.mini.on{opacity:1;color:var(--ran-hi);box-shadow:0 0 0 1px var(--ran-hi) inset}.skillbar .slot.atk{grid-column:5;grid-row:2 / 4;align-self:end}.slot .rm{position:absolute;top:0;right:0;z-index:2;font-size:10px;line-height:1;padding:2px 3px;background:#000000bf;color:#ffb0b0;border-bottom-left-radius:4px;display:none}.slot:hover .rm,body.touch .slot .rm{display:block}.potbar{bottom:calc(170px + var(--safe-b))}@media(max-width:760px),(max-height:500px){.potbar{bottom:calc(150px + var(--safe-b))}}.bus-list,.ps-list{display:flex;flex-direction:column;gap:6px;max-height:56vh;overflow:auto;margin-top:8px}.bus-row,.ps-row{display:flex;align-items:center;gap:10px;padding:6px 8px;background:#0000004d;border:1px solid rgba(255,255,255,.08)}.bus-row>div,.ps-row>div{flex:1;min-width:0;display:flex;flex-direction:column}.bus-row.here{opacity:.6}.ps-row .iic,.ps-row .ic{flex:none;width:40px;height:40px}.win.wide{width:min(560px,calc(100vw - 20px))}.gold-amt.pts{color:#8fd8ff;margin-right:0}.gold-amt.pts+.gold-amt{margin-left:10px}.gold-amt .iic{display:inline-block;width:20px;height:20px;vertical-align:middle}.mk-top{display:flex;justify-content:space-between;align-items:flex-end;gap:8px;margin:4px 0 6px}.mk-last{display:flex;flex-direction:column}.mk-last b{font-size:18px;color:var(--ran-hi)}.mk-span{display:flex;gap:4px}.mk-span .btn.on{color:var(--ran-hi);box-shadow:0 0 0 1px var(--ran-hi) inset}.mk-chart{width:100%;height:auto;display:block;border:1px solid rgba(255,255,255,.1)}.mk-book{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px;font-size:13px}.mk-h{font-weight:600;margin:6px 0 3px}.mk-o{display:flex;justify-content:space-between;align-items:center;padding:1px 6px;cursor:pointer}.mk-o:hover{background:#ffffff12}.mk-o.mine{cursor:default;padding:3px 6px;background:#00000040;margin-bottom:3px}.mk-form{margin-top:10px;padding:8px;background:#0000004d;border:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:1fr 1fr;gap:6px 10px}.mk-form .tabs,.mk-form .mk-sum,.mk-form>small{grid-column:1 / 3;margin:0}.mk-form label{display:flex;flex-direction:column;font-size:12px;gap:2px}.mk-form .field{width:100%;box-sizing:border-box}.mk-sum{display:flex;justify-content:space-between;align-items:center}.mk-pend{margin-top:8px;display:flex;align-items:center;gap:8px;justify-content:space-between;color:var(--ran-hi)}.balloon{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translate(-50%);width:max-content;max-width:220px;padding:4px 9px;border-radius:9px;background:#080a10d1;border:1px solid currentColor;color:#fff;font-size:13px;line-height:1.25;font-weight:500;text-align:center;white-space:normal;word-break:break-word;pointer-events:none;animation:balloon-in .15s ease-out;text-shadow:0 1px 2px #000}.balloon:after{content:"";position:absolute;left:50%;top:100%;transform:translate(-50%);border:5px solid transparent;border-top-color:currentColor}.balloon.ch-world{color:#fff}.balloon.ch-near{color:#ffe9a8}.balloon.ch-party{color:#6fc8ff}.balloon.ch-guild{color:#7df29a}@keyframes balloon-in{0%{opacity:0;transform:translate(-50%) translateY(6px)}to{opacity:1;transform:translate(-50%)}}.hud-menu{max-width:calc(100vw - 290px - var(--safe-r));flex-wrap:wrap;justify-content:flex-end}.menu-items{flex-wrap:wrap;justify-content:flex-end}.pot{overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}.pot img{position:absolute;top:12%;right:16%;bottom:12%;left:16%;width:68%;height:76%;object-fit:contain;image-rendering:auto;pointer-events:none}.pot.none img{opacity:.3;filter:grayscale(1)}.pot b{position:absolute;right:12%;bottom:6%;font-size:calc(11px * var(--ui-scale, 1));color:#fff!important;text-shadow:0 0 3px #000,0 1px 2px #000}.pot .key{z-index:1;text-shadow:0 0 3px #000}.pot .cd{position:absolute;left:0;right:0;bottom:0;height:0;background:#0000009e;pointer-events:none}@keyframes pot-cd{0%{height:100%}to{height:0}}.ran-chat{gap:0;width:min(400px,42vw);pointer-events:auto}.ran-chat .chat-tabs{display:flex;flex-wrap:nowrap;align-items:flex-end;gap:1px}.ran-chat .chat-size{margin-left:auto;order:9;cursor:pointer;font-style:normal;font-size:10px;color:var(--ran-dim);padding:2px 6px;background:#0000008c;border:1px solid #4c4538}.ran-chat .chat-size:hover{color:var(--ran-hi)}.ran-chat .chat-log{display:block;height:118px;max-height:none;overflow-y:auto;padding:4px 7px;font-size:12.5px;line-height:1.45;background:#06080c94;border:1px solid #5a5142;border-bottom:0;box-shadow:inset 0 0 0 1px #0009;text-shadow:0 1px 1px #000}.ran-chat[data-size="0"] .chat-log{height:56px}.ran-chat[data-size="2"] .chat-log{height:240px}.ran-chat .chat-log>div{word-break:break-word;color:#f1ede2}.ran-chat .chat-log b{font-weight:500}.ran-chat .chat-log .c-world b{color:#fff}.ran-chat .chat-log .c-near,.ran-chat .chat-log .c-near b{color:#ffe9a8}.ran-chat .chat-log .c-party,.ran-chat .chat-log .c-party b{color:#6fc8ff}.ran-chat .chat-log .c-guild,.ran-chat .chat-log .c-guild b{color:#7df29a}.ran-chat .chat-log .c-whisper,.ran-chat .chat-log .c-whisper b{color:#f3a6ff}.ran-chat .chat-log .c-system,.ran-chat .chat-log .c-system b{color:#ffcf6b}.ran-chat .chat-in{gap:0;background:#06080ccc;border:1px solid #5a5142}.ran-chat .chat-in select.chan{border:0;border-right:1px solid #5a5142;border-image:none;background:#00000080;color:var(--ran-hi);padding:3px 4px;font-size:12px}.ran-chat .chat-in input.field{border:0;border-image:none;background:transparent;padding:4px 7px;font-size:12.5px;min-height:0;color:#fff;outline:none}.ran-chat .chat-in input.to{border-right:1px solid #5a5142}body:not(.touch) .ran-chat .chat-in{display:flex}body:not(.touch) .ran-chat .chat-in input{display:block;flex:1;min-width:0}body:not(.touch) .ran-chat .chat-in input.to{flex:0 0 76px}body.touch .ran-chat{width:min(300px,46vw)}body.touch .ran-chat .chat-log{height:72px;font-size:11.5px}body.touch .ran-chat[data-size="0"] .chat-log{height:34px}body.touch .ran-chat[data-size="2"] .chat-log{height:150px}body.touch .ran-chat:not(.typing) .chat-log{border-bottom:1px solid #5a5142}.mob-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:4px;max-height:38vh;overflow:auto}.mob-pick{display:flex;flex-direction:column;align-items:center;padding:3px 2px;cursor:pointer;background:#00000059;border:1px solid rgba(255,255,255,.1);font-size:10.5px;line-height:1.15;text-align:center}.mob-pick img{width:44px;height:44px;object-fit:contain;image-rendering:auto}.mob-pick span{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mob-pick small{color:var(--ran-dim);font-size:10px}.mob-pick.on{border-color:var(--ran-hi);background:#ffdc8c24;box-shadow:0 0 0 1px var(--ran-hi) inset}.pm[data-tid]{cursor:pointer}#wBook{width:min(760px,calc(100vw - 20px))}#wBook .sk-sec{margin:10px 0 5px;padding:2px 8px;font-weight:600;color:var(--ran-hi);background:linear-gradient(90deg,rgba(255,220,140,.16),transparent);border-left:3px solid var(--ran-hi)}#wBook .sk-list{grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:4px 8px}#wBook .sk{padding:4px 6px;background:#00000047;border:1px solid rgba(255,255,255,.07);cursor:default;align-items:start}#wBook .sk small{display:block;font-size:11px;line-height:1.3}#wBook .sk .sk-name{font-weight:600}#wBook .sk.locked-soft{opacity:.72}#wBook .sk.locked-soft .ic,#wBook .sk.locked-soft img{filter:grayscale(.8)}#wBook .sk.passive{border-style:dashed}#wBook .sk .pas{color:#9fe8a8}.sk-tag{font-style:normal;font-size:10px;padding:0 5px;margin-left:2px;color:#0b0e14;background:#9fe8a8}#wBook .mastery .bnodes{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:4px}#wSettings .set-sec{margin:12px 0 2px;padding:2px 8px;font-weight:600;color:var(--ran-hi);background:linear-gradient(90deg,rgba(255,220,140,.16),transparent);border-left:3px solid var(--ran-hi)}#wSettings .seg{display:flex;gap:4px}#wSettings .volrow{display:flex;align-items:center;gap:8px}#wSettings .volrow b{width:28px;text-align:right;color:var(--ran-hi)}#wSettings input.vol{width:150px;accent-color:#e0b85a}.potbar.picking .pot{outline:2px dashed var(--ran-hi);outline-offset:-3px;animation:pulse 1s infinite}.pot.empty{opacity:.55}#ui>.weather-veil{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none!important;z-index:0;transition:background .08s}#wBook{height:min(660px,calc(100vh - 40px));display:none;overflow:hidden}#wBook.on{display:flex;flex-direction:column}#wBook .book-body{flex:1;min-height:0;overflow-y:auto;padding-right:4px}.chat.ran-chat{left:50%;right:auto;bottom:calc(14px + var(--safe-b));transform:translate(-50%)}body.touch .chat.ran-chat{bottom:calc(14px + var(--safe-b));width:min(300px,34vw)}@media(max-width:560px)and (orientation:portrait){body.touch .chat.ran-chat{bottom:calc(290px + var(--safe-b));width:min(300px,70vw)}}.ui-toggle{position:absolute;display:none;left:calc(8px + var(--safe-l));bottom:calc(8px + var(--safe-b));width:34px;height:34px;padding:0;font-size:18px;z-index:5}body.touch .ui-toggle{display:block}body.ui-min .chat,body.ui-min .tut,body.ui-min .zone-name,body.ui-min .hud-tl>div:not(.hud-me),body.ui-min .party{display:none!important}body.ui-min .ui-toggle{display:block!important;z-index:80}body.ui-min .minimap{transform:scale(.7);transform-origin:top right;opacity:.8}.drag-aim{position:fixed;height:4px;margin-top:-2px;transform-origin:0 50%;background:linear-gradient(90deg,#fff3,#ffdc8ce6);pointer-events:none;z-index:50;border-radius:2px}.drag-aim.ok{background:linear-gradient(90deg,#fff3,#ff5a4a);box-shadow:0 0 8px #ff5a4a}.ev-bar{position:absolute;top:calc(48px * var(--ui-scale, 1));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:6px;padding:3px 10px;background:#080a10cc;border:1px solid #c9a24a;font-size:12px;color:#ffe6a0;pointer-events:none;z-index:3}.ev-bar b{color:#ffcf4a;letter-spacing:1px}.ev-gauge{width:160px;height:9px;background:#0009;border:1px solid #6b5a30}.ev-gauge i{display:block;height:100%;background:linear-gradient(90deg,#c98a1a,#ffd75a);transition:width .3s}.ev-bar.boost{border-color:#6fd0ff;color:#cdefff;box-shadow:0 0 12px #50b4ff99;animation:pulse 1.2s infinite}.ev-bar.boost b{color:#8fe0ff}.ev-bar.boost .ev-gauge i{background:linear-gradient(90deg,#2a7fd0,#8fe8ff)}.veh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;max-height:60vh;overflow:auto;margin-top:8px}.veh-card{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px;background:#00000059;border:1px solid rgba(255,255,255,.1);text-align:center;font-size:12px}.veh-card img{width:96px;height:96px;object-fit:contain}.veh-card.sel{border-color:var(--ran-hi);box-shadow:0 0 0 1px var(--ran-hi) inset}.veh-card .btn{margin-top:4px;width:100%}.mount-btn{position:absolute;display:none;left:calc(48px + var(--safe-l));bottom:calc(8px + var(--safe-b));width:34px;height:34px;padding:0;font-size:18px;z-index:5}body.touch .mount-btn.has{display:block}.mount-btn.on{box-shadow:0 0 0 2px var(--ran-hi) inset}.veh-own{display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:4px}.veh-own .cell{position:relative}.veh-own .cell img{width:100%;height:100%;object-fit:contain}.veh-own .cell b{position:absolute;right:2px;bottom:0;color:var(--ran-hi);font-size:11px}.dslot img.ic{width:100%;height:100%;object-fit:contain}.ev-bar{top:228px;left:auto;right:calc(10px + var(--safe-r));transform:none;width:158px;box-sizing:border-box;padding:2px 6px;gap:5px;font-size:11px}.ev-bar b{font-size:10px;letter-spacing:0}.ev-gauge{flex:1;width:auto;height:7px}.ev-bar span{white-space:nowrap}.auto-badge{top:256px!important}@media(max-width:760px),(max-height:500px){.ev-bar{top:172px;width:110px;font-size:10px}.ev-bar b{display:none}.auto-badge{top:196px!important}}.ev-form{display:flex;flex-wrap:wrap;gap:6px 12px}.ev-form label{display:flex;align-items:center;gap:4px;font-size:12px}.ev-form .field{width:64px}.auto-buffs{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:4px}.auto-buffs .choice{font-size:12px;padding:4px}.buff .buff-d{display:block;font-size:9px;color:#ffd27a;opacity:.9;white-space:nowrap}.chat-send,.chat-close{display:none}body.touch .ran-chat.typing{position:fixed;top:calc(6px + var(--safe-t, 0px));bottom:auto!important;left:50%;transform:translate(-50%);width:min(560px,94vw)!important;z-index:60}body.touch .ran-chat.typing .chat-log{height:min(34vh,220px)!important;font-size:13px}body.touch .ran-chat.typing .chat-in{display:flex}body.touch .ran-chat.typing .chat-in input{display:block;flex:1;min-width:0;font-size:16px;padding:8px}body.touch .ran-chat.typing .chat-in input.to{flex:0 0 76px}body.touch .ran-chat.typing .chat-in select.chan{font-size:14px}body.touch .ran-chat.typing .chat-send,body.touch .ran-chat.typing .chat-close{display:block;padding:0 12px;font-size:14px;min-height:38px}body.touch .ran-chat:not(.typing) .chat-log{cursor:pointer}.buffs{display:flex;flex-wrap:wrap;gap:3px;margin-top:4px;max-width:250px}.bf{position:relative;width:26px;height:30px;display:flex;flex-direction:column;align-items:center}.bf>img,.bf>b{width:26px;height:26px;border:1px solid #6b6152;background:#11141a;box-sizing:border-box}.bf>b{display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:#ffe9a8;overflow:hidden}.bf.bf-st>b{border-color:currentColor}.bf.bf-q{width:auto;min-width:26px}.bf.bf-q>img.q{width:auto;height:18px;margin:4px 2px;border:0;background:none}.bf>i{display:block;width:100%;height:3px;margin-top:1px;background:#000000b3}.bf>i>u{display:block;height:100%;width:100%;background:linear-gradient(90deg,#e0a43a,#ffe08a);text-decoration:none;transition:width .3s linear}.bf:after{content:attr(data-left);position:absolute;right:0;bottom:4px;font-size:9px;line-height:1;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000;pointer-events:none}.bf.ending>img,.bf.ending>b{animation:bf-blink .6s steps(2) infinite}@keyframes bf-blink{50%{opacity:.35}}.qbox-banner{position:fixed;left:50%;top:26%;transform:translate(-50%);pointer-events:none!important;z-index:70;animation:qb-pop 2.6s ease-out forwards}.qbox-banner img{max-width:80vw;height:auto;filter:drop-shadow(0 2px 4px #000)}.qbox-banner b{font-size:40px;color:#ffd27a;text-shadow:0 2px 4px #000}@keyframes qb-pop{0%{opacity:0;transform:translate(-50%) scale(1.6)}12%{opacity:1;transform:translate(-50%) scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%) translateY(-20px)}}.qbox-picks img{height:auto;max-height:18px;max-width:100%;object-fit:contain}body.touch .ran-chat.typing{background:#06080ceb;border:1px solid #5a5142;box-shadow:0 4px 16px #0009}body.touch .ran-chat.typing .chat-log{background:none}.buff-row{display:flex;align-items:flex-start;gap:4px;margin-top:4px}.buff-row .buffs{margin-top:0;flex:1}.qbtn{position:relative;display:flex;gap:1px;cursor:pointer;flex:0 0 auto;pointer-events:auto}.qbtn .qi{width:30px;height:30px;display:block;opacity:.55}.qbtn.on .qi{opacity:1}.qbtn .qg{width:6px;height:30px;background:#000000bf;border:1px solid #4c4538;box-sizing:border-box;display:flex;align-items:flex-end}.qbtn .qg u{display:block;width:100%;height:0;background:linear-gradient(0deg,#e8402a,#f3d33a 50%,#5fd35a);text-decoration:none;transition:height .3s linear}.qbtn .ql{position:absolute;left:0;top:0;width:30px;height:30px;display:none;pointer-events:none}.qbtn.locked .ql{display:block}body.touch .skillbar.ring{display:block;width:330px;height:330px;zoom:calc(var(--ui-unzoom, 1) * .9);right:calc(4px + var(--safe-r));bottom:calc(4px + var(--safe-b));pointer-events:none;transform-origin:100% 100%}body.touch .skillbar.ring>*{pointer-events:auto}body.touch .skillbar.ring .slot{position:absolute;width:60px;height:60px;border-radius:50%!important;border:2px solid #8a7a5a!important;border-image:none!important;padding:0;font-size:0;overflow:hidden;background:radial-gradient(circle at 50% 35%,#2a2f3a,#0a0d13 75%);box-shadow:0 2px 6px #0009}body.touch .skillbar.ring .slot .ic,body.touch .skillbar.ring .slot .ic img{border-radius:50%}body.touch .skillbar.ring .slot.empty{opacity:.5}body.touch .skillbar.ring .slot .key{top:auto;bottom:1px;left:50%;transform:translate(-50%);font-size:9px;padding:0 3px;border-radius:6px}body.touch .skillbar.ring .slot .cd{border-radius:50%;font-size:14px}body.touch .skillbar.ring .slot .rm{display:none}body.touch .skillbar.ring .slot.atk{width:100px;height:100px;font-size:16px;font-weight:600;display:grid;place-items:center;border:3px solid var(--ran-hi, #e0a43a)!important}body.touch .skillbar.ring .sk-pages{position:static;display:block}body.touch .skillbar.ring .sk-pages .btn.mini{position:absolute;width:34px;height:30px;min-width:0;padding:0;font-size:11px;display:grid;place-items:center;flex:none}body.touch .potbar{bottom:calc(306px + var(--safe-b))}@media(orientation:landscape)and (max-height:500px){body.touch .skillbar.ring{transform:none;zoom:calc(var(--ui-unzoom, 1) * .8)}body.touch .potbar{bottom:calc(4px + var(--safe-b));right:calc(246px + var(--safe-r))}body.touch .chat.ran-chat:not(.typing){bottom:calc(62px + var(--safe-b))}}@media(max-width:560px)and (orientation:portrait){body.touch .chat.ran-chat:not(.typing){bottom:calc(366px + var(--safe-b))}}.ran-chat .chat-hide{order:10;cursor:pointer;font-style:normal;font-size:10px;color:var(--ran-dim);padding:2px 6px;background:#0000008c;border:1px solid #4c4538;margin-left:1px}.ran-chat .chat-hide:hover{color:#ffb0b0}.chat.chat-hidden{display:none!important}.chat-show{position:absolute;left:50%;transform:translate(-50%);bottom:calc(6px + var(--safe-b));padding:3px 10px;font-size:12px;z-index:6;opacity:.85;pointer-events:auto}body.touch .chat-show{left:calc(50px + var(--safe-l));transform:none;bottom:calc(8px + var(--safe-b))}.ro-head{color:#9fd7ff;font-size:11px;margin-top:3px;grid-column:1 / -1}.ro{color:#7fe9a8}.ro.neg{color:#ff7a6a}.stale-bar{position:fixed;top:calc(8px + var(--safe-t, 0px));left:50%;transform:translate(-50%);z-index:90;padding:8px 16px;background:#781414eb;color:#fff;border:1px solid #ff8a7a;font-size:14px;cursor:pointer;pointer-events:auto!important}.iic.rar1{box-shadow:inset 0 0 0 1px #7fe9a8}.iic.rar2{box-shadow:inset 0 0 0 1px #c79bff,0 0 6px #c79bff80}.iic.rar3{box-shadow:inset 0 0 0 1px #ffb400,0 0 8px #ffb40099}.iic .rs{position:absolute;left:1px;bottom:0;font-size:8px;line-height:1;text-decoration:none;color:#ffd27a;text-shadow:0 0 2px #000;letter-spacing:-1px;pointer-events:none}.iic.rar1 .rs{color:#7fe9a8}.iic.rar2 .rs{color:#c79bff}.iic.rar3 .rs{color:#ffb400}.rar-line{font-size:12px;font-weight:600;margin:2px 0}.worldmap .win-head .wm-zoom{margin-left:auto;display:flex;gap:3px;margin-right:6px}.worldmap .win-head .wm-zoom .btn.mini{min-width:30px;padding:2px 8px;font-size:14px;line-height:1.2}.win.worldmap{width:min(1100px,calc(100vw - 16px),calc(100vh - 20px));max-width:none}.win.worldmap canvas{width:min(100%,calc(100vh - 118px));height:auto}@media(max-width:760px),(max-height:500px){.win.worldmap{width:calc(100vw - 12px)}.win.worldmap canvas{width:min(100%,calc(100vh - 100px))}}.worldmap .win-head .wm-zoom .btn.mini{color:var(--ran-hi);font-weight:700}.zone-next{font-size:11.5px;color:#ffd27a;margin-top:2px;cursor:pointer;text-shadow:0 1px 2px #000;pointer-events:auto}.zone-next:hover{color:#fff}.vipname{background:var(--g, linear-gradient(90deg, #ffd27a, #ff6a6a, #ffd27a));background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;animation:vipflow 3s linear infinite;font-weight:600;filter:drop-shadow(0 1px 1px #000)}@keyframes vipflow{0%{background-position:0% 50%}to{background-position:300% 50%}}.namefx-pick{display:flex;gap:4px;align-items:center}.namefx-pick input[type=color]{width:28px;height:24px;padding:0;border:1px solid #5a5142;background:none}.online-tag{background:none!important;font-size:13px;color:#e8e2d0;text-shadow:0 0 3px #000,0 1px 2px #000;letter-spacing:.2px}.online-tag b{color:#ffd27a;font-weight:700;font-size:14px}.online-tag .sep{color:#8a8070;margin:0 2px}.vipname,.plate .vipname,.chat-log .vipname{text-shadow:none!important;filter:drop-shadow(0 1px 0 rgba(0,0,0,.9)) drop-shadow(0 0 2px rgba(0,0,0,.7))}.plate .ptitle{display:block;font-size:10px;color:#ffd27a;font-weight:600;letter-spacing:.2px}.chat-log .ctitle{font-style:normal;color:#ffd27a;font-size:11px}select.ran-select{font:inherit;font-size:12.5px;color:var(--ran-hi);background:#0009 url(/ui/tab_on.png) no-repeat right;border:1px solid #6b6152;padding:3px 22px 3px 8px;min-width:150px;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#e0a43a 50%),linear-gradient(135deg,#e0a43a 50%,transparent 50%);background-position:calc(100% - 13px) 55%,calc(100% - 8px) 55%;background-size:5px 5px,5px 5px}select.ran-select option,select.ran-select optgroup{background:#0d121a;color:#f1ede2}body.touch .skillbar.ring .slot .key{font-size:10px}body.touch .skillbar.ring .sk-pages .btn.mini{width:38px;height:32px;font-size:12px}@media(orientation:portrait){body.touch .potbar{bottom:calc(304px * var(--ui-unzoom, 1) + var(--safe-b))}body.touch .chat.ran-chat:not(.typing){bottom:calc(370px * var(--ui-unzoom, 1) + var(--safe-b))!important}}.hud-me.panel,.hud-target.panel{border:0!important;border-image:none!important;background:none!important;box-shadow:none!important;padding:2px 4px!important}.hud-me .name,.hud-target .name,.hud-target,.hud-me{text-shadow:0 1px 2px #000,0 0 3px #000}.hud-me .bar,.hud-target .bar{box-shadow:0 1px 3px #000000b3}#wPShop .ps-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:6px;flex-direction:unset}#wPShop .ps-row{flex-direction:column;align-items:center;text-align:center;gap:4px;padding:8px 6px}#wPShop .ps-row>div:not(.iic){align-items:center}#wPShop .ps-row .iic{width:48px;height:48px}#wPShop .ps-row b{font-size:12px;line-height:1.25}#wPShop .ps-row small{font-size:10.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}#wPShop .ps-row .btn{width:100%;margin-top:auto}@media(max-width:560px){#wPShop .ps-list{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}}
