.mttq-panel.kit-flat {
  border: var(--border-panel);
  border-radius: var(--radius-md);
  background: linear-gradient(180deg, var(--color-panel-top), var(--color-panel) 28%, var(--alpha-deep-011435-97));
  box-shadow: none;
}

.mttq-panel.kit-flat > .panel__title {
  min-height: 2.5rem;
  padding-inline: 0.65rem;
  gap: 0.3rem;
  background: linear-gradient(90deg, var(--alpha-blue-21176139-64), var(--alpha-navy-052861-0));
  border-bottom: 0.06rem solid var(--alpha-blue-42165255-16);
}

.mttq-panel.kit-flat .panel__title-lineicon,
.mttq-panel.kit-flat .panel__title-lineicon svg {
  color: var(--color-yellow);
  filter: none;
}

.mttq-panel.kit-flat .panel__period {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.23rem 0.5rem;
  border: 0.06rem solid transparent;
  border-radius: 2rem;
  background: linear-gradient(180deg, var(--color-period-badge-top), var(--color-period-badge-bottom));
  color: var(--color-text);
  box-shadow: none;
}

.mttq-panel.kit-flat .panel__period svg {
  width: 0.9rem;
  height: 0.9rem;
  color: var(--color-text);
  filter: none;
}

.mttq-panel.kit-flat .module-body {
  margin: 0;
  padding: 0.15rem 0.5rem 0.4rem;
}

.mttq-panel.kit-flat .module-body > .grp {
  padding: 0;
  gap: 0.25rem;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.mttq-panel.kit-flat .grp--membership .membership__column-guide {
  grid-template-columns: minmax(0, 1fr) 6.2rem 5.1rem;
  gap: 0.3rem;
  padding: 0 0.3rem 0.1rem;
  border: 0;
  font-size: var(--text-md);
  color: var(--color-text);
}

.mttq-panel.kit-flat .grp--membership .membership__rows {
  gap: 0.08rem;
  grid-auto-rows: minmax(min-content, 1fr);
  align-content: stretch;
}

.mttq-panel.kit-flat .membership__column-guide span:nth-child(2) {
  color: var(--color-green);
}

.mttq-panel.kit-flat .grp--membership .membership__group-label {
  --group-tone: var(--color-yellow);
  margin: 0;
  padding: 0.08rem 0.5rem;
  border: 0.06rem solid transparent;
  border-left: 0.3rem solid var(--group-tone);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--group-tone) 8%, var(--color-panel));
  color: var(--color-text);
  font-size: var(--text-md);
  letter-spacing: 0.05em;
}

.mttq-panel.kit-flat .grp--membership .membership__row + .membership__group-label {
  --group-tone: var(--color-orange);
}

.mttq-panel.kit-flat .grp--membership .membership__group-label::after {
  height: 0.06rem;
  background: linear-gradient(90deg, color-mix(in srgb, var(--group-tone) 26%, transparent), transparent);
}

.mttq-panel.kit-flat .grp--membership .membership__row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 6.2rem 5.1rem;
  gap: 0.3rem;
  min-height: 0;
  isolation: isolate;
}

.mttq-panel.kit-flat .membership__row::before {
  content: "";
  position: absolute;
  inset: 0 5.4rem 0 0;
  z-index: -1;
  border: 0.06rem solid transparent;
  border-radius: var(--radius-md);
  background: var(--color-panel-strong);
}

.mttq-panel.kit-flat .grp--membership .membership__name {
  margin-left: 0.42rem;
  padding-left: 0.65rem;
  color: var(--color-text);
  font-size: var(--text-md);
  line-height: 1.08;
  white-space: normal;
  overflow: visible;
}

.mttq-panel.kit-flat .membership__name::before {
  width: 0.4rem;
  height: 0.4rem;
  background: var(--tone);
  box-shadow: none;
}

.mttq-panel.kit-flat .grp--membership .membership__numbers {
  align-items: center;
  align-self: stretch;
  padding: 0.02rem 0.25rem;
  min-width: 0;
  border: 0.06rem solid transparent;
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--tone) 9%, var(--color-panel));
}

.mttq-panel.kit-flat .grp--membership .membership__value {
  color: var(--color-text);
  font-size: var(--text-lg);
  line-height: 0.95;
}

.mttq-panel.kit-flat .grp--membership .membership__bar {
  grid-template-columns: minmax(0, 1fr) 3.4rem;
  height: 1.1rem;
  padding-right: 0.2rem;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

.mttq-panel.kit-flat .membership__bar::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  align-self: stretch;
  border-radius: 2rem;
  background: color-mix(in srgb, var(--color-blue) 32%, var(--color-bg-deep));
  box-shadow: inset 0 0.12rem 0.22rem color-mix(in srgb, var(--color-bg-deep) 80%, transparent);
}

.mttq-panel.kit-flat .membership__bar i {
  height: 85%;
  border-radius: 2rem;
}

.mttq-panel.kit-flat .grp--membership .membership__monthly {
  font-size: var(--text-md);
  color: var(--color-green);
  padding: 0;
}

.mttq-panel.kit-flat .grp--membership .membership__summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
  margin: 0 0 0.1rem;
  padding: 0;
  border: 0;
}

.mttq-panel.kit-flat .membership__hero-block {
  --hero-tone: var(--color-yellow);
  position: relative;
  display: grid;
  grid-template-columns: 1.35rem minmax(0, 1fr);
  align-content: center;
  align-items: center;
  gap: 0.1rem;
  min-height: 3rem;
  padding: 0.2rem;
  border: 0.06rem solid color-mix(in srgb, var(--hero-tone) 26%, transparent);
  border-radius: var(--radius-md);
  text-align: left;
  background: color-mix(in srgb, var(--hero-tone) 7%, var(--color-panel));
  box-shadow: none;
}

.mttq-panel.kit-flat .membership__hero-block--secondary {
  --hero-tone: var(--color-orange);
}

.mttq-panel.kit-flat .membership__hero-icon {
  display: flex;
  color: var(--hero-tone);
}

.mttq-panel.kit-flat .membership__hero-icon svg {
  width: 1.35rem;
  height: 1.6rem;
}

.mttq-panel.kit-flat .grp--membership .membership__hero-value {
  flex-wrap: nowrap;
  gap: 0.15rem;
  font-size: var(--text-kpi);
  background: linear-gradient(var(--color-white), var(--hero-tone));
  background-clip: text;
  -webkit-background-clip: text;
  filter: none;
}

.mttq-panel.kit-flat .membership__hero-value small {
  font-size: var(--text-md);
  color: var(--color-text);
}

.mttq-panel.kit-flat .grp--membership .membership__hero-label {
  grid-column: 1 / -1;
  color: var(--color-text);
  font-size: var(--text-md);
  line-height: 1.1;
}

.mttq-panel.kit-flat[data-mttq="membership"] .membership__row {
  grid-template-columns: minmax(0, 1fr) 9rem 5.1rem;
}

.mttq-panel.kit-flat[data-mttq="membership"] .membership__rows {
  gap: 0.15rem;
}