:root {
  --mk-bg: #fbfefe;
  --mk-soft: #eef9f7;
  --mk-soft-2: #f5faf9;
  --mk-text: #1f2d38;
  --mk-muted: #687783;
  --mk-line: #d9ece9;
  --mk-primary: #4fc7b7;
  --mk-primary-dark: #2b8d89;
  --mk-pink: #f7b8c8;
  --mk-yellow: #ffd86b;
  --mk-danger: #ef5d5d;
  --mk-shadow: 0 18px 45px rgba(36, 109, 116, 0.12);
  --mk-shadow-sm: 0 8px 30px rgba(36, 109, 116, 0.07);
  --mk-radius: 8px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scrollbar-color: var(--mk-primary) var(--mk-soft);
  scrollbar-width: thin;
}

/* 与本地预览保持一致：桌面端滚动条使用品牌薄荷色，避免线上默认灰色滚动条显得突兀。 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--mk-soft);
}

::-webkit-scrollbar-thumb {
  border-radius: 4px;
  background: var(--mk-primary);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--mk-primary-dark);
}

body {
  margin: 0;
  background: var(--mk-bg);
  color: var(--mk-text);
  font-family: "Geist", "Inter", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  line-height: 1.5;
}

img {
  display: block;
  max-width: 100%;
}

.mk-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
a[href],
select,
summary {
  cursor: pointer;
}

.mk-container {
  width: calc(100% - 32px);
  max-width: 1180px;
  margin: 0 auto;
}

.mk-page {
  min-height: 100vh;
  overflow: hidden;
}

.mk-page--soft {
  background: var(--mk-soft-2);
}

.mk-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  height: 76px;
  border-bottom: 1px solid transparent;
  background: transparent;
  transition: background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.mk-header.is-scrolled,
.mk-header.is-menu-open {
  border-color: rgba(217, 236, 233, 0.8);
  background: rgba(251, 254, 254, 0.92);
  box-shadow: 0 8px 28px rgba(31, 45, 56, 0.07);
  backdrop-filter: blur(18px);
}

.mk-header__inner {
  display: flex;
  height: 76px;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.mk-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 24px;
  font-weight: 900;
  color: var(--mk-primary-dark);
}

.mk-logo img {
  display: none;
  height: 28px;
  width: auto;
}

.mk-logo span {
  display: inline-flex;
}

.mk-nav {
  display: flex;
  align-items: center;
  gap: 4px;
}

.mk-nav a {
  border-radius: var(--mk-radius);
  padding: 10px 14px;
  color: rgba(31, 45, 56, 0.8);
  font-size: 14px;
  font-weight: 700;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mk-nav a:hover,
.mk-nav a.is-active {
  background: #e0f7f4;
  color: var(--mk-primary-dark);
  transform: translateY(-2px);
}

.mk-nav a.is-active {
  background: transparent;
  transform: none;
}

.mk-header__actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mk-icon-link,
.mk-menu-button {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(79, 199, 183, 0.32);
  border-radius: var(--mk-radius);
  background: #fff;
  color: var(--mk-primary-dark);
}

.mk-icon-link svg {
  width: 20px;
  height: 20px;
}

.mk-account-link {
  min-height: 34px;
  border-radius: var(--mk-radius);
  background: var(--mk-primary);
  padding: 8px 14px;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  box-shadow: 0 14px 26px rgba(79, 199, 183, 0.22);
}

.mk-menu-button {
  display: none;
  flex-direction: column;
  gap: 4px;
}

.mk-menu-button span {
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.mk-hero {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding: 108px 0 72px;
  background:
    linear-gradient(135deg, rgba(79, 199, 183, 0.13), rgba(255, 255, 255, 0.92) 48%, rgba(247, 184, 200, 0.16)),
    linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 216, 107, 0.08));
}

.mk-hero::before,
.mk-shop-hero::before {
  content: "";
  position: absolute;
  inset: -18% -12%;
  opacity: 0.7;
  background:
    linear-gradient(112deg, transparent 0 18%, rgba(79, 199, 183, 0.14) 30%, transparent 46%, rgba(247, 184, 200, 0.13) 68%, transparent 86%),
    repeating-linear-gradient(90deg, rgba(79, 199, 183, 0.08) 0 1px, transparent 1px 96px);
  pointer-events: none;
}

.mk-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  align-items: center;
  gap: 48px;
  grid-template-columns: 0.95fr 1.05fr;
}

.mk-hero__title,
.mk-hero h1 {
  margin: 24px 0 0;
  font-size: clamp(42px, 6vw, 72px);
  font-weight: 900;
  line-height: 1.05;
}

.mk-hero__title span,
.mk-hero__title strong {
  display: block;
}

.mk-hero__title strong {
  color: var(--mk-primary-dark);
}

.mk-hero__desc,
.mk-hero p,
.mk-inner-hero p,
.mk-heading p,
.mk-muted {
  color: var(--mk-muted);
}

.mk-hero__desc {
  max-width: 600px;
  margin: 24px 0 0;
  font-size: 18px;
  line-height: 1.75;
}

.mk-hero__media img {
  width: 100%;
  min-height: 360px;
  object-fit: contain;
  filter: drop-shadow(0 28px 36px rgba(41, 127, 124, 0.18));
}

.mk-float {
  animation: mk-float 6s ease-in-out infinite;
}

@keyframes mk-float {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-14px) rotate(1.2deg); }
}

.mk-eyebrow {
  isolation: isolate;
  position: relative;
  display: inline-flex;
  width: fit-content;
  align-items: center;
  border-radius: 999px;
  background: rgba(79, 199, 183, 0.15);
  padding: 8px 14px;
  color: var(--mk-primary-dark);
  font-size: 14px;
  font-weight: 800;
}

.mk-eyebrow[data-index]::before {
  content: attr(data-index);
  position: absolute;
  bottom: -8px;
  left: 50%;
  z-index: -1;
  color: rgba(79, 199, 183, 0.1);
  font-size: 96px;
  font-weight: 900;
  line-height: 1;
  transform: translateX(-50%);
  pointer-events: none;
}

.mk-eyebrow--number {
  margin-bottom: 0;
}

.mk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.mk-actions--center,
.mk-center {
  justify-content: center;
  text-align: center;
}

.mk-btn {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: var(--mk-radius);
  padding: 11px 20px;
  font-weight: 800;
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.mk-btn:hover {
  transform: translateY(-3px);
}

.mk-btn--primary {
  background: var(--mk-primary);
  color: #fff;
  box-shadow: 0 16px 30px rgba(79, 199, 183, 0.22);
}

.mk-btn--primary:hover {
  background: var(--mk-primary-dark);
}

.mk-btn--ghost {
  border-color: rgba(79, 199, 183, 0.35);
  background: #fff;
  color: var(--mk-primary-dark);
}

.mk-btn--light {
  background: #fff;
  color: var(--mk-primary-dark);
}

.mk-btn--outline-light {
  border-color: rgba(255, 255, 255, 0.4);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

.mk-mini-features,
.mk-shop-promises,
.mk-service-row,
.mk-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 30px;
}

.mk-mini-features span,
.mk-shop-promises span,
.mk-service-row span,
.mk-tags span {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid var(--mk-line);
  padding: 8px 12px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 700;
}

.mk-mini-features span {
  gap: 8px;
  border: 0;
  background: transparent;
  padding: 0;
}

.mk-mini-features svg {
  width: 16px;
  height: 16px;
  color: var(--mk-primary-dark);
}

.mk-tags span {
  background: var(--mk-primary);
  border-color: var(--mk-primary);
  color: #fff;
}

.mk-section {
  padding: 96px 0;
  background: var(--mk-bg);
}

.mk-section--soft {
  background: linear-gradient(180deg, #fff, rgba(79, 199, 183, 0.08));
}

.mk-section--compact {
  padding: 56px 0;
}

.mk-app-section {
  background: var(--mk-soft);
}

.mk-heading {
  max-width: 720px;
  margin-bottom: 48px;
}

.mk-heading--feature {
  display: grid;
  width: fit-content;
  max-width: 100%;
  align-items: center;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0 28px;
  margin: 0 0 64px clamp(48px, 10vw, 180px);
  border-bottom: 1px solid rgba(79, 199, 183, 0.4);
  padding-bottom: 20px;
  text-align: left;
}

.mk-heading--feature-reverse {
  grid-template-columns: minmax(0, 1fr) auto;
  margin-right: auto;
  margin-left: auto;
}

.mk-heading--feature-reverse .mk-eyebrow {
  order: 2;
}

.mk-heading--center {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.mk-heading h2,
.mk-section h2,
.mk-inner-hero h1 {
  margin: 0;
  font-size: clamp(30px, 4.6vw, 54px);
  font-weight: 900;
  line-height: 1.15;
}

.mk-split,
.mk-two-col {
  display: grid;
  align-items: center;
  gap: 56px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.mk-two-col {
  align-items: start;
}

.mk-card-media,
.mk-product-card,
.mk-feature,
.mk-partner-card,
.mk-account-card,
.mk-contact-panel,
.mk-form,
.mk-faq-card,
.mk-proof-card,
.mk-cert-card,
.mk-recognition-card,
.mk-list-card,
.mk-post {
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  box-shadow: var(--mk-shadow-sm);
}

.mk-card-media {
  overflow: hidden;
}

.mk-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 首页核心科技图在预览里是稳定 16:9 横图，单独限定比例，避免图片原始尺寸把整段撑得过高。 */
.mk-card-media--core {
  aspect-ratio: 16 / 9;
  box-shadow: var(--mk-shadow);
}

.mk-card-media--core img {
  object-position: center 62%;
}

.mk-card-media--app {
  box-shadow: var(--mk-shadow);
}

.mk-card-media--shop-hero {
  aspect-ratio: 478 / 191;
  box-shadow: var(--mk-shadow);
}

.mk-card-media--shop-hero img {
  object-position: center;
}

.mk-feature-list {
  display: grid;
  gap: 14px;
}

.mk-feature {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  padding: 18px;
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.mk-feature:hover,
.mk-product-card:hover,
.mk-partner-card:hover,
.mk-cert-card:hover,
.mk-recognition-card:hover,
.mk-account-card:hover {
  border-color: rgba(79, 199, 183, 0.45);
  box-shadow: var(--mk-shadow);
  transform: translateY(-6px);
}

.mk-feature b {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: #e0f7f4;
  color: var(--mk-primary-dark);
  font-weight: 900;
}

.mk-feature h3,
.mk-product-card h3,
.mk-partner-card h3 {
  margin: 0 0 6px;
}

.mk-partner-card h3 {
  margin-top: 16px;
  font-size: 20px;
  font-weight: 900;
}

.mk-feature p,
.mk-product-card p,
.mk-partner-card p,
.mk-icon-grid p {
  margin: 0;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.7;
}

.mk-product-grid {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mk-product-card {
  position: relative;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.mk-product-card > a,
.mk-product-card__image,
.mk-product-card__media-link {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  background: linear-gradient(140deg, #f6fbfa, #dff3f0);
}

.mk-product-card img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 20px;
  transition: transform 0.3s ease;
}

.mk-product-card:hover img {
  transform: scale(1.05);
}

.mk-product-card > div:not(.mk-product-card__image),
.mk-product-card > a + div,
.mk-product-card__body {
  padding: 18px;
}

.mk-product-card span,
.mk-product-card__badge {
  display: inline-flex;
  width: fit-content;
  border-radius: 999px;
  background: #e0f7f4;
  padding: 5px 10px;
  color: var(--mk-primary-dark);
  font-size: 12px;
  font-weight: 900;
}

.mk-product-card .mk-product-card__badge {
  position: absolute;
  z-index: 2;
  top: 12px;
  left: 12px;
  background: var(--mk-primary);
  color: #fff;
}

.mk-product-card .mk-product-card__badge--pink {
  background: var(--mk-pink);
  color: #653344;
}

.mk-product-card__tags {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  max-width: calc(100% - 24px);
}

.mk-product-card .mk-product-card__tag {
  padding: 4px 8px;
}

.mk-product-card .mk-product-card__tag--primary {
  background: var(--mk-primary);
  color: #fff;
}

.mk-product-card .mk-product-card__tag--yellow {
  background: var(--mk-yellow);
  color: #6b5212;
}

.mk-product-card__title:hover {
  color: var(--mk-primary);
}

.mk-product-card__body {
  display: grid;
  gap: 0;
}

.mk-product-card__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
}

.mk-product-card__price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 0;
}

.mk-product-card__price strong {
  color: var(--mk-primary-dark);
  font-size: 24px;
  font-weight: 900;
}

.mk-product-card__price s {
  color: #98a5ad;
}

.mk-product-card__button {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border-radius: var(--mk-radius);
  background: var(--mk-primary);
  padding: 8px 14px;
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  transition: background 0.2s ease, transform 0.2s ease;
}

.mk-product-card__button:hover {
  background: var(--mk-primary-dark);
  transform: translateY(-2px);
}

.mk-center {
  display: flex;
  margin-top: 40px;
}

.mk-icon-grid {
  display: grid;
  gap: 16px;
  margin-top: 28px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

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

.mk-icon-grid article {
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 22px;
}

.mk-icon-grid article > svg {
  width: 32px;
  height: 32px;
  margin-bottom: 12px;
  color: var(--mk-primary);
}

.mk-icon-grid b {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
}

.mk-cta {
  background: linear-gradient(145deg, var(--mk-primary-dark), var(--mk-primary));
  padding: 88px 0;
  color: #fff;
  text-align: center;
}

.mk-cta h2 {
  margin: 0;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.15;
}

.mk-cta p {
  max-width: 680px;
  margin: 16px auto 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 18px;
}

.mk-stats {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 52px;
}

.mk-stats article {
  text-align: center;
}

.mk-stats strong {
  display: block;
  font-size: clamp(34px, 4vw, 52px);
  font-weight: 900;
  line-height: 1;
}

.mk-stats span {
  display: block;
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.75);
  font-size: 14px;
  font-weight: 700;
}

.mk-stats--cards {
  margin-top: 56px;
}

.mk-stats--cards article {
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: rgba(255, 255, 255, 0.82);
  padding: 28px 18px;
  box-shadow: var(--mk-shadow-sm);
}

.mk-stats--cards strong {
  color: var(--mk-primary-dark);
}

.mk-stats--cards span {
  color: var(--mk-muted);
}

.mk-inner-hero {
  position: relative;
  padding: 172px 0 72px;
  background: linear-gradient(180deg, rgba(79, 199, 183, 0.12), rgba(79, 199, 183, 0.03));
}

.mk-partner-hero {
  overflow: hidden;
  padding-top: 232px;
  padding-bottom: 80px;
  background: linear-gradient(180deg, rgba(79, 199, 183, 0.12) 0%, rgba(79, 199, 183, 0.06) 50%, rgba(79, 199, 183, 0.02) 100%);
}

.mk-partner-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top right, rgba(79, 199, 183, 0.08), transparent 60%);
  pointer-events: none;
}

.mk-partner-hero > .mk-container {
  position: relative;
  z-index: 1;
}

.mk-partner-hero .mk-center {
  display: flex;
  max-width: 900px;
  flex-direction: column;
  align-items: center;
  margin-top: 0;
  text-align: center;
}

.mk-partner-hero h1 {
  max-width: 900px;
  font-size: clamp(32px, 5vw, 56px);
  line-height: 1.12;
  text-wrap: balance;
}

.mk-partner-hero p {
  max-width: 680px;
  margin: 16px auto 0;
  text-align: center;
}

.mk-inner-hero p {
  max-width: 760px;
  margin: 18px auto 0;
  font-size: 18px;
  line-height: 1.75;
}

.mk-shop-hero {
  min-height: auto;
  padding-top: 132px;
  padding-bottom: 64px;
}

.mk-shop-hero .mk-hero__grid {
  gap: clamp(28px, 5vw, 68px);
  grid-template-columns: minmax(320px, 1.1fr) minmax(260px, 0.8fr);
}

.mk-shop-hero h1 {
  max-width: 460px;
  margin-top: 0;
  font-size: clamp(26px, 2.8vw, 38px);
}

.mk-shop-hero p {
  margin-top: 12px;
  font-size: 15px;
}

.mk-shop-hero h1 span,
.mk-shop-hero h1 strong {
  display: block;
}

.mk-shop-hero h1 span {
  color: var(--mk-text);
}

.mk-shop-hero h1 strong {
  color: var(--mk-primary);
}

.mk-shop-promises span {
  gap: 10px;
  padding: 10px 16px;
  color: var(--mk-text);
  font-weight: 800;
}

.mk-shop-promises svg {
  width: 18px;
  height: 18px;
  color: var(--mk-primary);
}

.mk-shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 32px;
}

.mk-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.mk-filter--segments {
  display: inline-flex;
  gap: 4px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 6px;
}

.mk-filter--segments a {
  min-height: 36px;
  border-radius: var(--mk-radius);
  padding: 8px 18px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 800;
  transition: background 0.2s ease, color 0.2s ease;
}

.mk-filter--segments a:hover,
.mk-filter--segments a.is-active {
  background: var(--mk-primary);
  color: #fff;
}

.mk-input,
.mk-search-form input,
.mk-form input,
.mk-form textarea {
  min-height: 42px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 10px 14px;
  color: var(--mk-text);
  font: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mk-input:focus,
.mk-search-form input:focus,
.mk-form input:focus,
.mk-form textarea:focus {
  border-color: var(--mk-primary);
  box-shadow: 0 0 0 4px rgba(79, 199, 183, 0.15);
}

.mk-view-switch {
  display: inline-flex;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 6px;
}

.mk-view-switch button {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  padding: 0;
  color: var(--mk-muted);
  font-weight: 800;
}

.mk-view-switch svg {
  width: 18px;
  height: 18px;
}

.mk-view-switch button.is-active {
  background: var(--mk-primary);
  color: #fff;
}

.mk-shop-products.is-list {
  grid-template-columns: 1fr;
}

.mk-shop-products.is-list .mk-product-card {
  display: grid;
  grid-template-columns: 220px 1fr;
}

.mk-shop-products.is-list .mk-product-card__media-link {
  height: 100%;
  min-height: 220px;
}

.mk-shop-empty {
  display: grid;
  justify-items: center;
  gap: 12px;
  border: 1px dashed rgba(79, 199, 183, 0.38);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 44px 24px;
  text-align: center;
}

.mk-shop-empty h2,
.mk-shop-empty p {
  margin: 0;
}

.mk-shop-empty p {
  color: var(--mk-muted);
}

.mk-banner-grid {
  display: grid;
  gap: 16px;
  margin-top: 56px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mk-banner-grid img {
  width: 100%;
  height: 176px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  object-fit: cover;
}

.mk-pagination {
  display: flex;
  min-height: 48px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 32px;
}

.mk-pagination__number {
  min-width: 40px;
  min-height: 40px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 8px 12px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 900;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.mk-pagination__number:hover,
.mk-pagination__number.is-active {
  border-color: var(--mk-primary);
  background: var(--mk-primary);
  color: #fff;
}

.mk-pagination__number:disabled {
  cursor: default;
}

.mk-pagination__summary {
  margin-left: 4px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 800;
}

.mk-product-detail {
  padding: 232px 0 32px;
  background: var(--mk-soft-2);
}

.mk-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 28px;
  color: var(--mk-muted);
  font-size: 14px;
}

.mk-breadcrumb a,
.mk-breadcrumb span:last-child {
  color: inherit;
}

.mk-breadcrumb span:last-child {
  color: var(--mk-text);
}

.mk-breadcrumb a:hover {
  color: var(--mk-primary-dark);
}

.mk-product-detail__grid {
  display: grid;
  align-items: stretch;
  gap: 40px;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.mk-product-gallery {
  min-width: 0;
}

.mk-product-gallery__main {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid var(--mk-line);
  border-radius: 16px;
  background: #fff;
}

.mk-product-gallery__main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 32px;
}

.mk-product-gallery__arrow {
  position: absolute;
  top: 50%;
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  padding: 8px;
  color: var(--mk-text);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  transform: translateY(-50%);
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mk-product-gallery__arrow:hover {
  background: #fff;
  color: var(--mk-primary-dark);
  transform: translateY(calc(-50% - 2px));
}

.mk-product-gallery__arrow svg {
  width: 20px;
  height: 20px;
}

.mk-product-gallery__arrow--prev {
  left: 16px;
}

.mk-product-gallery__arrow--next {
  right: 16px;
}

.mk-product-gallery__thumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
}

.mk-product-gallery__thumbs button {
  width: 80px;
  height: 80px;
  border: 2px solid var(--mk-line);
  border-radius: 12px;
  background: transparent;
  overflow: hidden;
  transition: border-color 0.2s ease, transform 0.2s ease;
}

.mk-product-gallery__thumbs button:hover,
.mk-product-gallery__thumbs button.is-active {
  border-color: var(--mk-primary);
}

.mk-product-gallery__thumbs button:hover {
  transform: translateY(-2px);
}

.mk-product-gallery__thumbs img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}

.mk-product-buy {
  display: flex;
  height: min(570px, calc(50vw - 36px));
  min-height: 0;
  min-width: 0;
  flex-direction: column;
}

.mk-product-buy .mk-tags {
  gap: 8px;
  margin-top: 0;
}

.mk-product-buy .mk-tags span {
  border: 0;
  background: var(--mk-primary);
  padding: 4px 12px;
  color: #fff;
  font-weight: 900;
  line-height: 1.4;
}

.mk-product-buy h1 {
  margin: 16px 0 8px;
  font-size: 30px;
  font-weight: 900;
  line-height: 1.2;
}

.mk-product-buy > p {
  margin: 0;
  color: var(--mk-muted);
  font-size: 18px;
  line-height: 1.65;
}

.mk-product-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin-top: 14px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 700;
}

.mk-product-price-slot {
  min-height: 41px;
  margin-top: 20px;
}

.mk-product-price-slot:empty {
  display: none;
}

.mk-product-buy .mk-product-price-slot .buy-box__price-value {
  display: inline-flex;
  align-items: baseline;
  gap: 12px;
  color: var(--mk-primary-dark);
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
}

.mk-product-buy .mk-product-price-slot .buy-box__price-value del {
  color: #98a5ad;
  font-size: 18px;
  font-weight: 700;
}

.mk-service-row--icons {
  gap: 18px;
  margin-top: 20px;
}

.mk-service-row--icons span {
  gap: 7px;
  border: 0;
  background: transparent;
  padding: 0;
}

.mk-service-row--icons svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  color: var(--mk-primary);
}

.mk-product-sku-slot:empty {
  display: none;
}

.mk-product-buy shop-buy-box {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  margin-top: 14px;
}

/* Halo 商城购买盒子由插件输出，这里只做品牌视觉覆盖，不改变表单、SKU、CSRF 和支付链路。 */
.mk-product-buy .buy-box {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}

.mk-product-buy .buy-box__spec {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.mk-product-buy .buy-box__spec-label {
  color: var(--mk-text);
  font-weight: 800;
}

.mk-product-buy .buy-box__spec-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.mk-product-buy .buy-box__spec-option {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 10px 16px;
  color: var(--mk-text);
  font: inherit;
  font-weight: 800;
  line-height: 1.3;
  text-align: center;
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mk-product-buy .buy-box__spec-option:hover:not(:disabled) {
  border-color: rgba(79, 199, 183, 0.55);
  background: rgba(224, 247, 244, 0.58);
  color: var(--mk-primary-dark);
  transform: translateY(-2px);
}

.mk-product-buy .buy-box__spec-option--selected {
  border-color: var(--mk-primary);
  background: var(--mk-primary);
  color: #fff;
  box-shadow: 0 10px 24px rgba(79, 199, 183, 0.18);
}

.mk-product-buy .buy-box__spec-option--with-image {
  width: 74px;
  min-width: 0;
  min-height: auto;
  flex-direction: column;
  gap: 6px;
  padding: 6px;
}

.mk-product-buy .buy-box__spec-option--with-image.buy-box__spec-option--selected {
  background: #fff;
  color: var(--mk-primary-dark) !important;
  box-shadow: 0 0 0 2px var(--mk-primary);
}

.mk-product-buy .buy-box__spec-option-image {
  width: 60px;
  height: 60px;
  border-radius: 6px;
  object-fit: cover;
  background: var(--mk-soft);
}

.mk-product-buy .buy-box__spec-option-text {
  max-width: 100%;
  color: inherit;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.mk-product-buy .buy-box__spec-option-zoom {
  top: 8px;
  right: 8px;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.9);
  color: var(--mk-primary-dark);
}

.mk-product-buy .buy-box__spec-option--disabled {
  cursor: not-allowed;
  opacity: 0.45;
  transform: none;
}

.mk-product-buy .buy-box__spec-option--disabled .buy-box__spec-option-text {
  text-decoration: line-through;
}

.mk-product-buy .buy-box__price {
  display: contents;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 10px;
}

.mk-product-buy .buy-box__price-label {
  display: none;
}

.mk-product-buy .buy-box__quantity-label {
  color: var(--mk-text);
  font-weight: 800;
}

.mk-product-buy .buy-box__price-value {
  display: none;
  align-items: baseline;
  gap: 12px;
  order: -4;
  margin-top: 0;
  color: var(--mk-primary-dark);
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
}

.mk-product-buy .buy-box__price-value del {
  color: #98a5ad;
  font-size: 18px;
  font-weight: 700;
}

.mk-product-buy .mk-product-save-badge {
  border-radius: 999px;
  background: var(--mk-pink);
  padding: 4px 10px;
  color: #653344;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.4;
}

.mk-product-buy .buy-box__stock {
  display: none;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 700;
}

.mk-product-buy .buy-box__quantity {
  display: grid;
  gap: 8px;
  margin-top: 18px;
}

.mk-product-buy .shop-quantity,
.mk-native-shop-box .shop-quantity {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  padding: 4px;
}

.mk-product-buy .shop-quantity__btn,
.mk-native-shop-box .shop-quantity__btn {
  display: inline-flex;
  width: 36px;
  height: 36px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 6px;
  background: #fff;
  color: var(--mk-text);
  transition: background 0.2s ease, color 0.2s ease;
}

.mk-product-buy .shop-quantity__btn:hover:not(:disabled),
.mk-native-shop-box .shop-quantity__btn:hover:not(:disabled) {
  background: #e0f7f4;
  color: var(--mk-primary-dark);
}

.mk-product-buy .shop-quantity__btn:disabled,
.mk-native-shop-box .shop-quantity__btn:disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.mk-product-buy .shop-quantity__input,
.mk-native-shop-box .shop-quantity__input {
  width: 46px;
  height: 36px;
  border: 0;
  background: transparent;
  color: var(--mk-text);
  font: inherit;
  font-weight: 900;
  text-align: center;
  outline: none;
}

.mk-product-buy .shop-quantity {
  gap: 10px;
  border: 0;
  background: transparent;
  padding: 0;
}

.mk-product-buy .shop-quantity__btn {
  width: 34px;
  height: 34px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  color: var(--mk-muted);
}

.mk-product-buy .shop-quantity__input {
  width: 44px;
  height: 34px;
  font-size: 18px;
}

.mk-product-buy .buy-box__actions {
  display: flex;
  gap: 12px;
  margin-top: auto;
  padding-top: 14px;
}

.mk-product-buy .buy-box__actions form {
  flex: 1 1 0;
}

.mk-product-buy .buy-box__actions form:nth-child(n + 3) {
  flex: 0 0 auto;
}

.mk-product-buy .shop-btn.shop-btn-lg,
.mk-native-shop-box .shop-btn.shop-btn-lg {
  display: inline-flex;
  min-height: 38px;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: var(--mk-radius);
  padding: 8px 18px;
  font: inherit;
  font-weight: 900;
  text-align: center;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mk-product-buy .buy-box__actions form:nth-child(n + 3) .shop-btn.shop-btn-lg {
  display: inline-flex;
  width: 44px;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding-right: 14px;
  padding-left: 14px;
  color: var(--mk-muted);
  font: inherit;
  box-shadow: none;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mk-product-buy .buy-box__actions form:nth-child(n + 3) .shop-btn.shop-btn-lg:hover {
  border-color: var(--mk-pink);
  background: #fff;
  color: var(--mk-pink);
}

.mk-product-buy .shop-btn.shop-btn-lg:hover,
.mk-native-shop-box .shop-btn.shop-btn-lg:hover {
  transform: translateY(-2px);
}

.mk-product-buy .shop-btn.shop-btn-primary.shop-btn-lg,
.mk-native-shop-box .shop-btn.shop-btn-primary.shop-btn-lg {
  border-color: var(--mk-primary);
  background: #fff;
  color: var(--mk-primary);
}

.mk-product-buy .shop-btn.shop-btn-primary.shop-btn-lg:hover,
.mk-native-shop-box .shop-btn.shop-btn-primary.shop-btn-lg:hover {
  background: rgba(79, 199, 183, 0.1);
}

.mk-product-buy .shop-btn.shop-btn-primary.shop-btn-lg::before {
  content: "";
  width: 18px;
  height: 18px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 7h13l-1.3 7.4a2 2 0 0 1-2 1.6H9.3a2 2 0 0 1-2-1.7L6.1 4H3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='10' cy='20' r='1.6' fill='black'/%3E%3Ccircle cx='17' cy='20' r='1.6' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 7h13l-1.3 7.4a2 2 0 0 1-2 1.6H9.3a2 2 0 0 1-2-1.7L6.1 4H3' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='10' cy='20' r='1.6' fill='black'/%3E%3Ccircle cx='17' cy='20' r='1.6' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}

.mk-product-buy .shop-btn.shop-btn-secondary.shop-btn-lg,
.mk-native-shop-box .shop-btn.shop-btn-secondary.shop-btn-lg {
  background: var(--mk-primary);
  color: #fff;
  box-shadow: 0 14px 30px rgba(79, 199, 183, 0.24);
}

.mk-product-buy .shop-btn.shop-btn-secondary.shop-btn-lg:hover,
.mk-native-shop-box .shop-btn.shop-btn-secondary.shop-btn-lg:hover {
  background: var(--mk-primary-dark);
}

.mk-product-buy .shop-btn.shop-btn-lg:disabled,
.mk-native-shop-box .shop-btn.shop-btn-lg:disabled {
  cursor: not-allowed;
  opacity: 0.58;
  transform: none;
}

.mk-product-story-media {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin-top: 30px;
  border-radius: 12px;
  background: linear-gradient(140deg, #f6fbfa, #dff3f0);
}

.mk-product-story-media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 44px;
}

.mk-product-features {
  background: var(--mk-soft-2);
  padding-top: 48px;
  padding-bottom: 48px;
}

.mk-product-features .mk-icon-grid {
  margin-top: 0;
}

.mk-product-features .mk-icon-grid article {
  border-radius: 12px;
  padding: 24px;
  transition: box-shadow 0.24s ease, transform 0.24s ease, border-color 0.24s ease;
}

.mk-product-features .mk-icon-grid article:hover {
  border-color: rgba(79, 199, 183, 0.45);
  box-shadow: var(--mk-shadow);
  transform: translateY(-4px);
}

.mk-product-features .mk-icon-grid article > svg {
  box-sizing: content-box;
  width: 24px;
  height: 24px;
  margin-bottom: 16px;
  border-radius: 12px;
  background: rgba(79, 199, 183, 0.1);
  padding: 12px;
  color: var(--mk-primary);
}

.mk-product-features .mk-icon-grid b {
  font-weight: 900;
}

.mk-product-tabs-section {
  background: var(--mk-soft-2);
  padding-top: 24px;
  padding-bottom: 80px;
}

.mk-tabs {
  border-radius: var(--mk-radius);
}

.mk-tabs__nav {
  display: flex;
  gap: 4px;
  border: 1px solid var(--mk-line);
  border-radius: 16px;
  background: #fff;
  padding: 6px;
}

.mk-tabs__nav button {
  flex: 1;
  border: 0;
  border-radius: 12px;
  background: transparent;
  padding: 12px 10px;
  color: var(--mk-muted);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  transition: background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1), color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.mk-tabs__nav button.is-active {
  background: var(--mk-primary);
  color: #fff;
}

.mk-tabs__nav button:not(.is-active):hover {
  background: var(--mk-soft-2);
}

.mk-tab-panel {
  display: none;
  margin-top: 24px;
  border: 1px solid var(--mk-line);
  border-radius: 16px;
  background: #fff;
  padding: 32px;
  opacity: 0;
  transform: translateY(10px);
}

.mk-tab-panel.is-active {
  display: block;
  animation: mk-tab-in 0.22s ease forwards;
}

.mk-tab-panel h2 {
  margin: 0 0 24px;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.4;
}

.mk-product-tabs-section .mk-post__content {
  color: var(--mk-muted);
  line-height: 1.75;
}

.mk-product-tabs-section .mk-post__content p {
  margin: 0 0 24px;
}

.mk-product-tabs-section .mk-post__content p:last-child {
  margin-bottom: 0;
}

@keyframes mk-tab-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.mk-spec-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mk-spec-grid div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-radius: 12px;
  background: var(--mk-soft-2);
  padding: 16px;
}

.mk-spec-grid span {
  color: var(--mk-muted);
}

.mk-spec-grid strong {
  color: var(--mk-text);
  font-weight: 800;
}

.mk-spec-empty {
  border: 1px dashed rgba(79, 199, 183, 0.38);
  border-radius: 12px;
  background: var(--mk-soft-2);
  padding: 20px;
  color: var(--mk-muted);
}

.mk-spec-empty p {
  margin: 0;
}

.mk-spec-table {
  width: 100%;
  border-collapse: collapse;
}

.mk-spec-table th,
.mk-spec-table td {
  border-bottom: 1px solid var(--mk-line);
  padding: 14px;
  text-align: left;
}

.mk-review {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 12px;
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  padding: 20px;
}

.mk-review + .mk-review {
  margin-top: 12px;
}

.mk-review span {
  display: flex;
  gap: 2px;
  margin-top: 2px;
  color: var(--mk-yellow);
}

.mk-review em {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary);
  font-style: normal;
  font-weight: 900;
}

.mk-review p {
  margin: 10px 0 0;
  color: var(--mk-muted);
}

.mk-review__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.mk-review__head small {
  color: #98a5ad;
  font-size: 13px;
}

.mk-native-shop-box,
.mk-native-shop-page {
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 28px;
  box-shadow: var(--mk-shadow-sm);
}

.mk-native-shop-page {
  margin-top: 132px;
  margin-bottom: 80px;
}

/* 购物车页面：把 Halo 原生购物车组件调整为本地预览里的“商品列表 + 订单摘要”结构。 */
.mk-cart-section,
.mk-cart-recommend {
  background: var(--mk-soft-2);
}

.mk-cart-section .mk-native-shop-box {
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.mk-cart-section .shop-entry {
  color: var(--mk-text);
}

.mk-cart-section .shop-entry__header {
  display: none !important;
}

.mk-cart-section .shop-cart {
  display: grid !important;
  align-items: start;
  gap: 32px;
  grid-template-columns: minmax(0, 1fr) 360px;
}

.mk-cart-section .shop-cart > span:first-child {
  display: grid;
  min-height: 292px;
  place-items: center;
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  padding: 64px 24px 42px;
  color: var(--mk-muted);
  font-size: 18px;
  font-weight: 900;
  text-align: center;
  box-shadow: var(--mk-shadow-sm);
}

.mk-cart-section .shop-cart > span:first-child::before {
  content: "";
  width: 78px;
  height: 78px;
  margin-bottom: 18px;
  border-radius: 999px;
  background:
    linear-gradient(var(--mk-soft), var(--mk-soft)) padding-box,
    linear-gradient(135deg, rgba(79, 199, 183, 0.34), rgba(247, 184, 200, 0.34)) border-box;
  border: 1px solid transparent;
  box-shadow: inset 0 0 0 22px #fff;
}

.mk-cart-section .shop-cart__items {
  display: grid;
  gap: 16px;
}

.mk-cart-section .shop-cart-item {
  display: grid !important;
  align-items: center;
  gap: 16px;
  grid-template-columns: 100px minmax(0, 1fr) auto auto auto;
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  padding: 20px;
  box-shadow: var(--mk-shadow-sm);
  transition: box-shadow 0.24s ease, transform 0.24s ease, border-color 0.24s ease;
}

.mk-cart-section .shop-cart-item:hover {
  border-color: rgba(79, 199, 183, 0.45);
  box-shadow: 0 12px 35px rgba(36, 109, 116, 0.1);
  transform: translateY(-2px);
}

.mk-cart-section .shop-cart-item__image {
  width: 100px !important;
  height: 100px !important;
  border-radius: var(--mk-radius);
  background: linear-gradient(140deg, #f6fbfa, #dff3f0);
  object-fit: contain;
  padding: 8px;
}

.mk-cart-section .shop-cart-item__info {
  min-width: 0;
}

.mk-cart-section .shop-cart-item__name {
  display: block;
  overflow: hidden;
  color: var(--mk-text);
  font-size: 18px;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mk-cart-section .shop-cart-item__name:hover {
  color: var(--mk-primary-dark);
}

.mk-cart-section .shop-cart-item__price {
  display: inline-flex;
  margin-top: 8px;
  color: var(--mk-primary-dark);
  font-size: 20px;
  font-weight: 900;
}

.mk-cart-section .shop-cart-item__price-original {
  margin-left: 8px;
  color: #98a5ad;
  font-size: 14px;
}

.mk-cart-section .shop-cart-item__total {
  color: var(--mk-primary-dark);
  font-size: 20px;
  font-weight: 900;
  white-space: nowrap;
}

.mk-cart-section .shop-cart-item__remove {
  min-height: 40px;
  border: 0;
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 8px 12px;
  color: var(--mk-muted);
  font: inherit;
  font-weight: 800;
  transition: background 0.2s ease, color 0.2s ease;
}

.mk-cart-section .shop-cart-item__remove:hover {
  background: #fef2f2;
  color: var(--mk-danger);
}

.mk-cart-section .shop-cart-summary.shop-card {
  position: sticky;
  top: 96px;
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  padding: 24px;
  box-shadow: 0 18px 45px rgba(36, 109, 116, 0.08);
}

.mk-cart-section .shop-card__title {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 20px;
  border-radius: 999px;
  background: rgba(79, 199, 183, 0.15);
  padding: 8px 14px;
  color: var(--mk-primary-dark);
  font-size: 14px;
  font-weight: 900;
}

.mk-cart-section .shop-cart-summary__row {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 16px;
  color: var(--mk-muted);
  font-weight: 700;
}

.mk-cart-section .shop-cart-summary__row span:last-child {
  color: var(--mk-text);
  font-weight: 900;
}

.mk-cart-section .shop-divider {
  height: 1px;
  margin: 0 0 16px;
  background: var(--mk-line);
}

.mk-cart-section .shop-cart-summary__row--total {
  align-items: baseline;
  padding-bottom: 0;
  color: var(--mk-text);
  font-size: 18px;
}

.mk-cart-section .shop-cart-summary__row--total span:last-child {
  color: var(--mk-primary-dark);
  font-size: 26px;
  font-weight: 900;
}

.mk-cart-section .shop-cart-summary__actions {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.mk-cart-section .shop-cart-summary__actions form {
  margin: 0;
}

.mk-cart-section .shop-cart-summary .shop-btn.shop-btn-primary.shop-btn-lg {
  border-color: var(--mk-primary);
  background: var(--mk-primary);
  color: #fff;
  box-shadow: 0 14px 30px rgba(79, 199, 183, 0.24);
}

.mk-cart-section .shop-cart-summary .shop-btn.shop-btn-primary.shop-btn-lg:hover {
  background: var(--mk-primary-dark);
}

.mk-cart-section .shop-cart-summary .shop-btn.shop-btn-secondary.shop-btn-lg {
  border-color: rgba(79, 199, 183, 0.3);
  background: #fff;
  color: var(--mk-primary-dark);
  box-shadow: none;
}

.mk-cart-section .shop-cart-summary .shop-btn.shop-btn-secondary.shop-btn-lg:hover {
  background: #e0f7f4;
}

.mk-cart-recommend {
  padding-top: 8px;
}

.mk-cart-recommend .mk-heading {
  margin-bottom: 32px;
}

.mk-cart-recommend__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* 结算页和支付页：只做 Halo 商城原生组件的品牌视觉外壳与样式覆盖，不接管订单、地址、支付或 CSRF 逻辑。 */
.mk-checkout-page,
.mk-payment-page {
  background: var(--mk-soft-2);
}

.mk-checkout-hero {
  position: relative;
  overflow: hidden;
  padding: 148px 0 56px;
  background:
    linear-gradient(135deg, rgba(79, 199, 183, 0.14), rgba(255, 255, 255, 0.94) 52%, rgba(247, 184, 200, 0.14)),
    linear-gradient(180deg, rgba(255, 216, 107, 0.08), rgba(255, 255, 255, 0));
}

.mk-checkout-hero::before {
  content: "";
  position: absolute;
  inset: -18% -12%;
  opacity: 0.62;
  background:
    linear-gradient(112deg, transparent 0 18%, rgba(79, 199, 183, 0.14) 30%, transparent 46%, rgba(247, 184, 200, 0.12) 68%, transparent 86%),
    repeating-linear-gradient(90deg, rgba(79, 199, 183, 0.08) 0 1px, transparent 1px 96px);
  pointer-events: none;
}

.mk-checkout-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  align-items: center;
  gap: 40px;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.78fr);
}

.mk-checkout-hero__copy h1 {
  max-width: 760px;
  margin: 18px 0 0;
  font-size: clamp(34px, 5vw, 56px);
  font-weight: 900;
  line-height: 1.12;
}

.mk-checkout-hero__copy p {
  max-width: 720px;
  margin: 18px 0 0;
  color: var(--mk-muted);
  font-size: 17px;
  line-height: 1.8;
}

.mk-checkout-progress,
.mk-payment-safe-card {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(79, 199, 183, 0.26);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.86);
  padding: 18px;
  box-shadow: var(--mk-shadow-sm);
  backdrop-filter: blur(14px);
}

.mk-checkout-progress span {
  display: grid;
  align-items: center;
  gap: 2px 12px;
  grid-template-columns: 42px minmax(0, 1fr);
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 12px;
}

.mk-checkout-progress b {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  grid-row: span 2;
  border-radius: var(--mk-radius);
  background: #e0f7f4;
  color: var(--mk-primary-dark);
  font-weight: 900;
}

.mk-checkout-progress strong,
.mk-payment-safe-card strong {
  color: var(--mk-text);
  font-size: 16px;
  font-weight: 900;
}

.mk-checkout-progress small,
.mk-payment-safe-card p {
  color: var(--mk-muted);
  font-size: 13px;
  line-height: 1.6;
}

.mk-checkout-progress .is-active {
  border-color: rgba(79, 199, 183, 0.5);
  background: linear-gradient(135deg, #fff, #eef9f7);
}

.mk-checkout-progress .is-active b {
  background: var(--mk-primary);
  color: #fff;
  box-shadow: 0 12px 24px rgba(79, 199, 183, 0.22);
}

.mk-checkout-section,
.mk-payment-section {
  background: var(--mk-soft-2);
  padding-top: 48px;
}

.mk-checkout-layout {
  display: grid;
  align-items: start;
  gap: 24px;
  grid-template-columns: minmax(0, 1fr) 320px;
}

.mk-checkout-shell,
.mk-payment-shell,
.mk-checkout-aside article {
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--mk-shadow-sm);
}

.mk-checkout-shell,
.mk-payment-shell {
  min-width: 0;
  padding: 28px;
}

.mk-checkout-shell__head,
.mk-payment-shell__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--mk-line);
  padding-bottom: 20px;
}

.mk-checkout-shell__head span,
.mk-payment-shell__head span {
  display: block;
  margin-bottom: 6px;
  color: var(--mk-primary);
  font-size: 12px;
  font-weight: 900;
}

.mk-checkout-shell__head h2,
.mk-payment-shell__head h2 {
  margin: 0;
  font-size: clamp(24px, 3vw, 34px);
  font-weight: 900;
  line-height: 1.18;
}

.mk-checkout-shell__head .mk-btn,
.mk-payment-shell__actions .mk-btn {
  min-height: 42px;
  flex: 0 0 auto;
  padding: 9px 14px;
  font-size: 14px;
}

.mk-checkout-shell__head .mk-btn svg,
.mk-payment-shell__actions .mk-btn svg {
  width: 18px;
  height: 18px;
}

.mk-checkout-aside {
  position: sticky;
  top: 96px;
  display: grid;
  gap: 14px;
}

.mk-checkout-aside article {
  padding: 20px;
}

.mk-checkout-aside__icon {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: #e0f7f4;
  color: var(--mk-primary-dark);
}

.mk-checkout-aside__icon--yellow {
  background: rgba(255, 216, 107, 0.24);
  color: #9c7b18;
}

.mk-checkout-aside__icon svg,
.mk-payment-safe-card svg {
  width: 22px;
  height: 22px;
}

.mk-checkout-aside h3 {
  margin: 14px 0 8px;
  font-size: 18px;
  font-weight: 900;
}

.mk-checkout-aside p {
  margin: 0;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.75;
}

.mk-payment-hero {
  padding-bottom: 64px;
}

.mk-payment-safe-card {
  gap: 10px;
  padding: 24px;
}

.mk-payment-safe-card > span {
  display: inline-flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #e0f7f4;
  color: var(--mk-primary-dark);
}

.mk-payment-safe-card p {
  margin: 0;
}

.mk-payment-shell {
  max-width: 920px;
  margin: 0 auto;
}

.mk-payment-shell__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.mk-checkout-shell shop-page-checkout,
.mk-payment-shell shop-page-payments {
  display: block;
  min-width: 0;
  color: var(--mk-text);
}

.mk-checkout-shell .shop-entry,
.mk-payment-shell .shop-entry {
  color: var(--mk-text);
}

.mk-checkout-shell .shop-entry__header,
.mk-payment-shell .shop-entry__header {
  display: none !important;
}

.mk-checkout-shell .shop-card,
.mk-payment-shell .shop-card,
.mk-checkout-shell [class*="address"],
.mk-checkout-shell [class*="Address"],
.mk-checkout-shell [class*="summary"],
.mk-checkout-shell [class*="Summary"],
.mk-checkout-shell [class*="order"],
.mk-checkout-shell [class*="Order"],
.mk-payment-shell [class*="payment"],
.mk-payment-shell [class*="Payment"] {
  border-color: var(--mk-line);
  border-radius: var(--mk-radius);
}

.mk-checkout-shell .shop-card,
.mk-payment-shell .shop-card {
  background: #fff;
  box-shadow: none;
}

.mk-checkout-shell .shop-card__title,
.mk-payment-shell .shop-card__title,
.mk-checkout-shell h2,
.mk-checkout-shell h3,
.mk-payment-shell h2,
.mk-payment-shell h3 {
  color: var(--mk-text);
  font-weight: 900;
}

.mk-checkout-shell input,
.mk-checkout-shell select,
.mk-checkout-shell textarea,
.mk-payment-shell input,
.mk-payment-shell select,
.mk-payment-shell textarea {
  min-height: 42px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  color: var(--mk-text);
  font: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mk-checkout-shell input:focus,
.mk-checkout-shell select:focus,
.mk-checkout-shell textarea:focus,
.mk-payment-shell input:focus,
.mk-payment-shell select:focus,
.mk-payment-shell textarea:focus {
  border-color: var(--mk-primary);
  box-shadow: 0 0 0 4px rgba(79, 199, 183, 0.15);
}

.mk-checkout-shell label,
.mk-payment-shell label {
  color: var(--mk-text);
  font-weight: 800;
}

.mk-checkout-shell .shop-btn,
.mk-payment-shell .shop-btn {
  border-radius: var(--mk-radius);
  font-weight: 900;
}

.mk-checkout-shell .shop-btn.shop-btn-lg,
.mk-payment-shell .shop-btn.shop-btn-lg {
  min-height: 46px;
}

.mk-checkout-shell .shop-btn.shop-btn-primary,
.mk-payment-shell .shop-btn.shop-btn-primary,
.mk-payment-shell .shop-btn.shop-btn-secondary {
  border-color: var(--mk-primary);
  background: var(--mk-primary);
  color: #fff;
  box-shadow: 0 14px 30px rgba(79, 199, 183, 0.24);
}

.mk-checkout-shell .shop-btn.shop-btn-primary:hover,
.mk-payment-shell .shop-btn.shop-btn-primary:hover,
.mk-payment-shell .shop-btn.shop-btn-secondary:hover {
  background: var(--mk-primary-dark);
}

.mk-checkout-shell .shop-btn.shop-btn-secondary,
.mk-payment-shell .shop-btn:not(.shop-btn-primary):not(.shop-btn-secondary) {
  border-color: rgba(79, 199, 183, 0.32);
  background: #fff;
  color: var(--mk-primary-dark);
  box-shadow: none;
}

.mk-checkout-shell .shop-btn.shop-btn-secondary:hover,
.mk-payment-shell .shop-btn:not(.shop-btn-primary):not(.shop-btn-secondary):hover {
  background: #e0f7f4;
}

.mk-checkout-shell [class*="item"],
.mk-checkout-shell [class*="Item"] {
  min-width: 0;
}

.mk-checkout-shell img,
.mk-payment-shell img {
  border-radius: var(--mk-radius);
}

.mk-checkout-shell [class*="price"],
.mk-checkout-shell [class*="Price"],
.mk-checkout-shell [class*="total"],
.mk-checkout-shell [class*="Total"],
.mk-payment-shell [class*="price"],
.mk-payment-shell [class*="Price"],
.mk-payment-shell [class*="amount"],
.mk-payment-shell [class*="Amount"],
.mk-payment-shell [class*="total"],
.mk-payment-shell [class*="Total"] {
  color: var(--mk-primary-dark);
  font-weight: 900;
}

.mk-checkout-shell [class*="summary"],
.mk-checkout-shell [class*="Summary"] {
  background: linear-gradient(180deg, #fff, rgba(79, 199, 183, 0.05));
}

.mk-payment-shell [class*="method"],
.mk-payment-shell [class*="Method"],
.mk-payment-shell [class*="channel"],
.mk-payment-shell [class*="Channel"] {
  border-color: var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
}

.mk-payment-shell [class*="method"]:hover,
.mk-payment-shell [class*="Method"]:hover,
.mk-payment-shell [class*="channel"]:hover,
.mk-payment-shell [class*="Channel"]:hover {
  border-color: rgba(79, 199, 183, 0.48);
  box-shadow: 0 12px 30px rgba(36, 109, 116, 0.08);
}

@media (max-width: 960px) {
  .mk-cart-section .shop-cart {
    grid-template-columns: 1fr;
  }

  .mk-cart-section .shop-cart-summary.shop-card {
    position: static;
  }

  .mk-checkout-hero__grid,
  .mk-checkout-layout {
    grid-template-columns: 1fr;
  }

  .mk-checkout-aside {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mk-cart-recommend__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .mk-product-detail {
    padding-top: 232px;
  }

  .mk-product-gallery__main img {
    padding: 32px;
  }

  .mk-product-gallery__arrow {
    width: 36px;
    height: 36px;
  }

  .mk-product-gallery__arrow--prev {
    left: 10px;
  }

  .mk-product-gallery__arrow--next {
    right: 10px;
  }

  .mk-product-gallery__thumbs button {
    width: 80px;
    height: 80px;
  }

  .mk-product-buy .buy-box__price {
    display: grid;
    gap: 8px;
  }

  .mk-product-buy .buy-box__price-value {
    font-size: 40px;
  }

  .mk-product-buy .buy-box__actions {
    flex-direction: row;
    gap: 16px;
  }

  .mk-product-buy .shop-btn.shop-btn-lg {
    min-height: 40px;
    padding-right: 16px;
    padding-left: 16px;
    font-size: 14px;
  }

  .mk-product-buy .shop-btn.shop-btn-primary.shop-btn-lg::before {
    width: 16px;
    height: 16px;
  }

  .mk-product-buy h1 {
    font-size: 30px;
  }

  .mk-tabs__nav button {
    min-width: 0;
    padding-right: 4px;
    padding-left: 4px;
    font-size: 14px;
  }

  .mk-tab-panel {
    padding: 32px;
  }

  .mk-spec-grid {
    grid-template-columns: 1fr;
  }

  .mk-cart-section .shop-cart-item {
    align-items: start;
    grid-template-columns: 84px minmax(0, 1fr) auto;
    padding: 16px;
  }

  .mk-cart-section .shop-cart-item__image {
    width: 84px !important;
    height: 84px !important;
  }

  .mk-cart-section .shop-cart-item .shop-quantity {
    grid-column: 2;
  }

  .mk-cart-section .shop-cart-item__total {
    grid-column: 2;
    font-size: 18px;
  }

  .mk-cart-section .shop-cart-item__remove {
    grid-column: 3;
    grid-row: 1;
  }

  .mk-cart-recommend__grid {
    grid-template-columns: 1fr;
  }
}

.mk-search-form {
  display: flex;
  max-width: 680px;
  gap: 12px;
  margin: 34px auto 0;
}

.mk-search-form input {
  flex: 1;
  min-height: 56px;
}

.mk-result {
  max-width: 620px;
  margin: 20px auto 0;
  border: 1px solid var(--mk-line);
  border-left: 5px solid var(--mk-primary);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 18px;
  text-align: left;
  box-shadow: var(--mk-shadow-sm);
}

.mk-result.is-danger {
  border-left-color: var(--mk-danger);
}

.mk-steps {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mk-steps article {
  display: grid;
  gap: 8px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 22px;
  box-shadow: var(--mk-shadow-sm);
}

.mk-steps b {
  color: #b8d9d5;
  font-size: 30px;
  font-weight: 900;
}

.mk-steps span {
  color: var(--mk-muted);
}

.mk-proof-card,
.mk-faq-card,
.mk-form,
.mk-contact-panel {
  padding: 26px;
}

.mk-proof-card__body {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  grid-template-columns: 240px 1fr;
}

.mk-proof-card__body > div {
  display: flex;
  min-height: 230px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: linear-gradient(145deg, #3ecbb8, #27a898);
  color: #fff;
}

.mk-proof-card__body strong {
  font-size: 30px;
}

.mk-proof-card dl {
  display: grid;
  align-content: center;
  gap: 12px 24px;
  grid-template-columns: auto 1fr;
  margin: 0;
  background: #f4faf9;
  padding: 28px;
}

.mk-proof-card dt {
  color: var(--mk-muted);
}

.mk-faq-card button {
  display: block;
  width: 100%;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #f4faf9;
  padding: 16px;
  color: var(--mk-text);
  text-align: left;
  font-weight: 800;
}

.mk-faq-card button + button {
  margin-top: 12px;
}

.mk-faq-card button span {
  display: block;
  margin-top: 4px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 400;
}

.mk-drawer {
  position: fixed;
  inset: 0;
  z-index: 80;
  pointer-events: none;
  visibility: hidden;
}

.mk-drawer.is-open {
  pointer-events: auto;
  visibility: visible;
}

.mk-drawer__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.25);
  padding: 0;
  opacity: 0;
  appearance: none;
  transition: opacity 0.22s ease;
}

.mk-drawer.is-open .mk-drawer__backdrop {
  opacity: 1;
}

.mk-drawer aside {
  position: absolute;
  top: 0;
  right: 0;
  width: min(420px, 100%);
  height: 100%;
  overflow: auto;
  background: #fff;
  padding: 28px;
  box-shadow: -8px 0 40px rgba(36, 109, 116, 0.12);
  transform: translateX(100%);
  transition: transform 0.28s ease;
}

.mk-drawer.is-open aside {
  transform: translateX(0);
}

.mk-drawer button[data-drawer-close] {
  float: right;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: var(--mk-radius);
  background: #f4faf9;
  font-size: 24px;
}

.mk-drawer img {
  margin: 18px 0;
  border-radius: var(--mk-radius);
  background: #eef9f7;
}

/* 正品查询页：下面这组样式专门复刻本地预览 /verify 页的卡片、抽屉和结果状态。
   选择器都带 mk-verify 前缀或抽屉局部类，避免覆盖 Halo 搜索页、商城页和文章页的通用组件。 */
.mk-verify-hero {
  overflow: hidden;
  padding-top: 232px;
  padding-bottom: 80px;
  background: var(--mk-soft-2);
}

.mk-verify-hero__wash {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 60% 50% at 50% 0%, rgba(79, 199, 183, 0.12), transparent 68%);
}

.mk-verify-hero__inner {
  position: relative;
  display: block;
  max-width: 1100px;
  margin-top: 0;
  text-align: center;
}

.mk-verify-hero h1 {
  font-size: clamp(32px, 5vw, 52px);
  line-height: 1.1;
}

.mk-verify-hero p {
  max-width: 800px;
  color: var(--mk-muted);
}

.mk-verify-search {
  max-width: 640px;
  align-items: stretch;
  margin-top: 40px;
}

.mk-search-field {
  position: relative;
  display: flex;
  flex: 1;
}

.mk-search-field__icon {
  position: absolute;
  top: 50%;
  left: 16px;
  z-index: 1;
  display: inline-flex;
  width: 20px;
  height: 20px;
  color: var(--mk-muted);
  transform: translateY(-50%);
}

.mk-search-field__icon svg,
.mk-step-card__icon svg,
.mk-step-arrow svg,
.mk-faq-button svg,
.mk-drawer__icon svg,
.mk-drawer__header button svg {
  display: block;
  width: 100%;
  height: 100%;
}

.mk-verify-search input {
  width: 100%;
  min-height: 56px;
  border-color: var(--mk-line);
  border-radius: var(--mk-radius);
  padding-left: 48px;
  padding-right: 16px;
  font-size: 16px;
  box-shadow: 0 8px 30px rgba(36, 109, 116, 0.08);
}

.mk-verify-search .mk-btn {
  min-height: 56px;
  padding-right: 32px;
  padding-left: 32px;
  box-shadow: 0 14px 30px rgba(79, 199, 183, 0.25);
  white-space: nowrap;
}

.mk-verify-result {
  max-width: 560px;
  border-color: rgba(79, 199, 183, 0.4);
  border-left-color: var(--mk-primary);
  padding: 20px;
}

.mk-verify-result.is-warning {
  border-color: rgba(255, 216, 107, 0.45);
  border-left-color: var(--mk-yellow);
}

.mk-verify-result.is-danger {
  border-color: rgba(239, 93, 93, 0.4);
  border-left-color: var(--mk-danger);
}

.mk-result-content {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.mk-result-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary);
}

.mk-result-icon svg {
  width: 20px;
  height: 20px;
}

.mk-verify-result.is-danger .mk-result-icon {
  background: rgba(239, 93, 93, 0.1);
  color: var(--mk-danger);
}

.mk-verify-result.is-warning .mk-result-icon {
  background: rgba(255, 216, 107, 0.18);
  color: #b89830;
}

.mk-result-content strong {
  display: block;
  color: var(--mk-primary);
  font-weight: 900;
}

.mk-verify-result.is-danger .mk-result-content strong {
  color: var(--mk-danger);
}

.mk-verify-result.is-warning .mk-result-content strong {
  color: var(--mk-text);
}

.mk-result-content p {
  margin: 6px 0 0;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.7;
}

.mk-result-content code {
  border-radius: 4px;
  background: var(--mk-soft);
  padding: 2px 6px;
  color: var(--mk-text);
  font-size: 12px;
}

.mk-result-grid {
  display: grid;
  gap: 4px 24px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 8px;
  color: var(--mk-muted);
  font-size: 14px;
}

.mk-result-grid b {
  color: var(--mk-text);
}

.mk-verify-flow {
  padding-top: 32px;
  padding-bottom: 32px;
}

.mk-verify-steps {
  display: grid;
  align-items: center;
  gap: 0;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
}

.mk-step-card {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 20px 24px;
  box-shadow: 0 2px 12px rgba(36, 109, 116, 0.06);
}

.mk-step-card b {
  flex: 0 0 auto;
  color: var(--mk-line);
  font-size: 30px;
  font-weight: 900;
  line-height: 1;
}

.mk-step-card__icon {
  display: inline-flex;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: var(--mk-primary);
  color: #fff;
  padding: 12px;
}

.mk-step-card__copy {
  min-width: 0;
}

.mk-step-card__copy strong,
.mk-step-card__copy small {
  display: block;
}

.mk-step-card__copy strong {
  color: var(--mk-text);
  font-weight: 900;
}

.mk-step-card__copy small {
  margin-top: 2px;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.45;
}

.mk-step-arrow {
  display: inline-flex;
  width: 20px;
  height: 20px;
  margin: 0 8px;
  color: #b8d9d5;
}

.mk-verify-content {
  padding-top: 64px;
  padding-bottom: 80px;
}

.mk-verify-grid {
  display: grid;
  align-items: start;
  gap: 24px;
  grid-template-columns: minmax(0, 1fr) 380px;
}

.mk-verify-proof-card {
  border-left: 4px solid rgba(79, 199, 183, 0.85);
  padding: 24px;
  box-shadow: 0 8px 32px rgba(79, 199, 183, 0.12);
}

.mk-verify-proof-card.is-fake {
  border-left-color: var(--mk-danger);
  box-shadow: 0 8px 32px rgba(239, 93, 93, 0.12);
}

.mk-verify-proof-card h2,
.mk-verify-faq-card h2 {
  margin: 0 0 20px;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.35;
}

.mk-verify-proof-card .mk-proof-card__body {
  grid-template-columns: 240px 1fr;
  border-radius: var(--mk-radius);
}

.mk-proof-card__badge {
  position: relative;
  min-height: 230px;
  gap: 12px;
  overflow: hidden;
  background: linear-gradient(145deg, #3ecbb8, #27a898);
}

.mk-verify-proof-card.is-fake .mk-proof-card__badge {
  background: linear-gradient(145deg, #ef5d5d, #d63c3c);
}

.mk-proof-card__badge::before,
.mk-proof-card__badge::after {
  position: absolute;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  content: "";
}

.mk-proof-card__badge::before {
  top: -40px;
  right: -40px;
}

.mk-proof-card__badge::after {
  bottom: -52px;
  left: -42px;
}

.mk-proof-card__overline,
.mk-proof-card__badge strong,
.mk-proof-card__badge em,
.mk-proof-shield {
  position: relative;
  z-index: 1;
}

.mk-proof-card__overline {
  color: rgba(255, 255, 255, 0.82);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0;
}

.mk-proof-shield {
  width: 86px;
  height: 100px;
  color: #3ecbb8;
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.18));
}

.mk-verify-proof-card.is-fake .mk-proof-shield {
  color: var(--mk-danger);
}

.mk-proof-shield svg {
  width: 100%;
  height: 100%;
}

.mk-proof-shield__x {
  display: none;
}

.mk-verify-proof-card.is-fake .mk-proof-shield__check {
  display: none;
}

.mk-verify-proof-card.is-fake .mk-proof-shield__x {
  display: block;
}

.mk-proof-card__badge strong {
  color: #fff;
  font-size: 28px;
  line-height: 1;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
}

.mk-proof-card__badge em {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.2);
  padding: 6px 20px;
  color: #fff;
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0;
}

.mk-verify-proof-card .mk-proof-card dl {
  gap: 14px 32px;
  padding: 28px 32px;
  font-size: 15px;
}

.mk-verify-proof-card.is-fake .mk-proof-card dl {
  background: #fef7f7;
}

.mk-verify-proof-card .mk-proof-card dd {
  margin: 0;
  color: var(--mk-text);
  font-weight: 800;
}

.mk-verify-proof-card.is-fake .mk-proof-card dd {
  color: var(--mk-danger);
}

.mk-verify-faq-card {
  padding: 24px;
  box-shadow: 0 4px 24px rgba(36, 109, 116, 0.06);
}

.mk-verify-faq-card .mk-faq-button {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #f4faf9;
  padding: 16px;
  color: var(--mk-text);
  text-align: left;
  transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.mk-verify-faq-card .mk-faq-button + .mk-faq-button {
  margin-top: 12px;
}

.mk-verify-faq-card .mk-faq-button:hover,
.mk-verify-faq-card .mk-faq-button:focus-visible {
  border-color: rgba(79, 199, 183, 0.4);
  background: var(--mk-soft);
  box-shadow: 0 4px 16px rgba(36, 109, 116, 0.1);
}

.mk-verify-faq-card .mk-faq-button .mk-faq-button__icon {
  display: inline-flex;
  margin-top: 0;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  color: var(--mk-primary);
  padding: 10px;
  transition: background 0.2s ease;
}

.mk-faq-button:hover .mk-faq-button__icon,
.mk-faq-button:focus-visible .mk-faq-button__icon {
  background: rgba(79, 199, 183, 0.18);
}

.mk-verify-faq-card .mk-faq-button .mk-faq-button__copy {
  display: block;
  margin-top: 0;
  min-width: 0;
  flex: 1;
}

.mk-verify-faq-card .mk-faq-button .mk-faq-button__copy strong {
  display: block;
  font-size: 16px;
  font-weight: 900;
}

.mk-verify-faq-card .mk-faq-button .mk-faq-button__copy span {
  display: block;
  overflow: hidden;
  margin-top: 3px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mk-verify-faq-card .mk-faq-button .mk-faq-button__arrow {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  color: #b8d9d5;
  transition: color 0.2s ease, transform 0.2s ease;
}

.mk-faq-button:hover .mk-faq-button__arrow,
.mk-faq-button:focus-visible .mk-faq-button__arrow {
  color: var(--mk-primary);
  transform: translateX(2px);
}

.mk-drawer__backdrop {
  backdrop-filter: blur(2px);
}

.mk-drawer .mk-drawer__panel {
  display: flex;
  width: min(420px, 100%);
  flex-direction: column;
  overflow: hidden;
  padding: 0;
}

.mk-drawer__header {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--mk-line);
  padding: 20px 24px;
}

.mk-drawer__header h2 {
  flex: 1;
  margin: 0;
  font-size: 18px;
  font-weight: 900;
}

.mk-drawer__icon {
  display: inline-flex;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  color: var(--mk-primary);
  padding: 9px;
}

.mk-drawer__header button[data-drawer-close] {
  float: none;
  display: inline-flex;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: var(--mk-radius);
  background: transparent;
  padding: 8px;
  color: var(--mk-muted);
  font-size: inherit;
  transition: background 0.2s ease, color 0.2s ease;
}

.mk-drawer__header button[data-drawer-close]:hover,
.mk-drawer__header button[data-drawer-close]:focus-visible {
  background: #f4faf9;
  color: var(--mk-text);
}

.mk-drawer__body {
  flex: 1;
  overflow-y: auto;
  padding: 24px;
}

.mk-drawer-visual {
  position: relative;
  height: 192px;
  overflow: hidden;
  margin: 0 0 24px;
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
}

.mk-drawer-visual--warm {
  height: 160px;
  background: #fff7f0;
}

.mk-drawer .mk-drawer-visual img {
  width: 100%;
  height: 100%;
  margin: 0;
  border-radius: 0;
  object-fit: contain;
  padding: 16px;
}

.mk-drawer-visual figcaption {
  position: absolute;
  right: 24px;
  bottom: 16px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  background: #fff;
  padding: 6px 12px;
  color: var(--mk-primary-dark);
  font-size: 12px;
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(36, 109, 116, 0.14);
}

.mk-drawer-callout {
  border: 1px solid rgba(79, 199, 183, 0.3);
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  padding: 16px;
  color: var(--mk-primary-dark);
  font-size: 14px;
  line-height: 1.75;
}

.mk-drawer-callout strong {
  display: block;
  margin-bottom: 4px;
  color: var(--mk-primary-dark);
  font-size: 16px;
}

.mk-drawer-callout p {
  margin: 0;
}

.mk-drawer-list {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}

.mk-drawer-list article {
  display: flex;
  gap: 12px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #f4faf9;
  padding: 16px;
}

.mk-drawer-list b,
.mk-drawer-list--icons > article > span {
  display: inline-flex;
  width: 28px;
  height: 28px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--mk-primary);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
}

.mk-drawer-list--icons > article > span {
  width: 32px;
  height: 32px;
  border-radius: var(--mk-radius);
}

.mk-drawer-list--icons .is-warm {
  background: #fff3e8;
  color: #ef8c4a;
}

.mk-drawer-list--icons .is-mint {
  background: var(--mk-soft);
  color: var(--mk-primary);
}

.mk-drawer-list--icons .is-blue {
  background: #eef2fd;
  color: #7b9be4;
}

.mk-drawer-list strong {
  display: block;
  color: var(--mk-text);
  font-weight: 900;
}

.mk-drawer-list p {
  margin: 4px 0 0;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.7;
}

.mk-drawer-support {
  margin-top: 24px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 16px;
}

.mk-drawer-support > strong {
  display: block;
  margin-bottom: 12px;
  font-weight: 900;
}

.mk-drawer-support p {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: var(--mk-text);
  font-weight: 800;
}

.mk-drawer-support p + p {
  margin-top: 12px;
}

.mk-drawer .mk-drawer-support img {
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  margin: 0;
  border-radius: var(--mk-radius);
  object-fit: cover;
  padding: 0;
}

.mk-partner-grid {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 48px;
}

.mk-partner-hero .mk-partner-grid {
  margin-top: 64px;
}

.mk-partner-card,
.mk-account-card {
  padding: 24px;
}

.mk-partner-card {
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.mk-partner-card__icon,
.mk-contact-icon {
  display: inline-flex;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary);
}

.mk-partner-card__icon svg,
.mk-contact-icon svg,
.mk-partner-form .mk-eyebrow svg,
.mk-partner-form .mk-btn svg {
  width: 20px;
  height: 20px;
}

.mk-partner-card ul {
  display: grid;
  gap: 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.mk-partner-card li,
.mk-note li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 1.5;
}

.mk-partner-card li::before,
.mk-note li::before {
  content: "✓ ";
  display: inline-flex;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  color: var(--mk-primary);
  font-weight: 900;
}

.mk-partner-section {
  background: linear-gradient(180deg, rgba(79, 199, 183, 0.02) 0%, rgba(79, 199, 183, 0.06) 100%);
  padding: 80px 0;
}

.mk-partner-layout {
  gap: 64px;
}

.mk-partner-form,
.mk-partner-contact {
  border: 0;
  background: transparent;
  box-shadow: none;
  padding: 0;
}

.mk-partner-form h2,
.mk-partner-contact h2 {
  margin: 16px 0 0;
  font-size: clamp(28px, 4vw, 42px);
  font-weight: 900;
  line-height: 1.15;
}

.mk-partner-form > p,
.mk-partner-contact > p {
  margin: 8px 0 0;
  color: var(--mk-muted);
}

.mk-form label {
  display: grid;
  gap: 8px;
  color: var(--mk-text);
  font-size: 14px;
  font-weight: 700;
}

.mk-form__grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mk-form > * + * {
  margin-top: 16px;
}

.mk-partner-form input {
  min-height: 48px;
}

.mk-partner-form > .mk-form__grid:first-of-type {
  margin-top: 32px;
}

.mk-partner-type {
  display: grid;
  gap: 8px;
  color: var(--mk-text);
  font-size: 14px;
  font-weight: 700;
}

.mk-partner-type__grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mk-partner-type__grid button {
  min-height: 46px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 10px 12px;
  color: var(--mk-text);
  font: inherit;
  font-weight: 800;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.mk-partner-type__grid button:hover,
.mk-partner-type__grid button:focus-visible {
  border-color: rgba(79, 199, 183, 0.45);
  outline: none;
}

.mk-partner-type__grid button.is-active,
.mk-partner-type__grid button[aria-pressed="true"] {
  border-color: var(--mk-primary);
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary-dark);
}

.mk-partner-form .mk-btn {
  width: 100%;
  min-height: 48px;
}

.mk-contact-list {
  display: grid;
  gap: 16px;
  margin-top: 32px;
}

.mk-contact-panel article {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 20px;
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.mk-contact-panel article:hover {
  border-color: rgba(79, 199, 183, 0.45);
  box-shadow: var(--mk-shadow-sm);
  transform: translateY(-4px);
}

.mk-contact-panel h4 {
  margin: 0;
  font-weight: 900;
}

.mk-contact-panel article div {
  min-width: 0;
}

.mk-contact-panel article div > span,
.mk-contact-panel article small {
  display: block;
  color: var(--mk-muted);
}

.mk-note {
  margin-top: 18px;
  border: 1px solid rgba(79, 199, 183, 0.2);
  border-radius: var(--mk-radius);
  background: rgba(79, 199, 183, 0.05);
  padding: 24px;
  transition: transform 0.24s ease;
}

.mk-note:hover {
  transform: translateY(-4px);
}

.mk-note h4 {
  margin: 0;
  font-size: 18px;
  font-weight: 900;
}

.mk-note ul {
  display: grid;
  gap: 12px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.mk-account-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.mk-page--account {
  background: var(--mk-bg);
}

.mk-account-hero {
  padding-bottom: 48px;
}

.mk-account-hero .mk-eyebrow {
  gap: 8px;
}

.mk-account-hero .mk-eyebrow svg {
  width: 16px;
  height: 16px;
}

.mk-account-hero p {
  margin-right: 0;
  margin-left: 0;
}

.mk-account-section {
  background: linear-gradient(180deg, rgba(79, 199, 183, 0.03), rgba(79, 199, 183, 0.01));
  padding: 0 0 84px;
}

.mk-account-dashboard {
  display: grid;
  align-items: start;
  gap: 32px;
  grid-template-columns: 300px minmax(0, 1fr);
}

.mk-account-sidebar,
.mk-account-panel {
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(36, 109, 116, 0.08);
}

.mk-account-sidebar {
  position: sticky;
  top: 96px;
  padding: 24px;
}

.mk-account-profile {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.mk-account-avatar {
  display: inline-flex;
  width: 56px;
  height: 56px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: linear-gradient(145deg, var(--mk-primary), var(--mk-primary-dark));
  color: #fff;
}

.mk-account-avatar svg {
  width: 28px;
  height: 28px;
}

.mk-account-profile p {
  margin: 0;
  color: var(--mk-muted);
  font-size: 14px;
}

.mk-account-profile h2 {
  margin: 2px 0 0;
  overflow-wrap: anywhere;
  font-size: 20px;
  font-weight: 900;
  line-height: 1.2;
}

.mk-account-menu {
  display: grid;
  gap: 8px;
}

.mk-account-menu button {
  display: grid;
  width: 100%;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 2px 12px;
  align-items: center;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 14px;
  color: var(--mk-text);
  font: inherit;
  text-align: left;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.mk-account-menu button:hover,
.mk-account-menu button.is-active {
  border-color: var(--mk-primary);
  background: #e0f7f4;
  color: var(--mk-primary-dark);
}

.mk-account-menu button:hover {
  transform: translateY(-2px);
}

.mk-account-menu button > span {
  display: inline-flex;
  width: 40px;
  height: 40px;
  grid-row: span 2;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  color: var(--mk-primary-dark);
}

.mk-account-menu button.is-active > span {
  background: rgba(79, 199, 183, 0.2);
}

.mk-account-menu svg,
.mk-account-logout svg {
  width: 20px;
  height: 20px;
}

.mk-account-menu strong,
.mk-account-menu small {
  min-width: 0;
}

.mk-account-menu strong {
  font-weight: 900;
}

.mk-account-menu small {
  color: var(--mk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.mk-account-logout {
  display: flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 24px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  color: var(--mk-muted);
  font-weight: 800;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.mk-account-logout:hover {
  border-color: rgba(239, 93, 93, 0.3);
  background: rgba(239, 93, 93, 0.08);
  color: var(--mk-danger);
}

.mk-account-panels {
  min-width: 0;
}

.mk-account-panel {
  padding: 24px;
}

.mk-account-panel[hidden] {
  display: none;
}

.mk-account-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 24px;
}

.mk-account-pill,
.mk-account-status {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  border-radius: 999px;
  font-weight: 900;
}

.mk-account-pill {
  background: rgba(79, 199, 183, 0.15);
  padding: 8px 14px;
  color: var(--mk-primary-dark);
  font-size: 14px;
}

.mk-account-panel__head h2 {
  margin: 12px 0 0;
  font-size: 26px;
  font-weight: 900;
  line-height: 1.2;
}

.mk-account-list {
  display: grid;
  gap: 16px;
}

.mk-account-order {
  display: grid;
  width: 100%;
  align-items: center;
  gap: 16px;
  grid-template-columns: 64px minmax(0, 1fr) auto auto;
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  padding: 20px;
  color: var(--mk-text);
  font: inherit;
  text-align: left;
  transition: border-color 0.24s ease, box-shadow 0.24s ease, transform 0.24s ease;
}

.mk-account-order:hover,
.mk-address-card:hover,
.mk-security-card:hover {
  border-color: rgba(79, 199, 183, 0.5);
  box-shadow: 0 12px 35px rgba(36, 109, 116, 0.08);
  transform: translateY(-2px);
}

.mk-account-order__icon,
.mk-security-card > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: linear-gradient(140deg, #f6fbfa, #dff3f0);
  color: rgba(79, 199, 183, 0.5);
}

.mk-account-order__icon {
  width: 64px;
  height: 64px;
}

.mk-account-order__icon svg {
  width: 32px;
  height: 32px;
}

.mk-account-order__main {
  min-width: 0;
}

.mk-account-status {
  gap: 6px;
  background: rgba(79, 199, 183, 0.15);
  padding: 5px 10px;
  color: var(--mk-primary-dark);
  font-size: 12px;
  font-style: normal;
}

.mk-account-status svg {
  width: 12px;
  height: 12px;
}

.mk-account-status--shipping {
  background: rgba(255, 216, 107, 0.24);
  color: #b89830;
}

.mk-account-order strong {
  display: block;
  margin-top: 8px;
  font-size: 16px;
  font-weight: 900;
}

.mk-account-order small {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 6px;
  color: var(--mk-muted);
  line-height: 1.65;
  overflow-wrap: anywhere;
}

.mk-account-order small svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.mk-account-order__amount {
  color: var(--mk-primary-dark);
  font-size: 20px;
  font-weight: 900;
  white-space: nowrap;
}

.mk-account-order__arrow {
  display: inline-flex;
  width: 22px;
  height: 22px;
  align-items: center;
  justify-content: center;
  color: var(--mk-muted);
}

.mk-account-order__arrow svg {
  width: 20px;
  height: 20px;
}

.mk-address-list {
  display: grid;
  gap: 16px;
}

.mk-security-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mk-address-card,
.mk-security-card {
  position: relative;
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  padding: 20px;
  transition: border-color 0.24s ease, box-shadow 0.24s ease, transform 0.24s ease;
}

.mk-address-card.is-default {
  border-color: var(--mk-primary);
  background: rgba(79, 199, 183, 0.05);
}

.mk-address-card__tag {
  position: absolute;
  top: 16px;
  right: 16px;
  display: inline-flex;
  border-radius: 999px;
  background: var(--mk-primary);
  padding: 5px 10px;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
}

.mk-address-card__body {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.mk-address-card__icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary);
}

.mk-address-card__icon svg {
  width: 20px;
  height: 20px;
}

.mk-address-card h3,
.mk-security-card h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 900;
}

.mk-address-card h3 small {
  margin-left: 10px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 700;
}

.mk-address-card p,
.mk-security-card p {
  margin: 10px 0 0;
  color: var(--mk-muted);
  line-height: 1.7;
}

.mk-address-card strong {
  display: block;
  margin-top: 4px;
  color: var(--mk-text);
  font-size: 15px;
  line-height: 1.6;
}

.mk-address-actions {
  display: flex;
  gap: 18px;
  margin-top: 18px;
  border-top: 1px solid var(--mk-line);
  padding-top: 14px;
}

.mk-address-actions a {
  color: var(--mk-primary-dark);
  font-weight: 900;
  font-size: 14px;
}

.mk-security-card > span {
  width: 44px;
  height: 44px;
}

.mk-security-card svg {
  width: 22px;
  height: 22px;
}

.mk-security-card .mk-btn {
  width: 100%;
  margin-top: 20px;
}

.mk-account-mini-form {
  display: grid;
  gap: 16px;
  margin-top: 18px;
}

.mk-account-mini-form input {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 10px 12px;
  color: var(--mk-text);
  font: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mk-account-mini-form input:focus {
  border-color: var(--mk-primary);
  box-shadow: 0 0 0 4px rgba(79, 199, 183, 0.15);
}

.mk-account-mini-form .mk-btn {
  margin-top: 0;
}

.mk-security-tips {
  margin-top: 24px;
  border: 1px solid rgba(79, 199, 183, 0.2);
  border-radius: 12px;
  background: rgba(79, 199, 183, 0.05);
  padding: 20px;
}

.mk-security-tips > div {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--mk-primary-dark);
}

.mk-security-tips svg {
  width: 20px;
  height: 20px;
}

.mk-security-tips h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 900;
}

.mk-security-tips ul {
  display: grid;
  gap: 8px;
  margin: 12px 0 0;
  padding: 0;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.6;
  list-style: none;
}

.mk-security-tips li::before {
  content: "•";
  margin-right: 8px;
  color: var(--mk-primary);
  font-weight: 900;
}

.mk-order-drawer .mk-drawer__panel {
  width: min(480px, 100%);
}

.mk-order-drawer .mk-drawer__header {
  justify-content: space-between;
}

.mk-order-drawer .mk-drawer__header > div {
  flex: 1 1 auto;
  min-width: 0;
}

.mk-order-drawer .mk-drawer__header p {
  margin: 2px 0 0;
  color: var(--mk-muted);
  font-size: 12px;
}

.mk-order-drawer .mk-drawer__body {
  display: grid;
  gap: 20px;
}

.mk-order-drawer__status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--mk-soft);
  padding: 16px 24px;
}

.mk-order-drawer__status.is-shipping {
  background: #fffbeb;
}

.mk-order-drawer__status span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  background: rgba(79, 199, 183, 0.2);
  padding: 7px 12px;
  color: var(--mk-primary-dark);
  font-size: 14px;
  font-weight: 900;
}

.mk-order-drawer__status.is-shipping span {
  background: rgba(255, 216, 107, 0.3);
  color: #b89830;
}

.mk-order-drawer__status svg {
  width: 16px;
  height: 16px;
}

.mk-order-drawer__status strong {
  color: var(--mk-primary-dark);
  font-size: 22px;
  font-weight: 900;
}

.mk-order-detail-card {
  border: 1px solid var(--mk-line);
  border-radius: 12px;
  background: #fff;
  padding: 16px;
}

.mk-order-detail-card.is-soft {
  background: #f6fbfa;
}

.mk-order-detail-card h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  color: var(--mk-muted);
  font-size: 14px;
  font-weight: 900;
}

.mk-order-detail-card h3 svg {
  width: 16px;
  height: 16px;
  color: var(--mk-primary);
}

.mk-order-product {
  display: flex;
  align-items: center;
  gap: 16px;
}

.mk-order-product > span {
  display: inline-flex;
  width: 64px;
  height: 64px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: var(--mk-radius);
  background: #fff;
  color: rgba(79, 199, 183, 0.45);
}

.mk-order-product > span svg {
  width: 32px;
  height: 32px;
}

.mk-order-product h4 {
  margin: 0;
  overflow-wrap: anywhere;
  font-size: 16px;
  font-weight: 900;
}

.mk-order-product p {
  margin: 4px 0 0;
  color: var(--mk-muted);
  font-size: 14px;
}

.mk-order-product b {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 4px;
  color: var(--mk-primary-dark);
}

.mk-order-product small {
  color: var(--mk-muted);
  font-weight: 700;
}

.mk-order-detail-card dl {
  display: grid;
  gap: 10px 16px;
  grid-template-columns: 64px minmax(0, 1fr);
  margin: 0;
  font-size: 14px;
}

.mk-order-detail-card dt {
  color: var(--mk-muted);
}

.mk-order-detail-card dd {
  min-width: 0;
  margin: 0;
  color: var(--mk-text);
  font-weight: 800;
  line-height: 1.6;
}

.mk-order-detail-card .is-price {
  grid-template-columns: minmax(0, 1fr) auto;
}

.mk-order-detail-card .is-price dt:nth-last-of-type(1),
.mk-order-detail-card .is-price dd:nth-last-of-type(1) {
  border-top: 1px solid var(--mk-line);
  padding-top: 10px;
}

.mk-order-detail-card .is-price dt:nth-last-of-type(1) {
  color: var(--mk-text);
  font-weight: 900;
}

.mk-order-detail-card .is-price dd:nth-last-of-type(1) {
  color: var(--mk-primary-dark);
  font-weight: 900;
}

.mk-order-tracking {
  margin: -4px 0 16px;
  color: var(--mk-muted);
  font-size: 12px;
}

.mk-order-timeline {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mk-order-timeline li {
  position: relative;
  min-height: 44px;
  padding: 0 0 16px 26px;
  color: var(--mk-muted);
  font-size: 14px;
  line-height: 1.45;
}

.mk-order-timeline li:last-child {
  min-height: 0;
  padding-bottom: 0;
}

.mk-order-timeline li::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 0;
  z-index: 1;
  width: 14px;
  height: 14px;
  border: 2px solid var(--mk-line);
  border-radius: 50%;
  background: #fff;
}

.mk-order-timeline li::after {
  content: "";
  position: absolute;
  top: 16px;
  bottom: 0;
  left: 6px;
  width: 2px;
  background: var(--mk-line);
}

.mk-order-timeline li:first-child::before {
  border-color: var(--mk-primary);
  background: var(--mk-primary);
}

.mk-order-timeline li:last-child::after {
  display: none;
}

.mk-order-timeline strong {
  color: var(--mk-text);
  font-weight: 900;
}

.mk-order-timeline time {
  display: block;
  margin-top: 3px;
  color: var(--mk-muted);
  font-size: 12px;
}

.mk-order-drawer__actions {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--mk-line);
  padding: 16px 24px;
}

.mk-order-drawer__actions .mk-btn {
  width: 100%;
  justify-content: center;
}

.mk-order-drawer__actions .mk-btn--primary {
  grid-column: 1 / -1;
}

.mk-page--auth {
  background:
    linear-gradient(135deg, rgba(79, 199, 183, 0.13), rgba(255, 255, 255, 0.92) 48%, rgba(247, 184, 200, 0.16)),
    linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 216, 107, 0.08));
}

.mk-auth-shell {
  position: relative;
  overflow: hidden;
  padding: 148px 0 96px;
}

.mk-auth-shell::before {
  content: "";
  position: absolute;
  inset: -18% -12%;
  opacity: 0.58;
  background:
    linear-gradient(112deg, transparent 0 18%, rgba(79, 199, 183, 0.14) 30%, transparent 46%, rgba(247, 184, 200, 0.13) 68%, transparent 86%),
    repeating-linear-gradient(90deg, rgba(79, 199, 183, 0.08) 0 1px, transparent 1px 96px);
  pointer-events: none;
}

.mk-auth-grid {
  position: relative;
  z-index: 1;
  display: grid;
  align-items: center;
  gap: clamp(32px, 6vw, 76px);
  grid-template-columns: minmax(0, 0.95fr) minmax(360px, 0.75fr);
}

.mk-auth-copy h1 {
  max-width: 720px;
  margin: 24px 0 0;
  font-size: clamp(36px, 5.2vw, 58px);
  font-weight: 900;
  line-height: 1.12;
}

.mk-auth-copy p {
  max-width: 620px;
  margin: 22px 0 0;
  color: var(--mk-muted);
  font-size: 18px;
  line-height: 1.78;
}

.mk-auth-points {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 32px;
}

.mk-auth-points span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: rgba(255, 255, 255, 0.78);
  padding: 10px 12px;
  color: var(--mk-text);
  font-size: 14px;
  font-weight: 800;
}

.mk-auth-points svg {
  width: 18px;
  height: 18px;
  color: var(--mk-primary-dark);
}

.mk-auth-card {
  border: 1px solid rgba(217, 236, 233, 0.95);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  padding: clamp(24px, 3.5vw, 34px);
  box-shadow: var(--mk-shadow);
  backdrop-filter: blur(16px);
}

.mk-auth-card__head h2 {
  margin: 18px 0 0;
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 900;
  line-height: 1.15;
}

.mk-auth-card__head p {
  margin: 12px 0 0;
  color: var(--mk-muted);
  line-height: 1.75;
}

.mk-auth-alert {
  margin-top: 18px;
  border: 1px solid rgba(79, 199, 183, 0.28);
  border-radius: var(--mk-radius);
  background: rgba(79, 199, 183, 0.08);
  padding: 12px 14px;
  color: var(--mk-primary-dark);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.55;
}

.mk-auth-alert--danger {
  border-color: rgba(239, 93, 93, 0.25);
  background: rgba(239, 93, 93, 0.08);
  color: #b93d3d;
}

.mk-register-form {
  display: grid;
  gap: 16px;
  margin-top: 26px;
}

.mk-register-form label {
  display: grid;
  gap: 8px;
}

.mk-register-form label > span:first-child,
.mk-register-agreement,
.mk-auth-switch {
  color: var(--mk-text);
  font-size: 14px;
  font-weight: 800;
}

.mk-register-form small {
  color: var(--mk-muted);
  font-size: 12px;
  line-height: 1.55;
}

.mk-form-error {
  color: var(--mk-danger);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.mk-register-code {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.mk-register-code .mk-btn {
  min-width: 116px;
  min-height: 42px;
  padding-right: 14px;
  padding-left: 14px;
  white-space: nowrap;
}

.mk-register-code .mk-btn:disabled,
.mk-register-submit:disabled {
  cursor: not-allowed;
  opacity: 0.72;
  transform: none;
}

.mk-register-agreement {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  line-height: 1.65;
}

.mk-register-agreement input {
  width: 16px;
  height: 16px;
  margin-top: 3px;
  accent-color: var(--mk-primary);
}

.mk-register-agreement label {
  display: inline;
  font-weight: 700;
}

.mk-register-agreement a,
.mk-auth-switch a {
  color: var(--mk-primary-dark);
  font-weight: 900;
}

.mk-register-submit {
  width: 100%;
  min-height: 48px;
}

.mk-auth-switch {
  margin: 18px 0 0;
  text-align: center;
}

.mk-login-hero {
  padding-bottom: 48px;
}

.mk-login-section {
  background: linear-gradient(180deg, rgba(79, 199, 183, 0.03), rgba(79, 199, 183, 0.01));
  padding: 0 0 84px;
}

.mk-login-card {
  max-width: 448px;
  margin: 0 auto;
}

.mk-login-tabs {
  display: inline-flex;
  width: 100%;
  align-items: center;
  gap: 4px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: var(--mk-soft);
  padding: 4px;
}

.mk-login-tabs a,
.mk-login-tabs button {
  flex: 1 1 0;
  border: 0;
  border-radius: var(--mk-radius);
  background: transparent;
  padding: 10px 12px;
  color: var(--mk-muted);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.mk-login-tabs a:hover,
.mk-login-tabs a.is-active,
.mk-login-tabs button:hover,
.mk-login-tabs button.is-active {
  background: #fff;
  color: var(--mk-primary-dark);
  box-shadow: 0 8px 18px rgba(31, 45, 56, 0.06);
}

.mk-login-tabs a.is-disabled {
  cursor: default;
  opacity: 0.72;
  pointer-events: none;
}

.mk-login-form {
  display: grid;
  gap: 18px;
  margin-top: 24px;
}

.mk-login-form[hidden] {
  display: none;
}

.mk-login-field {
  display: grid;
  gap: 8px;
}

.mk-login-field span,
.mk-login-form label,
.mk-login-form .form-item > label,
.mk-login-form .form-label-group label {
  color: var(--mk-text);
  font-size: 14px;
  font-weight: 800;
}

.mk-login-form .form-item {
  display: grid;
  gap: 8px;
  margin: 0;
}

.mk-login-form .form-label-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.mk-login-form .form-item-extra-link,
.mk-login-extra a {
  color: var(--mk-primary-dark);
  font-size: 13px;
  font-weight: 800;
}

.mk-login-form .form-input,
.mk-login-form .form-input-group {
  width: 100%;
}

.mk-login-form .form-input input,
.mk-login-form input[type="text"],
.mk-login-form input[type="email"],
.mk-login-form input[type="password"],
.mk-login-form input[type="tel"] {
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 11px 14px;
  color: var(--mk-text);
  font: inherit;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mk-login-form .form-input input:focus,
.mk-login-form input:focus {
  border-color: var(--mk-primary);
  box-shadow: 0 0 0 4px rgba(79, 199, 183, 0.15);
}

.mk-login-form .form-input-group {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.mk-login-code {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.mk-login-form .form-input-group button,
.mk-login-form button:not(.mk-login-submit) {
  min-height: 48px;
  border: 1px solid rgba(79, 199, 183, 0.35);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 10px 14px;
  color: var(--mk-primary-dark);
  font: inherit;
  font-weight: 800;
}

.mk-login-code .mk-btn {
  min-width: 116px;
  padding-right: 14px;
  padding-left: 14px;
  white-space: nowrap;
}

.mk-login-code .mk-btn:disabled {
  cursor: not-allowed;
  opacity: 0.72;
  transform: none;
}

.mk-login-extra {
  margin-top: -6px;
  text-align: right;
}

.mk-login-remember {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--mk-muted);
}

.mk-login-remember input {
  width: 16px;
  height: 16px;
  accent-color: var(--mk-primary);
}

.mk-login-submit {
  width: 100%;
  min-height: 48px;
}

.mk-auth-providers .divider-wrapper {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 22px 0 14px;
  color: var(--mk-muted);
  font-size: 13px;
  font-weight: 700;
}

.mk-auth-providers .divider-wrapper hr {
  flex: 1 1 0;
  border: 0;
  border-top: 1px solid var(--mk-line);
}

.mk-auth-providers .pill-items {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.mk-auth-providers .pill-items a,
.mk-auth-providers .pill-items button {
  display: flex;
  width: 100%;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--mk-line);
  border-radius: var(--mk-radius);
  background: #fff;
  color: var(--mk-text);
  font: inherit;
  font-weight: 800;
}

.mk-auth-providers .pill-items img {
  width: 20px;
  height: 20px;
}

.mk-login-return {
  margin: 12px 0 0;
  text-align: center;
}

.mk-login-return a {
  color: var(--mk-muted);
  font-size: 13px;
  font-weight: 800;
}

.mk-login-toast {
  position: fixed;
  top: 96px;
  left: 50%;
  z-index: 80;
  max-width: calc(100% - 32px);
  border: 1px solid rgba(79, 199, 183, 0.3);
  border-radius: var(--mk-radius);
  background: #fff;
  padding: 12px 18px;
  color: var(--mk-primary-dark);
  font-size: 14px;
  font-weight: 900;
  box-shadow: var(--mk-shadow);
  opacity: 0;
  transform: translate(-50%, -12px);
  pointer-events: none;
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.mk-login-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}

.mk-login-toast.is-danger {
  border-color: rgba(239, 93, 93, 0.25);
  background: #fff8f8;
  color: #b93d3d;
}

/* 关于我们页：首屏和内容结构按本地预览重建，下面这些样式只作用于 about 页面专用类。 */
.mk-about-main,
.mk-about-main .mk-section {
  background: var(--mk-soft-2);
}

.mk-about-main .mk-section {
  padding: 96px 0;
}

.mk-about-social-section {
  padding-top: 80px;
  padding-bottom: 80px;
}

.mk-about-hero {
  overflow: hidden;
  padding-top: 232px;
  padding-bottom: 96px;
  background: var(--mk-soft-2);
}

.mk-about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top right, rgba(79, 199, 183, 0.08), transparent 60%);
  pointer-events: none;
}

.mk-about-hero > .mk-container {
  position: relative;
  z-index: 1;
}

.mk-about-hero .mk-center {
  display: block;
  max-width: 760px;
  margin-top: 0;
}

.mk-about-hero h1 {
  font-size: clamp(36px, 6vw, 56px);
  line-height: 1.1;
}

.mk-about-hero p {
  max-width: 672px;
  margin-top: 24px;
}

.mk-about-hero .mk-stats {
  gap: 20px;
  margin-top: 64px;
}

.mk-about-hero .mk-stats--cards article {
  background: rgba(255, 255, 255, 0.82);
  border-radius: 16px;
  padding: 28px 20px;
  backdrop-filter: blur(10px);
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.mk-about-hero .mk-stats--cards article:hover {
  border-color: rgba(79, 199, 183, 0.45);
  box-shadow: var(--mk-shadow);
  transform: translateY(-6px);
}

.mk-about-hero .mk-stats--cards strong {
  font-size: clamp(36px, 5vw, 48px);
}

.mk-about-hero .mk-stats--cards strong .mk-stat-value {
  display: inline;
  margin: 0;
  color: inherit;
  font: inherit;
}

.mk-about-hero .mk-stats--cards strong .mk-stat-suffix {
  display: inline;
  margin: 0;
  color: inherit;
  font-size: 16px;
  font-weight: 800;
}

.mk-about-strength-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 40px;
}

.mk-about-heading {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 48px;
}

.mk-about-heading h2 {
  font-size: clamp(28px, 4vw, 40px);
}

.mk-about-heading p {
  max-width: 672px;
  margin-top: 14px;
}

.mk-about-strength-head .mk-about-heading {
  margin-bottom: 0;
}

.mk-about-strength-head .mk-about-heading p {
  max-width: 448px;
}

.mk-section-icon {
  display: inline-flex;
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary);
}

.mk-section-icon svg {
  width: 24px;
  height: 24px;
}

.mk-about-kicker {
  display: block;
  margin-bottom: 4px;
  color: var(--mk-primary);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.mk-strength-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 16px;
  max-width: 620px;
}

.mk-strength-badges article {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--mk-line);
  border-radius: 999px;
  background: #fff;
  padding: 8px 16px;
}

.mk-strength-badges article > span {
  display: inline-flex;
  width: 32px;
  height: 32px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(79, 199, 183, 0.1);
  color: var(--mk-primary);
}

.mk-strength-badges svg {
  width: 16px;
  height: 16px;
}

.mk-strength-badges strong,
.mk-strength-badges em {
  display: block;
  font-style: normal;
}

.mk-strength-badges strong {
  color: var(--mk-text);
  font-size: 14px;
  font-weight: 900;
  line-height: 1.1;
}

.mk-strength-badges small {
  font-size: 12px;
}

.mk-strength-badges em {
  margin-top: 2px;
  color: var(--mk-muted);
  font-size: 12px;
  line-height: 1.2;
}

.mk-factory-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mk-factory-grid__top {
  display: grid;
  align-items: stretch;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mk-factory-grid__tiles {
  display: grid;
  align-content: start;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mk-factory-grid figure {
  position: relative;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(135deg, #eef9f7 0%, #d9f0ed 100%);
}

.mk-factory-grid figure::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.6), transparent 58%);
  pointer-events: none;
}

.mk-factory-grid__main {
  grid-row: span 2;
  height: 100%;
  min-height: 320px;
}

.mk-factory-grid__tiles figure {
  aspect-ratio: 4 / 3;
}

.mk-factory-grid__wide {
  aspect-ratio: 21 / 4;
}

.mk-factory-grid img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.mk-factory-grid figure:hover img {
  transform: scale(1.05);
}

.mk-factory-grid figcaption {
  position: absolute;
  bottom: 16px;
  left: 16px;
  z-index: 1;
  padding: 0;
  background: transparent;
  color: #fff;
}

.mk-factory-grid figcaption strong,
.mk-factory-grid figcaption span {
  display: block;
}

.mk-factory-grid figcaption strong {
  font-size: 18px;
  font-weight: 800;
}

.mk-factory-grid figcaption span {
  margin-top: 2px;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
}

.mk-factory-grid__tiles figcaption {
  bottom: 12px;
  left: 12px;
  padding: 0;
}

.mk-factory-grid__tiles figcaption strong {
  font-size: 14px;
}

.mk-factory-grid__tiles figcaption span {
  font-size: 12px;
}

.mk-cert-grid,
.mk-recognition-grid {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 0;
}

.mk-cert-card,
.mk-recognition-card {
  text-align: center;
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.mk-cert-card {
  padding: 24px;
  border-radius: 16px;
}

.mk-cert-card__image,
.mk-recognition-card__image {
  overflow: hidden;
  border-radius: 12px;
  background: #f4faf9;
}

.mk-cert-card__image {
  aspect-ratio: 3 / 4;
  margin-bottom: 20px;
}

.mk-cert-card__image img,
.mk-recognition-card__image img {
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
}

.mk-cert-card__image img {
  object-fit: contain;
  padding: 8px;
}

.mk-cert-card:hover img,
.mk-recognition-card:hover img {
  transform: scale(1.05);
}

.mk-cert-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
  color: var(--mk-primary);
  font-size: 12px;
  font-weight: 900;
}

.mk-cert-status svg {
  width: 16px;
  height: 16px;
}

.mk-cert-card h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 900;
}

.mk-cert-card p,
.mk-recognition-card p {
  color: var(--mk-muted);
  font-size: 14px;
}

.mk-cert-card p {
  margin: 4px 0 0;
}

.mk-recognition-grid {
  gap: 16px;
  margin-top: 0;
}

.mk-recognition-card {
  border-radius: 16px;
  padding: 12px;
}

.mk-recognition-card__image {
  aspect-ratio: 3 / 4;
}

.mk-recognition-card__image img {
  object-fit: cover;
}

.mk-recognition-card--contain .mk-recognition-card__image img {
  object-fit: contain;
}

.mk-recognition-card p {
  margin: 12px 0 0;
  color: var(--mk-text);
  font-weight: 800;
}

.mk-row-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 24px;
}

.mk-recognition-grid + .mk-row-heading {
  margin-top: 64px;
}

.mk-row-heading span {
  display: inline-flex;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  background: rgba(255, 216, 107, 0.22);
  color: #b89830;
}

.mk-row-heading .mk-row-heading__red {
  background: rgba(255, 107, 107, 0.15);
  color: #e05555;
}

.mk-row-heading svg {
  width: 20px;
  height: 20px;
}

.mk-row-heading h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 900;
}

.mk-social-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 64px;
  align-items: flex-start;
  margin-top: 0;
}

.mk-social-grid .mk-social-card {
  display: flex;
  width: auto;
  height: auto;
  align-items: center;
  flex-direction: column;
  gap: 12px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--mk-text);
  font-weight: 900;
  text-align: center;
  transition: transform 0.24s ease;
}

.mk-social-grid .mk-social-card:hover {
  transform: translateY(-8px);
}

.mk-social-icon {
  display: inline-flex;
  width: 80px;
  height: 80px;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  color: #fff;
  box-shadow: 0 12px 30px rgba(31, 45, 56, 0.1);
}

.mk-social-icon svg {
  width: 40px;
  height: 40px;
}

.mk-social-icon--xiaohongshu {
  background: #fe2c55;
  font-size: 22px;
}

.mk-social-icon--douyin {
  background: #000;
}

.mk-social-icon--weibo {
  background: linear-gradient(135deg, #ff8200, #ffd500);
}

.mk-social-grid strong,
.mk-social-grid span:not(.mk-social-icon) {
  display: block;
}

.mk-social-grid strong {
  line-height: 1;
}

.mk-social-grid span:not(.mk-social-icon) {
  color: var(--mk-muted);
  font-size: 13px;
  font-weight: 400;
}

.mk-doc,
.mk-list-page,
.mk-empty {
  padding: 140px 0 80px;
}

.mk-post {
  max-width: 860px;
  margin: 0 auto;
  padding: 36px;
}

.mk-post h1,
.mk-list-page h1,
.mk-empty h1 {
  margin-top: 0;
  font-size: clamp(34px, 5vw, 52px);
}

.mk-post__meta {
  color: var(--mk-muted);
}

.mk-post__content {
  color: var(--mk-text);
  line-height: 1.85;
}

.mk-post__content img {
  border-radius: var(--mk-radius);
}

.mk-post-list {
  display: grid;
  gap: 16px;
}

.mk-list-card {
  padding: 22px;
}

.mk-list-card h2 {
  margin: 0 0 8px;
  font-size: 24px;
}

.mk-list-card p {
  margin: 0;
  color: var(--mk-muted);
}

.mk-empty {
  min-height: 70vh;
  text-align: center;
}

.mk-footer {
  background: #17262c;
  padding: 56px 0;
  color: #eaf8f6;
}

.mk-footer__grid {
  display: grid;
  gap: 36px;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
}

.mk-footer h3 {
  margin: 0 0 12px;
  font-size: 28px;
}

.mk-footer h4 {
  margin: 0 0 12px;
}

.mk-footer p,
.mk-footer a,
.mk-footer span {
  display: block;
  color: rgba(234, 248, 246, 0.7);
  font-size: 14px;
  line-height: 1.8;
}

.mk-footer a:hover {
  color: var(--mk-primary);
}

.mk-footer__bottom {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 36px;
  border-top: 1px solid rgba(234, 248, 246, 0.1);
  padding-top: 24px;
}

.mk-reveal {
  opacity: 0;
  transform: translateY(36px);
  filter: blur(4px);
  transition: opacity 0.72s cubic-bezier(0.22, 1, 0.36, 1), transform 0.72s cubic-bezier(0.22, 1, 0.36, 1), filter 0.72s cubic-bezier(0.22, 1, 0.36, 1);
}

.mk-reveal--left {
  transform: translateX(-48px);
}

.mk-reveal--right {
  transform: translateX(48px);
}

.mk-reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0);
  filter: blur(0);
}

@media (max-width: 960px) {
  .mk-hero__grid,
  .mk-split,
  .mk-two-col,
  .mk-product-detail__grid {
    grid-template-columns: 1fr;
  }

  .mk-product-buy {
    height: auto;
  }

  .mk-shop-hero .mk-hero__grid {
    grid-template-columns: 1fr;
  }

  .mk-verify-grid {
    grid-template-columns: 1fr;
  }

  .mk-account-dashboard {
    grid-template-columns: 1fr;
  }

  .mk-account-sidebar {
    position: static;
  }

  .mk-auth-grid {
    grid-template-columns: 1fr;
  }

  .mk-product-grid,
  .mk-partner-grid,
  .mk-cert-grid,
  .mk-recognition-grid,
  .mk-icon-grid--four,
  .mk-stats,
  .mk-account-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mk-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mk-shop-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .mk-heading--feature,
  .mk-heading--feature-reverse {
    display: block;
    width: auto;
    margin-right: auto;
    margin-left: auto;
  }

  .mk-heading--feature-reverse .mk-eyebrow {
    order: initial;
  }

  .mk-partner-layout {
    gap: 48px;
  }

  .mk-about-strength-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .mk-strength-badges {
    justify-content: flex-start;
  }
}

@media (max-width: 820px) {
  .mk-header,
  .mk-header__inner {
    height: 68px;
  }

  .mk-nav {
    position: fixed;
    top: 68px;
    right: 12px;
    left: 12px;
    display: none;
    flex-direction: column;
    align-items: stretch;
    border: 1px solid var(--mk-line);
    border-radius: var(--mk-radius);
    background: rgba(255, 255, 255, 0.96);
    padding: 8px;
    box-shadow: var(--mk-shadow);
  }

  .mk-header.is-menu-open .mk-nav {
    display: flex;
  }

  .mk-menu-button {
    display: inline-flex;
  }

  .mk-verify-search {
    display: grid;
    grid-template-columns: 1fr;
  }

  .mk-verify-search .mk-btn {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .mk-partner-grid {
    grid-template-columns: 1fr;
  }

  .mk-factory-grid__top {
    grid-template-columns: 1fr;
  }

  .mk-factory-grid__tiles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mk-factory-grid__main {
    grid-row: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }

  .mk-factory-grid__wide {
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 640px) {
  .mk-container {
    width: calc(100% - 28px);
  }

  .mk-hero,
  .mk-inner-hero {
    padding-top: 108px;
  }

  .mk-partner-hero {
    padding-top: 232px;
    padding-bottom: 80px;
  }

  .mk-partner-hero .mk-partner-grid {
    margin-top: 64px;
  }

  .mk-about-hero {
    padding-top: 232px;
    padding-bottom: 96px;
  }

  .mk-hero__title,
  .mk-hero h1,
  .mk-inner-hero h1 {
    font-size: 38px;
  }

  .mk-product-grid,
  .mk-partner-grid,
  .mk-icon-grid,
  .mk-icon-grid--four,
  .mk-stats,
  .mk-account-grid,
  .mk-steps,
  .mk-banner-grid,
  .mk-footer__grid,
  .mk-factory-grid {
    grid-template-columns: 1fr;
  }

  .mk-cert-grid,
  .mk-recognition-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mk-cert-grid {
    grid-template-columns: 1fr;
  }

  .mk-about-heading {
    gap: 10px;
  }

  .mk-section-icon {
    width: 42px;
    height: 42px;
  }

  .mk-strength-badges {
    gap: 10px;
  }

  .mk-shop-products.is-list .mk-product-card {
    grid-template-columns: 1fr;
  }

  .mk-shop-products.is-list .mk-product-card__media-link {
    min-height: auto;
  }

  .mk-search-form,
  .mk-form__grid,
  .mk-account-panel__head,
  .mk-footer__bottom {
    flex-direction: column;
    grid-template-columns: 1fr;
  }

  .mk-account-panel__head {
    align-items: stretch;
  }

  .mk-account-order {
    align-items: start;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    padding: 16px;
  }

  .mk-account-order__icon {
    width: 52px;
    height: 52px;
  }

  .mk-account-order__icon svg {
    width: 26px;
    height: 26px;
  }

  .mk-account-order__amount {
    grid-column: 2;
    font-size: 16px;
  }

  .mk-account-order__arrow {
    grid-column: 3;
    grid-row: 1;
  }

  .mk-address-list,
  .mk-address-grid,
  .mk-security-grid {
    grid-template-columns: 1fr;
  }

  .mk-address-card__body {
    gap: 12px;
  }

  .mk-address-card h3 small {
    display: block;
    margin: 4px 0 0;
  }

  .mk-address-actions {
    flex-wrap: wrap;
  }

  .mk-order-drawer__actions {
    grid-template-columns: 1fr;
  }

  .mk-order-drawer__actions .mk-btn--primary {
    grid-column: auto;
  }

  .mk-partner-type__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mk-partner-type__grid button {
    min-width: 0;
  }

  .mk-partner-section {
    padding: 80px 0;
  }

  .mk-auth-shell {
    padding-top: 116px;
    padding-bottom: 72px;
  }

  .mk-auth-copy h1 {
    font-size: 38px;
  }

  .mk-auth-copy p {
    font-size: 16px;
  }

  .mk-register-code {
    grid-template-columns: 1fr;
  }

  .mk-register-code .mk-btn {
    width: 100%;
  }

  .mk-login-section {
    padding-bottom: 72px;
  }

  .mk-login-form .form-input-group {
    grid-template-columns: 1fr;
  }

  .mk-login-code {
    grid-template-columns: 1fr;
  }

  .mk-login-code .mk-btn {
    width: 100%;
  }

  .mk-contact-panel article {
    padding: 18px;
  }

  .mk-search-form {
    display: grid;
  }

  .mk-verify-hero {
    padding-top: 128px;
    padding-bottom: 60px;
  }

  .mk-verify-hero h1 {
    font-size: 38px;
  }

  .mk-verify-search {
    margin-top: 32px;
  }

  .mk-verify-search .mk-btn {
    width: 100%;
  }

  .mk-result-content {
    gap: 10px;
  }

  .mk-result-grid {
    grid-template-columns: 1fr;
  }

  .mk-verify-steps {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .mk-step-arrow {
    display: none;
  }

  .mk-step-card {
    padding: 18px;
  }

  .mk-verify-content {
    padding-top: 48px;
  }

  .mk-verify-proof-card,
  .mk-verify-faq-card {
    padding: 20px;
  }

  .mk-verify-proof-card .mk-proof-card__body {
    grid-template-columns: 1fr;
  }

  .mk-proof-card__badge {
    min-height: 220px;
    padding: 24px 18px;
  }

  .mk-verify-proof-card .mk-proof-card dl {
    gap: 12px 18px;
    grid-template-columns: auto 1fr;
    padding: 24px 20px;
  }

  .mk-verify-faq-card .mk-faq-button .mk-faq-button__copy span {
    white-space: normal;
  }

  .mk-drawer__header,
  .mk-drawer__body {
    padding-right: 20px;
    padding-left: 20px;
  }

  .mk-filter--segments,
  .mk-view-switch {
    width: 100%;
  }

  .mk-checkout-hero {
    padding-top: 112px;
    padding-bottom: 44px;
  }

  .mk-checkout-hero__copy h1 {
    font-size: 36px;
  }

  .mk-checkout-hero__copy p {
    font-size: 15px;
  }

  .mk-checkout-progress,
  .mk-payment-safe-card,
  .mk-checkout-shell,
  .mk-payment-shell,
  .mk-checkout-aside article {
    border-radius: var(--mk-radius);
  }

  .mk-checkout-shell,
  .mk-payment-shell {
    padding: 20px;
  }

  .mk-checkout-shell__head,
  .mk-payment-shell__head {
    align-items: stretch;
    flex-direction: column;
  }

  .mk-checkout-shell__head .mk-btn,
  .mk-payment-shell__actions,
  .mk-payment-shell__actions .mk-btn {
    width: 100%;
  }

  .mk-checkout-aside {
    grid-template-columns: 1fr;
  }

  .mk-filter--segments a {
    flex: 1 1 120px;
    text-align: center;
  }

  .mk-proof-card__body {
    grid-template-columns: 1fr;
  }

  .mk-factory-grid__main,
  .mk-factory-grid__wide {
    aspect-ratio: 4 / 3;
  }

  .mk-social-grid {
    gap: 48px;
  }
}


@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

  .mk-reveal {
    opacity: 1;
    transform: none;
    filter: none;
  }
}