@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&family=Marcellus&display=swap');
:root{font-family:'Noto Sans Thai',sans-serif;color:#fbf6e7;font-size:14.95px;--gold:#e5ca8c;--line:#f4dfac45}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#172a26}button,input,label{font:inherit}button,.import{cursor:pointer;color:inherit;background:#ffffff10;border:1px solid var(--line);border-radius:8px;padding:10px 15px;transition:background .2s,transform .2s,box-shadow .2s}button:hover,.import:hover{background:#f9dfa630;box-shadow:0 0 20px #e0c88915;transform:translateY(-2px)}button:active{transform:scale(.96)}button:disabled{opacity:.38;cursor:default;transform:none}button:focus-visible,a:focus-visible{outline:2px solid #ffe5a2;outline-offset:3px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}small{font-size:11.5px}kbd{font:11.5px sans-serif;border:1px solid #fff5;border-radius:4px;padding:2px 5px;color:#fff9}.game-shell{position:relative;width:100%;height:100dvh;isolation:isolate;overflow:hidden}#world{display:block;width:100%;height:100%;outline:none;touch-action:none;image-rendering:pixelated}.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 150px #091d2640;background:linear-gradient(#142e333b,transparent 25%,transparent 65%,#102c335c)}.hud-top{position:absolute;top:24px;left:28px;right:28px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.hud-top>*{pointer-events:auto}.map-cluster{display:flex;align-items:center;gap:18px}#minimap{width:144px;height:96px;border:2px solid #efe4c57a;outline:5px solid #20383055;border-radius:48%;box-shadow:0 8px 30px #0c272555}.zone{text-shadow:0 2px 8px #14342b}.zone small{letter-spacing:3px;color:#fff5d0}.zone h1{font:29.9px Marcellus,serif;margin:4px 0}.zone span{font-size:12.65px}.hud-top nav{display:flex;gap:9px;align-items:center}.hud-top nav button{width:46px;height:46px;background:#193435a6;backdrop-filter:blur(14px);border-radius:50%;padding:0;font-size:26.45px;position:relative}.hud-top nav small{position:absolute;bottom:-5px;right:-2px;font-size:10.35px;background:#263d3b;padding:1px 5px;border-radius:4px}.gold-chip{background:#193435a6;padding:8px 16px;border:1px solid var(--line);border-radius:22px;color:var(--gold);margin-right:6px}.quest{position:absolute;top:160px;left:30px;width:258px;padding:18px 20px;border-left:2px solid var(--gold);background:linear-gradient(90deg,#193832cb,#19383210);text-shadow:0 1px 4px #09221c}.eyebrow{font-size:10.35px;letter-spacing:2px;color:var(--gold)}.quest h2{font-size:18.4px;font-weight:500;margin:10px 0 6px}.quest p{font-size:12.65px;line-height:1.8;color:#f5f3ded4}.quest-progress{height:2px;background:#fff3;margin:13px 0 7px}.quest-progress i{display:block;height:100%;background:var(--gold);transition:width .5s}.quest>span{font-size:11.5px;color:#e9ddbb}.quest button{display:block;font-size:11.5px;border:0;padding:8px 0;background:none;color:var(--gold)}.player-hud{position:absolute;left:32px;bottom:56px;display:flex;gap:14px;align-items:center;pointer-events:none}.portrait{position:relative;width:78px;height:84px;border:1px solid var(--gold);border-radius:45% 45% 20% 20%;background:linear-gradient(#b1a38166,#30413bc4);box-shadow:0 0 0 5px #16392f55}.portrait canvas{width:80px;height:80px;image-rendering:pixelated}.portrait>span{position:absolute;bottom:-8px;left:18px;border-radius:8px;background:#f6e7bf;color:#304032;padding:1px 6px;font-size:11.5px}.vitals{width:240px}.player-name{margin-bottom:6px;font-size:16.1px;text-shadow:0 2px 4px #183c30}.player-name small{float:right;color:#f9e3ac}.bar{position:relative;background:#142826bf;border:1px solid #f7f0cf4d;border-radius:3px;margin-top:5px;overflow:hidden;height:17px}.bar i{display:block;height:100%;transition:width .18s}.bar span{position:absolute;inset:0;text-align:center;font-size:11.5px;text-shadow:0 1px 3px #0009}.hp i{background:linear-gradient(90deg,#749b4e,#c4de80)}.mp{height:13px}.mp i{background:linear-gradient(90deg,#507f9c,#b0d9e5)}.mp span{font-size:9.2px}.xp{height:3px;border:0}.xp i{background:var(--gold)}#xp-text{display:block;text-align:right;font-size:9.2px;color:#f7e5be;margin-top:3px}.actionbar{position:absolute;right:35px;bottom:51px}.actions{display:flex;gap:13px;align-items:center}.actions>button{position:relative;border-radius:50%;width:78px;height:78px;padding:7px;background:radial-gradient(circle at 35% 25%,#e4d5aa40,#143039dd);border:1px solid #ebd399a6;box-shadow:inset 0 0 0 4px #142d333d,0 8px 25px #122c2540;display:flex;align-items:center;justify-content:center;flex-direction:column}.actions>button:first-child{width:90px;height:90px}.actions span:not(.item-art){font-size:33.35px;line-height:1.1;color:#fff0c1}.actions b{font-size:10.35px;font-weight:400}.actions small{font-size:9.2px;color:var(--gold)}.actions kbd{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:#263c38}.actions .item-art{width:32px;height:32px}.world-bottom{position:absolute;left:32px;right:32px;bottom:14px;font-size:10.35px;color:#f8f1d5c9;pointer-events:none}.world-bottom span{margin:0 9px;color:var(--gold)}#save-status{float:right;font-size:9.2px;color:#f4efd194}#toast{position:absolute;bottom:168px;left:50%;transform:translate(-50%,12px);padding:12px 26px;border-radius:5px;border:1px solid var(--line);background:#192e32e8;backdrop-filter:blur(16px);opacity:0;transition:.3s;pointer-events:none;z-index:60;max-width:90%;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}#pickup{position:absolute;bottom:112px;left:50%;transform:translateX(-50%);background:#233b38de;color:#fae5ae;animation:float 2s ease-in-out infinite}#zone-banner{position:absolute;left:50%;top:29%;text-align:center;transform:translateX(-50%);pointer-events:none;opacity:0;width:80%;text-shadow:0 3px 20px #16312e}#zone-banner.show{animation:zone-in 3.5s both}#zone-banner strong{font:50.6px Marcellus,serif;display:block;padding:15px;border-bottom:1px solid #fff6}#zone-banner small{letter-spacing:5px}#zone-banner span{display:block;margin-top:12px}.overlay{position:absolute;inset:0;background:#0b21246b;backdrop-filter:blur(10px);display:grid;place-items:center;z-index:40;padding:28px;animation:veil .2s ease-out}.inventory-window,.menu-window{background:linear-gradient(135deg,#203b41f5,#142a31fa);border:1px solid #e4cb9755;border-radius:14px;box-shadow:0 30px 100px #071a2270;animation:window-in .3s ease-out}.inventory-window{width:min(100%,960px);max-height:94dvh;overflow:auto}.window-heading{display:flex;align-items:center;justify-content:space-between;padding:24px 30px;border-bottom:1px solid var(--line)}.window-heading small{letter-spacing:3px;color:var(--gold)}.window-heading h2{font-size:28.75px;font-weight:400;margin-top:5px}.window-heading button{border:0;font-size:29.9px;padding:0 10px}.inventory-toolbar{padding:18px 30px;display:flex;justify-content:space-between;gap:12px;align-items:center}.inventory-toolbar button{font-size:12.65px;border:0;padding:8px 14px}.inventory-toolbar .active{background:#ead8ad;color:#243b3c}.inventory-toolbar>span{font-size:11.5px;color:#bfcdca}.inventory-content{display:grid;grid-template-columns:1fr 270px;min-height:330px;padding:0 30px 24px;gap:24px}#inventory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-content:start}.inventory-slot{aspect-ratio:1;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:8px;background:linear-gradient(#d8e2dc18,#91a59c2b);padding:5px;border:1px solid #e6dbb324}.inventory-slot[data-rarity="2"]{background:linear-gradient(#bddca21a,#709f7145)}.inventory-slot[data-rarity="3"]{background:linear-gradient(#d1b7f924,#7969a74d)}.inventory-slot.selected{border-color:#ffe2a0;box-shadow:inset 0 0 0 1px #ffe2a066,0 0 18px #d9cda122}.inventory-slot.empty{pointer-events:none;background:#09242b22;border:1px solid #fff1}.inventory-slot small{font-size:10.35px;color:#dddcc5}.inventory-slot .count{position:absolute;right:6px;top:4px;color:#fff;font-size:11.5px}.inventory-slot .equipped-mark{position:absolute;left:6px;top:4px;color:#dbe8a9;font-size:11.5px}.item-art{display:block;width:64px;height:64px;background-image:url('assets/items-pixel.png');background-size:400% 200%;background-position:calc(var(--ix,0)*100%/3) calc(var(--iy,0)*100%);image-rendering:pixelated}.item-detail{border-left:1px solid var(--line);padding:10px 0 10px 24px;display:flex;align-items:flex-start;flex-direction:column}.item-detail>.item-art{width:130px;height:130px;align-self:center;filter:drop-shadow(0 8px 16px #09192250)}.item-detail h3{font-size:23px;margin:8px 0}.item-detail p{color:#bfcecd;line-height:1.9;font-size:13.8px;min-height:48px}.item-detail>span{font-size:11.5px;margin:12px 0;color:var(--gold)}#item-rarity{letter-spacing:3px;color:var(--gold)}.primary{background:#e9d7aa;color:#20373a;border-color:#ffefc9;border-radius:22px}.primary:hover{background:#fff0c5}.equipped{display:flex;flex-direction:column;gap:5px;border-top:1px solid var(--line);margin-top:20px;padding-top:15px;width:100%;font-size:12.65px}.equipped small,.equipped span{color:#b6cbc6;font-size:11.5px}.inventory-window footer{padding:15px 30px;border-top:1px solid var(--line);font-size:11.5px;color:#becdc8}.inventory-window footer span{float:right;color:var(--gold)}.menu-window{width:440px;max-width:100%;max-height:90dvh;overflow:auto;padding:32px;text-align:center}.menu-window h2{font-size:27.6px;font-weight:400;margin:12px 0}.menu-window p{color:#afc7bd;margin-bottom:20px}.menu-window>.primary{width:100%}.menu-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:20px 0;font-size:12.65px}.shop{margin-top:20px;border-top:1px solid var(--line);padding-top:20px;display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.shop small{width:100%;color:var(--gold);margin-bottom:5px}.shop button{font-size:12.65px}dialog{background:#203b40;color:#f9f1d8;border:1px solid var(--gold);border-radius:12px;max-width:480px;padding:30px;line-height:1.9}dialog::backdrop{background:#102a2bbf}dialog h2,dialog p{margin:15px 0}.close{float:right}.touch-pad{display:none}#loading{position:absolute;inset:0;background:#183430;display:grid;place-items:center;font-size:23px;z-index:100}a{color:var(--gold)}@keyframes veil{from{opacity:0}to{opacity:1}}@keyframes window-in{from{opacity:0;transform:translateY(15px) scale(.98)}to{opacity:1;transform:none}}@keyframes float{50%{margin-bottom:5px}}@keyframes zone-in{0%,100%{opacity:0;filter:blur(6px)}20%,75%{opacity:1;filter:blur(0)}}
@media(max-width:1000px){.vitals{width:170px}.player-hud{left:20px}.actions>button{width:65px;height:65px}.actions>button:first-child{width:75px;height:75px}.actionbar{right:22px}.quest{width:225px}.zone h1{font-size:25.3px}.hud-top{left:20px;right:20px}.inventory-content{grid-template-columns:1fr 220px}}
@media(max-width:650px){.hud-top{top:14px;left:14px;right:14px}.map-cluster{gap:10px}#minimap{width:74px;height:54px}.zone h1{font-size:18.4px}.zone small{font-size:8.05px;letter-spacing:1px}.zone span{font-size:9.2px}.hud-top nav{gap:5px}.hud-top nav button{width:34px;height:34px;font-size:21.85px}.gold-chip{display:none}.quest{top:96px;left:15px;width:200px;padding:10px}.quest p{display:none}.quest h2{font-size:13.8px;margin:6px 0}.quest-progress{margin:7px 0}.quest button{display:inline;margin-left:10px}.player-hud{left:15px;bottom:119px;gap:10px}.portrait{width:50px;height:57px}.portrait canvas{width:50px;height:55px}.portrait>span{left:5px;font-size:9.2px}.vitals{width:160px}.player-name{font-size:12.65px}.actionbar{bottom:37px;right:15px}.actions{gap:8px}.actions>button{width:55px;height:55px}.actions>button:first-child{width:65px;height:65px}.actions b{font-size:8.05px}.actions span:not(.item-art){font-size:25.3px}.world-bottom{left:15px;right:15px;font-size:8.05px}.world-bottom span{margin:0 3px}#save-status{display:none}#pickup{bottom:190px;font-size:11.5px}#toast{bottom:250px;font-size:12.65px}.overlay{padding:10px}.window-heading{padding:15px}.window-heading h2{font-size:23px}.inventory-toolbar{padding:10px}.inventory-toolbar button{font-size:10.35px;padding:8px}.inventory-content{grid-template-columns:1fr 145px;padding:0 10px 15px;gap:10px}#inventory-grid{grid-template-columns:repeat(3,1fr);gap:5px}.inventory-slot .item-art{width:44px;height:44px}.inventory-slot small{display:none}.item-detail{padding-left:10px}.item-detail>.item-art{width:85px;height:85px}.item-detail h3{font-size:17.25px}.item-detail p{font-size:11.5px}.inventory-window footer{padding:12px;font-size:9.2px}.inventory-window footer span{display:none}#zone-banner strong{font-size:33.35px}}
@media(pointer:coarse){.touch-pad{display:block;position:absolute;left:15px;bottom:32px;text-align:center}.touch-pad button{width:32px;height:30px;padding:0;background:#1c3438a8}.world-bottom{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}#zone-banner.show{opacity:1;animation:none}}

/* Minimal illustrated menu icons and 20% larger top-right controls. */
.hud-top nav{gap:10px}.hud-top nav button{width:55px;height:55px;font-size:inherit;display:grid;place-items:center}.menu-icon{width:25px;height:25px;fill:none;stroke:#fff0cc;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 4px #061d1c80);transition:transform .2s,stroke .2s}.menu-icon-button:hover .menu-icon{transform:scale(1.08);stroke:#fff7dc}.menu-icon-button.has-points{border-color:#f1d58c;box-shadow:0 0 0 3px #e9c76c18,0 0 22px #f0d4882e}.menu-icon-button.has-points .menu-icon{stroke:#ffe49b}.hud-top nav small{min-width:19px;line-height:15px;padding:0 5px;border:1px solid #f3dda93d;border-radius:8px;color:#fff5d5}.menu-icon-button.has-points small{background:#e7cc88;color:#243a37;border-color:#fff2c4;font-weight:700}
@media(max-width:650px){.hud-top nav button{width:41px;height:41px}.menu-icon{width:20px;height:20px}}