* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Times New Roman', serif; color: black; }
  
  body { 
     font-family: "DotGothic16", sans-serif;
  }
  
  .space { 
  height:60vw;   
   width:95vw;
  border:1px solid blue;
  padding:2em;
       /* whatever width you want */
  font-family: "DotGothic16", sans-serif;
    }
    
    audio { border:1px solid black; border-radius: 50px;
  background-color: blue; }
  
  button {
    border: 1px solid blue;
    background: yellow;
    color: blue;
  }
    
  #scene { flex: 1; display: flex; align-items: center; justify-content: space-evenly; border:1px solid blue; width:100%; height:100%;}
  #dialogue { background:yellow; width: 100%;  padding: 12px 16px; display: flex; align-items: center; gap: 12px; min-height: 10%; margin: 1em; margin-top:0; margin-left:0;top:-130px; position:relative;z-index:0;}
  #dialogue p { flex: 1; font-size: 1em; line-height: 1.5;  font-family: "DotGothic16", sans-serif;}
  #speaker-name { background:blue; color:white; padding:0.3em; margin:1em; margin-bottom:0;  margin-top:0; width: min-content; white-space: nowrap;font-family: "DotGothic16", sans-serif; font-size:0.8em; top:-120px; position:relative;z-index:2;}