/* Trade odası (trade-ui.js): office.css'teki ob-* çerçevesinin içinde. Tasarım alanı 1400 × 820, 1 birim = --k. */
.ob-trade .tr-lobby-head{display:grid;grid-template-columns:2.2fr 1.4fr 1fr calc(150*var(--k));align-items:center;padding:0 calc(22*var(--k));font:900 calc(18*var(--k)) Arial;letter-spacing:calc(2*var(--k));color:#ffd166;text-shadow:0 1px 2px #0009}
.ob-trade .tr-rooms{overflow-y:auto;display:flex;flex-direction:column;gap:calc(8*var(--k));padding-right:calc(6*var(--k))}
.ob-trade .tr-room{flex:none;display:grid;grid-template-columns:2.2fr 1.4fr 1fr calc(150*var(--k));align-items:center;height:calc(64*var(--k));padding:0 calc(22*var(--k));border-radius:calc(12*var(--k));border:calc(2*var(--k)) solid #6fc3ff88;background:linear-gradient(#1b64b8,#0d3f82);font:700 calc(20*var(--k)) Arial}
.ob-trade .tr-room b{font:900 calc(22*var(--k)) Arial;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:calc(10*var(--k))}
.ob-trade .tr-room span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#dcecff}
.ob-trade .tr-st{color:#ffd166!important}
.ob-trade .tr-join{height:calc(46*var(--k));border-radius:calc(10*var(--k))!important;border:calc(2*var(--k)) solid #ffe0a0!important;background:linear-gradient(#ffb84e,#e07a12)!important;color:#4a2200!important;font:900 calc(20*var(--k)) Arial!important}
.ob-trade .tr-join:hover{filter:brightness(1.1)}
.ob-trade .tr-empty{margin:auto;padding:calc(20*var(--k));text-align:center;font:700 calc(19*var(--k)) Arial;color:#cfe3f5}
.ob-trade .tr-name{box-sizing:border-box;padding:0 calc(22*var(--k));border-radius:calc(14*var(--k));border:calc(3*var(--k)) solid #6fc3ff;background:#06224b;color:#fff;font:700 calc(24*var(--k)) Arial;outline:none}
.ob-trade .tr-name:focus{border-color:#ffd166}
.ob-trade .tr-col,.ob-trade .tr-center{display:flex;flex-direction:column;border-radius:calc(16*var(--k));border:calc(2*var(--k)) solid #6fc3ff66;background:#051a3acc;overflow:hidden}
.ob-trade .tr-col.mine{border-color:#ffd166aa}
.ob-trade .tr-center{border-color:#ffb347aa;background:linear-gradient(#3a2106cc,#1a0f04cc)}
.ob-trade .tr-head{flex:none;display:flex;flex-direction:column;align-items:center;padding:calc(10*var(--k)) calc(12*var(--k));background:#0b3d7ccc;border-bottom:calc(2*var(--k)) solid #6fc3ff55}
.ob-trade .tr-center .tr-head{background:#7a3d06cc;border-bottom-color:#ffb34766}
.ob-trade .tr-head b{font:italic 900 calc(28*var(--k))/1.1 'Barlow Condensed',Arial;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ob-trade .tr-head small{font:800 calc(14*var(--k)) Arial;letter-spacing:calc(1.5*var(--k));color:#ffd166}
.ob-trade .tr-list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:calc(6*var(--k));padding:calc(10*var(--k))}
.ob-trade .tr-offers{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:calc(8*var(--k));padding:calc(10*var(--k))}
.ob-trade .tr-offer{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:calc(6*var(--k));padding:calc(6*var(--k));border-radius:calc(12*var(--k));border:calc(2*var(--k)) dashed #ffd16666}
.ob-trade .tr-offer>small{text-align:center;font:800 calc(13*var(--k)) Arial;color:#ffd166;letter-spacing:calc(1*var(--k))}
.ob-trade .tr-player{position:relative;flex:none;display:grid!important;grid-template-columns:calc(54*var(--k)) 1fr auto;align-items:center;gap:calc(8*var(--k));height:calc(64*var(--k));padding:0 calc(8*var(--k))!important;border-radius:calc(10*var(--k))!important;border:calc(2*var(--k)) solid #6fc3ff55!important;background:linear-gradient(#1b4f93,#0c2f63)!important;text-align:left}
.ob-trade .tr-player:not(:disabled):hover{border-color:#ffd166!important;filter:brightness(1.12)}
.ob-trade .tr-player:disabled{cursor:default;opacity:.92}
.ob-trade .tr-offers .tr-player{grid-template-columns:calc(44*var(--k)) 1fr;height:calc(58*var(--k))}
.ob-trade .tr-offers .tr-pow{display:none}
.ob-trade .tr-player.in-offer{border-color:#ffb347!important;background:linear-gradient(#8a4a0c,#4d2805)!important}
.ob-trade .tr-face{position:relative;height:calc(52*var(--k));border-radius:calc(8*var(--k));overflow:hidden;background:#111}
.ob-trade .tr-offers .tr-face{height:calc(44*var(--k))}
.ob-trade .tr-face .portrait{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.ob-trade .tr-info{min-width:0;display:flex;flex-direction:column}
.ob-trade .tr-info b{font:900 calc(17*var(--k)) Arial;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ob-trade .tr-info small{font:700 calc(13*var(--k)) Arial;color:#cfe3f5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ob-trade .tr-info em{font-style:normal;font-weight:900}
.ob-trade .tr-pow{display:flex;flex-direction:column;align-items:flex-end;font:700 calc(13*var(--k)) Arial;color:#cfe3f5}
.ob-trade .tr-pow i{font-style:normal}.ob-trade .tr-pow b{color:#fff}
.ob-trade .tr-msg{display:grid;place-items:center;text-align:center;padding:0 calc(10*var(--k));font:700 calc(17*var(--k))/1.3 Arial;color:#ffe7b8;text-shadow:0 1px 2px #000}
.ob-trade .ob-btn span{font-size:calc(26*var(--k))}
/* Takas ekranı (terazi düzeni) */
.ob-trade .tr-side{box-sizing:border-box;padding:calc(48*var(--k)) calc(18*var(--k)) calc(14*var(--k));border-radius:calc(22*var(--k));border:calc(3*var(--k)) solid #9fd6ff;background:linear-gradient(#0f5fb8,#0a3f86);box-shadow:inset 0 calc(2*var(--k)) calc(10*var(--k)) #fff3}
.ob-trade .tr-side.mine{border-color:#ffd166}
.ob-trade .tr-side-label{position:absolute;top:calc(-6*var(--k));font:italic 900 calc(30*var(--k)) 'Barlow Condensed',Arial;color:#ff9a1f;text-shadow:0 calc(2*var(--k)) 0 #3a1800,0 0 calc(6*var(--k)) #000}
.ob-trade .tr-side:not(.mine) .tr-side-label{right:calc(22*var(--k))}.ob-trade .tr-side.mine .tr-side-label{left:calc(22*var(--k))}
.ob-trade .tr-tab{position:absolute;top:calc(10*var(--k));left:50%;transform:translateX(-50%);min-width:calc(220*var(--k));padding:calc(3*var(--k)) calc(16*var(--k));border-radius:calc(10*var(--k)) calc(10*var(--k)) 0 0;background:#06244f;border:calc(2*var(--k)) solid #9fd6ff;text-align:center;font:800 calc(18*var(--k)) Arial;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70%}
.ob-trade .tr-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:calc(10*var(--k));height:100%}
.ob-trade .tr-tile{position:relative;box-sizing:border-box;padding:0!important;border-radius:calc(14*var(--k))!important;border:calc(2*var(--k)) solid #bfe3ff!important;background:linear-gradient(#5fa9e6,#2b6db5)!important;overflow:hidden;min-height:0}
.ob-trade .tr-tile.empty{display:block;background:linear-gradient(#4f97d8,#2c6bb0);opacity:.55}
.ob-trade .tr-tile:not(:disabled):not(.empty){cursor:pointer}.ob-trade .tr-tile:not(:disabled):hover{border-color:#ffd166!important;filter:brightness(1.15);transform:translateY(calc(-2*var(--k)))}
.ob-trade .tr-tile:disabled{cursor:default}
.ob-trade .tr-tface{position:absolute;inset:0 0 calc(22*var(--k))}
.ob-trade .tr-tface .portrait{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.ob-trade .tr-tile b{position:absolute;left:0;right:0;bottom:0;height:calc(22*var(--k));line-height:calc(22*var(--k));background:#b3121f;border-top:calc(2*var(--k)) solid #ff4b55;font:800 calc(12*var(--k)) Arial;color:#fff;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 calc(3*var(--k))}
.ob-trade .tr-tgrade{position:absolute;top:calc(3*var(--k));right:calc(4*var(--k));font:900 calc(13*var(--k)) Arial;font-style:normal;text-shadow:0 1px 2px #000,0 0 3px #000}
.ob-trade .tr-tile.in-offer{border-color:#ffb347!important}
.ob-trade .tr-scale{position:absolute}
.ob-trade .tr-beam{position:absolute;left:3%;right:3%;bottom:calc(66*var(--k));height:calc(110*var(--k));transform-origin:50% 100%;transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.ob-trade .tr-bar{position:absolute;left:0;right:0;bottom:0;height:calc(8*var(--k));border-radius:calc(4*var(--k));background:linear-gradient(#f3f6fa,#8b98a8);box-shadow:0 calc(2*var(--k)) calc(4*var(--k)) #0008}
.ob-trade .tr-pan{position:absolute;bottom:calc(8*var(--k));width:42%;height:calc(100*var(--k));display:grid;grid-template-columns:repeat(5,1fr);gap:calc(8*var(--k))}
.ob-trade .tr-pan.left{left:0}.ob-trade .tr-pan.right{right:0}
.ob-trade .tr-pivot{position:absolute;left:50%;bottom:calc(30*var(--k));width:calc(10*var(--k));height:calc(46*var(--k));transform:translateX(-50%);background:linear-gradient(90deg,#8b98a8,#f3f6fa,#8b98a8)}
.ob-trade .tr-base{position:absolute;left:50%;bottom:0;transform:translateX(-50%);padding:calc(4*var(--k)) calc(26*var(--k));border-radius:calc(30*var(--k)) calc(30*var(--k)) calc(8*var(--k)) calc(8*var(--k));background:radial-gradient(#ffd56a,#b8770c);border:calc(2*var(--k)) solid #ffe7a0;font:italic 900 calc(20*var(--k)) Arial;color:#fff;text-shadow:0 1px 2px #000;white-space:nowrap}
.ob-trade .tr-msgbox{box-sizing:border-box;display:grid;place-items:center;padding:calc(14*var(--k));border-radius:calc(16*var(--k));border:calc(2*var(--k)) solid #6fc3ff66;background:#051a3add;font:700 calc(17*var(--k))/1.35 Arial;color:#ffe7b8;text-align:center}
.ob-trade .tr-sum{box-sizing:border-box;padding:calc(14*var(--k)) calc(24*var(--k));border-radius:calc(16*var(--k));border:calc(3*var(--k)) solid #9fd6ff;background:linear-gradient(#0f5fb8,#0a3f86)}
.ob-trade .tr-sum h4{margin:0 0 calc(10*var(--k));font:italic 900 calc(20*var(--k)) Arial;color:#ff9a1f;text-shadow:0 1px 2px #000}
.ob-trade .tr-stats{display:grid;grid-template-columns:calc(110*var(--k)) calc(140*var(--k)) calc(40*var(--k)) calc(140*var(--k));row-gap:calc(8*var(--k));align-items:center;font:700 calc(17*var(--k)) Arial;color:#dcecff}
.ob-trade .tr-stats i{font-style:normal;text-align:center;padding:calc(2*var(--k)) 0;border-radius:calc(8*var(--k));background:#06244f;border:calc(1*var(--k)) solid #9fd6ff88;color:#fff}
.ob-trade .tr-stats i.up{color:#7dff8a}.ob-trade .tr-stats i.down{color:#ff8a8a}
.ob-trade .tr-arrow{text-align:center;color:#ffd166}
.ob-trade .tr-checks{position:absolute;top:calc(56*var(--k));right:calc(28*var(--k));display:flex;gap:calc(22*var(--k))}
.ob-trade .tr-check{display:flex;align-items:center;gap:calc(8*var(--k));background:none!important;border:0!important;padding:0!important;font:700 calc(16*var(--k)) Arial;color:#fff;max-width:calc(220*var(--k));text-align:left}
.ob-trade button.tr-check:not(:disabled){cursor:pointer}
.ob-trade .tr-check span{flex:none;width:calc(28*var(--k));height:calc(28*var(--k));border-radius:calc(6*var(--k));border:calc(2*var(--k)) solid #cfe3f5;background:#9fb3c8;display:grid;place-items:center}
.ob-trade .tr-check.on span{background:#2ecc71;border-color:#b9ffd0}.ob-trade .tr-check.on span::after{content:'✓';font:900 calc(20*var(--k)) Arial;color:#fff}
.ob-trade .tr-tile:disabled{opacity:1!important;filter:none!important}
/* Serbest satış / serbest ticaret sekmeleri ve pazar (free-market-ui.js) */
.ob-trade .fm-tab{padding:0!important;border:0!important;background:none!important;cursor:pointer;opacity:.6;filter:saturate(.7);transition:transform .15s}
.ob-trade .fm-tab img{width:100%;height:100%;object-fit:contain;display:block}
.ob-trade .fm-tab.on{opacity:1;filter:drop-shadow(0 0 calc(10*var(--k)) #ffd16699)}.ob-trade .fm-tab:hover{opacity:1;transform:translateY(calc(-2*var(--k)))}
.ob-trade .fm-tix-box{display:flex;align-items:center;justify-content:center;gap:calc(6*var(--k));border-radius:calc(14*var(--k));border:calc(2*var(--k)) solid #9fd6ff88;background:#06244fcc;font:700 calc(18*var(--k)) Arial;color:#dcecff}
.ob-trade .fm-tix-box b{color:#ffd166}
.ob-trade .fm-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:calc(12*var(--k));padding:calc(12*var(--k));box-sizing:border-box;border-radius:calc(18*var(--k));border:calc(3*var(--k)) solid #9fd6ff;background:#0a2a55}
.ob-trade .fm-grid>.tr-empty{grid-column:1/-1;grid-row:1/-1}
.ob-trade .fm-card{position:relative;display:grid;grid-template-columns:calc(118*var(--k)) 1fr;gap:calc(10*var(--k));padding:calc(10*var(--k));border-radius:calc(14*var(--k));border:calc(2*var(--k)) solid #3d8be0;background:linear-gradient(#0c2c58,#071d3d);min-height:0}
.ob-trade .fm-face{position:relative;border-radius:calc(14*var(--k)) calc(14*var(--k)) calc(6*var(--k)) calc(6*var(--k));overflow:hidden;border:calc(2*var(--k)) solid #8fa6bf;background:#1d2633}
.ob-trade .fm-face .portrait{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.ob-trade .fm-face em{position:absolute;left:calc(4*var(--k));bottom:calc(2*var(--k));font:900 calc(14*var(--k)) Arial;font-style:normal;color:#fff;text-shadow:0 1px 2px #000,0 0 3px #000}
.ob-trade .fm-info{min-width:0;display:flex;flex-direction:column;gap:calc(4*var(--k));font:700 calc(15*var(--k)) Arial;color:#dcecff}
.ob-trade .fm-info>b{font:900 calc(18*var(--k)) Arial;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:calc(1*var(--k)) dashed #9fd6ff55;padding-bottom:calc(3*var(--k))}
.ob-trade .fm-info>span{display:grid;grid-template-columns:calc(52*var(--k)) 1fr;align-items:center}
.ob-trade .fm-info i{font-style:normal}.ob-trade .fm-info u{text-decoration:none;text-align:center;padding:calc(2*var(--k)) calc(6*var(--k));border-radius:calc(8*var(--k));background:#020f22;border:calc(1*var(--k)) solid #3d5f86;color:#fff}
.ob-trade .fm-info u.fm-tix{color:#ff5a5a;font-weight:900}
.ob-trade .fm-meta{font:700 calc(12*var(--k)) Arial;color:#9fbfdf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ob-trade .fm-meta b{color:#fff}
.ob-trade .fm-buy{position:absolute;right:calc(10*var(--k));bottom:calc(10*var(--k));height:calc(34*var(--k));padding:0 calc(16*var(--k))!important;border-radius:calc(17*var(--k))!important;border:calc(2*var(--k)) solid #ffd9a0!important;background:linear-gradient(#ffad42,#e06a0c)!important;color:#fff!important;font:900 calc(15*var(--k)) Arial!important;text-shadow:0 1px 2px #6a2c00;cursor:pointer}
.ob-trade .fm-buy.cancel{background:linear-gradient(#4aa3ff,#1662c4)!important;border-color:#bfe3ff!important;text-shadow:0 1px 2px #062d63}
.ob-trade .fm-buy:hover{filter:brightness(1.1)}.ob-trade .fm-buy:disabled{opacity:.5;cursor:default}
.ob-trade .fm-sort{box-sizing:border-box;padding:0 calc(16*var(--k));border-radius:calc(14*var(--k));border:calc(3*var(--k)) solid #6fc3ff;background:#06224b;color:#fff;font:700 calc(20*var(--k)) Arial}
.ob-trade .fm-page{display:grid;place-items:center;border-radius:calc(12*var(--k));background:#06244f;border:calc(2*var(--k)) solid #9fd6ff88;font:900 calc(20*var(--k)) Arial;color:#fff}
.ob-trade .fm-sell{z-index:5;box-sizing:border-box;padding:calc(18*var(--k)) calc(26*var(--k));border-radius:calc(20*var(--k));border:calc(3*var(--k)) solid #ffd166;background:linear-gradient(#0f5fb8,#082f68);box-shadow:0 0 0 100vmax #0009,0 calc(10*var(--k)) calc(30*var(--k)) #000a}
.ob-trade .fm-sell h3{margin:0;text-align:center;font:italic 900 calc(30*var(--k)) 'Barlow Condensed',Arial;color:#ff9a1f;text-shadow:0 2px 0 #3a1800}
.ob-trade .fm-sell>p{margin:calc(6*var(--k)) 0 calc(10*var(--k));text-align:center;font:700 calc(16*var(--k)) Arial;color:#dcecff}
.ob-trade .fm-sell-grid{height:calc(300*var(--k));overflow-y:auto;display:grid;grid-template-columns:repeat(8,1fr);grid-auto-rows:calc(140*var(--k));gap:calc(10*var(--k));padding:calc(4*var(--k))}
.ob-trade .fm-sell-bottom{display:flex;align-items:center;justify-content:center;gap:calc(16*var(--k));height:calc(64*var(--k));margin-top:calc(10*var(--k))}
.ob-trade .fm-sell-bottom input{width:calc(240*var(--k));height:calc(56*var(--k))}
.ob-trade .fm-sel{font:900 calc(18*var(--k)) Arial;color:#fff}.ob-trade .fm-why{font:800 calc(16*var(--k)) Arial;font-style:normal;color:#ff9a9a}
.ob-trade .fm-sell .ob-btn{position:absolute}
/* Takas kartları: stadyum kart tasarımı (trade-ui.js trdTile) */
.ob-trade .tr-tile.tr-pc{display:flex!important;flex-direction:column;border:calc(2*var(--k)) solid var(--rarity,#9ba6b5)!important;border-radius:calc(8*var(--k))!important;background:linear-gradient(160deg,#293545,#0b1421)!important;box-shadow:0 calc(4*var(--k)) calc(8*var(--k)) #0008}
.ob-trade .tr-pc.rarity-d{border-color:#6b7280!important}
.ob-trade .tr-photo{position:relative;flex:1;min-height:0;overflow:hidden;background:linear-gradient(#2a2d33,#111317)}
.ob-trade .tr-photo .portrait{position:absolute;left:0;bottom:0;width:100%;height:112%;object-fit:cover;object-position:top}
.ob-trade .tr-pos{position:absolute;left:calc(3*var(--k));bottom:calc(3*var(--k));padding:0 calc(4*var(--k));border-radius:calc(3*var(--k));background:#0c121dd9;border:1px solid var(--rarity,#9ba6b5);font:800 calc(10*var(--k)) Arial;color:#eef4fc;white-space:nowrap}
.ob-trade .tr-stam{flex:none;display:block;height:calc(4*var(--k));margin:calc(3*var(--k)) calc(5*var(--k)) 0;border-radius:calc(2*var(--k));background:#3b0b0b;overflow:hidden}
.ob-trade .tr-stam u{display:block;height:100%;background:linear-gradient(90deg,#ff5a4d,#c1120b)}
.ob-trade .tr-cname{flex:none;display:flex;align-items:center;justify-content:space-between;gap:calc(3*var(--k));padding:calc(3*var(--k)) calc(5*var(--k)) calc(4*var(--k));font:800 calc(11*var(--k)) Arial}
.ob-trade .tr-cname strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#eef4fc;font-weight:800}
.ob-trade .tr-cname em{font-style:normal;font-weight:900}
.ob-trade .tr-tile.tr-pc.in-offer{box-shadow:0 0 calc(10*var(--k)) #ffb347}
.ob-trade .tr-room.mine{border-color:#ffd166;background:linear-gradient(#8a4a0c,#4d2805)}
.ob-trade .tr-cancel{background:linear-gradient(#ff6b6b,#c62828)!important;border-color:#ffb8b8!important;color:#fff!important}
.ob-trade .tr-wait{margin:0;display:grid;place-items:center;text-align:center;font:800 calc(22*var(--k)) Arial;color:#ffe066;text-shadow:0 1px 2px #000}
.tr-popup{z-index:200}