@import url('https://fonts.googleapis.com/css2?family=Almendra+SC&family=Chakra+Petch:wght@400;600;700&display=swap');
:root{--ink:#e8d7b0;--gold:#e0a52b;--blood:#ae2637;--night:#0d0b12;--panel:#17121d}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#08070b;color:var(--ink);font-family:'Chakra Petch',sans-serif;touch-action:none}
body{display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,#29202d 0,#100d14 50%,#050407 100%)}
body:after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
#shell{width:min(1180px,100vw);display:grid;grid-template-rows:68px auto 42px;padding:0 14px}
header,footer{display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font-family:'Almendra SC',serif;letter-spacing:2px}.brand>span{font-size:35px;color:var(--gold);filter:drop-shadow(0 0 8px #d48a2855)}.brand b,.brand small{display:block}.brand small{color:#a97a3e;font-size:11px}.hud{display:flex;align-items:center;gap:13px}.stat{text-align:center}.stat span{font-size:9px;color:#8d7d70}.stat b{display:block;font-size:22px}.bars{width:min(280px,36vw)}.bar{height:17px;position:relative;background:#241b25;border:2px solid #554353;margin:3px;transform:skew(-8deg);box-shadow:inset 0 0 6px #000}.bar i{display:block;height:100%;width:100%;transition:width .25s}.bar em{position:absolute;inset:0;text-align:center;font-size:10px;font-style:normal;line-height:13px;color:#fff;text-shadow:1px 1px #000}.bar.hp i{background:linear-gradient(90deg,#6d1022,#d83a46)}.bar.stamina{height:6px}.bar.stamina i{background:linear-gradient(90deg,#1e7568,#55d7ad)}.bar.xp{height:7px}.bar.xp i{width:0;background:#d49b27}.coins{color:var(--gold)}
#gameWrap{position:relative;min-height:0;border:1px solid #584535;box-shadow:0 0 0 4px #110d14,0 14px 45px #000;overflow:hidden;background:#121017}canvas{display:block;width:100%;height:100%;image-rendering:pixelated;background:#111}
#intro{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:radial-gradient(circle,#15101eb8,#07060aec);transition:.5s;z-index:5}#intro.hide{opacity:0;pointer-events:none}.sigil{font-size:44px;color:var(--gold);animation:pulse 1.7s infinite}#intro p{letter-spacing:6px;color:#9a7544;margin:10px 0 0}h1{font-family:'Almendra SC',serif;font-size:clamp(28px,5vw,62px);letter-spacing:3px;margin:3px 0 22px;text-shadow:0 4px #000}button{font:700 14px 'Chakra Petch';color:#f2dfb3;border:1px solid #a2712e;background:linear-gradient(#6f321d,#39171a);padding:12px 25px;box-shadow:inset 0 0 0 2px #160d0c;cursor:pointer}button:active{transform:translateY(2px)}#intro small{margin-top:16px;color:#877b79}
#combatBtn{margin-left:8px;background:linear-gradient(#4c2a68,#241331);border-color:#a66bd0}
#toast{position:absolute;top:18%;left:50%;transform:translate(-50%,-10px);opacity:0;padding:9px 18px;border:1px solid #d9a53c;background:#160e19e8;color:#ffd67b;font-family:'Almendra SC';font-size:20px;letter-spacing:1px;transition:.25s;pointer-events:none;z-index:4}#toast.show{opacity:1;transform:translate(-50%,0)}footer{font-size:12px;color:#968a84;border-top:1px solid #382b32}footer b{color:#d8c398}
#bagBtn{position:absolute;z-index:5;right:12px;bottom:12px;width:48px;height:48px;padding:0;border-radius:5px;font-size:21px;background:linear-gradient(#463522,#211711)}
#inventory{position:absolute;z-index:10;right:12px;top:12px;bottom:12px;width:min(390px,calc(100% - 24px));padding:18px;background:linear-gradient(145deg,#21191af7,#0e0b10fa);border:2px solid #795b32;box-shadow:0 0 0 4px #080608,0 18px 60px #000;transform:translateX(calc(100% + 24px));transition:.28s;overflow:auto;pointer-events:none}#inventory.show{transform:none;pointer-events:auto}.invHead{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid #5b442d;padding-bottom:10px}.invHead small{color:#9c7440;letter-spacing:3px}.invHead h2{font:25px 'Almendra SC';margin:2px 0}.invHead button{width:34px;height:34px;padding:0;font-size:22px}.equipped{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.equipped span{font-size:9px;color:#8e7d69;background:#0d0a0d;padding:9px;border:1px solid #392d26}.equipped b{display:block;color:#e5c57f;font-size:12px;margin-top:3px}#inventory h3{font:14px 'Almendra SC';color:#c99843;letter-spacing:2px;margin:14px 0 7px}.itemGrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.item{position:relative;text-align:left;padding:10px;min-height:92px;background:#171218;border-color:#493b35;color:#cbbda8}.item i{float:left;font-style:normal;font-size:25px;margin:0 8px 25px 0}.item b,.item small{display:block}.item small{font-size:9px;color:#887f79;margin-top:5px}.item.active{border-color:#e0a52b;box-shadow:inset 0 0 18px #a66f2438}.item.rare{border-color:#8f45bb}.item.epic{border-color:#477fae}.invHint{font-size:10px;color:#766d65;font-style:italic}.skillFlash{animation:skillPulse .7s}
@keyframes skillPulse{50%{box-shadow:0 0 28px #e33939,inset 0 0 15px #ef9d37}}
#lootCard{position:absolute;z-index:4;right:20px;top:20px;width:265px;padding:13px 15px 15px 72px;background:linear-gradient(135deg,#211527f2,#0d0a11f5);border:1px solid #9c4bd1;box-shadow:0 0 0 3px #0a0710,0 8px 25px #000,0 0 28px #8a35c844;opacity:0;transform:translateY(-12px);pointer-events:none;transition:.35s}.lootCard{}#lootCard.show{opacity:1;transform:none}.lootIcon{position:absolute;left:13px;top:15px;width:45px;height:45px;display:grid;place-items:center;font-size:25px;background:radial-gradient(circle,#9b38df,#281236);border:2px solid #ce74ff;box-shadow:inset 0 0 12px #000}#lootCard small{color:#b968ee;font-size:9px;letter-spacing:1px}#lootCard h2{font:21px 'Almendra SC';color:#efd5ff;margin:1px 0 10px}.lootStats{grid-column:1/-1;border-top:1px solid #55325f;border-bottom:1px solid #55325f;padding:7px 0;display:grid;gap:3px}.lootStats span{font-size:10px;color:#aaa}.lootStats b{float:right;color:#6be68c}#lootCard p{font-size:10px;color:#a89aa9;margin:9px 0 0;font-style:italic}
#mobileControls{display:none;position:absolute;inset:0;pointer-events:none;z-index:3}#joystick{position:absolute;left:25px;bottom:22px;width:105px;height:105px;border-radius:50%;border:2px solid #a68b7050;background:#130e17aa;pointer-events:auto}#joystick i{position:absolute;width:45px;height:45px;border-radius:50%;background:#b8996655;border:2px solid #d3b18188;left:28px;top:28px}#mobileControls button{position:absolute;border-radius:50%;width:72px;height:72px;padding:0;pointer-events:auto;right:22px;bottom:24px}#mobileControls #dashBtn{right:105px;bottom:90px;width:55px;height:55px;font-size:10px;background:#18263a}
#mobileControls #talkBtn{right:105px;bottom:22px;width:55px;height:55px;font-size:10px;background:#554020;display:none}#mobileControls #talkBtn.show{display:block}
#mobileControls #skillBtn{right:105px;bottom:24px;width:58px;height:58px;font-size:9px;background:#5b2035}
#mobileControls #skill2Btn{right:171px;bottom:24px;width:58px;height:58px;font-size:8px;background:#4b2868}
#dialog{position:absolute;z-index:6;left:50%;bottom:22px;width:min(650px,90%);transform:translate(-50%,25px);opacity:0;pointer-events:none;padding:16px 22px;background:linear-gradient(90deg,#110c13f7,#241727f7,#110c13f7);border:2px solid #8a6a3d;box-shadow:0 0 0 4px #09070b,0 12px 32px #000;transition:.2s}#dialog.show{opacity:1;transform:translate(-50%,0)}#dialog b{font:21px 'Almendra SC';color:#efbb50;letter-spacing:1px}#dialog p{margin:5px 0;color:#e1d3bd;font-size:13px}#dialog small{color:#756b68;font-size:9px}
@keyframes pulse{50%{transform:scale(1.15);filter:drop-shadow(0 0 12px #e8a72d)}}
@media(max-width:760px),(pointer:coarse){#shell{height:100dvh;padding:0;grid-template-rows:52px 1fr 25px}.brand{padding-left:8px}.brand b{font-size:12px}.brand small{display:none}.brand>span{font-size:24px}.bars{width:42vw}.coins{padding-right:8px}.stat{display:none}#gameWrap{border-left:0;border-right:0;box-shadow:none}footer{padding:0 8px;font-size:9px;background:#09070bd9;position:relative;z-index:4}#mobileControls{display:block}#joystick{left:22px;bottom:26px;width:112px;height:112px;background:#0b09129c;backdrop-filter:blur(3px)}#joystick i{left:31px;top:31px}#mobileControls button{right:20px;bottom:28px;width:82px;height:82px;background:linear-gradient(#7c351fe6,#39171ae6);box-shadow:0 5px 18px #0008,inset 0 0 0 2px #160d0c}#mobileControls #dashBtn{right:108px;bottom:110px;width:58px;height:58px;background:#18263ad9}#mobileControls #skillBtn{right:174px;bottom:70px;width:58px;height:58px}#mobileControls #skill2Btn{right:174px;bottom:135px;width:58px;height:58px}#mobileControls #talkBtn{right:110px;bottom:38px;width:58px;height:58px}#bagBtn{right:8px;top:8px;bottom:auto;width:42px;height:42px}#inventory{inset:7px;width:auto;padding:14px}#intro small{max-width:270px}h1{font-size:31px}#lootCard{width:220px;right:8px;top:8px;transform:scale(.82);transform-origin:top right}#lootCard.show{transform:scale(.82)}#dialog{bottom:145px}}
