/* Phone and tablet trade window (js/windows/mobile-trade.js). Shared kit classes live in css/ui/mobile-hud.css and mobile-sheet.css. */
body.mobile-ui #social-trade{display:none!important}
.m-trade{position:absolute;inset:0;display:flex;flex-direction:column;background:#101215 url(/ui/mobile/sheetbg.png?v=f16b55896a7aa2db) center/cover;padding:8px calc(var(--safe-r) + 14px) 10px calc(var(--safe-l) + 6px);box-shadow:0 10px 40px #000d;z-index:9}
body.tablet-ui .m-trade{left:60px;right:60px;top:70px;bottom:70px;border-radius:6px;border:1px solid #a8894a88}
.m-trade-head{display:flex;align-items:center;gap:10px;height:40px;margin-bottom:6px;flex:none}
.m-trade-head .m-mute{font-size:12px}
.m-tcols{position:relative;display:grid;grid-template-columns:1fr 1fr 1.12fr;gap:10px;flex:1;min-height:0}
.m-tcard{display:flex;flex-direction:column;min-height:0}
.m-tcard .m-h5{display:flex;align-items:center;gap:6px}
.m-tcard .m-h5 em{font:11px system-ui;color:var(--mute);font-style:normal;letter-spacing:0}
.m-tgrid{display:grid;grid-template-columns:repeat(4,40px);gap:4px;margin-top:4px}
.m-tbag{display:grid;grid-template-columns:repeat(auto-fill,40px);gap:4px;margin-top:4px;overflow:auto;align-content:start;padding-right:2px;min-height:0}
.m-tcell{width:40px;height:40px;position:relative;background:url(/ui/mobile/islot.png?v=72510857d2f0baaf) 0 0/100% 100%;flex:none}
.m-tcell .m-q{position:absolute;inset:0;width:100%;height:100%}
.m-tcell .m-it{position:absolute;left:12%;top:12%;width:76%;height:76%;object-fit:contain}
.m-tcell.used{opacity:.3}
.m-tcell:disabled{opacity:.6}
.m-tmoney{display:flex;align-items:center;gap:6px;margin-top:6px;padding:2px 6px;border:1px solid transparent;border-radius:4px;font-size:12px;color:var(--mute)}
.m-tmoney+.m-tmoney{margin-top:4px}
.m-tmoney b{color:var(--ink);font-size:13px}
.m-tlabel{width:34px;flex:none}
/* A set amount (yours or the partner's) reads gold so nobody misses money in the offer; an unsent edit reads amber. */
.m-tmoney.set{border-color:#e2c47c99;color:#f6e7b8}
.m-ttheirs.set{border-color:transparent;padding-left:0}
.m-tmoney.set b,.m-tmoney.set .m-tin{color:var(--gold);font-weight:700}
.m-tmoney.set b{font-size:15px;text-shadow:0 0 6px #e2c47c88}
.m-tmoney.draft{border-style:dashed;border-color:#ffb34799}
.m-tmoney.draft .m-tset:not(:disabled){animation:m-tpulse 1s ease-in-out infinite alternate}
.m-tmoney.changed{animation:m-tflash 1.4s ease-out 2}
@keyframes m-tpulse{to{filter:brightness(1.35);box-shadow:0 0 8px #ffb347aa}}
@keyframes m-tflash{0%{filter:brightness(1.8)}100%{filter:none}}
.m-tin{width:104px;height:26px;background:url(/ui/mobile/input.png?v=12bd0780715989da) 0 0/100% 100%;border:0;color:var(--ink);font:600 12px system-ui;padding:0 8px;outline:none;-webkit-user-select:text;user-select:text}
.m-tin[aria-invalid="true"]{color:#ff8a80}
.m-tset{min-width:46px;height:26px;font-size:11px;padding:0 8px}
.m-tstate{display:flex;align-items:center;gap:6px;font-size:11px;margin-top:auto;padding-top:6px;color:var(--mute)}
.m-tstate img{width:20px;height:20px}
.m-tstate.ok{color:#8fe39a}
.m-tdot{width:12px;height:12px;border-radius:50%;border:1px dashed var(--mute);margin:0 4px}
.m-tnote{font-size:10.5px;color:var(--mute);margin:6px 0 0}
.m-tfoot{display:flex;align-items:center;gap:10px;margin-top:8px;flex:none}
.m-tmsg{flex:1;font-size:11.5px;color:#cfc6b0}