:root {
--common: grey;
--dark-bg: #131516;
--dark-fg: #98a3ad;
--epic: darkorchid;
--legendary: gold;
--light-bg: #292c2f;
--light-fg: #a1adb8;
--link: #4169e1;
--mythic: #f2a900;
--rare: cornflowerblue;
--search-bg: #b7b7b7;
--search-border: #aaaaaa;
--search-fg: #000000;
--uncommon: forestgreen;
}
html {
background-color: var(--dark-bg);
color: var(--dark-fg);
}
main {
margin: 0 auto;
max-width: 100%;
padding: 0 1rem 1rem;
width: 50rem;
}
h1 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
}
h1 a {
color: var(--light-fg);
}
h1 a:visited {
color: var(--light-fg);
}
iframe {
aspect-ratio: 1 / 1;
border: none;
}
a {
color: var(--link);
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a:visited {
color: var(--link);
}
dt {
font-weight: bold;
margin-top: 0.5rem;
}
nav {
align-items: center;
background-color: var(--light-bg);
display: flex;
gap: 1rem;
padding: 1rem;
}
nav > :first-child {