/* Animated gloss, dual-league rankings, and fee-flow presentation */
.portrait span,.mini-avatar span{position:absolute;z-index:0}.portrait img,.mini-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}.portrait img{object-position:center 18%;padding:4px 4px 0}.mini-avatar{position:relative;overflow:hidden}.mini-avatar img{background:linear-gradient(140deg,hsl(var(--h),85%,62%),hsl(calc(var(--h) + 65),70%,35%))}
.hero:before{content:"";position:absolute;inset:40px -18vw 0;z-index:-1;background:repeating-radial-gradient(ellipse at 50% 30%,transparent 0 46px,#66f2b317 47px 48px,transparent 49px 74px);mask-image:linear-gradient(to bottom,#000,transparent 72%);animation:gridBreath 9s ease-in-out infinite alternate}.hero:after{content:"";position:absolute;width:520px;height:2px;left:50%;top:340px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--acid),transparent);box-shadow:0 0 32px var(--acid);opacity:.45;animation:laserSweep 4s ease-in-out infinite}.hero-card,.trader-card,.slot:not(.empty){overflow:hidden;isolation:isolate}.hero-card:after,.trader-card:after,.slot:not(.empty):after{content:"";position:absolute;z-index:4;inset:-80% -80%;background:linear-gradient(105deg,transparent 42%,#fff0 45%,#ffffffb8 50%,#fff0 55%,transparent 58%);transform:translateX(-42%) rotate(8deg);animation:cardShine 4.8s cubic-bezier(.2,.8,.2,1) infinite;pointer-events:none}.hero-card:nth-child(2):after,.trader-card:nth-child(3n+2):after{animation-delay:-1.6s}.hero-card:nth-child(4):after,.trader-card:nth-child(3n):after{animation-delay:-3.1s}.hero-card{animation:cardFloat 4s ease-in-out infinite alternate}.hero-card:nth-child(2){animation-delay:-.8s}.hero-card:nth-child(3){animation-delay:-1.6s}.hero-card:nth-child(4){animation-delay:-2.4s}.hero-card:nth-child(5){animation-delay:-3.2s}.fan:after{content:"";position:absolute;left:18%;right:18%;bottom:5px;height:35px;border-radius:50%;background:#66f2b354;filter:blur(30px);animation:shadowPulse 3s ease-in-out infinite}.connect,.primary{position:relative;overflow:hidden}.connect:after,.primary:after{content:"";position:absolute;inset:-80% auto -80% -60%;width:38%;background:#fff6;transform:rotate(18deg);animation:buttonShine 3.8s ease-in-out infinite}.league-tabs{display:flex;gap:8px;margin-bottom:12px}.league-tabs button{flex:1;padding:17px 20px;border-radius:15px;border:1px solid var(--line);background:#0c0e14;color:#737887;text-align:left;font-weight:700;cursor:pointer;transition:.25s}.league-tabs button i,.board-meta i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#555;margin-right:8px}.league-tabs button b{float:right;border-radius:7px;background:#20232d;padding:3px 7px;font:10px var(--mono)}.league-tabs button.active{color:#fff;border-color:#66f2b366;background:linear-gradient(105deg,#66f2b312,#0c0e14 55%);box-shadow:inset 0 0 35px #66f2b308}.league-tabs button.active i,.board-meta i{background:var(--acid);box-shadow:0 0 12px var(--acid)}.league-tabs button:nth-child(2).active{border-color:#66f2b388;background:linear-gradient(105deg,#66f2b318,#0c0e14 55%)}.league-tabs button:nth-child(2).active i{background:var(--violet);box-shadow:0 0 12px var(--violet)}.board-meta{display:flex;justify-content:space-between;padding:13px 8px;border-bottom:1px solid var(--line);font:10px var(--mono);color:#707583}.board-meta>span{color:#a8adba}.trader-head,.trader-row{grid-template-columns:2fr 1.1fr .85fr .75fr .7fr}.trader-row{animation:rowIn .35s both}.trader-row:nth-child(n+2){animation-delay:.02s}.trader-row .mini-avatar{background:linear-gradient(140deg,hsl(var(--h),85%,62%),hsl(calc(var(--h) + 65),70%,35%));box-shadow:inset 0 0 14px #fff2}.trader-row em.source{font:8px var(--mono);font-style:normal;padding:4px 6px;border-radius:5px;margin-right:8px;background:#66f2b318;color:var(--acid)}.trader-row em.source.pump{background:#66f2b320;color:#b8ffdc}.form{display:flex;gap:4px}.form i{width:7px;height:18px;border-radius:2px;background:#30333e}.form .win{background:var(--acid);box-shadow:0 0 8px #66f2b338}.form .loss{background:#ff5f71}.load-ranks{display:block;margin:18px auto 10px;border:1px solid var(--line);background:#141721;color:#fff;border-radius:12px;padding:12px 22px;cursor:pointer}.load-ranks:hover{border-color:#66f2b366}.load-ranks:disabled{opacity:.4}.fee-flow{display:grid;grid-template-columns:1fr 160px 1fr;align-items:center}.fee-source,.fee-vault{min-height:215px;border:1px solid var(--line);border-radius:22px;padding:30px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;background:#0d1017}.fee-source:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 28px,#ffffff05 29px 30px)}.fee-source span,.fee-vault span{font:11px var(--mono);color:#8d92a0;z-index:1}.fee-source strong,.fee-vault strong{font-size:64px;letter-spacing:-.07em;margin:8px 0;z-index:1}.fee-source small,.fee-vault small{color:#6e7380;z-index:1}.fee-vault{border-color:#66f2b355;background:linear-gradient(145deg,#18210e,#0c100c);box-shadow:inset 0 0 50px #66f2b30b}.fee-vault strong{color:var(--acid)}.vault-glow{position:absolute;width:180px;height:180px;right:-45px;top:-60px;border-radius:50%;background:var(--acid);filter:blur(80px);opacity:.28;animation:vaultPulse 2.8s ease-in-out infinite}.flow-line{height:2px;background:linear-gradient(90deg,#353946,var(--acid),#353946);position:relative}.flow-line i{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--acid);box-shadow:0 0 14px var(--acid);top:-3px;left:0;animation:flowDot 2.2s linear infinite}.flow-line i:nth-child(2){animation-delay:-.7s}.flow-line i:nth-child(3){animation-delay:-1.4s}.payouts{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-top:15px}.payouts div{display:flex;justify-content:space-between;align-items:center;padding:18px;border:1px solid var(--line);border-radius:14px;background:#0d0f15}.payouts b{font:11px var(--mono);color:#727786}.payouts strong{font-size:21px}.payouts div:first-child{border-color:#66f2b366}.payouts div:first-child strong{color:var(--acid)}.fee-note{text-align:center;color:#676c78;font:10px var(--mono);margin-top:18px}.rule-grid article{transition:transform .25s,border-color .25s}.rule-grid article:hover{transform:translateY(-5px);border-color:#4b5060}.orb{animation:orbDrift 10s ease-in-out infinite alternate}
@keyframes cardShine{0%,58%{transform:translateX(-48%) rotate(8deg)}82%,100%{transform:translateX(48%) rotate(8deg)}}@keyframes buttonShine{0%,65%{left:-60%}88%,100%{left:130%}}@keyframes cardFloat{from{margin-top:0}to{margin-top:-9px}}@keyframes shadowPulse{50%{opacity:.4;transform:scaleX(.85)}}@keyframes gridBreath{to{transform:translateY(18px) scale(1.04);opacity:.65}}@keyframes laserSweep{50%{width:720px;opacity:.7}}@keyframes rowIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes flowDot{from{left:0}to{left:100%}}@keyframes vaultPulse{50%{opacity:.46;transform:scale(1.2)}}@keyframes orbDrift{to{transform:translate(70px,50px) scale(1.12)}}
@media(max-width:760px){.league-tabs{flex-direction:column}.board{overflow-x:auto}.board-meta,.trader-head,#rankRows,.load-ranks{min-width:720px}.fee-flow{grid-template-columns:1fr}.flow-line{width:2px;height:80px;margin:auto;background:linear-gradient(#353946,var(--acid),#353946)}.flow-line i{top:0;left:-3px;animation:flowDotMobile 2.2s linear infinite}.payouts{grid-template-columns:repeat(5,120px);overflow-x:auto}.fee-source,.fee-vault{min-height:180px}.fee-source strong,.fee-vault strong{font-size:50px}}@keyframes flowDotMobile{from{top:0}to{top:100%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}

/* Narrow collectible cards, following the clean reference proportions. */
.trader-grid{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))!important;gap:12px!important;align-content:start!important;grid-auto-rows:max-content!important}
.trader-card{aspect-ratio:5/7;min-height:158px;padding:28px 8px 14px;background:#f5f5f3;border:1px solid #d8d8d4!important;border-radius:7px;box-shadow:0 2px 8px #0003!important;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center}
.trader-card:before{display:none!important}
.trader-card:after{display:none!important}
.trader-card.fomo,.trader-card.pump,.trader-card.selected{border-color:#d8d8d4!important;box-shadow:0 2px 8px #0003!important;outline:0!important}
.trader-card .source-logo{position:absolute;top:8px;left:9px;width:15px;height:15px;object-fit:contain;display:block}
.trader-card.pump .source-logo{width:17px;height:17px;top:7px;left:8px}
.trader-card .portrait{width:66%;height:auto;aspect-ratio:1;flex:0 0 auto;border:2px solid #191b20!important;border-radius:50%;background:#e4e4e1!important;box-shadow:0 0 0 2px #ffffff!important}
.trader-card .portrait img{inset:0!important;width:100%!important;height:100%!important;padding:0!important;object-fit:cover!important;object-position:center!important;border-radius:50%;background:#e4e4e1!important}
.trader-card .portrait:after{display:none!important}
.trader-card h4{width:100%;margin:12px 0 0;font:700 11px Sora,Manrope,sans-serif;letter-spacing:-.025em;color:#202126;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
.hero-card h4{font-family:Sora,Manrope,sans-serif;font-weight:700;letter-spacing:-.025em}.trader-row>span:first-child{font-family:Sora,Manrope,sans-serif;font-weight:600;letter-spacing:-.02em}

/* One neutral portrait treatment everywhere: no legacy blue/green gradient. */
.slot .portrait,.hero-card .portrait{background:#e4e4e1!important;border:2px solid #191b20!important;box-shadow:0 0 0 2px #f4f4f1!important}
.slot .portrait img,.hero-card .portrait img{padding:0!important;background:#e4e4e1!important;object-fit:cover!important;object-position:center!important}

/* Hero entrance: cards visibly fan out, then keep breathing. */
.hero-card:nth-child(1){animation:fanCard1 .72s cubic-bezier(.2,.85,.25,1.15) .08s both,cardFloat 3.4s ease-in-out 1s infinite alternate}
.hero-card:nth-child(2){animation:fanCard2 .72s cubic-bezier(.2,.85,.25,1.15) .16s both,cardFloat 3.7s ease-in-out 1.1s infinite alternate}
.hero-card:nth-child(3){animation:fanCard3 .72s cubic-bezier(.2,.85,.25,1.15) .24s both,centerPulse 3s ease-in-out 1.2s infinite alternate}
.hero-card:nth-child(4){animation:fanCard4 .72s cubic-bezier(.2,.85,.25,1.15) .32s both,cardFloat 3.6s ease-in-out 1.15s infinite alternate}
.hero-card:nth-child(5){animation:fanCard5 .72s cubic-bezier(.2,.85,.25,1.15) .4s both,cardFloat 3.3s ease-in-out 1.05s infinite alternate}
.hero-card{animation-play-state:paused!important}
.fan.is-visible .hero-card{animation-play-state:running!important}
.hero-card .portrait img{animation:portraitAlive 5s ease-in-out infinite alternate}
@keyframes fanCard1{from{opacity:0;transform:translateX(-50%) translateY(80px) scale(.76) rotate(0)}to{opacity:1;transform:translateX(-165%) translateY(38px) rotate(-20deg)}}
@keyframes fanCard2{from{opacity:0;transform:translateX(-50%) translateY(80px) scale(.76) rotate(0)}to{opacity:1;transform:translateX(-108%) translateY(8px) rotate(-10deg)}}
@keyframes fanCard3{from{opacity:0;transform:translateX(-50%) translateY(80px) scale(.76)}to{opacity:1;transform:translateX(-50%) translateY(-28px) scale(1.08)}}
@keyframes fanCard4{from{opacity:0;transform:translateX(-50%) translateY(80px) scale(.76) rotate(0)}to{opacity:1;transform:translateX(8%) translateY(8px) rotate(10deg)}}
@keyframes fanCard5{from{opacity:0;transform:translateX(-50%) translateY(80px) scale(.76) rotate(0)}to{opacity:1;transform:translateX(65%) translateY(38px) rotate(20deg)}}
@keyframes cardFloat{from{margin-top:0}to{margin-top:-24px}}
@keyframes centerPulse{from{margin-top:0}to{margin-top:-30px}}
@keyframes portraitAlive{from{transform:scale(1)}to{transform:scale(1.06)}}

/* Mobile market: two stable columns with rows tall enough for 5:7 cards. */
@media(max-width:760px){
  .trader-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-auto-rows:max-content!important;align-content:start!important;gap:10px!important;max-height:680px!important}
  .trader-card{width:100%!important;min-width:0!important;min-height:210px!important;height:auto!important;aspect-ratio:5/7!important}
}
@media(max-width:360px){.trader-card{min-height:190px!important}}

/* Mobile hero cards are scaled as a group, so compensate the name size and spacing. */
.hero-card h4{margin:17px 0 3px!important;font-size:18px!important;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:600px){.hero-card h4{margin-top:21px!important;font-size:22px!important}}

/* Signed Perps controls */
.slot.perp{border-color:#66f2b3;background:linear-gradient(180deg,#66f2b316,#090b10)}
.slot-remove{z-index:3}
.perp-control{width:100%;display:grid;gap:5px;margin-top:7px}
.perp-badge{display:block;padding:4px 3px;border-radius:5px;font:700 7px var(--mono);letter-spacing:.02em;text-align:center}
.perp-badge.long{color:#091007;background:var(--acid)}
.perp-badge.short{color:#fff;background:#ef476f}
.perp-control input[type="range"]{width:100%;height:12px;accent-color:var(--violet);cursor:ew-resize}
.perp-add,.perp-remove{position:static!important;width:100%!important;height:auto!important;border-radius:6px!important;padding:5px 2px!important;margin-top:7px;background:#171a24!important;color:#b9bdca!important;font:700 7px var(--mono)!important}
.perp-remove{margin-top:0!important;color:#8f94a3!important}

/* Large, readable team board: four supporting cards around one hero position. */
.draft-layout{grid-template-columns:1fr!important}
.roster-panel{padding:28px!important;min-height:720px;background:radial-gradient(circle at 50% 44%,#66f2b313,transparent 34%),linear-gradient(145deg,#10131b,#0a0c12)!important}
.panel-top{font-size:15px!important;padding-bottom:20px!important;border-bottom:1px solid #242836}
.panel-top b{font:500 12px var(--mono);color:#9ca1b2}
.slots{width:min(920px,100%);height:730px;margin:22px auto 26px;display:grid!important;grid-template-columns:minmax(160px,.8fr) minmax(240px,1.18fr) minmax(160px,.8fr)!important;grid-template-rows:1fr 1fr!important;gap:22px 46px!important;overflow:visible!important}
.slot{min-height:0!important;padding:18px!important;border:2px solid #cacbc8!important;border-radius:14px!important;background:#f2f2ef!important;color:#11131a!important;box-shadow:0 0 0 4px #252935,0 10px 34px #0009!important;justify-content:flex-start!important}
.slot:nth-child(1){grid-column:1;grid-row:1}.slot:nth-child(2){grid-column:1;grid-row:2}.slot:nth-child(3){grid-column:2;grid-row:1/3;padding:28px!important}.slot:nth-child(4){grid-column:3;grid-row:1}.slot:nth-child(5){grid-column:3;grid-row:2}
.slot.empty{background:#0b0e15!important;color:#737989!important;border:1px dashed #393f50!important;box-shadow:none!important;justify-content:center!important}
.slot .portrait{width:112px!important;height:112px!important;margin:4px auto 0;border-radius:50%!important;flex:0 0 auto}
.slot:nth-child(3) .portrait{width:190px!important;height:190px!important;margin-top:36px}
.slot h5{font:700 15px/1.2 Sora,Manrope,sans-serif!important;letter-spacing:-.025em;margin:13px 0 3px!important;color:#11131a;overflow:visible!important}
.live-pnl{display:block;font:700 9px/1.3 var(--mono);letter-spacing:.08em;margin:2px 0 5px}.live-pnl.positive{color:#338300!important}.live-pnl.negative{color:#d72b43!important}.live-pnl.syncing{color:#777b85!important}
.slot:nth-child(3) h5{font-size:22px!important;margin-top:20px!important}
.slot small{font-size:8px!important;color:#7b7e86!important;letter-spacing:.12em}
.slot-remove{position:absolute!important;right:9px!important;top:9px!important;width:27px!important;height:27px!important;background:#dedfdb!important;color:#24262d!important;font-size:17px!important}
.slot.perp{border-color:#66f2b3!important;background:#f2f2ef!important;box-shadow:0 0 0 4px #66f2b355,0 10px 38px #0009!important}
.perp-control{margin-top:auto!important;gap:7px!important;padding-top:12px;border-top:1px solid #d7d8d4}
.perp-label{font:700 8px var(--mono);letter-spacing:.14em;color:#777b85}
.perp-stepper{display:grid;grid-template-columns:38px 1fr 38px;align-items:center;border:1px solid #cfd1d5;border-radius:10px;background:#11141b;overflow:hidden}
.perp-stepper b{font:800 20px Manrope;color:#fff;text-align:center;padding:9px 2px}
.perp-stepper button{position:static!important;width:38px!important;height:42px!important;border:0!important;border-radius:0!important;background:#1b1f29!important;color:#fff!important;font-size:21px!important}
.perp-stepper button:hover{background:#292e3a!important}
.perp-stepper.long{border-color:#7aa918}.perp-stepper.short{border-color:#d84964}
.perp-direction{font:800 10px var(--mono);letter-spacing:.13em;text-align:center}.perp-direction.long{color:#527b00}.perp-direction.short{color:#d82f50}
.perp-add,.perp-remove{position:static!important;width:100%!important;height:auto!important;border-radius:9px!important;font:800 9px var(--mono)!important;letter-spacing:.1em}
.perp-add{margin-top:auto!important;padding:11px 6px!important;background:#11141b!important;color:#fff!important}
.perp-remove{padding:7px!important;background:transparent!important;color:#7c8089!important}
.perp-value{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border:1px solid #272b35;border-radius:9px;background:#11141b}.perp-value strong{padding:5px 8px;border-radius:6px;font:800 10px Manrope,sans-serif;letter-spacing:.035em}.perp-value b{font:750 22px Manrope,sans-serif;color:#fff;letter-spacing:-.025em}.perp-value.long strong{background:#a8df2b18;color:#b8ed45}.perp-value.short strong{background:#ed426418;color:#ff6a85}.perp-slider{width:100%;height:22px;margin:2px 0 0;cursor:ew-resize;accent-color:#66f2b3}.perp-slider::-webkit-slider-runnable-track{height:7px;border-radius:99px;background:linear-gradient(90deg,#ed4264 0 48%,#343846 48% 52%,#9edb29 52% 100%)}.perp-slider::-webkit-slider-thumb{margin-top:-5px;width:17px;height:17px}.perp-scale{display:flex;justify-content:space-between;color:#737782;font:700 7px Manrope,sans-serif;letter-spacing:.025em}.perp-scale span:nth-child(2){color:#d84964}.perp-scale span:nth-child(3){color:#659306}
.trader-card.score-syncing{opacity:1;cursor:pointer;filter:none}
.trader-card .score-status{display:block;margin:6px 2px 1px;color:#697078;font:700 7px var(--mono);letter-spacing:.08em}
.trader-card.score-ready .score-status{color:#287a55}
.team-summary{font-size:13px!important;margin:0!important;padding:18px 22px!important}.team-summary strong{font-size:24px!important}
.lock-btn{font-size:15px!important;padding:17px!important;margin-top:14px}

@media(max-width:760px){
  .roster-panel{padding:14px!important;min-height:0}
  .panel-top{font-size:13px!important}.panel-top b{font-size:9px}
  .slots{height:auto!important;margin:16px auto 20px;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:none!important;gap:14px!important;overflow:visible!important}
  .slot,.slot:nth-child(1),.slot:nth-child(2),.slot:nth-child(3),.slot:nth-child(4),.slot:nth-child(5){grid-column:auto;grid-row:auto;min-height:300px!important;padding:15px!important}
  .slot:nth-child(5){grid-column:1/-1;width:calc(50% - 7px);justify-self:center}
  .slot .portrait,.slot:nth-child(3) .portrait{width:112px!important;height:112px!important;margin:15px auto 0}
  .slot h5,.slot:nth-child(3) h5{font-size:15px!important;margin-top:15px!important}
  .perp-stepper{grid-template-columns:34px 1fr 34px}.perp-stepper b{font-size:17px}.perp-stepper button{width:34px!important}
  .team-summary{padding:15px!important}.team-summary strong{font-size:19px!important}
}