/* add-to-cart modal — weight all NORMAL */
.myro-atc.is-hidden { display: none; }

.myro-atc { position: fixed; inset: 0; z-index: var(--z-modal, 1300); }
.myro-atc__backdrop {
  position: absolute; inset: 0;
  background: rgba(17,24,39,.45);
  opacity: 0; transition: opacity var(--dur, .2s) var(--ease, ease);
}
.myro-atc__dialog {
  position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -46%) scale(.98);
  width: min(560px, calc(100vw - 24px));
  background: var(--c-bg, #fff);
  border-radius: var(--radius-xl, 24px);
  box-shadow: var(--shadow-lg, 0 16px 40px rgba(0,0,0,.12));
  padding: var(--space-5, 20px) var(--space-5, 20px) var(--space-4, 16px);
  opacity: 0;
  transition: transform .22s var(--ease, ease), opacity .22s var(--ease, ease);
}
.myro-atc.is-open .myro-atc__backdrop { opacity: 1; }
.myro-atc.is-open .myro-atc__dialog  { opacity: 1; transform: translate(-50%, -50%) scale(1); }

.myro-atc__close {
  position: absolute; right: 10px; top: 8px; width: 32px; height: 32px;
  border: none; background: transparent; font-size: 22px; cursor: pointer;
  color: var(--c-fg-muted, #6b7280);
}

/* 見出し・本文も全てノーマル */
.myro-atc__head {
  font-weight: var(--fw-semibold, 600);
  font-size: var(--fs-base, 16px);
  margin: 4px 28px 12px 4px;
  line-height: var(--lh-tight, 1.3);
}

.myro-atc__body { display: flex; gap: var(--space-4, 16px); align-items: center; }
.myro-atc__media {
  width: 96px; height: 96px; border-radius: var(--radius-md, 10px);
  overflow: hidden; background: var(--c-bg-muted, #f9fafb); flex: 0 0 auto;
}
.myro-atc__thumb { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 2px !important; }

.myro-atc__meta  { display: grid; gap: 6px; min-width: 0; }
.myro-atc__title {
  font-weight: var(--fw-regular, 400);
  line-height: var(--lh-base, 1.7);
  font-size: var(--fs-14, 14px);
}
.myro-atc__variant {
  color: var(--c-fg-muted, #6b7280);
  font-size: var(--fs-14, 14px);
  font-weight: var(--fw-regular, 400);
}
.myro-atc__price {
  font-weight: var(--fw-regular, 400);
}

/* 注意書きもノーマル */
.myro-atc__notice {
  margin: 14px 0 12px;
  font-size: var(--fs-12, 12px);
  color: var(--c-danger, #ef4444);
  font-weight: var(--fw-regular, 400);
}

.myro-atc__actions { display: flex; gap: 10px; justify-content: center; margin-top: 20px; }

/* ボタンもノーマルウェイトに */
.myro-atc__actions .btn-primary {
  padding: 10px 22px;
  border-radius: var(--radius-md, 10px);
  background: var(--c-fg, #1a1a1a);
  color: var(--c-fg-inverse, #fff);
  text-decoration: none;
  font-weight: var(--fw-regular, 400);
  font-size: var(--fs-14, 14px);
}

.myro-atc__actions .btn-ghost {
  padding: 10px 18px;
  border-radius: var(--radius-md, 10px);
  background: var(--c-surface, #f3f4f6);
  color: var(--c-fg, #1a1a1a);
  border: 1px solid var(--c-border, #e5e7eb);
  cursor: pointer;
  font-weight: var(--fw-regular, 400);
  font-size: var(--fs-14, 14px);
}

/* ATCサムネイルの角丸を2pxに統一 */
.myro-atc__media {
  border-radius: 2px !important;
  overflow: hidden; /* 角丸を確実に反映 */
}
.myro-atc__thumb {
  border-radius: 2px !important;
}