:root {
  --bg: mediumorchid;
  --fg: black;
  --title: mintcream;
}
* {
 box-sizing: border-box; 
 }
@font-face {
  font-family: "ancial";
  src: url(Ancial-Regular.otf); 
}
body {
  width: 90vw;
  max-width: 46ch;
  margin: auto;
  background-color: var(--bg);
  color: var(--fg);
  font-size: x-large;
  opacity: 0.9; 
}
dt::before {
   content: "📔 "; 
}
dt {
  margin: 1.5rem 0;
  border-style: solid solid dashed solid; 
  border-radius: 1rem 1rem 0 0;
  padding: 2rem 1rem; 
  background: white;
  opacity: 0.7;
}
dt:hover {
  background-color: var(--bg);
}
a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline dashed;
}
img {
  max-width: 20ch;
  border-radius: 0.2em;
}
h1 {
  color: var(--title);
  font-family: ancial, serif;
  font-size: 5rem;
}
blockquote {
  margin-left: 0;
  color: var(--title);
  padding-left: 1rem;
  border-left: 8px dotted var(--title);
  font-style: oblique;
}