/* Brown and green interface theme: dark wood panels, leather-brown borders,
   parchment text and forest-green actions. Loaded last, so it themes every
   window, the chat, dialogs and the HUD in one place. */
:root{
 --ui-panel:#2a1f16;--ui-panel-2:#33271b;--ui-deep:#1f170f;--ui-head:#3a2a1c;
 --ui-line:#6b4f2e;--ui-line-soft:#4e3a24;--ui-text:#efe3c8;--ui-muted:#c9b48e;--ui-gold:#e8c870;
 --ui-green:#3f7a35;--ui-green-hi:#4f9442;--ui-green-line:#76b55a;--ui-green-text:#eaf6dc;--ui-hp:#9fdc7c;
 --ui-shadow:0 14px 34px #000c,inset 0 0 0 1px #8a6a3e33
}
/* The old header location label overlaps windows and still names Ashen Vale. */
body.dedicated-client .game-header .location-label{display:none!important}

/* ---- Panels ---- */
.npc-menu,.shop-window,.item-window,body.dedicated-client #dialog{background:linear-gradient(180deg,#2e2218,#241a12)!important;border:2px solid var(--ui-line)!important;box-shadow:var(--ui-shadow)!important;color:var(--ui-text)!important}
.npc-menu header,.shop-window>header,.item-window>header{background:var(--ui-head)!important;border-bottom:1px solid var(--ui-line)!important}
.npc-menu h2,.shop-window h2,.item-window h2,body.dedicated-client #dialog h2,body.dedicated-client #dialog-title{color:var(--ui-gold)!important}
.npc-menu-close,.shop-close,.item-window .shop-close{background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important;color:var(--ui-gold)!important}
.npc-menu-close:hover,.shop-close:hover{border-color:var(--ui-green-line)!important}
.npc-menu-vitals{color:var(--ui-hp)!important}
.npc-menu-text,.shop-note,.item-info,body.dedicated-client #dialog-content,body.dedicated-client #dialog-content p{color:var(--ui-muted)!important}
.npc-menu-heading,.item-label,body.dedicated-client #dialog-kicker{color:var(--ui-gold)!important}

/* ---- Buttons: brown by default, green for the main action ---- */
.npc-option,.shop-toggle button,.shop-done,.item-btn,.item-side .shop-toggle button,.chat-tool,body.dedicated-client #dialog button{background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important;color:var(--ui-text)!important;box-shadow:inset 0 1px 0 #8a6a3e44!important}
.npc-option:hover,.npc-option:focus-visible,.shop-toggle button:hover,.shop-done:hover,.item-btn:not(:disabled):hover,.chat-tool:hover,body.dedicated-client #dialog button:hover{background:#3e2f20!important;border-color:var(--ui-green-line)!important;outline:none!important}
.npc-option.featured,.shop-go,.item-action:not(:disabled),.shop-toggle button.active,.item-side .shop-toggle button.active,body.dedicated-client #dialog button.gold{background:var(--ui-green)!important;border-color:var(--ui-green-line)!important;color:var(--ui-green-text)!important}
.npc-option.featured:hover,.shop-go:not(:disabled):hover,.item-action:not(:disabled):hover{background:var(--ui-green-hi)!important}
.npc-option.quiet{background:var(--ui-deep)!important}
.npc-option:disabled,.shop-go:disabled,.item-btn:disabled{background:var(--ui-deep)!important;border-color:var(--ui-line-soft)!important;color:#7d6c55!important;opacity:1!important}

/* ---- Shop ---- */
.shop-vendor{border-right-color:var(--ui-line)!important}
.shop-vendor-label{background:var(--ui-head)!important;border-bottom-color:var(--ui-line)!important;color:var(--ui-muted)!important}
.shop-row{border-bottom-color:var(--ui-line-soft)!important}
.shop-row:hover,.shop-row:focus-visible{background:#33271b!important}
.shop-row.selected{background:#2f3a20!important;border:1px solid var(--ui-green-line)!important}
.shop-row-text b{color:var(--ui-hp)!important}.shop-row-text small,.shop-gold{color:var(--ui-gold)!important}.shop-row i{color:#c8a860!important}
.shop-card,.item-card{background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important}
.shop-qty input[type=number]{background:var(--ui-deep)!important;border-color:var(--ui-line)!important;color:var(--ui-text)!important}
.shop-qty input[type=range]{accent-color:var(--ui-green-line)!important}
.shop-detail,.item-detail{background:var(--ui-deep)!important;border:1px solid var(--ui-line)!important;color:var(--ui-text)}

/* ---- Bank and inventory slots ---- */
.item-slot{background:var(--ui-deep)!important;border-color:var(--ui-line-soft)}
.item-slot:not(:disabled):hover{background:#2c2116!important}
.item-slot.selected{outline:2px solid var(--ui-green-line)!important;background:#26301a!important}
.slot-equipped{color:var(--ui-hp)!important}

/* ---- Chat ---- */
.chat-panel{background:rgba(36,26,17,.86)!important;border-top:2px solid var(--ui-line)!important;color:var(--ui-text)!important}
.chat-write input{background:var(--ui-deep)!important;border-color:var(--ui-line)!important;color:var(--ui-text)!important}
.chat-write input:focus{border-color:var(--ui-green-line)!important}
.chat-bar{background:var(--ui-head)!important}
.chat-tab{color:var(--ui-muted)!important;border-right-color:var(--ui-line-soft)!important}
.chat-tab.active{background:var(--ui-green)!important;color:var(--ui-green-text)!important}
.chat-players{background:rgba(31,23,15,.85)!important}
.chat-name,.chat-player{color:var(--ui-gold)!important}.chat-name.self,.chat-player.self{color:var(--ui-hp)!important}
.chat-hide-players{background:var(--ui-panel-2)!important;border-color:var(--ui-line)!important;color:var(--ui-gold)!important}

/* ---- HUD: toolbar, hotbar, world actions, portrait, minimap ---- */
body.dedicated-client .game-toolbar button,body.dedicated-client .action-bar .action,body.dedicated-client .world-actions button,body.dedicated-client .client-play-tools button{background:rgba(42,31,22,.92)!important;border:1px solid var(--ui-line)!important;box-shadow:inset 0 1px 0 #8a6a3e44!important;color:var(--ui-text)!important}
body.dedicated-client .game-toolbar button:hover,body.dedicated-client .action-bar .action:hover,body.dedicated-client .world-actions button:hover{border-color:var(--ui-green-line)!important}
body.dedicated-client .world-actions button[data-action=pvp]{background:#4a1c16!important;border-color:#8a3a2a!important;color:#ff8a72!important}
body.dedicated-client .portrait,body.dedicated-client .minimap-box{border:2px solid var(--ui-line)!important}
body.dedicated-client #task-tracker{background:rgba(42,31,22,.9)!important;border:1px solid var(--ui-line)!important}
body.dedicated-client #task-tracker b{color:var(--ui-gold)!important}
body.dedicated-client #toast-region>*{background:rgba(42,31,22,.94)!important;border:1px solid var(--ui-line)!important;color:var(--ui-text)!important}
body.dedicated-client #interact-hint button{background:rgba(42,31,22,.94)!important;border:1px solid var(--ui-green-line)!important;color:var(--ui-text)!important}
body.dedicated-client #interact-hint kbd{background:var(--ui-green)!important;color:var(--ui-green-text)!important;border-color:var(--ui-green-line)!important}

/* ---- Journal side panel ---- */
body.dedicated-client .journal{background:linear-gradient(180deg,#2e2218,#241a12)!important;border-color:var(--ui-line)!important;color:var(--ui-text)!important}
body.dedicated-client .journal-tabs button{background:var(--ui-panel-2)!important;border-color:var(--ui-line)!important;color:var(--ui-text)!important}
body.dedicated-client .journal-tabs button[aria-selected=true]{background:var(--ui-green)!important;border-color:var(--ui-green-line)!important;color:var(--ui-green-text)!important}
body.dedicated-client .inventory-item,body.dedicated-client .wallet,body.dedicated-client .equipment-current{background:var(--ui-panel-2)!important;border-color:var(--ui-line)!important}

/* ---- App / fullscreen buttons, docked at the end of the toolbar ---- */
body.dedicated-client .game-toolbar .client-play-tools{position:static!important;transform:none!important;display:flex!important;gap:6px;left:auto!important;top:auto!important}
body.dedicated-client .game-toolbar .client-play-tools button{width:44px!important;height:44px!important;min-width:0!important;padding:0!important;font-size:11px!important;border-radius:3px!important}
@media (max-height:560px),(max-width:640px){body.dedicated-client .game-toolbar .client-play-tools button{width:36px!important;height:36px!important}}
body.dedicated-client .game-toolbar .client-play-tools button:before,body.dedicated-client .game-toolbar .client-play-tools button:after{content:none!important;display:none!important}
body.dedicated-client .game-toolbar .client-play-tools button[data-client-action=fullscreen]{font-size:20px!important;line-height:1!important}

/* Shopkeeper portrait in the shop header */
.shop-window>header{gap:10px}
.shop-portrait{width:40px;height:40px;image-rendering:pixelated;background:var(--ui-deep);border:1px solid var(--ui-line);border-radius:3px}
@media (max-height:560px),(max-width:640px){.shop-portrait{width:30px;height:30px}}

/* ---- Character select and creation (title screen) ---- */
#client.client-lobby{background:linear-gradient(180deg,#2e2218f2,#21180ff2)!important;border:2px solid var(--ui-line)!important;box-shadow:var(--ui-shadow)!important;color:var(--ui-text)!important}
#client .client-topline{background:var(--ui-head)!important;border-bottom:1px solid var(--ui-line)!important;padding:8px 12px!important;align-items:center!important}
#client .client-topline>span{font-family:Cinzel,Georgia,serif!important;font-weight:700!important;font-size:17px!important;letter-spacing:.12em!important;color:var(--ui-gold)!important}
#client .client-topline button{font:600 13px Karla,sans-serif!important;padding:7px 12px!important;background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important;border-radius:3px!important;color:var(--ui-text)!important;box-shadow:none!important}
#client .client-topline button:hover{border-color:var(--ui-green-line)!important}
#client .creator-preview-panel,#client .creator-editor,#client .character-lobby{background:transparent!important}
#client .lobby-kicker,#client .appearance-fields legend,#client .name-label{font:700 12px Karla,sans-serif!important;letter-spacing:.14em!important;color:var(--ui-gold)!important}
#client .creator-display{background:radial-gradient(ellipse at 50% 45%,#3a2c1c,#1a130c 75%)!important;border:2px solid var(--ui-line)!important;border-radius:4px!important}
#client .preview-view-controls button{background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important;color:var(--ui-text)!important;font:600 13px Karla,sans-serif!important;border-radius:3px!important}
#client .preview-view-controls button[aria-pressed=true]{background:var(--ui-green)!important;border-color:var(--ui-green-line)!important;color:var(--ui-green-text)!important}
#client .class-card{background:var(--ui-panel-2)!important;border:2px solid var(--ui-line)!important;border-radius:4px!important;color:var(--ui-text)!important;box-shadow:none!important}
#client .class-card:hover{border-color:var(--ui-green-line)!important}
#client .class-card.selected{background:linear-gradient(180deg,#34401f,#26301a)!important;border-color:var(--ui-green-line)!important}
#client .class-card .class-name{font-family:Cinzel,Georgia,serif!important;font-weight:700!important;color:var(--ui-gold)!important}
#client .class-card small{color:var(--ui-muted)!important;letter-spacing:.1em!important}
/* The class's own description, shown under the class choice. */
#client #class-description{display:block!important;margin:8px 0 10px!important;padding:10px 14px!important;background:var(--ui-deep)!important;border:1px solid var(--ui-line)!important;border-left:3px solid var(--ui-green-line)!important;border-radius:3px!important;color:var(--ui-text)!important;font:italic 14px/1.45 Georgia,serif!important}
#client .appearance-fields{background:var(--ui-deep)!important;border:1px solid var(--ui-line)!important;border-radius:4px!important}
#client .appearance-fields label{color:var(--ui-muted)!important;font:600 13px Karla,sans-serif!important}
#client select,#client #hero-name{background:#1a130c!important;border:1px solid var(--ui-line)!important;border-radius:3px!important;color:var(--ui-text)!important;font:600 15px Karla,sans-serif!important}
#client select:focus,#client #hero-name:focus{border-color:var(--ui-green-line)!important;outline:none!important}
#client #begin{background:var(--ui-green)!important;border:1px solid var(--ui-green-line)!important;color:var(--ui-green-text)!important;font:700 15px Karla,sans-serif!important;border-radius:3px!important}
#client #begin:hover{background:var(--ui-green-hi)!important}
#client #creator-back{background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important;color:var(--ui-text)!important}
/* Local play and import sit as two small buttons, not full-width bars. */
#client #save-note{color:var(--ui-muted)!important}
#client #local-play,#client #title-import{display:inline-flex!important;width:auto!important;min-height:0!important;height:34px!important;margin:4px 6px 0 0!important;padding:0 16px!important;align-items:center!important;background:var(--ui-panel-2)!important;border:1px solid var(--ui-line)!important;border-radius:3px!important;color:var(--ui-text)!important;font:600 13px Karla,sans-serif!important;box-shadow:none!important;background-image:none!important}
#client #local-play:hover,#client #title-import:hover{border-color:var(--ui-green-line)!important}
#client .client-topline>span{visibility:visible!important}
#client #local-play,#client #title-import{align-self:center!important;width:240px!important;justify-content:center!important}

/* ---- Bigger analog stick for touch play ---- */
body.dedicated-client .joystick{width:150px!important;height:150px!important}
body.dedicated-client .joystick>span{width:64px!important;height:64px!important;background:#e8dcc055!important;border:2px solid #f0e4c488!important}
body.dedicated-client .joystick:before{inset:14px!important}
@media (max-height:420px){body.dedicated-client .joystick{width:130px!important;height:130px!important}body.dedicated-client .joystick>span{width:56px!important;height:56px!important}}
body.dedicated-client .touch-controls{width:auto!important;height:auto!important}

/* ---- Q / E class skills: a short name under the icon and a gold skill frame ---- */
body.dedicated-client #skill-q,body.dedicated-client #skill-e{border-color:#c9a24a!important;box-shadow:inset 0 0 0 1px #e8c87044,0 0 6px #e8c87033!important}
body.dedicated-client .action .skill-tag{position:absolute;left:0;right:0;bottom:2px;text-align:center;font:700 9px/1 Karla,sans-serif;letter-spacing:.02em;color:#f2dfa6;text-shadow:0 1px 0 #000,0 0 3px #000;pointer-events:none}
@media (max-height:560px),(max-width:640px){body.dedicated-client .action .skill-tag{font-size:8px;bottom:1px}}

/* Bigger, easier close buttons on every window. */
.npc-menu-close,.shop-close,.item-window .shop-close{min-width:40px!important;min-height:40px!important;font-size:22px!important;touch-action:manipulation!important;z-index:5!important}
.npc-menu.compact .npc-menu-close{min-width:36px!important;min-height:36px!important}
.npc-menu.compact .npc-menu-vitals{padding-right:46px!important}

/* ==== Window style: charcoal panel, stone frame, orange title, square X ====
   Matches the Season Pass reference: every window (NPC menu, shop, bank and
   inventory, dialogs, journal) shares the frame; each keeps its own title. */
:root{--win-bg:#2c2a28;--win-head:#34322f;--win-inset:#242220;--win-line:#4c4945;--win-frame:#3b3936;--win-title:#f0a23a;--win-text:#ece6dc;--win-muted:#b9b1a5}
.npc-menu,.shop-window,.item-window,body.dedicated-client #dialog,body.dedicated-client .journal{background:var(--win-bg)!important;border:6px solid var(--win-frame)!important;border-radius:3px!important;box-shadow:0 0 0 2px #121110,inset 0 0 0 2px #1d1c1a,inset 0 0 0 3px #57534e,0 14px 34px #000b!important;color:var(--win-text)!important}
.npc-menu header,.shop-window>header,.item-window>header,body.dedicated-client #dialog header,body.dedicated-client .journal>header{background:linear-gradient(180deg,#3a3835,var(--win-head))!important;border-bottom:3px solid #1f1d1b!important;box-shadow:inset 0 -1px 0 #57534e!important}
.npc-menu h2,.shop-window h2,.item-window h2,body.dedicated-client #dialog h2,body.dedicated-client #dialog-title,body.dedicated-client .journal h2{color:var(--win-title)!important;font:700 19px Karla,system-ui,sans-serif!important;letter-spacing:.01em!important;text-shadow:0 1px 0 #000!important;text-align:center!important}
/* The square close button with a heavy dark X. */
.npc-menu-close,.shop-close,.item-window .shop-close,body.dedicated-client #dialog-close,body.dedicated-client #close-bag{background:#4a4743!important;border:2px solid!important;border-color:#7a766f #262422 #262422 #7a766f!important;border-radius:2px!important;color:#1a1917!important;font:900 24px/1 Arial,sans-serif!important;text-shadow:0 1px 0 #8e8981!important;box-shadow:0 0 0 1px #121110!important}
.npc-menu-close:hover,.shop-close:hover,body.dedicated-client #dialog-close:hover,body.dedicated-client #close-bag:hover{background:#56524d!important;border-color:#8a857e #2a2826 #2a2826 #8a857e!important}
.npc-menu-close:active,.shop-close:active,body.dedicated-client #dialog-close:active{border-color:#262422 #7a766f #7a766f #262422!important}
/* Inset sections and rows. */
.shop-vendor-label,.shop-card,.item-card,.shop-detail,.item-detail,.item-slot,.npc-option,body.dedicated-client .inventory-item,body.dedicated-client .wallet,body.dedicated-client .equipment-current{background:var(--win-inset)!important;border-color:var(--win-line)!important}
.shop-vendor{border-right-color:var(--win-line)!important}.shop-row{border-bottom-color:#3a3734!important}.shop-row:hover,.shop-row:focus-visible{background:#33302d!important}
.shop-row.selected,.item-slot.selected{background:#3a3226!important;outline:none!important;border:1px solid var(--win-title)!important}
.npc-menu-text,.shop-note,.item-info,body.dedicated-client #dialog-content,body.dedicated-client #dialog-content p,.shop-vendor-label{color:var(--win-muted)!important}
.npc-menu-heading,.item-label,body.dedicated-client #dialog-kicker,.shop-gold,.shop-row-text small{color:var(--win-title)!important}
.npc-menu-vitals{color:#9fdc7c!important}
/* Buttons: grey bevels; the main action is outlined in the title orange. */
.npc-option,.shop-toggle button,.shop-done,.item-btn,body.dedicated-client #dialog button:not(#dialog-close),body.dedicated-client .journal-tabs button{background:#3a3835!important;border:1px solid!important;border-color:#615d57 #23211f #23211f #615d57!important;color:var(--win-text)!important;box-shadow:none!important}
.npc-option:hover,.npc-option:focus-visible,.shop-toggle button:hover,.shop-done:hover,.item-btn:not(:disabled):hover,body.dedicated-client #dialog button:not(#dialog-close):hover{background:#45423e!important;border-color:var(--win-title)!important}
.npc-option.featured,.shop-go,.item-action:not(:disabled),.shop-toggle button.active,.item-side .shop-toggle button.active,body.dedicated-client #dialog button.gold,body.dedicated-client .journal-tabs button[aria-selected=true]{background:linear-gradient(180deg,#5a4426,#463420)!important;border-color:var(--win-title)!important;color:#ffe2b0!important}
.npc-option:disabled,.shop-go:disabled,.item-btn:disabled{background:#262422!important;border-color:#3a3734!important;color:#7a746c!important}
.shop-portrait,.npc-menu-portrait{background:var(--win-inset)!important;border:1px solid var(--win-line)!important}

/* ==== Exact Season Pass palette (sampled from the reference) ====
   frame: near-black edge, dark rim, light bevel; body and title bar #494035;
   inset sections #322c24 with a light top bevel and darker lower edge; grid
   lines #585143; title #ff981f; bronze close button; slate-blue and gold rows. */
:root{--sp-edge:#0d0d0b;--sp-rim:#1d1c1a;--sp-rim2:#2e2b24;--sp-bevel:#444442;--sp-body:#494035;--sp-inset:#322c24;--sp-inset-hi:#5d5848;--sp-inset-lo:#484236;--sp-grid:#585143;--sp-title:#ff981f;--sp-gold:#dab456;--sp-slate:#2b3841;--sp-goldrow:#473c22;--sp-text:#efe6d2;--sp-muted:#c8bca4}
.npc-menu,.shop-window,.item-window,body.dedicated-client #dialog,body.dedicated-client .journal{background:var(--sp-body)!important;border:4px solid var(--sp-rim)!important;border-radius:2px!important;box-shadow:0 0 0 2px var(--sp-edge),inset 0 0 0 2px var(--sp-rim2),inset 0 0 0 3px var(--sp-bevel),0 14px 34px #000c!important;color:var(--sp-text)!important}
.npc-menu header,.shop-window>header,.item-window>header,body.dedicated-client #dialog header,body.dedicated-client .journal>header{background:var(--sp-body)!important;border-bottom:2px solid #141412!important;box-shadow:inset 0 -2px 0 #20201d,0 1px 0 var(--sp-inset-hi)!important}
.npc-menu h2,.shop-window h2,.item-window h2,body.dedicated-client #dialog h2,body.dedicated-client #dialog-title,body.dedicated-client .journal h2{color:var(--sp-title)!important;text-shadow:0 1px 0 #000,0 0 1px #000!important}
.npc-menu-close,.shop-close,.item-window .shop-close,body.dedicated-client #dialog-close,body.dedicated-client #close-bag{background:linear-gradient(180deg,#7b694d,#60523d)!important;border:2px solid!important;border-color:#a99368 #2b2b29 #2b2b29 #a99368!important;color:#1a150f!important;text-shadow:0 1px 0 #a99368!important;box-shadow:0 0 0 1px var(--sp-edge)!important}
.npc-menu-close:hover,.shop-close:hover,body.dedicated-client #dialog-close:hover,body.dedicated-client #close-bag:hover{background:linear-gradient(180deg,#8a7656,#6a5a42)!important;border-color:#bca474 #2b2b29 #2b2b29 #bca474!important}
.shop-vendor-label,.shop-card,.item-card,.shop-detail,.item-detail,.item-slot,.npc-option,.shop-grid,.npc-menu-body,body.dedicated-client .inventory-item,body.dedicated-client .wallet,body.dedicated-client .equipment-current{background:var(--sp-inset)!important;border:1px solid!important;border-color:var(--sp-inset-lo) var(--sp-inset-hi) var(--sp-inset-hi) var(--sp-inset-lo)!important}
.shop-vendor-label{background:#3a332a!important;color:var(--sp-text)!important}
.shop-vendor{border-right-color:var(--sp-grid)!important}.shop-row{border-bottom-color:var(--sp-grid)!important}.shop-row:hover,.shop-row:focus-visible{background:#3a332a!important}
.shop-row.selected,.item-slot.selected{background:var(--sp-slate)!important;border:1px solid #6a8aa8!important}
.npc-menu-text,.shop-note,.item-info,body.dedicated-client #dialog-content,body.dedicated-client #dialog-content p{color:var(--sp-muted)!important}
.npc-menu-heading,.item-label,body.dedicated-client #dialog-kicker,.shop-gold,.shop-row-text small{color:var(--sp-gold)!important}
.npc-option,.shop-toggle button,.shop-done,.item-btn,body.dedicated-client #dialog button:not(#dialog-close),body.dedicated-client .journal-tabs button{background:#3a332a!important;border:1px solid!important;border-color:var(--sp-inset-hi) #20201d #20201d var(--sp-inset-hi)!important;color:var(--sp-text)!important}
.npc-option:hover,.npc-option:focus-visible,.shop-toggle button:hover,.shop-done:hover,.item-btn:not(:disabled):hover,body.dedicated-client #dialog button:not(#dialog-close):hover{background:#433b30!important;border-color:var(--sp-title)!important}
.npc-option.featured,.shop-go,.item-action:not(:disabled),.shop-toggle button.active,.item-side .shop-toggle button.active,body.dedicated-client #dialog button.gold,body.dedicated-client .journal-tabs button[aria-selected=true]{background:var(--sp-goldrow)!important;border-color:var(--sp-gold)!important;color:#ffe9b0!important}
.npc-option:disabled,.shop-go:disabled,.item-btn:disabled{background:#2a251e!important;border-color:#3a342a!important;color:#857b6a!important}
.shop-portrait,.npc-menu-portrait{background:var(--sp-inset)!important;border:1px solid var(--sp-grid)!important}
/* The HUD in the same palette: toolbar, hotbar, tracker, toasts, chat, map. */
body.dedicated-client .game-toolbar button,body.dedicated-client .world-actions button,body.dedicated-client .client-play-tools button{background:var(--sp-body)!important;border:1px solid!important;border-color:var(--sp-inset-hi) #1d1c1a #1d1c1a var(--sp-inset-hi)!important;box-shadow:0 0 0 1px var(--sp-edge)!important;color:var(--sp-text)!important}
body.dedicated-client .action-bar .action{background:var(--sp-inset)!important;border:1px solid!important;border-color:var(--sp-inset-lo) var(--sp-inset-hi) var(--sp-inset-hi) var(--sp-inset-lo)!important;box-shadow:0 0 0 1px var(--sp-edge)!important;color:var(--sp-text)!important}
body.dedicated-client #skill-q,body.dedicated-client #skill-e{border-color:var(--sp-gold)!important;box-shadow:0 0 0 1px var(--sp-edge),inset 0 0 0 1px #00000055!important}
body.dedicated-client #task-tracker,body.dedicated-client #toast-region>*{background:rgba(50,44,36,.94)!important;border:1px solid var(--sp-grid)!important;box-shadow:0 0 0 1px var(--sp-edge)!important;color:var(--sp-text)!important}
body.dedicated-client #task-tracker b,body.dedicated-client #tracker-heading{color:var(--sp-title)!important}
body.dedicated-client .portrait,body.dedicated-client .minimap-box{border:2px solid var(--sp-body)!important;box-shadow:0 0 0 1px var(--sp-edge)!important}
.chat-panel{background:rgba(50,44,36,.9)!important;border-top:2px solid var(--sp-body)!important}.chat-bar{background:var(--sp-body)!important}.chat-tab.active{background:var(--sp-goldrow)!important;color:#ffe9b0!important}

/* One close button everywhere: the bronze square from the noticeboard, with
   its X drawn as two crossed bars so it sits dead centre at every size. */
html body.dedicated-client :is(#dialog-close,#close-bag,#install-close,[data-chat-close],.npc-menu-close,.shop-close){position:absolute!important;display:block!important;box-sizing:border-box!important;width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;margin:0!important;border:2px solid #d1ad62!important;outline:1px solid #272118!important;border-radius:0!important;background:linear-gradient(#9b865f,#6f6045)!important;color:transparent!important;font-size:0!important;text-shadow:none!important;box-shadow:inset 0 0 0 2px #403727,0 2px 4px #0008!important;cursor:pointer;transform:none}
html body.dedicated-client #close-bag{position:relative!important}
html body.dedicated-client :is(#dialog-close,#close-bag,#install-close,[data-chat-close],.npc-menu-close,.shop-close)::before,
html body.dedicated-client :is(#dialog-close,#close-bag,#install-close,[data-chat-close],.npc-menu-close,.shop-close)::after{content:""!important;position:absolute!important;inset:auto!important;left:50%!important;top:50%!important;width:66%!important;height:4px!important;margin:0!important;background:#17140f!important;border-radius:1px;filter:none!important;box-shadow:0 1px 0 #c8b384!important;transform:translate(-50%,-50%) rotate(45deg)!important}
html body.dedicated-client :is(#dialog-close,#close-bag,#install-close,[data-chat-close],.npc-menu-close,.shop-close)::after{transform:translate(-50%,-50%) rotate(-45deg)!important}
html body.dedicated-client :is(#dialog-close,#close-bag,#install-close,[data-chat-close],.npc-menu-close,.shop-close):hover{background:linear-gradient(#ab9468,#7c6b4d)!important}
html body.dedicated-client :is(#dialog-close,#close-bag,#install-close,[data-chat-close],.npc-menu-close,.shop-close):active{background:linear-gradient(#6f6045,#9b865f)!important}
/* Centred on the title bar of shop and item windows. */
html body.dedicated-client .shop-window>header .shop-close,body.dedicated-client .item-window>header .shop-close{top:50%!important;right:12px!important;transform:translateY(-50%)!important}
html body.dedicated-client .npc-menu .npc-menu-close{top:8px!important;right:8px!important}
html body.dedicated-client .npc-menu.compact .npc-menu-close{width:30px!important;min-width:30px!important;height:30px!important;min-height:30px!important}
html body.dedicated-client [data-chat-close]{width:24px!important;min-width:24px!important;height:24px!important;min-height:24px!important;border-width:1px!important}
html body.dedicated-client [data-chat-close]::before,body.dedicated-client [data-chat-close]::after{height:3px!important}
@media(max-width:700px){html body.dedicated-client :is(#dialog-close,.npc-menu-close,.shop-close){width:32px!important;min-width:32px!important;height:32px!important;min-height:32px!important}}

/* Equipment: nine worn-gear slots above the inventory details. */
.item-gear{display:grid;grid-template-columns:repeat(3,58px);grid-auto-rows:58px;gap:6px;justify-content:center;padding:10px;background:var(--sp-inset);border:1px solid;border-color:var(--sp-inset-lo) var(--sp-inset-hi) var(--sp-inset-hi) var(--sp-inset-lo)}
.item-gear[hidden]{display:none}
.gear-cell{position:relative;display:flex;align-items:center;justify-content:center;padding:0;background:#2b261f!important;border:1px solid var(--sp-grid)!important;border-radius:2px;cursor:pointer}
.gear-cell:disabled{cursor:default}
.gear-cell.selected{outline:2px solid var(--sp-title);outline-offset:-2px}
.gear-label{font:700 10px Karla,system-ui,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:#8a8170}
.halm-icon{width:40px;height:40px;image-rendering:pixelated;object-fit:contain}
.item-slot .halm-icon{width:44px;height:44px}
@media(max-width:700px){.item-gear{grid-template-columns:repeat(3,42px);grid-auto-rows:42px;gap:4px;padding:6px}.halm-icon,.item-slot .halm-icon{width:32px;height:32px}.gear-label{font-size:8px}}