*{box-sizing:border-box}a,a:visited{color:inherit}img{display:block;max-width:100%;height:auto}figure{margin:0}.grid{--column-width: 240px;--align-items: start;--grid-gap: var(--mrg);display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--column-width),1fr));max-width:100%;gap:var(--grid-gap);row-gap:.75em;align-items:var(--align-items)}.grid>*{align-self:var(--align-self, inherit)}.grid img{width:100%}@media (min-width: 500px){.grid>*{grid-column:span var(--column-span, 1);grid-row:span var(--row-span, 1)}}.characterslist{margin:0;padding:0;font-size:2em;line-height:1.5}.characterslist>li{display:inline-block;position:relative}.characterslist>li:not(:last-child):after{content:", "}.characterslist>li span.creator{font-size:.5em;position:absolute;bottom:-10px;left:48px;display:block;text-wrap-mode:nowrap;opacity:.35}.character header{display:flex;align-items:center;justify-content:space-between}.pictogram{display:inline-block;width:var(--pictogram-size);height:var(--pictogram-size);vertical-align:middle;border:1px solid black;border-radius:50%}.flippable{display:grid;cursor:pointer}.flippable>*{grid-area:1 / 1}.flippable .back{opacity:0}.flippable.flipped>:not(.back){opacity:0}.flippable.flipped .back{opacity:1}:root{--mrg: .8rem;--pictogram-size: 1.25em}body{padding-inline:var(--mrg);margin:0;height:100svh;display:flex;flex-flow:column}body>main{flex-grow:2}body>footer{margin-block:var(--mrg)}a:hover{color:#00f}img[src*=gif]{width:100%}
