/* ================= COLLECTIONS WINDOW (21 Oct, owner): the list of every collection on the left, my finds on the right =================
   js/client/79-cols-ui.js. The find's tooltip (artTip) uses the common #tip panel. */
.cw{display:grid;grid-template-columns:270px minmax(0,1fr);gap:10px;height:min(68vh,640px);min-height:320px}
.cw .cwL,.cw .cwR{overflow:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#5a4c34 transparent}
.cw .cwL{border:1px solid var(--line);background:#1a130c;padding:6px;display:flex;flex-direction:column;gap:2px;align-content:start}
.cw .cwR{padding:0 4px 0 0}
.cw #cwQ{width:100%;box-sizing:border-box;margin:0 0 6px;padding:6px 8px;background:#120d08;border:1px solid var(--line);color:var(--ink);font:500 12.5px var(--f-ui);border-radius:4px}
.cw #cwQ:focus{outline:none;border-color:var(--ember2)}
.cw .cwG{margin:6px 0 2px;padding:5px 7px;display:flex;justify-content:space-between;align-items:center;gap:8px;cursor:pointer;user-select:none;
  font:700 12.5px var(--f-display);color:var(--ember2);border:1px solid transparent;border-radius:4px;background:#22180f}
.cw .cwG:hover{border-color:#5a4c34}
.cw .cwG.on{border-color:#5a4c34;color:#f0e3bb}
.cw .cwG span{flex:1;min-width:0}
.cw .cwG small{color:var(--dim);font:600 11px var(--f-ui)}
.cw .cwG::before{content:'▸';color:var(--dim);margin-right:5px;font-size:11px}
.cw .cwG.on::before{content:'▾'}
.cw .cwC{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;box-sizing:border-box;text-align:left;
  padding:4px 7px 4px 16px;background:none;border:1px solid transparent;border-radius:4px;color:var(--ink);font:500 12px/1.25 var(--f-ui);cursor:pointer}
.cw .cwC span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cw .cwC small{flex:none;font:600 11px var(--f-ui)}
.cw .cwC:hover{background:#2a2016;border-color:#5a4c34}
.cw .cwC.on{background:#3a2a16;border-color:var(--ember2);color:#f0e3bb}
.cw .cwC.done span{color:var(--good)}
.cw .cwC.cwAll{padding-left:7px;font-weight:700;margin-bottom:2px}
.cw .cwH{margin:8px 0 6px;display:flex;justify-content:space-between;align-items:center;font:700 13px var(--f-display);color:var(--ember2)}
.cw .cwH small{color:var(--dim);font:600 11px var(--f-ui)}
.cw .cwSel{margin-bottom:6px}
.cw .cwSel h4{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 6px;font:600 13px/1.3 var(--f-ui)}
.cw .cwSel h4 b{color:var(--good);font-weight:600;text-align:right}
.cw .cwGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:5px}
.cw .cwA{cursor:pointer}
.cw .cwA canvas{width:48px;height:48px;image-rendering:pixelated}
.cw .cwA span{font-size:11px;line-height:1.15;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cw .cwA i{font-style:normal;font:700 11px var(--f-ui);display:flex;gap:5px;justify-content:center}
.cw .cwA i em{font-style:normal;color:var(--dim)}
.cw .cwA i b{color:var(--gold)}
#tip .cwTc{margin-top:3px;padding-top:3px;border-top:1px solid #ffffff14}
@media (max-width:900px){.cw{grid-template-columns:1fr;height:auto;max-height:70vh}.cw .cwL{max-height:38vh}}
/* 22 Oct (owner): a find picked — every collection it goes into, one card each (79-cols-ui.js colwFind) */
.cw .cwFind > h4{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0;font:600 15px/1.3 var(--f-ui)}
.cw .cwFind > h4 small{font:500 12px var(--f-ui)}
.cw .cwFind .col{margin-bottom:6px}
.cw .cwFind .col h4{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 6px;font:600 13px/1.3 var(--f-ui)}
.cw .cwFind .col h4 b{color:var(--good);font-weight:600;text-align:right}
.cw .cwFind .col.done h4 span{color:var(--good)}
/* 22 Oct (owner): a piece of a collection picked: «Вставить» and its auction prices (79-cols-ui.js cwPiece); «Заполнить с помощью аукциона» (cwAucRow) */
.cw .col[data-cid] .art{cursor:pointer}
.cw .col[data-cid] .art.on{outline:2px solid var(--ember2);outline-offset:1px}
.cw .cwPk,.cw .cwAf{margin-top:6px;padding:7px 9px;border:1px solid var(--line);background:#1a130c;border-radius:4px;font:500 12.5px/1.45 var(--f-ui);color:var(--ink)}
.cw .cwPkH{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:2px}
.cw .cwPkH small{color:var(--dim);font:500 12px var(--f-ui)}
.cw .cwPkH .btn{padding:1px 7px}
.cw .cwBtns{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cw .cwBtns .btn,.cw .cwAfH .btn{font-size:12px;padding:4px 9px}
.cw .cwAfH{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cw .cwAf ul{margin:5px 0 3px;padding-left:18px;color:var(--dim)}
/* 22 Oct (owner): «В сумке» above «Все мои находки»: the finds not filled in yet (79-cols-ui.js) */
.cw .cwC.cwBagB small{color:var(--gold)}
/* 30 Oct (owner): the inventory's «Коллекции» tab (04-city-ui.js renderInv) has the same piece panel and the fill from the auction as the
   collections window: «Заполнить всё» on the right of a collection, a click on a piece; a find of the bag opens a small menu (artMenu) and the
   form that puts it up on the auction (artSell, in #ctx) */
.col[data-cid] .art{cursor:pointer}
.col[data-cid] .art.on{outline:2px solid var(--ember2);outline-offset:1px}
.col h4 .colR{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-left:auto}
.col h4 .colFill{font:600 12px var(--f-ui);padding:3px 10px;letter-spacing:0}
.col .cwPk,.col .cwAf{margin-top:6px;padding:7px 9px;border:1px solid var(--line);background:#1a130c;border-radius:4px;font:500 12.5px/1.45 var(--f-ui);color:var(--ink)}
.col .cwPkH{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:2px}
.col .cwPkH small{color:var(--dim);font:500 12px var(--f-ui)}
.col .cwPkH .btn{padding:1px 7px}
.col .cwBtns{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.col .cwBtns .btn,.col .cwAfH .btn{font-size:12px;padding:4px 9px}
.col .cwAfH{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.col .cwAf ul{margin:5px 0 3px;padding-left:18px;color:var(--dim)}
.bagArts .art{cursor:pointer}
#ctx.asell{width:280px}
#ctx .asBox{display:flex;flex-direction:column;gap:5px;padding:2px 2px 0;font-size:12px}
#ctx .asBox label{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--ink);font:600 12px var(--f-ui)}
#ctx .asBox input{width:62%;padding:4px 6px;border-radius:6px;border:1px solid var(--line);background:#0c0906;color:var(--ink);font:600 13px var(--f-ui)}
#ctx .asBox small{padding:0;line-height:1.3}
#ctx.amenu{z-index:12}