/* Tiên giới: đêm xanh, ngọc và vàng; tất cả canvas trong panel dùng vị trí riêng. */
[hidden]{display:none!important}
#account-screen{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px;box-sizing:border-box;background:radial-gradient(ellipse at 25% 30%,#23495b88,transparent 48%),radial-gradient(ellipse at 80% 80%,#6b488755,transparent 50%),linear-gradient(135deg,#08121e,#15232f);overflow:auto;touch-action:pan-y}
.account-card{position:relative;width:min(420px,100%);box-sizing:border-box;padding:38px;border:1px solid #ad956b66;border-radius:24px;background:linear-gradient(145deg,#192a38f5,#0d1724f5);box-shadow:0 30px 100px #0007,inset 0 1px #fff1}
.account-kicker{font:11px sans-serif;letter-spacing:4px;color:#d4bb8a}.account-card h1{font-size:31px;font-weight:normal;margin:20px 0 12px;color:#f4e5c8}.account-card p{font:13px/1.8 sans-serif;color:#a4b8c8}.account-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:26px 0 22px}.account-tabs button{border:1px solid #344657;border-radius:9px;background:#142330;color:#9bafbf}.account-tabs .active{background:#d7bd88;color:#17202b;border-color:#d7bd88}.account-card label{display:block;font:10px sans-serif;letter-spacing:1.4px;color:#c9d7e1;margin:18px 0}.account-card input{display:block;width:100%;box-sizing:border-box;padding:14px 12px;margin-top:9px;border:1px solid #3a4e60;border-radius:10px;color:#fff;background:#0c1925;font:14px sans-serif;user-select:text}.account-card input:focus{outline:2px solid #89cfd0;outline-offset:2px}.account-submit{width:100%;border-radius:10px;background:linear-gradient(110deg,#dfc494,#b99d6d);border:0;color:#13212d;font-weight:bold;margin-top:7px}.account-card small{font:11px/1.6 sans-serif;color:#788e9f}#account-error{min-height:24px;color:#ffb9a6}#account-badge{position:fixed;right:12px;top:12px;z-index:7;display:flex;align-items:center;gap:10px;padding:6px 10px;background:#101f2ee8;border:1px solid #436071;border-radius:10px;font:12px sans-serif;color:#abd8d7}#account-badge button{font:11px sans-serif;padding:6px 9px;min-height:30px;border-radius:6px;border-color:#536878;background:#172b3b}#db-status{font:12px sans-serif;color:#9ab6c5}
#hud{background:linear-gradient(135deg,#122633ee,#0d1928ee);border-color:#69958d80;border-radius:14px;padding:12px 14px;box-shadow:0 8px 28px #0005,inset 0 1px #fff1}#hud b{font-size:14px;color:#ebd3a6}.bar{background:#071322;border:1px solid #263d51;height:9px}.bar i{box-shadow:inset 0 2px #fff3,0 0 8px currentColor}#hp i{background:linear-gradient(90deg,#9d344e,#f88b86)}#mp i{background:linear-gradient(90deg,#207da0,#87e8ed)}#xp i{background:linear-gradient(90deg,#a77d3d,#f1d695)}#bt button{border-radius:9px;background:linear-gradient(#213343f5,#111f2cf5);border-color:#58728288;box-shadow:0 3px 10px #0004}#bt button:hover:not(:disabled){background:#34576a}.sk{border-radius:12px!important;box-shadow:0 4px 18px #0006,inset 0 1px #fff2}#world-dialog>section{background:linear-gradient(145deg,#172b3af7,#101b29fa);border-color:#6c879788;border-radius:18px;box-shadow:0 24px 90px #0008}#world-dialog button{border-radius:8px;border-color:#506776;background:#1a3040}#world-dialog h2{color:#f1d7a8}
#world-dialog .inventory-dialog{width:min(920px,94vw)!important;max-width:920px!important;padding:24px!important;box-sizing:border-box;overflow:auto;max-height:92dvh;touch-action:pan-y}.inventory-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:24px}.inventory-layout h3{font:14px sans-serif;letter-spacing:1px;color:#cddce7;margin:8px 0 18px}.gear-panel{background:radial-gradient(ellipse,#36536644,transparent 70%),#0d1a2677;border:1px solid #536b7b55;border-radius:14px;padding:16px;box-sizing:border-box}.gear-panel>h3{text-align:center;color:#ead1a1}.paper-doll{position:relative;height:280px}.gear-preview{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:contain;pointer-events:none}.item-cell{position:relative!important;box-sizing:border-box;padding:7px!important;min-width:0;min-height:0!important;aspect-ratio:1;border:1px solid #405363!important;border-radius:10px!important;background:linear-gradient(145deg,#243948,#0c1723)!important;display:flex;align-items:center;justify-content:center;touch-action:none;transition:border-color .15s,box-shadow .15s,transform .15s}.item-cell.occupied{border-color:var(--rarity)!important;box-shadow:inset 0 0 15px color-mix(in srgb,var(--rarity) 12%,transparent)}.item-cell.occupied:hover{transform:translateY(-2px);box-shadow:0 0 16px color-mix(in srgb,var(--rarity) 25%,transparent)}.item-cell img{width:80%;height:80%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--rarity) 40%,transparent))}.item-cell.selected,.item-cell.drop-over{outline:2px solid #fae4ad;outline-offset:2px}.gear-slot{position:absolute!important;width:66px;height:66px;aspect-ratio:auto}.gear-slot small{position:absolute;bottom:-19px;white-space:nowrap;font:10px sans-serif;color:#97adb9}.gear-0,.gear-1,.gear-2{left:0}.gear-3,.gear-4,.gear-5{right:0}.gear-0,.gear-3{top:8px}.gear-1,.gear-4{top:100px}.gear-2,.gear-5{top:192px}.gear-stats{font:12px/1.8 sans-serif;color:#9bb4c4;text-align:center;margin-top:10px}.bag-toolbar{display:flex;align-items:center;justify-content:space-between}.bag-toolbar button{font:11px sans-serif;padding:6px 12px;min-height:30px}.bag-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.item-qty{position:absolute;bottom:4px;right:6px;color:white;text-shadow:0 1px 3px #000;font:bold 11px sans-serif}.cell-index{font:11px sans-serif;color:#526a7a}.item-details{min-height:110px;padding:14px;margin-top:15px;border:1px solid #425b6e55;border-radius:10px;background:#0d1a2677;font:12px/1.7 sans-serif;color:#9cb1c1}.item-details h4{font-size:14px;margin:0 0 8px}.item-details p{margin:0 0 12px}.item-actions{display:flex;gap:8px;flex-wrap:wrap}.item-actions button,.quick-shop button{font:12px sans-serif;min-height:34px;padding:7px 10px}.bag-resources{color:#d3bc91;font:11px/1.8 sans-serif;margin:14px 0}.quick-shop{display:flex;gap:8px;flex-wrap:wrap}.item-drag-ghost{position:fixed!important;width:60px!important;height:60px!important;transform:translate(-50%,-50%);z-index:200;pointer-events:none;opacity:.8;background:#213b4c;border:2px solid #e5d6ac;border-radius:10px;display:grid;place-items:center}.item-drag-ghost img{width:45px;height:45px;object-fit:contain}.item-drag-ghost small{display:none}
#online-panel{position:fixed;left:12px;bottom:64px;z-index:6;width:285px;border:1px solid #45627588;border-radius:12px;background:#0d1c2be8;box-shadow:0 8px 25px #0005;font:12px sans-serif;overflow:hidden}#online-panel header{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;color:#85d6ba}#online-panel button{font:11px sans-serif;min-height:28px;padding:4px 9px;border:1px solid #486171;border-radius:6px;background:#193044}#chat-messages{height:105px;overflow:auto;padding:0 10px;touch-action:pan-y;user-select:text}#chat-messages p{font:11px/1.6 sans-serif;color:#cfdae4;margin:4px 0;overflow-wrap:anywhere}#chat-messages b{color:#d9c294}#chat-form{display:flex;gap:5px;padding:8px}#chat-input{width:100%;min-width:0;padding:8px;background:#081420;border:1px solid #385466;border-radius:6px;color:white;font:11px sans-serif;user-select:text}.emote-buttons{display:flex;gap:5px;padding:0 8px 8px}#online-panel.collapsed #chat-messages,#online-panel.collapsed #chat-form,#online-panel.collapsed .emote-buttons{display:none}
@media(max-width:700px){#account-badge{right:8px;top:8px;font-size:10px;max-width:145px}#hud{width:180px;padding:9px}#world-dialog .inventory-dialog{padding:17px!important;max-height:94dvh}.inventory-layout{grid-template-columns:1fr;gap:14px}.gear-panel{padding:10px}.paper-doll{height:190px;max-width:290px;margin:auto}.gear-slot{width:49px;height:49px}.gear-0,.gear-3{top:0}.gear-1,.gear-4{top:65px}.gear-2,.gear-5{top:130px}.gear-preview{height:190px!important}.gear-panel>h3{margin:0 0 8px}.bag-grid{gap:6px}.item-details{min-height:85px}.gear-stats{font-size:11px}.inventory-layout h3{font-size:12px}#online-panel{left:8px;bottom:260px;width:190px}#chat-messages{height:70px}#chat-input{font-size:12px}#online-status{font-size:10px}.account-card{padding:26px}.account-card h1{font-size:27px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
#journey-objective{position:fixed;top:68px;right:12px;z-index:5;width:230px;box-sizing:border-box;padding:14px 16px;border:1px solid #987c4b55;border-radius:12px;background:linear-gradient(130deg,#172b3be8,#0e1c2be8);box-shadow:0 6px 20px #0004;pointer-events:none}#journey-objective small{display:block;font:9px sans-serif;letter-spacing:2px;color:#c3aa7b;margin-bottom:8px}#journey-objective b{display:block;font-size:14px;color:#edd7ac}#journey-objective span{display:block;font:11px/1.7 sans-serif;color:#9fb5c3;margin-top:6px}@media(max-width:700px){#journey-objective{top:55px;right:8px;width:145px;padding:9px}#journey-objective b{font-size:11px}#journey-objective span{font-size:9px}#journey-objective small{font-size:8px;margin-bottom:5px}}
#world-minimap{top:62px!important}#world-region{top:195px!important}#journey-objective{top:235px}@media(max-width:700px){#world-minimap{top:55px!important}#world-region{top:145px!important}#journey-objective{top:175px}}
@media(max-width:700px){body #arena-status{top:245px!important;max-width:215px!important}}