html {
  font-size: 19px;
}
body {
      background-image: url('../gif/star_night.gif'); /* bạn có thể đổi URL gif khác */
      background-repeat: repeat;
      background-size: auto;  
      background-position: top left;

}
body, .side-menu, .marquee, td, th, a, .counter, input, button, .yahoo-box, .rainbow {
  font-family: 'Comic Neue', 'Comic Sans MS', Arial, cursive !important;
}
@media (max-width:600px) {
  .table-vintage, .table-vintage td, .table-vintage th {
    width: 100% !important;
    display: block !important;
    box-sizing: border-box;
    
  }
  .side-menu {
    width: 100% !important;
    display: block !important;
    margin-bottom: 15px;
  }
  .playlist, .counter, .yahoo-box, .chatroom, .mu-bxh, .audition-bxh {
    margin-bottom: 12px !important;
  }
}/* Gấp đôi font chữ khi mobile */

    /* ...các CSS còn lại giữ nguyên... */
    .marquee {
      color: #00ffef;
      font-size: 36px;
      font-family: Impact, Arial Black !important;
      text-shadow: 3px 3px 0 #f0f, 6px 6px 15px #0ff;
      border: 5px double #f0f;
      background: linear-gradient(90deg, #f0f 0%, #0ff 100%);
      padding: 6px 0;
      margin-bottom: 10px;
    }
    .blink { animation: blink 0.6s infinite; }
    @keyframes blink { 50% { opacity: 0; } }
    .rainbow {
      background: linear-gradient(90deg, red, orange, yellow, lime, cyan, blue, violet);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      font-size: 30px;
      font-weight:bolder ;
      /* font-family đã set ở trên cho chắc chắn */
    }
    .table-vintage {
      border: 5px ridge #ff0;
      background: #fff8e1;
      color: #000;
      width: 92%;
      margin: 0 auto 0 auto;
      box-shadow: 0 0 50px #ff0, 0 0 20px #f0f inset;
    }
    .side-menu {
      background: #00ffff url('../gif/sparkle.gif');
      color: #000;
      border: 2px dashed #f0f;
      padding: 8px;
    }
    .side-menu a {
      color: #d900ff !important;
      font-weight: bold;
      text-decoration: underline;
      text-shadow: 1px 1px 2px #ff0;
      display: block;
      margin: 7px 0;
    }
    .counter {
      color: #fff;
      background: #0f0 url('https://web.archive.org/web/20091026231222/http://www.geocities.com/rainforest/4703/ani_star.gif');
      padding: 4px 18px;
      border-radius: 16px;
      border: 2px groove #ff0;
      display: inline-block;
      margin: 9px;
      letter-spacing: 3px;
      box-shadow: 0 0 9px #0f0;
    }
    .yahoo-box {
      background: #eefffa;
      color: #000;
      border: 2px solid #ffd800;
      padding: 10px;
      margin: 9px 0;
      border-radius: 12px;
      box-shadow: 0 0 20px #0ff;
    }
    .yahoo-avatar {
      border: 2px solid #ff0;
      border-radius: 50%;
      width: 64px;
      vertical-align: middle;
      margin-right: 15px;
    }
    .yahoo-status {
      color: #00aaff;
      font-size: 16px;
      font-style: italic;
      display: inline-block;
      background: #fff;
      padding: 0 9px;
      border-radius: 9px;
      border: 1px dotted #0099ff;
      margin-left: 7px;
      margin-bottom: 7px;
    }
    .mu-bxh, .audition-bxh {
      width: 100%;
      border: 2px solid #f0f;
      background: #ffeedd;
      color: #b200ff;
      margin-top: 8px;
      margin-bottom: 10px;
      font-family: 'Courier New', monospace !important;
    }
    .mu-bxh th, .audition-bxh th {
      background: #ff0;
      color: #f00;
      font-size: 18px;
      padding: 2px 8px;
    }
    .mu-bxh td, .audition-bxh td { padding: 2px 6px; font-size:16px;}
    .audition-bxh td { color:#0099ff; }
    .chatroom {
      border: 2px solid #0ff;
      background: #001e4d url('https://web.archive.org/web/20091026231429/http://www.geocities.com/naildesigns4u/ieani.gif');
      color: #fff;
      font-size: 18px;
      margin: 8px 0 16px 0;
      border-radius: 7px;
      padding: 8px;
    }
    #trail { position:fixed; left:0; top:0; pointer-events:none; z-index:9999; }