
    .activity-tabs-wrap {
      background: #fff;
      border: 1px solid #e8edf5;
      border-radius: 16px;
      padding: 8px;
      margin-bottom: 14px;
    }
    .activity-tabs {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    .activity-tab-btn {
      border: 0;
      background: #f5f8ff;
      color: #274069;
      border-radius: 999px;
      padding: 8px 14px;
      font-size: 13px;
      font-weight: 700;
      transition: all .2s ease;
      display: inline-flex;
      align-items: center;
      gap: 7px;
    }
    .activity-tab-btn .tab-count {
      font-weight: 700;
      color: #6b7280;
      font-size: 12px;
    }
    .activity-tab-btn.active {
      background: linear-gradient(135deg, #3f5fd4 0%, #5c6bd8 100%);
      color: #fff;
      box-shadow: 0 8px 22px rgba(63, 95, 212, 0.25);
    }
    .activity-tab-btn.active .tab-count {
      color: #e8ecff;
    }
    .activity-login-hint {
      background: linear-gradient(100deg, #fff6e7 0%, #fff 60%, #f7fbff 100%);
      border: 1px solid #ffe4bd;
      border-radius: 16px;
      padding: 32px 16px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 14px;
    }
    .activity-login-hint .left {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }
    .activity-login-hint .left i {
      color: #ff8a2b;
      font-size: 20px;
      flex: 0 0 auto;
    }
    .activity-login-hint .title {
      margin: 0;
      color: #1f2a44;
      font-weight: 700;
      font-size: 15px;
      line-height: 1.2;
    }
    .activity-login-hint .sub {
      margin: 2px 0 0;
      color: #67758f;
      font-size: 12px;
      line-height: 1.35;
    }
    .activity-login-hint .go {
      width: 36px;
      height: 36px;
      border-radius: 999px;
      border: 0;
      background: #ffe8c9;
      color: #d76e12;
      font-size: 15px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      flex: 0 0 auto;
    }
    .activity-panel {
      display: none;
    }
    .activity-panel.active {
      display: block;
    }
    .activity-page-shell {
      width: 100%;
    }
    .activity-loader {
      text-align: center;
      padding: 52px 0;
    }
    .activity-empty {
      text-align: center;
      padding: 58px 0;
      color: #6b7280;
      display: none;
    }
    .activity-empty i {
      font-size: 42px;
      color: #c5cbd8;
      margin-bottom: 10px;
    }
    #nearYouSection {
      background: linear-gradient(135deg, #fff8ee 0%, #fff 52%, #f8fbff 100%);
      border: 1px solid #ffe7cc;
      border-radius: 18px;
      padding: 14px;
      margin-top: 16px;
      display: none;
    }
    #nearYouSection .near-title-wrap {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }
    #nearYouStatus {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 5px 10px;
      border-radius: 999px;
      background: #fff;
      border: 1px solid #e6eef8;
      color: #355070;
      font-size: 12px;
      font-weight: 600;
    }
    #nearYouStatus.status-warn {
      color: #9a6700;
      border-color: #ffe3b3;
      background: #fffaf0;
    }
    #nearYouStatus.status-ok {
      color: #0f5132;
      border-color: #b7e4c7;
      background: #f3fff7;
    }
    @media (max-width: 767.98px) {
      .activity-page-shell {
        margin-top: 0 !important;
      }
      .activity-tabs-wrap {
        padding: 6px;
        border-radius: 14px;
      }
      .activity-tab-btn {
        padding: 8px 11px;
        font-size: 12px;
      }
      #nearYouSection {
        padding: 12px;
        border-radius: 16px;
      }
    }
