/* UI PANEL ASSETS */
#verbs{background-image:url('ui-verbs.png')!important;background-size:100% 100%!important;background-color:transparent!important;border-top:none!important}
#inv{background-image:url('ui-inventory.png')!important;background-size:100% 100%!important;background-color:transparent!important;border-top:none!important}
#si{background-image:url('ui-speech.png')!important;background-size:100% 100%!important;background-color:rgba(8,4,18,.93)!important;background-blend-mode:multiply!important;border:none!important;padding:16px 24px 20px 24px!important}
#si::after{display:none!important}
#si img,#si canvas{background-color:transparent!important}
.map-grid{background-image:url('ui-map.png')!important;background-size:cover!important;background-position:center!important;border-radius:4px}

/* TITLE SCREEN */
#title{background-image:url('title.png')!important;background-size:cover!important;background-position:center!important;background-color:#000!important}
#title h1,#title .subtitle{text-shadow:0 0 20px rgba(0,0,0,0.9),0 0 40px rgba(0,0,0,0.7)!important}

/* ITEM SPRITE ICONS - 6 cols x 2 rows, each 36x36px */
.inv-icon{width:36px!important;height:36px!important;background-image:url('items.png')!important;background-repeat:no-repeat!important;display:inline-block!important;image-rendering:pixelated!important;background-color:transparent!important}
.inv-icon.compass{background-position:0 0!important}
.inv-icon.grimoire_page{background-position:-36px 0!important}
.inv-icon.ace_card{background-position:-72px 0!important}
.inv-icon.burning_scroll{background-position:-108px 0!important}
.inv-icon.crystal{background-position:-144px 0!important}
.inv-icon.fox_mask{background-position:-180px 0!important}
.inv-icon.skeleton_key{background-position:0 -36px!important}
.inv-icon.moonwater{background-position:-36px -36px!important}
.inv-icon.ember{background-position:-72px -36px!important}
.inv-icon.coal{background-position:-108px -36px!important}
.inv-icon.tear{background-position:-144px -36px!important}
.inv-icon.rune{background-position:-180px -36px!important}

/* PLAYER SPRITE */
#player{width:48px!important;height:72px!important;font-size:0!important;color:transparent!important;overflow:hidden!important;
background:url('player.png') no-repeat!important;background-size:288px 504px!important;
background-position:0 -288px!important;image-rendering:pixelated!important;
transform:translate(-50%,-100%)!important;
filter:drop-shadow(0 3px 6px rgba(0,0,0,0.7))!important}
#player.idle{animation:spr-idle 1.2s steps(6) infinite!important;background-position:0 -144px!important}
#player.walk-r{animation:spr-walk-r 0.5s steps(6) infinite!important}
#player.walk-l{animation:spr-walk-l 0.5s steps(6) infinite!important}
#player.walk-d{animation:spr-walk-d 0.5s steps(6) infinite!important}
#player.walk-u{animation:spr-walk-u 0.5s steps(6) infinite!important}
@keyframes spr-idle{from{background-position:0 -288px}to{background-position:-288px -288px}}
@keyframes spr-walk-r{from{background-position:0 0}to{background-position:-288px 0}}
@keyframes spr-walk-l{from{background-position:0 -72px}to{background-position:-288px -72px}}
@keyframes spr-walk-d{from{background-position:0 -144px}to{background-position:-288px -144px}}
@keyframes spr-walk-u{from{background-position:0 -216px}to{background-position:-288px -216px}}

/* ═══ NPC SPRITE COMPOSITING ═══ */
/* Ground sprites into the painted backgrounds */
.npc{
  background-color:transparent!important;
  filter:brightness(0.8) contrast(1.15) saturate(0.7) drop-shadow(0 4px 12px rgba(0,0,0,0.8)) drop-shadow(0 1px 3px rgba(0,0,0,0.9))!important;
  opacity:0.92!important;
  image-rendering:auto!important;
}
/* Scene-specific color grading to match each background's palette */
[data-scene="tavern"] .npc,[data-scene="hearth"] .npc{filter:brightness(0.75) contrast(1.1) saturate(0.6) sepia(0.15) drop-shadow(0 4px 12px rgba(0,0,0,0.8))!important}
[data-scene="temple"] .npc,[data-scene="sanctum"] .npc{filter:brightness(0.8) contrast(1.2) saturate(0.5) hue-rotate(10deg) drop-shadow(0 4px 12px rgba(10,0,30,0.8))!important}
[data-scene="garden"] .npc,[data-scene="wellspring"] .npc{filter:brightness(0.85) contrast(1.1) saturate(0.65) hue-rotate(-5deg) drop-shadow(0 4px 12px rgba(0,10,0,0.7))!important}
[data-scene="village"] .npc{filter:brightness(0.8) contrast(1.15) saturate(0.6) drop-shadow(0 4px 12px rgba(20,10,40,0.8))!important}
[data-scene="dock"] .npc,[data-scene="underdock"] .npc{filter:brightness(0.75) contrast(1.1) saturate(0.5) sepia(0.1) drop-shadow(0 4px 12px rgba(0,0,20,0.8))!important}
[data-scene="throne"] .npc{filter:brightness(0.85) contrast(1.2) saturate(0.55) hue-rotate(5deg) drop-shadow(0 4px 12px rgba(20,0,40,0.8))!important}

/* GLOBAL WHITE BG NUKE */
#speech *{background-color:transparent!important}
.is img,.is svg{background:transparent!important}