@layer mtb-base {
  body {
    font-family: var(--mtb-font-body);
    color: var(--mtb-text-strong);
    background: var(--mtb-bg-1);
    line-height: var(--mtb-lh-body);
  }

  .mtbg {
    font-family: var(--mtb-font-body);
    color: var(--mtb-text-strong);
  }

  .mtbg-glass {
    background: var(--mtb-glass-dark);
    backdrop-filter: var(--mtb-blur);
    border-radius: var(--mtb-radius-lg);
    border: var(--mtb-border-glass);
    box-shadow: var(--mtb-shadow-glass);
  }

  .mtbg-card {
    background: var(--mtb-bg-2);
    border-radius: var(--mtb-radius-md);
    box-shadow: var(--mtb-shadow-card);
    padding: var(--mtb-space-4);
  }

  .mtbg-gradient-border {
    border: 1px solid transparent;
    background:
      linear-gradient(var(--mtb-bg-1), var(--mtb-bg-1)) padding-box,
      var(--mtb-grad-teal-yellow) border-box;
    border-radius: var(--mtb-radius-md);
  }

  .mtbg-flex {
    display: flex;
    gap: var(--mtb-space-3);
    align-items: center;
  }

  .mtbg-section {
    padding: var(--mtb-space-6) 0;
  }

  /* Glass panel */
  .card-glass {
    background: var(--glass-bg-dark, var(--mtb-glass-dark));
    backdrop-filter: var(--glass-blur, var(--mtb-blur));
    border: 1px solid transparent;
    border-image: var(--glass-border-gradient, var(--mtb-grad-teal-orange)) 1;
    border-radius: var(--radius-lg, var(--mtb-radius-lg));
    padding: var(--space-md, var(--mtb-space-4));
    box-shadow: var(--elevation-shadow, var(--mtb-shadow-glass));
  }
}
