/* v0.11.8: compact icon HUD. See UI_DESIGN_GUIDE.md before extending. */
body.playing #hud-left{width:150px;gap:5px;overflow:hidden;display:flex;flex-direction:column}
body.playing .hud-weather{min-height:50px;grid-template-columns:32px 1fr;padding:5px;gap:3px;flex-shrink:0}
#stage-portrait{grid-row:1 / 3;width:32px;height:40px}
body.playing #hud-synergies{flex:1;min-height:0;overflow:auto;padding:2px 2px 4px;scrollbar-gutter:stable}
body.playing #hud-left .synergy-card{padding:0!important}
body.playing #hud-left .synergy-entry{padding:4px;gap:5px;border-radius:5px;min-height:32px}
body.playing #hud-left .synergy-active-list{gap:4px}
body.playing #hud-left .synergy-inactive-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-top:5px}
body.playing #hud-left .syn-data{position:static}
body.playing #hud-left .syn-top{align-items:center;gap:3px;line-height:1.15}
body.playing #hud-left .syn-top strong{font-size:12px;white-space:nowrap}
body.playing #hud-left .syn-top b{font-size:11px}
body.playing #hud-left .syn-effect,body.playing #hud-left .syn-status{display:none}
body.playing #hud-left .inactive .syn-top{flex-direction:column;align-items:flex-start;gap:1px}
body.playing #hud-left .inactive .syn-top strong{display:block;font-size:10px;white-space:normal}
body.playing #hud-left .inactive .syn-top b{font-size:10px}
body.playing #hud-left .synergy-entry.inactive{padding:4px 2px;gap:3px;min-height:33px}
body.playing #hud-left .syn-near{position:absolute;right:-1px;top:-4px;font-size:9px;line-height:11px;padding:0 2px}
body.playing #hud-left .synergy-entry .synergy-vector,body.playing #hud-left .synergy-entry .synergy-portrait,body.playing #hud-left .synergy-entry .type-symbol{width:23px;height:23px;flex-basis:23px}
body.playing #hud-left .inactive .synergy-vector,body.playing #hud-left .inactive .synergy-portrait,body.playing #hud-left .inactive .type-symbol{width:17px;height:17px;flex-basis:17px}
body.playing #hud-topstats .header-end{display:flex;align-items:center;gap:10px}
body.playing #hud-topstats #journey-btn{display:flex;align-items:center;gap:4px;position:static;padding:0;margin:0;width:auto;min-height:30px;border:0;box-shadow:none;background:none;color:#fff0b4;font-size:17px;pointer-events:auto}
body.playing #hud-topstats #journey-btn img{width:26px;height:26px}
body.playing #hud-items.gear-rail{background:#15273dd6;border-color:#879caa77;border-radius:6px;padding:2px;box-shadow:none}
body.playing #hud-items.gear-rail summary{padding:0 1px;min-height:23px}
.gear-rail summary>span{display:flex;align-items:center;gap:3px}.gear-bag-icon{width:18px;height:18px;object-fit:contain;image-rendering:pixelated}
body.playing #hud-items.gear-rail .item-slot{border-radius:5px;flex-basis:26px;width:26px;height:26px;padding:1px}
body.playing #hud-items.gear-rail .item-slot small{display:none}
.gear-craft-actions{display:flex;gap:4px;flex-wrap:wrap}.gear-craft-actions button{font-size:11px;padding:5px 7px;border-radius:5px;min-height:30px}
.gear-craft-actions [data-gear-direct]{border-color:#dec37c;color:#ffedb2;background:#36423f}
.gear-recipe footer{flex-wrap:wrap;gap:4px}
#gear-craft-feedback:empty{display:none}#gear-craft-feedback{position:sticky;top:0;display:flex;align-items:center;gap:8px;padding:5px 8px;background:#23473df5;border:1px solid #95d5a6;color:#e7ffe5;z-index:2;border-radius:5px;font-size:12px}
#gear-craft-feedback .gear-icon{width:26px;height:26px}
/* One supplied image, no redraw or character substitution. */
.hud-coin,body.playing .hud-coin,body.playing .gold-resource .hud-coin,body.playing #hud-shop-gold .hud-coin,#gold-popover .hud-coin,.interest-coin{display:inline-block;position:relative;width:19px;height:19px;flex-shrink:0;vertical-align:middle;box-sizing:border-box;border:0;border-radius:0;background:url('assets/ui/pikachu-coin.webp') center/contain no-repeat;box-shadow:none;filter:drop-shadow(0 0 2px #ffdc7988)}
body.playing .hud-coin:after,body.playing .gold-resource .hud-coin:after,body.playing #hud-shop-gold .hud-coin:after,#gold-popover .hud-coin:after{content:none}
body.playing #hud-shop-gold .hud-coin,#gold-popover .hud-coin{width:28px;height:28px}
body.playing .shop-card .shop-cost:before{content:'';display:inline-block;width:17px;height:17px;vertical-align:middle;margin-right:2px;background:url('assets/ui/pikachu-coin.webp') center/contain no-repeat}
.interest-coin{width:34px;height:34px}.interest-coins{gap:5px}.interest-badge{top:7px}
.interest-max .interest-coin:first-child{box-shadow:none;filter:drop-shadow(0 0 5px #ffde66bb)}
.gold-rise .hud-coin{width:22px!important;height:22px!important}
@media(max-width:1100px) and (max-height:780px),(pointer:coarse) and (max-height:740px){
 body.playing #hud-left{width:112px;gap:4px}body.playing .hud-weather{min-height:44px;grid-template-columns:24px 1fr;padding:3px}#stage-portrait{width:24px;height:34px}
 body.playing #hud-left .synergy-entry{min-height:29px;padding:3px;gap:3px}body.playing #hud-left .syn-top strong{font-size:11px}body.playing #hud-left .syn-top b{font-size:10px}
 body.playing #hud-left .synergy-entry .type-symbol,body.playing #hud-left .synergy-entry .synergy-vector,body.playing #hud-left .synergy-entry .synergy-portrait{width:20px;height:20px;flex-basis:20px}
 body.playing #hud-left .synergy-inactive-list{gap:4px 3px}body.playing #hud-left .inactive .syn-top strong,body.playing #hud-left .inactive .syn-top b{font-size:10px}
 body.playing #hud-left .synergy-entry.inactive{gap:2px;padding:3px 1px}body.playing #hud-left .inactive .type-symbol,body.playing #hud-left .inactive .synergy-vector,body.playing #hud-left .inactive .synergy-portrait{width:14px;height:14px;flex-basis:14px}
 body.playing #hud-topstats .header-end{gap:5px}body.playing #hud-topstats #journey-btn{font-size:14px;min-height:27px}body.playing #hud-topstats #journey-btn img{width:21px;height:21px}
 .interest-coin{width:28px;height:28px}.interest-badge{top:5px}body.playing #hud-shop-gold .hud-coin{width:25px;height:25px}
}