:root{color-scheme:dark;--bg:#0b1113;--panel:#121b1d;--line:#2c3839;--gold:#ddba77;--text:#e6e9df;--muted:#a4b3b0}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 system-ui,sans-serif}button,input{font:inherit}button{background:#1b282b;border:1px solid #405052;color:var(--text);border-radius:5px;padding:10px 13px;cursor:pointer}button:hover{background:#2a3b3c;border-color:var(--gold)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:3px}header{display:flex;align-items:center;gap:24px;padding:18px 30px;border-bottom:1px solid var(--line)}.brand{font:28px Georgia,serif;letter-spacing:5px;color:var(--gold)}.brand span{display:block;font:10px system-ui;letter-spacing:3px;color:var(--muted)}.edition{margin-left:auto;font-size:13px;letter-spacing:1px;color:var(--gold)}.edition span{color:var(--muted);letter-spacing:0}main{display:grid;grid-template-columns:225px minmax(0,1fr) 250px;gap:20px;max-width:1800px;margin:auto;padding:24px}.panel{background:var(--panel);border:1px solid var(--line);padding:20px;border-radius:7px}.eyebrow{color:var(--gold);font-size:12px;letter-spacing:2px}.character{text-align:center}.character h1{font:25px Georgia;margin:6px 0}.character p{margin:5px 0 16px;color:var(--muted);font-size:14px}h2{font:21px Georgia;margin:22px 0 12px}h3{font-size:15px}#portrait{image-rendering:pixelated;width:120px;height:100px;background:radial-gradient(ellipse at bottom,#355150,transparent 70%)}.meter{position:relative;background:#080d0f;height:23px;border:1px solid #354344;margin:9px 0;overflow:hidden;border-radius:3px}.meter i{position:absolute;inset:0 auto 0 0;transition:width .2s}.hp i{background:#a34446}.xp i{background:#3f7a80}.meter span{position:relative;font-size:12px;color:white;text-shadow:0 1px 2px #000}.stats{display:grid;grid-template-columns:1fr 1fr;margin:20px 0;gap:14px;font-size:14px;color:var(--muted)}.stats strong{display:block;color:var(--gold);font-size:20px}.item{border:1px solid var(--line);padding:9px;margin-bottom:8px;text-align:left;font-size:14px}.item small{display:block;color:var(--muted)}.item button{padding:4px 8px;margin-top:7px;font-size:13px}.wide{width:100%;font-size:14px;margin-top:12px}.muted{font-size:14px;color:var(--muted)}.map-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.map-heading h2{font-size:29px;margin:2px 0}.viewport{position:relative;border:1px solid #4c5e55;border-radius:7px;overflow:hidden;background:#182c29}#game{display:block;width:100%;height:auto;image-rendering:pixelated;touch-action:none}.map-badge{position:absolute;left:14px;bottom:12px;font-size:12px;background:#0b1113d9;padding:5px 10px;color:#c5d4cd;pointer-events:none}#toast{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;text-align:center;background:#111c20ed;border:1px solid var(--gold);padding:10px 18px;border-radius:4px;font-size:14px;opacity:0;transition:opacity .2s;pointer-events:none}.actionbar{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap}.actionbar button{flex:1;font-size:13px;white-space:nowrap}.actionbar b{color:var(--gold);font-size:20px;display:block}kbd{display:block;font-size:10px;color:var(--muted);margin-top:3px}.under{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:12px;margin:13px 0}.journal{padding:12px 18px}.journal h2{font-size:17px;margin:0 0 8px}#log{height:95px;overflow-y:auto;font-size:13px;color:var(--muted)}#log p{margin:3px 0}.quest{padding:16px 0;border-bottom:1px solid var(--line);font-size:14px}.quest strong{display:block}.quest small{color:var(--muted)}.quest progress{width:100%;height:6px;accent-color:var(--gold)}.quest button{font-size:13px;padding:6px 9px;margin-top:6px}.tip{background:#1c292b;padding:12px;margin-top:20px;border-left:2px solid var(--gold)}.tip p{font-size:13px;color:var(--muted)}.import{display:block;font-size:13px;text-align:center;margin-top:12px;cursor:pointer;text-decoration:underline}.import input{display:block;max-width:100%;font-size:12px;margin-top:8px}dialog{background:#132024;color:var(--text);border:1px solid #657568;border-radius:10px;padding:30px;max-width:650px;width:calc(100% - 28px);max-height:88vh;overflow:auto;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#04090be0;backdrop-filter:blur(5px)}dialog h2{font-size:32px;margin:10px 0}dialog p{color:var(--muted)}dialog label{display:block;margin:15px 0;font-size:15px}input[type=text],input:not([type]){width:100%;background:#0b1518;border:1px solid #52605c;padding:12px;color:var(--text);margin-top:8px}fieldset{border:1px solid var(--line);margin:22px 0}legend{color:var(--gold)}.primary{background:#d3b176;color:#151b1a;width:100%;font-weight:700}small{font-size:12px}form>small{display:block;margin-top:15px;color:var(--muted)}.close{float:right;font-size:22px;padding:0 10px}.atlas{display:grid;grid-template-columns:1fr 1fr;gap:10px}.region{padding:14px;border:1px solid var(--line)}.region strong{color:var(--gold)}.region small{display:block}.touchpad{display:none;text-align:center;margin:12px}.touchpad button{min-width:52px;min-height:44px;touch-action:none}#inventory{max-height:235px;overflow-y:auto}#nearby{font-size:14px;color:var(--muted)}@media(min-width:1600px){main{grid-template-columns:250px minmax(0,1fr) 280px}}@media(max-width:1150px){main{grid-template-columns:200px minmax(0,1fr);padding:16px;gap:14px}.quests{grid-column:1/-1}.quest{display:inline-block;vertical-align:top;width:32%;padding:12px}.quests .tip{display:none}}@media(max-width:700px){header{padding:12px 15px;gap:10px}.brand{font-size:23px}.edition{display:none}header button{margin-left:auto;font-size:13px}main{display:flex;flex-direction:column;padding:12px}.play{order:0}.character{order:1}.quests{order:2}.character .stats{grid-template-columns:repeat(4,1fr)}.map-heading h2{font-size:23px}.map-heading button{font-size:13px}.actionbar button{padding:7px;min-width:80px}.actionbar kbd{display:none}.under{display:block}.under span{display:block}.touchpad{display:block}.quest{display:block;width:100%}#portrait{float:left}.character h1{padding-top:15px}.character .meter{clear:both}.atlas{grid-template-columns:1fr}}

.potion-stack{display:grid;grid-template-columns:42px 1fr auto;gap:6px 10px;align-items:center}.potion-stack .potion-icon{font-size:30px;grid-row:1/3}.potion-stack small{grid-column:2}.potion-stack button{grid-column:3;grid-row:1/3}.potion-stack b{font-size:14px}
