/* [next]/internal/font/google/outfit_641e8210.module.css [app-client] (css) */
@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit Fallback;
  src: local(Arial);
  ascent-override: 100.18%;
  descent-override: 26.05%;
  line-gap-override: 0.0%;
  size-adjust: 99.82%;
}

.outfit_641e8210-module__hclHZa__className {
  font-family: Outfit, Outfit Fallback;
  font-style: normal;
}

.outfit_641e8210-module__hclHZa__variable {
  --font-manrope: "Outfit", "Outfit Fallback";
}

/* [next]/internal/font/google/outfit_69db486d.module.css [app-client] (css) */
@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/b2ea385cb5ae8625-s.0kjod.kaq1k69.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: Outfit;
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../media/1b99372b3eaef0c8-s.p.0gx2haw2tmll8.woff2") format("woff2");
  unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: Outfit Fallback;
  src: local(Arial);
  ascent-override: 100.18%;
  descent-override: 26.05%;
  line-gap-override: 0.0%;
  size-adjust: 99.82%;
}

.outfit_69db486d-module__y-vIPq__className {
  font-family: Outfit, Outfit Fallback;
  font-style: normal;
}

.outfit_69db486d-module__y-vIPq__variable {
  --font-space-grotesk: "Outfit", "Outfit Fallback";
}

/* [project]/src/app/globals.css [app-client] (css) */
:root {
  --bg: #f4efe6;
  --surface: #ffffffc7;
  --surface-strong: #fff9f1;
  --text: #1c1a16;
  --muted: #5c5348;
  --line: #1c1a161f;
  --accent: #c85a2e;
  --accent-strong: #953d1d;
  --ok: #2b7a4b;
  --warn: #a96513;
  --shadow: 0 24px 80px #5f351529;
}

html {
  height: 100%;
}

html, body {
  max-width: 100vw;
  overflow-x: hidden;
}

body {
  min-height: 100%;
  color: var(--text);
  font-family: var(--font-manrope), sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: radial-gradient(circle at 0 0, #c85a2e2e, #0000 28%), radial-gradient(circle at 100% 100%, #1c7e7233, #0000 22%), linear-gradient(#f6efe5 0%, #efe2cf 100%);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

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

button, input, select, textarea {
  font: inherit;
}

.shell {
  width: min(1180px, 100vw - 32px);
  margin: 0 auto;
  padding: 40px 0 72px;
}

.stack {
  gap: 16px;
  display: grid;
}

.stackLarge {
  gap: 22px;
  display: grid;
}

.hero, .panel, .panelSubsection {
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  background: var(--surface);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  border-radius: 28px;
}

.hero {
  padding: 40px;
}

.panel, .panelSubsection {
  padding: 28px;
}

.panelSubsection {
  box-shadow: none;
  background: #ffffff94;
}

.narrowPanel {
  max-width: 760px;
}

.eyebrow {
  color: var(--accent-strong);
  letter-spacing: .08em;
  text-transform: uppercase;
  background: #c85a2e1f;
  border-radius: 999px;
  margin-bottom: 18px;
  padding: 8px 12px;
  font-size: .85rem;
  font-weight: 800;
  display: inline-flex;
}

.hero h1, .sectionHeading h1, .sectionHeading h2, .approvalCard h3, .quickLink strong {
  font-family: var(--font-space-grotesk), sans-serif;
}

.hero h1 {
  max-width: 11ch;
  font-size: clamp(2.8rem, 7vw, 5.4rem);
  line-height: .95;
}

.sectionHeading {
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  display: flex;
}

.sectionHeading h1, .sectionHeading h2 {
  font-size: clamp(1.4rem, 4vw, 2rem);
}

.sectionHeading span, .mutedText, .bodyCopy, .emptyState {
  color: var(--muted);
}

.lede, .bodyCopy {
  max-width: 65ch;
  line-height: 1.7;
}

.actions, .compactForm {
  flex-wrap: wrap;
  gap: 12px;
  display: flex;
}

.button {
  cursor: pointer;
  border: 0;
  border-radius: 14px;
  justify-content: center;
  align-items: center;
  min-height: 48px;
  padding: 0 18px;
  font-weight: 700;
  transition: transform .16s, background-color .16s, opacity .16s;
  display: inline-flex;
}

.button:hover {
  transform: translateY(-1px);
}

.button:disabled {
  cursor: not-allowed;
  opacity: .72;
}

.buttonPrimary {
  background: var(--accent);
  color: #fff;
}

.buttonSecondary {
  border: 1px solid var(--line);
  background: #ffffffb3;
}

.panelGrid, .quickLinks, .cardList {
  gap: 16px;
  display: grid;
}

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

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

.quickLink, .selectionCard, .approvalCard, .tableRow, .callout {
  border: 1px solid var(--line);
  background: var(--surface-strong);
  border-radius: 22px;
}

.quickLink, .tableRow, .callout {
  padding: 18px 20px;
}

.quickLink {
  gap: 10px;
  display: grid;
}

.quickLink span, .selectionCard span, .tableRow span, .callout span {
  color: var(--muted);
  line-height: 1.5;
}

.todo {
  color: var(--muted);
  gap: 12px;
  padding-left: 18px;
  line-height: 1.6;
  display: grid;
}

.form {
  gap: 16px;
  display: grid;
}

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

.field {
  gap: 8px;
  display: grid;
}

.field span {
  font-size: .95rem;
  font-weight: 700;
}

.fieldGrow {
  flex: 320px;
}

.fieldSpan2 {
  grid-column: span 2;
}

.input {
  min-height: 48px;
  color: var(--text);
  background: #ffffffd6;
  border: 1px solid #1c1a162e;
  border-radius: 14px;
  padding: 12px 14px;
}

.selectionCard {
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  display: flex;
}

.selectionCard input {
  margin-top: 4px;
}

.selectionCard > div {
  gap: 4px;
  display: grid;
}

.status {
  border-radius: 16px;
  padding: 14px 16px;
  font-weight: 700;
}

.statusOk {
  color: var(--ok);
  background: #2b7a4b1f;
}

.statusWarn {
  color: var(--warn);
  background: #a965131f;
}

.metaList {
  gap: 14px;
  display: grid;
}

.metaList dt {
  color: var(--muted);
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: 4px;
  font-size: .8rem;
  font-weight: 700;
}

.metaList dd {
  font-weight: 700;
}

.tableLike {
  gap: 12px;
  display: grid;
}

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

.tableRow > div {
  gap: 6px;
  display: grid;
}

.approvalCard {
  padding: 20px;
}

.splitRow {
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  display: flex;
}

.badge {
  min-height: 32px;
  color: var(--accent-strong);
  background: #c85a2e1f;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 0 12px;
  font-size: .8rem;
  font-weight: 800;
  display: inline-flex;
}

.callout {
  gap: 6px;
  display: grid;
}

@media (max-width: 860px) {
  .panelGrid, .quickLinks, .gridForm, .tableRow {
    grid-template-columns: 1fr;
  }

  .fieldSpan2 {
    grid-column: span 1;
  }
}

@media (max-width: 640px) {
  .shell {
    width: min(100vw - 20px, 100%);
    padding-top: 24px;
  }

  .hero, .panel, .panelSubsection {
    border-radius: 24px;
  }

  .hero, .panel, .panelSubsection, .approvalCard, .quickLink, .tableRow, .callout {
    padding: 20px;
  }
}

.homeHero {
  color: #fff;
  background: linear-gradient(135deg, #152844f5, #1e3a5feb), radial-gradient(circle at 100% 0, #f4a9314d, #0000 24%);
  border: 1px solid #ffffff24;
  border-radius: 32px;
  padding: 28px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 30px 120px #15284457;
}

.mkPage {
  color: #1f2937;
  background: #fff;
  min-height: 100vh;
}

.mkHeader {
  z-index: 50;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  background: #fffffffa;
  border-bottom: 1px solid #e8edf3;
  position: sticky;
  top: 0;
}

.mkHeaderInner, .mkFooterInner, .mkMain {
  width: min(1536px, 100vw - 64px);
  margin: 0 auto;
}

.mkHeaderInner {
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 28px;
  min-height: 64px;
  display: grid;
}

.mkMobileMenuButton {
  color: #1f2937;
  background: none;
  border: 0;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: none;
}

.mkMobileMenuButton svg {
  width: 20px;
  height: 20px;
}

.mkLogo {
  min-width: 0;
  font-family: var(--font-manrope), sans-serif;
  letter-spacing: -.02em;
  color: #233042;
  align-items: center;
  gap: 10px;
  font-size: 1.75rem;
  font-weight: 600;
  display: inline-flex;
}

.mkLogo img {
  width: auto;
  height: 32px;
}

.mkLogo span {
  letter-spacing: -.02em;
  white-space: nowrap;
  font-size: 1rem;
  font-weight: 600;
}

.mkNav {
  justify-content: center;
  align-items: center;
  gap: 24px;
  display: flex;
}

.mkNav a {
  color: #283548;
  font-size: .875rem;
  font-weight: 500;
}

.mkNav a.isActive, .mkNav a:hover {
  color: #152f57;
}

.mkHeaderActions {
  justify-self: end;
  align-items: center;
  gap: 16px;
  display: flex;
}

.mkIconButton {
  color: #1f2937;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 8px;
  display: inline-flex;
}

.mkIconButton svg {
  width: 22px;
  height: 22px;
}

.mkCartButton {
  position: relative;
}

.mkCartBadge {
  color: #fff;
  background: #f4a931;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 18px;
  height: 18px;
  font-size: .65rem;
  font-weight: 700;
  display: inline-flex;
  position: absolute;
  top: -2px;
  right: -2px;
}

.mkPointsBadge {
  color: #d68910;
  background: #fff1db;
  border-radius: 12px;
  align-items: center;
  gap: 9px;
  min-height: 32px;
  padding: 0 14px;
  font-size: .875rem;
  font-weight: 600;
  display: inline-flex;
}

.mkPointsBadge svg {
  width: 16px;
  height: 16px;
}

.mkContent {
  padding-bottom: 0;
}

.mkBottomNav {
  display: none;
}

.mkBottomNavIconWrap {
  display: inline-flex;
  position: relative;
}

.mkBottomNavBadge {
  color: #fff;
  background: #f4a931;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 15px;
  height: 15px;
  font-size: 9px;
  font-weight: 700;
  display: inline-flex;
  position: absolute;
  top: -4px;
  right: -6px;
}

.mkMobileMenu, .mkMobileBackBar, .mkMobileStickyCta {
  display: none;
}

.mkMain {
  gap: 0;
  padding: 56px 0 80px;
  display: grid;
}

.mkHero {
  background: linear-gradient(135deg, #1e3a5ffa, #152844fa), radial-gradient(circle at 100% 0, #f4a93114, #0000 24%);
  border-radius: 0;
  min-height: 470px;
  padding: 76px 0 80px;
  position: relative;
  overflow: hidden;
}

.mkHeroFullBleed, .mkBenefitsBandFullBleed, .mkCtaBandFullBleed {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

.mkHero:before {
  content: "";
  opacity: .52;
  background-image: linear-gradient(135deg, #f4a93114 1px, #0000 1px), radial-gradient(circle, #f4a93142 1px, #0000 1px);
  background-position: 0 0, 0 0;
  background-size: 40px 40px, 30px 30px;
  position: absolute;
  inset: 0;
}

.mkHero:after {
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, #fff0 0%, #f4a9310d 100%);
  position: absolute;
  inset: 0;
}

.mkHeroCopy {
  z-index: 1;
  width: min(1536px, 100vw - 64px);
  max-width: none;
  margin: 0 auto;
  position: relative;
}

.mkHeroCopy > * {
  max-width: 760px;
}

.mkPill {
  border-radius: 999px;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 18px;
  font-size: .875rem;
  font-weight: 500;
  display: inline-flex;
}

.mkPillIcon, .mkPillIcon svg {
  width: 15px;
  height: 15px;
}

.mkPillDark {
  color: #fff;
  background: #ffffff1a;
  border: 1px solid #fff3;
}

.mkHero h1, .mkSectionHeader h1, .mkSectionHeader h2, .mkProductSummary h1, .mkPointsHeroInner h1, .mkAccountProfile h1, .mkCardHeader h2, .mkCenteredHeading {
  font-family: var(--font-space-grotesk), sans-serif;
}

.mkHero h1 {
  color: #fff;
  margin: 22px 0 16px;
  font-size: clamp(3rem, 3.9vw, 3.95rem);
  font-weight: 600;
  line-height: 1.02;
}

.mkHero h1 span {
  color: #f4b132;
}

.mkHero p, .mkPointsHeroInner p {
  color: #ffffffdb;
  max-width: 720px;
  font-size: 1rem;
  line-height: 1.55;
}

.mkActionRow, .mkActionColumn {
  gap: 16px;
  display: flex;
}

.mkActionRow {
  flex-wrap: wrap;
  margin-top: 38px;
}

.mkActionColumn {
  flex-direction: column;
}

.mkButton {
  border: 1px solid #0000;
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  min-height: 48px;
  padding: 0 24px;
  font-size: .9375rem;
  font-weight: 600;
  display: inline-flex;
}

.mkButtonWide {
  width: 100%;
}

.mkButtonPrimary {
  color: #1e3a5f;
  background: #f4a931;
}

.mkButtonGhost {
  color: #fff;
  background: none;
  border-color: #ffffff4d;
}

.mkButtonDark {
  color: #fff;
  background: #19365f;
}

.mkButtonSoft {
  color: #19365f;
  background: #fff7eb;
  border-color: #f3e5d4;
}

.mkBenefitsBand {
  background: #fff;
  border-top: 1px solid #ece7dd;
  border-bottom: 1px solid #ece7dd;
}

.mkHomeSection {
  padding: 48px 0 0;
}

.mkHomeSectionWarm {
  background: linear-gradient(135deg, #fffaf4 0%, #fff4e8 100%);
  border: 1px solid #f3e5d4;
  border-radius: 32px;
  margin-top: 56px;
  padding: 40px;
  box-shadow: 0 24px 80px #be782814;
}

.mkHomeHeader {
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
  display: flex;
}

.mkHomeTitleWithIcon {
  align-items: center;
  gap: 10px;
  display: inline-flex;
}

.mkHomeHeader h2 {
  color: #1f2f46;
  font-family: var(--font-manrope), sans-serif;
  font-size: clamp(2rem, 3vw, 2.85rem);
  font-weight: 600;
  line-height: 1.1;
}

.mkHomeHeaderLink {
  color: #1f2937;
  align-items: center;
  gap: 6px;
  font-size: .95rem;
  font-weight: 600;
  display: inline-flex;
}

.mkHomeHeaderLink svg, .mkHomeIcon svg, .mkWishlistButton svg, .mkCtaGlyph svg {
  width: 18px;
  height: 18px;
}

.mkHomeIcon, .mkWishlistButton, .mkCtaGlyph {
  justify-content: center;
  align-items: center;
  display: inline-flex;
}

.mkHomeIcon {
  border-radius: 999px;
  width: 36px;
  height: 36px;
}

.mkHomeIconTrend {
  color: #dc2626;
  background: #fff0ec;
}

.mkHomeIconStar {
  color: #3b82f6;
  background: #eef4ff;
}

.mkBenefitsStrip, .mkSection, .mkCtaBand, .mkPointsHero, .mkAccountProfile, .mkAccountCard, .mkFilterCard, .mkProductGalleryMain, .mkProductThumbs div, .mkProductCard, .mkRewardCard, .mkLevelCard, .mkStepCard, .mkInfoCallout, .mkLedgerItem, .mkMiniStatCard, .mkOrderCard {
  background: #fff;
  border: 1px solid #ece7dd;
  border-radius: 28px;
}

.mkBenefitsStrip {
  background: none;
  border: 0;
  border-radius: 0;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  width: min(1536px, 100vw - 64px);
  margin: 0 auto;
  padding: 24px 0;
  display: grid;
}

.mkBenefitsStrip article, .mkStepCard, .mkRewardCard, .mkLevelCard, .mkFilterCard {
  gap: 8px;
  display: grid;
}

.mkBenefitItem {
  grid-template-columns: 40px 1fr;
  align-items: center;
  gap: 16px;
}

.mkBenefitItem > div {
  gap: 4px;
  display: grid;
}

.mkBenefitIcon {
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: inline-flex;
}

.mkBenefitIcon svg {
  width: 18px;
  height: 18px;
}

.mkBenefitIconGold {
  color: #f4a931;
  background: #fff4e0;
}

.mkBenefitIconBlue {
  color: #2563eb;
  background: #eff6ff;
}

.mkBenefitIconPurple {
  color: #9333ea;
  background: #faf5ff;
}

.mkBenefitsStrip strong, .mkSectionHeader a, .mkProductBody h3, .mkRewardCard strong, .mkLevelCard strong, .mkStepCard strong, .mkLedgerItem strong, .mkMiniStatCard strong, .mkOrderCard strong {
  font-family: var(--font-space-grotesk), sans-serif;
}

.mkBenefitsStrip span, .mkSectionHeader span, .mkRewardCard p, .mkLevelCard span, .mkStepCard p, .mkInfoCallout span, .mkLedgerItem span, .mkOrderCard span, .mkFilterCard p, .mkAccountProfile p {
  color: #6b7280;
}

.mkSection {
  border: 0;
  border-radius: 0;
  padding: 0;
}

.mkSectionHeader, .mkCardHeader {
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 28px;
  display: flex;
}

.mkSectionHeader h1, .mkSectionHeader h2, .mkCardHeader h2, .mkCenteredHeading {
  color: #14233a;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.05;
}

.mkSectionHeader h2, .mkCardHeader h2, .mkCenteredHeading {
  font-size: clamp(1.8rem, 3vw, 2.3rem);
}

.mkCenteredHeading {
  text-align: center;
  margin-bottom: 32px;
}

.mkSectionHeader a {
  color: #1f2937;
  font-weight: 700;
}

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

.mkCategoryCard, .mkProductMedia {
  border-radius: 18px;
  position: relative;
  overflow: hidden;
}

.mkCategoryCard {
  min-height: 224px;
  margin-bottom: 0;
  display: block;
}

.mkCategoryCard img, .mkProductMedia img, .mkProductGalleryMain img, .mkProductThumbs img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.mkProductMediaExternal {
  background: radial-gradient(circle, #fffffffa, #f5efe6eb);
  place-items: center;
  display: grid;
}

.mkProductMediaExternal img {
  object-fit: contain;
  width: auto;
  max-width: min(100%, 320px);
  height: auto;
  max-height: 100%;
}

.mkCategoryOverlay {
  color: #fff;
  background: linear-gradient(#0000 0%, #000000b8 100%);
  gap: 4px;
  padding: 14px;
  display: grid;
  position: absolute;
  inset: auto 0 0;
}

.mkCatalogGrid, .mkRewardsGrid, .mkLevelGrid, .mkStepsGrid, .mkStatsRow {
  gap: 18px;
  display: grid;
}

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

.mkProductCard {
  border: 1px solid #e7ebf2;
  border-radius: 20px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 8px 28px #0f172a12;
}

.mkProductMedia {
  background: #f3f4f6;
  min-height: 300px;
}

.mkBadges {
  z-index: 2;
  pointer-events: none;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  display: flex;
  position: absolute;
  top: 12px;
  left: 12px;
  right: 12px;
}

.mkBadgeGroup {
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  display: flex;
}

.mkBadge {
  color: #fff;
  white-space: nowrap;
  border-radius: 999px;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  font-size: .78rem;
  font-weight: 700;
  display: inline-flex;
}

.mkProductPointsTag {
  z-index: 2;
  color: #fff;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  background: #111827c7;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  font-size: .82rem;
  font-weight: 700;
  display: inline-flex;
  position: absolute;
  bottom: 12px;
  left: 12px;
  right: 12px;
}

.mkBadgeHot {
  background: #e89011;
}

.mkBadgeNew {
  background: #3b82f6;
}

.mkBadgeSale {
  background: #ef4444;
}

.mkWishlistButton {
  color: #1f2937;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background: #ffffffeb;
  border-radius: 999px;
  width: 36px;
  height: 36px;
  position: absolute;
  top: 52px;
  right: 12px;
  box-shadow: 0 8px 18px #0f172a14;
}

.mkProductBody {
  gap: 10px;
  padding: 16px;
  display: grid;
}

.mkProductBody h3 {
  color: #1f2937;
  min-height: 2.7rem;
  font-size: .95rem;
  line-height: 1.4;
}

.mkPriceRow {
  align-items: baseline;
  gap: 8px;
  display: flex;
}

.mkPriceRow strong, .mkProductPrice {
  color: #111827;
  font-family: var(--font-manrope), sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
}

.mkPriceRow span {
  color: #9ca3af;
  font-size: .88rem;
  text-decoration: line-through;
}

.mkProductBody small {
  color: #ef9f18;
  font-size: .88rem;
  font-weight: 600;
}

.mkCtaBand {
  color: #fff;
  text-align: center;
  background: linear-gradient(135deg, #1a3761 0%, #152844 50%, #1e3a5f 100%);
  border: 0;
  border-radius: 0;
  margin-top: 48px;
  padding: 102px 24px 96px;
  position: relative;
  overflow: hidden;
}

.mkCtaBand:before {
  content: "";
  opacity: .18;
  background-image: radial-gradient(2px 2px at 20% 30%, #fff, #0000), radial-gradient(2px 2px at 60% 70%, #fff, #0000), radial-gradient(1px 1px, #fff, #0000), radial-gradient(1px 1px at 80% 10%, #fff, #0000), radial-gradient(2px 2px at 90% 60%, #fff, #0000), radial-gradient(1px 1px at 33% 80%, #fff, #0000), radial-gradient(1px 1px at 15% 95%, #fff, #0000);
  background-size: 200% 200%;
  position: absolute;
  inset: 0;
}

.mkCtaBand > div {
  z-index: 1;
  max-width: 680px;
  margin: 0 auto;
  position: relative;
}

.mkCtaGlyph {
  color: #fff;
  width: 64px;
  height: 64px;
  margin-bottom: 26px;
  display: inline-flex;
}

.mkCtaGlyph svg {
  width: 48px;
  height: 48px;
}

.mkCtaBand h2 {
  font-family: var(--font-manrope), sans-serif;
  font-size: clamp(2.2rem, 3vw, 3rem);
  font-weight: 600;
  line-height: 1.18;
}

.mkCtaBand p {
  color: #ffffffd9;
  max-width: 560px;
  margin: 12px auto 34px;
  font-size: 1rem;
  line-height: 1.45;
}

.mkCtaBand .mkActionRow {
  justify-content: center;
  gap: 12px;
  margin-top: 0;
}

.mkPointsHero {
  color: #fff;
  background: linear-gradient(135deg, #1a3761 0%, #223f6f 100%);
  padding: 58px 52px;
  overflow: hidden;
}

.mkPointsHeroInner {
  max-width: 1120px;
}

.mkPointsHeroInner h1 {
  margin: 28px 0 10px;
  font-size: clamp(2.6rem, 5vw, 4rem);
}

.mkPointsSummary {
  background: #ffffff17;
  border: 1px solid #ffffff24;
  border-radius: 28px;
  grid-template-columns: 360px 1fr;
  gap: 36px;
  margin-top: 34px;
  padding: 36px 40px;
  display: grid;
}

.mkPointsSummary span, .mkPointsSummary small, .mkProgressMeta span {
  color: #fffc;
}

.mkPointsSummary strong {
  font-family: var(--font-space-grotesk), sans-serif;
  margin: 8px 0 6px;
  font-size: 4.5rem;
  line-height: 1;
  display: block;
}

.mkProgressWrap {
  align-self: center;
}

.mkProgressMeta {
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
  display: flex;
}

.mkProgressBar {
  background: #ffffff38;
  border-radius: 999px;
  height: 16px;
}

.mkProgressBar span {
  border-radius: inherit;
  background: #fff;
  height: 100%;
  display: block;
}

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

.mkStepCard {
  text-align: center;
  padding: 24px;
}

.mkStepIcon {
  color: #ef9f18;
  background: #fff7e6;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 72px;
  height: 72px;
  margin: 0 auto 12px;
  font-size: 1.7rem;
  font-weight: 700;
  display: inline-flex;
}

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

.mkRewardCard {
  padding: 26px;
}

.mkRewardIcon {
  background: #fff7e6;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 52px;
  height: 52px;
  font-size: 1.3rem;
  display: inline-flex;
}

.mkRewardMeta {
  justify-content: space-between;
  align-items: center;
  margin: 14px 0 20px;
  display: flex;
}

.mkRewardMeta strong {
  color: #ef9f18;
}

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

.mkLevelCard {
  padding: 24px;
  position: relative;
}

.mkLevelCard.isCurrent {
  background: linear-gradient(#fff9ec 0%, #fff 100%);
  border-color: #efc14f;
}

.mkLevelBadge {
  color: #1b365f;
  background: #f4b132;
  border-radius: 999px;
  min-height: 32px;
  padding: 0 12px;
  font-size: .9rem;
  font-weight: 700;
  display: inline-flex;
}

.mkLevelCard ul, .mkBulletList {
  color: #4b5563;
  gap: 10px;
  margin-top: 16px;
  padding-left: 20px;
  line-height: 1.6;
  display: grid;
}

.mkInfoCallout {
  background: #faf8f4;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 24px;
  display: grid;
}

.mkLedgerList, .mkOrderList, .mkAccountNav {
  gap: 14px;
  display: grid;
}

.mkLedgerItem, .mkOrderCard {
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  padding: 22px 24px;
  display: flex;
}

.mkLedgerItem strong.isPositive {
  color: #ef9f18;
}

.mkLedgerItem strong.isNegative {
  color: #6b7280;
}

.mkListing {
  grid-template-columns: 320px 1fr;
  gap: 36px;
  display: grid;
}

.mkFilters {
  align-content: start;
  gap: 20px;
  display: grid;
}

.mkFilterCard {
  padding: 22px;
}

.mkFilterCard h2 {
  font-family: var(--font-space-grotesk), sans-serif;
  margin-bottom: 12px;
  font-size: 1.6rem;
}

.mkFilterCard label {
  color: #374151;
  align-items: center;
  gap: 10px;
  display: flex;
}

.mkFakeSelect {
  color: #374151;
  border: 1px solid #e5e7eb;
  border-radius: 18px;
  align-items: center;
  min-height: 72px;
  padding: 0 20px;
  font-size: 1.1rem;
  display: flex;
}

.mkListingContent {
  gap: 24px;
  display: grid;
}

.mkCatalogSearch {
  background: #fffaf4;
  border: 1px solid #eadcc8;
  border-radius: 20px;
  gap: 10px;
  padding: 18px;
  scroll-margin-top: 88px;
  display: grid;
}

.mkCatalogSearch label {
  color: #14233a;
  font-weight: 700;
}

.mkCatalogSearchRow {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  display: grid;
}

.mkCatalogSearchRow svg {
  color: #d68910;
  width: 22px;
  height: 22px;
}

.mkCatalogSearchRow input {
  color: #14233a;
  width: 100%;
  min-height: 48px;
  font: inherit;
  background: #fff;
  border: 1px solid #dce4ee;
  border-radius: 14px;
  padding: 0 16px;
}

.mkCatalogSearchRow input:focus {
  border-color: #f4a931;
  outline: 2px solid #f4a93159;
}

.mkCatalogSearchClear {
  color: #d68910;
  width: fit-content;
  font-weight: 700;
}

.mkMobileFilterButton {
  color: #1f2937;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 14px;
  font-size: .9rem;
  font-weight: 600;
  display: none;
}

.mkMobileFilterButton svg {
  width: 16px;
  height: 16px;
}

.mkMobileFiltersOverlay {
  z-index: 80;
  background: #0f172a73;
  position: fixed;
  inset: 0;
}

.mkMobileFiltersSheet {
  background: #fff;
  border-radius: 28px 28px 0 0;
  max-height: 80vh;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: auto;
}

.mkMobileFiltersHeader {
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  justify-content: space-between;
  align-items: center;
  padding: 18px 20px;
  display: flex;
  position: sticky;
  top: 0;
}

.mkMobileFiltersHeader h2 {
  font-family: var(--font-manrope), sans-serif;
  font-size: 1.2rem;
  font-weight: 600;
}

.mkMobileFiltersHeader button {
  background: none;
  border: 0;
  border-radius: 12px;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  display: inline-flex;
}

.mkMobileFiltersHeader button svg {
  width: 18px;
  height: 18px;
}

.mkMobileFiltersBody {
  gap: 16px;
  padding: 20px;
  display: grid;
}

.mkProductDetail, .mkSectionColumns, .mkAccountLayout {
  gap: 36px;
  display: grid;
}

.mkProductDetail {
  grid-template-columns: minmax(0, 1fr) 560px;
}

.mkProductGallery, .mkProductSummary {
  gap: 20px;
  display: grid;
}

.mkProductGalleryMain {
  min-height: 920px;
  overflow: hidden;
}

.mkProductGalleryMainExternal {
  background: linear-gradient(#fffffffa, #f4efe7eb);
  place-items: center;
  padding: 24px;
  display: grid;
}

.mkProductGalleryMainExternal img {
  object-fit: contain;
  width: auto;
  max-width: min(100%, 720px);
  height: auto;
  max-height: 760px;
}

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

.mkProductThumbs div {
  min-height: 240px;
  overflow: hidden;
}

.mkProductThumbsExternal div {
  background: #ffffffeb;
  place-items: center;
  padding: 12px;
  display: grid;
}

.mkProductThumbsExternal img {
  object-fit: contain;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 100%;
}

.mkProductThumbs div.isActive {
  border-color: #efc14f;
  box-shadow: inset 0 0 0 2px #efc14f;
}

.mkProductSummary h1 {
  font-size: clamp(2.5rem, 4vw, 4.2rem);
  line-height: 1.06;
}

.mkProductMeta {
  color: #6b7280;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 1.05rem;
  display: flex;
}

.mkBenefitNotice {
  background: #fff4dc;
  border-radius: 24px;
  grid-template-columns: 64px 1fr;
  gap: 18px;
  padding: 20px 22px;
  display: grid;
}

.mkBenefitNoticeIcon {
  background: #f4b132;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 56px;
  height: 56px;
  font-size: 1.4rem;
  display: inline-flex;
}

.mkBenefitNotice strong {
  color: #d49316;
  font-family: var(--font-space-grotesk), sans-serif;
  margin-bottom: 6px;
  font-size: 1.5rem;
  display: block;
}

.mkFeatureList {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 10px;
  display: grid;
}

.mkFeatureList article {
  gap: 6px;
  display: grid;
}

.mkFeatureList strong {
  color: #19365f;
}

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

.mkSectionColumns h2 {
  font-family: var(--font-space-grotesk), sans-serif;
  margin-bottom: 16px;
  font-size: 2rem;
}

.mkSectionColumns p {
  color: #6b7280;
  font-size: 1.12rem;
  line-height: 1.7;
}

.mkAccountLayout {
  grid-template-columns: 360px 1fr;
  align-items: start;
}

.mkAccountSidebar, .mkAccountContent {
  gap: 22px;
  display: grid;
}

.mkAccountProfile {
  background: linear-gradient(#fff8ea 0%, #fff 100%);
  padding: 30px;
}

.mkAvatar {
  color: #fff;
  width: 116px;
  height: 116px;
  font-family: var(--font-space-grotesk), sans-serif;
  background: linear-gradient(#f4b132 0%, #f2a11d 100%);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  margin-bottom: 18px;
  font-size: 3rem;
  font-weight: 700;
  display: inline-flex;
}

.mkAccountProfile h1 {
  font-size: 3rem;
}

.mkAccountMeta {
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 20px;
  display: flex;
}

.mkAccountMeta span {
  color: #d49316;
  background: #fff;
  border-radius: 16px;
  min-height: 48px;
  padding: 0 18px;
  font-size: 1.6rem;
  font-weight: 700;
  display: inline-flex;
}

.mkAccountNav a, .mkLogoutButton {
  color: #1f2937;
  background: #fff;
  border: 1px solid #ece7dd;
  border-radius: 20px;
  align-items: center;
  min-height: 72px;
  padding: 0 22px;
  font-size: 1.2rem;
  font-weight: 600;
  display: flex;
}

.mkAccountNav a.isActive {
  color: #d49316;
  background: #fff8ea;
}

.mkLogoutButton {
  color: #dc2626;
  text-align: left;
}

.mkAccountCard {
  padding: 28px;
}

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

.mkAccountGrid span, .mkMiniStatCard span {
  color: #6b7280;
}

.mkAccountGrid strong, .mkMiniStatCard strong {
  font-family: var(--font-space-grotesk), sans-serif;
  margin-top: 6px;
  font-size: 1.8rem;
  display: block;
}

.mkCouponCard, .mkStatusPill {
  background: #fff;
  border: 1px solid #ece7dd;
}

.mkCouponCard {
  border-radius: 28px;
  gap: 24px;
  padding: 28px;
  display: grid;
}

.mkCouponCardTop {
  justify-content: space-between;
  align-items: start;
  gap: 18px;
  display: flex;
}

.mkCouponCardTop h2 {
  font-family: var(--font-space-grotesk), sans-serif;
  margin-top: 10px;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  line-height: 1.08;
}

.mkCouponEyebrow {
  color: #d49316;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .95rem;
  font-weight: 700;
}

.mkStatusPill {
  color: #19365f;
  background: #fff8ea;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  min-height: 42px;
  padding: 0 18px;
  font-weight: 700;
  display: inline-flex;
}

.mkListingSubstatus {
  color: #7b6f60;
  margin: 0 0 18px;
  font-size: .95rem;
}

.mkPagination {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 40px;
  display: flex;
}

.mkPaginationSummary {
  color: #19365f;
  background: #fff8ea;
  border: 1px solid #ece7dd;
  border-radius: 20px;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 164px;
  padding: 14px 18px;
  display: flex;
}

.mkPaginationSummary strong {
  font-size: 1rem;
}

.mkPaginationSummary span {
  color: #7b6f60;
  font-size: .88rem;
}

.mkPaginationButton {
  color: #19365f;
  background: #fff;
  border: 1px solid #d8c7ac;
  border-radius: 16px;
  justify-content: center;
  align-items: center;
  min-width: 144px;
  min-height: 48px;
  padding: 0 20px;
  font-weight: 700;
  display: inline-flex;
  box-shadow: 0 10px 24px #19365f14;
}

.mkPaginationButtonDisabled {
  color: #a79b8b;
  box-shadow: none;
  pointer-events: none;
  background: #f8f3eb;
}

.mkCouponStats, .mkCouponMetaList {
  gap: 16px;
  display: grid;
}

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

.mkCouponStats article, .mkCouponMetaList div {
  background: #faf7f1;
  border-radius: 22px;
  gap: 8px;
  padding: 20px;
  display: grid;
}

.mkCouponStats span, .mkCouponMetaList span {
  color: #6b7280;
}

.mkCouponStats strong, .mkCouponMetaList strong {
  font-family: var(--font-space-grotesk), sans-serif;
  font-size: 1.45rem;
}

.mkOpsTopbar, .mkOpsStatGrid, .mkOpsMetaGrid, .mkOpsLookupRow, .mkOpsSelectionList {
  gap: 18px;
  display: grid;
}

.mkOpsTopbar, .mkOpsPanel, .mkOpsListItem {
  background: #fff;
  border: 1px solid #ece7dd;
  border-radius: 28px;
  padding: 28px;
}

.mkOpsTopbar {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  margin-bottom: 28px;
}

.mkOpsTopbar h2 {
  font-family: var(--font-space-grotesk), sans-serif;
  margin: 10px 0 8px;
  font-size: clamp(1.6rem, 3vw, 2.3rem);
}

.mkOpsTopbar p {
  color: #546277;
  margin: 0;
}

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

.mkOpsStatCard {
  background: linear-gradient(#fffdf8 0%, #f7f0e2 100%);
  border: 1px solid #eadfcd;
  border-radius: 24px;
  gap: 8px;
  padding: 24px;
  display: grid;
}

.mkOpsStatCard span, .mkOpsMetaGrid span {
  color: #6b7280;
}

.mkOpsStatCard strong, .mkOpsMetaGrid strong {
  font-family: var(--font-space-grotesk), sans-serif;
  color: #19365f;
  font-size: 1.8rem;
}

.mkOpsStatCard small {
  color: #7c6c59;
}

.mkOpsForm {
  gap: 20px;
}

.mkOpsList {
  gap: 18px;
  display: grid;
}

.mkOpsListItem {
  gap: 22px;
  display: grid;
}

.mkOpsListHead {
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  display: flex;
}

.mkOpsListHead strong {
  font-family: var(--font-space-grotesk), sans-serif;
  margin-bottom: 6px;
  font-size: 1.2rem;
  display: block;
}

.mkOpsListHead p {
  color: #6b7280;
  margin: 0;
}

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

.mkOpsMetaGrid div {
  background: #faf7f1;
  border-radius: 22px;
  gap: 8px;
  padding: 18px 20px;
  display: grid;
}

.mkOpsLookupRow {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
}

.mkOpsFieldGrow {
  min-width: 0;
}

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

.mkCouponDetailLayout, .mkCouponSideColumn {
  gap: 24px;
  display: grid;
}

.mkCouponDetailLayout {
  grid-template-columns: minmax(0, 1.3fr) minmax(360px, .7fr);
  align-items: start;
}

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

.mkMiniStatCard {
  padding: 24px;
}

.mkMiniStatCardAccent {
  background: linear-gradient(#fff8ea 0%, #fff 100%);
}

.mkFooter {
  color: #fff;
  background: #203e6b;
  margin-top: 40px;
}

.mkFooterInner {
  grid-template-columns: 1.2fr .7fr .7fr;
  gap: 48px;
  padding: 56px 0;
  display: grid;
}

.mkFooterBrand p {
  color: #ffffffc7;
  max-width: 460px;
  margin-top: 22px;
  line-height: 1.7;
}

.mkFooter .mkLogo, .mkFooter .mkLogo span {
  color: #fff;
}

.mkFooterColumn {
  align-content: start;
  gap: 14px;
  display: grid;
}

.mkFooterColumn strong {
  font-family: var(--font-space-grotesk), sans-serif;
  font-size: 1.2rem;
}

.mkFooterColumn a, .mkFooterColumn span {
  color: #ffffffc7;
  overflow-wrap: anywhere;
}

@media (max-width: 1400px) {
  .mkCategoryGrid, .mkCatalogGrid, .mkRewardsGrid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .mkHeaderInner, .mkFooterInner, .mkMain {
    width: min(100vw - 32px, 100%);
  }

  .mkListing, .mkProductDetail, .mkAccountLayout, .mkCouponDetailLayout, .mkSectionColumns, .mkPointsSummary, .mkBenefitsStrip, .mkLevelGrid, .mkStepsGrid, .mkRewardsGrid, .mkStatsRow, .mkCouponStats, .mkCatalogGrid, .mkCatalogGridCompact, .mkCategoryGrid, .mkFeatureList, .mkInfoCallout, .mkFooterInner, .mkAccountGrid {
    grid-template-columns: 1fr;
  }

  .mkNav {
    display: none;
  }

  .mkHero, .mkPointsHero {
    padding: 36px 28px;
  }

  .mkProductGalleryMain {
    min-height: 520px;
  }
}

@media (max-width: 760px) {
  .mkHeaderInner {
    grid-template-columns: 1fr;
    justify-items: start;
    padding: 16px 0;
  }

  .mkHeaderActions {
    flex-wrap: wrap;
  }

  .mkHero h1, .mkPointsHeroInner h1, .mkProductSummary h1, .mkAccountProfile h1 {
    font-size: 2.2rem;
  }

  .mkMain {
    gap: 42px;
    padding-top: 18px;
  }

  .mkBenefitsStrip, .mkSectionAccent, .mkCtaBand, .mkPointsHero, .mkAccountProfile, .mkAccountCard, .mkFilterCard, .mkStepCard, .mkRewardCard, .mkLevelCard, .mkInfoCallout, .mkLedgerItem, .mkMiniStatCard, .mkOrderCard {
    padding: 22px;
  }

  .mkProductThumbs {
    grid-template-columns: 1fr;
  }

  .mkProductThumbs div {
    min-height: 160px;
  }
}

.homeHeroGlow, .homeHeroPattern {
  pointer-events: none;
  position: absolute;
}

.homeHeroGlow {
  filter: blur(28px);
  border-radius: 999px;
}

.homeHeroGlowPrimary {
  background: #f4a93138;
  width: 260px;
  height: 260px;
  top: -60px;
  right: -20px;
}

.homeHeroGlowSecondary {
  background: #ffffff1f;
  width: 220px;
  height: 220px;
  bottom: -80px;
  left: -40px;
}

.homeHeroPattern {
  opacity: .18;
  background-image: radial-gradient(circle at 12% 24%, #ffffffe6 0 1px, #0000 1px), radial-gradient(circle at 72% 16%, #ffffffbf 0 1px, #0000 1px), radial-gradient(circle at 82% 64%, #fff9 0 1px, #0000 1px), linear-gradient(125deg, #0000 0 48%, #f4a93124 48% 52%, #0000 52%);
  background-size: 240px 180px, 220px 160px, 200px 180px, 100% 100%;
  inset: 0;
}

.mkQrCard {
  text-align: center;
  justify-items: center;
  gap: 16px;
  display: grid;
}

.mkQrImage, .mkQrPlaceholder {
  aspect-ratio: 1;
  background: #fffaf4;
  border: 1px solid #ece7dd;
  border-radius: 24px;
  width: min(280px, 100%);
}

.mkQrPlaceholder {
  color: #8b7355;
  font-family: var(--font-space-grotesk), sans-serif;
  place-items: center;
  font-size: 2rem;
  display: grid;
}

.mkQrPayload {
  overflow-wrap: anywhere;
  background: #faf7f1;
  border-radius: 16px;
  max-width: 100%;
  padding: 10px 14px;
}

.mkScannerVideo {
  object-fit: cover;
  background: #111827;
  border: 1px solid #ece7dd;
  border-radius: 24px;
  width: 100%;
  min-height: 280px;
}

.homeNav, .heroGrid, .homeStatBar, .homeBenefitRow, .homeSpotlightStats, .offerGrid, .offerCardMetrics, .offerCardFooter, .roleGrid, .roleLinks, .homeMenu {
  z-index: 1;
  position: relative;
}

.homeNav {
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 34px;
  display: flex;
}

.homeBrand {
  align-items: center;
  gap: 14px;
  display: inline-flex;
}

.homeBrandMark {
  color: #152844;
  width: 48px;
  height: 48px;
  font-family: var(--font-space-grotesk), sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: linear-gradient(135deg, #f4a931, #ffcf73);
  border-radius: 18px;
  justify-content: center;
  align-items: center;
  font-size: 1rem;
  font-weight: 800;
  display: inline-flex;
}

.homeBrandText {
  gap: 2px;
  display: grid;
}

.homeBrandText strong {
  font-family: var(--font-space-grotesk), sans-serif;
  font-size: 1.1rem;
}

.homeBrandText small {
  color: #ffffffb8;
  font-size: .85rem;
}

.homeMenu {
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 16px;
  display: flex;
}

.homeMenu a {
  color: #ffffffd6;
  font-size: .95rem;
  font-weight: 700;
}

.homeMenuActions {
  gap: 12px;
  display: flex;
}

.homeMenuActions .buttonSecondary {
  color: #fff;
  background: #ffffff14;
  border-color: #ffffff3d;
}

.heroGrid {
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, .8fr);
  gap: 24px;
  display: grid;
}

.homeEyebrow {
  color: #fff;
  background: #ffffff24;
}

.homeHeroCopy h1 {
  max-width: 10ch;
}

.homeHeroLead {
  color: #ffffffd1;
}

.homeHero .buttonPrimary {
  color: #152844;
  background: #f4a931;
}

.homeHero .buttonSecondary {
  color: #fff;
  background: #ffffff0f;
  border-color: #fff3;
}

.homeBenefitRow {
  flex-wrap: wrap;
  gap: 12px;
  display: flex;
}

.homeBenefitChip {
  background: #ffffff14;
  border: 1px solid #ffffff24;
  border-radius: 20px;
  gap: 4px;
  min-width: 180px;
  padding: 16px 18px;
  display: grid;
}

.homeBenefitChip strong {
  font-family: var(--font-space-grotesk), sans-serif;
  font-size: 1rem;
}

.homeBenefitChip span {
  color: #ffffffbd;
  line-height: 1.5;
}

.homeSpotlight {
  align-content: start;
  gap: 16px;
  display: grid;
}

.homeSpotlightCard, .homeMetricCard, .homeStatCard, .offerCard, .roleCard {
  border: 1px solid var(--line);
  border-radius: 24px;
}

.homeSpotlightCard {
  color: var(--text);
  background: #fffffff5;
  gap: 10px;
  padding: 24px;
  display: grid;
}

.homeSpotlightCard strong, .homeMetricCard strong, .offerCard h3, .roleCard h3 {
  font-family: var(--font-space-grotesk), sans-serif;
}

.homeSpotlightCard strong {
  font-size: clamp(1.8rem, 4vw, 2.8rem);
}

.homeSpotlightCard span {
  color: var(--muted);
  line-height: 1.5;
}

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

.homeMetricCard {
  background: #ffffff1f;
  gap: 8px;
  padding: 16px;
  display: grid;
}

.homeMetricCard small {
  color: #ffffffb8;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .8rem;
}

.homeMetricCard strong {
  color: #fff;
  font-size: 1.3rem;
}

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

.homeStatCard {
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  background: #ffffffbd;
  gap: 8px;
  padding: 22px;
  display: grid;
}

.homeStatCard strong {
  font-family: var(--font-space-grotesk), sans-serif;
  font-size: 1.05rem;
}

.homeStatCard span, .offerCard p, .roleCard p {
  color: var(--muted);
  line-height: 1.6;
}

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

.offerCard {
  background: linear-gradient(#fff9f1fa, #ffffffeb);
  gap: 18px;
  padding: 22px;
  display: grid;
}

.offerCardHeader {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  display: flex;
}

.offerCardDate {
  color: var(--muted);
  font-size: .82rem;
}

.offerCardBody {
  gap: 10px;
  display: grid;
}

.offerCardBody h3 {
  font-size: 1.3rem;
  line-height: 1.05;
}

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

.offerCardMetrics div {
  background: #c85a2e14;
  border-radius: 18px;
  gap: 4px;
  padding: 12px;
  display: grid;
}

.offerCardMetrics small {
  color: var(--muted);
  font-size: .8rem;
}

.offerCardMetrics strong {
  font-size: .96rem;
}

.offerCardFooter {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  display: flex;
}

.offerCardFooter span {
  color: var(--muted);
  font-size: .9rem;
  line-height: 1.5;
}

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

.roleCard {
  background: #ffffffc7;
  gap: 14px;
  padding: 24px;
  display: grid;
}

.roleCard h3 {
  font-size: 1.5rem;
}

.roleLinks {
  gap: 12px;
  display: grid;
}

.mkAuthPage {
  background: #fff;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  padding: 48px 16px;
  display: flex;
}

.mkAuthWrap {
  width: min(100%, 448px);
}

.mkAuthSplit {
  grid-template-columns: minmax(0, 1fr) minmax(380px, 460px);
  align-items: center;
  gap: 56px;
  width: min(100%, 1120px);
  display: grid;
}

.mkAuthIntro {
  text-align: center;
  margin-bottom: 32px;
}

.mkAuthShowcase {
  align-content: start;
  gap: 18px;
  display: grid;
}

.mkAuthBrand {
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  display: inline-flex;
}

.mkAuthBrandIcon {
  color: #f4a931;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  display: inline-flex;
}

.mkAuthBrandIcon svg {
  width: 32px;
  height: 32px;
}

.mkAuthBrand span {
  color: #1f2f46;
  font-family: var(--font-manrope), sans-serif;
  letter-spacing: -.03em;
  font-size: 1.95rem;
  font-weight: 600;
}

.mkAuthIntro h1 {
  color: #1f2937;
  font-family: var(--font-manrope), sans-serif;
  margin-bottom: 8px;
  font-size: 1.85rem;
  font-weight: 600;
  line-height: 1.2;
}

.mkAuthShowcase h1 {
  color: #1f2f46;
  font-family: var(--font-manrope), sans-serif;
  font-size: clamp(2.2rem, 4vw, 3.6rem);
  font-weight: 600;
  line-height: 1.05;
}

.mkAuthShowcase h1 span {
  color: #f4a931;
}

.mkAuthIntro p, .mkAuthFooter span, .mkAuthBack a {
  color: #6b7280;
}

.mkAuthShowcase p {
  color: #6b7280;
  max-width: 34rem;
  font-size: 1.05rem;
  line-height: 1.75;
}

.mkAuthCard {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 20px;
  gap: 20px;
  padding: 24px;
  display: grid;
  box-shadow: 0 20px 48px #0f172a0f;
}

.mkAuthCardWide {
  border-radius: 24px;
  padding: 28px 32px;
}

.mkAuthCardCompact {
  width: min(520px, 100vw - 32px);
  margin: 0 auto;
}

.mkAuthCardTitle {
  color: #1f2937;
  font-family: var(--font-manrope), sans-serif;
  font-size: 1.7rem;
  font-weight: 600;
}

.mkAuthForm {
  gap: 16px;
  display: grid;
}

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

.mkAuthField {
  gap: 8px;
  display: grid;
}

.mkAuthField > span, .mkAuthFieldRow span {
  color: #1f2937;
  font-size: .95rem;
  font-weight: 500;
}

.mkAuthFieldRow {
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  display: flex;
}

.mkAuthInput {
  color: #1f2937;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  width: 100%;
  min-height: 44px;
  padding: 0 16px;
  transition: border-color .16s, box-shadow .16s, background-color .16s;
}

.mkAuthInput::placeholder {
  color: #9ca3af;
}

.mkAuthInput:focus {
  background: #fff;
  border-color: #f4a931;
  outline: none;
  box-shadow: 0 0 0 3px #f4a9312e;
}

.mkPasswordField {
  position: relative;
}

.mkPasswordInput {
  padding-right: 48px;
}

.mkPasswordToggle {
  color: #6b7280;
  cursor: pointer;
  background: none;
  border: 0;
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  transition: background-color .16s, color .16s;
  display: inline-flex;
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
}

.mkPasswordToggle:hover, .mkPasswordToggle:focus-visible {
  color: #1f2937;
  background: #eef2f7;
  outline: none;
}

.mkPasswordToggle svg {
  width: 18px;
  height: 18px;
}

.mkAuthTextarea {
  color: #1f2937;
  resize: vertical;
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  width: 100%;
  min-height: 112px;
  padding: 14px 16px;
  transition: border-color .16s, box-shadow .16s, background-color .16s;
}

.mkAuthTextarea:focus {
  background: #fff;
  border-color: #f4a931;
  outline: none;
  box-shadow: 0 0 0 3px #f4a9312e;
}

.mkAuthInlineLink, .mkAuthFooter a, .mkAuthLinks a {
  color: #d68910;
  font-weight: 500;
}

.mkAuthInlineLink {
  cursor: pointer;
  background: none;
  border: 0;
  font-size: .9rem;
}

.mkAuthCheck {
  color: #1f2937;
  cursor: pointer;
  align-items: center;
  gap: 10px;
  font-size: .92rem;
  display: inline-flex;
}

.mkAuthCheck input {
  accent-color: #f4a931;
  width: 16px;
  height: 16px;
}

.mkAuthCheckBlock {
  align-items: flex-start;
  line-height: 1.55;
}

.mkAuthSubmit {
  min-height: 48px;
  font-size: 1rem;
}

.mkAuthBenefitList {
  gap: 16px;
  margin-top: 8px;
  display: grid;
}

.mkAuthBenefitItem {
  color: #6b7280;
  align-items: flex-start;
  gap: 12px;
  line-height: 1.6;
  display: flex;
}

.mkAuthCheckIcon {
  color: #f4a931;
  background: #fff4e0;
  border-radius: 999px;
  flex: none;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  display: inline-flex;
}

.mkAuthCheckIcon svg {
  width: 15px;
  height: 15px;
}

.mkAuthHint {
  color: #6b7280;
  margin: 0;
  font-size: .94rem;
  line-height: 1.55;
}

.mkAuthSearchBar {
  gap: 12px;
  display: flex;
}

.mkAuthListLabel {
  color: #1f2937;
  letter-spacing: 0;
  text-transform: uppercase;
  font-size: .86rem;
  font-weight: 800;
}

.mkStarterPointsSummary {
  color: #111827;
  font-size: .96rem;
  font-weight: 800;
}

.mkAuthSelectionList {
  gap: 12px;
  display: grid;
}

.mkAuthSelectionCard {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  align-items: flex-start;
  gap: 12px;
  padding: 16px 18px;
  transition: border-color .16s, box-shadow .16s, background-color .16s;
  display: flex;
}

.mkAuthSelectionCard.isSelected {
  background: #fffaf1;
  border-color: #f4a931;
  box-shadow: 0 0 0 3px #f4a9311f;
}

.mkAuthSelectionCard input {
  accent-color: #f4a931;
  margin-top: 3px;
}

.mkAuthSelectionCard strong {
  color: #1f2937;
  margin-bottom: 4px;
  font-size: .96rem;
  display: block;
}

.mkAuthSelectionCard span {
  color: #6b7280;
  font-size: .92rem;
}

.mkAuthFooter, .mkAuthBack {
  text-align: center;
}

.mkAuthFooter {
  font-size: .95rem;
}

.mkAuthLinks {
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 18px;
  font-size: .92rem;
  display: flex;
}

.mkPublicPreviewActions {
  gap: 12px;
  margin-top: 22px;
  display: grid;
}

.mkAuthBack {
  margin-top: 24px;
  font-size: .92rem;
}

@media (max-width: 1080px) {
  .heroGrid, .offerGrid, .homeStatBar, .roleGrid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 920px) {
  .homeNav {
    flex-direction: column;
    align-items: flex-start;
  }

  .homeMenu {
    justify-content: flex-start;
  }

  .homeSpotlightStats, .offerCardMetrics {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .mkHeader {
    position: sticky;
    top: 0;
  }

  .mkHeaderInner, .mkMain, .mkHeroCopy, .mkBenefitsStrip, .mkFooterInner {
    width: min(100vw - 32px, 100%);
  }

  .mkHeaderInner {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    min-height: 64px;
  }

  .mkMobileMenuButton {
    width: 34px;
    height: 34px;
    display: inline-flex;
  }

  .mkLogo {
    justify-self: start;
    gap: 8px;
  }

  .mkLogo img {
    height: 26px;
  }

  .mkLogo span {
    font-size: .9rem;
    line-height: 1.05;
  }

  .mkNav {
    display: none;
  }

  .mkHeaderActions {
    flex-wrap: nowrap;
    gap: 6px;
    min-width: max-content;
  }

  .mkLogo {
    max-width: 100%;
    overflow: hidden;
  }

  .mkLogo span {
    text-overflow: ellipsis;
    min-width: 0;
    overflow: hidden;
  }

  .mkIconButton {
    width: 26px;
    height: 26px;
    padding: 0;
  }

  .mkIconButton svg {
    width: 20px;
    height: 20px;
  }

  .mkCartBadge {
    width: 14px;
    height: 14px;
    font-size: 8px;
    top: -3px;
    right: -4px;
  }

  .mkPointsBadge {
    display: none;
  }

  .mkContent {
    padding-bottom: 72px;
  }

  .mkBottomNav {
    z-index: 60;
    background: #fff;
    border-top: 1px solid #e5e7eb;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: center;
    height: 64px;
    padding: 0 8px;
    display: grid;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .mkBottomNav a {
    color: #6b7280;
    justify-items: center;
    gap: 4px;
    font-size: 10px;
    display: grid;
  }

  .mkBottomNav a.isActive {
    color: #f4a931;
    font-weight: 600;
  }

  .mkBottomNav svg {
    width: 20px;
    height: 20px;
  }

  .mkFooter {
    padding-bottom: 72px;
  }

  @media (max-width: 380px) {
    .mkLogo span {
      display: none;
    }
  }

  .mkFooterInner {
    gap: 28px;
    padding: 40px 0 28px;
  }

  .mkFooterBrand p, .mkFooterColumn a, .mkFooterColumn span {
    font-size: .9rem;
    line-height: 1.6;
  }

  .mkMobileMenu {
    background: #fff;
    border-top: 1px solid #ece7dd;
    display: block;
    box-shadow: 0 14px 34px #0f172a14;
  }

  .mkMobileMenuInner {
    width: min(100vw - 32px, 100%);
    margin: 0 auto;
    padding: 12px 0 16px;
  }

  .mkMobileMenuNav {
    gap: 8px;
    display: grid;
  }

  .mkMobileMenuNav a {
    color: #1f2937;
    align-items: center;
    min-height: 42px;
    padding: 0 2px;
    font-size: .95rem;
    font-weight: 500;
    display: flex;
  }

  .mkMobileMenuNav a.isActive {
    color: #d68910;
  }

  .mkMain {
    padding: 24px 0 40px;
  }

  .mkHomeSection {
    padding-top: 36px;
  }

  .mkHomeSectionWarm {
    border-radius: 24px;
    margin-top: 40px;
    padding: 24px 18px;
  }

  .mkHomeHeader {
    margin-bottom: 18px;
  }

  .mkHomeHeader h2 {
    font-size: 2.05rem;
    line-height: 1.05;
  }

  .mkHomeHeaderLink {
    gap: 4px;
    font-size: .86rem;
  }

  .mkListing {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .mkFilters {
    display: none;
  }

  .mkListingContent {
    gap: 18px;
  }

  .mkSectionHeader {
    align-items: flex-start;
  }

  .mkSectionHeader h1 {
    font-size: 2.2rem;
  }

  .mkMobileFilterButton {
    display: inline-flex;
  }

  .mkCatalogSearch {
    padding: 14px;
    scroll-margin-top: 76px;
  }

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

  .mkCatalogSearchRow button {
    grid-column: 1 / -1;
    width: 100%;
  }

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

  .mkCategoryGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .mkCategoryCard {
    min-height: 184px;
  }

  .mkCategoryOverlay {
    padding: 12px;
  }

  .mkCategoryOverlay strong {
    font-size: .92rem;
  }

  .mkCategoryOverlay span {
    font-size: .74rem;
  }

  .mkProductMedia {
    min-height: 180px;
  }

  .mkProductBody {
    gap: 8px;
    padding: 14px;
  }

  .mkProductBody h3 {
    min-height: 2.4rem;
    font-size: .86rem;
  }

  .mkPriceRow strong, .mkProductPrice {
    font-size: 1rem;
  }

  .mkPriceRow span, .mkProductBody small {
    font-size: .76rem;
  }

  .mkHero {
    min-height: auto;
    padding: 32px 0 42px;
  }

  .mkHeroCopy > * {
    max-width: 100%;
  }

  .mkPill {
    min-height: 34px;
    padding: 0 14px;
    font-size: .76rem;
  }

  .mkHero h1 {
    margin: 16px 0 14px;
    font-size: 2.7rem;
    line-height: .98;
  }

  .mkHero p {
    max-width: 22rem;
    font-size: .96rem;
    line-height: 1.55;
  }

  .mkActionRow {
    gap: 10px;
    margin-top: 26px;
  }

  .mkActionRow .mkButton {
    border-radius: 14px;
    min-height: 46px;
    padding: 0 18px;
    font-size: .92rem;
  }

  .mkBenefitsStrip {
    gap: 16px;
    padding: 18px 0;
  }

  .mkBenefitItem {
    grid-template-columns: 36px 1fr;
    gap: 12px;
  }

  .mkBenefitIcon {
    width: 36px;
    height: 36px;
  }

  .mkBenefitItem strong {
    font-size: .94rem;
  }

  .mkBenefitItem span {
    font-size: .82rem;
  }

  .mkCtaBand {
    margin-top: 36px;
    padding: 72px 18px 78px;
  }

  .mkCtaGlyph {
    width: 52px;
    height: 52px;
    margin-bottom: 20px;
  }

  .mkCtaGlyph svg {
    width: 40px;
    height: 40px;
  }

  .mkCtaBand h2 {
    font-size: 2rem;
    line-height: 1.12;
  }

  .mkCtaBand p {
    margin: 12px auto 26px;
    font-size: .95rem;
    line-height: 1.5;
  }

  .mkProductDetail {
    gap: 24px;
  }

  .mkMobileBackBar {
    z-index: 20;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background: #fffffff5;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 16px;
    display: block;
    position: sticky;
    top: 56px;
  }

  .mkMobileBackBar button {
    color: #1f2937;
    background: none;
    border: 0;
    align-items: center;
    gap: 8px;
    min-height: 52px;
    font-size: .9rem;
    font-weight: 500;
    display: inline-flex;
  }

  .mkMobileBackBar svg {
    width: 18px;
    height: 18px;
  }

  .mkProductGallery {
    gap: 12px;
  }

  .mkProductGalleryMain {
    border-radius: 20px;
    min-height: 360px;
  }

  .mkProductGalleryMainExternal {
    padding: 16px;
  }

  .mkProductGalleryMainExternal img {
    max-width: 100%;
    max-height: 328px;
  }

  .mkProductThumbs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
  }

  .mkProductThumbs div {
    border-radius: 14px;
    min-height: 92px;
  }

  .mkProductMeta {
    gap: 10px;
    font-size: .9rem;
  }

  .mkBenefitNotice {
    border-radius: 18px;
    grid-template-columns: 44px 1fr;
    gap: 12px;
    padding: 16px;
  }

  .mkBenefitNoticeIcon {
    width: 44px;
    height: 44px;
    font-size: 1.1rem;
  }

  .mkBenefitNotice strong {
    font-size: 1.1rem;
  }

  .mkBenefitNotice span {
    font-size: .86rem;
    line-height: 1.45;
  }

  .mkFeatureList {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .mkFeatureList article {
    background: #fff;
    border: 1px solid #ece7dd;
    border-radius: 18px;
    padding: 14px;
  }

  .mkFeatureList strong {
    font-size: .86rem;
    line-height: 1.35;
  }

  .mkFeatureList span {
    font-size: .76rem;
    line-height: 1.4;
  }

  .mkSectionColumns h2 {
    margin-bottom: 12px;
    font-size: 1.35rem;
  }

  .mkSectionColumns p, .mkBulletList {
    font-size: .94rem;
    line-height: 1.65;
  }

  .mkMobileStickyCta {
    z-index: 40;
    padding: 14px 16px calc(14px + env(safe-area-inset-bottom, 0));
    background: #fffffffa;
    border-top: 1px solid #e5e7eb;
    align-items: center;
    gap: 12px;
    display: flex;
    position: fixed;
    bottom: 64px;
    left: 0;
    right: 0;
    box-shadow: 0 -10px 30px #0f172a14;
  }

  .mkMobileStickyCta > div {
    flex: 1;
    gap: 2px;
    display: grid;
  }

  .mkMobileStickyCta strong {
    color: #111827;
    font-size: 1rem;
    font-weight: 700;
  }

  .mkMobileStickyCta span {
    color: #ef9f18;
    font-size: .78rem;
    font-weight: 600;
  }

  .mkMobileStickyCta .mkButton {
    min-width: 124px;
    min-height: 46px;
    padding: 0 18px;
  }

  .homeHero {
    border-radius: 26px;
    padding: 20px;
  }

  .homeBenefitChip, .homeSpotlightCard, .homeMetricCard, .homeStatCard, .offerCard, .roleCard {
    border-radius: 20px;
  }

  .homeBrandText small, .homeMenu {
    display: none;
  }

  .offerCardFooter {
    flex-direction: column;
    align-items: stretch;
  }

  .mkAuthPage {
    padding: 32px 16px;
  }

  .mkAuthSplit {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .mkAuthBrand {
    gap: 8px;
  }

  .mkAuthShowcase {
    gap: 14px;
  }

  .mkAuthShowcase h1 {
    font-size: 2rem;
  }

  .mkAuthSearchBar, .mkAuthGrid {
    flex-direction: column;
    grid-template-columns: 1fr;
  }

  .mkOpsTopbar, .mkOpsStatGrid, .mkOpsMetaGrid, .mkOpsLookupRow, .mkOpsSelectionList {
    grid-template-columns: 1fr;
  }

  .mkOpsTopbar, .mkOpsPanel, .mkOpsListItem {
    border-radius: 22px;
    padding: 20px;
  }

  .mkOpsListHead {
    flex-direction: column;
    align-items: flex-start;
  }

  .mkAuthBrand span {
    font-size: 1.5rem;
  }

  .mkAuthCard {
    border-radius: 18px;
    padding: 20px;
  }

  .mkAuthCardWide {
    padding: 22px;
  }

  .mkAuthLinks {
    flex-direction: column;
    gap: 10px;
  }
}

.mkInstallPrompt {
  right: 16px;
  bottom: calc(88px + env(safe-area-inset-bottom, 0));
  z-index: 60;
  background: #fffaf2fa;
  border: 1px solid #173b7324;
  border-radius: 22px;
  gap: 14px;
  width: min(360px, 100vw - 32px);
  padding: 18px;
  display: grid;
  position: fixed;
  box-shadow: 0 22px 60px #0f172a29;
}

.mkInstallPrompt p {
  color: #4b5563;
  margin: 6px 0 0;
  font-size: .95rem;
}

.mkOfflinePage {
  background: linear-gradient(#f7f4ed 0%, #fff 100%);
  place-items: center;
  min-height: 100vh;
  padding: 24px;
  display: grid;
}

.mkOfflineCard {
  background: #fff;
  border: 1px solid #e6ddd0;
  border-radius: 28px;
  gap: 18px;
  width: min(520px, 100%);
  padding: 32px;
  display: grid;
  box-shadow: 0 24px 60px #0f172a14;
}

.mkOfflineCard p {
  color: #4b5563;
  margin: 0;
}

.mkChartList {
  gap: 12px;
  display: grid;
}

.mkChartRow {
  gap: 6px;
  display: grid;
}

.mkChartRowHead {
  color: #334155;
  justify-content: space-between;
  gap: 12px;
  font-size: .92rem;
  display: flex;
}

.mkChartBar {
  background: #edf2f7;
  border-radius: 999px;
  height: 10px;
  overflow: hidden;
}

.mkChartBar > span {
  border-radius: inherit;
  background: linear-gradient(90deg, #ef9f18 0%, #173b73 100%);
  height: 100%;
  display: block;
}

.mkInlineCheck {
  color: #475569;
  align-items: center;
  gap: .5rem;
  margin-bottom: .5rem;
  font-size: .92rem;
  display: inline-flex;
}

.mkInlineCheck input {
  width: 1rem;
  height: 1rem;
}

.mkOpsImagePreview {
  background: linear-gradient(#fff9f0eb, #fff);
  border: 1px solid #173b731f;
  border-radius: 22px;
  max-width: 320px;
  overflow: hidden;
}

.mkOpsImagePreview img {
  object-fit: contain;
  width: 100%;
  height: auto;
  display: block;
}

.mkScannerShell {
  gap: 18px;
  display: grid;
}

.mkScannerMain {
  padding-bottom: 120px;
}

.mkScannerPageSection {
  gap: 18px;
  display: grid;
}

.mkScannerShellMobile {
  overflow: hidden;
}

.mkScannerFrame {
  background: #0f172a;
  border-radius: 28px;
  min-height: min(72vh, 640px);
  position: relative;
  overflow: hidden;
}

.mkScannerVideo, .mkScannerFallbackRegion {
  object-fit: cover;
  width: 100%;
  min-height: min(72vh, 640px);
}

.mkScannerOverlay {
  pointer-events: none;
  place-items: center;
  display: grid;
  position: absolute;
  inset: 0;
}

.mkScannerGuide {
  color: #fff;
  background: #0f172abf;
  border-radius: 999px;
  padding: 10px 16px;
  font-size: .92rem;
  font-weight: 700;
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
}

.mkScannerReticle {
  border: 3px solid #ffffffeb;
  border-radius: 28px;
  width: min(74vw, 280px);
  height: min(74vw, 280px);
  box-shadow: 0 0 0 999px #0f172a57;
}

.mkScannerStatusRow {
  justify-content: center;
  display: flex;
}

.mkStatusPillWarn {
  color: #8b5312;
  background: #a9651329;
}

@media (max-width: 720px) {
  .mkScannerShellMobile {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    margin-inline: -18px;
    padding-inline: 0;
  }

  .mkScannerFrame, .mkScannerVideo, .mkScannerFallbackRegion {
    border-radius: 0;
    min-height: 72vh;
  }

  .mkScannerReticle {
    width: min(76vw, 300px);
    height: min(76vw, 300px);
  }
}

.mkResidentAccountLayout {
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  align-items: start;
  gap: 24px;
}

.mkResidentAccountSidebar, .mkResidentAccountContent {
  min-width: 0;
}

.mkResidentProfileCard {
  background: linear-gradient(#fff8ea 0%, #fff 100%);
  border-radius: 24px;
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 22px;
  display: grid;
  overflow: hidden;
}

.mkResidentAvatar {
  width: 76px;
  height: 76px;
  margin: 0;
  font-size: 2rem;
}

.mkResidentProfileCard .mkAccountIdentity {
  gap: 4px;
  min-width: 0;
  display: grid;
}

.mkResidentProfileCard h1 {
  overflow-wrap: anywhere;
  margin: 0;
  font-size: clamp(1.35rem, 1.7vw, 1.65rem);
  line-height: 1.08;
}

.mkResidentProfileCard p {
  overflow-wrap: anywhere;
  margin: 0;
  font-size: .9rem;
}

.mkResidentProfileCard .mkAccountMeta {
  grid-column: 1 / -1;
  margin-top: 2px;
}

.mkResidentProfileCard .mkAccountMeta span {
  background: #fff4e0;
  border-radius: 14px;
  align-items: center;
  min-height: 40px;
  padding: 0 14px;
  font-size: 1.15rem;
}

.mkResidentAccountSidebar .mkAccountNav {
  gap: 10px;
}

.mkResidentAccountSidebar .mkAccountNav a, .mkResidentAccountSidebar .mkLogoutButton {
  border-radius: 16px;
  min-height: 56px;
  padding: 0 18px;
  font-size: 1rem;
}

.mkResidentAccountContent {
  gap: 18px;
}

.mkResidentAccountContent .mkAccountCard {
  border-radius: 24px;
  padding: 24px;
}

.mkResidentAccountContent .mkCardHeader {
  margin-bottom: 20px;
}

.mkResidentAccountContent .mkCardHeader h2 {
  font-size: clamp(1.45rem, 2vw, 1.9rem);
}

.mkResidentAccountContent .mkAccountGrid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.mkResidentAccountContent .mkAccountGrid > div {
  background: #faf7f1;
  border-radius: 16px;
  min-width: 0;
  padding: 16px;
}

.mkResidentAccountContent .mkAccountGrid strong {
  overflow-wrap: anywhere;
  font-size: 1.22rem;
  line-height: 1.22;
}

.mkResidentAccountContent .mkAuthSearchBar {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  display: grid;
}

.mkResidentAccountContent .mkAuthSearchBar .mkButton {
  border-radius: 14px;
  min-width: 150px;
  min-height: 44px;
}

.mkResidentAccountContent .mkStatsRow {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mkResidentAccountContent .mkMiniStatCard {
  border-radius: 20px;
  padding: 20px;
}

.mkResidentAccountContent .mkOrderCard {
  align-items: flex-start;
}

.mkResidentAccountContent .mkOrderCard strong, .mkResidentAccountContent .mkOrderCard span {
  overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
  .mkResidentAccountLayout {
    grid-template-columns: 1fr;
  }

  .mkResidentAccountContent .mkAccountGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .mkResidentProfileCard {
    grid-template-columns: 64px minmax(0, 1fr);
    padding: 18px;
  }

  .mkResidentAvatar {
    width: 64px;
    height: 64px;
    font-size: 1.65rem;
  }

  .mkResidentAccountContent .mkAccountGrid, .mkResidentAccountContent .mkAuthSearchBar, .mkResidentAccountContent .mkStatsRow {
    grid-template-columns: 1fr;
  }

  .mkResidentAccountContent .mkAuthSearchBar .mkButton {
    width: 100%;
  }
}

.mkPartnerEditorHero {
  background: linear-gradient(135deg, #fff8ea 0%, #fff 62%), #fff;
  box-shadow: 0 18px 44px #19365f0f;
}

.mkPartnerOfferForm, .mkPartnerProfileForm {
  border-radius: 28px;
  gap: 18px;
  box-shadow: 0 18px 44px #19365f0f;
}

.mkPartnerOfferForm .mkAuthField > span, .mkPartnerProfileForm .mkAuthField > span {
  color: #19365f;
  font-size: .92rem;
  font-weight: 800;
}

.mkAuthTextarea {
  resize: vertical;
  height: auto;
  min-height: 128px;
  padding: 14px 16px;
  line-height: 1.55;
}

.mkFileInput {
  background: #fff;
  min-height: auto;
  padding: 10px 12px;
}

.mkFileInput::file-selector-button {
  color: #fff;
  cursor: pointer;
  background: #19365f;
  border: 0;
  border-radius: 10px;
  margin-right: 12px;
  padding: 8px 12px;
  font-weight: 800;
}

.mkFieldHint {
  color: #7b6f60;
  margin-top: -2px;
  font-size: .84rem;
  line-height: 1.45;
}

.mkPartnerPricingRow {
  grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
  align-items: start;
}

.mkPartnerPriceField {
  align-content: start;
}

.mkPartnerOfferForm .mkOpsImagePreview {
  background: #faf7f1;
  border: 1px solid #ece7dd;
  border-radius: 20px;
  max-width: 520px;
  overflow: hidden;
}

.mkPartnerOfferForm .mkOpsImagePreview img {
  object-fit: cover;
  width: 100%;
  max-height: 280px;
  display: block;
}

.mkPartnerProfileSection {
  box-shadow: 0 18px 44px #19365f0d;
}

.mkPartnerProfileHeader {
  align-items: center;
}

.mkPartnerProfileHeader .mkHomeHeaderLink {
  color: #19365f;
  white-space: nowrap;
  max-width: none;
  font-size: .94rem;
  font-weight: 800;
}

.mkPartnerProfileForm {
  background: #fff;
}

.mkPartnerProfileMetaGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.mkPartnerProfileMetaGrid div {
  background: #faf7f1;
  border-radius: 18px;
  min-width: 0;
  padding: 16px 18px;
}

.mkPartnerProfileMetaGrid span {
  font-size: .86rem;
}

.mkPartnerProfileMetaGrid strong {
  color: #19365f;
  overflow-wrap: anywhere;
  min-width: 0;
  font-size: clamp(.98rem, 1.25vw, 1.22rem);
  line-height: 1.18;
}

.mkPartnerProfileForm .mkChartList {
  background: #fffdf8;
  border: 1px solid #ece7dd;
  border-radius: 20px;
  padding: 16px;
}

@media (max-width: 1180px) {
  .mkPartnerProfileMetaGrid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .mkPartnerPricingRow, .mkPartnerProfileMetaGrid {
    grid-template-columns: 1fr;
  }

  .mkPartnerOfferForm, .mkPartnerProfileForm {
    border-radius: 22px;
  }

  .mkPartnerProfileHeader {
    align-items: flex-start;
  }

  .mkPartnerProfileHeader .mkHomeHeaderLink {
    white-space: normal;
  }
}

/*# sourceMappingURL=%5Broot-of-the-server%5D__0mppvin._.css.map*/