:root {
  --bgcolor-main: rgb(255, 245, 190);
  --bgcolor-accent: steelblue;
  --bgcolor-accent-2: gold;
  --font-color-main: black;
  --font-color-accent-1: tomato; /* headers */
  --font-color-accent-2: steelblue; /* links, datetime */
  --font-color-accent-3: gold; /* link hover & focus */
  --text-shadow: white;
}

* {
  box-sizing: border-box;
}

/* d/l from https://www.fontspace.com/subspace-font-f54823
   designed by Neale Davidson http://www.pixelsagas.com */
@font-face {
  font-family: 'Subspace';
  font-weight: 400;
  src: url(../fonts/subspace-font-regular.woff2) format('woff2'),
       url(../fonts/subspace-font-regular.woff) format('woff');
}

body {
  background-color: var(--bgcolor-main);
  color: var(--font-color-main);
  font-family: monospace;
  font-size: 1.1rem;
}

.wrapper {
	max-inline-size: 1070px;
	margin-inline: auto;
}



nav ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  background-color: var(--bgcolor-accent);
}

nav ul li {
  padding-inline-end: 2rem;
  margin: .5rem;
  margin-inline-start: 2rem;
  color: white;
}

nav ul li a {
  color: white;
}

a {
  color: var(--font-color-accent-2);
}

a:hover,
a:focus-visible {
  text-decoration: underline overline var(--font-color-accent-2);
}

nav ul li a:hover,
nav ul li a:focus-visible {
  text-decoration: underline overline white;
}

h1 {
  font-family: 'Subspace';
  color: var(--font-color-accent-1);
  text-shadow: .1rem .1rem .125rem var(--text-shadow);
  letter-spacing: .4ch;
  font-size: 2.75rem;
}

h2 {
  font-family: 'Subspace';
  color: var(--font-color-accent-1);
  letter-spacing: .1ch;
  font-size: 2.1rem;
}

h3 {
  font-family: 'Subspace';
  color: var(--font-color-accent-1);
  font-size: 1.7rem;
  letter-spacing: .1ch;
  margin-block-end: 0;
  /* padding-block-start: 20px; */
}

p {
  margin-block-start: 10px;
}


.summary-season {
  display: inline-block;
}


/* on disco-rewatch.html - to get some room between episode bullet list and next episode's title (h3) */
.h3-padding > h3 {
  padding-block-start: 20px;
}


#s1e01, #s2e01, #s3e01, #s4e01, #s5e01 {
  padding-block-start: 0;
}


figcaption {
  font-size: .8rem;
}


.back-to-top-of-season {
  font-size: .8rem;
}


.footnotes {
  font-size: 1rem;
  border-block-start: .5px dotted;
}


footer {
	border-block-start: 1px solid var(--font-color-accent-2);
	margin-block-start: 50px;
}

time {
  font-size: .8rem;
  color: var(--font-color-accent-2);
  font-style: normal;
}

.posted {
  color: var(--font-color-main);
  font-style: italic;
  font-size: .8rem;
}


ul,
ol {
  margin-inline-start: 2rem;
}

ul.episodes ::marker {
  content: '🖖 ';
}


/* Tables */

th, td {
  text-align: start;
  padding-inline-end: 1rem;
}

th {
  background-color: var(--bgcolor-accent);
  font-family: monospace;
  color: white;
}

td {
  background-color: var(--bgcolor-main);
  filter: brightness(0.96);
}

td:is(:first-child) {
  color: var(--font-color-accent-2);
  font-weight: bold;
}


/* Idea derived from https://wiki.selfhtml.org/wiki/HTML/Tutorials/Listen/Gestaltung_mit_CSS#horizontale_Navigationsleiste */

li.negative:is(:last-child)::marker {
  content: '👎 ';
}


/* top button: https://www.w3schools.com/howto/howto_js_scroll_to_top.asp */

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  left: 30px;
  z-index: 99;
  font-size: 1em;
  border: none;
  outline: none;
  background-color: var(--bgcolor-accent);
  color: white;
  cursor: pointer;
  padding: .75em;
  border-radius: 0;
}

/* last updated: 24.03.2026 */