/* Vexoria — HUD própria do CELULAR (Claude, 22/10). JS: client/src/mobile-quick.js (põe html.mhud2).
   Tudo aqui vale só para html.touch-device.mhud2 — o PC não muda.
   Medidas em "px de interface": os elementos usam zoom var(--ui-scale) (≈0,6 num celular deitado), então 64px aqui ≈ 38px na tela. */

/* barra de baixo e caixa de missões saem (Missões tem botão próprio) */
html.touch-device.mhud2 #hotbar{display:none!important}
html.touch-device.mhud2 #hud #quest-tracker,html.touch-device.mhud2 #hud:has(#tutorial:not(.hidden)) #quest-tracker{display:none!important}

/* nome da área sem moldura */
html.touch-device.mhud2 #hud #zone{background:none!important;border:0!important;box-shadow:none!important;text-shadow:2px 2px 0 #0b0712,0 0 6px #000}
html.touch-device.mhud2 #hud #zone:before,html.touch-device.mhud2 #hud #zone:after{display:none!important}

/* minimapa redondo; tocar abre o mapa grande */
html.touch-device.mhud2 #hud #mapbox{width:156px!important;height:156px!important;padding:0!important;border-radius:50%!important;overflow:hidden;
  border:5px solid #a77d3c!important;box-shadow:0 0 0 3px #2a1d10,0 4px 0 #0009!important;background:#0c0b12!important;cursor:pointer;pointer-events:auto!important}
html.touch-device.mhud2 #hud #mapbox:after{display:none}
html.touch-device.mhud2 #hud #minimap{width:100%!important;height:100%!important;object-fit:cover;border-radius:50%}
html.touch-device.mhud2 #hud #mapbox #clock-chip{left:50%!important;bottom:4px!important;transform:translateX(-50%);font-size:16px;padding:0 8px;border-radius:10px}
html.touch-device.mhud2 #hud #mapbox #weather-chip{left:50%!important;top:6px!important;transform:translateX(-50%)}

/* MOCHILA · MISSÕES · ☰ embaixo do minimapa */
html.touch-device.mhud2 #mq{position:fixed;z-index:37;pointer-events:auto;display:flex;gap:9px;zoom:var(--ui-scale,1)}
html.touch-device.mhud2 #mq button{position:relative;width:64px;height:64px;padding:0;display:grid;place-items:center;background:#160f22e0;border:3px solid #a77d3c;border-radius:9px;
  box-shadow:inset 0 0 0 2px #2a1d10,0 4px 0 #0009;touch-action:manipulation}
html.touch-device.mhud2 #mq button img{width:34px;height:34px;image-rendering:pixelated}
html.touch-device.mhud2 #mq button b{font:34px/1 Txt,sans-serif;color:#f3c66b}
html.touch-device.mhud2 #mq button.on{background:#553f78;border-color:#f3c66b}
html.touch-device.mhud2 :is(#mq,#mq-menu) .mq-dot{position:absolute;right:-5px;top:-5px;width:15px;height:15px;border-radius:50%;background:#ff5b6a;border:2px solid #fff}
html:not(.mhud2) :is(#mq,#mq-menu){display:none}

/* grade do ☰ */
html.touch-device.mhud2 #mq-menu{position:fixed;z-index:46;pointer-events:auto;zoom:var(--ui-scale,1);display:grid;grid-template-columns:repeat(5,76px);gap:8px 6px;padding:10px!important;max-height:calc((100dvh - 20px) / var(--ui-scale,1));overflow-y:auto;
  background:#160f22f2!important;border:3px solid #a77d3c!important;border-radius:8px;box-shadow:0 6px 0 #0009,0 0 0 3px #2a1d10}
html.touch-device.mhud2 #mq-menu.hidden{display:none}
html.touch-device.mhud2 #mq-menu button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:0!important;margin:0!important;background:none!important;border:0!important;box-shadow:none!important;outline:0;min-height:0!important;width:auto!important;height:auto!important;color:#e4d8f7;touch-action:manipulation}
html.touch-device.mhud2 #mq-menu .mq-ic{position:relative;width:58px;height:58px;display:grid;place-items:center;background:#241a33;border:3px solid #8a6a2c;border-radius:9px}
html.touch-device.mhud2 #mq-menu button:active .mq-ic{background:#553f78;border-color:#f3c66b}
html.touch-device.mhud2 #mq-menu .mq-ic :is(img,canvas){width:32px;height:32px;image-rendering:pixelated}
html.touch-device.mhud2 #mq-menu .mq-ic b{font:32px/1 Txt,sans-serif;color:#f3c66b}
html.touch-device.mhud2 #mq-menu small{font:15px/17px Txt,sans-serif;text-align:center;max-width:78px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* conversa: botão pequeno na esquerda (a prévia das mensagens fica ao lado — chat-preview.js) */
html.touch-device.mhud2 #hud #chat-launcher{position:fixed!important;left:var(--L)!important;right:auto!important;bottom:auto!important;width:62px!important;height:62px!important;min-height:0!important;
  padding:0!important;margin:0!important;display:grid!important;place-items:center;background:#160f22e0!important;border:3px solid #a77d3c!important;border-radius:9px!important;box-shadow:inset 0 0 0 2px #2a1d10,0 4px 0 #0009!important;z-index:36}
html.touch-device.mhud2 #hud #chat-launcher :is(span,kbd,.chat-key){display:none!important}
html.touch-device.mhud2 #hud #chat-launcher svg{width:32px;height:32px}
html.touch-device.mhud2 #hud #chat-launcher .chat-unread{position:absolute;right:-6px;top:-6px}
html.touch-device.mhud2.chat-open #hud #chat-launcher{display:none!important}
html.touch-device.mhud2 #chat-preview{max-width:min(44vw,320px);font-size:11px}

/* ossos e Cash no topo da mochila */
html.touch-device.mhud2 #mq-wallet{display:flex;gap:8px;align-items:center;justify-content:flex-end;margin:2px 0 6px}
html.touch-device.mhud2 #mq-wallet :is(#wallet,#cash-shop-open){visibility:visible!important;opacity:1!important;display:flex!important;position:static!important;inset:auto!important;transform:none!important;zoom:1!important;margin:0!important}

/* grupo em pílulas; tocar abre o completo */
html.touch-device.mhud2 #party-frame:not(.mq-full){width:150px!important;padding:3px!important;background:none!important;border:0!important;box-shadow:none!important}
html.touch-device.mhud2 #party-frame:not(.mq-full) :is(header,.pf-leave,.pf-tools,.pf-top small,.pf-bar span,.pf-crown){display:none!important}
html.touch-device.mhud2 #party-frame:not(.mq-full) .pf-row{background:#160f22c8;border:1px solid #3d2c56;border-radius:14px;padding:3px 10px 4px!important;margin-bottom:4px}
html.touch-device.mhud2 #party-frame:not(.mq-full) .pf-row.me{display:none}
html.touch-device.mhud2 #party-frame:not(.mq-full) .pf-top b{font-size:13px!important}
html.touch-device.mhud2 #party-frame:not(.mq-full) .pf-bar{height:5px!important;margin-top:1px}
