*{box-sizing:border-box}html{min-height:100%;background:#e8b971}body{margin:0;padding:24px 12px;font:12px 'Courier New',monospace;color:#fff;background:repeating-linear-gradient(35deg,#ffffff06 0 1px,transparent 1px 3px)}
button,select{font:inherit;border:1px solid #80602f;border-radius:0;cursor:pointer;color:#fff;background:#29271e;padding:3px 5px}button:hover,select:hover{background:#494333}button:focus-visible,select:focus-visible,canvas:focus-visible{outline:2px solid #fff;outline-offset:1px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}
#app{width:768px;max-width:100%;margin:0 auto;border:4px solid #c99249;background:#c7964b;box-shadow:0 0 0 1px #edc082}.battlefield{position:relative;aspect-ratio:2.25;background:#000}canvas{width:100%;height:100%;display:block;image-rendering:pixelated;touch-action:none}.top{position:absolute;top:5px;left:6px;right:6px;display:flex;justify-content:space-between;align-items:start;gap:5px;font-weight:bold;pointer-events:none}.top>span{background:#29271e;padding:4px 6px}.top>div{display:flex;gap:4px;pointer-events:auto}
.panel{display:grid;grid-template-columns:1.1fr 1.05fr 1.3fr;gap:8px;padding:5px 7px 7px;border-top:3px solid #e6b26a;text-shadow:1px 1px #222}.stats{font-weight:bold;line-height:1.22}.stats strong{font-size:14px}.stats span{margin-left:6px}.stat-gap{margin-top:8px}.xp-bar{width:90%;height:3px;background:#564522;margin:3px 0}.xp-bar i{display:block;height:100%;background:#bcea53}.panel-label{font-size:10px;display:flex;justify-content:space-between;margin-bottom:4px}.panel-label span{font-size:8px;color:#f9deb0}#party,#weapons,.rune-row{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}#party{margin-bottom:9px}
.slot{padding:0;height:43px;background:#080909;border:1px solid #775223;position:relative;display:grid;place-items:center;min-width:0}.slot.selected{outline:1px solid #fff}.slot canvas{height:36px;width:32px}.slot .life{position:absolute;top:2px;left:2px;right:2px;height:2px;background:#4a1111}.life i{display:block;height:100%;background:#e53332}.slot .num{position:absolute;bottom:1px;right:2px;font-size:8px;color:#999}.weapon{height:32px;font-size:19px;color:#ddd}.weapon small{position:absolute;bottom:1px;right:2px;font-size:8px;color:#edc860}#items{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}#items .slot{height:32px}.rune-label{margin-top:5px}.rune-row .slot{height:27px;font-size:18px}
.modal{position:absolute;inset:30px 28px 35px;background:#090909f5;border:1px solid #8c784c;text-align:center;padding:12px;display:flex;flex-direction:column;align-items:center;justify-content:center}.modal h1{font-size:22px;letter-spacing:3px;margin:0 0 6px;color:#ebc079}.modal p{font-size:11px;margin:7px 0 12px;color:#d0c5b1}.modal>button{padding:5px 26px}.modal h2{font-size:17px}#choices{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:100%}.choice{display:flex;flex-direction:column;gap:5px;font-size:10px}.choice canvas{width:32px;height:40px;align-self:center;image-rendering:pixelated}.choice select{width:100%;font-size:11px;padding:3px 0}
#status{height:24px;background:#ad7d3a;padding:5px 7px;font-size:10px;text-shadow:1px 1px #59411e}.bottom{display:flex;justify-content:space-between;align-items:center;padding:6px;color:#513d22;font-size:10px}.bottom button{color:#211a0d;background:#e4b369;border:1px solid #825326;font-weight:bold}#app:fullscreen{width:min(100vw,150vh);max-width:none;margin:auto;height:fit-content}::backdrop{background:#15130d}
@media(max-width:540px){body{padding:8px 4px;font-size:10px}.panel{gap:5px;padding:4px}.stats strong{font-size:11px}.panel-label span{display:none}.slot{height:36px}#items .slot,.weapon{height:27px}.modal{inset:28px 10px 10px;padding:5px}.modal h1{font-size:15px}.modal p{font-size:9px;margin:4px}#choices{gap:4px}.choice select{font-size:9px;padding:3px 0}.choice canvas{height:30px;width:24px}.top{font-size:10px;top:3px}.top button{padding:2px 3px}.bottom{font-size:8px}}
#items .slot:disabled{opacity:1;background:#080909;border-color:#775223}
.stat-row{display:flex;align-items:center;height:18px;gap:2px}.stat-row span{min-width:22px}.stat-row button{font-size:11px;padding:0;width:17px;height:15px;line-height:12px;background:#332b1e;color:#fff}.stat-row button:disabled{visibility:hidden}.stats .stat-gap{margin-top:4px}.mp-line{font-size:10px;margin-top:8px}.mp-bar{height:4px;background:#574420;margin-top:3px}.mp-bar i{display:block;height:100%;background:#68a9ff}#mp-hint{font-size:9px;line-height:1.4;margin-top:5px;color:#fff0c9}#items .slot{height:36px}.item-readout{background:#211d16;border:2px solid #c99249;padding:7px;font-size:11px;line-height:1.5;min-height:73px}.item-readout strong{color:#ffdc83}.item-readout #item-effect{color:#c3c2ae;font-size:10px}.stat-guide{padding:5px 7px;background:#b5843e;font-size:10px;line-height:1.5}.stat-guide summary{cursor:pointer}.stat-guide p{margin:5px 0}.drop-ok{outline:2px solid #74ff72!important}.drop-no{outline:2px solid #ff5544!important}.item-picked{outline:2px solid #ffe981}.weapon{touch-action:none;user-select:none}.weapon small{pointer-events:none}#drag-item{position:fixed;z-index:1000;pointer-events:none;transform:translate(-50%,-50%);width:36px;height:36px;background:#111d;border:1px solid #eee;font-size:25px;text-align:center}#status{height:auto;min-height:24px}#app .inventory .slot:disabled{opacity:1} .stats{min-width:0}@media(max-width:540px){.stat-row{height:16px}#items .slot{height:31px}.item-readout{font-size:9px}.mp-line,#mp-hint{font-size:8px}.panel{grid-template-columns:1.1fr 1fr 1.15fr}}
.left-info{min-width:0;min-height:235px}.left-info .item-readout{background:transparent;border:0;padding:0;font-size:11px;line-height:1.5;overflow-wrap:anywhere}.left-info .item-readout strong{font-size:14px;color:#fff}.left-info #item-details{white-space:pre-line}.left-info #item-effect{color:#fff0cd;font-size:10px;margin-top:7px}.world{position:absolute;inset:0;background:#020602;z-index:3;display:flex;flex-direction:column;padding:8px 10px;color:#eee;font-size:10px}.map-title{display:flex;justify-content:space-between;align-items:center;letter-spacing:3px;height:24px}.map-title button{letter-spacing:0;font-size:9px}.map-chart{position:relative;flex:1;min-height:95px}.map-chart svg,#map-nodes{position:absolute;inset:0;width:100%;height:100%}.map-chart svg{preserve-aspect-ratio:none}.map-node{position:absolute;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;color:#d7c974;min-width:12px}.map-node span{font-size:14px;text-shadow:0 0 4px #030}.map-node small{position:absolute;top:17px;left:50%;transform:translateX(-50%);font-size:8px;white-space:nowrap;color:#d2ceb9;background:#020602b0}.map-node:disabled{color:#677064;opacity:.65}.map-node.cleared span{color:#63d35f}.map-node:hover{background:#354020}.map-legend{font-size:8px;color:#939b7e;margin-top:9px;text-align:center}#services{border-top:1px solid #354629;padding-top:6px;margin-top:9px;flex-shrink:0}#service-description{font-size:9px;margin:4px 0}.service-actions{display:flex;gap:7px}.service-actions button{font-size:9px;padding:3px 5px}#trader-stock{display:flex;flex-wrap:wrap;gap:3px;margin-top:5px}#trader-stock button{font-size:8px;padding:3px}.top{z-index:1}@media(max-width:540px){.left-info{min-height:235px}.left-info .item-readout{font-size:9px}.left-info .item-readout strong{font-size:11px}.left-info #item-effect{font-size:8px}.world{padding:3px 5px}.map-title{height:17px;font-size:9px}.map-chart{min-height:65px}.map-node small{font-size:6px;top:13px}.map-node span{font-size:10px}.map-legend{font-size:6px;margin-top:6px}#services{padding-top:3px;margin-top:4px}#service-description{font-size:7px}.service-actions button,#trader-stock button{font-size:7px;padding:2px}.service-actions{gap:3px}}
.shop-window{position:absolute;z-index:6;top:38px;left:12%;width:290px;max-width:80%;padding:9px;background:#000;border:1px solid #fff;color:#eee;font-size:11px}.shop-window p{line-height:1.5;min-height:45px}.shop-window #trader-stock{display:block}.shop-window #service-description{font-size:9px;color:#bca879}.shop-window .service-actions{margin:6px 0}.shop-navigation{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #888;margin-top:8px;padding-top:5px}#shop-classes{display:flex;gap:3px;margin-bottom:7px}#shop-classes .active{border-color:#fff;color:#fff}#service-controls{position:absolute;left:10px;bottom:17%;display:flex;gap:12px}#service-controls[hidden],.shop-window[hidden]{display:none}
#service-controls{right:10px;justify-content:space-between;pointer-events:none}#service-controls button{pointer-events:auto}#service-controls #inn{margin-right:12%}
#priest-aura{white-space:pre-line;font-size:10px;line-height:1.5;margin-top:5px;color:#f6e5a8}
.left-info{min-height:0}.stat-columns{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:2px}.combat-stats{font-size:10px;line-height:18px}.combat-stats span{margin-left:3px}.equipment{display:grid;grid-template-columns:35px minmax(0,1fr);gap:3px;align-content:start;align-items:center}.equipment .panel-label{font-size:8px;margin:0;justify-content:flex-end;padding-right:2px}.equipment .panel-label span{display:none}.equipment #party{margin:0}.equipment .mp-line,.equipment .mp-bar,.equipment #mp-hint{grid-column:2;margin:0}.equipment .mp-line{margin-top:3px}.equipment #mp-hint{font-size:8px;line-height:1.2}.equipment .slot{height:35px}.equipment .slot canvas{height:30px;width:27px}.equipment .weapon,.equipment .rune-row .slot{height:27px}.panel{grid-template-columns:1fr 1.15fr 1.2fr;gap:7px}.inventory #items .slot{height:32px}.stat-gap{margin-top:3px}#priest-aura{font-size:9px;line-height:1.2}@media(max-width:540px){.left-info{min-height:0}.panel{grid-template-columns:1fr 1.15fr 1.2fr;gap:4px}.equipment{grid-template-columns:25px minmax(0,1fr);gap:2px}.equipment .panel-label{font-size:6px}.stat-columns{gap:2px}.combat-stats{font-size:8px;line-height:16px}.stat-row{font-size:9px}.stat-row span{min-width:12px;margin-left:2px}.stat-row button{width:12px}.equipment .slot{height:30px}.equipment .weapon,.equipment .rune-row .slot{height:23px}.inventory #items .slot{height:27px}}
#revive{display:block;margin:9px 0 13px;padding:2px 4px;border:1px solid #ecd294;background:#8b692f;color:#fff7c3;text-shadow:1px 1px #17150d;font-weight:bold}#revive:disabled{opacity:.55}
.map-chart{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#74633b #090c08}.map-content{position:relative;width:360%;height:100%;min-height:0}.map-legend button{font-size:9px;padding:1px 6px;margin:0 5px}@media(max-width:540px){.map-content{min-height:0}}
.shop-window{left:8%;width:84%;max-width:none;top:30px;max-height:calc(100% - 38px);display:flex;flex-direction:column;overflow:hidden}.shop-window #trader-stock{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;overflow:auto;min-height:0}.shop-card{border:1px solid #514832;padding:5px;display:flex;flex-direction:column;gap:5px;font-size:9px;line-height:1.35}.shop-card strong{color:#f1d9a0}.shop-card button{margin-top:auto;align-self:start}.shop-navigation,#shop-classes,.service-actions{flex-shrink:0}:root:fullscreen{background:#15130d;overflow:hidden}:root:fullscreen body{width:100vw;height:100vh;padding:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#15130d}:root:fullscreen #app{width:768px;max-width:calc(100vw - 16px);flex-shrink:0;margin:0;transform:scale(var(--fullscreen-scale,1));transform-origin:center center}@media(max-width:540px){.shop-card{padding:3px;font-size:8px}.shop-window #trader-stock{gap:3px}.shop-window{padding:5px}}
#damage-numbers{position:absolute;inset:0;pointer-events:none;image-rendering:auto}.settings-modal{z-index:5;gap:12px}.settings-modal label{display:flex;gap:8px;align-items:center;font-size:12px}.settings-modal #auto-move-characters{display:grid;gap:9px}.settings-modal #new{margin-top:8px;color:#ffc497}
.slot .mana{position:absolute;top:5px;left:2px;right:2px;height:2px;background:#15263b}.mana i{display:block;height:100%;background:#68a9ff}
.rune-icon{width:20px;height:20px;pointer-events:none}#drag-item .rune-icon{width:28px;height:28px}
#main-menu{position:absolute;inset:0;z-index:20;background:#080b09;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;gap:22px}
#main-menu h1{color:#ebc079;letter-spacing:3px;font-size:23px;margin:0}
#save-slots{display:grid;gap:12px;width:min(100%,480px)}
#save-slots button{text-align:left;display:flex;flex-direction:column;gap:10px;padding:16px;background:#171910;border-color:#867145}
#save-slots button:hover{background:#292d1d}#save-slots strong{color:#ebc079}#save-slots span{font-size:11px;line-height:1.6}#save-slots small{color:#bbb}
.settings-modal{gap:5px;overflow:auto}.settings-modal h2{margin:3px}.settings-modal #auto-move-characters{grid-template-columns:repeat(2,1fr);gap:7px 20px}.settings-modal>button{padding:3px 18px}.settings-modal #new{margin-top:3px}#setup-back{margin-top:7px}
#app .weapon canvas{width:auto;height:100%;max-width:100%;aspect-ratio:1;object-fit:contain;pointer-events:none}
#dodge-meter{font-size:9px;margin-top:4px;color:#b9e8ff}.dodge-bar{height:3px;background:#51452f;margin-top:2px;width:90%}.dodge-bar i{display:block;height:100%;background:#b9e8ff}
#app.menu-screen,#app.setup-screen{height:460px;background:#000}
#app.menu-screen> :not(#main-menu):not(#scene-fade),#app.setup-screen> :not(.battlefield):not(#scene-fade){display:none!important}
#app.setup-screen .battlefield{height:100%;aspect-ratio:auto}
#app.setup-screen .battlefield> :not(#setup){display:none!important}
#app #main-menu,#app #setup{background:#000;inset:0;border:0;padding:30px 20px 90px;justify-content:flex-start}
#menu-actions{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%;padding-top:35px}
#main-menu #menu-actions h1{font-size:clamp(27px,5vw,49px);font-weight:900;letter-spacing:2px;color:#ffb62d;text-shadow:2px 2px #a23e16,3px 4px #66391b;transform:skew(-5deg);margin-bottom:30px}
#menu-actions button,#save-return,.setup-actions button{background:transparent;border:0;font-weight:bold;color:#ffe6af;font-size:14px}
#menu-actions button:hover,#save-return:hover,.setup-actions button:hover{color:#fff}
#menu-ground,#setup-ground{position:absolute;bottom:0;left:0;width:100%;height:90px;pointer-events:none}
#save-picker{width:min(100%,480px);text-align:center}#save-picker h2{margin:0 0 12px;color:#e7bb71}#save-slots{gap:7px}#save-slots button{padding:9px;gap:4px}#save-return{margin-top:12px}
#app #setup{display:flex;gap:14px;text-align:center}#setup h1{font-size:23px;margin:7px 0 16px;color:#ebaf57}
#party-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;width:75%}
#party-choices button{background:#080808;border:1px solid #5e5544;display:flex;align-items:center;flex-direction:column;gap:4px;padding:5px}
#party-choices button.active{border-color:#ee5440}#party-choices span{font-size:10px}
#party-choices canvas,#class-options canvas{width:32px;height:36px}
#class-options{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px;width:100%}
#class-options button{border:0;background:transparent;padding:2px;display:flex;flex-direction:column;align-items:center;gap:8px;color:#e8b263;font-size:10px}
#class-options button:hover{background:#292016;color:#fff}#class-options canvas{border:1px solid #eee}
#setup #class-info{margin:0;color:#b2a88f} .setup-actions{display:flex;justify-content:space-between;width:100%;margin-top:18px}
@media(max-width:540px){#app.menu-screen,#app.setup-screen{height:430px}#app #setup{padding:20px 8px 90px}#setup h1{font-size:19px}#party-choices{width:90%;gap:8px}#class-options{gap:1px}#class-options button{font-size:8px}#class-options canvas{width:26px;height:30px}}
.map-node.landmark span{font-size:30px}.map-node.landmark small{top:30px;color:#fff1bd;font-size:10px}
/* Compact routes; full area names appear on focus/hover. */
.map-node{min-width:18px;min-height:18px;display:flex;align-items:center;justify-content:center}
.map-node span{font-size:24px;line-height:1;color:#dfcf72;text-shadow:0 1px #000}
.map-node.cleared span{color:#b55448}
.map-node small{top:15px;font-size:7px;line-height:9px;background:#020602c9}
.map-node em{display:none;position:absolute;bottom:19px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#080b08;color:#fff;padding:3px 5px;font-style:normal;font-size:14px;line-height:1.35;z-index:5;border:1px solid #565c42}
.map-node:hover,.map-node:focus-visible{z-index:6;background:transparent;outline:1px solid #c8bb75}
.map-node:hover em,.map-node:focus-visible em{display:block}
.map-node.landmark span{font-size:23px}.map-node.landmark small{top:22px;font-size:8px}
.map-node.service-node small{font-size:7px}

/* Full tier catalogues stay together in the shop. */
.shop-window{top:5px;left:2%;width:96%;max-height:calc(100% - 10px);padding:6px}.shop-window #trader-stock{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.shop-card{padding:4px;gap:3px;font-size:8px;line-height:1.25}.shop-window .service-actions{margin:3px 0}.shop-navigation{margin-top:4px;padding-top:4px}@media(max-width:540px){.shop-window #trader-stock{grid-template-columns:repeat(3,minmax(0,1fr))}}

.sound-settings{display:grid;grid-template-columns:1fr 1fr;gap:5px 16px;border:1px solid #76613c;padding:7px}.sound-settings label{justify-content:space-between}.sound-settings input[type=range]{width:110px;accent-color:#dcb76d}.sound-settings legend{font-size:11px}.settings-modal{max-height:calc(100% - 12px)}@media(max-width:540px){.sound-settings{grid-template-columns:1fr}.sound-settings input[type=range]{width:140px}}

.slot.drop-no{position:relative;outline:none!important;cursor:not-allowed}.slot.drop-no canvas,.slot.drop-no small{opacity:.22}.slot.drop-no::after{content:"";position:absolute;inset:4px;pointer-events:none;background:linear-gradient(45deg,transparent 47%,#a99572 48%,#a99572 52%,transparent 53%),linear-gradient(-45deg,transparent 47%,#a99572 48%,#a99572 52%,transparent 53%)}

.service-actions #sell-item,.service-actions #buyback{font-size:12px;padding:9px 14px;min-height:34px}.service-actions #sell-item[aria-pressed="true"]{background:#713c29;border-color:#ffbd70}.inventory.sell-mode{outline:3px solid #e98948;background:#653b25;padding:4px}.inventory.sell-mode .panel-label{color:#ffdc8a}.inventory.sell-mode .slot{cursor:crosshair}.inventory.sell-mode .slot:hover{outline:2px solid #ffbd70;background:#59341e}

#service-controls #respec{position:absolute;right:12%;bottom:32px;pointer-events:auto;padding:5px 9px}#respec[hidden]{display:none}