wall.css

html {
  font-family: monospace;
  font-size: max(1em, 1ch + 1vw + 1vh);
}

body {
  box-sizing: border-box;
  display: flex;
  flex-flow: column;
  line-height: 1.618;
  margin: auto;
  max-width: 100%;
  overflow-wrap: anywhere;
  padding: 0 1em;
}

header {
  contain: layout;
  display: flow-root;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-items: center;
}

.eq {
  contain: layout;
  display: flex;
  flex-flow: column;
  gap: 1.618em;
}

h1 { font-size: 2.618em }
h2 { font-size: 1.618em }
li { margin-block: 1em }

menu {
  contain: layout;
  list-style: none;
  line-height: 2.618;
}

main {
  margin: -2em 0 0;
  padding: 1em;
}

:any-link {
  box-sizing: border-box;
  display: inline-block;
  padding: 1ex 1ch;
  text-decoration-style: solid;
  text-decoration-thickness: .2rem;
}

:focus {
  outline: thick inset;
  text-decoration-skip-ink: all;
}

:any-link:hover {
  text-decoration-style: double;
}

.tide {
  contain: layout;
  display: block;
  margin-block: 1em;
  margin-inline: 0 auto;
  max-width: 20em;
}

.wave {
  contain: layout;
  font-size: 1.236em;
}

.wave > a {
  display: table;
  display: inline-flex;
  margin-bottom: 1em;
  padding: 3ex 1em;
}

.boost {
  text-shadow:
    0 -3vh 1ch,
    0 -2vh 0,
    0 -1vh 0;
}

.blab { font-size: 1em }
.blob { font-size: 1.618em }
.claw { padding: 2pt }
.bold { font-weight: bold }
.mold { font-weight: normal }
.fizz { padding-inline: 2em }
.fart { float: inline-start }
.raft { float: inline-end }