/* Flat, clean HUD pass: dark square buttons, long health and focus bars,
   key-letter hotbar slots, a bare minimap and one sans-serif face throughout.
   Loaded last so it settles the older layered HUD styles. */
:root{--hud-bg:#18171ce6;--hud-line:#2e2c34;--hud-text:#ecebf0;--hud-font:Karla,system-ui,'Segoe UI',Arial,sans-serif}
body.dedicated-client #play,body.dedicated-client #play button,body.dedicated-client #toast-region,body.dedicated-client #dialog,body.dedicated-client #dialog *{font-family:var(--hud-font)!important}

/* Top left: square icon buttons with ping and frame rate beneath. */
body.dedicated-client .game-toolbar{gap:6px!important;top:8px!important;left:8px!important}
body.dedicated-client .game-toolbar button{width:44px!important;height:44px!important;padding:9px!important;background:var(--hud-bg)!important;border:1px solid var(--hud-line)!important;border-radius:3px!important;box-shadow:none!important;outline:0!important}
body.dedicated-client .game-toolbar button:hover{border-color:#5a5664!important}
body.dedicated-client #world-stats{top:58px!important;left:10px!important;font:12px/1.4 var(--hud-font)!important;color:#7ee07a!important;text-shadow:0 1px 1px #000!important;background:none!important;border:0!important}

/* Top right: portrait square, long health and focus bars, thin experience line. */
body.dedicated-client .vitals{top:8px!important;right:8px!important;width:min(400px,38vw)!important;min-width:0!important;padding:0!important;gap:6px!important;align-items:flex-start!important;background:none!important;border:0!important;outline:0!important;box-shadow:none!important}
body.dedicated-client .vitals::before,body.dedicated-client .vitals::after{display:none!important}
body.dedicated-client .portrait{width:42px!important;height:42px!important;min-width:42px!important;padding:0!important;margin:0!important;background:#121117!important;border:1px solid var(--hud-line)!important;outline:0!important;box-shadow:none!important;overflow:hidden}
body.dedicated-client .portrait canvas{width:100%!important;height:100%!important;object-fit:cover}
body.dedicated-client #level-badge{right:1px!important;bottom:1px!important;left:auto!important;top:auto!important;min-width:0!important;padding:0 3px!important;font:700 10px var(--hud-font)!important;background:#000c!important;border:0!important;color:#f2c842!important;border-radius:2px!important}
body.dedicated-client .vital-bars{flex:1!important}
body.dedicated-client .hero-identity{display:none!important}
body.dedicated-client .vitals .meter{position:relative!important;height:20px!important;margin:0 0 3px!important;border:1px solid #0c0b10!important;border-radius:2px!important;box-shadow:none!important;overflow:hidden}
body.dedicated-client .vitals .meter.health{background:#3a0d12!important}
body.dedicated-client .vitals .meter.health i{background:linear-gradient(#ff2e44,#d3122a)!important}
body.dedicated-client .vitals .meter.focus{background:#0f1436!important}
body.dedicated-client .vitals .meter.focus i{background:linear-gradient(#4a66ff,#2a3ccf)!important}
body.dedicated-client .vitals .meter span{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;justify-content:center!important;font:500 12px var(--hud-font)!important;color:#fff!important;text-shadow:0 1px 1px #000!important;letter-spacing:0!important}
body.dedicated-client .vitals .meter.xp{height:5px!important;background:#0c1a0d!important;border-color:#0c0b10!important}
body.dedicated-client .vitals .meter.xp i{background:#3fd04a!important}

/* Bottom left: flat hotbar slots with the key letter in the corner. */
body.dedicated-client .action-bar{gap:4px!important;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
body.dedicated-client .action-bar .skills{gap:4px!important}
body.dedicated-client .action-bar .action{position:relative!important;width:46px!important;min-width:46px!important;height:46px!important;padding:0!important;background:var(--hud-bg)!important;border:1px solid var(--hud-line)!important;border-radius:3px!important;box-shadow:none!important;outline:0!important;display:flex!important;align-items:center!important;justify-content:center!important}
body.dedicated-client .action-bar .action kbd{position:absolute!important;left:4px!important;top:2px!important;padding:0!important;margin:0!important;background:none!important;border:0!important;box-shadow:none!important;font:600 11px var(--hud-font)!important;color:#fff!important;text-shadow:0 1px 1px #000}
body.dedicated-client .action-bar .action small{display:none!important}
body.dedicated-client .action-bar .action.potion small{display:block!important;position:absolute!important;right:3px!important;bottom:1px!important;font-size:0!important}
body.dedicated-client .action-bar .action.potion small b{font:700 11px var(--hud-font)!important;color:#fff!important}
body.dedicated-client .action-bar .action .action-icon{width:26px!important;height:26px!important;margin:0!important}
body.dedicated-client .action-bar .action:hover{border-color:#5a5664!important}

/* Bottom right: square swap / PVP / chat buttons and a bare black minimap. */
body.dedicated-client .world-actions{gap:6px!important}
body.dedicated-client .world-actions button{width:46px!important;height:46px!important;padding:0!important;background:var(--hud-bg)!important;border:1px solid var(--hud-line)!important;border-radius:3px!important;box-shadow:none!important;color:var(--hud-text)!important;font:600 14px var(--hud-font)!important}
body.dedicated-client .world-actions button[data-action=pvp]{background:#3a1218ee!important;border-color:#6a2028!important;color:#ff5a64!important}
body.dedicated-client .minimap-box{padding:0!important;background:#000!important;border:1px solid var(--hud-line)!important;outline:0!important;border-radius:2px!important;box-shadow:none!important}
body.dedicated-client .minimap-box span{display:none!important}
body.dedicated-client .minimap-box canvas{display:block!important;width:100%!important;height:100%!important}

/* Quiet extras: no zone banner, a flat quest tracker. */
body.dedicated-client .zone-caption{display:none!important}
body.dedicated-client #task-tracker{background:#14131acc!important;border:1px solid var(--hud-line)!important;border-radius:3px!important;box-shadow:none!important;color:var(--hud-text)!important}
body.dedicated-client #task-tracker b{color:#f2c842!important}
body.dedicated-client .client-play-tools button{background:var(--hud-bg)!important;border:1px solid var(--hud-line)!important;border-radius:3px!important;color:var(--hud-text)!important}

/* Dialogs and toasts share the dark panel look of the shop and bank. */
body.dedicated-client #dialog{background:#1a1820!important;border:1px solid #3a332b!important;border-radius:6px!important;box-shadow:0 16px 40px #000c!important;color:#e8dcc0!important;outline:0!important}
body.dedicated-client #dialog h2,body.dedicated-client #dialog-title{color:#f1e7cf!important;letter-spacing:0!important}
body.dedicated-client #dialog-kicker{color:#a89b80!important;letter-spacing:.08em!important}
body.dedicated-client #dialog-content,body.dedicated-client #dialog-content p{color:#d9ccaf!important;text-shadow:none!important}
body.dedicated-client #dialog button{background:#2a251f!important;border:1px solid #3d362c!important;border-radius:5px!important;color:#e8dcc0!important;box-shadow:none!important;text-shadow:none!important}
body.dedicated-client #dialog button.gold{background:#2f5a2a!important;border-color:#4f8a3f!important;color:#f0f7e6!important}
body.dedicated-client #dialog button:hover{border-color:#c9a24a!important}
body.dedicated-client #toast-region>*{background:#14131ae6!important;border:1px solid var(--hud-line)!important;border-radius:3px!important;color:var(--hud-text)!important;box-shadow:none!important;text-shadow:none!important}

@media (max-height:560px),(max-width:640px){
 body.dedicated-client .game-toolbar button{width:36px!important;height:36px!important;padding:7px!important}
 body.dedicated-client #world-stats{top:48px!important;font-size:10px!important}
 body.dedicated-client .vitals{width:min(300px,42vw)!important}
 body.dedicated-client .portrait{width:34px!important;height:34px!important;min-width:34px!important}
 body.dedicated-client .vitals .meter{height:15px!important}
 body.dedicated-client .vitals .meter span{font-size:10px!important}
 body.dedicated-client .action-bar .action{width:38px!important;min-width:38px!important;height:38px!important}
 body.dedicated-client .world-actions button{width:38px!important;height:38px!important;font-size:12px!important}
}