@font-face{font-family:Bitter;src:url(/assets/fonts/bitter-v39-latin/bitter-v39-latin-regular.woff2)}*{box-sizing:border-box;margin:0;padding:0}html{--color-alpha:1;--s-shift:-10%;--l-shift:10%;--color-poison:hsl(273 calc(60% + var(--s-shift)) calc(53% + var(--l-shift)) / var(--color-alpha));--color-grass:hsl(96 calc(78% + var(--s-shift)) calc(36% + var(--l-shift)) / var(--color-alpha));--color-fire:hsl(1 calc(78% + var(--s-shift)) calc(49% + var(--l-shift)) / var(--color-alpha));--color-water:hsl(217 calc(88% + var(--s-shift)) calc(59% + var(--l-shift)) / var(--color-alpha));--color-flying:hsl(212 calc(80% + var(--s-shift)) calc(75% + var(--l-shift)) / var(--color-alpha));--color-bug:hsl(66 calc(100% + var(--s-shift)) calc(32% + var(--l-shift)) / var(--color-alpha));--color-normal:hsl(90 calc(1% + var(--s-shift)) calc(63% + var(--l-shift)) / var(--color-alpha));--color-electric:hsl(47 calc(100% + var(--s-shift)) calc(48% + var(--l-shift)) / var(--color-alpha));--color-ice:hsl(194 calc(100% + var(--s-shift)) calc(68% + var(--l-shift)) / var(--color-alpha));--color-fighting:hsl(31 calc(100% + var(--s-shift)) calc(48% + var(--l-shift)) / var(--color-alpha));--color-ground:hsl(30 calc(76% + var(--s-shift)) calc(31% + var(--l-shift)) / var(--color-alpha));--color-psychic:hsl(339 calc(77% + var(--s-shift)) calc(57% + var(--l-shift)) / var(--color-alpha));--color-rock:hsl(54 calc(23% + var(--s-shift)) calc(59% + var(--l-shift)) / var(--color-alpha));--color-ghost:hsl(294 calc(29% + var(--s-shift)) calc(35% + var(--l-shift)) / var(--color-alpha));--color-dragon:hsl(235 calc(74% + var(--s-shift)) calc(61% + var(--l-shift)) / var(--color-alpha));--color-dark:hsl(10 calc(13% + var(--s-shift)) calc(27% + var(--l-shift)) / var(--color-alpha));--color-steel:hsl(198 calc(38% + var(--s-shift)) calc(57% + var(--l-shift)) / var(--color-alpha));--color-fairy:hsl(295 calc(83% + var(--s-shift)) calc(69% + var(--l-shift)) / var(--color-alpha));--color-blue-lighter:#3df;--color-blue:#00d4ff;--color-blue-darker:#0ac;--color-white-lighter:#fff;--color-white:#f2f2f2;--color-white-darker:#e6e6e6;--color-black-lighter:#404040;--color-black:#262626;--color-black-darker:#0d0d0d;--border-radius:15px;--fs-normal:clamp(1rem, 1.05rem + .2vw, 1.125rem);--z-loading-spinner:100;--z-header:25;--z-fixed:50;scroll-behavior:smooth}body{font-size:var(--fs-normal);background-color:var(--color-blue);min-height:100dvh;font-family:Bitter}body:has(#bigCardOverlay:not(.d-none)){overflow:hidden}header,footer,section{width:100%;padding-inline:max(24px,50% - 800px)}select,input,button{border:unset;font-family:inherit;font-size:inherit;cursor:pointer;background:0 0}img{max-width:100%}button{transition:scale 75ms}button:active{scale:.9}.hidden{visibility:hidden}.d-none{display:none}h1{color:var(--color-black-darker);font-size:clamp(2.25rem,2.5rem + 1vw,3rem);font-weight:700}h2{color:var(--color-black-darker);font-size:clamp(2rem,2.25rem + .7vw,2.5rem);font-weight:700}h3{font-size:clamp(1.5rem,1.6rem + .4vw,1.75rem);font-weight:700}h4{text-align:center;text-wrap:balance;font-size:clamp(1.125rem,1.2rem + .2vw,1.3rem);font-weight:700}abbr{justify-content:center;align-items:center;display:flex}footer{background-color:var(--color-blue-darker);border-top:1px solid var(--color-black-lighter);flex-wrap:wrap;justify-content:center;align-items:center;gap:1em;min-height:6dvh;padding-block:1em;display:flex}header{justify-content:center;align-items:center;gap:1em 5em;height:14dvh;padding-block:1vh;display:flex;position:relative}section{flex-direction:column;justify-content:space-between;align-items:start;width:100%;min-height:80dvh;display:flex;position:relative}@media (width<=1000px){body{flex-direction:column;display:flex}header{height:unset;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:var(--z-header);background-color:#fff3;flex-direction:column;align-items:center;position:sticky;top:0}main{flex:1}section{min-height:unset;padding-top:3vh}}img{transition:scale .225s}.sound{background-image:url(/assets/svg/sound_off.svg);background-position:50%;background-size:cover;width:40px;height:40px}.sound:has(:checked){background-image:url(/assets/svg/sound_on.svg)}.big-pokemon-id{color:#fff;text-shadow:0 0 10px #000;font-size:.8em;position:absolute;top:13em;right:0;rotate:90deg}#sound{opacity:0;width:100%;height:100%}.view{width:100%;padding-block:3vh}.grid{background-color:var(--color-blue-lighter);border-radius:var(--border-radius);box-shadow:var(--color-blue-darker) 1px 1px 5px 0px, var(--color-blue-darker) -1px -1px 5px 0px, hsl(from var(--color-blue-lighter) h s 60%) 1px 1px 5px 0px inset, hsl(from var(--color-blue-lighter) h s 60%) -1px -1px 5px 0px inset;grid-template-columns:repeat(auto-fill,minmax(max(270px,25% - 2em),1fr));grid-auto-rows:60px;gap:2em;padding-inline:2em;display:grid}.pokemon-container *{-webkit-user-select:none;user-select:none}.pokemon-container{-webkit-tap-highlight-color:transparent;--color-type-one:blue;--color-type-two:blue;color:#fff;-webkit-user-select:none;user-select:none;outline:1px solid var(--color-black-lighter);background-color:#4c4cff;background:linear-gradient(105deg, var(--color-type-one) 0%, var(--color-type-one) 49%, var(--color-type-two) 51%, var(--color-type-two) 100%);width:100%;height:100%;box-shadow:2px 2px 10px 0px var(--color-black-darker);cursor:pointer;border-radius:30px;justify-content:space-between;align-items:center;padding:.75em 1.25em;transition:scale .225s;display:flex;position:relative}.pokemon-container:hover{outline:1px solid #fff;scale:1.05;box-shadow:1px 1px 10px 2px #fff}.pokemon-container:hover .pokemon-img{filter:drop-shadow(0 0 3px #fff);scale:2}.pokemon-container:hover .types-container img{scale:1.3}.pokemon-container .name-id-container>*{transition:scale .225s}.pokemon-container:hover .name-id-container>*{scale:1.2}.pokemon-img{aspect-ratio:1;filter:drop-shadow(0 0 3px #000);height:100%;transition:scale .225s;scale:1.5}.name-id-container{font-size:var(--fs-normal);flex-direction:column;flex:1;align-items:start;column-gap:1em;height:80%;display:flex}.pokemon-name{text-shadow:2px 2px 2px var(--color-black-darker)}.pokemon-id{text-shadow:1px 1px 2px var(--color-black-darker);font-size:12px}select{box-shadow:0px 0px 5px var(--color-black-darker);background-color:var(--color-white);border-radius:20px;padding:.5em 1em;transition:scale .225s;position:relative}#genSelect:focus{background-color:var(--color-white-lighter);outline:2px dotted #000}.selectors{align-items:center;column-gap:2em;display:flex}input{border-radius:none;box-shadow:0px 0px 5px var(--color-black-darker);background:url(/assets/svg/search.svg) 15% 0/200% 100% no-repeat;background-color:var(--color-white);border-radius:20px;padding:.5em 1em;transition:box-shadow 1s,scale .225s}#filterInput:disabled{cursor:auto;background-color:gray}#filterInput:disabled::placeholder{color:#fff;font-size:16px}#filterInput::placeholder{color:inherit;font-size:16px}#filterInput.highlight{border-color:red;box-shadow:0 0 10px red}#filterInput:focus{background-color:var(--color-white-lighter);outline:2px dotted #000}.pagination{justify-content:space-between;align-items:center;width:100%;padding-block:2vh;display:flex}.pagination.d-none{display:none}.pagination>button{-webkit-user-select:none;user-select:none;background-color:var(--color-white-darker);box-shadow:0px 0px 10px var(--color-black-lighter);border-radius:25px;padding:.5em 1em;transition:scale .225s,box-shadow .225s,background-color .225s}.types-container{flex:1;justify-content:end;align-items:end;column-gap:1em;height:100%;display:flex}.types-container img{aspect-ratio:1;filter:drop-shadow(0 0 1px #000);width:30px}#emptyListText{text-align:center}#clearFilterBtn{border:1px solid #000;padding:1em}.empty{flex-direction:column;justify-content:center;align-items:center;row-gap:2em;display:flex}#loadingSpinner{opacity:1;visibility:visible;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);width:100%;height:100%;z-index:var(--z-loading-spinner);background-color:#0000;justify-content:center;align-items:center;transition:visibility .225s,opacity .225s;display:flex;position:absolute}#loadingSpinner svg{aspect-ratio:1;width:70px}#loadingSpinner.d-none{visibility:hidden;opacity:0}#bigCardOverlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:100%;height:100dvh;z-index:var(--z-fixed);overscroll-behavior:none;touch-action:none;justify-content:center;align-items:center;display:flex;position:fixed}.big-card-container{width:clamp(320px - 2em,320px - 2em + 5vw,450px);height:600px}#bigCard{background:linear-gradient(to right, hsl(from var(--color-type-one) h s l / .95) 0%, hsl(from var(--color-type-one) h s l / .95) 50%, hsl(from var(--color-type-two) h s l / .95) 50%, hsl(from var(--color-type-two) h s l / .95) 100%);width:100%;height:100%;box-shadow:2px 2px 10px 0px var(--color-black-darker);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overscroll-behavior:none;border:1px solid #000;border-radius:45px;grid-template-rows:6% 35% 20% 40%;grid-auto-flow:column;padding:1em;display:grid;position:relative}#bigCardOverlay.d-none{display:none}#bigCard h3{color:#fff;text-shadow:2px 2px 2px var(--color-black-darker);text-align:center}.big-card-btn{background-color:color-mix(in hsl, var(--color-white-lighter), transparent);--btn-width:60px;--btn-distance:10em;text-align:center;width:var(--btn-width);aspect-ratio:1;top:calc(50% - var(--btn-width) / 2);background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:20px;position:absolute}.big-card-btn.prev{left:calc(-1 * var(--btn-distance));background-image:url(/assets/svg/left.svg)}.big-card-btn.next{right:calc(-1 * var(--btn-distance));background-image:url(/assets/svg/right.svg)}.card-img-container{flex-direction:column;justify-content:center;align-items:center;row-gap:1em;width:100%;padding-block:1em;display:flex}.card-img-container>img{filter:drop-shadow(0 0 3px #000);object-fit:cover;height:100%;scale:1.3}.big-types{column-gap:1em;display:flex}.big-types img{filter:drop-shadow(0 0 1px #000)}.strengths-weaknesses{background-color:#ffffff26;border:.5px solid #00000040;border-radius:20px;flex-direction:column;justify-content:space-evenly;align-items:end;row-gap:.5em;width:100%;height:100%;padding-block:.5em;padding-inline:1em;display:flex;overflow-y:auto}.interaction{flex:1;justify-content:space-between;align-items:start;width:100%;padding-block:.25em;display:flex}.divider{background-color:#000;flex-shrink:0;width:100%;height:.5px}.interaction-img-container{flex-wrap:wrap;justify-content:end;align-items:center;gap:.25em;width:50%;height:100%;display:flex}.interaction-img-container img{min-width:10px;filter:drop-shadow(0px 0px 1px var(--color-black-darker));flex:0 24px}.weak{color:var(--color-white);text-shadow:2px 2px 1px red;filter:drop-shadow(0 0 1px #000)}.strong{color:var(--color-white);text-shadow:2px 2px 1px green;filter:drop-shadow(0 0 1px #000)}.stats{color:#fff;border-radius:30px;grid-template-columns:5fr 1fr;width:100%;padding-block:1em;padding-inline:1em;display:grid}.stats>*{flex-direction:column;justify-content:center;width:100%;display:flex}.stats>*>*{border-bottom:1px solid #000;width:100%}.stats>*>span{text-shadow:2px 2px 2px var(--color-black-darker);padding-block:.25em;padding-inline:.25em}.stat-names{justify-self:start}.stat-names>span{text-align:start;border-top-right-radius:0;border-bottom-right-radius:0}.stat-values{justify-self:end}.stat-values>span{text-align:end;border-top-left-radius:0;border-bottom-left-radius:0}@media (width<=1000px){.types-container{column-gap:.5em}.selectors{flex-direction:column;row-gap:1em}}select:hover,input:hover,button:hover{background-color:var(--color-white-lighter);box-shadow:0px 0px 10px var(--color-white);scale:1.1}@media (width<=768px){select{padding:.25em}input{padding:.25em .5em}.pagination{column-gap:1em;padding-inline:1em}.pagination>button{padding:.5em}section{padding-inline:0}.grid{padding-inline:1em}.big-card-btn{--btn-distance:3.5em;filter:invert(0);bottom:calc(-1 * var(--btn-distance));background-repeat:no-repeat;background-origin:border-box;scale:.8}.big-card-btn.prev{left:1em;right:revert;top:revert}.big-card-btn.next{left:calc(50% - var(--btn-width) / 2);left:revert;right:1em;top:revert}}@media (height<=750px) or (width<=1000px){header{padding-block:1em}header h1{transform-origin:0;font-size:var(--fs-normal);max-width:min-content;position:absolute;top:1em;left:1em}.sound{position:absolute;right:1em;scale:.75}}@media (height<=750px){#bigCard{scale:.9}}
