/* Towarzysz gracza (ui/companion.js): portret pod listą drużyny i okno sprzętu. Styl jak w reszcie HUD: ciemne panele, cienki kontur, bez zaokrągleń. */
#comphud { position: fixed; right: 22px; bottom: 124px; z-index: 6; pointer-events: none; font: 12px Bahnschrift, sans-serif; color: #d2ccb0; text-transform: uppercase; letter-spacing: .06em; }
.ch-box { display: flex; align-items: center; gap: 8px; padding: 6px 9px 6px 6px; background: rgba(12,14,9,.82); border: 1px solid #5a5746; box-shadow: 0 2px 8px rgba(0,0,0,.45); }
.ch-box svg { width: 34px; height: 34px; fill: #8a9a6a; stroke: rgba(10,12,7,.8); stroke-width: .8; flex: none; }
.ch-box.down svg { fill: #b0382c; }
.ch-meta { display: flex; flex-direction: column; gap: 3px; min-width: 130px; }
.ch-meta b { font-weight: 700; color: #e8e2c4; }
.ch-meta span { font-size: 10px; color: #a9a385; }
.ch-box.down .ch-meta span { color: #f0b6ac; }
.ch-box em { font-style: normal; font-weight: 700; font-size: 10px; border: 1px solid #6a674f; padding: 1px 4px; color: #bdb690; }
.ch-bar { position: relative; height: 6px; background: rgba(0,0,0,.6); border: 1px solid #4a473a; }
.ch-bar i { position: absolute; left: 0; top: 0; bottom: 0; background: linear-gradient(180deg, #7fb05a, #4d7a36); }
#compwin { position: fixed; right: 22px; top: var(--mm-bottom); width: 300px; z-index: 19; pointer-events: auto; font: 13px Bahnschrift, sans-serif; color: #d2ccb0; }
.cw-box { position: relative; padding: 14px 16px 14px; background: rgba(22,25,17,.97); border: 1px solid #5a5746; box-shadow: 0 8px 26px rgba(0,0,0,.6); }
.cw-box h3 { margin: 0 0 8px; font: 700 13px Bahnschrift, sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #b4ae92; }
.cw-box h4 { margin: 10px 0 6px; font: 700 11px Bahnschrift, sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #8e8a72; }
.cw-x { position: absolute; top: 6px; right: 6px; width: 26px; height: 26px; padding: 0; background: rgba(30,34,24,.9); border: 1px solid #5a5746; color: #cfc9ac; cursor: pointer; }
.cw-hp { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.cw-hp .ch-bar { flex: 1; height: 8px; }
.cw-hp span { font-size: 12px; font-variant-numeric: tabular-nums; color: #d8d2b4; min-width: 64px; text-align: right; }
.cw-orders { display: flex; gap: 4px; margin-bottom: 8px; }
.cw-orders button, .cw-slots button, .cw-give button { font: 600 11px Bahnschrift, sans-serif; color: #d2ccb0; background: rgba(40,44,32,.9); border: 1px solid #4a473a; padding: 4px 7px; cursor: pointer; }
.cw-orders button { flex: 1; }
.cw-orders button.on { border-color: #b9d07a; color: #f1f0c8; background: rgba(70,84,44,.9); }
.cw-slots { display: flex; flex-direction: column; gap: 4px; }
.cw-row { display: flex; align-items: center; gap: 8px; min-height: 22px; }
.cw-l { width: 74px; flex: none; font: 600 10px Bahnschrift, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: #8e8a72; }
.cw-v { flex: 1; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 12px; }
.cw-give { display: flex; flex-wrap: wrap; gap: 4px; }
.cw-give i, .cw-row i { color: #8e8a72; }
.cw-hint { margin: 10px 0 0; font-size: 11px; line-height: 1.35; color: #8e8a72; }