/* Mboka Pocket — Freedom T2.R19 */

#view-trajectory .mp-r19-launch {
  border: 1px solid rgba(98,220,158,.35);
  background: #176747;
  color: #effff6;
  border-radius: 11px;
  padding: 10px 13px;
  font-weight: 750;
  font-size: 12px;
  min-height: 38px;
  cursor: pointer;
}

#view-trajectory .mp-r19-launch:hover {
  background: #208057;
}

.mp-r19-shell[hidden] {
  display: none !important;
}

.mp-r19-shell {
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  background: rgba(1,13,9,.89);
  color: #eafff1;
  display: flex;
  justify-content: center;
  overflow-y: auto;
  overscroll-behavior: contain;
  color-scheme: dark;
  font-family: inherit;
}

.mp-r19-shell *,
.mp-r19-shell *::before,
.mp-r19-shell *::after {
  box-sizing: border-box;
}

.mp-r19-page {
  background: #0b2018;
  width: min(100%,1050px);
  min-height: 100%;
  padding: 26px clamp(13px,4vw,38px);
  border-inline: 1px solid rgba(121,212,166,.15);
}

.mp-r19-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 19px;
}

.mp-r19-kicker {
  display: block;
  margin-bottom: 8px;
  font-size: 10px;
  letter-spacing: .13em;
  font-weight: 800;
  color: #7fe7ae;
}

.mp-r19-header h2 {
  margin: 0;
  color: #f0fff7;
  font-size: clamp(21px,3vw,30px);
  line-height: 1.2;
}

.mp-r19-header p,
.mp-r19-section-head p {
  color: #a3c6b5;
  font-size: 12px;
  line-height: 1.5;
  margin: 7px 0 0;
}

.mp-r19-shell button,
.mp-r19-shell select {
  font: inherit;
}

.mp-r19-close,
.mp-r19-refresh {
  background: #173c2d;
  color: #eafff2;
  border: 1px solid rgba(128,213,169,.25);
  border-radius: 10px;
  min-height: 37px;
  padding: 8px 12px;
  cursor: pointer;
}

.mp-r19-close {
  font-size: 19px;
  min-width: 42px;
}

.mp-r19-shell button:focus-visible,
.mp-r19-shell select:focus-visible {
  outline: 2px solid #85f0b9;
  outline-offset: 3px;
}

.mp-r19-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  background: #102e22;
  border: 1px solid rgba(128,213,169,.12);
  padding: 12px;
  border-radius: 13px;
  color: #b9ddc9;
  font-size: 12px;
}

.mp-r19-section {
  border: 1px solid rgba(128,213,169,.16);
  border-radius: 17px;
  background: #10291f;
  margin-top: 15px;
  padding: 18px;
}

.mp-r19-section h3 {
  font-size: 16px;
  color: #edfff4;
  margin: 0 0 13px;
}

.mp-r19-metrics {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
}

.mp-r19-four {
  grid-template-columns: repeat(4,minmax(0,1fr));
}

.mp-r19-metric {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  padding: 14px;
  border-radius: 13px;
  border: 1px solid rgba(112,202,152,.17);
  background: #16372a;
}

.mp-r19-metric span {
  font-size: 11px;
  color: #b8d6c7;
}

.mp-r19-metric strong {
  font-size: clamp(16px,2.5vw,23px);
  color: #f0fff6;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}

.mp-r19-metric small,
.mp-r19-disclaimer {
  font-size: 10px;
  line-height: 1.6;
  color: #a4cab6;
}

.mp-r19-disclaimer {
  margin: 12px 0 0;
}

.mp-r19-wallets {
  display: grid;
  gap: 7px;
  margin-top: 12px;
}

.mp-r19-wallet-row,
.mp-r19-tx {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid rgba(122,204,160,.12);
  background: #112e22;
  border-radius: 11px;
  padding: 12px;
}

.mp-r19-wallet-row > div,
.mp-r19-tx-left {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.mp-r19-wallet-row strong,
.mp-r19-tx-left strong {
  color: #ebfff3;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.mp-r19-wallet-row small,
.mp-r19-tx-left small {
  color: #a8cab8;
  font-size: 10px;
}

.mp-r19-wallet-value,
.mp-r19-tx-value {
  font-size: 13px;
  color: #effff4;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.mp-r19-tx-value.income {
  color: #6ce5a0;
}

.mp-r19-tx-value.expense {
  color: #ffb1a2;
}

.mp-r19-tx-value.transfer {
  color: #b5dcff;
}

.mp-r19-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 11px;
  margin-bottom: 13px;
}

.mp-r19-section-head h3 {
  margin-bottom: 0;
}

.mp-r19-filter-label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: #b7d7c6;
  font-size: 11px;
}

.mp-r19-filter-label select {
  border: 1px solid #426b55;
  border-radius: 9px;
  padding: 8px;
  background: #173c2c;
  color: #f0fff5;
}

.mp-r19-transactions {
  display: grid;
  gap: 7px;
}

.mp-r19-empty {
  text-align: center;
  color: #bed7c7;
  padding: 20px;
  border: 1px dashed #375b47;
  border-radius: 10px;
}

.mp-r19-footer {
  text-align: center;
  padding: 22px 8px 8px;
  color: #9cbba9;
  font-size: 11px;
}

@media (max-width: 740px) {
  .mp-r19-page {
    padding: 15px 12px 32px;
  }

  .mp-r19-four {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .mp-r19-section {
    padding: 12px;
  }

  .mp-r19-metric {
    padding: 11px;
  }
}

@media (max-width: 380px) {
  .mp-r19-metric strong {
    font-size: 15px;
  }

  .mp-r19-wallet-value,
  .mp-r19-tx-value {
    font-size: 11px;
  }
}