*{box-sizing:border-box}:root{--kb: 0px}.background-container{position:fixed;top:0;left:0;width:98vw;height:99vh;overflow:hidden}body{margin:0;padding-top:var(--nav-h);background:#000b23;color:#fff;overflow:hidden;--body-fs: clamp(8px, calc(4.112px + 1.081vw) , 16px);font-size:var(--body-fs)}.roster-area{width:100vw;padding:0;margin:0 auto;position:absolute;top:var(--nav-h);left:50%;transform:translate(-50%);bottom:23.4375em;overflow:hidden;transition:bottom .3s ease}.footer-collapsed .roster-area{bottom:0}.roster-area-footer{display:flex;justify-content:space-between;z-index:7;position:absolute;bottom:0;align-items:center;width:90vw;left:50%;transform:translate(-50%);font-family:Eurostile;color:#fff;background-color:#0009;height:2.1875em;gap:1em}.roster-footer-count,.roster-footer-prestige,.rf-breakdown-class-count{font-size:1.5em}.roster-footer-count-prestige{display:flex;flex-direction:row;justify-content:space-between;text-wrap-mode:nowrap;gap:1.25em}.roster-footer-breakdown{display:grid;grid-auto-flow:column;grid-auto-columns:max-content;justify-content:space-between;align-items:center;width:23.75em}.roster-footer-breakdown .breakdown-class{display:flex;align-items:center}.roster-footer-breakdown .breakdown-icon{width:1.5em;height:auto;margin:.125em}.footer-collapsed .roster-summary{bottom:.9375em}.roster-grid-header{display:flex;justify-content:space-between;align-items:center;height:5.625em;width:90vw;margin-left:auto;margin-right:auto}.roster-grid-header-label{font-family:Hanzel;font-size:3em;color:#e1e045;text-transform:uppercase;text-shadow:.125em .125em .3em orange}.roster-grid-container{display:flex;align-items:center;justify-items:center}.roster-grid{display:grid;grid-template-columns:repeat(auto-fill,6.25em);grid-auto-rows:9em;gap:2.1875em;justify-content:center;width:calc(100dvw - 6.25em);margin-left:auto;margin-right:auto;overflow-y:auto;overflow-x:hidden;box-sizing:border-box;position:absolute;bottom:2.1875em;top:5.9375em;width:100dvw;padding:1.75em 5.25em 3.125em}.r1{--border-color: #475545;--grad-start-color: #273527;--grad-end-color: black}.r2{--border-color: #8f4f39;--grad-start-color: #3a211c;--grad-end-color: #0e0e0f}.r3{--border-color: #8997a6;--grad-start-color: #964686b;--grad-end-color: #0d0e0f}.r4{--border-color: #d7e1ea;--grad-start-color: #9a6530;--grad-end-color: #150700}.r5{--border-color: #bb1a17;--grad-start-color: black;--grad-end-color: black}.r6{--border-color: #005451;--grad-start-color: #23748b;--grad-end-color: #021a20}.r7{--border-color: #520266;--grad-start-color: #681392;--grad-end-color: #08010d}.roster-cell-wrapper{position:relative;display:flex;align-items:center;justify-content:center}.roster-cell{--rc-width: 6em;--rc-border-width: .125em;width:calc(var(--rc-width) + var(--rc-border-width) + var(--rc-border-width));height:10em;border:var(--rc-border-width) solid var(--border-color, black);border-radius:.625em;overflow:hidden}roster-add-champ .roster-cell{height:8.625em}roster-champion.isnew .roster-cell{--glow-color: #00e676;box-shadow:0 0 0 .125em var(--glow-color),0 0 .5em .25em #00e676a6}.roster-cell-edit-overlay{visibility:hidden;opacity:0;pointer-events:none;transition:opacity .3s ease,visibility 0s linear .3s;position:absolute;top:0;left:0;z-index:5}.roster-grid.edit .roster-cell-edit-overlay{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .3s ease,visibility 0s;-webkit-user-select:none;-webkit-touch-callout:none}.roster-grid.edit .portrait-container{pointer-events:none;cursor:pointer}.roster-cell-quickedit-rank{position:absolute;top:1.25em;left:-.75em}.roster-cell-quickedit-rank img{cursor:auto;pointer-events:none;user-select:none;display:block;margin-bottom:.3125em;width:1.9375em;aspect-ratio:1 / 1;height:auto}.roster-cell-quickedit-rank img.active{cursor:pointer;pointer-events:auto}.roster-cell-quickedit-sig{position:absolute;top:1.25em;left:5.125em}.roster-cell-quickedit-sig img{cursor:auto;pointer-events:none;user-select:none;display:block;margin-bottom:.3125em;width:1.9375em;aspect-ratio:1 / 1;height:auto}.roster-cell-quickedit-sig img.active{cursor:pointer;pointer-events:auto}.roster-cell-quickedit-delete{position:absolute;top:-1.25em;left:5.125em;width:1.875em;aspect-ratio:1 / 1;height:auto;cursor:pointer}.portrait-container{width:var(--rc-width);aspect-ratio:1 / 1;height:auto;background:radial-gradient(circle at calc(var(--rc-width) / 2) calc(var(--rc-width) / 3),var(--grad-start-color, black) 0%,var(--grad-end-color, black) 100%);display:flex;align-items:center;justify-content:center;margin:0;padding:0;position:relative}.portrait-champname{position:absolute;overflow:visible;top:-1.0625em;background:#000;width:auto;padding:0 .625em;height:1.25em;align-items:center;display:flex;border:1px solid #666;user-select:none}.portrait-champname span{font-family:Eurostile;font-size:1.25em;text-wrap-mode:nowrap}roster-add-champ .portrait-champname{top:-.75em}.portrait-container img{width:var(--rc-width);aspect-ratio:1 / 1;height:auto}.portrait-caption{background:#000;height:3.875em;width:var(--rc-width);display:flex;flex-direction:column;justify-content:center;align-items:center;user-select:none;text-align:center}.portrait-caption span{font-family:Eurostile;font-size:1.125em;color:#fff}roster-add-champ .portrait-caption{height:2.375em}.portrait-caption-line2{display:flex;flex-direction:row;gap:.25em}.portrait-ascension-badge{width:1.5em;aspect-ratio:12 / 11;height:auto;cursor:auto;pointer-events:none}.roster-grid.edit .portrait-ascension-badge{cursor:pointer;pointer-events:auto}.portrait-rarity-overlay{position:relative;top:-4.4375em;left:0;width:5.875em}roster-add-champ .portrait-rarity-overlay{top:-2.75em}roster-add-champ .portrait-ascension-overlay{display:none}roster-add-champ .portrait-ascension-overlay.active{display:block;position:absolute;top:-1.375em;right:-.125em;width:2.1875em;z-index:6}.filter-button{position:fixed;top:calc(var(--nav-h) + 4em);left:.9375em;z-index:5;border:none;width:3em;aspect-ratio:1 / 1;height:auto;cursor:pointer;color:#999;transition:color .3s}.filter-button-caption{display:block;margin-top:-.625em;text-align:center;font-family:sans-serif;user-select:none}.filter-button-caption span{font-size:1em}.filter-button.filters-active{color:#0cc}.filter-button:hover{color:#fff}.roster-mode-switch{position:fixed;top:calc(var(--nav-h) + 11em);left:.9375em;z-index:5;border:none;width:3em;aspect-ratio:1 / 1;height:auto;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-items:center}.roster-mode-edit-switch{width:100%;height:100%;display:none;color:#fff}.roster-mode-switch.edit .roster-mode-edit-switch{display:block}.roster-mode-view-switch{width:2.75em;aspect-ratio:1 / 1;height:auto;margin-bottom:.25em;display:none}.roster-mode-switch.view .roster-mode-view-switch{display:block}.roster-mode-switch-caption{font-family:sans-serif;font-size:1em;color:#fff;text-align:center;user-select:none}.roster-share-menu{position:fixed;top:calc(var(--nav-h) + 18.5em);left:.9375em;display:flex;flex-direction:column;align-items:center;z-index:5;width:3em}.roster-share-trigger{width:100%;aspect-ratio:1 / 1;border:none;background:transparent;color:#999;cursor:pointer;display:grid;place-items:center;transition:color .3s ease;padding:0}.roster-share-trigger:hover,.roster-share-menu.open .roster-share-trigger{color:#fff}.roster-share-trigger svg{width:100%;height:auto}.roster-share-caption{font-family:sans-serif;font-size:1em;color:#fff;text-align:center;user-select:none}.roster-share-dropdown{margin-top:.5em;background:#333;border:1px solid #aaa;border-radius:.375em;display:none;flex-direction:column;width:15em;position:absolute;left:3.5em;top:0;gap:.25em;box-shadow:0 .5em 1.5em #00000080}.roster-share-menu.open .roster-share-dropdown{display:flex}.share-option{background:transparent;border:none;color:#fff;font-family:Eurostile;font-size:1.2em;text-align:left;padding:.4em .75em;cursor:pointer}.share-option:hover:not(.disabled){background:#666}.share-option.disabled{color:#666;cursor:not-allowed;opacity:.6}.roster-share-stage{position:fixed;top:-200vh;left:-200vw;pointer-events:none;opacity:0;z-index:-1;font-size:16px;--body-fs: 16px}.roster-share-canvas{width:1080px;max-width:1080px;background:#000b23;padding:2rem;display:flex;flex-direction:column;gap:2.5em;font-family:Eurostile,sans-serif;color:#fff}.roster-share-header{display:flex;justify-content:space-between;align-items:center;gap:1em;margin-bottom:1em}.roster-share-title{font-family:Hanzel;font-size:3.5em;color:#e1e045;text-transform:uppercase;text-shadow:.125em .125em .3em orange}.roster-share-logo{height:3.5em;width:auto}.roster-share-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:1.5em;width:100%;justify-items:center}.roster-share-grid roster-champion{width:100%;max-width:100%;display:flex;justify-content:center}.roster-share-grid .roster-cell{--rc-width: 100px;width:100%;height:calc(var(--rc-width) * 1.6)}.roster-share-grid .roster-cell img{max-width:100%}.roster-share-stage .roster-cell{border-width:.1875em}.roster-share-stage .roster-cell-edit-overlay{display:none!important}.roster-share-stage .roster-area-footer{position:static;transform:none;width:100%;background:#00000059;padding:.5em 1em;box-sizing:border-box;gap:1em}.roster-share-stage .roster-footer-breakdown{width:auto;gap:1em}.roster-share-stage .roster-footer-count,.roster-share-stage .roster-footer-prestige{font-size:1.25em}.bottom-sheet{position:fixed;inset-inline:0;bottom:max(env(safe-area-inset-bottom),var(--kb));width:90vw;height:23.4375em;z-index:2;transition:height .3s ease,visibility .3s ease;overflow:visible;border-top:2px solid white;left:50%;transform:translate(-50%)}.toggle-icon{position:absolute;width:3.125em;aspect-ratio:1 / 1;height:auto;cursor:pointer;z-index:3}#collapse-button{top:.625em;right:.625em}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fadeIn-animation{animation:1s fadeIn}#expand-button{position:fixed;visibility:visible;bottom:2.5em;left:calc(95vw - 3.75em);display:none;background-color:#000000bf}.add-champs-header{margin-top:.625em}.add-champs-header span{color:#0cc;font-family:Eurostile;font-size:2.5em}.add-champs-body{display:grid;grid-template-columns:33.5625em 8.375rem;height:16.875em;column-gap:.625em;margin-top:.9375em;justify-self:center}@media(max-width:600px){.add-champs-body{justify-self:auto;grid-template-columns:33.5625em 1fr}}.add-champs-properties{background:#000;border:1px solid #00cccc;border-radius:.9375em;width:100%;height:100%;padding:1.5625em;display:grid;grid-template-columns:6.6875em 1fr;grid-template-rows:3em 2.8125em 2.8125em 3em;row-gap:.625em;--text-toggle-size: 2.625em;--text-toggle-gap: .625em}.acp-label{font-family:Eurostile;font-size:1.5em;color:#fff;display:flex;align-items:center}.acp-input{display:flex;align-items:center}.acp-rarity-options-container{display:grid;grid-template-columns:repeat(7,var(--text-toggle-size));grid-template-rows:var(--text-toggle-size);column-gap:var(--text-toggle-gap)}.acp-rarity-option{background:#333;color:#fff;display:flex;align-items:center;justify-content:center;border:.1875em solid black;cursor:pointer;user-select:none}.acp-rarity-option span{font-family:Hanzel;font-size:1.75em}.acp-rarity-option.selected{border:.1875em solid yellow;border-radius:.1875em}.acp-rarity-option.disabled{border:.1875em solid black;border-radius:0;color:#999;cursor:auto}.acp-rank-options-container{display:grid;grid-template-columns:repeat(6,var(--text-toggle-size));grid-template-rows:var(--text-toggle-size);column-gap:var(--text-toggle-gap)}.acp-rank-option{background:#333;display:flex;align-items:center;justify-content:center;border:3px solid black;cursor:pointer;user-select:none;color:#fff}.acp-rank-option span{font-family:Hanzel;font-size:1.75em}.acp-rank-option.selected{border:.1875em solid yellow;border-radius:.1875em}.acp-rank-option.disabled{border:.1875em solid black;border-radius:0;color:#999;cursor:auto}.acp-rank-options-ascension{margin-left:1.875em}.acp-rank-options-ascension img{display:none;cursor:auto;pointer-events:none;width:2.75em;aspect-ratio:44 / 40;height:auto}.acp-rank-options-ascension img.show{display:block;cursor:pointer;pointer-events:auto}.sig-selected-value{font-family:Eurostile;font-size:clamp(1rem,.757rem + 1.081vw,1.5rem);color:#fff;padding-right:.833em;background:#000;width:4.167em}.sig-selected-value::-webkit-inner-spin-button,.sig-selected-value::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.sig-selected-value{-moz-appearance:textfield}.add-champs-preview-action{--preview-portrait-height: 8.375em;--add-button-height: 7.125em;display:grid;align-items:center;grid-template-columns:1fr;grid-template-rows:var(--preview-portrait-height) var(--add-button-height);margin:auto;column-gap:5vw;height:100%;align-content:space-between}@media(max-width:1100px){.add-champs-preview-action{grid-template-columns:1fr;grid-template-rows:var(--preview-portrait-height) var(--add-button-height);row-gap:.625em;height:16.875em;align-items:center;justify-items:center;padding-top:.9375em}}.add-champs-add-button{display:flex;flex-direction:column;justify-items:center;align-items:center;width:8.375em;height:7.125em;margin:auto 0}.add-champs-add-button svg{width:5.25em;aspect-ratio:1 / 1;height:auto;position:relative;color:#666;transition:color .5s ease;margin-bottom:.3875em}.add-champs-add-button.active svg{color:#46b843;cursor:pointer;filter:drop-shadow(.1875em .1875em .125em rgba(255,255,255,.3))}.add-champs-add-button-caption{font-family:Eurostile;font-size:1.125em;color:#666;user-select:none}.add-champs-add-button.active .add-champs-add-button-caption{color:#46b843}.roster-grid-sort-options{display:grid;grid-template-columns:5em 6.5em 6.5em 5em;height:2.625em;column-gap:.4375em}.sort-label{font-family:Eurostile;font-size:1.5em;color:#fff;display:flex;justify-content:center;align-items:center}.sort-option{background:#0cc;color:#fff;display:flex;justify-content:center;align-items:center;user-select:none;cursor:pointer;font-size:1.5em;font-family:Eurostile}.sort-option.active{background:#fff;color:#0cc;box-shadow:.125em .1875em .1875em #fff9;border:.125em solid #00cccc}.sort-pres{border-radius:.3125em 0 0 .3125em}.sort-sig{border-radius:0 .3125em .3125em 0}.backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0000004d;z-index:6;display:none;opacity:0;transition:opacity .3s}.backdrop.visible{display:block;opacity:1}.roster-grid-message{display:none;padding-left:3.125em;text-align:center}.roster-grid-message-text{font-family:Eurostile;font-size:1.5em;color:#fff}.roster-grid-message.show{display:block}