#trade-spaces-root { --trade-accent: #6aa6ff; max-width: 1500px; margin: auto; }
.trade-hero { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:30px; border:1px solid var(--border, #354056); border-radius:22px; background:linear-gradient(115deg,rgba(33,81,137,.3),rgba(24,30,48,.15)); margin-bottom:22px; }
.trade-eyebrow { font-size:11px; letter-spacing:2px; color:var(--trade-accent); font-weight:800; text-transform:uppercase; }
.trade-hero h2 { margin:8px 0; font-size:30px; letter-spacing:-.7px; }
.trade-hero p { max-width:630px; color:var(--muted, #a5afc0); line-height:1.6; margin:0; }
.trade-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:22px; }
.trade-stat { background:var(--card-bg,rgba(120,145,180,.06)); border:1px solid var(--border,#354056); border-radius:14px; padding:18px; }
.trade-stat strong { display:block; font-size:27px; margin-bottom:5px; font-variant-numeric:tabular-nums; }
.trade-stat span { color:var(--muted,#a5afc0); font-size:12px; }
.trade-toolbar { display:grid; grid-template-columns:minmax(200px,2fr) repeat(3,minmax(130px,1fr)); gap:12px; margin-bottom:22px; }
.trade-toolbar input,.trade-toolbar select,.trade-form input,.trade-form select,.trade-form textarea { width:100%; min-width:0; box-sizing:border-box; }
.trade-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.trade-card { border:1px solid var(--border,#354056); border-radius:18px; overflow:hidden; background:var(--card-bg,rgba(120,145,180,.05)); }
.trade-cover { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; background:rgba(120,145,180,.1); cursor:zoom-in; }
.trade-card-body { padding:18px; }
.trade-card h3 { font-size:18px; margin:10px 0; }
.trade-card p { color:var(--muted,#a5afc0); line-height:1.5; margin:8px 0; }
.trade-meta { display:flex; gap:8px; flex-wrap:wrap; margin:12px 0; }
.trade-badge { display:inline-block; border:1px solid var(--border,#354056); background:rgba(115,152,205,.08); font-size:11px; border-radius:20px; padding:5px 9px; }
.trade-status-disponivel { color:#69cba6; background:rgba(27,158,112,.12); }
.trade-status-em_negociacao { color:#efbc70; background:rgba(193,138,38,.12); }
.trade-status-ocupado { color:#b3b3ff; background:rgba(111,111,214,.12); }
.trade-actions { display:flex; gap:8px; margin-top:16px; }
.trade-actions button { flex:1; }
.trade-empty { border:1px dashed var(--border,#354056); border-radius:18px; padding:55px 24px; text-align:center; }
.trade-empty p { color:var(--muted,#a5afc0); max-width:500px; margin:12px auto; line-height:1.6; }
.trade-dialog { color:var(--text,#e9edf7); background:var(--panel-bg,#171c2b); border:1px solid var(--border,#354056); border-radius:22px; padding:26px; width:min(760px,calc(100vw - 48px)); max-height:88vh; overflow-y:auto; }
.trade-dialog::backdrop { background:rgba(3,7,17,.78); }
.trade-dialog h3 { font-size:23px; margin-top:0; }
.trade-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.trade-form label { display:flex; flex-direction:column; gap:7px; font-size:12px; }
.trade-full { grid-column:1/-1; }
.trade-form .trade-dimensions { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.trade-upload { border:1px dashed var(--border,#354056); padding:18px; border-radius:12px; background:rgba(100,145,210,.07); }
.trade-photo-strip { display:flex; gap:10px; flex-wrap:wrap; }
.trade-thumb { width:100px; }
.trade-thumb img { width:100px; height:75px; object-fit:cover; border-radius:8px; }
.trade-thumb button { width:100%; padding:5px; font-size:11px; }
.trade-feedback { color:#efbc70; white-space:pre-wrap; margin:12px 0; }
.trade-detail-photo { width:100%; max-height:65vh; object-fit:contain; border-radius:12px; margin:10px 0; }
.trade-description { white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.6; }
@media(max-width:768px) { .trade-hero { flex-direction:column; align-items:flex-start; padding:22px; } .trade-hero h2 { font-size:25px; } .trade-stats { grid-template-columns:repeat(2,1fr); } .trade-toolbar { grid-template-columns:repeat(2,minmax(0,1fr)); } .trade-form, .trade-form .trade-dimensions { grid-template-columns:1fr; } .trade-dialog { padding:18px; } }