html{width:100%;height:100%;box-sizing:border-box}body{image-rendering:pixelated;image-rendering:crisp-edges;margin:0;padding:0;width:100%;height:100%;display:flex;flex-direction:column;font-size:16pt;font-family:'Roboto', 'Noto Sans', sans-serif}header,nav,footer{border:.25rem solid;border-color:#e78585 #b4493b #b4493b #e78585;background-color:#c95c5c;height:2rem;padding:.25rem;gap:.25rem;display:flex;align-items:center;justify-content:center}.icon{display:inline-block;vertical-align:middle;height:2rem;width:2rem;background-repeat:no-repeat;background-size:100%}main{background-color:#ffc0c0;flex:1 auto;position:relative;overflow:hidden}#character-list{display:grid;list-style:none;margin:0;padding:0;grid-template-columns:repeat(auto-fill, minmax(22.5%, 1fr));gap:2rem;flex:1 auto}#character-list li a{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:inherit;text-decoration:inherit;gap:0.25rem}#character-list li a p{margin:0;padding:0}#character-list li a img{width:100%;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0.25rem 0.25rem 0.5rem rgba(0,0,0,0.466667));transition:transform 0.5s, filter 0.55s;transition-timing-function:cubic-bezier(0.68, -0.55, 0.265, 1.55)}#character-list li a:hover img{transform:scale(125%);filter:drop-shadow(0.25rem 0.25rem 0.75rem rgba(0,0,0,0.266667));transition:transform .1s, filter .15s;transition-timing-function:cubic-bezier(0.25, 0.46, 0.45, 0.94)}#search-query{border:.25rem solid;border-color:#b4493b #ffc0c0 #ffc0c0 #b4493b;background-color:#fff;flex:1 auto;height:100%;display:block;box-sizing:border-box;font-size:100%}#search-button{border:.25rem solid;border-color:#e78585 #b4493b #b4493b #e78585;background-color:#c95c5c;background-image:url("/img/icons/search.svg");background-repeat:no-repeat;background-size:100%;aspect-ratio:1;height:100%}#search-button:active{border-color:#b4493b #ffc0c0 #ffc0c0 #b4493b}.tab{visibility:hidden;display:flex;flex-direction:column;padding:2rem 25%;margin:0 auto;position:absolute;top:0;left:0;right:0;bottom:0;overflow-y:scroll;overflow-x:hidden;box-sizing:border-box;opacity:0}.tab.shown{visibility:visible;opacity:1;transition:opacity .25s;transition-timing-function:cubic-bezier(0.47, 0, 0.745, 0.715)}#character-info{display:inline-flex;flex-direction:column}#character-info img{width:100%;max-height:50vh;object-fit:contain;padding:2rem;box-sizing:border-box}#character-info p{hyphens:auto}#character-info p:nth-child(2){font-size:300%;width:100%;padding:0;margin:0;text-align:center}#character-info table{min-width:50%;max-width:90%;flex:1 auto;margin:auto;box-sizing:border-box}#character-info table,#character-info table th,#character-info table td{border-collapse:collapse;text-align:left;padding:.5rem}nav ul{margin:0;padding:0;list-style:none;display:flex;gap:1rem;width:100%;height:100%}nav ul li{flex:1;height:100%}nav ul li a{height:100%;width:100%;user-select:none;box-sizing:border-box;border:.25rem solid;border-color:#e78585 #b4493b #b4493b #e78585;background-color:#c95c5c;color:inherit;text-decoration:inherit;display:flex;align-items:center;justify-content:center}nav ul li a.active{border-color:#b4493b #ffc0c0 #ffc0c0 #b4493b}.sr-only{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;user-select:none}@media screen and (orientation: portrait){body.mobile{font-size:5vw}body.mobile .tab{padding:2rem}body.mobile #character-info p:nth-child(2){font-size:150%}}@media screen and (orientation: landscape){body.mobile{font-size:5vh}body.mobile .tab{padding:2rem}body.mobile #character-info p:nth-child(2){font-size:150%}}