:root{max-width:1280px;height:1920px;margin:0 auto;padding:2rem;text-align:center;background-image:url(/_next/static/media/valorant_background.b5542797.png);background-repeat:no-repeat;background-position-x:center;background-position-y:top;background-size:cover;color:#FFFFFF;font-family:monospace}html{background-color:#0f1923}select{font-family:monospace;width:200px;height:30px;border:3px solid var(--color-1);border-radius:5px;background-color:var(--color-2);color:#FFFFFF;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:--color-1 .2s,--color-2 .2s}select:hover{--color-1:rgba(174,176,184,0.5);--color-2:rgba(1,60,107,0.5)}img{border-radius:8px}h1{font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:3.2rem;font-weight:100}h3,p{z-index:2}hr{height:2px;background-color:var(--color-3);border:none}footer,hr{width:100%}footer{height:10vh}#agents-list{list-style:none;position:relative;display:flex;flex-wrap:wrap;justify-content:center}#agents-list li{background-image:linear-gradient(135deg,var(--color-2),var(--color-1));width:160px;height:auto;padding:20px;margin:20px;border-radius:15px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:--color-1 .2s,--color-2 .2s,scale .1s}#agents-list li:hover{--color-1:rgba(174,176,184,0.5);--color-2:rgba(1,60,107,0.5);scale:1.05}#agents-list li:active{--color-1:rgba(1,60,107,0.5);--color-2:rgba(174,176,184,0.5)}#roleIcon{display:grid;width:20px;height:20px}#full-portrait-container{display:none}#full-portrait-container.show{position:fixed;overflow-y:auto;display:flex;flex-wrap:wrap;left:9.5vw;z-index:998;max-width:80vw;max-height:70vh;background-image:linear-gradient(135deg,var(--color-4),var(--color-3));border:3px solid var(--color-3);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:15px}#full-portrait-container.show #display-icon{width:20%}#exit-button{visibility:visible;position:-webkit-sticky;position:sticky;z-index:999;background-color:rgba(255,255,255,0);border:none;left:1vw;top:2vh;width:24px;height:24px}#exit-button svg{width:40px;height:40px;transition:transform .1s}#exit-button:hover svg{transform:scale(1.1);cursor:pointer}#selected-agent{padding:1em}#abilities-list{list-style:none;position:relative;display:flex;flex-wrap:wrap;text-align:center;justify-content:center;margin:0;padding:0}#display-icon{width:50%;aspect-ratio:1/1;padding-top:2vh}#full-portrait{position:fixed;left:52vw;top:-20vh;width:1700px;height:auto;size:cover}#valorant-api{background-color:var(--color-4);border-radius:15px;padding:2px 5px;text-decoration:none;color:white}#valorant-api:hover{background-color:var(--color-3);color:rgb(119,15,15)}@property --color-1{syntax:"<color>";initial-value:rgba(1,60,107,.5);inherits:false}@property --color-2{syntax:"<color>";initial-value:rgba(174,176,184,.5);inherits:false}@property --color-3{syntax:"<color>";initial-value:rgba(74,84,92,.5);inherits:false}@property --color-4{syntax:"<color>";initial-value:rgba(48,5,5,.5);inherits:false}@media (min-width:1920px){#full-portrait-container.show{display:flex;position:fixed;left:1.5vw;top:3vh;width:17vw;min-height:15vh;max-height:95vh;background-image:linear-gradient(135deg,var(--color-4),var(--color-3));border:3px solid var(--color-3);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:15px;overflow-y:auto}}@media only screen and (max-width:768px){:root{z-index:-1;touch-action:pan-y;overflow-x:none;height:auto;background-image:url(/_next/static/media/valorant_background_mobile.c208ea1d.png);height:100vh;width:100vw;background-repeat:repeat-y;background-size:cover;background-position:50%;color:#FFFFFF;background-color:#0f1923;font-family:monospace}:root,body{margin:0;padding:0}select{font-family:monospace;width:90vw;height:5vh;border-radius:8px;background-color:var(--color-2);color:#FFFFFF;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:--color-1 .2s,--color-2 .2s}select:hover{--color-1:rgba(174,176,184,0.5);--color-2:rgba(1,60,107,0.5)}img{border-radius:8px}h1{font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:3.2rem;font-weight:100;margin:6vw}h3,p{z-index:2}hr{width:100%;height:2px;background-color:var(--color-3);border:none}footer{width:100vw;height:10vh}#agents-list{width:90vw;list-style:none;display:flex;gap:20px;justify-content:center;align-items:center;padding:0;margin:20px auto}#full-portrait{display:none}#agents-list li{display:flex;align-items:center;gap:10px;background-image:linear-gradient(135deg,var(--color-2),var(--color-1));min-width:200px;width:100%;height:auto;padding:20px;margin:0;border-radius:15px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:--color-1 .2s,--color-2 .2s,scale .1s}#agents-list li:hover{--color-1:rgba(174,176,184,0.5);--color-2:rgba(1,60,107,0.5);scale:1.05}#agents-list li:active{--color-1:rgba(1,60,107,0.5);--color-2:rgba(174,176,184,0.5)}#roleIcon{width:20px;height:20px}#full-portrait-container{display:none}#full-portrait-container.show{position:fixed;overflow-y:auto;display:flex;flex-wrap:wrap;left:9.5vw;z-index:998;width:80vw;max-height:70vh;background-image:linear-gradient(135deg,var(--color-4),var(--color-3));border:3px solid var(--color-3);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:15px}#selected-agent{margin:0;padding:0 2vw}#exit-button{visibility:visible;position:-webkit-sticky;position:sticky;z-index:999;background-color:rgba(255,255,255,0);border:none;left:1vw;top:1vh;width:24px;height:24px}#abilities-list{list-style:none;position:relative;display:flex;flex-wrap:wrap;text-align:center;justify-content:center;margin:0;padding:0}#valorant-api{background-color:var(--color-4);border-radius:15px;padding:2px 5px;text-decoration:none;color:white}#valorant-api:hover{background-color:var(--color-3);color:rgb(119,15,15)}}