/* Plonk trade v2: scoped to #tradePanel; works with the existing PS1 theme. */
#tradePanel { width:min(810px,94vw); max-width:810px; }
#tradePanel .sheet-body { overflow-y:auto; max-height:min(72vh,680px); }
#tradePanel .tv-v2 { color:var(--ink,#e6dac3); font-size:13px; padding:2px; }
#tradePanel .tv-v2 button,#tradePanel .tv-v2 select,#tradePanel .tv-v2 input { font:inherit; }
#tradePanel .tv-v2 button { min-height:36px; border:1px solid #866443; background:#453323; color:#f6e0ba; border-radius:5px; padding:7px 9px; cursor:pointer; }
#tradePanel .tv-v2 button:hover { border-color:#d0a25c; }
#tradePanel .tv-v2 button:disabled { opacity:.38; cursor:not-allowed; }
#tradePanel .tv-v2 .tv-primary { background:#356542; border-color:#a3cf8b; color:#f1ffe2; font-weight:bold; }
#tradePanel .tv-v2 .tv-toolbar { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:8px; padding:4px 5px 12px; }
#tradePanel .tv-v2 .tv-toolbar label { display:inline-flex; align-items:center; gap:7px; }
#tradePanel .tv-v2 .tv-subtle { color:#b9ac92; font-size:11px; }
#tradePanel .tv-v2 .tv-columns { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
#tradePanel .tv-v2 .tv-side { min-width:0; border:2px solid #765032; background:linear-gradient(#33271f,#211b19); border-radius:7px; padding:10px; box-shadow:inset 0 1px rgba(255,223,149,.12); }
#tradePanel .tv-v2 .tv-side header { display:flex; justify-content:space-between; flex-wrap:wrap; gap:5px; margin-bottom:8px; font-size:14px; }
#tradePanel .tv-v2 .tv-state { color:#ccbda4; font-size:12px; }
#tradePanel .tv-v2 .tv-state.tv-locked { color:#8eee96; font-weight:bold; }
#tradePanel .tv-v2 .tv-gold { display:flex; align-items:center; gap:6px; font-weight:bold; color:#ffda80; margin:7px 0; }
#tradePanel .tv-v2 .tv-gold img { width:20px; height:20px; }
#tradePanel .tv-v2 .tv-offer-grid { min-height:90px; display:grid; grid-template-columns:repeat(auto-fill,minmax(57px,1fr)); gap:5px; align-content:start; }
#tradePanel .tv-v2 .tv-item { min-height:56px; min-width:0; width:100%; aspect-ratio:1; position:relative; display:flex; align-items:center; justify-content:center; padding:5px; background:#282b2b; border:2px solid #715843; border-radius:4px; }
#tradePanel .tv-v2 .tv-item img { max-width:42px; width:90%; height:90%; object-fit:contain; image-rendering:pixelated; }
#tradePanel .tv-v2 .tv-item .tv-qty { position:absolute; bottom:1px; right:3px; color:#fff4c7; font-size:10px; font-weight:700; text-shadow:1px 1px #171717; }
#tradePanel .tv-v2 .tv-item .tv-rarity { position:absolute; top:1px; left:3px; font-size:9px; color:#dcbdfc; text-shadow:1px 1px #171717; }
#tradePanel .tv-v2 .tv-item .tv-remove { position:absolute; top:0; right:4px; font-weight:bold; color:#f8a6a6; }
#tradePanel .tv-v2 .tv-item.tv-bound { border-color:#5f5755; opacity:.45; }
#tradePanel .tv-v2 .tv-request { margin-top:9px; border-top:1px solid #705137; padding-top:7px; }
#tradePanel .tv-v2 h4 { margin:4px 0 7px; color:#f1c37a; font-size:12px; }
#tradePanel .tv-v2 .tv-wants-list { display:flex; gap:5px; flex-wrap:wrap; }
#tradePanel .tv-v2 .tv-need { display:inline-flex; align-items:center; gap:4px; border:1px solid #836442; background:#2f2c28; padding:4px 6px; border-radius:4px; font-size:11px; }
#tradePanel .tv-v2 .tv-need img { width:20px; height:20px; }
#tradePanel .tv-v2 .tv-empty { font-size:11px; color:#b4a893; margin:9px 0; }
#tradePanel .tv-v2 .tv-gold-editor { margin:10px 0; display:flex; flex-wrap:wrap; gap:6px; align-items:end; }
#tradePanel .tv-v2 label { color:#e1c18c; font-size:12px; }
#tradePanel .tv-v2 label input,#tradePanel .tv-v2 select,#tradePanel .tv-v2 input[type="search"],#tradePanel .tv-v2 input[type="number"],#tradePanel .tv-v2 input[list] { background:#171d1e; color:#f3e5c8; border:1px solid #9b744d; border-radius:4px; padding:7px; min-width:0; max-width:100%; box-sizing:border-box; }
#tradePanel .tv-v2 input[type="number"] { width:102px; }
#tradePanel .tv-v2 .tv-gold-editor label { display:flex; gap:4px; align-items:center; flex-wrap:wrap; }
#tradePanel .tv-v2 .tv-inventory { margin:10px 0; background:#2e231c; border:1px solid #62482e; padding:10px; border-radius:6px; }
#tradePanel .tv-v2 .tv-inventory header { display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px; margin-bottom:7px; }
#tradePanel .tv-v2 .tv-inventory small { font-size:11px; color:#c5b198; }
#tradePanel .tv-v2 .tv-search-row { display:grid; grid-template-columns:minmax(0,1fr) 110px; gap:7px; margin-bottom:8px; }
#tradePanel .tv-v2 .tv-bag { display:grid; grid-template-columns:repeat(auto-fill,minmax(58px,1fr)); gap:5px; overflow-y:auto; max-height:200px; align-content:start; }
#tradePanel .tv-v2 .tv-drop-target { border:1px dashed transparent; min-height:110px; }
#tradePanel .tv-v2 .tv-drop-target:hover { border-color:#a9b8a0; }
#tradePanel .tv-v2 .tv-edit-terms { margin:10px 0; background:rgba(0,0,0,.25); border:1px solid #715238; border-radius:7px; padding:10px; }
#tradePanel .tv-v2 .tv-inline { display:flex; flex-wrap:wrap; align-items:end; gap:6px; margin:8px 0; }
#tradePanel .tv-v2 .tv-inline label { display:flex; flex-wrap:wrap; align-items:center; gap:5px; }
#tradePanel .tv-v2 .tv-inline select { max-width:160px; }
#tradePanel .tv-v2 .tv-wishlist { padding:7px 0; border-top:1px solid rgba(174,140,95,.3); margin-top:9px; }
#tradePanel .tv-v2 .tv-wish { display:inline-flex; align-items:center; gap:4px; margin:3px; background:#473825; border:1px solid #776045; padding:3px 5px; border-radius:4px; }
#tradePanel .tv-v2 .tv-wish img { width:20px; height:20px; }
#tradePanel .tv-v2 .tv-wish button { min-height:23px; padding:0 7px; }
#tradePanel .tv-v2 .tv-actions { position:sticky; bottom:0; z-index:2; padding:10px 0 6px; display:flex; gap:7px; justify-content:flex-end; background:linear-gradient(transparent,#241d17 22%); }
#tradePanel .tv-v2 .tv-status { text-align:center; color:#bbd1bc; font-size:11px; margin:3px 0; }
#tradePanel .tv-v2 .tv-alert { border-left:3px solid #e6a95c; padding:8px 10px; background:#584029; color:#ffdfa6; margin-top:10px; }
#tradePanel .tv-v2 .tv-backdrop { position:fixed; inset:0; z-index:50000; display:flex; justify-content:center; align-items:center; padding:15px; background:rgba(0,0,0,.65); }
#tradePanel .tv-v2 .tv-modal { background:#32251c; border:3px ridge #b1854d; border-radius:8px; padding:15px; width:min(380px,90vw); box-shadow:0 15px 40px #0009; }
#tradePanel .tv-v2 .tv-modal header,#tradePanel .tv-v2 .tv-modal footer { display:flex; justify-content:space-between; align-items:center; gap:8px; padding-bottom:10px; }
#tradePanel .tv-v2 .tv-modal label { display:flex; gap:8px; align-items:center; }
#tradePanel .tv-v2 .tv-modal .tv-steps { display:flex; flex-wrap:wrap; gap:4px; margin:12px 0; }
#tradePanel .tv-v2 :focus-visible { outline:2px solid #e0bd76; outline-offset:2px; }
@media (max-width:700px) {
  body.phone-ui #tradePanel { position:fixed!important; top:env(safe-area-inset-top,0)!important; left:0!important; right:0!important; width:100vw!important; max-width:100vw!important; height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))!important; box-sizing:border-box; transform:none!important; z-index:21000; }
  body.phone-ui #tradePanel .sheet-body { max-height:calc(100dvh - 72px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)); }
  body.phone-ui #tradePanel .tv-v2 { padding:2px 4px 14px; }
  body.phone-ui #tradePanel .tv-v2 .tv-columns { grid-template-columns:minmax(0,1fr); }
  body.phone-ui #tradePanel .tv-v2 .tv-side { padding:8px; }
  body.phone-ui #tradePanel .tv-v2 .tv-offer-grid { min-height:58px; grid-template-columns:repeat(auto-fill,minmax(52px,1fr)); }
  body.phone-ui #tradePanel .tv-v2 .tv-item { min-height:52px; }
  body.phone-ui #tradePanel .tv-v2 .tv-bag { max-height:170px; }
  body.phone-ui #tradePanel .tv-v2 .tv-actions button { flex:1; min-height:46px; padding:6px 3px; }
  body.phone-ui #tradePanel .tv-v2 .tv-gold-editor button { min-height:42px; }
}
@media (prefers-reduced-motion:no-preference){
  #tradePanel .tv-v2 .tv-item:active { transform:scale(.96); transition:transform .09s ease; }
  #tradePanel .tv-v2 .tv-locked { animation:tv-ready .35s ease-out; }
  @keyframes tv-ready {from{filter:brightness(1.9);}to{filter:brightness(1);}}
}

/* Trade V2 finishing: verified readiness, one-shot batch submit and receipt. */
#tradePanel .tv-v2 .tv-readiness { margin:10px 0; padding:9px; background:#242d28; border:1px solid #708a65; border-radius:5px; }
#tradePanel .tv-v2 .tv-readiness b { display:block; margin-bottom:5px; color:#e5d8ad; }
#tradePanel .tv-v2 .tv-readiness > div { display:flex; flex-wrap:wrap; align-items:center; gap:5px; margin:5px 0; font-size:12px; }
#tradePanel .tv-v2 .tv-shortfall { display:inline-flex; border:1px solid #98664e; color:#ffcca5; background:#4a2c25; padding:3px 6px; border-radius:4px; }
#tradePanel .tv-v2 .tv-met { color:#a5e9b6; }
#tradePanel .tv-v2 .tv-draft-actions { display:flex; flex-wrap:wrap; align-items:center; gap:7px; padding:10px 8px; background:#503a28; border:1px solid #c59962; border-radius:6px; }
#tradePanel .tv-v2 .tv-draft-actions b { color:#ffe0a3; }
#tradePanel .tv-v2 .tv-actions button:disabled { cursor:not-allowed; opacity:.52; }
.tv-receipt-overlay { position:fixed; inset:0; z-index:55000; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.7); padding:16px; box-sizing:border-box; }
.tv-receipt { color:#f4dfb5; width:min(510px,95vw); max-height:88dvh; overflow-y:auto; background:#2c241e; border:3px ridge #a77b48; border-radius:8px; padding:16px; box-shadow:0 16px 45px #000b; font-size:13px; }
.tv-receipt header { display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px; border-bottom:1px solid #795935; padding-bottom:9px; margin-bottom:12px; }
.tv-receipt header strong { color:#a6e9aa; font-size:17px; }
.tv-receipt .tv-receipt-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.tv-receipt-columns > div { border:1px solid #6d573d; border-radius:6px; padding:9px; min-width:0; overflow-wrap:anywhere; }
.tv-receipt h4 { margin:0 0 9px; font-size:14px; color:#e6bb80; }
.tv-receipt .tv-receipt-gold { color:#ffe196; font-weight:bold; padding-bottom:5px; }
.tv-receipt button { display:block; margin:15px 0 0 auto; min-height:44px; padding:10px 22px; border:1px solid #abd29d; border-radius:6px; background:#346247; color:#f6fff1; cursor:pointer; }
@media(max-width:480px) { .tv-receipt .tv-receipt-columns { gap:7px; } #tradePanel .tv-v2 .tv-draft-actions button { min-height:44px; } }
