:root { --exp-equipment-a:url('/assets/img/equipment_a.webp'); --exp-equipment-b:url('/assets/img/equipment_b.webp'); }
.equipment-art { position:relative; display:block; width:96px; height:96px; flex-shrink:0; overflow:hidden; border:1px solid var(--exp-line); border-radius:7px; background:var(--exp-base); }
.equipment-art .equipment-art__image { position:absolute; display:block; width:400%; height:400%; max-width:none; }
.product-card[data-exp-equipment] .product-card__emoji,.operation-card[data-exp-equipment] .operation-card__icon { width:96px!important; height:96px!important; font-size:0!important; color:transparent!important; background-image:var(--equipment-sheet)!important; background-size:400% 400%!important; background-position:var(--equipment-x) var(--equipment-y)!important; background-repeat:no-repeat!important; }
.operation-card[data-exp-equipment] .operation-card__icon svg { visibility:hidden; }
.army-row[data-exp-equipment]>span:first-child,.owned-row[data-exp-equipment]>.owned-row__bullet,.building-row[data-exp-equipment]>span:first-child,.resource-row[data-exp-equipment]>span:first-child,.camp-row[data-exp-equipment]>span:first-child,.research-row[data-exp-equipment]>span:first-child { display:block!important; width:68px!important; height:68px!important; flex:0 0 68px; font-size:0!important; color:transparent!important; border-radius:6px; background-image:var(--equipment-sheet)!important; background-size:400% 400%!important; background-position:var(--equipment-x) var(--equipment-y)!important; background-repeat:no-repeat!important; }
.economy-hero[data-exp-equipment]::after,.fleet-card[data-exp-equipment]::after,.production-card[data-exp-equipment]::after,.land-status[data-exp-equipment]::after,.nuclear-status[data-exp-equipment]::after { content:''; position:absolute; inset-block-start:0; inset-inline-end:0; height:100%; aspect-ratio:1; opacity:.45; background-image:var(--equipment-sheet); background-size:400% 400%; background-position:var(--equipment-x) var(--equipment-y); pointer-events:none; mask-image:linear-gradient(90deg,black,transparent); }
.economy-hero[data-exp-equipment]>*,.fleet-card[data-exp-equipment]>*,.production-card[data-exp-equipment]>*,.land-status[data-exp-equipment]>*,.nuclear-status[data-exp-equipment]>* { position:relative; z-index:1; }
.equipment-hero-art { position:absolute!important; inset-block-start:0; inset-inline-end:0; height:100%; aspect-ratio:1; opacity:.5; z-index:0!important; pointer-events:none; mask-image:linear-gradient(90deg,black,transparent); }
.equipment-hero-art .equipment-art { width:100%; height:100%; border:0; border-radius:0; }
.economy-hero:has(.equipment-hero-art)::after,.fleet-card:has(.equipment-hero-art)::after { display:none; }
.product-card__top .equipment-art+div { min-width:0; }
@media(max-width:390px) { .equipment-art,.product-card[data-exp-equipment] .product-card__emoji,.operation-card[data-exp-equipment] .operation-card__icon { width:84px!important; height:84px!important; } .equipment-hero-art .equipment-art { width:100%!important; height:100%!important; } }