.txn-wrap {
              margin: 0 0 18px;
              font-family: 'digital_sans_ef_medium', Arial, Helvetica, sans-serif;
            }
      
            .txn-title {
              text-align: center;
              font-size: 18px;
              font-weight: 700;
              letter-spacing: .5px;
              margin: 0 0 14px;
              color: #ffbb00;
            }
      
            .txn-section {
              display: grid;
              grid-template-columns: 1fr 1fr;
              gap: 16px;
            }
      
            .txn-panel {
              background: linear-gradient(160deg, #1c0c0e 0%, #0c0506 100%);
              border: 1px solid rgba(212, 175, 55, .4);
              border-radius: 14px;
              overflow: hidden;
              box-shadow: 0 2px 10px rgba(212, 175, 55, .10);
            }
      
            .txn-head {
              display: flex;
              align-items: center;
              gap: 8px;
              padding: 12px 16px;
              font-size: 14px;
              font-weight: 700;
              letter-spacing: .5px;
              color: #f3e7c0;
              border-bottom: 1px solid rgba(240, 187, 12, 0.25);
              background: rgba(176, 38, 38, .10);
            }
      
            .txn-ico {
              font-size: 12px;
            }
      
            .txn-deposit .txn-ico {
              color: #1e9e57;
            }
      
            .txn-withdraw .txn-ico {
              color: #d4af37;
            }
      
            .txn-live {
              margin-left: auto;
              font-size: 10px;
              font-weight: 700;
              color: #1e9e57;
              display: inline-flex;
              align-items: center;
              gap: 5px;
            }
      
            .txn-live::before {
              content: "";
              width: 7px;
              height: 7px;
              border-radius: 50%;
              background: #2ecc71;
              box-shadow: 0 0 6px #2ecc71;
              animation: txnPulse 1.4s infinite;
            }
      
            @keyframes txnPulse {
      
              0%,
              100% {
                opacity: 1
              }
      
              50% {
                opacity: .3
              }
            }
      
            .txn-list {
              list-style: none;
              margin: 0;
              padding: 4px 0;
              overflow: hidden;
            }
      
            .txn-row {
              display: flex;
              align-items: center;
              gap: 10px;
              padding: 8px 16px;
              border-bottom: 1px dashed rgba(212, 175, 55, .18);
              animation: txnIn .5s ease;
            }
      
            .txn-row:last-child {
              border-bottom: none;
            }
      
            @keyframes txnIn {
              from {
                opacity: 0;
                transform: translateY(-10px);
              }
      
              to {
                opacity: 1;
                transform: translateY(0);
              }
            }
      
            .txn-avatar {
              flex: 0 0 30px;
              width: 30px;
              height: 30px;
              border-radius: 50%;
              display: flex;
              align-items: center;
              justify-content: center;
              font-size: 12px;
              font-weight: 700;
              color: #fff;
            }
      
            .txn-deposit .txn-avatar {
              background: linear-gradient(135deg, #2ecc71, #1e9e57);
            }
      
            .txn-withdraw .txn-avatar {
              background: linear-gradient(135deg, #f5d77a, #d4af37);
              color: #5a4500;
            }
      
            .txn-meta {
              min-width: 0;
              flex: 1;
            }
      
            .txn-id {
              font-size: 13px;
              font-weight: 700;
              color: #ece6d6;
              overflow: hidden;
              text-overflow: ellipsis;
              white-space: nowrap;
            }
      
            .txn-sub {
              font-size: 11px;
              color: #9a937e;
            }
      
            .txn-amt {
              font-weight: 800;
              font-size: 14px;
              white-space: nowrap;
            }
      
            .txn-deposit .txn-amt {
              color: #1e9e57;
            }
      
            .txn-withdraw .txn-amt {
              color: #bf941f;
            }
      
            @media (max-width: 600px) {
              .txn-section {
                grid-template-columns: 1fr;
              }
            }