.trade-hero{padding:clamp(1.3rem,4vw,3rem) 0 1rem}
.trade-hero h1{max-width:18ch;margin:.25rem 0;font-size:clamp(2.1rem,5vw,4rem);line-height:1.03}
.trade-form,.trade-result{display:grid;gap:1rem;margin-block:1.5rem}
.trade-two,.trade-settings,.trade-metrics{display:grid;gap:.8rem}
.trade-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.trade-settings{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin-block:.65rem}
.trade-settings label,.trade-player-search{display:grid;gap:.35rem;color:#bfd0de;font-size:.9rem}
.trade-form input,.trade-form select{width:100%;min-height:44px;color:#eaf5ff;background:#0e1b28;border:1px solid #466173;border-radius:10px;padding:.6rem .7rem;font:inherit}
.trade-form fieldset,.trade-form details,.trade-result details{min-width:0;background:#112331;border:1px solid #355061;border-radius:16px;padding:.9rem}
.trade-form legend{padding:0 .45rem;color:#8debd0;font-weight:800}
.trade-form summary,.trade-result summary{cursor:pointer;font-weight:750;padding:.35rem}
.trade-secondary{width:max-content;padding:.6rem .85rem;color:#aef6e1;background:#163043;border:1px solid #527789;border-radius:10px;font:inherit;cursor:pointer}
.trade-run{justify-self:start}
.trade-chip,.trade-player-name,.trade-player{display:flex;align-items:center;gap:.65rem;min-width:0}
.trade-chip{display:inline-flex;margin:0 .3rem .45rem 0;padding:.35rem .5rem;background:#193646;border-radius:9px;max-width:100%}
.trade-chip button,.trade-matches button{color:#edf6ff;background:#1b394b;border:1px solid #4b6b7d;border-radius:8px;padding:.45rem;cursor:pointer;text-align:left;font:inherit}
.trade-matches{display:grid;gap:.3rem;margin-top:.35rem}
.trade-player-name img,.trade-player img{object-fit:contain;flex:none;background:#21384a;border-radius:8px}
.trade-player small,.trade-player-name small,.trade-metrics small{display:block;color:#b4cbd9;font-size:.75rem}
.trade-player{padding:.55rem 0;border-bottom:1px solid #355061}
.trade-player>div{flex:1}
.trade-player>b{color:#98efd8;text-align:right}
.trade-metrics{grid-template-columns:repeat(3,minmax(0,1fr));margin-block:1rem}
.trade-metrics div{padding:.65rem;border:1px solid #42677a;border-radius:10px;background:#112331}
.trade-metrics b{display:block;font-size:clamp(1.05rem,3vw,2rem);color:#9cf1d7}
.trade-table{overflow:auto}
.trade-table table{width:100%;border-collapse:collapse}
.trade-table :is(td,th){padding:.6rem;text-align:left;border-bottom:1px solid #355061}
.trade-table meter{width:100%;min-width:40px;display:block;accent-color:#84ebca}
.trade-playoff{background:#193b42}
.trade-alert{background:#392832;border-left:3px solid #f8a6b3;padding:.8rem}
.trade-form :focus-visible,.trade-result :focus-visible{outline:2px solid #9cf1d7;outline-offset:2px}
@media(max-width:660px){.trade-two{grid-template-columns:1fr}.trade-metrics{gap:.35rem}.trade-metrics div{padding:.45rem}.trade-player{gap:.4rem}}

.trade-primary-settings{display:flex;align-items:end;justify-content:space-between;flex-wrap:wrap;gap:.7rem;margin:0}
.trade-primary-settings label{width:min(100%,12rem)}
.trade-primary-settings .trade-run{min-height:44px}
.trade-form [data-trade-status]:empty{display:none}
.trade-examples{margin-block:2rem}
.trade-example{display:grid;text-align:center;text-decoration:none}
.trade-example>div{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:.65rem;align-items:center}
.trade-examples section{margin-top:1.3rem}
.trade-example-side,.trade-example-player{display:grid;justify-items:center;gap:.25rem;min-width:0}
.trade-example-package{display:flex;flex-wrap:wrap;justify-content:center;align-items:start;gap:.6rem}
.trade-example-player{flex:1 1 5rem;max-width:8rem}
.trade-example-player strong{overflow-wrap:anywhere}
.trade-example img{border-radius:50%;object-fit:contain;background:#21384a}
.trade-example small{color:#b4cbd9}
.trade-example b{font-size:1.6rem;color:#f1cd81}
.trade-example-action{border-top:1px solid #355061;margin-top:.8rem;padding-top:.55rem;color:#9cf1d7;font-weight:700}

.trade-form .trade-playoffs{border-color:#496573;background:#132a37}
.trade-playoffs>summary{display:flex;align-items:center;justify-content:space-between;gap:.6rem;list-style:none}
.trade-playoffs>summary::-webkit-details-marker{display:none}
.trade-playoffs>summary>span:first-child{display:grid;gap:.2rem}
.trade-playoffs>summary strong{font-size:1.13rem;color:#eaf5ff}
.trade-playoffs-edit{white-space:nowrap;color:#aef6e1;font-size:.85rem}
.trade-playoffs[open] .trade-playoffs-edit span{display:inline-block;transform:rotate(180deg)}
.trade-playoffs-content{border-top:1px solid #3f5967;margin-top:.7rem;padding-top:.65rem}
.trade-playoff-presets{display:flex;flex-wrap:wrap;gap:.45rem;margin:.7rem 0}
.trade-playoff-presets button{min-height:44px}
.trade-playoff-presets small{display:block;font-size:.68rem}
.trade-playoff-presets [aria-pressed=true]{color:#112a2d;background:#9cf1d7;border-color:#9cf1d7;font-weight:750}
.trade-playoff-custom{grid-template-columns:repeat(2,minmax(0,1fr))}
.trade-playoff-preview{list-style:none;margin:.85rem 0 0;padding:0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.28rem}
.trade-playoff-preview li{text-align:center;padding:.48rem .1rem;border:1px solid #42616f;border-radius:7px;color:#b4cbd9;font-size:.78rem}
.trade-playoff-preview .is-playoff{color:#102a2b;background:#9cf1d7;border-color:#9cf1d7;font-weight:800}

.trade-hero{padding:clamp(1rem,3vw,2.2rem) 0 .45rem}
.trade-hero h1{max-width:none;font-size:clamp(2.05rem,5.7vw,4.15rem);letter-spacing:-.045em}
.trade-hero .intro{margin:.65rem 0 0;color:#b8cfde;font-size:clamp(.95rem,2.2vw,1.18rem)}
.trade-form{gap:.75rem;margin-top:1.05rem}
.trade-board{display:grid;grid-template-columns:minmax(0,1fr) 3.15rem minmax(0,1fr);gap:.8rem;align-items:start}
.trade-board fieldset{--side:#f2cc90;position:relative;margin:0;min-width:0;padding:1rem;border-color:#655641;background:linear-gradient(138deg,#252821,#132431 68%)}
.trade-board [data-trade-list=receive]{--side:#a2f0d8;border-color:#3c6a68;background:linear-gradient(138deg,#153632,#132431 68%)}
.trade-board legend{padding:0 .45rem;color:var(--side);font-size:clamp(1.1rem,2.8vw,1.4rem);font-weight:850}
.trade-count{display:inline-block;margin-left:.55rem;padding:.18rem .5rem;border:1px solid color-mix(in srgb,var(--side) 35%,transparent);border-radius:99px;font-size:.68rem;vertical-align:middle;font-weight:650;white-space:nowrap}
.trade-swap{align-self:start;margin-top:2.5rem;display:grid;place-items:center;gap:.12rem;padding:.45rem .25rem;border:1px solid #557083;border-radius:13px;color:#e3f4ff;background:#182d3c;cursor:pointer}
.trade-swap span{font-size:1.32rem;line-height:1}
.trade-swap small{font-size:.65rem}
.trade-search-label{font-size:.75rem;font-weight:700}
.trade-search-field{position:relative;display:block}
.trade-search-field svg{position:absolute;top:50%;left:.78rem;transform:translateY(-50%);width:1rem;height:1rem;color:#9bc5c7;pointer-events:none}
.trade-form .trade-search-field input{padding-left:2.35rem;min-height:46px}
.trade-board [data-trade-chips]:not(:empty){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:.45rem;margin-bottom:.7rem}
.trade-board .trade-chip{margin:0;padding:.35rem .45rem;justify-content:space-between;border:1px solid color-mix(in srgb,var(--side) 30%,transparent);background:#142d3b}
.trade-board .trade-chip img{width:46px;height:46px}
.trade-chip strong{overflow-wrap:anywhere}
.trade-chip button{min-width:36px;min-height:36px;text-align:center;font-size:1.15rem}
.trade-matches button{min-height:44px}
.trade-matches button:hover,.trade-swap:hover{border-color:#9cf1d7;background:#224251}
.trade-control-deck{border:1px solid #3b596b;border-radius:16px;padding:.8rem;background:#122633}
.trade-control-deck .trade-primary-settings{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) minmax(11rem,1fr);gap:.7rem}
.trade-control-deck .trade-primary-settings label{width:auto;min-width:0}
.trade-control-deck select{min-width:0}
.trade-control-deck .trade-run{width:100%;min-height:46px;padding-inline:.75rem;text-align:center}
.trade-control-deck [data-trade-status]{margin:.55rem 0 0}
.trade-extra-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.trade-share{display:flex;align-items:center;flex-wrap:wrap;gap:.7rem;margin:.85rem 0 0}
.trade-share .trade-secondary{min-height:44px}
@media(max-width:660px){
 .trade-board{grid-template-columns:minmax(0,1fr);gap:.25rem}
 .trade-board fieldset{padding:.6rem .75rem}
 .trade-swap{justify-self:center;margin:0;display:flex;gap:.35rem;padding:.35rem .65rem;min-height:40px}
 .trade-swap span{transform:rotate(90deg)}
 .trade-control-deck .trade-primary-settings{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:.55rem}
 .trade-control-deck .trade-run{grid-column:1/-1}
 .trade-extra-settings{grid-template-columns:1fr}
}

.trade-jump{display:inline-block;margin-top:.45rem;color:#a2f0d8;font-size:.85rem;font-weight:750;text-underline-offset:.2em}
#trade-examples-title{scroll-margin-top:1rem}

.trade-verdict-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center}
.trade-verdict h2{font-size:clamp(2rem,5vw,3.65rem);letter-spacing:-.04em;margin:.3rem 0}
.trade-verdict--receive h2{color:#a2f0d8}
.trade-verdict--give h2{color:#ffd1a0}
.trade-verdict-summary{font-size:clamp(1.05rem,2.4vw,1.35rem);font-weight:750}
.trade-winner{max-width:360px;text-align:center}
.trade-winner .eyebrow{margin:.2rem 0 .6rem}
.trade-winner-faces{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem}
.trade-winner figure{margin:0;width:100px;display:grid;justify-items:center;gap:.3rem}
.trade-winner img{object-fit:contain;object-position:bottom;background:#243f4c;border:1px solid #77baa9;border-radius:16px}
.trade-verdict--give .trade-winner img{border-color:#d6a875}
.trade-winner figcaption{font-weight:750;font-size:.8rem;overflow-wrap:anywhere}
.trade-scope{font-size:.87rem;color:#f4d59c}
@media(max-width:660px){.trade-verdict-top{grid-template-columns:1fr}.trade-winner{text-align:left;max-width:none}.trade-winner-faces{justify-content:flex-start}}