*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
html,body{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#0e0f11;color:#d8d4c8;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;touch-action:none;overscroll-behavior:none;position:fixed;inset:0}
#game{position:fixed;inset:0;overflow:hidden}
#c{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.hidden{display:none!important}
#hud{position:absolute;left:0;right:0;top:0;padding:calc(env(safe-area-inset-top) + 8px) calc(env(safe-area-inset-right) + 10px) 0 calc(env(safe-area-inset-left) + 10px);
  display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none;text-shadow:0 1px 2px #000}
#bars{display:flex;flex-direction:column;gap:5px;width:min(44vw,190px)}
.bar{display:flex;align-items:center;gap:6px}
.lbl{font-size:9px;letter-spacing:1px;width:46px;opacity:.85;font-weight:700}
.track{flex:1;height:9px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.15);border-radius:5px;overflow:hidden}
.fill{height:100%;width:100%;transition:width .25s}
.fill.hp{background:#a8443a}.fill.food{background:#b08a3e}.fill.water{background:#4f7f99}
.fill.low{animation:blink .8s infinite}
@keyframes blink{50%{opacity:.35}}
#info{text-align:right;font-size:12px;line-height:1.45}
#weap{font-weight:700;font-size:13px;color:#e6dcc0}
#stats,#wt{opacity:.8}
#wt.heavy{color:#e08a5a;opacity:1}
#prompt{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom) + 170px);background:rgba(10,10,10,.65);
  border:1px solid rgba(255,255,255,.15);padding:6px 12px;border-radius:14px;font-size:13px;pointer-events:none;display:none;white-space:nowrap}
#toast{position:absolute;left:50%;top:calc(env(safe-area-inset-top) + 74px);transform:translateX(-50%);background:rgba(20,20,20,.8);padding:6px 12px;border-radius:10px;
  font-size:13px;pointer-events:none;opacity:0;transition:opacity .3s;white-space:nowrap}
#toast.show{opacity:1}
#controls{position:absolute;right:calc(env(safe-area-inset-right) + 14px);bottom:calc(env(safe-area-inset-bottom) + 18px);width:200px;height:190px;display:none}
body.touch #controls{display:block}
body.touch #keyhint{display:none}
.btn{position:absolute;border-radius:50%;border:2px solid rgba(230,220,190,.35);background:rgba(30,30,28,.55);color:#e8e0c8;font-weight:800;letter-spacing:1px;
  font-family:inherit;touch-action:none;outline:none;padding:0}
.btn.active{background:rgba(160,60,50,.7);border-color:rgba(255,200,180,.6)}
.btn.big{width:92px;height:92px;right:0;bottom:0;font-size:13px;background:rgba(110,40,34,.55)}
.btn.mid{width:68px;height:68px;right:100px;bottom:8px;font-size:10px}
.btn.mid.ready{background:rgba(70,90,60,.75);border-color:rgba(200,230,170,.7)}
.btn.small{width:58px;height:58px;right:18px;bottom:110px;font-size:10px}
#keyhint{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);font-size:11px;opacity:.55;pointer-events:none;white-space:nowrap}
#panel{position:absolute;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;padding:calc(env(safe-area-inset-top) + 10px) 10px calc(env(safe-area-inset-bottom) + 10px)}
.card{background:#1c1d1f;border:1px solid #3a3b3d;border-radius:14px;width:min(420px,96vw);max-height:100%;display:flex;flex-direction:column;box-shadow:0 10px 40px #000}
.head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 4px}
.head h2{margin:0;font-size:17px;letter-spacing:1px;color:#e6dcc0}
#pClose{background:#333;border:0;color:#ddd;width:38px;height:38px;border-radius:50%;font-size:16px}
#pWeight{padding:0 14px 8px;font-size:12px;opacity:.75}
#pBody{overflow-y:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:0 10px 12px}
.sec{font-size:11px;letter-spacing:1px;opacity:.6;margin:10px 4px 6px}
.row{display:flex;align-items:center;gap:8px;background:#26272a;border-radius:9px;padding:7px 8px;margin-bottom:6px}
.row .ic{width:28px;height:28px;border-radius:6px;flex:none;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#111}
.row .nm{flex:1;font-size:14px}
.row .nm small{display:block;opacity:.55;font-size:11px}
.row button,.allbtn{background:#3d4a3a;border:0;color:#e8e8dc;border-radius:8px;padding:8px 11px;font-size:13px;font-weight:600;font-family:inherit}
.row button.alt{background:#4a3a3a}
.row button.eq{background:#5a5030}
.allbtn{width:100%;margin:4px 0 6px;padding:11px}
.empty{opacity:.5;font-size:13px;padding:8px 4px}
.overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  background:radial-gradient(ellipse at center,rgba(20,22,20,.82),rgba(5,5,6,.96));padding:20px;text-align:center}
.title{font-size:46px;font-weight:900;letter-spacing:6px;color:#cfc6ad;text-shadow:0 3px 0 #000,0 0 20px rgba(120,30,20,.5)}
.title.red{color:#b5473b}
.sub{opacity:.75;font-size:15px;letter-spacing:1px}
.mbtn{background:#3a2f2a;color:#eadfc6;border:1px solid #6a5446;border-radius:12px;padding:14px 40px;font-size:17px;font-weight:700;min-width:200px;font-family:inherit}
.help{max-width:420px;font-size:12px;opacity:.6;line-height:1.5;margin-top:10px}
.help p{margin:4px 0}