#cfb-bpcompare-root{
  --panel:#171717;--panel2:#1f1f1f;--line:#2e2e2e;--ink:#f2f2f2;--mut:#b4b4b4;
  --faint:#7d7d7d;--acc:#62AEC5;
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-family:var(--font-body);color:var(--ink);
}
#cfb-bpcompare-root *{box-sizing:border-box}
#cfb-bpcompare-root h1{font-family:'Oswald';font-weight:700;font-size:clamp(24px,4.5vw,36px);margin:0}
#cfb-bpcompare-root .ahead{margin-bottom:6px}
#cfb-bpcompare-root .eyebrow{font-family:'Oswald';font-weight:600;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--acc);margin-bottom:4px}
#cfb-bpcompare-root .hl{color:var(--acc)}
#cfb-bpcompare-root .lede{color:var(--mut);margin-top:6px;font-size:15px;max-width:640px}
.fl2{font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:var(--faint);font-family:'Oswald';font-weight:600;display:block;margin-bottom:4px}

/* pickers — dynamic chips, wrap on mobile */
.cmp-pickhint{font-family:'Oswald';font-size:11px;font-weight:600;color:#7fc7d8;letter-spacing:.02em;margin:18px 0 8px}
.cmp-pickers{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 16px}
.cmp-chip{position:relative;display:flex;align-items:stretch;gap:4px;flex:1 1 200px;min-width:0}
.cmp-chip .posdd{flex:1;min-width:0}
.cmp-chip .cmp-chiplbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-chipx{flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--line);color:var(--faint);font-size:18px;line-height:1;width:36px;border-radius:7px;cursor:pointer;font-family:var(--font-body);padding:0}
.cmp-chipx:hover{color:#e07b7b;border-color:#5a3a3a}
.cmp-add{flex:0 0 auto;background:transparent;border:1px dashed #4a4a4a;color:var(--mut);font-family:'Oswald';font-weight:700;font-size:13px;padding:0 14px;height:40px;border-radius:7px;cursor:pointer;white-space:nowrap}
.cmp-add:hover{border-color:#7fc7d8;color:#7fc7d8}
.cmp-add .cmp-addplus{font-size:16px;margin-right:3px}
/* the chevron carries the "tap to change" cue */
.cmp-chip .posdd .ddbtn .car{color:var(--acc)}
/* reuse the finder's custom dropdown look */
.posdd{position:relative}
.posdd .ddbtn{width:100%;background:var(--panel2);border:1px solid #4a4a4a;color:var(--ink);padding:10px 11px;border-radius:7px;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:6px;font-family:'Oswald';font-weight:700;transition:border-color .12s,background .12s}
.posdd .ddbtn:hover{border-color:var(--acc);background:#262626}
.posdd.open .ddbtn{border-color:var(--acc)}
.posdd .ddbtn .car{color:var(--acc);font-size:12px;transition:transform .15s;flex:0 0 auto}
.posdd.open .ddbtn .car{transform:rotate(180deg)}
.posdd .ddmenu{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--panel2);border:1px solid var(--line);border-radius:8px;overflow:hidden;z-index:30}
.posdd.open .ddmenu{display:block}
.posdd .ddsearch{padding:7px;border-bottom:1px solid var(--line);background:var(--panel2)}
#cfb-bpcompare-root .posdd .ddsearch input{width:100%;background:#161616 !important;border:1px solid var(--line);border-radius:6px;color:#f2f2f2 !important;-webkit-text-fill-color:#f2f2f2;padding:8px 10px;font-size:13px;font-family:var(--font-body);outline:none}
#cfb-bpcompare-root .posdd .ddsearch input:focus{border-color:var(--acc)}
#cfb-bpcompare-root .posdd .ddsearch input::placeholder{color:#9a9a9a !important;-webkit-text-fill-color:#9a9a9a;opacity:1}
.posdd .ddlist{max-height:300px;overflow-y:auto}
.posdd .ddnone{padding:14px 11px;text-align:center;color:var(--faint);font-size:13px}
.posdd .ddopt{padding:9px 11px;cursor:pointer;font-size:13px;font-family:var(--font-body)}
.posdd .ddopt:hover{background:rgba(255,255,255,.06)}
.posdd .ddopt.sel{background:rgba(98,174,197,.16)}
.posdd .ddopt.disabled{opacity:.4;cursor:not-allowed}
.posdd .ddopt.dishead{opacity:.45}
.posdd .ddopt .inuse{font-size:10px;color:var(--faint);font-style:italic;margin-left:4px}
#cmpdd0 .ddbtn{border-left:3px solid #4a4a4a}
#cmpdd1 .ddbtn{border-left:3px solid #4a4a4a}

/* body */
.cmp-empty{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:28px 16px;text-align:center;color:var(--faint);font-size:14px}
.cmp-sect{margin-bottom:16px}
.cmp-slabel{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--acc);font-weight:600;font-family:'Oswald';margin-bottom:8px}
.cmp-card{background:var(--panel);border:1px solid var(--line);border-radius:10px}

/* stat table (label column + one fixed column per pipeline) */
.st-hd{display:grid;align-items:center;gap:4px;padding:12px 14px;border-bottom:1px solid var(--line)}
.st-hd .st-hl{font-size:10px;color:var(--faint);text-transform:uppercase;letter-spacing:.3px;font-family:'Oswald';font-weight:600}
.st-hd .st-hn{font-family:'Oswald';font-weight:700;font-size:14px;color:#d4d4d4;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-row{display:grid;align-items:center;gap:4px;padding:11px 14px;border-bottom:1px solid #1a1a1a}
.st-row:last-child{border-bottom:0}
.st-rl{font-family:'Oswald';font-weight:700;font-size:13px;color:#b4b4b4;text-transform:uppercase;letter-spacing:.3px;line-height:1.2}
.st-c{font-family:'Oswald';font-weight:700;font-size:20px;text-align:center}
.st-pill{display:inline-block;padding:3px 12px;border-radius:7px;background:rgba(127,224,176,.14)}
.st-rl .pgexp{font-size:9px;color:var(--faint);margin-left:3px}
.pgdrow{cursor:pointer}
.pgdrow:hover{background:rgba(255,255,255,.03)}
.pgdrow.expanded .pgexp{color:var(--acc)}

@media(max-width:560px){
  .cmp-chip{flex:1 1 calc(50% - 4px)}
  .cmp-add{flex:1 1 100%}
  .posdd .ddbtn{font-size:13px;padding:10px 9px}
  .st-c{font-size:16px}
  .st-hd .st-hn{font-size:11px}
  .st-hd,.st-row{padding-left:10px;padding-right:10px}
  .st-rl{font-size:11px;letter-spacing:.2px}
  .st-pill{padding:2px 6px}
  .whorow{padding-left:10px;padding-right:10px}
  .whocol{padding:0 6px}
  .school{font-size:11px}
}

/* expandable archetype panel under a position row (also a stat table) */
.pgarch{display:none;border-bottom:1px solid #1f1f1f}
.pgarch.open{display:block;padding:8px 12px 14px}
.pgarch-inner .st-hd{padding:6px 4px 8px;border-bottom:1px solid #2a2a2a}
.pgarch-inner .st-hd .st-hl{font-size:9px}
.pgarch-inner .st-hd .st-hn{font-size:11px}
.pgarch-inner .st-row{padding:7px 4px}
.pgarch-inner .st-rl{font-size:11px;text-transform:none;letter-spacing:0;color:#9a9a9a}
.pgarch-inner .st-c{font-size:14px}
.archnone{font-size:12px;color:var(--faint);font-style:italic;padding:6px 0}

/* who recruits */
.whorow{display:grid;padding:12px 14px;gap:4px}
.whocol{padding:0 10px;min-width:0}
.whocol.l{border-right:1px solid var(--line)}
.wholbl{font-family:'Oswald';font-weight:700;font-size:13px;margin-bottom:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.school{display:flex;justify-content:space-between;align-items:center;gap:5px;font-size:12px;padding:4px 0;color:#c9c9c9}
.school span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.tierbadge{flex:0 0 auto;font-family:'Oswald';font-size:9px;font-weight:700;padding:1px 6px;border-radius:3px;background:#2a2a2a;color:var(--mut)}
.tierbadge.tier5{background:rgba(168,107,224,.25);color:#c79bf0}
.tierbadge.tier4{background:rgba(98,174,197,.25);color:#8fd2e6}
.tierbadge.tier3{background:rgba(224,169,62,.25);color:#e6c068}
.tierbadge.tier2{background:rgba(176,176,176,.22);color:#cfcfcf}
.tierbadge.tier1{background:rgba(166,124,82,.28);color:#cba074}
.winline{font-size:13px;color:#c9c9c9;padding:3px 0}
.winline b{font-family:'Oswald';color:var(--ink)}
.winline.win-clear b,.winline.win-clear{color:#7fe0c0}

/* school links in "who recruits here" -> map page */
.tschool-link{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.22)}
.tschool-link:hover{color:#62AEC5;border-bottom-color:#62AEC5}