@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap');
:root{--gold:#d7b969}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#142820;color:#f1e4bf;font-family:'Noto Sans Thai',Tahoma,sans-serif;font-size:12px}button{font:inherit;color:inherit;cursor:pointer;touch-action:none}button:focus-visible{outline:2px solid #fff0a5;outline-offset:4px}#viewport{position:relative;width:100vw;height:100dvh;overflow:hidden}#game{width:100%;height:100%;display:block;image-rendering:pixelated}.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 110px #10271e77}.ornate{background:linear-gradient(145deg,#203957f5,#101c33f2);border:2px solid #b29a58;box-shadow:0 0 0 2px #102238,0 0 0 3px #5f5739,inset 0 0 0 2px #344c64,0 6px 16px #0006;border-radius:6px}.ornate:before,.ornate:after{content:'◆';position:absolute;color:#e7c775;font-size:13px;top:-10px;text-shadow:0 1px #081528}.ornate:before{left:8px}.ornate:after{right:8px}.playerhud{position:absolute;top:18px;left:18px;width:335px;padding:11px;display:flex;gap:10px;flex-wrap:wrap}.portrait{width:67px;height:87px;border:1px solid #e0bf69;background:linear-gradient(#304a5a,#142431);position:relative}.portrait canvas{width:100%;height:100%;image-rendering:pixelated}.portrait span{position:absolute;bottom:-9px;left:13px;background:#213b52;color:#eed07f;font-size:10px;padding:0 4px}.playerstats{flex:1}.name{font-size:12px;color:white;border-bottom:1px solid #65809955;padding-bottom:4px}.name b{float:right;color:#f3ca6d;font-size:11px}.classline{display:flex;justify-content:space-between;font-size:10px;color:#a4d8eb;margin:5px 0}.classline #rank{font-size:8px;color:#d7b969;max-width:90px;overflow:hidden;white-space:nowrap}label{display:flex;align-items:center;gap:5px;margin:6px 0;position:relative}label>b{font-size:9px;width:25px;color:#c1d7e4}label>span{position:absolute;right:4px;top:0;font-size:8px;text-shadow:1px 1px #000}.bar{height:11px;background:#050e21;border:1px solid #031122;border-radius:6px;overflow:hidden;flex:1;box-shadow:0 1px #47647c}.bar i{display:block;height:100%;width:100%;background:linear-gradient(#ff9e9a,#d83f54 50%,#a8253c);transition:width .2s}.xp i{background:linear-gradient(#bdedac,#4ca266)}.wallet{color:#e5c573;font-size:10px}.killlabel{float:right;color:#9bb8c8}.hudfoot{width:100%;border-top:1px solid #b5a76b55;padding-top:5px;font-size:9px;letter-spacing:1px}.hudfoot span{float:right;letter-spacing:0;color:#99afbf}.menubar{position:absolute;top:12px;right:19px;display:flex;gap:14px}.menubar button{background:none;border:0;padding:0;min-width:43px;font-size:10px;text-shadow:0 2px 3px #000,1px 0 #000;font-weight:700}.menubar button>span{display:grid;place-items:center;width:37px;height:37px;margin:0 auto 3px;font-size:23px;background:radial-gradient(#3d6584,#142841 70%);border:1px solid #bea25c;box-shadow:0 0 0 2px #192b32;border-radius:11px;color:#f1d187}.menubar button:hover span{filter:brightness(1.4)}.minimap{position:absolute;right:20px;top:86px;width:184px;padding:4px;text-align:center}.minimap canvas{width:100%;height:105px;image-rendering:pixelated;display:block}.minimap #area{font-size:11px;margin-top:4px}.minimap small{font-size:9px;color:#95d8b6}.quest{position:absolute;right:19px;top:251px;width:207px;padding:13px 12px;background:linear-gradient(90deg,#182a39db,#15282dc9);border-left:2px solid #d7b969;border-radius:3px;text-shadow:0 1px #000}.questhead{color:#edce83;font-size:11px}h3{font-size:12px;margin:8px 0}.quest p{color:#c3d0c9;font-size:10px;line-height:1.8;margin:4px 0}#questprogress{color:#a9e5ad;font-size:10px;margin-top:8px}.worldtitle{position:absolute;top:22px;left:50%;transform:translateX(-50%);text-align:center;text-shadow:0 2px 5px #153927,0 0 10px #173625}.worldtitle span{font-size:10px;letter-spacing:3px;color:#e4e3c9}.worldtitle h1{font-size:23px;margin:2px 0;font-weight:600;color:#fff0c9}.worldtitle div{font-size:9px;color:#e5c977;letter-spacing:2px}#toast{position:absolute;top:24%;left:50%;transform:translateX(-50%);padding:11px 24px;background:linear-gradient(90deg,transparent,#152639ed 15%,#152639ed 85%,transparent);border-top:1px solid #d6c48b88;border-bottom:1px solid #d6c48b88;text-align:center;pointer-events:none;opacity:0;width:max-content;max-width:70%;color:#f7e8bd;transition:opacity .2s;font-size:13px;z-index:3}.joystick{position:absolute;bottom:46px;left:34px;width:150px;height:150px;border:3px double #e2bb5f;border-radius:50%;background:radial-gradient(#3c6689 25%,#142d50 28%,#254765 51%,#122b49 53%,#244762 69%,#10223c 71%);box-shadow:0 0 0 3px #112637,0 5px 15px #0006}.joystick button{position:absolute;z-index:1;border:0;background:transparent;color:#fbe5a9;font-size:13px;font-weight:700;width:44px;height:44px;text-shadow:1px 2px #000}.joystick button:active{background:#97dbea44;border-radius:50%}.up{top:-8px;left:50px}.down{bottom:-8px;left:50px}.left{left:-8px;top:50px}.right{right:-8px;top:50px}.joycenter{position:absolute;inset:41px;border:2px solid #e9c875;border-radius:50%;display:grid;place-items:center;font-size:46px;color:#d4ffff;background:radial-gradient(#78edff,#2367ae 60%,#153a6c);box-shadow:0 0 13px #55bce780}.compass{position:absolute;top:-21px;left:61px;color:#f2ce77;font-size:23px}.gamelog{position:absolute;bottom:35px;left:50%;transform:translateX(-50%);width:410px;max-width:42vw;padding:0 9px;border-color:#7d8f91;background:linear-gradient(#122439d9,#122236e8)}.gamelog:before,.gamelog:after{display:none}.logtabs{display:flex;align-items:center;gap:15px;border-bottom:1px solid #607186;font-size:10px;height:28px}.logtabs b{color:#d8e9f8}.logtabs>span{color:#92b1be;margin-left:auto;font-size:9px}.logtabs button{background:#273f58;border:1px solid #78899c;border-radius:3px;font-size:12px;padding:0 7px}#logLines{height:75px;overflow:auto;padding:4px 0;scrollbar-width:thin}#logLines p{margin:3px 0;font-size:10px;color:#d0d7dc;line-height:1.5}time{color:#8bcafa;margin-right:5px}.loghint{border-top:1px solid #5d738355;font-size:8px;color:#9eb1be;padding:5px 0;text-align:center}.actions{position:absolute;right:28px;bottom:48px;width:206px;height:163px}.actions button{position:absolute;background:radial-gradient(circle at 40% 30%,#476c94,#143252 65%,#0b1c34 67%);border:3px double #e6c16b;border-radius:50%;box-shadow:0 0 0 2px #112b43,0 4px 9px #0008;text-shadow:0 2px #000;font-size:10px;display:flex;flex-direction:column;justify-content:center;align-items:center}.actions button:active{filter:brightness(1.6)}.actions small{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:#132e48;color:#ffdf8c;border:1px solid #bca166;border-radius:3px;padding:0 4px;font-size:9px}.actions span{font-size:30px;line-height:1.2;color:#dcefff}.attack{width:99px;height:99px;right:0;bottom:0}.attack span{font-size:40px}.skill{width:76px;height:76px;left:19px;top:0}.skill b{font-size:9px;font-weight:400}.interact{width:62px;height:62px;left:0;bottom:0}.interact span{font-size:25px}#cooldown{position:absolute;inset:0;border-radius:50%;display:none;align-items:center;justify-content:center;background:#09172dbb;font-size:25px;color:white;font-style:normal}footer{position:absolute;bottom:0;left:0;width:100%;height:24px;background:#0a1924cb;border-top:1px solid #8ba08155;display:flex;align-items:center;gap:20px;padding:0 15px;font-size:9px;color:#a9bdc4}footer b{letter-spacing:2px;color:#ddc684}footer span:last-child{margin-left:auto}.hidden{display:none!important}.overlay{position:fixed;inset:0;background:#07121bb8;backdrop-filter:blur(4px);display:grid;place-items:center;z-index:10;padding:20px}.dialog{position:relative;max-width:480px;width:100%;padding:32px;text-align:center;color:#dce7e8}.dialog h2{color:#f2d68c;font-size:23px}.dialog p{font-size:12px;line-height:1.9;color:#bdcbd3}.dialog button{padding:9px 18px;border:1px solid #a99259;background:#243e58;border-radius:4px}.dialog .primary{display:block;width:100%;margin:22px 0 10px;background:linear-gradient(#e8cc85,#ab894a);color:#182c3b;font-weight:700}.dialog .close{position:absolute;right:12px;top:8px;border:0;background:none;padding:0;font-size:23px}.eyebrow{letter-spacing:3px;color:#b8a475;font-size:10px}#sigil{font-size:68px;color:#d7bc75;text-shadow:0 0 30px #e3bf6777}#pool{font-size:11px;color:#ebce91}#detailBody{font-size:12px;line-height:2;color:#cad7df;text-align:left}#reset{margin-top:15px;font-size:10px}.gamelog.collapsed #logLines,.gamelog.collapsed .loghint{display:none}@media(max-width:1000px){.playerhud{transform:scale(.85);transform-origin:top left}.menubar{gap:8px}.worldtitle{top:160px;left:22px;transform:none;text-align:left}.worldtitle h1{font-size:17px}.worldtitle div{display:none}.quest{top:238px;width:180px}.joystick{transform:scale(.82);transform-origin:bottom left;left:20px}.actions{transform:scale(.85);transform-origin:bottom right;right:20px}.gamelog{max-width:40vw}.minimap{width:154px}.minimap canvas{height:90px}}@media(max-height:600px){.playerhud{transform:scale(.72)}.minimap{transform:scale(.72);transform-origin:top right;top:68px}.quest{display:none}.worldtitle{top:14px;left:50%;transform:translateX(-50%)}.worldtitle h1{font-size:15px}.menubar{transform:scale(.8);transform-origin:top right}.gamelog{bottom:30px}#logLines{height:42px}.joystick{transform:scale(.67);bottom:32px}.actions{transform:scale(.7);bottom:35px}}