#tradeDialog{box-sizing:border-box;width:min(560px,94vw);max-height:92dvh;overflow:auto;padding:20px;color:#efe4c9;background:linear-gradient(145deg,#233540,#0b1821);border:1px solid #c7ab70;border-radius:7px;box-shadow:0 0 0 3px #08141c,0 24px 90px #000c;font:13px/1.5 system-ui}#tradeDialog::backdrop{background:#020c15b8}#tradeDialog header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #b49a5d88;margin-bottom:14px}#tradeDialog h2{margin:4px 0 12px;font-size:22px}#tradeDialog small{font-size:9px;letter-spacing:2px;color:#cbb87f}#tradeDialog button{padding:8px 12px;border:1px solid #8b9898;border-radius:3px;color:#efe5cb;background:linear-gradient(#405662,#192c39);cursor:pointer;min-height:38px}#tradeDialog button:disabled{opacity:.45;cursor:default}#tradeDialog .tradeClose{font-size:22px}#tradeDialog .tradePane{position:relative;padding:12px;margin:10px 0;border:1px solid #70828c;background:#07131c99;border-radius:5px}#tradeDialog h3{margin:0 0 10px;font-size:14px;padding-right:96px;overflow-wrap:anywhere}#tradeDialog .tradePane.accepted{border-color:#86c99f;box-shadow:inset 0 0 16px #3c9c6329}.tradeBadge{position:absolute;right:12px;top:12px;font-size:11px;color:#aed0be}.tradeItems{display:grid;grid-template-columns:1fr 1fr;gap:6px}.tradeItem{display:flex;align-items:center;gap:6px;font-size:11px;min-width:0}.tradeItem .itemIcon{flex-shrink:0;width:32px;height:32px}.tradeItem>span:not(.itemIcon){flex:1;overflow-wrap:anywhere}#tradeDialog .tradeItem button{padding:3px 6px;font-size:10px;min-height:30px}.tradeGold{display:block;text-align:right;color:#e9c97f;padding-top:8px}.tradeHelp{font-size:11px;color:#aebfc4}.tradeEdits{display:flex;flex-wrap:wrap;gap:8px;align-items:end;margin-top:14px}.tradeEdits label{font-size:11px;flex:1}.tradeEdits label input{display:block;width:100%;box-sizing:border-box}.tradeEdits input,.tradeEdits select{border:1px solid #758892;border-radius:3px;background:#0a1923;color:#eee2c8;min-height:36px;padding:6px;max-width:100%;box-sizing:border-box}.tradeEdits>select{flex:1;width:50%;min-width:120px}.tradeEdits>input{width:60px}.tradeControls{display:flex;gap:8px}.tradeControls .tradeAccept{flex:1;background:linear-gradient(#bb9a58,#766037)!important}.tradeResult{color:#f2cf8a;min-height:20px}.tradeRow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:10px 0}#tradeNotice{position:fixed;z-index:49;left:50%;top:120px;transform:translateX(-50%);padding:10px 16px;background:#16303f;color:#ffe1a2;border:1px solid #c5ab70;border-radius:4px}#tradeNotice[hidden]{display:none}@media(max-width:600px){#tradeDialog{padding:12px;font-size:12px}.tradeItems{grid-template-columns:1fr}#tradeDialog h2{font-size:19px}.tradeEdits button{font-size:11px;padding:7px}#tradeDialog .tradePane{padding:9px}}@media(max-height:500px){#tradeDialog{max-height:96dvh;padding:10px}.tradeItems{grid-template-columns:1fr 1fr}#tradeDialog .tradePane{margin:6px 0;padding:8px}#tradeNotice{top:8px}}
.tradeEdits{display:grid;grid-template-columns:minmax(0,1fr) 60px auto}.tradeEdits label{grid-column:1 / 3}.tradeEdits>select{width:100%;min-width:0}.tradeEdits>input{width:60px}.tradeEdits label input{margin-top:4px}

/* Keep approval controls reachable on phones, including the software keyboard. */
#tradeDialog{position:fixed;inset:var(--trade-top,0px) 0 auto;margin:8px auto;width:min(560px,calc(100% - 20px));height:calc(var(--trade-height,100dvh) - 16px);max-height:780px;overflow:hidden;padding:12px;overscroll-behavior:contain}
#tradeDialog[open]{display:flex;flex-direction:column}#tradeDialog header{flex:none;margin-bottom:6px}#tradeDialog h2{font-size:18px;margin:2px 0 6px}
#tradeDialog .tradeBody{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:0 3px 8px}
#tradeDialog footer{flex:none;border-top:1px solid #b49a5d88;padding-top:8px;background:#12232e;padding-bottom:env(safe-area-inset-bottom,0px)}
#tradeDialog .tradeActions{display:flex;gap:8px}#tradeDialog .tradeControls{width:100%}#tradeDialog button{min-height:44px;touch-action:manipulation}#tradeDialog .tradeItem button{min-height:40px}
#tradeDialog .tradeResult{margin:4px 0 0;font-size:11px;line-height:1.3;min-height:14px;max-height:42px;overflow:auto}
#tradeDialog .tradeEdits input,#tradeDialog .tradeEdits select{font-size:16px;min-height:44px}#tradeDialog .tradeItems{max-height:180px;overflow:auto}#tradeDialog .tradeEdits{gap:6px;margin-top:8px}
@media(max-width:420px){#tradeDialog{padding:8px}#tradeDialog .tradeEdits{grid-template-columns:minmax(0,1fr) 64px}#tradeDialog .tradeEdits label{grid-column:1}#tradeDialog .tradeEdits>button{font-size:11px;padding:4px}#tradeDialog .tradeEdits>button:last-child{grid-column:1/-1}#tradeDialog .tradeControls button{padding:7px;font-size:12px}}
@media(max-height:500px){#tradeDialog{max-height:calc(var(--trade-height,100dvh) - 8px);height:calc(var(--trade-height,100dvh) - 8px);margin:4px auto;padding:6px 10px}#tradeDialog header small{display:none}#tradeDialog header{margin:0}#tradeDialog h2{font-size:16px}#tradeDialog .tradePane{padding:6px;margin:6px 0}#tradeDialog h3{margin-bottom:3px}#tradeDialog .tradeGold{padding-top:2px}#tradeDialog footer{padding-top:4px}#tradeDialog .tradeItems{max-height:110px}}