table { width: 100%; border-collapse: collapse; margin-top: 20px; }
    th { background: #e57373; color: white; padding: 10px; text-align: left; }
    td { padding: 10px; border: 1px solid #ddd; vertical-align: top; }
    .mnemonic { background: #fff8e1; padding: 10px; border-left: 4px solid #ffd54f; }
    .clinical { background: #e8f5e9; padding: 10px; border-left: 4px solid #81c784; }
    .aware { background: #e57373; padding: 10px; border-left: 4px solid #d63384; }

    .button-container { display: grid; grid-template-columns: repeat(12, 1fr); gap: 5px; margin-bottom: 20px; text-align: center; }
/*    .btn { background: #00897b; color: white; padding: 6px 10px; text-decoration: none; border-radius: 5px; font-size: 14px; }*/
    .btn { padding: 6px 10px; text-decoration: none; border-radius: 5px; font-size: 14px; }

    /* Tooltip enhancement */
    .tooltip-inner {
      max-width: 320px;
      text-align: left;
      background-color: #fffde7;
      color: #333;
      border: 1px solid #ffd54f;
      padding: 10px;
    }

    .btn-responsive, .btn-success {
      font-size: clamp(10px, 2.5vw, 15px) !important;
    }
    a[data-bs-toggle="tooltip"]::before {
      content: "#";
    }
    a[data-bs-toggle="tooltip"] {
      text-decoration: underline;
      color: darkred !important;
    }