@media(max-width:768px){.class-picker-outer>div{border:none;padding:0;background:transparent;backdrop-filter:none;box-shadow:none}}.class-picker{position:relative;width:100%;display:flex;flex-direction:column;background:rgba(var(--bg-color),.5);background-image:linear-gradient(rgba(var(--main-color),.04) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--main-color),.04) 1px,transparent 1px);background-size:12px 12px;padding:.6em}.class-picker:before,.class-picker:after{content:"";position:absolute;inset:0;pointer-events:none}.class-picker:before{background-image:var(--class-picker-bg);background-repeat:no-repeat;background-size:50%;background-position:100% 40%;opacity:.18;filter:grayscale(1) brightness(.9) contrast(1.1)}.class-picker[data-class-id=blitz]:before{background-size:60%;background-position:115% 50%}.class-picker[data-class-id=trickster]:before{background-size:55%;background-position:95% 35%}.class-picker[data-class-id=controller]:before{background-size:80%;background-position:100% 55%}@media(max-width:1200px)and (min-width:961px){.class-picker:before{background-size:70%;opacity:.22}.class-picker[data-class-id=blitz]:before{background-size:75%;background-position:50% 45%}.class-picker[data-class-id=trickster]:before{background-size:72%;background-position:50% 45%}.class-picker[data-class-id=controller]:before{background-size:85%;background-position:50% 45%}}@media(max-width:960px)and (min-width:769px){.class-picker:before{background-size:95%;background-position:50% 45%;opacity:.35}.class-picker[data-class-id=blitz]:before{background-size:100%}.class-picker[data-class-id=trickster]:before{background-size:98%}.class-picker[data-class-id=controller]:before{background-size:105%}}@media(max-width:768px)and (min-width:600px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:200%;background-position:35% 45%}.class-picker[data-class-id=trickster]:before{background-size:128%;background-position:50% 45%}.class-picker[data-class-id=controller]:before{background-size:200%;background-position:50% 65%}}@media(max-width:599px)and (min-width:465px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 45%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 100%}.class-picker[data-class-id=controller]:before{background-size:260%;background-position:85% 50%}}@media(max-width:464px)and (min-width:460px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 20%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 950%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 35%}}@media(max-width:459px)and (min-width:458px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 20%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 600%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 35%}}@media(max-width:457px)and (min-width:455px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 20%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 220%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 35%}}@media(max-width:454px)and (min-width:450px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 20%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 200%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 35%}}@media(max-width:449px)and (min-width:440px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 20%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 180%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 35%}}@media(max-width:439px)and (min-width:378px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:250%;background-position:42% 20%}.class-picker[data-class-id=trickster]:before{background-size:150%;background-position:50% 120%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 35%}}@media(max-width:377px){.class-picker:before{opacity:.75}.class-picker[data-class-id=blitz]:before{background-size:320%;background-position:43.5% 25%}.class-picker[data-class-id=trickster]:before{background-size:180%;background-position:50% 120%}.class-picker[data-class-id=controller]:before{background-size:300%;background-position:85% 45%}}.class-picker:after{background:linear-gradient(135deg,#000000b3,#0003 60%)}.class-picker__main{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,40%);gap:1em;height:auto;margin-bottom:1em}@media(max-width:768px){.class-picker{padding:1em .8em;gap:1.25em}.class-picker__strip-wrap{order:-1;margin-bottom:.5em}.class-picker__strip-line{margin-bottom:.75em}.class-picker__strip{column-gap:1.5rem;row-gap:.75rem;padding:.5em 0 .6em}.class-picker__main{order:0;display:flex;flex-direction:column;height:auto;min-height:0}.class-picker__ability{flex-direction:column;align-items:center}.class-picker__ability-icon{display:block;width:6em;height:auto;margin-inline:auto}.class-picker__ability-content{width:100%}}.class-picker__details{display:flex;flex-direction:column;position:relative;min-width:0;align-self:start;background:rgba(var(--bg-color),.4);border:1px dotted var(--main-color);padding:1em 1.2em;overflow-y:auto}.class-picker__details-inner{position:relative;z-index:1;min-width:0;overflow-wrap:break-word;word-wrap:break-word}.class-picker__details-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1em;margin-bottom:.25em}@media(max-width:1200px){.class-picker__details-header{flex-direction:column;gap:.5em;align-items:flex-start}.class-picker__tags{justify-content:flex-start}}@media(max-width:768px){.class-picker__tags .tag{font-size:clamp(.65em,2.5vw + .5em,1em)}}.class-picker__title{margin:0;font-size:clamp(2rem,6vw + 1.5rem,5rem);font-weight:600;letter-spacing:.04em;color:var(--main-color)}.class-picker__description{margin:0 0 .8em;font-size:clamp(.85rem,1.2vw + .9rem,1.4rem);line-height:1.4;color:rgba(var(--main-color),.9);width:100%;min-width:0}.class-picker__tags{display:flex;flex-wrap:wrap;gap:.5em;justify-content:flex-start;flex-shrink:0}.class-picker__tags .tag{padding:.1em .3em;font-size:clamp(.7em,2vw + .6em,1em);background:linear-gradient(90deg,transparent -5%,rgba(var(--bg-color),.3) 75%);border:1px solid var(--main-color)}.class-picker__ability{display:flex;align-items:flex-start;gap:.75em;border:1px dotted var(--main-color);padding:.5em .6em;background:rgba(var(--bg-color),.5);background-image:linear-gradient(rgba(var(--main-color),.03) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--main-color),.03) 1px,transparent 1px);background-size:8px 8px;margin-bottom:.6em;font-size:clamp(.65em,1.5vw + .5em,.78em);line-height:1.4;letter-spacing:.06em;min-width:0}.class-picker__ability-icon{flex-shrink:0;width:10em;height:auto;opacity:.9}.class-picker__ability-content{min-width:0;overflow-wrap:break-word;word-wrap:break-word}.class-picker__ability-prompt{color:rgba(var(--main-color),.7);margin-right:.35em;font-weight:400}.class-picker__ability-title{display:flex;align-items:baseline;flex-wrap:wrap;margin:0 0 .4em;font-size:clamp(1em,2vw + .8em,1.35em);letter-spacing:.12em;text-transform:uppercase}.class-picker__ability-title strong{color:var(--main-color)}.class-picker__ability-desc{display:flex;align-items:baseline;flex-wrap:wrap;margin:0;padding-bottom:.5em;border-bottom:1px dotted rgba(var(--main-color),.4);letter-spacing:.06em}.class-picker__ability-desc strong{font-style:italic;color:rgba(var(--main-color),.55)}.class-picker__ability-example{margin-top:.5em;padding-left:.5em;border-left:2px solid rgba(var(--main-color),.5)}.class-picker__example-title{display:flex;align-items:baseline;margin:0 0 .35em;letter-spacing:.12em;text-transform:uppercase;color:rgba(var(--main-color),.85)}.class-picker__example-lines{margin:0}.class-picker__example-line{display:flex;align-items:baseline;flex-wrap:wrap;margin:.2em 0 0;letter-spacing:.08em}.class-picker__example-prefix{color:rgba(var(--main-color),.6);margin-right:.4em;flex-shrink:0}.class-picker__learn-more{display:inline-flex;align-items:center;gap:.35em;margin-bottom:.8em;font-size:1.3rem;color:var(--main-color);text-decoration:none;border-bottom:1px dotted var(--main-color);transition:color .2s ease,border-color .2s ease}.class-picker__learn-more:hover{color:#dcdcdcf2;border-bottom-color:#dcdcdc99}.class-picker__arrow{opacity:.8}.class-picker__cta{display:inline-block;padding:.5em 1.2em;font-size:1.5rem;font-weight:600;letter-spacing:.05em;text-decoration:none;color:#121212f2;background:linear-gradient(180deg,#fff 0% 100%);border:1px solid rgba(255,255,255,.3);box-shadow:0 1px #fff3;transition:filter .2s ease,box-shadow .2s ease}.class-picker__cta:hover{filter:brightness(1.1);box-shadow:0 0 0 1px #fff6}.class-picker__strip-wrap{display:flex;flex-direction:column;column-gap:.5rem;margin:0;flex-shrink:0}.class-picker__strip-line{border-top:1px dotted var(--main-color)}.class-picker__strip{display:flex;flex-wrap:wrap;column-gap:1rem;justify-content:left;align-items:center;padding:.3em 0}.class-picker__thumb{--thumb-size: 64px;--thumb-bg-size: cover;--thumb-bg-position: center;width:var(--thumb-size);height:var(--thumb-size);padding:0;border:2px solid rgba(var(--main-color),.3);background-image:var(--thumb-bg);background-repeat:no-repeat;background-position:var(--thumb-bg-position);background-size:var(--thumb-bg-size);background-color:rgba(var(--bg-color),.5);cursor:pointer;overflow:hidden;transition:border-color .25s ease,filter .25s ease,box-shadow .25s ease,opacity .25s ease;flex-shrink:0}.class-picker__thumb[data-id=blitz]{--thumb-bg-size: 170%;--thumb-bg-position: 40% 50%}.class-picker__thumb[data-id=trickster]{--thumb-bg-size: 110%;--thumb-bg-position: 50% 40%}.class-picker__thumb[data-id=controller]{--thumb-bg-size: 210%;--thumb-bg-position: 100% 50%}.class-picker__thumb:not(.class-picker__thumb--selected){filter:grayscale(1) brightness(.7);opacity:.6}.class-picker__thumb:hover:not(.class-picker__thumb--selected){filter:grayscale(1) brightness(1.5) contrast(1.1);border-color:rgba(var(--main-color),.5);opacity:.8}.class-picker__thumb--selected{filter:grayscale(1) brightness(1.8) contrast(1.1);opacity:1;border-color:#fff;box-shadow:0 0 0 1px #fff6}.class-picker__thumb:focus-visible{outline:2px solid var(--main-color);outline-offset:2px}