/* =====================================================================
 * v5.css — UI SCALE (ปรับขนาด UI ทั้งเกมด้วยตัวแปร --ui ที่ตั้งจาก polish_v5.js)
 *  ทุกชิ้นส่วนย่อ/ขยายจากมุมที่มันยึดอยู่ (HUD = ล่างซ้าย, มินิแมพ = บนซ้าย, บัฟ = บนขวา ...)
 * ===================================================================== */
:root { --ui: 1; }
#hud { transform: scale(var(--ui)); transform-origin: 0 100%; width: calc(100% / var(--ui)); right: auto; }
#minimap { transform: scale(var(--ui)); transform-origin: 0 0; }
#chat { transform: scale(var(--ui)); transform-origin: 0 100%; bottom: calc(88px * var(--ui)); }
#buffs { transform: scale(var(--ui)); transform-origin: 100% 0; }
#qtrack { transform: scale(var(--ui)); transform-origin: 100% 0; top: calc(52px * var(--ui)); }
#bossbar { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; }
#log { transform: scale(var(--ui)); transform-origin: 100% 100%; bottom: calc(92px * var(--ui)); }
#notices { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; top: calc(58px * var(--ui)); }
#banner { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; }
#mapname { font-size: calc(100% * var(--ui)); }
.win { transform: scale(var(--ui)); transform-origin: 0 0; max-height: calc((100vh - 90px) / var(--ui)); }
@keyframes winin { from { transform: scale(calc(var(--ui) * .94)); opacity: 0; } to { transform: scale(var(--ui)); } }
#tooltip { transform: scale(var(--ui)); transform-origin: 0 0; }
#pcard { transform: scale(var(--ui)); transform-origin: 50% 100%; }
#fish-btn { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 100%; bottom: calc(96px * var(--ui)); }
#fps { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; }
#death .death-box { transform: scale(var(--ui)); }
@media (max-width: 900px) { #minimap { transform: scale(calc(.8 * var(--ui))); } }
/* มือถือ: ปุ่มสัมผัสใช้ทั้ง --mscale (จัดปุ่ม) × --ui (ขนาด UI) */
.joy, .mb { transform: scale(calc(var(--mscale, 1) * var(--ui))); }
.mb.on { transform: scale(calc(var(--mscale, 1) * var(--ui) * .92)); }
.mtop { transform: scale(var(--ui)); transform-origin: 100% 0; }
.mmenu { transform: scale(var(--ui)); transform-origin: 100% 0; top: calc(56px * var(--ui)); }
.medit-bar { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; }
body.m-mobile #chat { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; bottom: auto; }
body.m-mobile #qtrack { transform: scale(calc(.9 * var(--ui))); }
body.m-mobile #fish-btn { transform: translateX(-50%) scale(var(--ui)); transform-origin: 50% 0; }
body.m-mobile .win { max-width: calc(96vw / var(--ui)); max-height: calc(86vh / var(--ui)); }
/* ---- แถวตั้งค่าขนาด UI ---- */
.ui-scale-row { display: flex; align-items: center; gap: 6px; margin: 6px 0; }
.ui-scale-row span { white-space: nowrap; } .ui-scale-row b { min-width: 42px; text-align: right; color: #fff; }
.ui-scale-row input[type=range] { flex: 1; accent-color: #fff; }