/* =========================================================
   DRAFT AO VIVO
   ========================================================= */
.draft-layout{display:flex;flex-direction:column;gap:14px}
.draft-main{min-width:0}
.draft-main.hide{display:none}
.draft-view-toggle{display:inline-flex;gap:4px;padding:4px;background:var(--surface);border:1px solid var(--line);border-radius:12px;align-self:flex-start}
.dv-btn{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:9px;border:none;background:transparent;color:var(--text-muted);font-size:13px;font-weight:600;cursor:pointer;transition:all .15s}
.dv-btn:hover{color:var(--text)}
.dv-btn.active{background:var(--surface3);color:var(--gold-light);box-shadow:0 2px 8px rgba(0,0,0,.3)}
.dv-btn .dv-count{font-size:11px;font-weight:700;padding:1px 7px;border-radius:10px;background:rgba(212,175,55,.15);color:var(--gold)}
.draft-live-row{display:flex;gap:16px;align-items:flex-start}
.draft-live-row .draft-main{flex:1}
.draft-area{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.draft-turn{display:flex;align-items:center;gap:20px;padding:18px 22px;border-bottom:1px solid var(--line);background:radial-gradient(600px 120px at 0% 0%,rgba(212,175,55,.14),transparent 70%),var(--surface2)}
.draft-turn-label{font-size:10.5px;font-weight:600;letter-spacing:.18em;color:var(--accent);text-transform:uppercase}
.draft-turn-name{font-family:var(--font-display);font-size:30px;font-weight:700;letter-spacing:.02em;line-height:1.05;color:var(--gold-light);text-transform:uppercase}
.draft-turn-sub{font-size:12px;color:var(--text-muted);margin-top:2px}
.draft-progress{flex:1;height:6px;background:var(--bg2);border-radius:6px;overflow:hidden}
.draft-progress-fill{height:100%;background:linear-gradient(90deg,var(--gold-dark),var(--gold),var(--gold-light));border-radius:6px;transition:width .4s ease}
.draft-lanes{display:grid;grid-template-columns:repeat(var(--cols,5),minmax(0,1fr))}
.draft-lane-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;padding:8px;align-content:start}
.draft-lane-cards .draft-player-card{margin:0}
.lane-count{margin-left:6px;min-width:20px;padding:0 6px;border-radius:10px;background:var(--tint2);font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:0;line-height:18px;text-align:center}
.draft-lane-col{border-right:1px solid var(--line);min-height:240px;padding-bottom:6px}
.draft-lane-col:last-child{border-right:none}
.draft-lane-header{position:sticky;top:0;display:flex;align-items:center;justify-content:center;gap:8px;padding:11px 10px;font-family:var(--font-display);font-size:15px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-bottom:1px solid var(--line);background:var(--surface)}
.draft-lane-header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:currentColor;opacity:.7}
.lh-top{color:#7DB8FF}.lh-jungle{color:#5EE0B6}.lh-mid{color:#F48CBE}.lh-adc{color:#F3C06B}.lh-support{color:#B4A6FF}
.draft-lane-empty{padding:22px 10px;text-align:center;font-size:12px;color:var(--text-dim)}
.draft-player-card{margin:8px;border-radius:var(--radius-sm);padding:11px 12px;cursor:pointer;transition:all .18s ease;border:1px solid var(--line);background:var(--surface2)}


.dp-name{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-elo{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted);margin-top:3px;font-weight:600}
.dp-champs{font-size:11.5px;color:var(--accent);margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dp-avail{font-size:10.5px;color:var(--text-muted);margin-top:4px}

.current-team-panel{width:320px;flex-shrink:0;position:sticky;top:88px;background:var(--surface);border:1px solid var(--border-gold);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow),0 0 40px -20px rgba(212,175,55,.5);animation:ctpEnter .35s cubic-bezier(.22,1,.36,1)}
.current-team-panel.hide{display:none}
@keyframes ctpEnter{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.current-team-panel.closing{animation:ctpExit .23s ease forwards}
@keyframes ctpExit{to{opacity:0;transform:translateX(10px)}}
.current-team-panel.panel-impact{animation:panelImpact .45s cubic-bezier(.22,1,.36,1)}
@keyframes panelImpact{30%{box-shadow:0 0 0 2px var(--gold),0 0 50px rgba(212,175,55,.45);transform:translateX(-4px)}60%{transform:translateX(3px)}100%{transform:none}}
.ctp-eyebrow{display:flex;align-items:center;gap:7px;font-size:10.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}



.ctp-lanes{display:flex;flex-direction:column;gap:6px}
.ctp-pick{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;background:var(--bg2);border:1px dashed var(--line2);font-size:13px}
.ctp-pick.ctp-filled{border-style:solid;border-color:var(--line);background:var(--surface2)}
.ctp-pick-name{font-style:italic;color:var(--text-dim);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctp-pick.ctp-filled .ctp-pick-name{color:var(--text);font-weight:600;font-style:normal}

.ctp-pick-elo{font-size:11px;font-weight:600;color:var(--text-muted);white-space:nowrap}







.draft-teams-full{display:none}
.draft-teams-full.show{display:block}

.sidebar-teams-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
.sidebar-team{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}






.draft-team{padding:1rem 1.25rem}

/* PICK REVEAL */
.pick-reveal-card{position:fixed;z-index:700;left:50%;top:42%;transform:translate(-50%,-50%) scale(.5);opacity:0;background:radial-gradient(400px 160px at 50% 0%,rgba(212,175,55,.2),transparent 70%),var(--surface);border:1px solid var(--gold);border-radius:18px;padding:24px 40px;text-align:center;box-shadow:0 40px 100px rgba(0,0,0,.75);pointer-events:none;transition:opacity .25s ease,transform .45s cubic-bezier(.34,1.56,.64,1)}
.pick-reveal-card.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.prc-eyebrow{font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.prc-name{font-family:var(--font-display);font-size:48px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:var(--gold-light);line-height:1}
.prc-meta{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:600;color:var(--text-muted)}
.pick-reveal-card.flying{transition:opacity .3s ease .2s,transform .5s cubic-bezier(.6,-.28,.74,.05);transform:translate(calc(-50% + var(--dx,0px)),calc(-50% + var(--dy,0px))) scale(.2);opacity:0}