html { display:flex; justify-content:center; }
  body { background:#C6C6C6; color:#111; font-size:1.5vw; 
      font-family: serif; text-align:center;
      -webkit-column-break-inside:avoid; }
  a { color:#000; font-weight:bold; }
  ul { list-style-position:inside; padding-left:1em; text-indent:-1em; }
  ul li { margin-bottom:0.2em; }
  img { border:none; }
  div,textarea { max-width:100%; }

  .offstage { position:absolute; top:-10px; left:-10px; overflow:hidden;
      height:1px; width:1px;}
  div#intro { font-family: sans; margin: 0em auto 1em auto; }
  div#upper { margin: 1em auto 1em auto; font-family: sans; width:100%; 
      margin-bottom:0.5em; background:#C6C6C6; position:sticky; top:0px; }
  div#upper textarea { border:1px solid black; width:24em; padding:0.5em;
      font-family:serif; text-align:left; resize:none; height:1em;
      background:white; margin:auto; font-size:100%; }

  #lower { justify-content:center; padding:0; margin:auto; 
      border-collapse:collapse; }
  #lower tr { border:1px solid black; background:white; }
  #lower td { padding:0.3em; }
  .dandy_label { font-family:sans; text-align:right; }
  .dandy_out { padding:0 1em 0 1em; min-width:20em; }
  .dandy_button { font-family:sans; text-align:left; }
  .utf16warn { font-size:67%; text-align:left; }

  #discordant_output { font-size:67%; }

  div#credits { margin:1em auto 1em auto; font-size:12px; }

/* iphones are special kids */
@media only screen and (max-device-width: 480px) {
    html { -webkit-text-size-adjust:100%; }
}