message: Add in basic size options for responsive sizing
diff: #toast-container > div { // stylelint-disable-line selector-max-id
  opacity: 1;
  }
  +
  +@media (max-width: 480px) {
  + :root {
  + --ratio: 1.2;
  + }
  +}
  +@media (min-width: 480px) and (max-width: 760px) {
  + :root {
  + --ratio: 1.414;
  + }
  +}
  +@media (min-width: 760px) {
  + :root {
  + --ratio: 1.5;
  + }
  +}
  +
  +:root {
  + --lineHeight: 1.5;
  + --baseFontSize: 112.5%;
  + --stepUp1: calc(1em * var(--ratio));
  + --stepUp2: calc(var(--stepUp1) * var(--ratio));
  + --stepUp3: calc(var(--stepUp2) * var(--ratio));
  + --stepDown1: calc(1em / var(--ratio));
  +}
  +
  +html {
  + font-size: var(--baseFontSize);
  +}
  +
  +h1 {
  + font-size: var(--stepUp3);
  +}
  +
  +h2 {
  + font-size: var(--stepUp2);
  +}
  +
  +h3 {
  + font-size: var(--stepUp1);
  +}
  +
  +small {
  + font-size: var(--stepDown1);
  +}
  