.ghost-button {
    background-color: transparent;
    border-radius: 8px;
    border-width: 3px;
    border-style: solid;
    border-color: #ada387;
    color: #ada387;
    font-size: 20px;
    text-transform: uppercase;
  }

  .ghost-button-play {
    background-color: transparent;
    border-radius: 14px;
    border-width: 2px;
    border-style: solid;
    color: #6f8b6e;
    font-size: 14px;
    text-transform: uppercase;
  }

  /* optional subtle hover hint */
.ghost-button-play:hover{
  background-color:#dbcfb1;   /* 10 % tint */
}

/* “pressed / active” — fires while the button is physically down */
.ghost-button-play:active{
  background-color:#e6d9bd;   /* lighter green from your palette */
  color:#ada387;                 /* white text pops against lit bg  */
  box-shadow:inset 0 2px 4px rgba(0,0,0,.25);  /* slight emboss */
}

  .archive-button {
    background-color: transparent;
    border-radius: 8px;
    font-size: 18px;
    text-transform: uppercase;
    text-align: left;
  }

  .exit-button {
    position: absolute;
    top: -5px;
    left: 0px;
    border: solid 3px #ada387;
    border-radius: 2px;
    background-color: #eee1c4;
    color: #ada387;
    font-size: 24px;
    text-decoration: none; /* remove underline from link */
    cursor: pointer;
  }
  
  .exit-button:hover {
    background-color: #e0d2ab;
    color: #5c5c5c;
  }
  
  .hidden-button {
    display: none;
  }