/* Compact side columns leave the character and its name a dedicated middle column. */
#modal[data-view=bag] .inventory-loadout .paperdoll{grid-template-columns:72px minmax(0,1fr) 72px;grid-template-rows:repeat(5,68px) auto;gap:3px 6px;padding:6px 8px;overflow:visible}
#modal[data-view=bag] .paper-character{position:relative;inset:auto;grid-column:2;grid-row:1/6;align-self:center;min-width:0;width:100%;height:auto;box-sizing:border-box;overflow:hidden}
#modal[data-view=bag] .paper-character canvas{display:block;width:100%;height:auto;max-height:154px;aspect-ratio:260/370;object-fit:contain}
#modal[data-view=bag] .paper-character strong,#modal[data-view=bag] .paper-character small{white-space:normal;overflow-wrap:anywhere}
#modal[data-view=bag] .paper-slot{min-width:0;width:100%;align-self:start}
#modal[data-view=bag] .paper-slot>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:12px;min-height:12px;margin-bottom:2px;font-size:8px}
#modal[data-view=bag] .paper-slot .inventory-item,#modal[data-view=bag] .paper-slot .empty-slot{box-sizing:border-box;width:52px;height:52px;max-width:100%;padding:1px 1px 9px;position:relative}
#modal[data-view=bag] .paper-slot .inventory-item>small{bottom:10px;font-size:8px;padding:0 1px}
#modal[data-view=bag] .paper-slot .item-power-badge{font-size:5px;gap:1px;line-height:9px;min-height:9px;padding:0 1px}
#modal[data-view=bag] .paper-slot .item-power-badge>span{font-size:5px}
#modal[data-view=bag] .slot-helmet{grid-column:1;grid-row:1}
#modal[data-view=bag] .slot-weapon{grid-column:1;grid-row:2}
#modal[data-view=bag] .slot-gloves{grid-column:1;grid-row:3}
#modal[data-view=bag] .slot-ring1{grid-column:1;grid-row:4}
#modal[data-view=bag] .slot-ring2{grid-column:1;grid-row:5}
#modal[data-view=bag] .slot-amulet{grid-column:3;grid-row:1}
#modal[data-view=bag] .slot-offhand{grid-column:3;grid-row:2}
#modal[data-view=bag] .slot-armor{grid-column:3;grid-row:3}
#modal[data-view=bag] .slot-belt{grid-column:3;grid-row:4}
#modal[data-view=bag] .slot-boots{grid-column:3;grid-row:5}
#modal[data-view=bag] .equipped-totals{grid-column:1/-1;grid-row:6;min-width:0;overflow-wrap:anywhere;font-size:10px;gap:4px;padding-top:6px}
#modal[data-view=bag] .equipped-totals span{flex-wrap:wrap;gap:2px 6px}
.equipment-block-reason{margin:8px 0;padding:8px 10px;border:1px solid #d39462;border-radius:5px;background:#4a3023;color:#ffdbb7;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.item-power-preview{margin:7px 0 0;color:#ffd69b;font-size:11px;line-height:1.6;overflow-wrap:anywhere}
@media(min-width:681px) and (max-height:800px){
 #modal[data-view=bag] .inventory-loadout .paperdoll{grid-template-columns:72px minmax(0,1fr) 72px;grid-template-rows:repeat(5,62px) auto;gap:2px 6px;padding:4px 8px}
 #modal[data-view=bag] .paper-slot .inventory-item,#modal[data-view=bag] .paper-slot .empty-slot{width:48px;height:48px}
 #modal[data-view=bag] .paper-character canvas{max-height:140px}
}
@media(max-width:680px){#modal[data-view=bag] .paper-character canvas{max-height:154px}}

.equipment-comparison table,.gear-impact table{width:100%;table-layout:fixed}.equipment-comparison td,.gear-impact td{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:11px;padding:6px 3px}.equipment-comparison th,.gear-impact th{overflow-wrap:anywhere}.gear-impact th:first-child,.equipment-comparison th:first-child{width:28%}
