@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{--bg:#0d1713;--panel:#14221b;--line:#2b4335;--mint:#c5ff5c;--white:#f5f7ed;--muted:#a6b9aa}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font-family:'DM Sans',sans-serif}button,select{font:inherit}button{cursor:pointer}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--mint);outline-offset:3px}.shell{max-width:1450px;margin:auto;padding:20px 26px 90px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:7px 0 18px}.brand{display:flex;align-items:center;gap:11px;font-family:'Barlow Condensed',sans-serif;font-weight:900;font-size:24px;letter-spacing:.03em}.brandmark{display:grid;place-items:center;width:35px;height:35px;background:var(--mint);color:#16311d;clip-path:polygon(50% 0,95% 24%,95% 78%,50% 100%,5% 78%,5% 24%);font-size:20px}.topnote{color:#c9dccb;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.hero{min-height:365px;position:relative;overflow:hidden;border:1px solid #425846;border-radius:22px;background:#1e2b24 url('team.png') center 43%/cover no-repeat}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,20,13,.98) 0%,rgba(8,20,13,.8) 33%,rgba(8,20,13,.14) 78%),linear-gradient(0deg,rgba(8,20,13,.65),transparent 50%)}.hero-inner{position:relative;z-index:1;max-width:690px;padding:55px 48px}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--mint);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:900}.dot{width:7px;height:7px;background:var(--mint);border-radius:50%;box-shadow:0 0 12px var(--mint)}h1,h2,h3,p{margin-top:0}h1{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;font-size:clamp(55px,7vw,103px);line-height:.85;letter-spacing:-.015em;margin:18px 0}.hero p{max-width:520px;color:#d5e1d6;font-size:16px;line-height:1.55}.hero-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px}.hero-tags span{padding:8px 11px;border-radius:999px;background:#f5f7ed18;border:1px solid #dce5d72f;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.hero-stamp{position:absolute;right:24px;bottom:22px;z-index:1;color:#fff;background:#192b1cbb;border:1px solid #d8ffc252;padding:10px 15px;border-radius:8px;transform:rotate(-6deg);font-family:'Barlow Condensed';font-size:21px;font-weight:900;letter-spacing:.08em}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:14px;margin:32px 0 14px}.section-head h2{font-family:'Barlow Condensed';font-size:34px;text-transform:uppercase;margin:0;letter-spacing:.02em}.section-head p{color:var(--muted);font-size:13px;margin:0}.main-grid{display:grid;grid-template-columns:305px minmax(0,1fr);gap:17px;align-items:start}.panel{border:1px solid var(--line);background:linear-gradient(160deg,#1a2c20,#122019);border-radius:18px;overflow:hidden}.panel-pad{padding:21px}.panel-title{display:flex;justify-content:space-between;align-items:center;font-family:'Barlow Condensed';font-size:23px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin:0 0 17px}.counter{background:#335337;color:var(--mint);padding:4px 8px;border-radius:5px;font:800 12px 'DM Sans'}.player-list{display:grid;gap:7px}.player-row{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid #3a4c3a;background:#192b20;border-radius:10px;cursor:pointer;transition:.18s}.player-row:hover{border-color:#8ec45b}.player-row.off{opacity:.48}.player-row img,.player-row .avatar-fallback{width:35px;height:35px;border-radius:7px;object-fit:cover;object-position:center 24%;background:#6c4b36}.avatar-fallback{display:grid;place-items:center;font-weight:900}.player-row .name{font-size:12px;font-weight:800;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}.player-row .status{font-size:9px;color:#d6e7d7;text-transform:uppercase;font-weight:900;letter-spacing:.07em}.toggle{width:28px;height:16px;border-radius:20px;background:#566454;position:relative;flex:none}.toggle:after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#e8efe5;transition:.2s}.player-row:not(.off) .toggle{background:var(--mint)}.player-row:not(.off) .toggle:after{left:14px;background:#12321c}.divider{height:1px;background:var(--line);margin:19px 0}.field-label{font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:900;color:#b9cdb9;margin:0 0 8px}.select{width:100%;border:1px solid #52694f;border-radius:9px;background:#213326;color:#fff;padding:12px;font-weight:800}.switch-row{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-top:15px;font-size:12px;font-weight:700;cursor:pointer}.switch-row input{appearance:none;width:39px;height:22px;background:#4b5b4c;border-radius:30px;position:relative;flex:none;cursor:pointer}.switch-row input:before{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:white;transition:.2s}.switch-row input:checked{background:var(--mint)}.switch-row input:checked:before{left:20px;background:#17321f}.hint{color:#8fa493;font-size:11px;line-height:1.5;margin:9px 0 0}.roll-btn{display:block;width:100%;border:0;border-radius:10px;padding:16px 12px;background:var(--mint);color:#16241a;font:900 24px 'Barlow Condensed';letter-spacing:.07em;text-transform:uppercase;box-shadow:0 5px 0 #70972f;transition:.15s;margin-top:22px}.roll-btn:hover{transform:translateY(-2px);box-shadow:0 7px 0 #70972f}.roll-btn:active{transform:translateY(4px);box-shadow:0 1px 0 #70972f}.roll-btn:disabled{opacity:.6;cursor:wait}.smallprint{color:#8da08d;text-align:center;font-size:10px;margin:12px 0 0}
.result-head{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:17px 20px;background:#213b25;border-bottom:1px solid #426547}.result-head .label{font-size:10px;font-weight:900;letter-spacing:.16em;color:var(--mint);text-transform:uppercase}.result-title{font:900 30px 'Barlow Condensed';text-transform:uppercase;margin:2px 0 0}.roll-count{font:800 11px 'DM Sans';color:#d9e8d7;border:1px solid #5b7955;border-radius:6px;padding:8px 10px;white-space:nowrap}.pitch-wrap{padding:18px;background:repeating-linear-gradient(180deg,#244b2f 0,#244b2f 80px,#275336 80px,#275336 160px)}.pitch{position:relative;min-height:685px;border:2px solid #a1c9919c;border-radius:3px;background:linear-gradient(0deg,#15391a24,#0c261526)}.pitch:before{content:"";position:absolute;left:8%;right:8%;top:50%;height:1px;background:#b1d3a480}.pitch:after{content:"";position:absolute;left:50%;top:50%;width:95px;height:95px;border:1px solid #b1d3a480;border-radius:50%;transform:translate(-50%,-50%)}.box{position:absolute;left:25%;right:25%;height:75px;border:1px solid #b1d3a480}.box.top{top:0;border-top:0}.box.bottom{bottom:0;border-bottom:0}.spot{position:absolute;transform:translate(-50%,-50%);z-index:2;width:90px;text-align:center;transition:top .5s,left .5s}.spot .bubble{width:58px;height:58px;display:grid;place-items:center;margin:auto;border-radius:50%;background:linear-gradient(135deg,#d4a169,#8a5432);border:3px solid #f3c390;box-shadow:0 7px 20px #08251188;overflow:hidden}.spot img{width:100%;height:100%;object-fit:cover;object-position:center 22%}.spot .initial{font:900 20px 'Barlow Condensed';color:#2a1a15}.spot .spot-name{display:block;background:#101e16e8;border:1px solid #75a468;border-radius:5px;padding:3px 3px;margin:3px auto 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:800 11px 'Barlow Condensed';text-transform:uppercase;letter-spacing:.04em}.spot .spot-pos{display:block;margin-top:2px;color:var(--mint);font:900 12px 'Barlow Condensed'}.spot.ai .bubble{background:#26482c;border-color:#69936d;box-shadow:none}.spot.ai .spot-name{color:#aac3ad;border-color:#47754a}.spot.ai .spot-pos{color:#aec5ab}.spot.ai .initial{color:#91b295}.result-footer{padding:16px 20px;background:#15281c;display:flex;gap:10px;justify-content:space-between;align-items:center}.verdict{font-size:12px;color:#c4d5c2;line-height:1.4}.verdict strong{color:#fff}.copy-btn{border:1px solid #648260;background:#29442b;color:#ebf8e8;border-radius:8px;padding:9px 12px;font-weight:800;font-size:11px;white-space:nowrap}.copy-btn:hover{background:#3d5b3d}
.cards-head{margin-top:44px}.cards-head p{max-width:700px}.cards{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:13px}.card-wrap{min-width:0}.bronze{aspect-ratio:.72;position:relative;overflow:hidden;clip-path:polygon(10% 0,90% 0,100% 8%,100% 87%,87% 100%,13% 100%,0 87%,0 8%);background:radial-gradient(circle at 70% 24%,#f5c58d 0%,transparent 36%),linear-gradient(135deg,#efb875 0%,#b86e3c 29%,#db9d5b 48%,#925631 78%,#e5a368 100%);color:#392317;box-shadow:inset 0 0 0 5px #613a24}.bronze:before{content:"";position:absolute;inset:5px;clip-path:inherit;border:2px solid #f7d19b88;pointer-events:none;z-index:8}.bronze:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0 4px,#3e1f100b 4px 5px),linear-gradient(0deg,#7d462a96,transparent 35%);pointer-events:none}.card-photo{position:absolute;top:9%;right:-3%;width:85%;height:53%;object-fit:cover;object-position:center 18%;mask-image:linear-gradient(180deg,#000 75%,transparent 100%);mix-blend-mode:multiply;filter:contrast(1.15) saturate(.82)}.rating-block{position:absolute;z-index:3;left:12%;top:12%;display:grid;text-align:center;line-height:.9}.rating{font:900 clamp(24px,2.6vw,44px) 'Barlow Condensed'}.position{font:800 clamp(11px,1.1vw,17px) 'Barlow Condensed';margin-top:4px}.flag{font-size:clamp(13px,1.3vw,21px);margin-top:6px}.jeju{font:900 8px 'Barlow Condensed';border-top:1px solid #663b21;margin-top:3px;letter-spacing:.02em}.waiting-photo{position:absolute;top:26%;left:29%;font:900 13px 'Barlow Condensed';transform:rotate(-13deg);border:2px dashed #6f3c22;padding:6px;color:#693b22}.card-bottom{position:absolute;z-index:4;left:8%;right:8%;top:61%;text-align:center}.card-name{font:900 clamp(14px,1.45vw,23px) 'Barlow Condensed';white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase;border-bottom:1px solid #764329;padding-bottom:4px}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1px 5px;margin-top:6px;text-align:left}.stats span{font:800 clamp(9px,.86vw,13px) 'Barlow Condensed';white-space:nowrap}.card-caption{font:900 clamp(11px,1vw,15px) 'Barlow Condensed';text-transform:uppercase;color:#ffe4ae;background:#4c2a1d;padding:7px 5px;text-align:center;min-height:39px;display:grid;place-items:center;margin-top:7px;border-radius:4px}.card-wrap.inactive .bronze{filter:grayscale(.55);opacity:.52}.card-wrap.inactive .card-caption{background:#3e473d;color:#b8c5b6}.card-wrap.rolling .bronze{animation:jitter .3s linear infinite}@keyframes jitter{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(1deg) translateY(-3px)}}.footer{margin-top:38px;border-top:1px solid var(--line);padding-top:20px;color:#8fa391;font-size:11px;display:flex;justify-content:space-between;gap:10px}.footer strong{color:var(--mint)}
@media(max-width:1100px){.cards{grid-template-columns:repeat(4,minmax(0,1fr))}.rating{font-size:42px}.position{font-size:16px}.flag{font-size:20px}.card-name{font-size:23px}.stats span{font-size:13px}.card-caption{font-size:15px}}@media(max-width:760px){.shell{padding:12px 12px 60px}.topnote{display:none}.hero{min-height:330px;background-position:56% center}.hero-inner{padding:36px 24px}.hero-stamp{font-size:15px;right:12px;bottom:10px}.main-grid{grid-template-columns:1fr}.panel-pad{padding:17px}.player-list{grid-template-columns:repeat(2,minmax(0,1fr))}.pitch{min-height:610px}.spot{width:65px}.spot .bubble{width:46px;height:46px}.spot .spot-name{font-size:9px}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.section-head{align-items:start}.section-head p{display:none}}@media(max-width:480px){.hero{min-height:310px}.hero p{font-size:13px}.hero-tags span{font-size:9px}.pitch-wrap{padding:8px}.pitch{min-height:560px}.spot{width:58px}.spot .bubble{width:42px;height:42px}.spot .spot-name{font-size:8px}.spot .spot-pos{font-size:10px}.cards{gap:8px}.rating{font-size:29px}.position{font-size:12px}.flag{font-size:15px}.jeju{font-size:6px}.card-name{font-size:15px}.stats span{font-size:9px}.card-caption{font-size:11px;min-height:31px}.result-title{font-size:23px}.result-footer{align-items:start;flex-direction:column}.footer{display:block}}

/* The draw has one clear focal point: the pitch. */
.keeper-row{display:grid;grid-template-columns:1fr auto;column-gap:10px;padding-top:14px;margin-top:14px;border-top:1px solid var(--line)}.keeper-row small{grid-column:1 / -1;color:#8fa493;font-size:10px;font-weight:600;margin-top:2px}
.pitch-wrap{position:relative;isolation:isolate;overflow:hidden}.pitch-wrap:after{content:"";position:absolute;inset:-40%;z-index:5;pointer-events:none;background:linear-gradient(105deg,transparent 39%,#d8ff8552 49%,transparent 59%);transform:translateX(-110%);opacity:0}.pitch-wrap.just-revealed:after{animation:pitchSweep .7s cubic-bezier(.16,1,.3,1) both}.pitch-wrap.is-rolling .spot{opacity:.08;filter:blur(4px);transform:translate(-50%,-50%) scale(.6)}.pitch-wrap .spot{transition:opacity .2s ease-out,filter .2s ease-out,transform .2s ease-out}.pitch-wrap.just-revealed .spot{animation:spotReveal .48s cubic-bezier(.18,.9,.22,1.22) both;animation-delay:var(--spot-delay,0ms)}.pitch-wrap.just-revealed .spot.ai{animation-duration:.32s;opacity:.8}
.draw-overlay{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;visibility:hidden;opacity:0;background:radial-gradient(circle at 50% 46%,#265630e8 0%,#0b2116ed 53%,#07140df8 100%),url('team.png') center/cover;transition:opacity .2s ease,visibility .2s}.draw-overlay.active{visibility:visible;opacity:1}.draw-overlay.departing{opacity:0;visibility:hidden}.draw-overlay:before,.draw-overlay:after{content:"";position:absolute;left:50%;top:50%;border:1px solid #bfff7066;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.draw-overlay:before{width:min(75%,440px);aspect-ratio:1;box-shadow:0 0 0 45px #bfff7008,0 0 80px #bfff7020;animation:drawRing 1.25s ease-out infinite}.draw-overlay:after{width:min(50%,280px);aspect-ratio:1;animation:drawRing 1.25s ease-out .18s infinite}.draw-grid{position:absolute;inset:0;opacity:.18;background:linear-gradient(#b6e66f44 1px,transparent 1px),linear-gradient(90deg,#b6e66f44 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(circle,#000,transparent 75%)}.draw-scan{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 0%,#c5ff5c33 49.7%,#d6ffa6a0 50%,#c5ff5c33 50.3%,transparent 100%);background-size:100% 90px;animation:scan 1s ease-in-out infinite alternate;opacity:.55}.draw-content{position:relative;z-index:2;text-align:center;padding:25px;max-width:100%;text-shadow:0 12px 30px #071d10}.draw-kicker{font:900 12px 'DM Sans';letter-spacing:.26em;color:var(--mint);text-transform:uppercase}.draw-formation{font:900 clamp(70px,10vw,135px)/.9 'Barlow Condensed';letter-spacing:-.025em;color:#f5ffe6;margin:17px 0 10px;filter:drop-shadow(0 0 25px #c5ff5c70)}.draw-formation span{display:inline-block;animation:formationBeat .62s cubic-bezier(.2,.7,.2,1) both}.draw-message{font:800 clamp(15px,2vw,25px) 'Barlow Condensed';letter-spacing:.16em;text-transform:uppercase;color:#d7f6cb}.draw-track{width:min(280px,65vw);height:4px;border-radius:9px;background:#9abe8244;margin:24px auto 0;overflow:hidden}.draw-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#adf44d,#f9dc97);box-shadow:0 0 14px #c5ff5c;animation:drawProgress 1.05s cubic-bezier(.1,.1,.3,1) forwards}.draw-overlay .draw-stamp{position:absolute;left:50%;bottom:11%;transform:translateX(-50%) rotate(-4deg);white-space:nowrap;border:1px solid #b9ef9d80;border-radius:4px;padding:7px 12px;color:#d9efc8;font:900 13px 'Barlow Condensed';letter-spacing:.13em;text-transform:uppercase}
.roll-btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .12s ease-out,box-shadow .12s ease-out,background-color .12s ease-out}.roll-btn:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,#fff9 49%,transparent 68%);transform:translateX(-120%)}.roll-btn:hover:before{animation:buttonGlint .65s ease-out}.roll-btn.is-spinning{background:#dafa8d;box-shadow:0 2px 0 #70972f,0 0 25px #c5ff5c55;transform:translateY(3px)}.roll-btn.is-spinning:after{content:"";position:absolute;left:0;bottom:0;width:0;height:5px;background:#345d25;animation:drawProgress 1.05s ease-out forwards}.result-title.just-revealed{animation:titleReveal .46s cubic-bezier(.16,1,.3,1) both}.roll-count.just-revealed{animation:countReveal .42s ease-out both}.card-wrap.just-revealed{animation:cardReveal .55s cubic-bezier(.16,1,.3,1) both;animation-delay:var(--card-delay,0ms);transform-origin:center bottom}.card-wrap.just-revealed .bronze{box-shadow:inset 0 0 0 5px #613a24,0 9px 22px #c98a5155}.card-wrap.rolling .bronze{animation:none}
@keyframes pitchSweep{0%{opacity:0;transform:translateX(-110%)}30%{opacity:1}100%{opacity:0;transform:translateX(110%)}}@keyframes drawRing{0%{opacity:0;transform:translate(-50%,-50%) scale(.65)}35%{opacity:.8}100%{opacity:0;transform:translate(-50%,-50%) scale(1.35)}}@keyframes scan{from{background-position:0 -90px}to{background-position:0 420px}}@keyframes formationBeat{from{opacity:.2;transform:translateY(12px) scale(.84)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes drawProgress{to{width:100%}}@keyframes buttonGlint{to{transform:translateX(120%)}}@keyframes spotReveal{0%{opacity:0;filter:blur(8px);transform:translate(-50%,-38%) scale(.42)}65%{opacity:1;filter:blur(0);transform:translate(-50%,-52%) scale(1.08)}100%{opacity:1;filter:blur(0);transform:translate(-50%,-50%) scale(1)}}@keyframes titleReveal{from{opacity:0;transform:translateY(10px);filter:blur(5px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}@keyframes countReveal{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes cardReveal{from{opacity:0;transform:perspective(600px) rotateY(-28deg) translateY(20px) scale(.94);filter:brightness(1.45)}to{opacity:1;transform:perspective(600px) rotateY(0) translateY(0) scale(1);filter:brightness(1)}}
@media(max-width:760px){.draw-formation{font-size:clamp(64px,16vw,110px)}.draw-overlay .draw-stamp{font-size:11px}.draw-content{padding:14px}}@media(prefers-reduced-motion:reduce){.draw-overlay,.pitch-wrap .spot,.roll-btn{transition-duration:.01ms!important}.draw-overlay:before,.draw-overlay:after,.draw-scan,.draw-track span,.pitch-wrap.just-revealed:after,.pitch-wrap.just-revealed .spot,.result-title.just-revealed,.roll-count.just-revealed,.card-wrap.just-revealed,.draw-formation span,.roll-btn:before,.roll-btn.is-spinning:after{animation:none!important}.pitch-wrap.just-revealed .spot,.card-wrap.just-revealed{opacity:1;transform:none;filter:none}}