/* 共通: 各下層ページ(ポイント購入/プラン公開/的中実績/マイページ変更/実績報告NOTE/AI指数/チャット)用コンポーネント。mypage.cssのデザイン言語(変数・カード・角丸・グラスモーフィズム)に揃える */

.mp-page-head {
  margin: 0 0 1.4rem;
  text-align: center;
}

.mp-page-head__eyebrow {
  display: inline-flex;
  padding: 0.35rem 1.1rem;
  border-radius: 999px;
  background: var(--pale-violet);
  color: #4a3f73;
  font-size: 1.05rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.mp-page-head__title {
  margin: 0.6rem 0 0;
  color: #4c56b8;
  font-size: clamp(1.7rem, 4.2vw, 2.6rem);
  font-weight: 900;
  line-height: 1.3;
}

.mp-page-head__lead {
  margin: 0.5rem 0 0;
  color: var(--muted);
  font-size: 1.15rem;
  font-weight: 700;
}

.mp-balance {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  margin: 0 0 1.4rem;
  padding: 0.7rem 1.4rem;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0.4rem 1rem rgba(36, 51, 66, 0.08);
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--muted);
}

.mp-balance strong {
  color: #ff385c;
  font-size: 1.35em;
}

/* タブ切替 */
.mp-tabs {
  display: flex;
  justify-content: center;
  gap: 0.7rem;
  margin: 0 0 1.6rem;
  flex-wrap: wrap;
}

.mp-tabs button {
  padding: 0.7rem 1.6rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--muted);
  font-size: 1.35rem;
  font-weight: 900;
  font-family: inherit;
  cursor: pointer;
  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.mp-tabs button.is-active {
  background: var(--violet);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 0.5rem 1.2rem rgba(114, 136, 224, 0.32);
}

/* 的中実績の絞り込み用スイッチャー */
.mp-tabs--switcher {
  display: flex;
  width: min(100%, 44rem);
  margin: 0 auto 1.6rem;
  padding: 0.35rem;
  gap: 0;
  flex-wrap: nowrap;
  border: 0;
  border-radius: 12px;
  background: #e2e2e2;
}

.mp-tabs--switcher button {
  flex: 1;
  min-width: 0;
  padding: 1.1rem 0.85rem;
  border: 0;
  border-radius: 9px;
  background: transparent;
  font-size: 1.2rem;
  line-height: 1.2;
}

.mp-tabs--switcher button.is-active {
  background: var(--violet);
  color: #fff;
  box-shadow: 0 0.3rem 0.8rem rgba(114, 136, 224, 0.32);
}

.mp-tabs--switcher button[data-filter="all"].is-active {
  background: #626262;
  color: #fff;
  box-shadow: 0 0.3rem 0.8rem rgba(98, 98, 98, 0.32);
}

.mp-tabs--switcher button[data-filter="central"].is-active {
  background: #91b13e;
  color: #fff;
  box-shadow: 0 0.3rem 0.8rem rgba(145, 177, 62, 0.32);
}

.mp-tabs--switcher button[data-filter="local"].is-active {
  background: #7288E0;
  color: #fff;
  box-shadow: 0 0.3rem 0.8rem rgba(114, 136, 224, 0.32);
}

.mp-tabs--switcher button[data-filter="central"]:not(.is-active) {
  color: #91b13e;
}

.mp-tabs--switcher button[data-filter="local"]:not(.is-active) {
  color: #7288E0;
}

.mp-tabs--switcher button:not(.is-active):hover {
  color: var(--violet);
}

.mp-tabs--switcher button[data-filter="all"]:not(.is-active):hover {
  color: #626262;
}

.mp-tabs--switcher button[data-filter="central"]:not(.is-active):hover {
  color: #91b13e;
}

.mp-tabs--switcher button[data-filter="local"]:not(.is-active):hover {
  color: #7288E0;
}

[data-kind][hidden] {
  display: none !important;
}

.mp-hit-card {
  --hit-main: #7288E0;
  --hit-pale: #eceffe;
  --hit-shadow: rgba(114, 136, 224, 0.28);
  position: relative;
  display: grid;
  grid-template-columns: minmax(11.8rem, 42%) 2.8rem minmax(0, 1fr);
  min-height: 14rem;
  border-radius: 1.8rem;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 1px 2px rgba(0, 0, 0, 0.35);
}

.mp-hit-card__media {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border-radius: 1.8rem 0 0 1.8rem;
  background: var(--hit-pale);
}

.mp-hit-card__media img {
  width: 100%;
  height: 100%;
  min-height: 14rem;
  object-fit: cover;
  display: block;
}

.mp-hit-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(21, 28, 43, 0.02), rgba(21, 28, 43, 0.22));
  pointer-events: none;
}

.mp-hit-card__region {
  position: absolute;
  right: 0.8rem;
  top: 0.8rem;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.6rem;
  padding: 0 1rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--hit-main) 88%, #000);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 0.45rem 1.1rem rgba(18, 24, 38, 0.28);
}

.mp-hit-card__ribbon {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  margin-top: -0.6rem;
  padding: 0.4rem 0;
  width: 2.8rem;
  height: calc(100% + 0.7rem);
  background-color: var(--hit-main);
  color: #fff;
  box-shadow: 0.5rem 0 1rem var(--hit-shadow), -0.4rem 0 1rem rgba(20, 27, 45, 0.14);
}

.mp-hit-card__ribbon::before,
.mp-hit-card__ribbon::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}

.mp-hit-card__ribbon::before {
  top: 0;
  right: -0.6rem;
  border-right: 0.6rem solid transparent;
  border-bottom: 0.6rem solid color-mix(in srgb, var(--hit-main) 55%, #000);
}

.mp-hit-card__ribbon::after {
  bottom: -0.8rem;
  left: 0;
  border-left: 1.4rem solid var(--hit-main);
  border-right: 1.4rem solid var(--hit-main);
  border-bottom: 0.8rem solid transparent;
}

.mp-hit-card__ribbon span {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  max-height: 11rem;
  overflow: hidden;
  white-space: nowrap;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.15;
}

.mp-hit-card__body {
  position: relative;
  display: grid;
  align-content: center;
  gap: 0.45rem;
  min-width: 0;
  overflow: hidden;
  border-radius: 0 1.8rem 1.8rem 0;
  padding: 6.65rem 1.3rem 1.05rem 1.1rem;
  text-align: center;
  background:
    linear-gradient(rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.28)),
    url("../../img/bg_chuou.jpg") center / 175% auto no-repeat,
    #fff;
}

.mp-hit-card__body::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.04));
  pointer-events: none;
}

.mp-hit-card__body > * {
  position: relative;
  z-index: 1;
}

.mp-hit-card__date {
  position: absolute;
  left: 1rem;
  top: 0.9rem;
  margin: 0;
  padding: 0.2rem 0.8rem;
  border-radius: 999px;
  background: var(--hit-pale);
  color: var(--hit-main);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1.25;
}

.mp-hit-card__race {
  position: absolute;
  left: 2rem;
  top: 3.55rem;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  color: #30384a;
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1.2;
}

.mp-hit-card__race-no {
  display: inline-grid;
  place-items: center;
  min-width: 2.8rem;
  height: 2.2rem;
  padding: 0 0.5rem;
  border-radius: 0.3rem;
  background: #1f2530;
  color: #fff;
  font-size: 1.35rem;
  line-height: 1;
}

.mp-hit-card__race-r {
  margin-left: -0.1rem;
}

.mp-hit-card__title {
  justify-self: center;
  width: 100%;
  max-width: 100%;
  margin: 0 0 0.1rem;
  overflow: hidden;
  color: #30384a;
  font-size: 1.55rem;
  font-weight: 900;
  line-height: 1.25;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mp-hit-card__payout {
  margin: 0;
  color: #b07700;
  font-size: clamp(2rem, 6.2vw, 2.85rem);
  font-weight: 900;
  line-height: 1.05;
  white-space: nowrap;
}

.mp-hit-card__detail {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem;
  margin-top: 0.75rem;
}

.mp-hit-card__detail span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.3rem;
  padding: 0 0.85rem;
  border: 1px solid color-mix(in srgb, var(--hit-main) 58%, #fff);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.9);
  color: #626976;
  font-size: 1.18rem;
  font-weight: 900;
  line-height: 1;
}

.mp-hit-card[data-kind="central"] .mp-hit-card__payout {
  color: #7d6910;
}

.mp-hit-card[data-kind="local"] .mp-hit-card__body {
  background:
    linear-gradient(rgba(255, 255, 255, 0.28), rgba(255, 255, 255, 0.28)),
    url("../../img/bg_chihou.jpg") center / 175% auto no-repeat,
    #fff;
}

.mp-hit-card[data-kind="local"] .mp-hit-card__payout {
  color: #4b5a94;
}

@media (max-width: 767px) {
  .mp-tabs--switcher button {
    padding-inline: 0.3rem;
    font-size: 1.5rem !important;
  }
}

/* お知らせ・案内バナー */
.mp-banner-note {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  margin: 0 0 1.6rem;
  padding: 1.1rem 1.3rem;
  border: 1px solid rgba(255, 255, 255, 0.9);
  border-radius: 1.6rem;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 0.5rem 1.3rem rgba(36, 51, 66, 0.06);
  color: var(--ink);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.6;
}

.mp-banner-note__icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 50%;
  background: var(--pale-violet);
  color: #4a3f73;
  font-size: 1.2rem;
  font-weight: 900;
}

.mp-banner-note strong {
  color: #4c56b8;
}

/* ステータスタグ */
.mp-status-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.3rem 0.9rem;
  border-radius: 999px;
  font-size: 1rem;
  font-weight: 900;
  white-space: nowrap;
}

.mp-status-tag--sale {
  background: #ffe3a8;
  color: #6e4e00;
}

.mp-status-tag--top {
  background: #ffd1dc;
  color: #8a1f3c;
}

.mp-status-tag--soldout {
  background: rgba(36, 51, 66, 0.78);
  color: #fff;
}

/* ポイント購入リスト */
.mp-point-list {
  display: grid;
  gap: 0.9rem;
}

.mp-point-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 1.3rem;
  border: 1px solid rgba(255, 255, 255, 0.96);
  border-radius: 1.6rem;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 0.5rem 1.2rem rgba(36, 51, 66, 0.05);
  transition: box-shadow 180ms ease;
}

.mp-point-row:hover {
  box-shadow: 0 0.9rem 2rem rgba(36, 51, 66, 0.1);
}

.mp-point-row--best {
  border-color: var(--pink);
  background: linear-gradient(180deg, #fff 0%, var(--pale-pink) 100%);
}

.mp-point-row__pt {
  display: flex;
  align-items: baseline;
  gap: 0.3rem;
  color: #ff385c;
  font-size: 1.7rem;
  font-weight: 900;
}

.mp-point-row__pt span {
  font-size: 0.6em;
  font-weight: 800;
}

.mp-point-row__price {
  color: var(--ink);
  font-size: 1.3rem;
  font-weight: 800;
  white-space: nowrap;
}

.mp-point-row__buy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 9.6rem;
  min-height: 4.2rem;
  padding: 0 1.4rem;
  border: 0;
  border-radius: 1.1rem;
  background: linear-gradient(180deg, #6f9bf0, #3f6fd6);
  color: #fff;
  font-size: 1.25rem;
  font-weight: 900;
  box-shadow: 0 0.5rem 1.1rem rgba(63, 111, 214, 0.32);
  cursor: pointer;
}

/* 的中実績・実績報告NOTE カード */
.mp-result-list {
  display: grid;
  gap: 1.2rem;
}

.mp-result-card {
  display: flex;
  gap: 1rem;
  padding: 1.2rem;
  border: 1px solid rgba(255, 255, 255, 0.96);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 0.6rem 1.4rem rgba(36, 51, 66, 0.05);
}

.mp-result-card__badge {
  flex: none;
  display: grid;
  place-items: center;
  width: 5.4rem;
  height: 5.4rem;
  border-radius: 1.2rem;
  background: linear-gradient(180deg, #ff8aa0, #ff6a86);
  color: #fff;
  font-size: 1.05rem;
  font-weight: 900;
  text-align: center;
  line-height: 1.25;
  box-shadow: 0 0.5rem 1.1rem rgba(255, 119, 150, 0.32);
}

.mp-result-card__body {
  flex: 1;
  min-width: 0;
}

.mp-result-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 0.5rem;
  color: var(--muted);
  font-size: 1.05rem;
  font-weight: 800;
}

.mp-result-card__title {
  margin: 0 0 0.5rem;
  font-size: 1.4rem;
  font-weight: 900;
  line-height: 1.35;
}

.mp-result-card__race {
  margin: 0;
  color: var(--ink);
  font-size: 1.1rem;
  font-weight: 700;
}

.mp-result-card__payout {
  margin: 0.5rem 0 0;
  color: #ff385c;
  font-size: 1.45rem;
  font-weight: 900;
}

/* 実績報告NOTE: コメント・返信 */
.mp-note-card {
  padding: 1.3rem;
  border: 1px solid rgba(255, 255, 255, 0.96);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 0.6rem 1.4rem rgba(36, 51, 66, 0.05);
}

.mp-note-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.6rem;
  margin: 0 0 0.7rem;
  color: var(--muted);
  font-size: 1.05rem;
  font-weight: 800;
}

.mp-note-card__user {
  color: #4c56b8;
  font-weight: 900;
}

.mp-note-card__plan {
  display: inline-flex;
  margin: 0 0 0.7rem;
  padding: 0.3rem 0.9rem;
  border-radius: 999px;
  background: var(--pale-violet);
  color: #4a3f73;
  font-size: 1rem;
  font-weight: 900;
  text-decoration: none;
}

.mp-note-card__race {
  margin: 0 0 0.5rem;
  color: var(--ink);
  font-size: 1.1rem;
  font-weight: 700;
}

.mp-note-card__payout {
  margin: 0 0 0.7rem;
  color: #ff385c;
  font-size: 1.3rem;
  font-weight: 900;
}

.mp-note-card__comment {
  margin: 0;
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.7;
}

.mp-note-card__reply {
  margin-top: 1rem;
}

.mp-note-card__reply summary {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #5566cf;
  font-size: 1.1rem;
  font-weight: 900;
  cursor: pointer;
  list-style: none;
}

.mp-note-card__reply textarea {
  display: block;
  width: 100%;
  min-height: 7rem;
  margin: 0.8rem 0 0.6rem;
  padding: 0.9rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  font: inherit;
  font-size: 1.1rem;
  resize: vertical;
}

/* ページネーション */
.mp-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin: 1.8rem 0 0;
  flex-wrap: wrap;
}

.mp-pagination button {
  width: 3.8rem;
  height: 3.8rem;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: var(--ink);
  font-size: 1.2rem;
  font-weight: 900;
  font-family: inherit;
  cursor: pointer;
}

.mp-pagination button[aria-current="page"] {
  background: var(--violet);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 0.5rem 1.1rem rgba(114, 136, 224, 0.32);
}

/* AI指数 */
.mp-index-legend {
  display: flex;
  justify-content: center;
  gap: 1.4rem;
  margin: 0 0 1.4rem;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 800;
}

.mp-index-legend span {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.mp-index-dot {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
}

.mp-index-dot--high { background: #ff6a86; }
.mp-index-dot--mid { background: #ffb648; }
.mp-index-dot--base { background: #b9c2cf; }

.mp-race-card {
  margin: 0 0 1.4rem;
  padding: 1.3rem;
  border: 1px solid rgba(255, 255, 255, 0.96);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 0.6rem 1.4rem rgba(36, 51, 66, 0.05);
}

.mp-race-card__head {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 1rem;
}

.mp-race-card__no {
  flex: none;
  display: grid;
  place-items: center;
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 1rem;
  background: var(--violet);
  color: #fff;
  font-size: 1.3rem;
  font-weight: 900;
}

.mp-race-card__course {
  margin: 0 0 0.2rem;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 800;
}

.mp-race-card__title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 900;
}

.mp-race-card__time {
  margin: 0.2rem 0 0;
  color: var(--muted);
  font-size: 1.05rem;
  font-weight: 700;
}

.mp-index-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 0.6rem;
}

.mp-index-table th {
  padding: 0 0.6rem 0.4rem;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 800;
  text-align: left;
}

.mp-index-table td {
  padding: 1rem 0.6rem;
  background: var(--soft);
  font-size: 1.2rem;
  font-weight: 800;
}

.mp-index-table tr td:first-child {
  border-radius: 1rem 0 0 1rem;
  text-align: center;
  color: var(--muted);
}

.mp-index-table tr td:last-child {
  border-radius: 0 1rem 1rem 0;
  text-align: right;
  color: #ff385c;
  font-size: 1.4rem;
}

.mp-risk-note {
  margin: 1.6rem 0 0;
  padding: 1rem 1.2rem;
  border-radius: 1.4rem;
  background: rgba(36, 51, 66, 0.06);
  color: var(--muted);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
}

/* フォーム (会員情報変更) */
.mp-form-card {
  padding: 1.4rem 1.4rem 1.6rem;
  border: 1px solid rgba(255, 255, 255, 0.96);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 0.6rem 1.4rem rgba(36, 51, 66, 0.05);
}

.mp-account-summary {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.7rem;
  margin: 0 0 1.6rem;
}

.mp-account-summary div {
  padding: 0.9rem 0.5rem;
  border-radius: 1rem;
  background: var(--soft);
  text-align: center;
}

.mp-account-summary span {
  display: block;
  color: var(--muted);
  font-size: 0.95rem;
  font-weight: 800;
}

.mp-account-summary strong {
  display: block;
  margin-top: 0.3rem;
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 900;
  overflow-wrap: anywhere;
}

.mp-field {
  display: block;
  margin: 0 0 1.3rem;
  color: var(--ink);
  font-size: 1.15rem;
  font-weight: 800;
}

.mp-field span {
  display: block;
  margin: 0 0 0.5rem;
}

.mp-field input,
.mp-field select {
  display: block;
  width: 100%;
  min-height: 4.6rem;
  padding: 0 1.1rem;
  border: 1px solid var(--line);
  border-radius: 1rem;
  background: #fff;
  font: inherit;
  font-size: 1.15rem;
}

.mp-field--readonly input {
  background: var(--soft);
  color: var(--muted);
}

.mp-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 5rem;
  margin-top: 0.4rem;
  border: 0;
  border-radius: 1.2rem;
  background: linear-gradient(180deg, #ff8aa0, #ff6a86);
  color: #fff;
  font-size: 1.3rem;
  font-weight: 900;
  box-shadow: 0 0.6rem 1.3rem rgba(255, 119, 150, 0.32);
  cursor: pointer;
}

/* チャット */
.mp-chat {
  display: flex;
  flex-direction: column;
  height: min(64vh, 56rem);
  border: 1px solid rgba(255, 255, 255, 0.96);
  border-radius: 1.8rem;
  background: rgba(255, 255, 255, 0.99);
  box-shadow: 0 0.6rem 1.4rem rgba(36, 51, 66, 0.05);
  overflow: hidden;
}

.mp-chat__log {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 1.4rem;
  overflow-y: auto;
}

.mp-chat__bubble {
  max-width: 80%;
  padding: 0.9rem 1.2rem;
  border-radius: 1.3rem;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.6;
}

.mp-chat__bubble--staff {
  align-self: flex-start;
  background: var(--soft);
  color: var(--ink);
  border-radius: 1.3rem 1.3rem 1.3rem 0.3rem;
}

.mp-chat__bubble--me {
  align-self: flex-end;
  background: var(--violet);
  color: #fff;
  border-radius: 1.3rem 1.3rem 0.3rem 1.3rem;
}

.mp-chat__time {
  display: block;
  margin-top: 0.4rem;
  font-size: 0.85rem;
  font-weight: 700;
  opacity: 0.6;
}

.mp-chat__form {
  display: flex;
  gap: 0.7rem;
  padding: 1rem;
  border-top: 1px solid var(--line);
  background: #fff;
}

.mp-chat__form input {
  flex: 1;
  min-height: 4.6rem;
  padding: 0 1.2rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  font: inherit;
  font-size: 1.1rem;
}

.mp-chat__form button {
  flex: none;
  min-width: 6rem;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff8aa0, #ff6a86);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 900;
  cursor: pointer;
}

.mp-chat__hours {
  margin: 1rem 0 0;
  text-align: center;
  color: var(--muted);
  font-size: 1rem;
  font-weight: 700;
}

@media (max-width: 600px) {
  .mp-point-row {
    grid-template-columns: 1fr;
    gap: 0.6rem;
    text-align: center;
  }
  .mp-account-summary {
    grid-template-columns: 1fr;
  }
  .mp-result-card {
    flex-direction: column;
  }
  .mp-result-card__badge {
    width: 100%;
    height: 3.6rem;
  }
}