reef.css

.reef * {
  background-color: transparent;
  color: inherit;
}

.reef.reef {
  background-color: var(--reef);
  color: var(--free);
}

.tide.tide {
  color: var(--reef);
  background-color: var(--free);
}

.reef ::selection {
  background-color: violet;
  color: midnightblue;
}

.tide ::selection {
  background-color: powderblue;
  color: mediumblue;
}

.clam.clam,
.clam [class] {
  color: transparent;
}

.brine { filter: hue-rotate(-120deg) }
.trine { filter: hue-rotate(120deg) }

.flap { border-color: currentColor; }
.sponge { border-color: transparent; }
:root { --free: #302; --reef: aqua; }
.reef [href] { --free: aquamarine; --reef: indigo; }
.wrasse [href] { --free: aqua; --reef: rebeccapurple; }
.coral.coral { --free: #302; --reef: coral; }
.dream.dream { --free: aqua; --reef: rebeccapurple; }
.stony.stony { --free: silver; --reef: indigo; }
.wrasse.wrasse { --free: aquamarine; --reef: indigo; }