:root {
  color-scheme: dark;
  --bg: #07090d;
  --panel: #0d1118;
  --panel-2: #121824;
  --line: rgba(255, 255, 255, 0.12);
  --text: #f4f7fb;
  --muted: #9aa5b5;
  --red: #ef233c;
  --cyan: #00d5ff;
  --steel: #6f7b8d;
  --white: #ffffff;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  position: relative;
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 12% 0%, rgba(239, 35, 60, 0.1), transparent 28rem),
    radial-gradient(circle at 88% 4%, rgba(0, 213, 255, 0.08), transparent 30rem),
    linear-gradient(180deg, #06080c, #040507 62%, #06080c);
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.04), rgba(0, 0, 0, 0.48)),
    radial-gradient(circle at center, transparent 36%, rgba(0, 0, 0, 0.36));
  opacity: 0.72;
}

/* Admin product costs */
body[data-page="admin"] .product-costs-panel {
  min-width: 0;
}

body[data-page="admin"] .product-costs-heading {
  margin-bottom: 18px;
}

.product-cost-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid #20303d;
  border-radius: 6px;
  background: #080f16;
}

.product-cost-search {
  position: relative;
  display: block;
  width: min(520px, 100%);
  min-width: 0;
}

.product-cost-search svg {
  position: absolute;
  top: 50%;
  left: 13px;
  width: 16px;
  height: 16px;
  color: #8298ad;
  transform: translateY(-50%);
  pointer-events: none;
}

.product-cost-search input {
  width: 100%;
  min-height: 40px;
  border: 1px solid #1c2b37;
  border-radius: 6px;
  padding: 0 14px 0 40px;
  color: #eef6fc;
  background: #050b11;
  font: inherit;
  font-size: .82rem;
}

.product-cost-search input::placeholder {
  color: #718496;
}

.product-cost-search input:focus {
  outline: 0;
  border-color: #079de1;
  box-shadow: 0 0 0 2px rgba(7, 157, 225, .12);
}

.product-cost-count {
  color: #8298ad;
  font-size: .76rem;
  font-weight: 800;
  white-space: nowrap;
}

.product-cost-table {
  overflow: hidden;
  border: 1px solid #20303d;
  border-radius: 6px;
  background: #080f16;
}

.product-cost-table-head,
.product-cost-table-row {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 150px 165px 175px 160px;
  align-items: center;
}

.product-cost-table-head {
  min-height: 46px;
  padding: 0 18px;
  border-bottom: 1px solid #20303d;
  background: #0b141d;
  color: #8298ad;
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.product-cost-table-head span:not(:first-child) {
  text-align: right;
}

.product-cost-table-row {
  min-height: 70px;
  padding: 10px 18px;
  border-bottom: 1px solid #192733;
}

.product-cost-table-row:last-child {
  border-bottom: 0;
}

.product-cost-table-row:hover {
  background: #0a1720;
}

.product-cost-product {
  display: grid;
  grid-template-columns: 50px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  min-width: 0;
  padding-right: 22px;
}

.product-cost-product img,
.product-cost-placeholder {
  width: 50px;
  height: 50px;
  border: 1px solid #203442;
  border-radius: 4px;
  background: #050a0f;
  object-fit: contain;
}

.product-cost-placeholder {
  display: grid;
  place-items: center;
  color: #668095;
}

.product-cost-placeholder svg {
  width: 18px;
  height: 18px;
}

.product-cost-product strong {
  overflow: hidden;
  color: #f2f7fb;
  font-size: .9rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-cost-value,
.product-cost-total,
.product-pix-total,
.product-sale-total,
.product-profit-total {
  color: #c6d3df;
  font-size: .9rem;
  text-align: right;
}

.product-cost-total {
  color: #00c8ff;
  font-size: .96rem;
}

.product-pix-total {
  color: #00c8ff;
  font-size: .96rem;
}

.product-sale-total,
.product-profit-total {
  color: #27df8b;
  font-size: .96rem;
}

.product-profit-total.is-negative {
  color: #ff5b74;
}

.product-cost-value.is-empty,
.product-cost-total.is-empty,
.product-pix-total.is-empty,
.product-sale-total.is-empty,
.product-profit-total.is-empty {
  color: #6f8293;
  font-weight: 600;
}

.product-cost-empty {
  display: grid;
  place-items: center;
  gap: 6px;
  min-height: 150px;
  padding: 28px;
  color: #8195a8;
  text-align: center;
}

.product-cost-empty svg {
  width: 24px;
  height: 24px;
  color: #00c8ff;
}

.product-cost-empty strong {
  color: #edf6fc;
  font-size: .92rem;
}

.product-cost-empty span {
  font-size: .78rem;
}

@media (max-width: 900px) {
  .product-cost-table {
    overflow-x: auto;
  }

  .product-cost-table-head,
  .product-cost-table-row {
    min-width: 850px;
  }
}

@media (max-width: 620px) {
  .product-cost-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .product-cost-search {
    width: 100%;
  }

  .product-cost-table {
    overflow: visible;
    border: 0;
    background: transparent;
  }

  .product-cost-table-head {
    display: none;
  }

  .product-cost-table-body {
    display: grid;
    gap: 10px;
  }

  .product-cost-table-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px 16px;
    min-width: 0;
    padding: 13px;
    border: 1px solid #20303d;
    border-radius: 7px;
    background: #080f16;
  }

  .product-cost-product {
    grid-column: 1 / -1;
    padding: 0 0 12px;
    border-bottom: 1px solid #1b2a35;
  }

  .product-cost-product strong {
    white-space: normal;
  }

  .product-cost-value,
  .product-cost-total,
  .product-pix-total,
  .product-sale-total,
  .product-profit-total {
    display: grid;
    gap: 4px;
    text-align: left;
  }

  .product-cost-value::before,
  .product-cost-total::before,
  .product-pix-total::before,
  .product-sale-total::before,
  .product-profit-total::before {
    content: attr(data-label);
    color: #708496;
    font-size: .64rem;
    font-weight: 800;
    text-transform: uppercase;
  }
}

/* PCs para Sim Racing */
.pc-admin-fields { display: grid; gap: 1rem; }
.pc-section-heading, .pc-benchmark-heading, .pc-component-editor header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.pc-section-heading h4 { margin: 0; }
.pc-component-list, .pc-benchmark-list { display: grid; gap: .8rem; }
.pc-component-editor, .pc-benchmark-editor { border: 1px solid #20313e; border-radius: 8px; background: #070c11; padding: .9rem; }
.pc-component-editor header { margin-bottom: .75rem; color: #eaf8ff; }
.pc-component-editor header input { width: 76px; min-height: 34px; }
.pc-component-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.pc-benefit-list { display: grid; gap: .6rem; }
.pc-benefit-editor { display: grid !important; grid-template-columns: 24px minmax(0, 1fr) 78px; align-items: center; gap: .65rem !important; }
.pc-benefit-editor input[type="checkbox"] { width: 18px; min-height: 18px; }
.pc-admin-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin: 0 0 1rem; }
.pc-admin-summary article { border: 1px solid #1f3340; border-radius: 8px; background: #071019; padding: 1rem; }
.pc-admin-summary span { display: block; color: #83a0b5; font-size: .75rem; }
.pc-admin-summary strong { display: block; margin-top: .35rem; color: #fff; font-size: 1.55rem; }
.pc-admin-row .admin-row-actions { flex-wrap: wrap; justify-content: flex-end; }
.product-editor-shell { display: block; min-width: 0; }
.pc-admin-panel #pcEditorMount { min-width: 0; margin-top: 1rem; }
.pc-admin-panel .product-editor-shell { display: block; }
.pc-admin-panel .product-editor-shell .product-editor-heading { border-top: 1px solid #1f3340; padding-top: 1.25rem; }

.pc-product-page { --pc-border: #193240; }
.pc-product-page,
.pc-product-page * { min-width: 0; }
.pc-product-hero .premium-buy-card { align-self: stretch; }
.pc-product-page .premium-breadcrumb strong,
.pc-buy-card h1,
.pc-buy-card .tag,
.pc-buy-card .pc-model-code,
.pc-buy-card .pc-subtitle { overflow-wrap: anywhere; }
.pc-buy-card .tag { width: auto; max-width: 100%; }
.pc-product-page .pc-buy-card h1 { max-width: 18ch; font-size: clamp(1.75rem, 2.25vw, 2.55rem); line-height: 1.05; }
.pc-buy-card .price-stack strong { font-size: clamp(1.9rem, 2.55vw, 2.8rem); }
.pc-buy-card .price-stack span,
.pc-buy-card .price-stack em { font-size: clamp(.88rem, 1.05vw, 1rem); line-height: 1.35; }
.pc-buy-card .premium-actions .button { min-height: 46px; padding-inline: 1rem; font-size: .9rem; line-height: 1.2; text-align: center; white-space: normal; }
.pc-model-code { color: #7e95a7; text-transform: uppercase; font-weight: 800; }
.pc-subtitle { margin: 0; color: #a6b6c3; line-height: 1.5; }
.pc-delivery-copy { margin: .65rem 0 0; border-top: 1px solid var(--pc-border); padding-top: .7rem; color: #8fabbd; }
.pc-whatsapp-button { text-decoration: none; }
.pc-benefit-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; margin: 16px 0; border: 1px solid var(--pc-border); background: var(--pc-border); }
.pc-benefit-strip article { min-height: 82px; display: grid; place-items: center; align-content: center; gap: .4rem; padding: .75rem; background: #071019; text-align: center; }
.pc-benefit-strip svg, .pc-included-grid svg { width: 22px; color: #00c8ff; }
.pc-benefit-strip strong { color: #effaff; font-size: .82rem; }
.pc-detail-section { margin-top: 16px; border: 1px solid var(--pc-border); border-radius: 8px; background: #071019; padding: clamp(16px, 2vw, 26px); }
.pc-detail-section .section-heading { margin-bottom: .9rem; }
.pc-detail-section .section-heading h2, .pc-support-section h2, .pc-customization-section h2 { color: #fff; }
.pc-spec-grid, .pc-usage-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.pc-spec-grid article, .pc-usage-grid article { border: 1px solid #1b3341; border-radius: 7px; background: #050a0f; padding: .8rem; }
.pc-spec-grid span, .pc-usage-grid span { display: block; color: #6f8ca0; font-size: .72rem; text-transform: uppercase; font-weight: 800; }
.pc-spec-grid strong, .pc-usage-grid strong { display: block; margin-top: .4rem; color: #f4fbff; }
.pc-spec-grid p, .pc-section-note { color: #91a7b7; line-height: 1.6; }
.pc-section-note { margin: 1rem 0 0; }
.pc-benchmark-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.pc-benchmark-cards article { border: 1px solid #1b3341; border-radius: 8px; background: #050a0f; padding: 1.15rem; }
.pc-benchmark-cards header { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.pc-benchmark-cards header span { border: 1px solid #00a9df; border-radius: 999px; padding: .3rem .55rem; color: #00c8ff; font-size: .68rem; font-weight: 900; }
.pc-benchmark-cards dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
.pc-benchmark-cards dt { color: #6f8ca0; font-size: .68rem; text-transform: uppercase; }
.pc-benchmark-cards dd { margin: .2rem 0 0; color: #fff; font-weight: 800; }
.pc-benchmark-cards p { color: #91a7b7; }
.pc-included-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .65rem; }
.pc-included-grid article { display: flex; align-items: center; gap: .65rem; border: 1px solid #1b3341; border-radius: 7px; padding: .85rem; color: #e7f7ff; }
.pc-support-section > div, .pc-customization-section > div { max-width: 850px; }
.pc-support-section p, .pc-support-section small, .pc-customization-section p { display: block; color: #91a7b7; line-height: 1.7; }

@media (max-width: 760px) {
  .pc-component-grid, .pc-admin-summary, .pc-spec-grid, .pc-usage-grid, .pc-benchmark-cards, .pc-included-grid { grid-template-columns: 1fr; }
  .pc-benefit-strip { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .pc-benefit-strip article { min-width: 180px; scroll-snap-align: start; }
  .pc-product-page { padding-left: 12px; padding-right: 12px; }
  .pc-product-page .pc-buy-card h1 { max-width: none; font-size: clamp(1.8rem, 8vw, 2.2rem); }
  .pc-buy-card .price-stack strong { font-size: clamp(2rem, 10vw, 2.7rem); }
  .pc-product-page .premium-actions .button { width: 100%; }
  .pc-benchmark-cards dl { grid-template-columns: 1fr; }
  .pc-benefit-editor { grid-template-columns: 22px minmax(0, 1fr) 64px; }
}

.site-header,
main,
.footer {
  position: relative;
  z-index: 1;
}

.hidden {
  display: none !important;
}

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

button,
a {
  -webkit-tap-highlight-color: transparent;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 1rem;
  align-items: center;
  min-height: 76px;
  padding: 0 4vw;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  background:
    linear-gradient(90deg, rgba(239, 35, 60, 0.08), transparent 28%, rgba(0, 213, 255, 0.045)),
    rgba(5, 6, 9, 0.92);
  backdrop-filter: blur(18px);
}

.brand,
.main-nav,
.hero-actions,
.hero-specs,
.section-heading,
.product-bottom,
.consulting-band {
  display: flex;
  align-items: center;
}

.footer {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(240px, 1.2fr) minmax(240px, 1fr);
  gap: 1.25rem;
  align-items: start;
  padding: 2rem 5vw;
  border-top: 1px solid var(--line);
  background: rgba(5, 7, 10, 0.72);
}

.footer strong,
.footer span,
.footer a {
  display: block;
}

.footer strong {
  margin-bottom: 0.35rem;
  color: var(--white);
  font-size: 1.05rem;
}

.footer span,
.footer a {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.6;
}

.footer nav,
.footer-contact {
  display: grid;
  gap: 0.35rem;
}

.footer a:hover {
  color: var(--cyan);
}

.product-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  justify-content: flex-start;
}

.product-social-links a {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 200, 255, 0.28);
  border-radius: 50%;
  background: rgba(9, 17, 24, 0.78);
  color: var(--cyan);
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.product-social-links a:hover {
  border-color: var(--cyan);
  background: rgba(0, 200, 255, 0.1);
  color: var(--white);
  transform: translateY(-2px);
}

.product-social-links svg {
  width: 21px;
  height: 21px;
  fill: currentColor;
}

.admin-topbar {
  position: static;
}

.auth-shell {
  display: grid;
  place-items: center;
  min-height: calc(100vh - 72px);
  padding: 5rem 5vw;
}

.auth-card {
  width: min(620px, 100%);
  padding: 2rem;
  border: 1px solid var(--line);
  background:
    linear-gradient(135deg, rgba(0, 213, 255, 0.08), transparent 42%),
    linear-gradient(180deg, var(--panel-2), var(--panel));
}

.register-card {
  width: min(920px, 100%);
}

.auth-card h1 {
  max-width: 10ch;
  font-size: clamp(2.8rem, 7vw, 5.6rem);
}

.auth-copy,
.auth-hint,
.login-error {
  color: var(--muted);
  line-height: 1.65;
}

.google-auth-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
  min-height: 48px;
  margin-top: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 6px;
  background: #f8fafc;
  color: #111827;
  cursor: pointer;
  font: inherit;
  font-weight: 850;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.google-auth-button:hover,
.google-auth-button:focus-visible {
  border-color: rgba(0, 200, 255, 0.85);
  box-shadow: 0 0 0 3px rgba(0, 200, 255, 0.12);
  outline: none;
  transform: translateY(-1px);
}

.google-auth-button:disabled {
  cursor: wait;
  opacity: 0.72;
  transform: none;
}

.google-auth-icon {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
}

.auth-oauth-notice {
  margin: 0.7rem 0 0;
  color: #8fa2b6;
  font-size: 0.78rem;
  line-height: 1.5;
  text-align: center;
}

.auth-divider {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 0.8rem;
  margin: 1.25rem 0 0.15rem;
  color: #7f91a4;
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
}

.auth-divider::before,
.auth-divider::after {
  height: 1px;
  background: #1b2b38;
  content: "";
}

.auth-hint {
  margin-bottom: 0;
  font-size: 0.9rem;
}

.login-error {
  min-height: 1.4rem;
  color: #ff7d8c;
  font-weight: 800;
}

.auth-card label {
  display: grid;
  gap: 0.45rem;
  margin-top: 1rem;
  color: #c7d0dc;
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.register-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
  margin-top: 1rem;
}

.auth-card input,
.auth-card select {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  background: #0b1018;
  color: var(--white);
  font: inherit;
  padding: 0.85rem;
  outline: none;
}

.auth-card input:focus,
.auth-card select:focus {
  border-color: rgba(0, 213, 255, 0.72);
  box-shadow: 0 0 0 3px rgba(0, 213, 255, 0.08);
}

.auth-password-control {
  position: relative;
  display: block;
  width: 100%;
}

.auth-password-control > input {
  width: 100%;
  padding-right: 5rem;
}

.auth-password-toggle {
  position: absolute;
  top: 50%;
  right: 0.8rem;
  border: 0;
  background: transparent;
  color: var(--cyan);
  cursor: pointer;
  font: inherit;
  font-size: 0.75rem;
  font-weight: 900;
  transform: translateY(-50%);
}

.auth-password-toggle:hover,
.auth-password-toggle:focus-visible {
  color: #fff;
  outline: none;
}

.auth-password-requirements {
  align-self: end;
  margin: 0.55rem 0 0;
  color: #91a3b5;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.45;
}

.auth-password-requirements.valid {
  color: #39df8f;
}

.auth-confirmed-hint {
  color: #39df8f;
  font-weight: 850;
}

.auth-card .button {
  width: 100%;
  margin-top: 1rem;
}

.auth-privacy-notice {
  margin-top: 1.2rem;
  border-left: 3px solid var(--cyan);
  background: rgba(0, 200, 255, 0.06);
  padding: 0.85rem 1rem;
}

.auth-privacy-notice strong {
  color: #f6fbff;
  font-size: 0.9rem;
}

.auth-privacy-notice p {
  margin: 0.28rem 0 0;
  color: #94a6b8;
  font-size: 0.78rem;
  line-height: 1.55;
}

.auth-consent-list {
  display: grid;
  gap: 0.65rem;
  margin-top: 0.85rem;
}

.auth-card .auth-consent-option {
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: start;
  gap: 0.7rem;
  margin: 0;
  border: 1px solid #1b2b38;
  border-radius: 7px;
  background: #071019;
  padding: 0.8rem 0.9rem;
  color: #b7c4d1;
  font-size: 0.76rem;
  font-weight: 650;
  line-height: 1.5;
  text-transform: none;
}

.auth-card .auth-consent-option input {
  width: 18px;
  height: 18px;
  min-height: 18px;
  margin: 0.1rem 0 0;
  accent-color: #00c8ff;
}

.auth-consent-option a,
.privacy-footer-link {
  color: #00c8ff;
  font-weight: 850;
}

.auth-consent-option em,
.profile-check em {
  color: #7f91a4;
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

.auth-consent-optional {
  border-style: dashed !important;
}

.auth-link {
  display: inline-flex;
  margin-top: 1rem;
  color: var(--cyan);
  font-weight: 800;
}

.auth-field-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.auth-field {
  display: grid;
  gap: 0.45rem;
  margin-top: 1rem;
}

.auth-field > .auth-field-heading > label {
  display: block;
  margin: 0;
}

.auth-field > input {
  width: 100%;
}

.auth-password-link {
  border: 0;
  background: transparent;
  color: var(--cyan);
  cursor: pointer;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 800;
  padding: 0;
}

.auth-password-link:hover,
.auth-password-link:focus-visible {
  color: #fff;
  outline: none;
  text-decoration: underline;
}

.auth-inline-switch {
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font: inherit;
}

.auth-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 18px;
}

.auth-modal.hidden {
  display: none;
}

.auth-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(10px);
}

.auth-modal-panel {
  position: relative;
  width: min(760px, 100%);
  max-height: min(92vh, 860px);
  overflow: auto;
  border: 1px solid rgba(0, 200, 255, 0.22);
  border-radius: 8px;
  background:
    radial-gradient(circle at 12% 0%, rgba(0, 200, 255, 0.14), transparent 26rem),
    linear-gradient(180deg, rgba(13, 20, 29, 0.98), rgba(5, 8, 12, 0.98));
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.62);
}

.auth-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 7px;
  background: #0b1118;
  color: #f8fafc;
  cursor: pointer;
  font: inherit;
  font-size: 1.35rem;
  font-weight: 900;
}

.auth-modal-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 16px 60px 0 16px;
}

.auth-modal-tabs button {
  min-height: 40px;
  border: 1px solid #1d2a36;
  border-radius: 7px;
  background: #080f16;
  color: #a8b6c7;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
}

.auth-modal-tabs button.active {
  border-color: rgba(0, 200, 255, 0.64);
  background: linear-gradient(135deg, rgba(0, 200, 255, 0.18), rgba(0, 92, 160, 0.14));
  color: #fff;
}

.auth-modal-card {
  width: 100%;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.auth-modal-card h1 {
  max-width: none;
  font-size: clamp(2.4rem, 6vw, 4.6rem);
  line-height: 0.96;
}

.auth-modal .register-card {
  width: 100%;
}

.password-reset-panel {
  width: min(560px, 100%);
}

.password-reset-panel .auth-modal-card h1 {
  max-width: 12ch;
  font-size: clamp(2.4rem, 8vw, 4rem);
}

.password-reset-status {
  min-height: 1.4rem;
  margin: 0.9rem 0 0;
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 800;
  line-height: 1.5;
}

.password-reset-status.success {
  color: #39df8f;
}

.password-reset-status.error {
  color: #ff7d8c;
}

.password-update-success {
  padding: 2rem;
}

.password-update-success h2 {
  margin: 0;
  color: var(--white);
  font-size: clamp(2rem, 6vw, 3.2rem);
  line-height: 1;
}

.password-update-success p:not(.eyebrow) {
  margin: 1rem 0 1.4rem;
  color: var(--muted);
  line-height: 1.6;
}

.password-update-success .button {
  width: 100%;
}

.auth-modal-open {
  overflow: hidden;
}

.register-success-panel {
  position: relative;
  width: min(460px, 100%);
  padding: 2rem;
  border: 1px solid rgba(0, 200, 255, 0.24);
  border-radius: 8px;
  background:
    radial-gradient(circle at 15% 0%, rgba(0, 200, 255, 0.18), transparent 18rem),
    linear-gradient(180deg, rgba(13, 20, 29, 0.98), rgba(5, 8, 12, 0.99));
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.62);
  text-align: left;
}

.register-success-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  border: 1px solid rgba(34, 197, 94, 0.42);
  border-radius: 8px;
  color: #22c55e;
  background: rgba(34, 197, 94, 0.12);
}

.register-success-icon svg {
  width: 24px;
  height: 24px;
}

.register-success-panel h2 {
  margin: 0;
  color: var(--white);
  font-size: clamp(1.8rem, 5vw, 3rem);
  line-height: 1;
}

.register-success-panel p:not(.eyebrow) {
  margin: 1rem 0 1.4rem;
  color: var(--muted);
  line-height: 1.6;
}

.register-success-panel .button {
  width: 100%;
}

.auth-minimal-header {
  display: flex;
  justify-content: space-between;
  min-height: 76px;
  padding-inline: clamp(1rem, 5vw, 4rem);
}

.auth-minimal-header .button {
  min-height: 42px;
  margin-left: auto;
}

.auth-flow-shell {
  display: grid;
  min-height: calc(100vh - 76px);
  place-items: center;
  padding: clamp(2rem, 7vw, 6rem) 1rem;
  background:
    radial-gradient(circle at 50% 16%, rgba(0, 184, 255, 0.1), transparent 28rem),
    #05080c;
}

.auth-flow-card {
  width: min(620px, 100%);
  padding: clamp(1.5rem, 5vw, 2.7rem);
  border: 1px solid rgba(0, 184, 255, 0.24);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(11, 17, 24, 0.98), rgba(6, 11, 16, 0.98));
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.52);
}

.auth-flow-card h1 {
  max-width: 13ch;
  margin: 0.3rem 0 1rem;
  color: #f8fafc;
  font-size: clamp(2.25rem, 7vw, 4rem);
  line-height: 0.98;
}

.auth-flow-card p {
  color: var(--muted);
  line-height: 1.65;
}

.auth-flow-card label {
  display: grid;
  gap: 0.45rem;
  margin-top: 1rem;
  color: #c7d0dc;
  font-size: 0.8rem;
  font-weight: 850;
  text-transform: uppercase;
}

.auth-flow-card input {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  outline: none;
  background: #071017;
  color: #fff;
  font: inherit;
  padding: 0.9rem;
}

.auth-flow-card input:focus {
  border-color: rgba(0, 184, 255, 0.78);
  box-shadow: 0 0 0 3px rgba(0, 184, 255, 0.09);
}

.auth-flow-card .button {
  width: 100%;
  margin-top: 1.25rem;
}

.auth-flow-card small {
  display: block;
  margin-top: 1rem;
  color: #7f91a2;
  text-align: center;
}

.auth-flow-icon {
  display: grid;
  width: 52px;
  height: 52px;
  margin-bottom: 1.15rem;
  place-items: center;
  border: 1px solid rgba(0, 184, 255, 0.38);
  border-radius: 8px;
  background: rgba(0, 184, 255, 0.1);
  color: var(--cyan);
  font-size: 1.5rem;
  font-weight: 950;
}

.auth-flow-icon.success {
  border-color: rgba(57, 223, 143, 0.42);
  background: rgba(57, 223, 143, 0.1);
  color: #39df8f;
}

.auth-flow-icon.error {
  border-color: rgba(255, 125, 140, 0.42);
  background: rgba(255, 125, 140, 0.1);
  color: #ff7d8c;
}

.auth-flow-loading::after {
  width: 19px;
  height: 19px;
  border: 2px solid rgba(0, 184, 255, 0.28);
  border-top-color: var(--cyan);
  border-radius: 50%;
  content: "";
  animation: auth-flow-spin 0.8s linear infinite;
}

.auth-flow-message {
  min-height: 1.4rem;
  margin: 0.9rem 0 0;
  font-weight: 750;
}

.auth-flow-message.error {
  color: #ff7d8c;
}

@keyframes auth-flow-spin {
  to { transform: rotate(360deg); }
}

.consent-row {
  margin-top: 1rem;
  color: #c7d0dc;
}

.brand {
  gap: 0.75rem;
  min-width: 220px;
}

.brand-logo {
  width: 48px;
  height: 48px;
  display: block;
  border: 1px solid rgba(0, 213, 255, 0.42);
  border-radius: 50%;
  object-fit: cover;
  background: #05070a;
  box-shadow: 0 0 22px rgba(0, 213, 255, 0.13), 0 0 18px rgba(239, 35, 60, 0.2);
}

.brand strong,
.brand small {
  display: block;
}

.brand strong {
  letter-spacing: 0.02em;
}

.brand small {
  margin-top: 0.1rem;
  color: var(--muted);
  font-size: 0.72rem;
}

.main-nav {
  justify-content: center;
  gap: clamp(0.75rem, 1.4vw, 1.35rem);
  color: #aeb8c7;
  font-size: 0.86rem;
  font-weight: 750;
}

.main-nav a {
  position: relative;
  padding: 0.72rem 0;
}

.main-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: 0.42rem;
  height: 1px;
  background: var(--cyan);
  transition: right 180ms ease;
}

.main-nav a:hover,
.text-link:hover {
  color: var(--white);
}

.main-nav a:hover::after {
  right: 0;
}

.cart-button,
.account-button {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: 40px;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #0e141d;
  color: var(--white);
  border-radius: 4px;
}

.cart-button {
  min-width: 64px;
  cursor: pointer;
}

.cart-icon {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--cyan);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.account-button {
  padding: 0 0.9rem;
  color: #dbe4ef;
  font-size: 0.86rem;
  font-weight: 850;
}

.account-button:hover,
.cart-button:hover {
  border-color: rgba(0, 213, 255, 0.55);
}

.account-icon {
  color: var(--cyan);
  font-size: 1.05rem;
}

.cart-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  background: rgba(0, 0, 0, 0.64);
  backdrop-filter: blur(4px);
}

.cart-drawer {
  position: fixed;
  inset: 0 0 0 auto;
  z-index: 60;
  width: min(500px, 100%);
  overflow-y: auto;
  padding: 1.4rem;
  border-left: 1px solid rgba(0, 213, 255, 0.26);
  background:
    linear-gradient(145deg, rgba(0, 213, 255, 0.06), transparent 42%),
    #080c12;
  box-shadow: -24px 0 80px rgba(0, 0, 0, 0.42);
}

.cart-drawer-heading,
.cart-total,
.cart-qty {
  display: flex;
  align-items: center;
}

.cart-drawer-heading,
.cart-total {
  justify-content: space-between;
  gap: 1rem;
}

.cart-items {
  display: grid;
  gap: 0.75rem;
  margin: 1.2rem 0;
}

.cart-empty {
  margin: 0;
  color: var(--muted);
}

.cart-line {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  gap: 0.85rem;
  padding: 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(0, 213, 255, 0.055), transparent 44%),
    rgba(255, 255, 255, 0.025);
}

.cart-line img,
.cart-line-thumb {
  border-radius: 6px;
  width: 84px;
  height: 68px;
  object-fit: cover;
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.04) 0 2px, transparent 2px 8px),
    #101722;
}

.cart-line strong,
.cart-line span {
  display: block;
}

.cart-line span {
  margin-top: 0.25rem;
  color: var(--muted);
  font-size: 0.86rem;
}

.cart-qty {
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.65rem;
}

.cart-qty button {
  min-width: 32px;
  min-height: 32px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.055);
  color: var(--white);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 850;
  cursor: pointer;
}

.cart-qty button:last-child {
  padding: 0 0.8rem;
  border-color: rgba(239, 35, 60, 0.32);
  color: #ff9aa7;
}

.cart-total {
  margin: 1rem 0;
  padding: 1rem 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.cart-checkout-button {
  width: 100%;
  justify-content: center;
}

body.cart-drawer-open {
  position: fixed;
  inset-inline: 0;
  width: 100%;
  overflow: hidden;
}

.cart-backdrop {
  z-index: 120;
  display: block;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  background: rgba(1, 4, 8, 0.72);
  backdrop-filter: blur(3px);
  transition: opacity 220ms ease, visibility 0s linear 220ms;
}

.cart-backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.cart-drawer {
  z-index: 130;
  width: clamp(400px, 34vw, 448px);
  max-width: calc(100vw - 24px);
  height: 100vh;
  height: 100dvh;
  padding: 0;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  overflow: hidden;
  border-left: 1px solid #173543;
  background:
    linear-gradient(145deg, rgba(0, 200, 255, 0.035), transparent 38%),
    #05080c;
  box-shadow: -24px 0 72px rgba(0, 0, 0, 0.62);
  transform: translate3d(104%, 0, 0);
  visibility: hidden;
  transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 240ms;
  will-change: transform;
  overscroll-behavior: contain;
}

.cart-drawer.is-open {
  transform: translate3d(0, 0, 0);
  visibility: visible;
  transition-delay: 0s;
}

.cart-drawer-heading {
  min-height: 84px;
  padding: 20px 22px 17px;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid #162b36;
  background: rgba(5, 8, 12, 0.97);
}

.cart-drawer-eyebrow {
  display: block;
  margin-bottom: 4px;
  color: #00c8ff;
  font-size: 0.64rem;
  font-weight: 900;
  text-transform: uppercase;
}

.cart-drawer-heading h2 {
  margin: 0;
  color: #f7fbfd;
  font-size: 1.55rem;
  line-height: 1.08;
}

.cart-drawer-heading h2 span {
  color: #91a5b2;
  font-weight: 650;
}

.cart-drawer-close {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  display: grid;
  place-items: center;
  border: 1px solid #263b47;
  border-radius: 7px;
  background: #0a1118;
  color: #e9f7fc;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.cart-drawer-close:hover {
  border-color: #00bfe9;
  background: #0b1a22;
  transform: translateY(-1px);
}

.cart-drawer-close svg,
.cart-drawer-notice svg,
.cart-empty-icon svg,
.cart-quantity svg,
.cart-remove-button svg,
.cart-drawer-action svg,
.cart-delivery-info svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.cart-drawer-notice {
  min-height: 48px;
  margin: 12px 20px 0;
  padding: 11px 13px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(20, 209, 125, 0.36);
  border-radius: 7px;
  background: rgba(10, 88, 56, 0.22);
  color: #6ce7ad;
  font-size: 0.8rem;
  animation: cartNoticeIn 180ms ease both;
}

.cart-drawer-notice > span {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: grid;
  place-items: center;
}

.cart-drawer-notice.is-neutral {
  border-color: rgba(0, 200, 255, 0.3);
  background: rgba(0, 115, 153, 0.16);
  color: #87ddf5;
}

.cart-drawer-notice.is-error {
  border-color: rgba(239, 35, 60, 0.42);
  background: rgba(99, 15, 28, 0.24);
  color: #ff9cab;
}

.cart-drawer-body {
  min-height: 0;
  overflow: hidden;
}

.cart-drawer .cart-items {
  height: 100%;
  margin: 0;
  padding: 16px 20px 24px;
  display: block;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #245064 transparent;
}

.cart-product-card {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 13px;
  margin-bottom: 10px;
  padding: 12px;
  border: 1px solid #172d38;
  border-radius: 8px;
  background: #091017;
  transition: border-color 160ms ease, background 160ms ease;
}

.cart-product-card:hover {
  border-color: #245065;
  background: #0a131b;
}

.cart-product-card.is-unavailable {
  border-color: rgba(239, 35, 60, 0.34);
}

.cart-product-image {
  width: 88px;
  height: 88px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #1c313c;
  border-radius: 7px;
  background: #05090d;
}

.cart-product-image img {
  width: 100%;
  height: 100%;
  padding: 5px;
  display: block;
  object-fit: contain;
}

.cart-product-image > span {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: center;
  color: #506875;
  background:
    repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 2px, transparent 2px 9px),
    #080d12;
}

.cart-product-copy {
  min-width: 0;
}

.cart-product-brand {
  display: block;
  margin-bottom: 3px;
  overflow: hidden;
  color: #00c8ff;
  font-size: 0.61rem;
  font-weight: 900;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cart-product-copy > strong {
  min-height: 2.4em;
  display: -webkit-box;
  overflow: hidden;
  color: #f4f8fa;
  font-size: 0.85rem;
  line-height: 1.2;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.cart-product-copy > small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: #849aa7;
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cart-product-price {
  margin-top: 7px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.cart-product-price span {
  color: #7f95a2;
  font-size: 0.67rem;
}

.cart-product-price b {
  color: #f4f9fb;
  font-size: 0.84rem;
  white-space: nowrap;
}

.cart-stock-message {
  margin: 5px 0 0;
  color: #ff9cab;
  font-size: 0.65rem;
  line-height: 1.3;
}

.cart-product-controls {
  margin-top: 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.cart-quantity {
  height: 34px;
  display: inline-grid;
  grid-template-columns: 34px 34px 34px;
  align-items: center;
  overflow: hidden;
  border: 1px solid #263b47;
  border-radius: 6px;
  background: #060b10;
}

.cart-quantity button,
.cart-remove-button {
  border: 0;
  background: transparent;
  color: #c6d6de;
  cursor: pointer;
}

.cart-quantity button {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
}

.cart-quantity button:hover:not(:disabled) {
  color: #00c8ff;
  background: rgba(0, 200, 255, 0.08);
}

.cart-quantity button:disabled {
  color: #3d505a;
  cursor: not-allowed;
}

.cart-quantity output {
  height: 100%;
  display: grid;
  place-items: center;
  border-inline: 1px solid #1c303a;
  color: #f5f9fb;
  font-size: 0.76rem;
  font-weight: 850;
}

.cart-remove-button {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border: 1px solid #273a45;
  border-radius: 6px;
  color: #8297a3;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
}

.cart-remove-button:hover {
  border-color: rgba(239, 35, 60, 0.46);
  background: rgba(239, 35, 60, 0.08);
  color: #ff8d9d;
}

.cart-empty-state {
  min-height: 100%;
  padding: 30px 22px;
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
}

.cart-empty-icon {
  width: 58px;
  height: 58px;
  margin-bottom: 15px;
  display: grid;
  place-items: center;
  border: 1px solid #1c4a5e;
  border-radius: 8px;
  background: #071923;
  color: #00c8ff;
}

.cart-empty-icon svg {
  width: 27px;
  height: 27px;
}

.cart-empty-state strong {
  color: #f5f9fb;
  font-size: 1.05rem;
}

.cart-empty-state p {
  max-width: 260px;
  margin: 8px 0 20px;
  color: #8ea2ae;
  font-size: 0.8rem;
  line-height: 1.55;
}

.cart-empty-button {
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid #00bce8;
  border-radius: 6px;
  background: #079fe1;
  color: #fff;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
}

.cart-drawer-footer {
  max-height: min(53dvh, 430px);
  padding: 15px 20px calc(15px + env(safe-area-inset-bottom));
  overflow-y: auto;
  border-top: 1px solid #19313d;
  background: #070c12;
  box-shadow: 0 -16px 34px rgba(0, 0, 0, 0.38);
  scrollbar-width: thin;
  scrollbar-color: #245064 transparent;
}

.cart-drawer-footer:empty {
  display: none;
}

.cart-order-summary h3 {
  margin: 0 0 10px;
  color: #f4f8fa;
  font-size: 0.9rem;
}

.cart-order-summary dl {
  margin: 0;
}

.cart-order-summary dl > div {
  min-height: 29px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  color: #91a4af;
  font-size: 0.72rem;
}

.cart-order-summary dt,
.cart-order-summary dd {
  margin: 0;
}

.cart-order-summary dd {
  color: #eaf4f8;
  font-weight: 850;
  text-align: right;
  white-space: nowrap;
}

.cart-order-summary .cart-summary-discount dd {
  color: #63daa3;
}

.cart-order-summary .cart-summary-pix {
  min-height: 40px;
  margin-top: 5px;
  padding-top: 8px;
  border-top: 1px solid #1b303a;
}

.cart-summary-pix dt {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #cfe8f1;
  font-weight: 850;
}

.cart-summary-pix em {
  padding: 3px 6px;
  border-radius: 4px;
  background: rgba(0, 200, 255, 0.12);
  color: #00c8ff;
  font-size: 0.58rem;
  font-style: normal;
}

.cart-order-summary .cart-summary-pix dd {
  color: #00c8ff;
  font-size: 1.04rem;
}

.cart-summary-card {
  padding-top: 5px;
}

.cart-summary-card dt span,
.cart-summary-card dt small {
  display: block;
}

.cart-summary-card dt span {
  color: #d7e5eb;
  font-weight: 800;
}

.cart-summary-card dt small {
  margin-top: 2px;
  color: #718894;
  font-size: 0.6rem;
}

.cart-payment-methods {
  margin: 10px 0 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cart-payment-methods > span {
  width: 42px;
  height: 27px;
  display: grid;
  place-items: center;
  border: 1px solid #273a44;
  border-radius: 5px;
  background: #f6f8fa;
}

.cart-payment-methods img {
  width: 25px;
  height: 18px;
  display: block;
  object-fit: contain;
}

.cart-drawer-actions {
  display: grid;
  gap: 8px;
}

.cart-drawer-action {
  min-height: 48px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid #00bce8;
  border-radius: 6px;
  font-size: 0.76rem;
  font-weight: 900;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.cart-drawer-action:hover:not(:disabled) {
  transform: translateY(-1px);
}

.cart-drawer-action-primary {
  justify-content: space-between;
  background: #079fe1;
  color: #fff;
  box-shadow: 0 10px 26px rgba(0, 174, 232, 0.2);
}

.cart-drawer-action-primary:hover:not(:disabled) {
  background: #08acef;
  box-shadow: 0 12px 30px rgba(0, 174, 232, 0.28);
}

.cart-drawer-action-pix {
  background: transparent;
  color: #e8f7fc;
}

.cart-drawer-action-pix:hover:not(:disabled) {
  background: rgba(0, 200, 255, 0.07);
}

.cart-drawer-action-pix img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}

.cart-drawer-action:disabled {
  border-color: #263740;
  background: #10171d;
  color: #617580;
  box-shadow: none;
  cursor: not-allowed;
}

.cart-delivery-info {
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #8fa5b0;
  font-size: 0.66rem;
  line-height: 1.35;
  text-align: center;
}

.cart-delivery-info svg {
  flex: 0 0 17px;
  width: 17px;
  height: 17px;
  color: #00c8ff;
}

.cart-drawer :is(button, a):focus-visible {
  outline: 2px solid #00c8ff;
  outline-offset: 2px;
}

@keyframes cartNoticeIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 620px) {
  .cart-drawer {
    width: 100%;
    max-width: 100%;
    border-left: 0;
  }

  .cart-drawer-heading {
    min-height: 72px;
    padding: 15px 16px 13px;
  }

  .cart-drawer-heading h2 {
    font-size: 1.3rem;
  }

  .cart-drawer-close {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }

  .cart-drawer-notice {
    margin: 10px 14px 0;
  }

  .cart-drawer .cart-items {
    padding: 13px 14px 20px;
  }

  .cart-product-card {
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 11px;
    padding: 10px;
  }

  .cart-product-image {
    width: 78px;
    height: 82px;
  }

  .cart-product-copy > strong {
    font-size: 0.8rem;
  }

  .cart-product-price {
    margin-top: 5px;
  }

  .cart-product-controls {
    margin-top: 7px;
  }

  .cart-drawer-footer {
    max-height: 55dvh;
    padding: 13px 14px calc(13px + env(safe-area-inset-bottom));
  }

  .cart-payment-methods {
    justify-content: space-between;
  }

  .cart-payment-methods > span {
    width: 39px;
    height: 26px;
  }

  .cart-drawer-action {
    min-height: 50px;
  }
}

@media (max-width: 380px) {
  .cart-product-card {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .cart-product-image {
    width: 72px;
    height: 78px;
  }

  .cart-product-price span {
    display: none;
  }
}

@media (max-height: 700px) {
  .cart-drawer-footer {
    max-height: 52dvh;
  }

  .cart-payment-methods {
    margin-block: 7px 9px;
  }

  .cart-drawer-action {
    min-height: 44px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cart-drawer,
  .cart-backdrop,
  .cart-drawer-notice {
    animation: none;
    transition-duration: 0.01ms;
  }
}

.checkout-page {
  padding: 4rem 4vw 5rem;
  background:
    radial-gradient(circle at 16% 0%, rgba(239, 35, 60, 0.13), transparent 30%),
    radial-gradient(circle at 86% 18%, rgba(0, 213, 255, 0.1), transparent 32%),
    #070a10;
}

.checkout-hero {
  max-width: 860px;
  margin-bottom: 2rem;
}

.checkout-hero h1 {
  max-width: 760px;
  margin: 0.4rem 0 0.8rem;
  font-size: clamp(2.5rem, 6vw, 5.8rem);
  line-height: 0.92;
}

.checkout-hero p {
  max-width: 680px;
  color: #c5d0df;
  font-size: 1.03rem;
  line-height: 1.65;
}

.checkout-layout {
  display: grid;
  grid-template-columns: minmax(320px, 0.78fr) minmax(420px, 1fr);
  gap: 1.2rem;
  align-items: start;
}

.checkout-summary-panel,
.checkout-payment-panel {
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.04), transparent 42%),
    rgba(9, 14, 22, 0.94);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
}

.checkout-summary-panel {
  position: sticky;
  top: 96px;
  padding: 1.1rem;
}

.checkout-payment-panel {
  padding: 1.35rem;
}

.panel-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}

.panel-heading h2 {
  margin: 0.25rem 0 0;
  font-size: clamp(1.6rem, 3vw, 2.6rem);
}

.checkout-page-form {
  gap: 0.85rem;
}

.checkout-data-title {
  display: grid;
  gap: 0.25rem;
  padding-top: 0.35rem;
}

.checkout-data-title p {
  margin: 0;
  color: var(--muted);
}

.use-profile-toggle {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  padding: 0.9rem 1rem;
  border: 1px solid rgba(0, 213, 255, 0.24);
  background: rgba(0, 213, 255, 0.06);
  color: #dbe7f5;
  font-size: 0.9rem;
  font-weight: 850;
  text-transform: none;
}

.use-profile-toggle input {
  width: 18px;
  min-width: 18px;
  height: 18px;
  accent-color: var(--cyan);
}

.checkout-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

.checkout-form label {
  display: grid;
  gap: 0.4rem;
  color: #c7d0dc;
  font-size: 0.76rem;
  font-weight: 850;
  text-transform: uppercase;
}

.checkout-form input,
.checkout-form select {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  background: #0b1018;
  color: var(--white);
  font: inherit;
  padding: 0.8rem;
  outline: none;
}

.checkout-form input:focus,
.checkout-form select:focus,
.card-fields select:focus {
  border-color: rgba(0, 213, 255, 0.72);
  box-shadow: 0 0 0 3px rgba(0, 213, 255, 0.08);
}

.checkout-customer-summary {
  display: grid;
  gap: 0.35rem;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(0, 213, 255, 0.28);
  border-radius: 8px;
  background: rgba(0, 213, 255, 0.055);
}

.checkout-customer-summary strong,
.checkout-customer-summary p {
  margin: 0;
}

.checkout-customer-summary p {
  color: var(--muted);
  line-height: 1.45;
}

.checkout-customer-summary .row-action {
  width: fit-content;
  margin-top: 0.35rem;
}

.checkout-form.saved-customer > label,
.checkout-form.saved-customer .checkout-data-title {
  display: none;
}

.checkout-form.saved-customer > .use-profile-toggle {
  display: flex;
}

.checkout-form.saved-customer .payment-methods {
  display: grid;
}

.checkout-form.saved-customer .payment-methods label {
  display: flex;
}

.checkout-form.saved-customer .card-fields label {
  display: grid;
}

.payment-methods {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
}

.payment-methods label {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.75rem;
  min-height: 54px;
  padding: 0.55rem 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.015) 58%),
    rgba(8, 14, 22, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  cursor: pointer;
  overflow: hidden;
  transition: border-color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.payment-methods label:has(input:checked) {
  border-color: rgba(0, 213, 255, 0.8);
  background:
    linear-gradient(145deg, rgba(0, 213, 255, 0.2), rgba(239, 35, 60, 0.1)),
    rgba(10, 18, 28, 0.96);
  box-shadow: 0 0 0 1px rgba(0, 213, 255, 0.16), 0 12px 28px rgba(0, 0, 0, 0.24);
}

.payment-methods label:hover {
  transform: translateY(-1px);
  border-color: rgba(0, 213, 255, 0.45);
}

.payment-methods input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.payment-icon {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(0, 213, 255, 0.32);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(0, 213, 255, 0.08);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0;
}

.payment-methods label:has(input:checked) .payment-icon {
  color: #031019;
  background: var(--cyan);
  border-color: var(--cyan);
}

.payment-methods label > span:last-child {
  color: var(--text);
  font-weight: 900;
  text-transform: uppercase;
}

.payment-methods .disabled {
  opacity: 0.55;
}

.card-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(0, 213, 255, 0.045), transparent 45%),
    rgba(255, 255, 255, 0.022);
}

.secure-note {
  margin: 0;
  color: #9fb0c4;
  line-height: 1.45;
}

.checkout-pay-button {
  min-height: 52px;
  justify-content: center;
  margin-top: 0.25rem;
}

.card-fields.hidden {
  display: none;
}

.card-fields label {
  display: grid;
}

.card-fields select {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 6px;
  background: #0b1018;
  color: var(--white);
  font: inherit;
  padding: 0.8rem;
}

.embedded-payment {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(0, 213, 255, 0.32);
  background: rgba(0, 213, 255, 0.055);
}

.embedded-payment h3,
.embedded-payment p {
  margin: 0;
}

.embedded-payment textarea {
  width: 100%;
  min-height: 96px;
  resize: vertical;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: #070b11;
  color: var(--white);
  padding: 0.75rem;
}

body[data-page="checkout"] {
  background: #f4f6f8;
  color: #17202a;
}

body[data-page="checkout"]::before {
  display: none;
}

body[data-page="checkout"] .site-header {
  position: static;
  border-bottom: 1px solid #d9e0e7;
  background: #ffffff;
  color: #17202a;
}

body[data-page="checkout"] .brand small,
body[data-page="checkout"] .main-nav,
body[data-page="checkout"] .account-button,
body[data-page="checkout"] .cart-button {
  color: #5f6b7a;
}

body[data-page="checkout"] .checkout-page {
  min-height: calc(100vh - 84px);
  padding: 2.25rem 4vw 4rem;
  background: #f4f6f8;
}

body[data-page="checkout"] .checkout-hero {
  display: grid;
  gap: 0.75rem;
  max-width: 1180px;
  margin: 0 auto 1.4rem;
}

body[data-page="checkout"] .checkout-hero h1 {
  max-width: none;
  margin: 0;
  color: #111827;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 1.05;
}

body[data-page="checkout"] .checkout-hero p {
  max-width: 660px;
  margin: 0;
  color: #526071;
  font-size: 1rem;
}

body[data-page="checkout"] .eyebrow,
body[data-page="checkout"] .tag {
  color: #0f766e;
}

.checkout-trust-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin-top: 0.35rem;
}

.checkout-trust-strip span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  border: 1px solid #d7e3de;
  border-radius: 999px;
  background: #ffffff;
  color: #405160;
  padding: 0 0.85rem;
  font-size: 0.85rem;
  font-weight: 800;
}

body[data-page="checkout"] .checkout-layout {
  grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
  max-width: 1180px;
  margin: 0 auto;
  gap: 1rem;
}

body[data-page="checkout"] .checkout-payment-panel {
  order: 1;
}

body[data-page="checkout"] .checkout-summary-panel {
  order: 2;
  top: 1rem;
}

body[data-page="checkout"] .checkout-summary-panel,
body[data-page="checkout"] .checkout-payment-panel {
  border: 1px solid #d9e0e7;
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.08);
}

body[data-page="checkout"] .checkout-payment-panel,
body[data-page="checkout"] .checkout-summary-panel {
  padding: 1.25rem;
}

body[data-page="checkout"] .panel-heading {
  border-bottom: 1px solid #e7ecf1;
  padding-bottom: 0.95rem;
}

body[data-page="checkout"] .panel-heading h2 {
  color: #111827;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}

body[data-page="checkout"] .checkout-form label {
  color: #465464;
  font-size: 0.74rem;
}

/* Checkout integrado: superfÃ­cie escura e foco total na decisÃ£o de compra. */
body[data-page="checkout"] {
  background: #05080c;
  color: #f4f8fc;
}

body[data-page="checkout"] .hidden { display: none !important; }

.checkout-header {
  min-height: 70px;
  padding: 0 3vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #172531;
  background: #040608;
}

.checkout-header .brand,
.checkout-footer .brand { color: #f8fbff; text-decoration: none; }

.checkout-header .brand small,
.checkout-footer .brand small { color: #9aa9b8; }

.checkout-secure { color: #9eabb8; font-size: .85rem; font-weight: 700; }

body[data-page="checkout"] .premium-checkout {
  min-height: calc(100vh - 70px);
  padding: 24px 3vw 54px;
  background: radial-gradient(circle at 3% 4%, rgba(0, 200, 255, .07), transparent 28%), #05080c;
}

.checkout-steps {
  max-width: 1280px;
  margin: 0 auto 22px;
  display: flex;
  align-items: center;
  gap: 16px;
  color: #8d9cab;
  font-size: .9rem;
  font-weight: 800;
}

.checkout-steps span { display: inline-flex; align-items: center; gap: 9px; }
.checkout-steps b { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #344452; border-radius: 6px; font-size: .8rem; }
.checkout-steps .is-active { color: #f6fbff; }
.checkout-steps .is-active b { border-color: #00c8ff; background: #008bd2; color: #041016; }
.checkout-steps i { width: 30px; height: 1px; background: #30404c; }

.premium-checkout-layout { max-width: 1280px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, .62fr); gap: 20px; align-items: start; }
.premium-checkout-form, .premium-order-summary { border: 1px solid #1f2a35; border-radius: 7px; background: linear-gradient(145deg, rgba(15, 28, 39, .72), rgba(7, 13, 19, .94)); box-shadow: 0 24px 60px rgba(0,0,0,.22); }
.premium-checkout-form { overflow: hidden; }
.checkout-section { padding: 24px; border-bottom: 1px solid #1b2833; }
.checkout-section:last-child { border: 0; }
.checkout-section > header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.checkout-section h1, .checkout-section h2 { margin: 0; color: #f5f9fc; font-size: 1.13rem; }
.checkout-section header p { margin: 4px 0 0; color: #8d9bab; font-size: .8rem; }
.checkout-section-icon { color: #00c8ff; font-size: 1.55rem; line-height: 1; }
.checkout-fields { display: grid; gap: 12px; }
.checkout-fields.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.checkout-fields .wide { grid-column: span 2; }
.checkout-fields label, .card-fields label, .coupon-box label { display: grid; gap: 6px; color: #aebac7; font-size: .73rem; font-weight: 700; }
.checkout-fields em, .coupon-box em { color: #798897; font-style: normal; font-weight: 500; }
body[data-page="checkout"] .premium-checkout input, body[data-page="checkout"] .premium-checkout select { width: 100%; min-height: 38px; border: 1px solid #273744; border-radius: 4px; outline: none; padding: 0 11px; background: #090f15; color: #f2f7fb; font: inherit; }
body[data-page="checkout"] .premium-checkout input:focus, body[data-page="checkout"] .premium-checkout select:focus { border-color: #00c8ff; box-shadow: 0 0 0 3px rgba(0,200,255,.1); }
.inline-control { display: flex; gap: 8px; }
.inline-control .button { flex: 0 0 auto; min-height: 38px; padding: 0 13px; font-size: .78rem; }
.delivery-preview { min-height: 63px; padding: 11px 13px; display: grid; align-content: center; gap: 4px; border: 1px solid #164a42; border-radius: 4px; background: rgba(0, 230, 118, .05); }
.delivery-preview span { color: #9aa8b7; font-size: .72rem; }.delivery-preview strong { color: #d9f9e7; font-size: .8rem; }
.shipping-methods { display: grid; gap: 8px; margin: 24px 0 0; padding: 0; border: 0; }.shipping-methods legend { margin-bottom: 10px; color: #f6f9fb; font-weight: 800; font-size: .86rem; }
.shipping-option, .payment-option { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 12px; min-height: 50px; padding: 0 12px; border: 1px solid #24333f; border-radius: 4px; background: #080e14; cursor: pointer; }
.payment-option { grid-template-columns: auto auto minmax(0,1fr) auto; }
.shipping-option:has(input:checked), .payment-option.is-selected { border-color: #00aee8; background: rgba(0, 150, 220, .07); }
.shipping-option input, .payment-option input { width: 16px !important; min-height: 16px !important; accent-color: #00bdf4; }.shipping-option span, .payment-option span { display: grid; gap: 3px; }.shipping-option b, .payment-option b { color: #f2f7fb; font-size: .84rem; }.shipping-option small, .payment-option small { color: #8d9baa; font-size: .72rem; }.shipping-option strong, .payment-option strong { color: #e6edf4; font-size: .82rem; }.payment-option em { margin-left: 7px; padding: 2px 5px; border-radius: 3px; background: rgba(0,230,118,.13); color: #00e676; font-size: .65rem; font-style: normal; }
.payment-method-icon { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid rgba(0, 200, 255, .26); border-radius: 7px; color: #00c8ff; background: rgba(0, 200, 255, .07); }
.payment-method-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.payment-option.is-selected .payment-method-icon { border-color: rgba(0, 200, 255, .62); background: rgba(0, 200, 255, .14); }
.payment-option.is-selected .payment-method-icon-pix { border-color: rgba(0, 230, 118, .55); color: #00e676; background: rgba(0, 230, 118, .1); }
.shipping-option-standard {
  cursor: default;
}
.payment-options { display: grid; gap: 8px; }.payment-detail { margin-top: -5px; padding: 10px 13px; border: 1px solid #173e33; border-top: 0; border-radius: 0 0 4px 4px; color: #9cc6ae; background: rgba(0,230,118,.05); font-size: .75rem; }.card-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; padding: 14px; border: 1px solid #1e4355; border-radius: 4px; background: rgba(0,200,255,.035); }.card-fields p { grid-column: span 2; margin: 0; color: #92a4b5; font-size: .72rem; }
.coupon-box { margin-top: 20px; }.coupon-box p { min-height: 15px; margin: 5px 0 0; color: #9aaab8; font-size: .73rem; }
.checkout-upsells { margin-top: 24px; padding: 15px; border: 1px solid #1f2c37; border-radius: 5px; }.checkout-upsells h2 { margin: 0 0 12px; font-size: .95rem; }.checkout-upsells > div { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }.upsell-item { min-width: 0; padding: 8px; border: 1px solid #202d38; border-radius: 4px; background: #080e14; cursor: pointer; }.upsell-item input { position: absolute; opacity: 0; }.upsell-item span { display: grid; gap: 7px; }.upsell-item img, .upsell-item i { width: 100%; aspect-ratio: 1.35; object-fit: contain; background: #101820; }.upsell-item b { overflow: hidden; color: #e8eff5; font-size: .68rem; line-height: 1.25; }.upsell-item small { color: #cbd5dd; font-size: .7rem; }.upsell-item:has(input:checked) { border-color: #00c8ff; }
.checkout-inline-status { padding: 0 24px 24px; }.checkout-inline-status p { margin: 0; }
.premium-order-summary { position: sticky; top: 18px; padding: 20px; }.premium-order-summary > header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 17px; border-bottom: 1px solid #1f2b35; }.premium-order-summary h2 { margin: 0; color: #f5f9fc; font-size: 1.1rem; }.premium-order-summary header a { color: #00bdf4; font-size: .76rem; font-weight: 800; text-decoration: none; }
.checkout-order-lines { max-height: 300px; overflow: auto; }.premium-order-summary .cart-line { grid-template-columns: 72px minmax(0, 1fr); padding: 18px 0; border-bottom: 1px solid #1a2731; }.premium-order-summary .cart-line img { width: 72px; height: 72px; border: 1px solid #20303b; border-radius: 4px; object-fit: contain; background: #080d12; }.premium-order-summary .cart-line strong { color: #f4f8fa; font-size: .82rem; }.premium-order-summary .cart-line span { color: #91a0ad; font-size: .72rem; }.premium-order-summary .cart-qty { margin-top: 7px; }.premium-order-summary .cart-qty button { font-size: .66rem; }
.order-totals { margin: 0; }.order-totals > div { display: flex; justify-content: space-between; gap: 10px; padding: 11px 0; color: #a7b2bf; font-size: .8rem; }.order-totals dd { margin: 0; color: #dce4eb; }.order-totals .total-card { display: grid; grid-template-columns: 1fr auto; border-top: 1px solid #22313c; padding-top: 17px; }.total-card dd { color: #00c8ff; font-size: 1.3rem; font-weight: 900; }.total-card small { grid-column: span 2; justify-self: end; color: #00c8ff; font-size: .75rem; }.pix-total { margin: 8px 0 15px; padding: 14px !important; border: 1px solid #17613f; border-radius: 5px; background: rgba(0,230,118,.05); }.pix-total dd, .pix-total small { color: #00e676; }.pix-total dd { font-weight: 900; font-size: 1.1rem; }.pix-total small { grid-column: 2; justify-self: end; font-size: .7rem; }
.selected-payment-total { margin: 8px 0 15px; padding: 14px !important; border: 1px solid #164b65 !important; border-radius: 5px; background: rgba(0, 200, 255, .045); transition: border-color 160ms ease, background 160ms ease; }.selected-payment-total.is-pix { border-color: #17613f !important; background: rgba(0, 230, 118, .05); }.selected-payment-total.is-pix dd, .selected-payment-total.is-pix small { color: #00e676; }.selected-payment-total.is-boleto dd, .selected-payment-total.is-boleto small { color: #e7f3f8; }
.checkout-benefits { display: grid; gap: 14px; margin: 20px 0; padding: 19px 0; border-top: 1px solid #1d2a35; border-bottom: 1px solid #1d2a35; list-style: none; }.checkout-benefits li { display: flex; gap: 11px; color: #00c8ff; }.checkout-benefits span { display: grid; gap: 2px; }.checkout-benefits b { color: #eaf1f6; font-size: .78rem; }.checkout-benefits small { color: #8f9eac; font-size: .7rem; }.finalize-order { width: 100%; min-height: 50px; justify-content: center; border-color: #00c8ff !important; background: #079de1 !important; color: #fff !important; font-size: .95rem; box-shadow: 0 8px 26px rgba(0, 174, 232, .22); }.finalize-order:hover { background: #00b8f4 !important; }.checkout-terms { margin: 15px 0 0; color: #8594a2; text-align: center; font-size: .69rem; line-height: 1.5; }.checkout-terms a { color: #00c8ff; }.premium-order-summary .embedded-payment { margin-top: 16px; }

.checkout-data-notice {
  margin: 14px 0 0;
  border-left: 2px solid #00c8ff;
  background: rgba(0, 200, 255, 0.055);
  padding: 10px 12px;
  color: #8fa3b6;
  font-size: 0.72rem;
  line-height: 1.55;
}

.checkout-data-notice a {
  color: #00c8ff;
  font-weight: 850;
}
.checkout-delivery-reminder {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin: 0 0 12px;
  padding: 0.78rem 0.9rem;
  border: 1px solid rgba(0, 200, 255, 0.2);
  border-radius: 6px;
  background:
    linear-gradient(135deg, rgba(0, 200, 255, 0.08), transparent 55%),
    rgba(5, 12, 18, 0.92);
  color: #d9f3ff;
  font-size: 0.82rem;
  font-weight: 850;
}
.checkout-footer { min-height: 94px; padding: 20px 3vw; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid #192632; background: #040608; color: #a8b5c1; font-size: .8rem; }.checkout-footer .brand { display: flex; align-items: center; gap: 9px; }.checkout-footer .brand span { display: grid; gap: 3px; }

@media (max-width: 820px) { .premium-checkout-layout { grid-template-columns: 1fr; }.premium-order-summary { position: static; order: -1; }.checkout-upsells > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }.checkout-footer { align-items: flex-start; flex-direction: column; }.checkout-steps { gap: 8px; }.checkout-steps i { width: 14px; } }
@media (max-width: 560px) { body[data-page="checkout"] .premium-checkout { padding: 16px 12px 90px; }.checkout-header { padding: 0 14px; }.checkout-secure { font-size: .7rem; }.checkout-steps span { font-size: .68rem; }.checkout-steps b { width: 23px; height: 23px; }.checkout-section { padding: 18px 14px; }.checkout-fields.two-columns, .card-fields { grid-template-columns: 1fr; }.checkout-fields .wide, .card-fields p { grid-column: span 1; }.delivery-preview { grid-column: span 1; }.shipping-option, .payment-option { gap: 8px; padding: 0 9px; }.payment-method-icon { width: 26px; height: 26px; }.payment-method-icon svg { width: 17px; height: 17px; }.shipping-option small, .payment-option small { font-size: .64rem; }.premium-order-summary { padding: 15px; }.checkout-footer { padding: 18px 14px; } }

body[data-page="checkout"] .checkout-form input,
body[data-page="checkout"] .checkout-form select,
body[data-page="checkout"] .card-fields select {
  border-color: #cfd8e3;
  background: #ffffff;
  color: #111827;
}

body[data-page="checkout"] .checkout-form input:focus,
body[data-page="checkout"] .checkout-form select:focus,
body[data-page="checkout"] .card-fields select:focus {
  border-color: #0f766e;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.1);
}

body[data-page="checkout"] .payment-methods label {
  border-color: #d8e0e8;
  background: #ffffff;
  box-shadow: none;
}

body[data-page="checkout"] .payment-methods label:has(input:checked) {
  border-color: #0f766e;
  background: #f0fdfa;
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.12);
}

body[data-page="checkout"] .payment-methods label:hover {
  border-color: #0f766e;
}

body[data-page="checkout"] .payment-icon,
body[data-page="checkout"] .payment-methods label:has(input:checked) .payment-icon {
  border-color: #0f766e;
  background: #0f766e;
  color: #ffffff;
}

body[data-page="checkout"] .payment-methods label > span:last-child {
  color: #17202a;
}

body[data-page="checkout"] .card-fields {
  border-color: #e0e6ed;
  background: #f8fafc;
}

body[data-page="checkout"] .secure-note,
body[data-page="checkout"] .checkout-data-title p,
body[data-page="checkout"] .cart-line span,
body[data-page="checkout"] .cart-empty {
  color: #64748b;
}

body[data-page="checkout"] .cart-line {
  border-color: #e0e6ed;
  background: #ffffff;
}

body[data-page="checkout"] .cart-line strong,
body[data-page="checkout"] .cart-total strong,
body[data-page="checkout"] .checkout-customer-summary strong {
  color: #111827;
}

body[data-page="checkout"] .cart-total {
  border-color: #d9e0e7;
  color: #17202a;
}

body[data-page="checkout"] .checkout-customer-summary {
  border-color: #b7ded8;
  background: #f0fdfa;
}

body[data-page="checkout"] .checkout-email-warning {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #fecdd3;
  border-radius: 6px;
  background: #fff1f2;
  color: #be123c;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 700;
}

body[data-page="checkout"] .premium-order-summary .embedded-payment {
  position: relative;
  display: grid;
  gap: 0;
  overflow: hidden;
  padding: 18px;
  border: 1px solid #1e3a49;
  border-radius: 7px;
  background:
    linear-gradient(145deg, rgba(0, 200, 255, 0.075), transparent 42%),
    #080e14;
  color: #edf7fc;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

body[data-page="checkout"] .premium-order-summary .embedded-payment::before {
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, #00c8ff, rgba(0, 200, 255, 0));
  content: "";
}

.embedded-payment-header {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: center;
}

.embedded-payment-method {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgba(0, 200, 255, 0.38);
  border-radius: 6px;
  background: rgba(0, 200, 255, 0.08);
  color: #00c8ff;
}

.embedded-payment-method svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.embedded-payment-kicker {
  display: block;
  margin-bottom: 2px;
  color: #65dfff;
  font-size: 0.63rem;
  font-weight: 900;
  text-transform: uppercase;
}

body[data-page="checkout"] .embedded-payment-header h3 {
  margin: 0;
  color: #fff;
  font-size: 1rem;
}

.embedded-payment-status {
  padding: 5px 7px;
  border: 1px solid rgba(0, 230, 118, 0.32);
  border-radius: 999px;
  background: rgba(0, 230, 118, 0.07);
  color: #36e88d;
  font-size: 0.56rem;
  font-weight: 900;
  line-height: 1.15;
  text-align: center;
}

.embedded-payment-order {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 3px 10px;
  margin-top: 16px;
  padding: 12px 0;
  border-top: 1px solid #1a2b36;
  border-bottom: 1px solid #1a2b36;
}

.embedded-payment-order span,
.embedded-payment-order small {
  color: #7f94a4;
  font-size: 0.65rem;
  font-weight: 800;
  text-transform: uppercase;
}

.embedded-payment-order strong {
  grid-column: 1;
  color: #eef7fb;
  font-size: 0.8rem;
}

.embedded-payment-order small {
  grid-row: 1 / span 2;
  grid-column: 2;
  align-self: center;
  color: #00c8ff;
}

.embedded-payment-qr {
  display: grid;
  justify-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 15px;
  border: 1px solid #1a303d;
  border-radius: 6px;
  background: #060b10;
}

body[data-page="checkout"] .embedded-payment-qr .pix-qrcode {
  display: block;
  width: min(205px, 100%);
  padding: 10px;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.34);
}

.embedded-payment-qr span {
  color: #8da1b1;
  font-size: 0.68rem;
  text-align: center;
}

.embedded-payment-copy {
  display: grid;
  gap: 7px;
  margin-top: 14px;
}

.embedded-payment-copy label {
  color: #9bb0bf;
  font-size: 0.67rem;
  font-weight: 850;
  text-transform: uppercase;
}

body[data-page="checkout"] .embedded-payment-copy textarea {
  width: 100%;
  min-height: 76px;
  resize: none;
  border: 1px solid #223844;
  border-radius: 5px;
  outline: 0;
  background: #05090d;
  color: #b9c9d4;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 0.66rem;
  line-height: 1.45;
}

body[data-page="checkout"] .embedded-payment-copy textarea:focus {
  border-color: rgba(0, 200, 255, 0.58);
  box-shadow: 0 0 0 3px rgba(0, 200, 255, 0.07);
}

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

.embedded-payment-action {
  display: inline-flex;
  min-height: 41px;
  align-items: center;
  justify-content: center;
  padding: 9px 11px;
  border: 1px solid #29404d;
  border-radius: 5px;
  background: #0c151d;
  color: #e9f4f9;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 900;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.embedded-payment-action:hover {
  border-color: rgba(0, 200, 255, 0.65);
  color: #fff;
}

.embedded-payment-action.primary {
  border-color: #00aee8;
  background: #079dde;
  color: #fff;
}

.embedded-payment-action.primary:hover,
.embedded-payment-action.primary.is-copied {
  border-color: #00d681;
  background: #087949;
}

body[data-page="checkout"] .embedded-payment-note {
  margin: 13px 0 0;
  padding-top: 13px;
  border-top: 1px solid #1a2b36;
  color: #8297a7;
  font-size: 0.69rem;
  line-height: 1.45;
}

@media (max-width: 560px) {
  .embedded-payment-header {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .embedded-payment-method {
    width: 36px;
    height: 36px;
  }

  .embedded-payment-status {
    grid-column: 1 / -1;
    justify-self: start;
  }

  .embedded-payment-actions {
    grid-template-columns: 1fr;
  }
}

body[data-page="checkout"] .checkout-pay-button {
  min-height: 54px;
  border-color: #0f766e;
  background: #0f766e;
  color: #ffffff;
  clip-path: none;
}

body[data-page="checkout"] .checkout-pay-button:hover {
  background: #115e59;
}

body[data-page="checkout"] .footer {
  border-top-color: #d9e0e7;
  background: #ffffff;
  color: #405160;
}

.pix-qrcode {
  width: min(220px, 100%);
  background: var(--white);
  padding: 0.5rem;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(360px, 1.08fr);
  gap: 3rem;
  align-items: center;
  min-height: calc(100vh - 76px);
  padding: 5.5rem 4vw 4.2rem;
  overflow: hidden;
}

.pro-hero {
  border-bottom: 1px solid var(--line);
}

.hero-copy {
  position: relative;
  z-index: 2;
  max-width: 720px;
}

.eyebrow {
  margin: 0 0 0.85rem;
  color: var(--cyan);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  overflow-wrap: anywhere;
}

h1,
h2,
h3 {
  overflow-wrap: normal;
  word-break: normal;
}

h1 {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(3.2rem, 6.4vw, 6.4rem);
  line-height: 0.9;
  letter-spacing: 0;
}

h2 {
  margin: 0;
  font-size: clamp(2rem, 4.2vw, 4.7rem);
  line-height: 0.96;
  letter-spacing: 0;
}

h3 {
  margin: 0;
  font-size: 1.08rem;
  letter-spacing: 0;
}

.hero-text {
  max-width: 60ch;
  margin: 1.35rem 0 0;
  color: #c2cad5;
  font-size: 1.05rem;
  line-height: 1.72;
}

.hero-actions {
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2rem;
}

.button,
.add-cart,
.filter,
.admin-tab,
.row-action {
  border: 0;
  font: inherit;
  font-weight: 850;
  cursor: pointer;
}

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 1.05rem;
  border-radius: 4px;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 100%, 0 100%);
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease;
}

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

.small-button {
  min-height: 40px;
  font-size: 0.86rem;
}

.primary {
  background: var(--red);
  color: var(--white);
  box-shadow: 0 0 28px rgba(239, 35, 60, 0.32);
}

.ghost {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.045);
}

.hero-specs {
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 2.1rem;
}

.hero-specs span {
  min-width: 152px;
  padding: 0.75rem 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.11);
  background: rgba(255, 255, 255, 0.035);
  color: var(--muted);
  font-size: 0.82rem;
}

.hero-specs strong {
  display: block;
  margin-bottom: 0.15rem;
  color: var(--white);
  font-size: 1.1rem;
}

.hero-stage {
  position: relative;
  min-height: 560px;
}

.hero-stage::before {
  content: "";
  position: absolute;
  inset: 8% 0 6% 8%;
  border: 1px solid rgba(0, 213, 255, 0.22);
  background:
    linear-gradient(135deg, rgba(0, 213, 255, 0.08), transparent 48%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent);
  transform: skewX(-9deg);
}

.hero-stage img {
  position: relative;
  z-index: 1;
  width: min(940px, 118%);
  max-width: none;
  height: auto;
  margin-left: -4%;
  filter: drop-shadow(0 36px 80px rgba(0, 0, 0, 0.72));
}

.hero-product-card {
  position: absolute;
  right: 2%;
  bottom: 8%;
  z-index: 2;
  width: min(320px, 82%);
  padding: 1rem;
  border: 1px solid rgba(0, 213, 255, 0.32);
  background: rgba(9, 13, 20, 0.9);
  backdrop-filter: blur(16px);
}

.hero-product-card span,
.hero-product-card small {
  display: block;
  color: var(--muted);
}

.hero-product-card span {
  color: var(--cyan);
  font-size: 0.72rem;
  font-weight: 850;
  text-transform: uppercase;
}

.hero-product-card strong {
  display: block;
  margin: 0.5rem 0;
}

.trust-strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--line);
  background: #090d13;
}

.trust-strip span {
  min-height: 64px;
  display: grid;
  place-items: center;
  padding: 0 1rem;
  border-right: 1px solid var(--line);
  color: #c7d0dc;
  font-size: 0.82rem;
  font-weight: 850;
  text-transform: uppercase;
  text-align: center;
}

.category-showcase {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--line);
}

.category-showcase a {
  min-height: 270px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1.25rem;
  border-right: 1px solid var(--line);
  background:
    linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.38)),
    linear-gradient(135deg, rgba(255, 255, 255, 0.055), transparent 52%),
    #0c1119;
}

.category-showcase a:hover {
  background:
    linear-gradient(180deg, rgba(0, 213, 255, 0.06), rgba(239, 35, 60, 0.09)),
    #101722;
}

.category-showcase span {
  color: var(--red);
  font-weight: 900;
}

.category-showcase strong {
  font-size: 1.3rem;
}

.category-showcase small {
  color: var(--muted);
  line-height: 1.5;
}

.products-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.55fr);
  gap: 1.6rem;
  align-items: end;
  padding: 3.35rem 4vw 2.1rem;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(120deg, rgba(239, 35, 60, 0.12), transparent 48%),
    linear-gradient(180deg, rgba(0, 213, 255, 0.08), transparent),
    #090d14;
}

.catalog-hero h1,
.products-hero h1 {
  max-width: 15ch;
  font-size: clamp(2.6rem, 5vw, 4.8rem);
}

.products-hero p:last-child {
  margin: 0;
  color: var(--muted);
  line-height: 1.7;
}

.section {
  padding: 5rem 4vw;
}

.product-section {
  position: relative;
  background:
    linear-gradient(180deg, rgba(8, 11, 16, 0.88), rgba(5, 6, 9, 0.74)),
    rgba(5, 6, 9, 0.72);
}

.product-section::before {
  content: "";
  position: absolute;
  inset: 0 4vw auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.22), transparent);
}

.compact-heading h2 {
  max-width: 13ch;
}

.text-link {
  color: var(--cyan);
  font-weight: 850;
  border-bottom: 1px solid rgba(0, 213, 255, 0.4);
}

.section-heading {
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 2rem;
}

.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}

.filter {
  min-height: 38px;
  padding: 0 0.85rem;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.02);
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
}

.category-filter-icon {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 18px;
  color: var(--cyan);
}

.category-filter-icon .category-icon-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.category-filter-icon .category-icon-glyph {
  font-size: 0.9rem;
  line-height: 1;
}

@media (max-width: 760px) {
  .section-heading {
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
  }

  .filters {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filter {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
    text-align: left;
  }
}

.filter.active,
.filter:hover {
  border-color: rgba(0, 213, 255, 0.62);
  color: var(--white);
  background: rgba(0, 213, 255, 0.07);
}

.catalog-browser-toolbar {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.25rem;
  padding: 0 0 1rem;
  border-bottom: 1px solid rgba(31, 49, 61, .86);
}

.catalog-search-field {
  width: min(100%, 520px);
  height: 44px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 40px;
  align-items: center;
  overflow: hidden;
  border: 1px solid #203642;
  border-radius: 7px;
  background: #081119;
  color: #00c8ff;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.catalog-search-field:focus-within {
  border-color: rgba(0, 200, 255, .72);
  background: #09141c;
  box-shadow: 0 0 0 3px rgba(0, 200, 255, .07);
}

.catalog-search-field > span {
  display: grid;
  place-items: center;
}

.catalog-search-field svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.catalog-search-field input {
  min-width: 0;
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  padding: 0;
  background: transparent;
  color: #f3f8fc;
  font: inherit;
  font-size: .84rem;
  letter-spacing: 0;
}

.catalog-search-field input::placeholder { color: #708392; }
.catalog-search-field input::-webkit-search-cancel-button { display: none; }

.catalog-search-clear {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  justify-self: center;
  border: 0;
  border-radius: 5px;
  padding: 0;
  background: transparent;
  color: #8497a6;
  cursor: pointer;
}

.catalog-search-clear:hover {
  background: rgba(0, 200, 255, .08);
  color: #eaf7fc;
}

.catalog-results-count {
  margin: 0;
  color: #8ca0b1;
  font-size: .76rem;
  font-weight: 800;
  white-space: nowrap;
}

.catalog-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.5rem;
  padding-top: 1.1rem;
  border-top: 1px solid rgba(31, 49, 61, .86);
}

.catalog-pagination > p {
  margin: 0;
  color: #8194a4;
  font-size: .75rem;
  font-weight: 700;
}

.catalog-page-buttons {
  display: flex;
  align-items: center;
  gap: 6px;
}

.catalog-page-buttons button,
.catalog-page-ellipsis {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid #203642;
  border-radius: 6px;
  background: #081119;
  color: #aab9c5;
  font: inherit;
  font-size: .76rem;
  font-weight: 850;
}

.catalog-page-buttons button {
  padding: 0;
  cursor: pointer;
}

.catalog-page-buttons button:hover:not(:disabled),
.catalog-page-buttons button.active {
  border-color: #00bfe9;
  background: rgba(0, 191, 233, .1);
  color: #ecfbff;
}

.catalog-page-buttons button:disabled {
  opacity: .32;
  cursor: default;
}

.catalog-page-buttons svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.catalog-page-ellipsis {
  border-color: transparent;
  background: transparent;
}

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

.product-grid-featured {
  grid-template-columns: minmax(0, 1.25fr) repeat(2, minmax(240px, 0.72fr));
  align-items: stretch;
}

.product-card {
  min-height: 430px;
  display: flex;
  flex-direction: column;
  border: 1px solid rgba(255, 255, 255, 0.095);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 38%),
    linear-gradient(155deg, rgba(0, 213, 255, 0.055), transparent 42%),
    linear-gradient(180deg, #121823, #090d13);
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.24);
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
  cursor: pointer;
}

.product-card:hover {
  transform: translateY(-5px);
  border-color: rgba(0, 213, 255, 0.38);
  background: linear-gradient(180deg, #151d29, #0b1017);
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.34);
}

.product-card.hidden {
  display: none;
}

.product-visual {
  position: relative;
  display: block;
  height: 270px;
  color: inherit;
  outline: none;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.065), transparent 42%),
    linear-gradient(180deg, rgba(0, 213, 255, 0.06), transparent 54%),
    url("assets/studio-carbon-texture.png"),
    #0b1018;
  background-size: auto, auto, 280px 280px, auto;
  clip-path: polygon(0 0, 100% 0, 100% 89%, 0 100%);
}

.product-visual:focus-visible {
  box-shadow: inset 0 0 0 2px #00c8ff;
}

.product-photo {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 18px;
  background: radial-gradient(circle at 50% 48%, rgba(255, 255, 255, 0.07), transparent 42%), #05080c;
  filter: drop-shadow(0 18px 26px rgba(0, 0, 0, .48));
}

.product-visual::before,
.product-visual::after {
  content: "";
  position: absolute;
}

.base-visual::before {
  width: 132px;
  height: 132px;
  left: 50%;
  top: 50%;
  border: 18px solid #2b3442;
  border-top-color: var(--cyan);
  border-right-color: #3d4857;
  transform: translate(-50%, -50%) rotate(24deg);
  box-shadow: 0 18px 55px rgba(0, 0, 0, 0.42);
}

.base-visual::after {
  width: 118px;
  height: 44px;
  left: 50%;
  bottom: 38px;
  background: linear-gradient(90deg, #343f4e, #111823);
  transform: translateX(-50%);
}

.wheel-visual::before {
  width: 178px;
  height: 126px;
  left: 50%;
  top: 55%;
  border: 18px solid #303948;
  border-bottom-width: 28px;
  border-radius: 45% 45% 42% 42%;
  transform: translate(-50%, -50%);
}

.wheel-visual::after {
  width: 82px;
  height: 54px;
  left: 50%;
  top: 52%;
  background: linear-gradient(135deg, var(--red), #191f2a);
  transform: translate(-50%, -50%);
}

.pedals-visual::before {
  width: 42px;
  height: 152px;
  left: 34%;
  top: 44px;
  background: #303948;
  box-shadow: 66px 0 0 #222b37, 132px 0 0 #374252;
  transform: skewX(-8deg);
}

.pedals-visual::after {
  width: 214px;
  height: 36px;
  left: 50%;
  bottom: 42px;
  background: linear-gradient(90deg, #151b25, var(--red));
  transform: translateX(-50%);
}

.accessory-visual::before {
  width: 190px;
  height: 26px;
  left: 50%;
  top: 52%;
  background: linear-gradient(90deg, var(--red), #384252);
  transform: translate(-50%, -50%) rotate(-18deg);
}

.accessory-visual::after {
  width: 58px;
  height: 120px;
  left: 55%;
  top: 46%;
  border: 14px solid #303948;
  border-top-color: var(--cyan);
  transform: translate(-50%, -50%) rotate(-18deg);
}

.product-info {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 1.1rem;
}

.product-grid-featured .product-card:first-child {
  min-height: 500px;
  grid-row: span 2;
}

.product-grid-featured .product-card:first-child .product-visual {
  height: 332px;
}

.product-grid-featured .product-card:first-child h3 {
  font-size: 1.42rem;
}

.tag {
  display: inline-flex;
  margin-bottom: 0.85rem;
  color: var(--cyan);
  font-size: 0.7rem;
  font-weight: 900;
  text-transform: uppercase;
}

.product-info p {
  color: var(--muted);
  line-height: 1.58;
}

.product-specs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: auto;
  padding-top: 1rem;
}

.product-specs span {
  padding: 0.35rem 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #c7d0dc;
  font-size: 0.72rem;
  font-weight: 800;
}

.product-detail-shell {
  padding: 1.2rem 5vw 5rem;
}

.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin: 0.6rem 0 1.2rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.breadcrumb a {
  color: #dbe4ef;
}

.product-detail-top {
  display: grid;
  grid-template-columns: minmax(360px, 0.78fr) minmax(380px, 0.52fr);
  gap: 1.25rem;
  align-items: start;
  max-width: 1280px;
  margin: 0 auto;
}

.detail-gallery,
.detail-empty-image,
.buy-box,
.product-info-panels article {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.035);
}

.detail-gallery {
  display: grid;
  gap: 0.75rem;
  background: transparent;
  border: 0;
}

.detail-main-frame,
.detail-empty-image {
  width: 100%;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: clamp(1rem, 2vw, 2rem);
  background: #05070a;
  overflow: visible;
  border: 1px solid var(--line);
}

.detail-main-frame {
  cursor: default;
}

.detail-main-image {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

.detail-empty-image span {
  color: var(--muted);
  font-weight: 850;
  text-transform: uppercase;
}

.detail-thumbs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(76px, 96px));
  gap: 0.65rem;
  padding: 0;
  background: transparent;
}

.detail-thumbs button {
  aspect-ratio: 1 / 1;
  height: auto;
  border: 1px solid rgba(255, 255, 255, 0.13);
  background: #080c12;
  padding: 0;
  cursor: pointer;
  overflow: hidden;
}

.detail-thumbs button.active,
.detail-thumbs button:hover {
  border-color: rgba(0, 213, 255, 0.7);
}

.detail-thumbs img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #05070a;
}

.image-viewer {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: grid;
  place-items: center;
  padding: 5vh 5vw;
  background: rgba(0, 0, 0, 0.9);
  cursor: zoom-out;
}

.image-viewer img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.image-viewer-close {
  position: fixed;
  top: 1rem;
  right: 1rem;
  min-height: 40px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: #0e141d;
  color: var(--white);
  font: inherit;
  font-weight: 850;
  padding: 0 0.9rem;
  cursor: pointer;
}

.buy-box {
  position: sticky;
  top: 92px;
  padding: 1.25rem;
}

.buy-box h1 {
  margin: 0 0 1rem;
  font-size: clamp(2rem, 4.5vw, 4.2rem);
  line-height: 0.96;
}

.price-stack {
  display: grid;
  gap: 0.25rem;
  padding: 1rem 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.price-stack strong {
  font-size: 2rem;
}

.price-stack span {
  color: var(--cyan);
  font-weight: 900;
}

.price-stack small,
.purchase-notes span,
.shipping-box label {
  color: var(--muted);
}

.buy-actions,
.detail-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.75rem;
  margin-top: 1rem;
}

.shipping-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.65rem;
  align-items: end;
  margin-top: 1rem;
  padding: 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.2);
}

.shipping-box label {
  display: grid;
  gap: 0.4rem;
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.shipping-box input {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: #080c12;
  color: var(--white);
  padding: 0.75rem;
}

.shipping-result {
  grid-column: 1 / -1;
  margin: 0;
  color: #c7d0dc;
  font-size: 0.86rem;
  line-height: 1.45;
}

.shipping-result strong {
  color: var(--cyan);
}

.shipping-result.error {
  color: #ff8fa0;
}

.purchase-notes {
  display: grid;
  gap: 0.55rem;
  margin-top: 1rem;
}

.purchase-notes span {
  padding-left: 1rem;
  border-left: 2px solid var(--red);
  font-size: 0.86rem;
  font-weight: 800;
}

.product-info-panels {
  display: grid;
  grid-template-columns: 1.2fr 0.9fr 0.9fr;
  gap: 1rem;
  margin-top: 1.25rem;
}

.product-info-panels article {
  padding: 1.2rem;
}

.product-info-panels h2 {
  margin-bottom: 0.7rem;
  font-size: clamp(1.25rem, 2vw, 2rem);
}

.product-info-panels p,
.product-info-panels li {
  color: #c7d0dc;
  line-height: 1.65;
}

.product-info-panels ul {
  display: grid;
  gap: 0.55rem;
  padding-left: 1.1rem;
}

.related-section {
  margin-top: 3rem;
}

.compact-detail-hero {
  min-height: 420px;
}

.product-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: auto;
  padding-top: 1rem;
}

.product-bottom strong {
  font-size: 1.22rem;
}

.catalog-price-block {
  min-width: 0;
  display: grid;
  gap: 0.18rem;
}

.catalog-pix-price {
  display: block;
  color: #00c8ff;
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.2;
}

.add-cart {
  min-height: 40px;
  padding: 0 0.85rem;
  background: var(--white);
  color: #090c11;
}

.details-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.9rem;
  border: 1px solid rgba(0, 213, 255, 0.34);
  background:
    linear-gradient(135deg, rgba(0, 213, 255, 0.16), rgba(239, 35, 60, 0.08)),
    rgba(255, 255, 255, 0.035);
  color: var(--white);
  text-decoration: none;
  font-weight: 900;
}

.details-button:hover {
  border-color: rgba(0, 213, 255, 0.72);
  background: rgba(0, 213, 255, 0.14);
}

.consulting-band p {
  display: block;
  margin-top: 0.75rem;
  color: var(--muted);
  line-height: 1.6;
}

.consulting-band {
  justify-content: space-between;
  gap: 2rem;
  margin: 0 4vw 5rem;
  padding: 2rem;
  border: 1px solid rgba(0, 213, 255, 0.32);
  border-radius: 8px;
  background:
    linear-gradient(120deg, rgba(0, 213, 255, 0.09), transparent 45%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent),
    rgba(10, 15, 22, 0.94);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.26);
}

.consulting-band h2 {
  max-width: 14ch;
}

.footer {
  justify-content: space-between;
  gap: 1rem;
  padding: 1.4rem 4vw;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.9rem;
}

.promo-banner {
  padding: 0.75rem 5vw;
  background: var(--red);
  color: var(--white);
  font-weight: 850;
  text-align: center;
}

.commerce-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(430px, 0.62fr) minmax(0, 1fr);
  gap: clamp(2rem, 4vw, 4.8rem);
  align-items: stretch;
  min-height: calc(100vh - 76px);
  padding: 4.1rem 4vw 3.4rem;
  border-bottom: 0;
  background:
    linear-gradient(100deg, rgba(239, 35, 60, 0.07), transparent 34%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 38%),
    rgba(5, 7, 10, 0.52);
  isolation: isolate;
  overflow: hidden;
}

.commerce-hero::before {
  content: "";
  position: absolute;
  inset: 1.8rem 0 2.2rem 38%;
  z-index: -1;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.06), transparent 18%),
    linear-gradient(180deg, rgba(8, 12, 18, 0.18), rgba(8, 12, 18, 0.76)),
    url("assets/studio-carbon-texture.png");
  background-size: auto, auto, 360px 360px;
  clip-path: polygon(12% 0, 100% 0, 100% 100%, 0 100%, 0 18%);
  opacity: 0.62;
}

.commerce-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 520px;
}

.commerce-copy h1 {
  max-width: 16ch;
  font-size: clamp(2.7rem, 4.8vw, 5.15rem);
  line-height: 0.96;
}

.commerce-copy .hero-text {
  max-width: 52ch;
  font-size: 1rem;
}

.hero-board {
  position: relative;
  z-index: 1;
  min-height: 540px;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent),
    rgba(7, 10, 15, 0.88);
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.48);
  clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%, 0 13%);
}

.hero-board::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 2;
  width: 34%;
  background: linear-gradient(90deg, rgba(5, 7, 10, 0.8), transparent);
}

.hero-board img {
  width: 100%;
  height: 100%;
  min-height: 520px;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.05) contrast(1.06);
}

.hero-board::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: 2;
  height: 42%;
  background: linear-gradient(180deg, transparent, rgba(5, 7, 10, 0.84));
}

.hero-board-panel {
  position: absolute;
  left: 2.2rem;
  right: 1.1rem;
  bottom: 1.1rem;
  z-index: 2;
  display: grid;
  gap: 0.38rem;
  max-width: 420px;
  padding: 1rem;
  border: 1px solid rgba(0, 213, 255, 0.34);
  border-radius: 8px;
  background: rgba(5, 8, 12, 0.86);
  backdrop-filter: blur(14px);
}

.hero-board-panel span {
  color: var(--cyan);
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.hero-board-panel small {
  color: var(--muted);
}

.product-section-home {
  padding-top: 3.4rem;
}

@media (max-width: 1180px) {
  .site-header {
    grid-template-columns: auto auto auto;
  }

  .main-nav {
    order: 4;
    grid-column: 1 / -1;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: 0.6rem;
  }

  .product-grid,
  .product-grid-featured,
  .category-showcase {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .hero,
  .commerce-hero {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .hero-stage img {
    width: 100%;
    margin-left: 0;
  }

  .commerce-copy {
    min-height: auto;
  }

  .hero-board {
    clip-path: polygon(4% 0, 100% 0, 100% 100%, 0 100%, 0 9%);
  }
}

@media (max-width: 760px) {
  .site-header {
    position: static;
    grid-template-columns: 1fr auto;
    gap: 0.8rem;
    padding-block: 1rem;
  }

  .brand {
    min-width: 0;
  }

  .main-nav {
    order: 3;
    grid-column: 1 / -1;
    width: 100%;
    gap: 0.9rem;
  }

  .account-button {
    grid-column: 1 / 2;
    justify-self: start;
    max-width: 100%;
  }

  .cart-button {
    grid-column: 2 / 3;
    grid-row: 2;
  }

  .account-button span:last-child {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .hero,
  .commerce-hero,
  .products-hero,
  .section {
    padding-inline: 1rem;
  }

  .hero {
    padding-top: 3rem;
    gap: 1.2rem;
  }

  .commerce-hero {
    padding-top: 2rem;
  }

  h1 {
    max-width: 10ch;
    font-size: clamp(3rem, 15vw, 4.5rem);
  }

  .commerce-copy h1 {
    max-width: 12ch;
    font-size: clamp(2.7rem, 13vw, 4rem);
  }

  .hero-stage {
    min-height: 300px;
  }

  .hero-board,
  .hero-board img {
    min-height: 320px;
  }

  .hero-board {
    clip-path: none;
  }

  .hero-board-panel {
    left: auto;
    right: auto;
    bottom: auto;
    position: relative;
    max-width: none;
    margin-top: -0.2rem;
  }

  .hero-product-card {
    position: relative;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: -1rem;
  }

  .trust-strip,
  .category-showcase,
  .product-grid,
  .product-grid-featured {
    grid-template-columns: 1fr;
  }

  .product-grid-featured .product-card:first-child {
    min-height: auto;
    grid-row: auto;
  }

  .product-grid-featured .product-card:first-child .product-visual {
    height: 270px;
  }

  .product-card,
  .button {
    clip-path: none;
  }

  .products-hero,
  .admin-shell,
  .checkout-layout,
  .product-detail-top,
  .product-info-panels,
  .section-heading,
  .consulting-band {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .section-heading,
  .consulting-band,
  .footer {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }

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

  .admin-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .checkout-page {
    padding: 2.5rem 1rem 4rem;
  }

  .checkout-summary-panel {
    position: static;
  }

  .admin-form,
  .inline-form,
  .permission-box,
  .register-grid,
  .dashboard-grid,
  .checkout-form,
  .admin-row {
    grid-template-columns: 1fr;
  }

  .admin-row-actions {
    justify-content: flex-start;
  }
}

body[data-page="admin"] {
  background:
    radial-gradient(circle at 12% 0%, rgba(239, 35, 60, 0.18), transparent 34%),
    radial-gradient(circle at 86% 18%, rgba(0, 213, 255, 0.13), transparent 32%),
    #070a10;
  color: var(--white);
}

body[data-page="admin"] .site-header,
body[data-page="admin"] .admin-topbar {
  background: rgba(5, 8, 13, 0.94);
  border-bottom: 1px solid rgba(0, 213, 255, 0.18);
  color: var(--white);
}

body[data-page="admin"] .brand strong,
body[data-page="admin"] .main-nav a,
body[data-page="admin"] .account-button,
body[data-page="admin"] .cart-button {
  color: var(--white);
}

body[data-page="admin"] .admin-shell {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.2rem;
  margin: 2.2rem auto 5rem;
  width: min(1180px, 92vw);
  border: 0;
  background: transparent;
}

body[data-page="admin"] .admin-sidebar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 1rem;
  align-items: end;
  padding: 0;
  border: 0;
  background: transparent;
}

body[data-page="admin"] .admin-sidebar .eyebrow {
  color: var(--red);
}

body[data-page="admin"] .admin-sidebar h2 {
  margin: 0.2rem 0 0;
  color: var(--white);
  font-size: clamp(2rem, 3.4vw, 3.3rem);
}

body[data-page="admin"] .admin-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.55rem;
  margin: 0;
}

body[data-page="admin"] .admin-tab {
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
  color: #aeb9c8;
  padding: 0 0.9rem;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.22);
}

body[data-page="admin"] .admin-tab.active,
body[data-page="admin"] .admin-tab:hover {
  border-color: rgba(0, 213, 255, 0.48);
  background: rgba(0, 213, 255, 0.11);
  color: var(--white);
}

body[data-page="admin"] .admin-workspace {
  padding: 0;
}

body[data-page="admin"] .admin-panel-heading,
body[data-page="admin"] .admin-form,
body[data-page="admin"] .inline-form,
body[data-page="admin"] .admin-row,
body[data-page="admin"] .admin-dashboard-card,
body[data-page="admin"] .metric-card {
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 8px;
  background:
    linear-gradient(145deg, rgba(0, 213, 255, 0.07), transparent 46%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), transparent 62%),
    #0b1018;
  box-shadow: 0 20px 55px rgba(0, 0, 0, 0.34);
}

body[data-page="admin"] .admin-panel-heading {
  padding: 1rem 1.15rem;
}

body[data-page="admin"] .admin-panel-heading h3,
body[data-page="admin"] .admin-row h4,
body[data-page="admin"] .admin-dashboard-card h4 {
  color: var(--white);
}

body[data-page="admin"] .dashboard-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

body[data-page="admin"] .metric-card {
  min-height: 136px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem;
}

body[data-page="admin"] .metric-card span {
  color: #aeb9c8;
  text-transform: none;
}

body[data-page="admin"] .metric-card strong {
  color: var(--white);
  font-size: clamp(1.55rem, 2.4vw, 2.35rem);
}

body[data-page="admin"] .metric-card small {
  display: inline-flex;
  margin-top: 0.45rem;
  padding: 0.25rem 0.48rem;
  border-radius: 999px;
  background: rgba(0, 213, 255, 0.14);
  color: var(--cyan);
  font-weight: 900;
}

.metric-icon {
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  background: rgba(0, 213, 255, 0.1);
}

.metric-icon::before {
  color: var(--cyan);
  font-weight: 1000;
}

.metric-box::before {
  content: "â–¡";
}

.metric-users::before {
  content: "â—Ž";
}

.metric-cart::before {
  content: "â–±";
}

.metric-trend::before {
  content: "â†—";
  color: var(--red);
}

.admin-dashboard-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.72fr);
  gap: 1rem;
}

.admin-dashboard-card {
  padding: 1.15rem;
}

.quick-actions,
.report-card {
  grid-column: 1;
}

.recent-card {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.dashboard-card-heading h4 {
  margin: 0 0 1rem;
  font-size: 1.15rem;
}

.quick-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
}

.quick-action-grid button {
  min-height: 88px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-content: center;
  gap: 0.1rem 0.75rem;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.035);
  color: var(--white);
  text-align: left;
  padding: 0.85rem;
  cursor: pointer;
}

.quick-action-grid button:hover {
  border-color: rgba(0, 213, 255, 0.55);
  transform: translateY(-1px);
}

.quick-action-grid span {
  grid-row: span 2;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: #05080d;
  color: var(--cyan);
  font-weight: 1000;
}

.quick-action-grid strong {
  color: var(--white);
}

.quick-action-grid small {
  color: #97a5b7;
}

.report-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
}

.report-grid div {
  padding: 1rem;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  text-align: center;
}

.report-grid strong {
  display: block;
  color: var(--cyan);
  font-size: 1.7rem;
}

.report-grid span,
.recent-item p {
  color: #97a5b7;
}

.recent-item {
  display: grid;
  gap: 0.55rem;
  margin-bottom: 0.7rem;
  padding: 0.85rem;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
}

.recent-item h4,
.recent-item p {
  margin: 0;
}

body[data-page="admin"] .admin-form label,
body[data-page="admin"] .toggle-row {
  color: #c7d0dc;
}

body[data-page="admin"] .admin-form input,
body[data-page="admin"] .admin-form select,
body[data-page="admin"] .admin-form textarea,
body[data-page="admin"] .inline-form input {
  border-color: rgba(255, 255, 255, 0.16);
  background: #0b1018;
  color: var(--white);
}

body[data-page="admin"] .admin-row p {
  color: #97a5b7;
}

body[data-page="admin"] .row-action {
  border-color: rgba(255, 255, 255, 0.16);
  color: var(--white);
  background: rgba(255, 255, 255, 0.035);
}

body[data-page="admin"] .row-action.danger {
  border-color: rgba(239, 35, 60, 0.38);
  color: #c9152d;
}

@media (max-width: 900px) {
  body[data-page="admin"] .admin-sidebar,
  body[data-page="admin"] .dashboard-grid,
  .admin-dashboard-layout,
  .quick-action-grid,
  .report-grid {
    grid-template-columns: 1fr;
  }

  .quick-actions,
  .report-card,
  .recent-card {
    grid-column: auto;
    grid-row: auto;
  }
}

.admin-shell {
  display: grid;
  grid-template-columns: minmax(260px, 0.34fr) minmax(0, 1fr);
  gap: 1rem;
  margin: 0 5vw 5rem;
  border: 1px solid var(--line);
  background: #090d14;
}

.admin-sidebar {
  padding: 1.4rem;
  border-right: 1px solid var(--line);
  background:
    linear-gradient(180deg, rgba(239, 35, 60, 0.1), transparent 45%),
    #0c1119;
}

.admin-sidebar h2 {
  font-size: clamp(1.8rem, 3.2vw, 3.2rem);
}

.admin-tabs {
  display: grid;
  gap: 0.55rem;
  margin-top: 2rem;
}

.admin-tab {
  min-height: 46px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.03);
  color: var(--muted);
  text-align: left;
  padding: 0 0.95rem;
}

.admin-tab.active,
.admin-tab:hover {
  border-color: rgba(0, 213, 255, 0.55);
  color: var(--white);
  background: rgba(0, 213, 255, 0.07);
}

.admin-workspace {
  min-width: 0;
  padding: 1.4rem;
}

.admin-panel {
  display: none;
}

.admin-panel.active {
  display: block;
}

.admin-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.2rem;
}

.admin-panel-heading h3 {
  font-size: clamp(1.35rem, 2.2vw, 2.2rem);
}

.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.8rem;
  margin-bottom: 1rem;
}

.metric-card {
  min-height: 118px;
  padding: 1rem;
  border: 1px solid var(--line);
  background:
    linear-gradient(135deg, rgba(0, 213, 255, 0.08), transparent 46%),
    rgba(255, 255, 255, 0.035);
}

.metric-card span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 850;
  text-transform: uppercase;
}

.metric-card strong {
  display: block;
  margin-top: 0.5rem;
  font-size: clamp(1.6rem, 3vw, 2.8rem);
}

.admin-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.035);
}

.admin-form label,
.inline-form input,
.admin-form input,
.admin-form select,
.admin-form textarea {
  min-width: 0;
}

.admin-form label,
.toggle-row {
  display: grid;
  gap: 0.45rem;
  color: #c7d0dc;
  font-size: 0.82rem;
  font-weight: 800;
  text-transform: uppercase;
}

.field-hint {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: none;
}

.admin-form input,
.admin-form select,
.admin-form textarea,
.inline-form input {
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: #0b1018;
  color: var(--white);
  font: inherit;
  padding: 0.85rem;
  outline: none;
}

.admin-form textarea {
  resize: vertical;
}

.admin-form input:focus,
.admin-form select:focus,
.admin-form textarea:focus,
.inline-form input:focus {
  border-color: rgba(0, 213, 255, 0.72);
}

.form-wide {
  grid-column: 1 / -1;
}

.image-preview {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  place-items: stretch;
  gap: 0.7rem;
  min-height: 150px;
  padding: 0.7rem;
  border: 1px dashed rgba(0, 213, 255, 0.38);
  color: var(--muted);
  background: #080c12;
  overflow: hidden;
}

.preview-item {
  position: relative;
  margin: 0;
}

.preview-item img {
  width: 100%;
  height: 170px;
  object-fit: cover;
  border: 1px solid rgba(255, 255, 255, 0.11);
}

.preview-item button {
  position: absolute;
  right: 0.45rem;
  bottom: 0.45rem;
  min-height: 30px;
  border: 1px solid rgba(239, 35, 60, 0.55);
  background: rgba(5, 7, 10, 0.86);
  color: var(--white);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 900;
  cursor: pointer;
}

.preview-count {
  grid-column: 1 / -1;
  color: var(--cyan);
  font-size: 0.8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.admin-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}

.admin-list {
  display: grid;
  gap: 0.75rem;
  margin-top: 1rem;
}

.admin-row {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: 0.9rem;
  align-items: center;
  padding: 0.85rem;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.025);
}

.admin-thumb {
  width: 88px;
  height: 64px;
  background:
    repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.04) 0 2px, transparent 2px 8px),
    #101722;
  object-fit: cover;
}

.admin-row h4,
.admin-row p {
  margin: 0;
}

.admin-row h4 {
  margin-bottom: 0.25rem;
}

.admin-row p {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.admin-row-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
}

.product-publish-control {
  display: grid;
  gap: 0.25rem;
  min-width: 150px;
}

.product-publish-control > span {
  color: #8294a8;
  font-size: 0.65rem;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.product-publish-control select {
  width: 100%;
  min-height: 36px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 6px;
  background: #0a1119;
  color: #c7d0dc;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 850;
  padding: 0 2rem 0 0.7rem;
  cursor: pointer;
}

.product-publish-control.is-published select {
  border-color: rgba(31, 222, 133, 0.38);
  color: #35df91;
}

.product-publish-control.is-hidden select {
  border-color: rgba(144, 160, 179, 0.28);
  color: #a2afbd;
}

.product-publish-control select:disabled {
  cursor: wait;
  opacity: 0.65;
}

.row-action {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.85rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 6px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), transparent 60%),
    rgba(255, 255, 255, 0.028);
  color: var(--white);
  text-decoration: none;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.row-action:hover {
  transform: translateY(-1px);
  border-color: rgba(0, 213, 255, 0.45);
  background: rgba(0, 213, 255, 0.08);
}

.row-action.danger {
  border-color: rgba(239, 35, 60, 0.55);
  color: #ff7d8c;
}

.inline-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto;
  gap: 0.7rem;
  padding: 1rem;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.035);
}

.compact .admin-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.permission-box {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.7rem;
  margin: 0;
  padding: 1rem;
  border: 1px solid var(--line);
}

.permission-box legend {
  padding: 0 0.4rem;
  color: var(--cyan);
  font-weight: 800;
  text-transform: uppercase;
}

.permission-box label,
.toggle-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  text-transform: none;
  font-size: 0.94rem;
  font-weight: 700;
}

.permission-box input,
.toggle-row input {
  width: 18px;
  height: 18px;
  accent-color: var(--red);
}

.site-status {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(0, 213, 255, 0.28);
  color: var(--cyan);
  background: rgba(0, 213, 255, 0.06);
  font-weight: 800;
}

.promo-banner {
  padding: 0.75rem 5vw;
  background: var(--red);
  color: var(--white);
  font-weight: 800;
  text-align: center;
}

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

  .hero {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .hero-media img {
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 760px) {
  .site-header {
    position: static;
    flex-wrap: wrap;
    gap: 0.8rem;
    padding-block: 1rem;
  }

  .main-nav {
    order: 3;
    width: 100%;
    justify-content: space-between;
    gap: 0.6rem;
    overflow-x: auto;
  }

  .account-button {
    order: 2;
    margin-left: 0;
    max-width: calc(100% - 82px);
  }

  .cart-button {
    order: 2;
  }

  .account-button span:last-child {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .hero {
    padding-top: 3rem;
    gap: 1.2rem;
  }

  h1 {
    max-width: 10ch;
    font-size: clamp(3rem, 16vw, 4.7rem);
  }

  .hero-media {
    min-height: 250px;
  }

  .intro-band,
  .products-hero,
  .kit-section,
  .admin-shell,
  .product-detail-top,
  .product-info-panels,
  .section-heading,
  .cta-band {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .section-heading,
  .cta-band,
  .footer {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }

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

  .buy-box {
    position: static;
  }

  .detail-main-frame,
  .detail-empty-image {
    min-height: 0;
    height: auto;
  }

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

  .admin-sidebar {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .admin-form,
  .inline-form,
  .permission-box,
  .register-grid,
  .admin-row {
    grid-template-columns: 1fr;
  }

  .admin-row-actions {
    justify-content: flex-start;
  }

  .product-publish-control {
    width: min(100%, 240px);
  }
}

/* Premium storefront header and category experience */
body:not([data-page="admin"]):not([data-page="checkout"]) { background-color: #05080c; }
body:not([data-page="admin"]):not([data-page="checkout"]) .site-header { grid-template-columns: auto auto minmax(0, 1fr) minmax(180px, 280px) auto; gap: 14px; min-height: 74px; border-bottom: 1px solid #1f2a35; background: rgba(2, 5, 9, 0.9); box-shadow: 0 18px 60px rgba(0, 0, 0, 0.34); }
body:not([data-page="admin"]):not([data-page="checkout"]) .premium-brand { min-width: 210px; }
body:not([data-page="admin"]):not([data-page="checkout"]) .brand-logo { border-radius: 12px; }
.premium-nav { gap: clamp(14px, 1.7vw, 28px); font-size: 0.82rem; }
.premium-nav a, .premium-nav button { border: 0; background: transparent; color: #dbe5f0; cursor: pointer; font: inherit; font-weight: 850; }
.premium-nav button { display: inline-flex; align-items: center; gap: 5px; padding: 0.72rem 0; }
.premium-nav .offer-link { color: #ff3158; }
.header-search { display: grid; grid-template-columns: minmax(0, 1fr) 38px; min-height: 42px; border: 1px solid #1f2a35; border-radius: 6px; background: #0b1118; overflow: hidden; }
.header-search input, .header-search button { border: 0; background: transparent; color: #f8fafc; font: inherit; }
.header-search input { min-width: 0; padding: 0 12px; outline: 0; }
.header-search input::placeholder { color: #7b8795; }
.header-search button { color: #9fb0c2; cursor: pointer; }
.header-icon-button { width: 42px; min-width: 42px; padding: 0; font-size: 1.2rem; }
.header-icon-button > svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: #dce8f2;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: color 160ms ease, filter 160ms ease, transform 160ms ease;
}
.header-icon-button:hover > svg,
.header-icon-button[aria-expanded="true"] > svg {
  stroke: #00c8ff;
  filter: drop-shadow(0 0 6px rgba(0, 200, 255, .36));
  transform: translateY(-1px);
}
.header-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; justify-self: end; }
.header-cart { position: relative; min-width: 54px; }
.header-cart #cartCount { position: absolute; top: -7px; right: -7px; min-width: 19px; height: 19px; display: grid; place-items: center; border-radius: 999px; background: #00c8ff; color: #001018; font-size: 0.72rem; font-weight: 900; }
.account-menu-wrap { position: relative; display: grid; place-items: center; }
.account-menu { position: absolute; top: calc(100% + 12px); right: 0; z-index: 80; width: 220px; padding: 10px; border: 1px solid #1f2a35; border-radius: 8px; background: rgba(8, 13, 18, .98); box-shadow: 0 24px 70px rgba(0,0,0,.5); }
.account-menu strong, .account-menu small { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: 0; }
.account-menu strong { color: #f8fafc; font-size: .82rem; }
.account-menu small { margin: 3px 0 9px; color: #8fa1b4; font-size: .7rem; }
.account-menu a, .account-menu button { display: flex; align-items: center; width: 100%; min-height: 36px; border: 0; border-radius: 6px; padding: 0 10px; color: #cdd8e5; background: transparent; font: inherit; font-size: .78rem; font-weight: 800; text-align: left; cursor: pointer; }
.account-menu a:hover, .account-menu button:hover { color: #fff; background: rgba(0, 200, 255, .1); }
.account-menu button { margin-top: 5px; color: #ff4968; border-top: 1px solid #172430; border-radius: 0 0 6px 6px; }
.mobile-menu-toggle { display: none; width: 42px; height: 42px; border: 1px solid #1f2a35; border-radius: 6px; background: #0b1118; color: #fff; }
.mega-menu { position: absolute; top: calc(100% - 1px); left: 50%; z-index: 30; width: min(920px, calc(100vw - 32px)); transform: translateX(-50%) translateY(12px); opacity: 0; pointer-events: none; border: 1px solid #1f2a35; border-radius: 10px; background: rgba(8, 13, 18, 0.94); box-shadow: 0 30px 90px rgba(0,0,0,.55), 0 0 0 1px rgba(0,200,255,.06); backdrop-filter: blur(18px); transition: opacity 180ms ease, transform 180ms ease; }
.mega-menu.open { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.mega-grid { display: grid; grid-template-columns: 1fr .95fr 1.55fr; gap: 22px; padding: 24px; }
.mega-grid > div + div { border-left: 1px solid #1f2a35; padding-left: 22px; }
.mega-grid p { margin: 0 0 14px; color: #00c8ff; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.mega-category-list, .mega-brand-list, .mega-feature-list { display: grid; gap: 8px; }
.mega-category-list a { display: grid; grid-template-columns: 24px minmax(0, 1fr) 18px; gap: 10px; align-items: center; min-height: 32px; color: #dbe5f0; font-size: .86rem; }
.mega-category-list a > .mega-category-icon { width: 22px; height: 22px; display: grid; place-items: center; overflow: hidden; color: #eef4fb; }
.mega-category-icon .category-icon-image { width: 20px; height: 20px; object-fit: contain; filter: brightness(1.25); }
.mega-category-icon .category-icon-glyph { line-height: 1; }
.mega-category-list a em { color: #95a5b6; font-style: normal; }
.mega-category-list a:hover { color: #00c8ff; }
.mega-brand-list { grid-template-columns: 1fr; align-items: stretch; gap: 12px; }
.mega-brand-list a { min-height: 54px; display: flex; align-items: center; justify-content: center; overflow: hidden; border: 1px solid #1f2a35; border-radius: 7px; background: rgba(7,16,25,.82); padding: 12px 16px; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }
.mega-brand-list a:hover { border-color: #00c8ff; background: rgba(0,200,255,.08); transform: translateY(-1px); }
.mega-brand-list a > strong { display: none; }
.mega-brand-list img { width: 100%; max-width: 148px; max-height: 32px; object-fit: contain; }
.mega-feature-card { display: grid; grid-template-columns: minmax(170px, 45%) minmax(0, 1fr); overflow: hidden; border: 1px solid #1f2a35; border-radius: 8px; background: linear-gradient(135deg, #101720, #0a1017); }
.mega-feature-card img, .mega-feature-placeholder { width: 100%; height: 190px; object-fit: cover; background: radial-gradient(circle at center, rgba(0,200,255,.16), #05080c 70%); }
.mega-feature-card div { padding: 18px; }
.mega-feature-card span, .mega-feature-card small { display: block; color: #00c8ff; font-size: .72rem; font-weight: 900; }
.mega-feature-card h4 { margin: 8px 0; color: #fff; font-size: 1.05rem; }
.mega-feature-card p { margin: 0 0 14px; color: #9aa8b8; font-size: .82rem; line-height: 1.5; letter-spacing: 0; text-transform: none; }
.mega-feature-card strong { display: block; margin-bottom: 4px; color: #fff; }
.mega-feature-card .row-action { margin-top: 14px; }
.mega-benefits { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; padding: 16px 24px; border-top: 1px solid #1f2a35; }
.mega-benefits span { min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 11px; color: #c8d3df; font-size: .78rem; font-weight: 800; }
.mega-benefits span + span { border-left: 1px solid #1f2a35; padding-left: 22px; }
.mega-benefits svg { grid-row: 1 / span 2; width: 28px; height: 28px; fill: none; stroke: #00a8ff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.mega-benefits b { overflow: hidden; color: #eef4fb; font-size: .78rem; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.mega-benefits small { overflow: hidden; color: #9aa8b8; font-size: .72rem; font-weight: 500; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.mobile-nav-drawer { position: absolute; top: 100%; left: 12px; right: 12px; z-index: 40; display: grid; gap: 8px; padding: 16px; border: 1px solid #1f2a35; border-radius: 8px; background: #080d12; box-shadow: 0 24px 60px rgba(0,0,0,.48); }
.mobile-nav-drawer a, .mobile-nav-drawer summary { color: #e5edf6; font-weight: 850; }
.mobile-nav-drawer details { display: grid; gap: 8px; }
.mobile-nav-drawer summary { cursor: pointer; list-style-position: outside; }
.mobile-category-list { display: grid; gap: 5px; padding: 4px 0 2px 12px; }
.mobile-category-link { min-height: 32px; display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; gap: 9px; color: #dce8f1 !important; font-size: .78rem; line-height: 1.15; }
.mobile-category-link strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mobile-category-icon { width: 22px; height: 22px; display: grid; place-items: center; overflow: hidden; color: #eef4fb; }
.mobile-category-icon .category-icon-image { width: 20px; height: 20px; object-fit: contain; filter: brightness(1.25); }
.mobile-category-icon .category-icon-glyph { line-height: 1; }
.category-hero-premium { position: relative; min-height: 360px; display: grid; align-items: center; overflow: hidden; padding: clamp(4rem, 8vw, 7rem) 5vw; border-bottom: 1px solid #1f2a35; background: linear-gradient(90deg, #05080c 0%, rgba(5,8,12,.92) 38%, rgba(5,8,12,.42)), radial-gradient(circle at 70% 20%, rgba(0,200,255,.18), transparent 40%), #05080c; }
.category-hero-premium > img { position: absolute; inset: 0 0 0 auto; width: min(58vw, 760px); height: 100%; object-fit: cover; opacity: .32; mask-image: linear-gradient(90deg, transparent, #000 32%); }
.category-hero-premium > div { position: relative; z-index: 1; max-width: 620px; }
.category-hero-premium h1 { margin: .35rem 0; color: #fff; font-size: clamp(3.4rem, 8vw, 6.5rem); line-height: .95; }
.category-hero-title { display: flex; align-items: center; gap: clamp(14px, 2vw, 24px); }
.category-hero-icon { flex: 0 0 auto; width: clamp(54px, 7vw, 84px); height: clamp(54px, 7vw, 84px); display: grid; place-items: center; overflow: hidden; border: 1px solid #29404d; border-radius: 8px; color: #00c8ff; background: rgba(7, 16, 25, .88); font-size: clamp(1.6rem, 4vw, 2.6rem); }
.category-hero-icon .category-icon-image { width: 70%; height: 70%; object-fit: contain; }
.category-hero-icon .category-icon-glyph { line-height: 1; }
.category-hero-premium p:not(.eyebrow) { max-width: 420px; color: #aab7c6; font-size: 1.05rem; line-height: 1.6; }
.brand-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.brand-chips a { border: 1px solid #1f2a35; border-radius: 6px; background: rgba(11,17,24,.78); color: #f4f8fc; padding: 8px 12px; font-size: .76rem; font-weight: 900; text-transform: uppercase; }
.category-filter-bar { display: flex; flex-wrap: wrap; gap: 14px; align-items: end; padding: 22px 5vw 0; background: #05080c; }
.category-filter-bar label { display: grid; gap: 7px; color: #8fa1b4; font-size: .74rem; font-weight: 900; text-transform: uppercase; }
.category-filter-bar select { min-width: 170px; min-height: 42px; border: 1px solid #1f2a35; border-radius: 6px; background: #0b1118; color: #e5edf6; padding: 0 12px; }
.category-product-section { padding-top: 2rem; }
@media (max-width: 1040px) { body:not([data-page="admin"]):not([data-page="checkout"]) .site-header { grid-template-columns: auto auto minmax(0, 1fr) auto auto; } .premium-nav { display: none; } .mobile-menu-toggle { display: inline-grid; place-items: center; } .mega-menu { display: none; } }
@media (max-width: 720px) { body:not([data-page="admin"]):not([data-page="checkout"]) .site-header { grid-template-columns: auto auto auto; padding: 12px 4vw; } .premium-brand span, .header-search, .header-icon-button, .account-menu-wrap { display: none; } .mega-benefits, .mega-grid, .mega-feature-card { grid-template-columns: 1fr; } .category-hero-premium { min-height: 300px; padding-top: 4rem; } .category-hero-premium > img { width: 100%; opacity: .18; } .category-filter-bar { display: grid; } .category-filter-bar select { width: 100%; } }

/* Premium product detail page */
.premium-product-page { min-height: 100vh; padding: 1rem 4vw 3rem; background: radial-gradient(circle at 72% 8%, rgba(0, 200, 255, 0.12), transparent 34rem), #05080c; color: #f8fafc; }
.premium-breadcrumb { display: flex; flex-wrap: wrap; gap: 0.55rem; align-items: center; margin: 0 0 .85rem; color: #8190a3; font-size: 0.82rem; }
.premium-breadcrumb a { color: #c8d3df; }
.premium-breadcrumb strong { color: #fff; font-weight: 800; }
.premium-product-layout { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(380px, .82fr); gap: clamp(1.25rem, 2vw, 2.25rem); align-items: start; max-width: 1380px; margin-inline: auto; }
.premium-gallery { --product-media-aspect: 1; --product-media-height: clamp(400px, 48vh, 500px); display: grid; grid-template-columns: 72px minmax(0, auto); justify-content: center; align-items: start; justify-self: center; gap: 12px; width: min(100%, calc(84px + (var(--product-media-height) * var(--product-media-aspect)))); min-width: 0; }
.premium-thumbs { display: grid; align-content: start; gap: 9px; }
.premium-thumbs button { width: 72px; aspect-ratio: 1; overflow: hidden; border: 1px solid #1f2a35; border-radius: 8px; background: #080d12; padding: 0; cursor: pointer; transition: border-color 160ms ease, transform 160ms ease, background 160ms ease; }
.premium-thumbs button:hover, .premium-thumbs button.active { border-color: #00c8ff; background: #101923; transform: translateY(-1px); }
.premium-thumbs img { width: 100%; height: 100%; object-fit: contain; }
.premium-main-image { position: relative; display: grid; place-items: center; justify-self: center; width: min(100%, calc(var(--product-media-height) * var(--product-media-aspect))); aspect-ratio: var(--product-media-aspect); min-width: 0; overflow: hidden; border: 1px solid #1f2a35; border-radius: 10px; background: #030507; box-shadow: 0 20px 56px rgba(0,0,0,.3); transition: width 180ms ease, aspect-ratio 180ms ease; }
.premium-image-button { width: 100%; height: 100%; border: 0; background: transparent; cursor: default; }
.premium-image-button img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 0; }
.premium-arrow { position: absolute; top: 50%; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(11,17,24,.72); color: #fff; font-size: 2rem; line-height: 1; cursor: pointer; backdrop-filter: blur(12px); }
.premium-arrow:hover { border-color: #00c8ff; color: #00c8ff; }
.premium-arrow.left { left: 18px; }
.premium-arrow.right { right: 18px; }
.premium-dots { position: absolute; bottom: 18px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; }
.premium-dots span { width: 9px; height: 9px; border-radius: 999px; background: #475569; }
.premium-dots span.active { background: #00c8ff; }
.premium-gallery-empty { min-height: 380px; display: grid; place-items: center; border: 1px solid #1f2a35; border-radius: 10px; background: #0b1118; color: #7f8ea1; }
.premium-gallery-placeholder .premium-thumbs button { opacity: .45; cursor: default; }
.premium-gallery-placeholder .premium-thumbs button::before { content: ""; display: block; width: 44px; height: 44px; margin: 25px auto; border-radius: 999px; background: radial-gradient(circle, rgba(0,200,255,.34), rgba(0,200,255,.08)); }
.premium-buy-card { position: sticky; top: 82px; display: grid; gap: .58rem; padding: 1rem; border: 1px solid #1f2a35; border-radius: 10px; background: linear-gradient(150deg, rgba(13, 20, 29, 0.92), rgba(5, 8, 12, 0.86)); box-shadow: 0 20px 56px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter: blur(20px); }
.premium-buy-card .tag { width: max-content; color: #00c8ff; font-size: .74rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.premium-buy-card h1 { max-width: none; margin: 0; color: #fff; font-size: clamp(1.6rem, 2.1vw, 2.45rem); line-height: 1.04; letter-spacing: 0; }
.premium-rating { display: flex; flex-wrap: wrap; gap: 0.7rem; align-items: center; color: #00c8ff; }
.premium-rating small { color: #98a6b7; font-weight: 700; }
.stock-status { display: flex; align-items: center; gap: 0.55rem; margin: 0; color: #5ee197; font-weight: 850; }
.stock-status span { width: 9px; height: 9px; border-radius: 999px; background: currentColor; box-shadow: 0 0 16px currentColor; }
.stock-status.preorder { color: #fbbf24; }
.price-stack { display: grid; gap: .16rem; padding: .55rem 0; border-top: 1px solid #1f2a35; border-bottom: 1px solid #1f2a35; }
.price-stack strong { color: #fff; font-size: clamp(1.8rem, 2.55vw, 2.7rem); line-height: 1; }
.price-stack span, .price-stack em { color: #00c8ff; font-style: normal; font-size: .9rem; font-weight: 900; }
.price-stack small { color: #9aa8b8; }
.shipping-box { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .5rem; padding: .72rem; border: 1px solid rgba(31,42,53,.9); border-radius: 8px; background: rgba(5,8,12,.5); }
.shipping-box label { grid-column: 1 / -1; color: #dbe5f0; font-size: .84rem; font-weight: 850; text-transform: none; }
.shipping-box input { min-height: 36px; border: 1px solid #1f2a35; border-radius: 6px; background: #080d12; color: #fff; padding: 0 11px; font: inherit; outline: 0; }
.shipping-box input:focus { border-color: #00c8ff; box-shadow: 0 0 0 3px rgba(0,200,255,.12); }
.shipping-box .row-action { min-height: 36px; }
.shipping-result { grid-column: 1 / -1; margin: 0; color: #b8c5d4; }
.shipping-result.error { color: #ff6b83; }
.premium-actions { display: grid; gap: .5rem; }
.premium-actions .button { min-height: 42px; justify-content: center; border-radius: 7px; font-size: .88rem; }
.premium-actions .primary { background: linear-gradient(135deg, #00c8ff, #0877ff); color: #001018; box-shadow: 0 18px 40px rgba(0, 145, 255, .22); }
.premium-actions .primary:hover { transform: translateY(-1px); box-shadow: 0 22px 52px rgba(0, 145, 255, .32); }
.premium-actions .ghost { border-color: #00c8ff; color: #f8fafc; background: rgba(0,200,255,.04); }
.premium-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin: 0; padding-top: .25rem; }
.premium-notes span { display: flex; align-items: center; gap: .3rem; color: #c4cfdb; font-size: .66rem; line-height: 1.25; font-weight: 800; }
.premium-tabs { margin-top: 1.25rem; border: 1px solid #1f2a35; border-radius: 10px; background: linear-gradient(145deg, rgba(11,17,24,.82), rgba(5,8,12,.72)); backdrop-filter: blur(16px); overflow: hidden; }
.premium-tab-list { display: flex; gap: 0.4rem; overflow-x: auto; padding: 0 1.4rem; border-bottom: 1px solid #1f2a35; }
.premium-tab-list button { min-height: 48px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: #b7c3d1; padding: 0 .9rem; cursor: pointer; font: inherit; font-size: .88rem; font-weight: 850; white-space: nowrap; }
.premium-tab-list button.active, .premium-tab-list button:hover { color: #fff; border-bottom-color: #00c8ff; }
.premium-tab-panel { display: none; padding: clamp(1rem, 1.8vw, 1.4rem); }
.premium-tab-panel.active { display: block; }
.premium-copy { display: grid; grid-template-columns: 1fr; gap: 0; align-items: start; }
.premium-copy p { margin: 0; color: #c5cfda; font-size: .95rem; line-height: 1.65; white-space: pre-line; }
.premium-description-content { display: grid; gap: 0; width: min(100%, 920px); margin-inline: auto; }
.premium-description-intro { display: grid; gap: 10px; align-items: start; padding-bottom: 22px; border-bottom: 1px solid #1f2a35; }
.premium-description-intro > span { color: #00c8ff; font-size: .68rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.premium-description-intro > p { max-width: 840px; margin: 0; padding-left: 18px; border-left: 2px solid #00c8ff; color: #f0f5fa; font-size: 1.02rem; line-height: 1.65; font-weight: 700; }
.premium-description-flow { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; width: min(100%, 840px); margin: 0; padding: 0; }
.premium-description-section { display: grid; gap: 12px; min-width: 0; padding: 20px 0; border-bottom: 1px solid #172632; }
.premium-description-section:last-child { border-bottom: 0; padding-bottom: 0; }
.premium-description-flow p { margin: 0; color: #aebdca; font-size: .94rem; line-height: 1.72; }
.premium-description-flow h3 { display: flex; align-items: center; gap: 10px; margin: 0; color: #f4f8fc; font-size: 1.05rem; line-height: 1.35; }
.premium-description-flow h3::before { content: ""; width: 3px; height: 18px; flex: 0 0 3px; border-radius: 2px; background: #00c8ff; box-shadow: 0 0 12px rgba(0, 200, 255, .3); }
.premium-description-flow ul,
.premium-description-flow ol { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; margin: 0; padding: 0; list-style: none; }
.premium-description-flow li { position: relative; min-width: 0; color: #bfccd7; padding-left: 18px; font-size: .9rem; line-height: 1.55; }
.premium-description-flow li::before { content: ""; position: absolute; top: .62em; left: 0; width: 6px; height: 6px; border-radius: 50%; background: #00c8ff; box-shadow: 0 0 10px rgba(0, 200, 255, .42); }
.premium-description-content strong { color: #f4f8fc; font-weight: 850; }
.feature-pill-grid { display: grid; gap: 0.75rem; }
.feature-pill-grid span, .compat-list li, .download-row { display: block; border: 1px solid #1f2a35; border-radius: 8px; background: rgba(16,25,35,.62); color: #dbe5f0; padding: 0.9rem 1rem; font-weight: 800; }
.spec-table { width: 100%; border-collapse: collapse; }
.spec-table th, .spec-table td { border-bottom: 1px solid #1f2a35; padding: 1rem 0.8rem; text-align: left; vertical-align: top; }
.spec-table th { width: 240px; color: #7f8ea1; text-transform: uppercase; font-size: .78rem; letter-spacing: .08em; }
.spec-table td { color: #eef4fb; font-weight: 800; }
.compat-list { display: grid; gap: 0.7rem; margin: 0; padding: 0; list-style: none; }
.compat-list a { color: #00c8ff; }
.download-row + .download-row { margin-top: .7rem; }
.premium-empty, .review-empty p { color: #9aa8b8; }
.review-empty strong { color: #00c8ff; font-size: 1.4rem; letter-spacing: .12em; }
.premium-related { margin-top: 1.25rem; padding: 0; }
.premium-related .compact-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 1rem; }
.related-carousel { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(220px, 280px); gap: 1rem; overflow-x: auto; padding-bottom: 0.4rem; scroll-snap-type: x mandatory; }
.related-carousel .product-card { scroll-snap-align: start; }
@media (max-width: 1180px) { .premium-product-layout { grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr); gap: 1.25rem; } .premium-gallery { --product-media-height: clamp(360px, 44vh, 460px); grid-template-columns: 70px minmax(0, auto); } .premium-thumbs button { width: 70px; } .premium-buy-card h1 { font-size: clamp(1.7rem, 2.5vw, 2.65rem); } }
@media (max-width: 900px) { .premium-product-layout, .premium-copy { grid-template-columns: 1fr; } .premium-buy-card { position: static; } .premium-gallery { --product-media-height: min(82vw, 460px); grid-template-columns: 1fr; width: 100%; } .premium-thumbs { order: 2; display: flex; overflow-x: auto; } .premium-thumbs button { flex: 0 0 68px; width: 68px; } }
@media (max-width: 620px) { .premium-product-page { padding: 12px 12px 32px; } .premium-breadcrumb { margin-bottom: .6rem; font-size: .75rem; } .premium-main-image { min-height: 0; height: auto; max-height: none; border-radius: 8px; } .premium-image-button img { height: 100%; padding: 0; } .premium-arrow { width: 34px; height: 34px; font-size: 1.4rem; } .premium-buy-card { padding: .85rem; gap: .6rem; } .premium-buy-card h1 { font-size: 1.5rem; } .price-stack strong { font-size: 2rem; } .shipping-box { grid-template-columns: minmax(0, 1fr) auto; padding: .65rem; } .premium-notes { grid-template-columns: repeat(3, minmax(0, 1fr)); } .premium-notes span { align-items: start; font-size: .64rem; line-height: 1.25; } .premium-tab-list { padding-inline: .4rem; } .premium-tab-list button { min-height: 44px; padding: 0 .65rem; font-size: .72rem; } .premium-tab-panel { padding: .85rem; } .premium-copy p { font-size: .88rem; line-height: 1.55; } .spec-table th, .spec-table td { display: block; width: 100%; padding: .6rem 0; } .spec-table th { border-bottom: 0; padding-bottom: .12rem; } .premium-related { margin-top: .9rem; } .related-carousel { grid-auto-columns: minmax(76vw, 1fr); } }

@media (max-width: 760px) {
  .premium-description-content { gap: 0; }
  .premium-description-intro { gap: 8px; padding-bottom: 18px; }
  .premium-description-intro > p { padding-left: 14px; font-size: .96rem; line-height: 1.6; }
  .premium-description-flow { gap: 0; width: 100%; padding-left: 0; }
  .premium-description-section { gap: 10px; padding: 16px 0; }
}

/* Mobile-first product experience. The approved desktop product page is unchanged. */
.mobile-product-experience { display: none; }
body.mobile-product-lightbox-open { overflow: hidden; }

@media (max-width: 760px) {
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) {
    width: 100%;
    min-height: 100vh;
    padding: 0 0 calc(108px + var(--mobile-nav-height) + env(safe-area-inset-bottom));
    background: #05080c;
  }

  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-breadcrumb,
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-product-layout,
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-tabs,
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-related,
  body[data-page="product-detail"] > .footer { display: none !important; }

  body[data-page="product-detail"] .mobile-product-experience {
    display: block;
    width: min(100%, 520px);
    margin: 0 auto;
    color: #f6f9fc;
    background: #05080c;
  }

  .mobile-product-experience button,
  .mobile-product-experience a { -webkit-tap-highlight-color: transparent; }

  .mobile-product-experience svg {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .mobile-product-delivery-strip {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border-bottom: 1px solid #172632;
    background: #071017;
    color: #cbd7e1;
    font-size: .78rem;
    letter-spacing: .02em;
    text-transform: uppercase;
  }

  .mobile-product-delivery-strip svg { width: 22px; color: #00c8ff; }

  .mobile-product-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    overflow: hidden;
    padding: 20px 20px 14px;
    color: #7f8f9e;
    font-size: .72rem;
    white-space: nowrap;
  }

  .mobile-product-breadcrumb a { color: #aebcc8; }
  .mobile-product-breadcrumb strong { overflow: hidden; color: #dfe8ef; text-overflow: ellipsis; }

  .mobile-product-gallery {
    position: relative;
    width: calc(100% - 32px);
    margin: 0 16px;
    overflow: hidden;
    border: 1px solid #1d3341;
    border-radius: 12px;
    background: #03070a;
    box-shadow: 0 22px 54px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .025);
    animation: mobileProductRise 300ms ease both;
  }

  .mobile-product-gallery-track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    touch-action: pan-x pan-y;
  }

  .mobile-product-gallery-track::-webkit-scrollbar,
  .mobile-product-thumbs::-webkit-scrollbar,
  .mobile-product-related > div::-webkit-scrollbar { display: none; }

  .mobile-product-gallery-track figure {
    flex: 0 0 100%;
    width: 100%;
    aspect-ratio: 1 / 1;
    display: grid;
    place-items: center;
    margin: 0;
    scroll-snap-align: center;
    scroll-snap-stop: always;
    background: #020507;
  }

  .mobile-product-gallery-track img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
  }

  .mobile-product-gallery-empty {
    min-height: 340px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 12px;
    color: #738695;
  }

  .mobile-product-gallery-empty svg { width: 42px; color: #00c8ff; }

  .mobile-product-gallery-badge {
    position: absolute;
    z-index: 4;
    top: 14px;
    left: 14px;
    max-width: calc(100% - 82px);
    overflow: hidden;
    border: 1px solid rgba(0, 200, 255, .55);
    border-radius: 6px;
    padding: 7px 9px;
    background: rgba(0, 113, 231, .9);
    color: #fff;
    font-size: .65rem;
    font-weight: 900;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
    backdrop-filter: blur(12px);
  }

  .mobile-product-favorite,
  .mobile-product-expand {
    position: absolute;
    z-index: 4;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(172, 198, 215, .25);
    border-radius: 50%;
    background: rgba(3, 8, 12, .78);
    color: #e9f2f8;
    backdrop-filter: blur(12px);
  }

  .mobile-product-favorite { top: 12px; right: 12px; }
  .mobile-product-expand { right: 12px; bottom: 12px; }
  .mobile-product-favorite svg,
  .mobile-product-expand svg { width: 22px; height: 22px; }
  .mobile-product-favorite.active { border-color: #00c8ff; color: #00c8ff; }
  .mobile-product-favorite.active svg { fill: rgba(0, 200, 255, .23); }

  .mobile-product-photo-count {
    position: absolute;
    z-index: 3;
    bottom: 15px;
    left: 15px;
    border-radius: 999px;
    padding: 5px 8px;
    background: rgba(3, 8, 12, .76);
    color: #bfccd6;
    font-size: .66rem;
    font-weight: 800;
    backdrop-filter: blur(10px);
  }

  .mobile-product-thumbs {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    margin: 12px 0 0;
    padding: 0 16px 4px;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
  }

  .mobile-product-thumbs button {
    flex: 0 0 82px;
    width: 82px;
    aspect-ratio: 1.18 / 1;
    overflow: hidden;
    border: 1px solid #20313d;
    border-radius: 8px;
    padding: 0;
    background: #070c11;
    scroll-snap-align: start;
    transition: border-color 160ms ease, transform 160ms ease;
  }

  .mobile-product-thumbs button.active { border-color: #00c8ff; box-shadow: 0 0 0 1px rgba(0, 200, 255, .25); }
  .mobile-product-thumbs button:active { transform: scale(.97); }
  .mobile-product-thumbs img { width: 100%; height: 100%; display: block; object-fit: contain; }

  .mobile-product-info {
    display: grid;
    gap: 14px;
    padding: 30px 20px 0;
    animation: mobileProductRise 360ms 40ms ease both;
  }

  .mobile-product-brand {
    color: #00c8ff;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
  }

  .mobile-product-info h1 {
    min-width: 0;
    margin: -4px 0 0;
    overflow-wrap: anywhere;
    color: #fff;
    font-size: 36px;
    line-height: 1.03;
    font-weight: 900;
    letter-spacing: 0;
  }

  .mobile-product-rating {
    width: max-content;
    max-width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 0;
    padding: 0;
    background: transparent;
    color: #00c8ff;
    text-align: left;
  }

  .mobile-product-rating .review-stars { display: flex; gap: 2px; font-size: 1rem; }
  .mobile-product-rating > span:last-child { color: #9bacba; font-size: .78rem; }

  .mobile-product-summary {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: #aebcc8;
    font-size: .91rem;
    line-height: 1.65;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .mobile-product-price-block {
    display: grid;
    gap: 12px;
    border-top: 1px solid #172632;
    padding-top: 18px;
  }

  .mobile-product-pix-price,
  .mobile-product-card-price { display: grid; gap: 4px; }
  .mobile-product-pix-price > span,
  .mobile-product-card-price > span { color: #8ea1af; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
  .mobile-product-pix-price b { margin-left: 7px; border-radius: 4px; padding: 3px 6px; background: #0877ff; color: #fff; font-size: .62rem; }
  .mobile-product-pix-price strong { color: #fff; font-size: 2.7rem; line-height: 1; }
  .mobile-product-card-price strong { color: #00c8ff; font-size: 1.25rem; }
  .mobile-product-card-price small { color: #a9b7c3; font-size: .79rem; }

  .mobile-payment-marks {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }

  .mobile-payment-marks span {
    width: 50px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px solid #1b3442;
    border-radius: 6px;
    padding: 5px 8px;
    background: linear-gradient(180deg, #0a151d, #071018);
    box-shadow: inset 0 1px rgba(255, 255, 255, .025);
  }

  .mobile-payment-marks img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 17px;
    object-fit: contain;
  }

  .mobile-payment-marks .payment-method-mark--pix img,
  .mobile-payment-marks .payment-method-mark--mastercard img { width: 19px; height: 19px; }
  .mobile-payment-marks .payment-method-mark--visa img,
  .mobile-payment-marks .payment-method-mark--elo img,
  .mobile-payment-marks .payment-method-mark--amex img { filter: brightness(0) invert(1); opacity: .94; }

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

  .mobile-product-benefits article {
    min-width: 0;
    min-height: 86px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 1px solid #1d3442;
    border-radius: 9px;
    padding: 13px;
    background: #071017;
  }

  .mobile-product-benefits article > svg { width: 27px; flex: 0 0 27px; color: #00c8ff; }
  .mobile-product-benefits span { min-width: 0; display: grid; gap: 4px; }
  .mobile-product-benefits strong { color: #eaf2f8; font-size: .7rem; text-transform: uppercase; }
  .mobile-product-benefits small { color: #96a8b5; font-size: .69rem; line-height: 1.35; }

  .mobile-product-purchase {
    display: grid;
    grid-template-columns: 116px minmax(0, 1fr);
    gap: 10px;
    padding-top: 4px;
  }

  .mobile-product-quantity {
    min-height: 54px;
    display: grid;
    grid-template-columns: 38px 1fr 38px;
    align-items: center;
    border: 1px solid #263744;
    border-radius: 8px;
    background: #060c11;
  }

  .mobile-product-quantity button {
    width: 38px;
    height: 52px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #00c8ff;
  }
  .mobile-product-quantity button svg { width: 17px; }
  .mobile-product-quantity output { color: #fff; font-size: .94rem; font-weight: 900; text-align: center; }

  .mobile-product-add,
  .mobile-product-buy {
    min-width: 0;
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border-radius: 8px;
    padding: 0 12px;
    font: inherit;
    font-size: .78rem;
    font-weight: 900;
    text-transform: uppercase;
    transition: transform 150ms ease, border-color 150ms ease, background 150ms ease;
  }

  .mobile-product-add {
    border: 1px solid #0877ff;
    background: linear-gradient(135deg, #00b5f3, #0865f4);
    color: #fff;
    box-shadow: 0 14px 30px rgba(0, 115, 255, .2);
  }
  .mobile-product-add.is-complete { background: #078dce; }
  .mobile-product-add svg,
  .mobile-product-buy svg { width: 20px; flex: 0 0 20px; }
  .mobile-product-add:active,
  .mobile-product-buy:active { transform: scale(.985); }

  .mobile-product-buy {
    grid-column: 1 / -1;
    border: 1px solid #00c8ff;
    background: rgba(0, 200, 255, .035);
    color: #f6fbff;
  }

  .mobile-product-favorite-text {
    grid-column: 1 / -1;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 0;
    background: transparent;
    color: #aebdca;
    font: inherit;
    font-size: .77rem;
  }
  .mobile-product-favorite-text svg { width: 18px; }
  .mobile-product-favorite-text.active { color: #00c8ff; }

  .mobile-product-accordions {
    display: grid;
    gap: 10px;
    padding: 32px 20px 0;
  }

  .mobile-product-accordions details {
    overflow: hidden;
    border: 1px solid #1b2d39;
    border-radius: 9px;
    background: #071017;
  }

  .mobile-product-accordions summary {
    min-height: 58px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) 20px;
    gap: 10px;
    align-items: center;
    padding: 0 15px;
    color: #edf4f9;
    font-size: .82rem;
    font-weight: 900;
    list-style: none;
    cursor: pointer;
  }
  .mobile-product-accordions summary::-webkit-details-marker { display: none; }
  .mobile-product-accordions summary > svg { width: 20px; color: #00c8ff; }
  .mobile-product-accordions summary > svg:last-child { width: 18px; color: #78909f; transition: transform 160ms ease; }
  .mobile-product-accordions details[open] summary { border-bottom: 1px solid #172632; }
  .mobile-product-accordions details[open] summary > svg:last-child { transform: rotate(180deg); }
  .mobile-product-accordions details > div { padding: 17px 15px; color: #aebdc9; font-size: .84rem; line-height: 1.65; }

  .mobile-product-accordions .premium-description-content { gap: 0; width: 100%; }
  .mobile-product-accordions .premium-description-intro { padding-bottom: 15px; }
  .mobile-product-accordions .premium-description-intro > p { padding-left: 12px; font-size: .86rem; line-height: 1.62; }
  .mobile-product-accordions .premium-description-flow { gap: 0; width: 100%; padding: 0; }
  .mobile-product-accordions .premium-description-section { gap: 9px; padding: 14px 0; }
  .mobile-product-accordions .premium-description-flow p,
  .mobile-product-accordions .premium-description-flow li { font-size: .82rem; line-height: 1.65; }

  .mobile-product-spec-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .mobile-product-spec-grid article { min-width: 0; display: grid; gap: 5px; border: 1px solid #162c39; border-radius: 7px; padding: 12px; background: #050b10; }
  .mobile-product-spec-grid small { color: #718797; font-size: .62rem; font-weight: 900; text-transform: uppercase; }
  .mobile-product-spec-grid strong { overflow-wrap: anywhere; color: #e7eff5; font-size: .74rem; line-height: 1.4; }

  .mobile-product-reviews { display: grid; gap: 12px; }
  .mobile-product-reviews .verified-review-card { min-width: 0; }
  .mobile-product-review-action { min-height: 44px; display: flex; align-items: center; justify-content: center; border: 1px solid #1c4152; border-radius: 7px; color: #00c8ff; font-size: .74rem; font-weight: 900; }

  .mobile-product-support-cards {
    display: grid;
    gap: 10px;
    padding: 28px 20px 0;
  }

  .mobile-product-support-cards > article {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 13px;
    border: 1px solid #1b3442;
    border-radius: 9px;
    padding: 17px;
    background: #071017;
  }
  .mobile-product-support-cards > article > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #1d5268; border-radius: 8px; color: #00c8ff; background: rgba(0, 200, 255, .06); }
  .mobile-product-support-cards > article > span svg { width: 22px; }
  .mobile-product-support-cards small { color: #00c8ff; font-size: .61rem; font-weight: 900; text-transform: uppercase; }
  .mobile-product-support-cards h2 { margin: 3px 0 7px; color: #fff; font-size: 1rem; }
  .mobile-product-support-cards p { margin: 0; color: #9eb0bd; font-size: .78rem; }
  .mobile-product-support-cards ul { display: grid; gap: 8px; margin: 10px 0 0; padding: 0; list-style: none; }
  .mobile-product-support-cards li { display: flex; gap: 8px; color: #b7c5cf; font-size: .76rem; line-height: 1.45; }
  .mobile-product-support-cards li svg { width: 16px; flex: 0 0 16px; color: #00c8ff; }

  .mobile-product-related { padding: 36px 0 0; }
  .mobile-product-related > header { display: flex; align-items: end; justify-content: space-between; gap: 15px; padding: 0 20px 15px; }
  .mobile-product-related header small { color: #00c8ff; font-size: .64rem; font-weight: 900; text-transform: uppercase; }
  .mobile-product-related h2 { margin: 4px 0 0; color: #fff; font-size: 1.35rem; }
  .mobile-product-related header > a { color: #00c8ff; font-size: .7rem; font-weight: 900; }
  .mobile-product-related > div { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(210px, 66vw); gap: 11px; overflow-x: auto; padding: 0 20px 6px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .mobile-related-product { min-width: 0; overflow: hidden; border: 1px solid #1b2e3b; border-radius: 9px; background: #071017; scroll-snap-align: start; }
  .mobile-related-product > a { display: grid; gap: 5px; padding: 10px 10px 13px; }
  .mobile-related-media { width: 100%; aspect-ratio: 1.25 / 1; display: grid; place-items: center; overflow: hidden; border-radius: 6px; background: #03070a; }
  .mobile-related-media img { width: 100%; height: 100%; display: block; object-fit: contain; }
  .mobile-related-media svg { width: 34px; color: #00c8ff; }
  .mobile-related-product small { color: #00c8ff; font-size: .61rem; font-weight: 900; text-transform: uppercase; }
  .mobile-related-product h3 { min-height: 35px; display: -webkit-box; overflow: hidden; margin: 0; color: #edf4f9; font-size: .77rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .mobile-related-product strong { color: #fff; font-size: .9rem; }
  .mobile-related-product em { color: #00c8ff; font-size: .68rem; font-style: normal; font-weight: 900; }

  .mobile-product-footer {
    display: grid;
    justify-items: center;
    gap: 8px;
    margin-top: 42px;
    border-top: 1px solid #172632;
    padding: 28px 20px 30px;
    color: #8295a4;
    text-align: center;
  }
  .mobile-product-footer img { width: 42px; height: 42px; object-fit: contain; }
  .mobile-product-footer strong { color: #ecf3f8; font-size: .86rem; }
  .mobile-product-footer p { margin: 0; font-size: .7rem; }
  .mobile-product-footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; }
  .mobile-product-footer a { color: #00c8ff; font-size: .68rem; font-weight: 800; }

  .mobile-product-sticky {
    position: fixed;
    z-index: 98;
    right: 8px;
    bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 8px);
    left: 8px;
    min-height: 62px;
    display: grid;
    grid-template-columns: minmax(88px, 1fr) 86px 94px;
    gap: 7px;
    align-items: center;
    border: 1px solid #1b4050;
    border-radius: 10px;
    padding: 7px;
    background: rgba(5, 12, 18, .96);
    box-shadow: 0 -16px 42px rgba(0, 0, 0, .52);
    opacity: 0;
    pointer-events: none;
    transform: translateY(18px);
    transition: opacity 180ms ease, transform 180ms ease;
    backdrop-filter: blur(18px);
  }
  .mobile-product-sticky.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .mobile-product-sticky > div { min-width: 0; display: grid; gap: 2px; padding-left: 3px; }
  .mobile-product-sticky small { color: #7f93a2; font-size: .56rem; text-transform: uppercase; }
  .mobile-product-sticky strong { overflow: hidden; color: #fff; font-size: .83rem; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-product-sticky button { min-width: 0; height: 46px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid #1f4859; border-radius: 7px; background: #071017; color: #eaf3f8; font: inherit; font-size: .64rem; font-weight: 900; }
  .mobile-product-sticky button:last-child { border-color: #0788d5; background: #079fe1; color: #fff; }
  .mobile-product-sticky button svg { width: 17px; }

  .mobile-product-lightbox[hidden] { display: none; }
  .mobile-product-lightbox {
    position: fixed;
    z-index: 240;
    inset: 0;
    display: grid;
    place-items: center;
    overflow: auto;
    padding: 62px 14px 48px;
    background: rgba(1, 4, 7, .98);
    touch-action: pinch-zoom;
  }
  .mobile-product-lightbox > button { position: fixed; z-index: 2; top: 14px; right: 14px; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #29404e; border-radius: 50%; background: #071017; color: #fff; }
  .mobile-product-lightbox svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .mobile-product-lightbox > button svg { width: 21px; }
  .mobile-product-lightbox img { max-width: 100%; max-height: 78vh; object-fit: contain; transition: transform 180ms ease; }
  .mobile-product-lightbox.is-zoomed img { transform: scale(1.6); }
  .mobile-product-lightbox p { position: fixed; right: 0; bottom: 20px; left: 0; margin: 0; color: #8094a3; font-size: .68rem; text-align: center; }

  @keyframes mobileProductRise {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media (max-width: 390px) {
  .mobile-product-info,
  .mobile-product-accordions,
  .mobile-product-support-cards { padding-right: 16px; padding-left: 16px; }
  .mobile-product-info h1 { font-size: 32px; }
  .mobile-product-pix-price strong { font-size: 2.4rem; }
  .mobile-product-benefits article { padding: 11px; }
  .mobile-product-related > header,
  .mobile-product-related > div { padding-right: 16px; padding-left: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-product-experience *,
  .mobile-product-experience *::before,
  .mobile-product-experience *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Real sales dashboard */
body[data-page="admin"] { background: #05080c; }
body[data-page="admin"] .site-header.admin-topbar { min-height: 64px; padding: .7rem 2vw; border-bottom-color: #1f2a35; }
body[data-page="admin"] .admin-shell { width: 100%; min-height: calc(100vh - 64px); grid-template-columns: 210px minmax(0, 1fr); gap: 0; margin: 0; }
body[data-page="admin"] .admin-sidebar { display: block; padding: 1.4rem 1rem; border-right: 1px solid #1f2a35; background: linear-gradient(180deg, rgba(11,17,24,.9), rgba(5,8,12,.96)); }
body[data-page="admin"] .admin-sidebar h2 { display: none; }
body[data-page="admin"] .admin-sidebar .eyebrow { margin: 0 0 1rem; padding-left: .45rem; color: #7f8ea1; font-size: .72rem; }
body[data-page="admin"] .admin-tabs { display: grid; justify-content: stretch; gap: .35rem; }
body[data-page="admin"] .admin-tab { width: 100%; justify-content: flex-start; border-radius: 6px; min-height: 40px; box-shadow: none; }
body[data-page="admin"] .admin-tab.active, body[data-page="admin"] .admin-tab:hover { border-color: rgba(0,200,255,.24); background: linear-gradient(135deg, rgba(0,200,255,.18), rgba(0,90,160,.16)); }
body[data-page="admin"] .admin-workspace { padding: 1.25rem 1.35rem 3rem; }
body[data-page="admin"] .admin-panel[data-admin-panel="dashboard"] .admin-panel-heading { display: flex; align-items: center; justify-content: space-between; border-color: rgba(31,42,53,.95); background: transparent; box-shadow: none; padding: .45rem 0 1rem; }
body[data-page="admin"] .admin-panel[data-admin-panel="dashboard"] .admin-panel-heading .tag { color: #00c8ff; }
body[data-page="admin"] .admin-panel[data-admin-panel="dashboard"] .admin-panel-heading h3 { margin: .18rem 0 0; font-size: clamp(2rem, 3vw, 3.4rem); }
body[data-page="admin"] .dashboard-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .8rem; margin-bottom: .9rem; }
body[data-page="admin"] .dashboard-metric-card { min-height: 112px; display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: center; justify-content: start; gap: .9rem; padding: 1rem; border-color: #1f2a35; border-radius: 8px; background: linear-gradient(145deg, rgba(0,200,255,.07), rgba(11,17,24,.82) 45%), #0b1118; box-shadow: 0 18px 55px rgba(0,0,0,.24); }
body[data-page="admin"] .dashboard-metric-card strong { display: block; margin-top: .22rem; color: #fff; font-size: clamp(1.25rem, 1.8vw, 2rem); line-height: 1.05; }
body[data-page="admin"] .dashboard-metric-card small { display: block; width: max-content; max-width: 100%; margin-top: .55rem; border-radius: 0; background: transparent; color: #22c55e; padding: 0; white-space: normal; }
.metric-orders::before { content: "#"; }
.metric-ticket::before { content: "â—‡"; color: #f5b21b; }
.metric-money::before { content: "$"; }
body[data-page="admin"] .dashboard-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
body[data-page="admin"] .dashboard-metric-card { --metric-color: #00c8ff; gap: .85rem; background: linear-gradient(145deg, rgba(0,200,255,.07), rgba(11,17,24,.82) 45%), #0b1118; }
body[data-page="admin"] .dashboard-metric-card.metric-orders { --metric-color: #8b5cf6; }
body[data-page="admin"] .dashboard-metric-card.metric-users { --metric-color: #22c55e; }
body[data-page="admin"] .dashboard-metric-card.metric-ticket { --metric-color: #f5b21b; }
body[data-page="admin"] .dashboard-metric-card.metric-money { --metric-color: #1287ff; }
body[data-page="admin"] .dashboard-metric-card.metric-profit { --metric-color: #00e676; }
body[data-page="admin"] .dashboard-metric-card .metric-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--metric-color) 42%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--metric-color) 12%, transparent); box-shadow: inset 0 0 18px color-mix(in srgb, var(--metric-color) 10%, transparent); }
body[data-page="admin"] .dashboard-metric-card .metric-icon::before { content: none; }
body[data-page="admin"] .dashboard-metric-card .metric-icon svg { width: 22px; height: 22px; fill: none; stroke: var(--metric-color); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
body[data-page="admin"] .dashboard-metric-card .metric-icon svg path,
body[data-page="admin"] .dashboard-metric-card .metric-icon svg circle,
body[data-page="admin"] .dashboard-metric-card .metric-icon svg rect,
body[data-page="admin"] .dashboard-metric-card .metric-icon svg polyline { vector-effect: non-scaling-stroke; }
body[data-page="admin"] .dashboard-metric-card span { color: #8494a6; font-size: .72rem; font-weight: 900; text-transform: none; }
body[data-page="admin"] .dashboard-metric-card strong { font-size: clamp(1.08rem, 1.45vw, 1.55rem); white-space: nowrap; }
body[data-page="admin"] .dashboard-metric-card small { display: flex; align-items: center; gap: .28rem; font-size: .72rem; }
body[data-page="admin"] .dashboard-metric-card small::before { content: "\2197"; font-size: .72rem; }
.dashboard-period-bar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin: 0 0 .9rem; padding: .95rem 1rem; border: 1px solid #1f2a35; border-radius: 8px; background: #0b1118; }
.dashboard-period-bar h4 { margin: .15rem 0 0; color: #fff; }
.dashboard-period-bar label { display: flex; align-items: center; gap: .7rem; color: #92a3b5; font-weight: 850; }
.dashboard-period-bar select { min-height: 38px; border: 1px solid #1f2a35; border-radius: 6px; background: #080d12; color: #e5edf6; padding: 0 .7rem; }
.real-dashboard-layout { grid-template-columns: minmax(0, 1.35fr) minmax(360px, .9fr); gap: .9rem; }
.real-dashboard-layout .admin-dashboard-card { border-color: #1f2a35; border-radius: 8px; background: linear-gradient(145deg, rgba(16,25,35,.72), rgba(5,8,12,.92)), #0b1118; box-shadow: 0 18px 55px rgba(0,0,0,.25); }
.dashboard-sales-card, .dashboard-table-card { grid-column: 1; }
.dashboard-channel-card, .dashboard-products-card { grid-column: 2; }
.dashboard-channel-card { grid-row: 1; }
.dashboard-products-card { grid-row: 2; }
.dashboard-table-card { grid-row: 2; }
.dashboard-home-featured-card { grid-column: 1 / -1; }
.split-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.split-heading span { color: #93a4b7; font-size: .82rem; }
.dashboard-card-heading h4 { color: #fff; }
.dashboard-chart-wrap { min-height: 240px; display: grid; grid-template-rows: minmax(190px, 1fr) auto; }
.sales-line-chart { width: 100%; min-height: 210px; border-bottom: 1px solid rgba(148,163,184,.14); background-image: linear-gradient(rgba(148,163,184,.11) 1px, transparent 1px); background-size: 100% 25%; }
.chart-labels { display: grid; grid-template-columns: repeat(auto-fit, minmax(48px, 1fr)); gap: .4rem; padding-top: .65rem; color: #8ca0b4; font-size: .78rem; }
.dashboard-empty-state { min-height: 210px; display: grid; place-content: center; gap: .4rem; text-align: center; border: 1px dashed rgba(0,200,255,.24); border-radius: 8px; color: #93a4b7; background: rgba(0,200,255,.035); }
.dashboard-empty-state strong { color: #e8f2fb; }
.dashboard-empty-state.compact { min-height: 190px; }
.channel-dashboard { min-height: 230px; display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 1.2rem; align-items: center; }
.channel-donut { width: 150px; aspect-ratio: 1; border-radius: 999px; position: relative; box-shadow: 0 0 35px rgba(0,200,255,.14); }
.channel-donut::after { content: ""; position: absolute; inset: 34px; border-radius: inherit; background: #080d12; box-shadow: inset 0 0 18px rgba(0,0,0,.45); }
.channel-rows { display: grid; gap: .75rem; }
.channel-rows div { display: grid; grid-template-columns: minmax(0, 1fr) 42px 96px; gap: .6rem; align-items: center; color: #dbe5f0; font-size: .86rem; }
.channel-rows span { display: flex; align-items: center; gap: .45rem; min-width: 0; }
.channel-rows i { width: 10px; height: 10px; border-radius: 2px; flex: 0 0 auto; }
.channel-rows strong { color: #fff; text-align: right; }
.channel-rows em { color: #9aa8b8; font-style: normal; text-align: right; }
.dashboard-table { display: grid; }
.dashboard-table-head, .dashboard-table-row { display: grid; grid-template-columns: 1fr 1.2fr 1.25fr .9fr .9fr 58px; gap: .75rem; align-items: center; padding: .78rem .55rem; border-bottom: 1px solid rgba(31,42,53,.86); }
.dashboard-table-head { color: #77889b; font-size: .72rem; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.dashboard-table-row { color: #c9d4df; font-size: .84rem; }
.dashboard-table-row strong { color: #00c8ff; }
.status-pill { width: max-content; max-width: 100%; border-radius: 999px; background: rgba(0,200,255,.13); color: #00c8ff; padding: .25rem .5rem; font-size: .72rem; font-style: normal; font-weight: 900; }
.top-products-list { display: grid; gap: .75rem; }
.top-products-list article { display: grid; grid-template-columns: 28px 52px minmax(0, 1fr) 58px; gap: .75rem; align-items: center; padding-bottom: .75rem; border-bottom: 1px solid rgba(31,42,53,.86); }
.top-products-list b { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 6px; background: #213042; color: #d9e4ef; font-size: .78rem; }
.top-products-list img, .product-rank-image { width: 52px; height: 42px; border: 1px solid #1f2a35; border-radius: 6px; background: radial-gradient(circle at center, rgba(0,200,255,.16), #080d12 70%); object-fit: cover; }
.top-products-list strong { color: #edf5fb; font-size: .88rem; line-height: 1.25; }
.top-products-list em { display: grid; justify-items: end; color: #fff; font-style: normal; font-weight: 900; }
.top-products-list small { color: #92a3b5; font-weight: 700; }
.home-featured-toolbar { display: flex; justify-content: space-between; align-items: center; gap: .8rem; margin: .2rem 0 .85rem; color: #91a3b6; font-size: .82rem; }
.home-featured-toolbar b { color: #00c8ff; font-size: 1rem; }
.home-featured-list { max-height: 430px; overflow: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: .75rem; padding-right: .2rem; }
.home-featured-item { min-width: 0; display: grid; grid-template-columns: 18px 58px minmax(0, 1fr) auto; gap: .75rem; align-items: center; min-height: 78px; padding: .7rem; border: 1px solid #1f2a35; border-radius: 8px; background: rgba(7,13,19,.78); cursor: pointer; transition: border-color 160ms ease, background 160ms ease; }
.home-featured-item:hover, .home-featured-item.selected { border-color: rgba(0,200,255,.52); background: rgba(0,200,255,.07); }
.home-featured-item input { accent-color: #00c8ff; }
.home-featured-item img, .home-featured-item .product-rank-image { width: 58px; height: 48px; border: 1px solid #1f2a35; border-radius: 7px; object-fit: contain; background: #050a0f; }
.home-featured-item span { min-width: 0; display: grid; gap: .2rem; }
.home-featured-item strong { overflow: hidden; color: #f2f7fb; font-size: .84rem; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.home-featured-item small { overflow: hidden; color: #8da0b4; font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.home-featured-item em { min-width: 66px; border-radius: 999px; padding: .25rem .5rem; background: rgba(148,163,184,.1); color: #9aa9b8; font-size: .68rem; font-style: normal; font-weight: 900; text-align: center; }
.home-featured-item.selected em { background: rgba(0,200,255,.14); color: #00c8ff; }
@media (max-width: 1180px) { body[data-page="admin"] .dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .real-dashboard-layout { grid-template-columns: 1fr; } .dashboard-sales-card, .dashboard-table-card, .dashboard-channel-card, .dashboard-products-card, .dashboard-home-featured-card { grid-column: auto; grid-row: auto; } }
@media (max-width: 900px) { body[data-page="admin"] .admin-shell { grid-template-columns: 1fr; } body[data-page="admin"] .admin-sidebar { border-right: 0; border-bottom: 1px solid #1f2a35; } body[data-page="admin"] .admin-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { body[data-page="admin"] .dashboard-grid, .dashboard-table-head, .dashboard-table-row, .channel-dashboard, .home-featured-list { grid-template-columns: 1fr; } .dashboard-period-bar, .home-featured-toolbar { align-items: flex-start; flex-direction: column; } .dashboard-table-head { display: none; } .dashboard-table-row { gap: .35rem; padding: .9rem 0; } .channel-donut { margin: 0 auto; } .channel-rows div { grid-template-columns: 1fr auto; } .channel-rows em { grid-column: 1 / -1; text-align: left; } .home-featured-item { grid-template-columns: 18px 54px minmax(0, 1fr); } .home-featured-item em { grid-column: 2 / -1; justify-self: start; } }

/* Premium admin product editor */
body[data-page="admin"] .admin-topbar { justify-content: space-between; }
.admin-menu-button, .admin-notification, .admin-profile-button { border: 1px solid #1f2a35; border-radius: 8px; background: #0b1118; color: #e5edf6; min-height: 42px; padding: 0 .85rem; }
.admin-menu-button { order: -1; font-size: 1.25rem; }
.admin-store-button { border: 1px solid #1f2a35; border-radius: 8px; background: #0b1118; padding: .75rem 1rem; }
.admin-notification { position: relative; }
.admin-notification span { position: absolute; top: -8px; right: -8px; min-width: 18px; height: 18px; display: grid; place-items: center; border-radius: 999px; background: #ff3158; color: #fff; font-size: .68rem; }
.admin-profile-button { display: grid; grid-template-columns: 34px auto; gap: 0 .6rem; align-items: center; text-align: left; }
.admin-profile-button small { color: #93a4b7; }
.admin-avatar { grid-row: span 2; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 999px; background: #101923; color: #00c8ff; }
body[data-page="admin"] .admin-shell { grid-template-columns: 280px minmax(0, 1fr); background: #05080c; }
body[data-page="admin"] .admin-sidebar { position: sticky; top: 0; min-height: calc(100vh - 64px); padding: 1.2rem; }
body[data-page="admin"] .admin-tabs { gap: .2rem; }
body[data-page="admin"] .admin-tab, .admin-subtabs button { display: flex; align-items: center; justify-content: space-between; width: 100%; border: 0; border-radius: 8px; background: transparent; color: #c3ceda; min-height: 42px; padding: 0 .85rem; text-align: left; cursor: pointer; }
body[data-page="admin"] .admin-tab.active, body[data-page="admin"] .admin-tab:hover, .admin-subtabs button.active, .admin-subtabs button:hover { background: linear-gradient(135deg, rgba(0,200,255,.18), rgba(0,92,160,.14)); color: #fff; }
.admin-subtabs { display: grid; gap: .1rem; margin: .2rem 0 .7rem 1.15rem; padding-left: .8rem; border-left: 1px solid #1f2a35; }
.admin-subtabs button { min-height: 36px; font-size: .9rem; }
.admin-help-box { position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1.2rem; display: grid; gap: .4rem; padding: 1rem; border: 1px solid #1f2a35; border-radius: 10px; background: #0b1118; }
.admin-help-box span { color: #8fa1b4; font-size: .84rem; }
.admin-help-box a { border: 1px solid #1f2a35; border-radius: 7px; color: #00c8ff; padding: .65rem; text-align: center; }
.product-editor-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.2rem; }
.product-editor-heading h3 { margin: 0; color: #fff; font-size: 1.65rem; }
.product-editor-heading p { margin: .3rem 0 0; color: #8fa1b4; }
.product-editor-actions { display: flex; gap: .7rem; }
.product-editor-layout { display: grid; grid-template-columns: minmax(0, 1fr) 430px; gap: 1.2rem; align-items: start; }
.product-editor-form, .product-editor-side { display: grid; gap: 1rem; }
.editor-card { border: 1px solid #1f2a35; border-radius: 10px; background: linear-gradient(145deg, rgba(13,20,29,.92), rgba(5,8,12,.86)); padding: 1.2rem; box-shadow: 0 18px 55px rgba(0,0,0,.24); }
.editor-card h4 { margin: 0 0 1rem; color: #fff; font-size: 1.05rem; }
.editor-grid, .media-editor, .fee-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .95rem; }
.fee-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.editor-card label { display: grid; gap: .45rem; color: #b8c5d4; font-size: .86rem; font-weight: 800; }
.editor-card input, .editor-card select, .editor-card textarea { width: 100%; min-height: 42px; border: 1px solid #1f2a35; border-radius: 7px; background: #080d12; color: #f8fafc; padding: .75rem; font: inherit; }
.editor-card textarea { resize: vertical; }
.promotion-editor-card { overflow: hidden; }
.promotion-editor-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #1f2a35; }
.promotion-editor-heading h4 { margin: .45rem 0 0; }
.promotion-editor-heading .tag { color: #00c8ff; font-size: .65rem; font-weight: 900; text-transform: uppercase; }
.promotion-switch { min-width: 164px; grid-template-columns: 42px minmax(0, 1fr); grid-template-rows: auto !important; align-items: center; gap: .65rem !important; cursor: pointer; font-size: .72rem !important; line-height: 1.3; }
.promotion-switch input { position: absolute; width: 1px !important; height: 1px; min-height: 0 !important; overflow: hidden; opacity: 0; pointer-events: none; }
.promotion-switch > span { position: relative; width: 42px; height: 23px; display: block; border: 1px solid #334451; border-radius: 999px; background: #101820; transition: border-color 160ms ease, background 160ms ease; }
.promotion-switch > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 15px; height: 15px; border-radius: 50%; background: #8393a0; transition: background 160ms ease, transform 160ms ease; }
.promotion-switch input:focus-visible + span { outline: 2px solid #00c8ff; outline-offset: 3px; }
.promotion-switch input:checked + span { border-color: #00bde9; background: rgba(0, 200, 255, .18); }
.promotion-switch input:checked + span::after { background: #00c8ff; transform: translateX(19px); }
.promotion-editor-fields { display: grid; gap: .9rem; margin-top: 1rem; transition: opacity 160ms ease; }
.promotion-editor-fields.is-disabled { opacity: .56; }
.promotion-editor-fields input[readonly] { color: #91a3b2; background: #070b10; cursor: default; }
.promotion-discount-preview { min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: .8rem; border: 1px solid #223540; border-radius: 7px; padding: .75rem .85rem; background: #071019; color: #91a2af; font-size: .75rem; line-height: 1.45; }
.promotion-discount-preview b { color: #f2f8fb; font-size: 1rem; }
.promotion-discount-preview.is-valid { border-color: rgba(0, 200, 255, .38); background: rgba(0, 200, 255, .06); color: #b9dce9; }
.promotion-discount-preview.is-valid b { color: #00c8ff; }
.promotion-discount-preview.is-error { border-color: rgba(245, 183, 63, .42); background: rgba(245, 183, 63, .06); color: #e8c980; }
.span-2 { grid-column: span 2; }
.span-3 { grid-column: 1 / -1; }
.upload-tile { min-height: 130px; place-content: center; border: 1px dashed #334155; border-radius: 8px; color: #00c8ff !important; text-align: center; cursor: pointer; }
.upload-tile input { display: none; }
.two-columns { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: .8rem; }
.fee-results, .pricing-results, .product-status-box { display: grid; gap: .65rem; margin-top: 1rem; color: #cbd5e1; }
.fee-results div, .pricing-results div, .product-status-box div { display: flex; justify-content: space-between; gap: 1rem; }
.fee-results strong, .pricing-results strong { color: #fff; }
.positive strong, .positive { color: #22c55e !important; }
.negative strong, .negative { color: #ff3158 !important; }
.product-admin-preview { display: grid; grid-template-columns: 96px minmax(0,1fr); gap: .9rem; align-items: center; border: 1px solid #1f2a35; border-radius: 9px; padding: .75rem; background: #080d12; }
.product-admin-preview img, .admin-preview-empty { width: 96px; height: 96px; object-fit: cover; border-radius: 7px; background: radial-gradient(circle, rgba(0,200,255,.14), #05080c 70%); }
.product-admin-preview strong, .product-admin-preview span { display: block; color: #fff; }
.product-admin-preview span { color: #00c8ff; font-weight: 900; margin-top: .45rem; }
.product-admin-preview small { display: block; color: #9fb0c2; }
.product-admin-preview em { display: block; color: #22c55e; margin-top: .4rem; font-style: normal; }
.brand-hero-premium { min-height: 320px; display: grid; align-items: center; padding: clamp(4rem,8vw,7rem) 5vw; background: radial-gradient(circle at 70% 20%, rgba(0,200,255,.18), transparent 38%), #05080c; border-bottom: 1px solid #1f2a35; }
.brand-hero-premium img { max-width: 220px; max-height: 90px; object-fit: contain; margin-bottom: 1rem; }
.brand-hero-placeholder { width: 94px; height: 70px; display: grid; place-items: center; margin-bottom: 1rem; border: 1px solid #243542; border-radius: 8px; color: #00c8ff; background: radial-gradient(circle at center, rgba(0,200,255,.12), #071019 70%); font-size: 1.2rem; font-weight: 900; }
.brand-hero-premium h1 { max-width: none; margin: 0; color: #fff; }
@media (max-width: 1180px) { .product-editor-layout { grid-template-columns: 1fr; } .product-editor-side { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 1380px) { .editor-grid, .media-editor { grid-template-columns: repeat(2, minmax(0, 1fr)); } .editor-grid .span-3, .media-editor .span-3 { grid-column: 1 / -1; } }
@media (max-width: 760px) { body[data-page="admin"] .admin-shell, .editor-grid, .media-editor, .fee-grid, .product-editor-side, .two-columns { grid-template-columns: 1fr; } .span-2, .span-3 { grid-column: auto; } .product-editor-heading, .product-editor-actions { align-items: stretch; flex-direction: column; } .admin-help-box { position: static; margin-top: 1rem; } }

/* Admin sidebar layout */
body[data-page="admin"] .admin-topbar {
  grid-template-columns: 58px minmax(0, 1fr);
}

body[data-page="admin"] .admin-topbar > .brand {
  display: none;
}

body[data-page="admin"] .admin-topbar > .admin-menu-button {
  grid-column: 1;
}

body[data-page="admin"] .admin-topbar > .main-nav {
  grid-column: 2;
}

body[data-page="admin"] .admin-shell {
  grid-template-columns: 250px minmax(0, 1fr);
  background: #05080c;
}

body[data-page="admin"] .admin-sidebar {
  position: sticky;
  top: 0;
  min-height: calc(100vh - 60px);
  padding: 16px 12px;
  border-right: 1px solid #16212c;
  background: #060a10;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

.admin-sidebar-brand {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 48px;
  margin: 0 0 18px;
  color: #f7fbff;
}

.admin-sidebar-brand img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  filter: drop-shadow(0 0 14px rgba(0, 200, 255, .18));
}

.admin-sidebar-brand strong,
.admin-sidebar-brand small {
  display: block;
  line-height: 1.12;
  letter-spacing: 0;
}

.admin-sidebar-brand strong {
  color: #f7fbff;
  font-size: .95rem;
  font-weight: 800;
}

.admin-sidebar-brand small {
  margin-top: 3px;
  color: #8b98a8;
  font-size: .66rem;
  font-weight: 600;
}

body[data-page="admin"] .admin-tabs {
  display: grid;
  gap: 2px;
}

.admin-menu-section {
  margin: 14px 0 5px;
  padding: 0 6px;
  color: #6e7886;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: 0;
  text-transform: uppercase;
}

body[data-page="admin"] .admin-tab,
.admin-store-link {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 34px;
  border: 0;
  border-radius: 6px;
  padding: 0 9px;
  color: #aeb8c6;
  background: transparent;
  box-shadow: none;
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: 0;
  text-align: left;
  cursor: pointer;
}

body[data-page="admin"] .admin-tab svg,
.admin-store-link svg {
  width: 15px;
  height: 15px;
  color: #7f8a99;
  stroke-width: 2;
}

body[data-page="admin"] .admin-tab span,
.admin-store-link span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-page="admin"] .admin-tab em {
  min-width: 23px;
  border-radius: 999px;
  padding: 2px 7px;
  color: #d9f4ff;
  background: #163143;
  font-size: .68rem;
  font-style: normal;
  font-weight: 850;
  text-align: center;
}

body[data-page="admin"] .admin-tab.active,
body[data-page="admin"] .admin-tab:hover,
.admin-store-link:hover {
  color: #eef7ff;
  border-color: transparent;
  background: #082b42;
}

body[data-page="admin"] .admin-tab.active svg,
body[data-page="admin"] .admin-tab:hover svg,
.admin-store-link:hover svg {
  color: #d5eefc;
}

.admin-menu-divider {
  height: 1px;
  margin: 16px 8px 10px;
  background: #121b25;
}

.admin-store-link {
  text-decoration: none;
}

.admin-help-box,
.admin-subtabs,
body[data-page="admin"] .product-parent {
  display: none !important;
}

.activity-log-card {
  display: grid;
  gap: 0;
  border: 1px solid #172430;
  border-radius: 7px;
  background: linear-gradient(180deg, rgba(7, 15, 23, .98), rgba(4, 10, 15, .99));
  overflow: hidden;
}

.activity-log-row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 74px;
  padding: 12px 16px;
  border-bottom: 1px solid #14202b;
}

.activity-log-row:last-child {
  border-bottom: 0;
}

.activity-log-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(0, 200, 255, .2);
  border-radius: 8px;
  color: #00c8ff;
  background: rgba(0, 200, 255, .08);
}

.activity-log-icon svg {
  width: 17px;
  height: 17px;
}

.activity-log-row strong,
.activity-log-row p,
.activity-log-row small {
  letter-spacing: 0;
}

.activity-log-row strong {
  color: #f8fafc;
  font-size: .9rem;
}

.activity-log-row p {
  margin: 5px 0 0;
  color: #94a3b8;
  font-size: .78rem;
}

.activity-log-row small {
  color: #7f8ea1;
  font-size: .72rem;
  line-height: 1.45;
  text-align: right;
}

@media (max-width: 900px) {
  body[data-page="admin"] .admin-shell {
    grid-template-columns: 1fr;
  }

  body[data-page="admin"] .admin-sidebar {
    position: static;
    min-height: auto;
  }
}

/* Keep the checkout CTA blue even when the shared button theme is loaded later. */
body[data-page="checkout"] .finalize-order.button.primary {
  border-color: #00c8ff !important;
  background: #079de1 !important;
  color: #fff !important;
}

body[data-page="checkout"] .finalize-order.button.primary:hover { background: #00b8f4 !important; }

body[data-page="checkout"] .premium-order-summary .checkout-order-lines .cart-line {
  border: 0;
  border-bottom: 1px solid #1a2731;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #f4f8fa;
}

body[data-page="checkout"] .premium-order-summary .checkout-order-lines .cart-line strong {
  color: #f4f8fa;
}

body[data-page="checkout"] .premium-order-summary .checkout-order-lines .cart-line span {
  color: #91a0ad;
}

body[data-page="checkout"] .premium-order-summary .checkout-order-lines .cart-qty {
  display: flex;
  align-items: center;
  gap: 6px;
}

body[data-page="checkout"] .premium-order-summary .checkout-order-lines .cart-qty button {
  min-width: 28px;
  min-height: 26px;
  border-color: #2a3b48;
  background: #0b141c;
  color: #dce8f1;
}

body[data-page="checkout"] .premium-order-summary .checkout-order-lines .cart-qty button:last-child {
  border-color: rgba(255, 70, 96, .35);
  background: rgba(255, 49, 88, .06);
  color: #ff8ca0;
}

body[data-page="checkout"] .premium-checkout .card-fields {
  border-color: rgba(0, 200, 255, .28);
  background:
    linear-gradient(135deg, rgba(0, 200, 255, .06), transparent 44%),
    rgba(5, 12, 18, .96);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}

body[data-page="checkout"] .premium-checkout .card-fields label {
  color: #b9c8d8;
}

body[data-page="checkout"] .premium-checkout .card-fields input,
body[data-page="checkout"] .premium-checkout .card-fields select,
body[data-page="checkout"] .premium-checkout input,
body[data-page="checkout"] .premium-checkout select {
  border-color: #273744;
  background: #090f15;
  color: #f2f7fb;
}

body[data-page="checkout"] .premium-checkout .card-fields input::placeholder {
  color: #7f91a3;
}

body[data-page="checkout"] .premium-checkout .card-fields input:focus,
body[data-page="checkout"] .premium-checkout .card-fields select:focus,
body[data-page="checkout"] .premium-checkout input:focus,
body[data-page="checkout"] .premium-checkout select:focus {
  border-color: #00c8ff;
  box-shadow: 0 0 0 3px rgba(0,200,255,.1);
}

body[data-page="checkout"] .premium-checkout .card-fields p {
  color: #8ea0b1;
}

body[data-page="checkout"] .checkout-benefits {
  gap: 13px;
}

body[data-page="checkout"] .checkout-benefits li {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  color: #c8d3df;
}

body[data-page="checkout"] .checkout-benefits svg {
  grid-row: 1 / span 2;
  width: 27px;
  height: 27px;
  fill: none;
  stroke: #00a8ff;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body[data-page="checkout"] .checkout-benefits b {
  color: #eef4fb;
  font-size: .78rem;
  line-height: 1.2;
}

body[data-page="checkout"] .checkout-benefits small {
  color: #9aa8b8;
  font-size: .72rem;
}

/* Customer account area */
.profile-page { min-height: 100vh; padding: clamp(1.2rem, 2.8vw, 2rem) 5vw 5rem; background: radial-gradient(circle at 72% 8%, rgba(0, 200, 255, .12), transparent 34rem), #05080c; color: #f8fafc; }
.profile-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: 18px; align-items: end; margin-bottom: 18px; padding: clamp(1.4rem, 3vw, 2.2rem); border: 1px solid #172430; border-radius: 8px; background: linear-gradient(145deg, rgba(13, 20, 29, .92), rgba(5, 8, 12, .86)); box-shadow: 0 24px 70px rgba(0, 0, 0, .24); }
.profile-hero h1 { margin: .25rem 0 .45rem; color: #fff; font-size: clamp(2rem, 4vw, 4rem); line-height: 1; }
.profile-hero p { margin: 0; color: #91a2b4; }
.profile-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.profile-summary-grid article, .profile-card article { padding: 14px; border: 1px solid #1c2935; border-radius: 7px; background: #050c12; }
.profile-summary-grid article { min-height: 92px; }
.profile-summary-grid span, .profile-card article span { display: block; color: #7f8ea1; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.profile-summary-grid strong, .profile-card article strong { display: block; margin-top: 8px; color: #fff; }
.profile-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 18px; align-items: start; }
.profile-sidebar { position: sticky; top: 92px; display: grid; gap: 6px; padding: 10px; border: 1px solid #172430; border-radius: 8px; background: linear-gradient(180deg, rgba(7, 15, 23, .98), rgba(4, 10, 15, .99)); }
.profile-sidebar button { min-height: 42px; border: 0; border-radius: 7px; background: transparent; color: #c3ceda; padding: 0 12px; text-align: left; cursor: pointer; font: inherit; font-weight: 850; }
.profile-sidebar button.active, .profile-sidebar button:hover { background: linear-gradient(135deg, rgba(0, 200, 255, .18), rgba(0, 92, 160, .14)); color: #fff; }
.profile-pane { display: none; }
.profile-pane.active { display: grid; gap: 16px; }
.profile-card { min-width: 0; padding: 18px; border: 1px solid #172430; border-radius: 8px; background: linear-gradient(180deg, rgba(7, 15, 23, .98), rgba(4, 10, 15, .99)); box-shadow: 0 18px 48px rgba(0, 0, 0, .18); }
.profile-card h2 { margin: 0 0 16px; color: #fff; font-size: 1.12rem; }
.profile-info-grid, .profile-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.profile-settings-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.profile-card article p, .profile-note { color: #94a5b8; line-height: 1.55; }
.profile-orders-list { display: grid; gap: 10px; }
.profile-order-card { display: grid; grid-template-columns: minmax(0, 1fr) 150px 120px 100px; gap: 12px; align-items: center; padding: 13px 14px; border: 1px solid #14202b; border-radius: 7px; background: #050c12; }
.profile-order-card strong, .profile-order-card b { color: #fff; }
.profile-order-card span { display: block; margin-top: 4px; color: #8798aa; font-size: .8rem; }
.profile-order-card em { width: max-content; border-radius: 999px; background: rgba(0, 200, 255, .12); color: #00c8ff; padding: .32rem .55rem; font-style: normal; font-size: .72rem; font-weight: 900; }
.profile-empty-state { min-height: 220px; display: grid; place-content: center; justify-items: center; gap: 8px; text-align: center; color: #94a5b8; }
.profile-empty-state strong { color: #fff; }
.profile-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.profile-form label { display: grid; gap: 7px; color: #b8c5d4; font-size: .84rem; font-weight: 850; }
.profile-form input { width: 100%; min-height: 40px; border: 1px solid #1c2935; border-radius: 6px; background: #050c12; color: #f8fafc; padding: 0 12px; font: inherit; outline: 0; }
.profile-form input:focus { border-color: #00c8ff; box-shadow: 0 0 0 3px rgba(0, 200, 255, .1); }
.profile-check { display: flex !important; align-items: center; margin-top: 14px; }
.profile-check input { width: 18px; min-height: 18px; }
.profile-actions { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.profile-actions span { color: #00c8ff; font-weight: 850; }
@media (max-width: 980px) { .profile-hero, .profile-layout, .profile-info-grid, .profile-settings-grid { grid-template-columns: 1fr; } .profile-sidebar { position: static; } }
@media (max-width: 680px) { .profile-page { padding-inline: 12px; } .profile-summary-grid, .profile-form-grid, .profile-order-card { grid-template-columns: 1fr; } }

/* Admin catalog managers */
.admin-management-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 430px);
  gap: 1.2rem;
  align-items: start;
}

.management-editor-form,
.management-side {
  display: grid;
  gap: 1rem;
}

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

.management-list {
  max-height: calc(100vh - 240px);
  overflow: auto;
  padding-right: .15rem;
}

.management-list .admin-row {
  grid-template-columns: 64px minmax(0, 1fr) auto;
  border-color: #1f2a35;
  border-radius: 8px;
  background: rgba(8, 13, 18, .78);
}

.management-list .admin-thumb {
  width: 64px;
  height: 48px;
  border: 1px solid #1f2a35;
  border-radius: 7px;
  object-fit: contain;
  padding: .35rem;
  background: #080d12;
}

.management-list a {
  color: #00c8ff;
  font-weight: 850;
}

.category-list-icon {
  display: grid;
  place-items: center;
  color: #00c8ff;
  font-size: 1.35rem;
  font-weight: 900;
}

.category-admin-preview,
.brand-admin-preview {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: .9rem;
  align-items: center;
  min-height: 118px;
  border: 1px solid #1f2a35;
  border-radius: 9px;
  padding: .85rem;
  background: #080d12;
}

.category-preview-icon,
.brand-preview-logo {
  width: 96px;
  height: 78px;
  display: grid;
  place-items: center;
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: radial-gradient(circle at center, rgba(0,200,255,.12), #05080c 72%);
  color: #00c8ff;
  font-size: 2rem;
  font-weight: 950;
}

.brand-preview-logo img {
  max-width: 82px;
  max-height: 52px;
  object-fit: contain;
}

.brand-preview-logo span {
  font-size: 1rem;
}

.category-admin-preview strong,
.brand-admin-preview strong,
.category-admin-preview span,
.brand-admin-preview span,
.category-admin-preview small,
.brand-admin-preview small,
.category-admin-preview em,
.brand-admin-preview em {
  display: block;
}

.category-admin-preview strong,
.brand-admin-preview strong {
  color: #fff;
}

.category-admin-preview span,
.brand-admin-preview span {
  margin-top: .3rem;
  color: #00c8ff;
  font-weight: 850;
  overflow-wrap: anywhere;
}

.category-admin-preview small,
.brand-admin-preview small {
  margin-top: .35rem;
  color: #9fb0c2;
  line-height: 1.45;
}

.category-admin-preview em,
.brand-admin-preview em {
  margin-top: .4rem;
  font-style: normal;
  font-weight: 850;
}

.brand-media-editor {
  grid-template-columns: minmax(0, 1fr) 180px;
}

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

  .management-list {
    max-height: none;
  }
}

@media (max-width: 760px) {
  .compact-editor-grid,
  .brand-media-editor,
  .category-admin-preview,
  .brand-admin-preview,
  .management-list .admin-row {
    grid-template-columns: 1fr;
  }
}

/* Category administration */
html:has(body[data-page="admin"]),
body[data-page="admin"] {
  overflow-x: hidden;
}

body[data-page="admin"] .admin-topbar {
  display: grid;
  grid-template-columns: 220px 58px minmax(0, 1fr);
  min-height: 60px;
  padding: 0;
  background: rgba(3, 7, 11, .98);
}

body[data-page="admin"] .admin-topbar > .brand {
  grid-column: 1;
  grid-row: 1;
  height: 60px;
  padding: 0 24px;
  border-right: 1px solid #16212c;
}

body[data-page="admin"] .admin-topbar > .admin-menu-button {
  grid-column: 2;
  grid-row: 1;
  min-width: 58px;
  height: 60px;
  min-height: 60px;
  padding: 0;
  border: 0;
  border-right: 1px solid #16212c;
  border-radius: 0;
  background: transparent;
}

body[data-page="admin"] .admin-topbar > .main-nav {
  grid-column: 3;
  grid-row: 1;
  justify-self: stretch;
  justify-content: flex-end;
  min-width: 0;
  padding: 0 24px;
}

body[data-page="admin"] .admin-shell {
  grid-template-columns: 220px minmax(0, 1fr);
  min-height: calc(100vh - 60px);
}

body[data-page="admin"] .admin-sidebar {
  min-height: calc(100vh - 60px);
  padding: 16px 10px;
}

body[data-page="admin"] .admin-workspace {
  min-width: 0;
  padding: 20px 24px 36px;
}

.category-admin-panel,
.category-admin-panel * {
  letter-spacing: 0;
}

.category-page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
  padding: 0 8px;
}

.category-page-heading h3 {
  margin: 0;
  color: #f8fafc;
  font-size: 1.42rem;
  line-height: 1.2;
}

.category-page-heading p {
  margin: 6px 0 0;
  color: #718096;
  font-size: .78rem;
}

.category-page-heading p span {
  margin: 0 6px;
  color: #435164;
}

.category-page-actions,
.category-editor-footer {
  display: flex;
  align-items: center;
  gap: 10px;
}

.category-primary-button,
.category-secondary-button,
.category-filter-button,
.category-icon-button,
.category-delete-button,
.category-row-action,
.category-pagination button,
.category-pagination span button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  border: 1px solid #1d2a36;
  border-radius: 6px;
  padding: 0 14px;
  color: #cbd5e1;
  background: #071019;
  font: inherit;
  font-size: .78rem;
  font-weight: 750;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, color .18s ease;
}

.category-primary-button {
  border-color: #079de1;
  color: #fff;
  background: #079de1;
}

.category-primary-button:hover {
  border-color: #18b7f5;
  background: #18aeea;
}

.category-secondary-button:hover,
.category-filter-button:hover,
.category-icon-button:hover,
.category-row-action:hover,
.category-pagination button:hover,
.category-pagination span button:hover {
  border-color: #33485d;
  color: #fff;
  background: #0b1722;
}

.category-primary-button svg,
.category-secondary-button svg,
.category-filter-button svg,
.category-icon-button svg,
.category-delete-button svg,
.category-row-action svg,
.category-pagination svg {
  width: 15px;
  height: 15px;
  stroke-width: 1.8;
}

.category-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 14px;
  border: 1px solid #172430;
  border-radius: 7px;
  background: linear-gradient(180deg, rgba(8, 17, 25, .94), rgba(5, 11, 17, .98));
  overflow: hidden;
}

.category-stat {
  position: relative;
  min-width: 0;
  padding: 14px 18px 15px;
}

.category-stat + .category-stat {
  border-left: 1px solid #172430;
}

.category-stat span {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #aab6c4;
  font-size: .74rem;
}

.category-stat span::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--stat-color, #00c8ff);
  box-shadow: 0 0 12px color-mix(in srgb, var(--stat-color, #00c8ff) 55%, transparent);
}

.category-stat strong {
  display: block;
  margin-top: 5px;
  color: #fff;
  font-size: 1.22rem;
  line-height: 1;
}

.category-admin-layout {
  display: grid;
  grid-template-columns: minmax(620px, 1fr) minmax(390px, 445px);
  gap: 18px;
  align-items: start;
}

.category-table-card,
.category-editor-card {
  min-width: 0;
  border: 1px solid #172430;
  border-radius: 7px;
  background: linear-gradient(180deg, rgba(7, 15, 23, .98), rgba(4, 10, 15, .99));
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
  overflow: hidden;
}

.category-table-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 176px 38px auto;
  gap: 10px;
  align-items: center;
  min-height: 62px;
  padding: 10px 14px;
  border-bottom: 1px solid #14202b;
}

.category-search {
  position: relative;
  min-width: 0;
}

.category-search svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 15px;
  height: 15px;
  color: #8190a2;
  transform: translateY(-50%);
  pointer-events: none;
}

.category-search input,
.category-table-toolbar select {
  width: 100%;
  min-height: 36px;
  border: 1px solid #1c2935;
  border-radius: 6px;
  color: #e6edf5;
  background: #050c12;
  padding: 0 12px;
  font: inherit;
  font-size: .78rem;
}

.category-search input {
  padding-left: 36px;
}

.category-search input:focus,
.category-table-toolbar select:focus,
.category-editor-body input:focus,
.category-editor-body select:focus,
.category-editor-body textarea:focus {
  outline: 0;
  border-color: #079de1;
  box-shadow: 0 0 0 2px rgba(7, 157, 225, .12);
}

.category-icon-button {
  width: 38px;
  padding: 0;
}

.category-table-scroll {
  min-width: 0;
  overflow-x: auto;
}

.category-table-head,
.category-table-row {
  display: grid;
  grid-template-columns: 92px minmax(135px, 1fr) minmax(165px, 1.25fr) 62px 62px 72px;
  gap: 10px;
  align-items: center;
  min-width: 680px;
}

.category-table-head {
  min-height: 40px;
  padding: 0 14px;
  color: #91a0b1;
  background: #08111a;
  font-size: .7rem;
  font-weight: 750;
}

.category-table-row {
  min-height: 66px;
  padding: 9px 14px;
  border-top: 1px solid #13202b;
  color: #cbd5e1;
  font-size: .74rem;
  transition: background .16s ease;
}

.category-table-row:first-child {
  border-top: 0;
}

.category-table-row:hover,
.category-table-row.selected {
  background: rgba(9, 157, 225, .055);
}

.category-order-cell {
  display: grid;
  grid-template-columns: 20px 40px;
  gap: 8px;
  align-items: center;
}

.category-drag-handle {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 30px;
  border: 0;
  padding: 0;
  color: #8090a2;
  background: transparent;
  cursor: grab;
}

.category-drag-handle svg {
  width: 15px;
  height: 15px;
}

.category-order-input {
  width: 40px;
  height: 30px;
  border: 1px solid #20303e;
  border-radius: 5px;
  color: #f1f5f9;
  background: #071019;
  text-align: center;
  font: inherit;
}

.category-name-cell {
  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.category-row-icon {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid #243341;
  border-radius: 50%;
  color: #e6edf5;
  background: #0a141d;
  font-size: .94rem;
}

.category-row-icon .category-icon-image {
  width: 20px;
  height: 20px;
  object-fit: contain;
}

.category-row-icon .category-icon-glyph {
  line-height: 1;
}

.category-name-cell strong,
.category-description-cell {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.category-name-cell strong {
  color: #f8fafc;
  font-size: .79rem;
}

.category-description-cell {
  color: #a8b3c1;
}

.category-product-cell {
  color: #e7eef6;
  text-align: center;
}

.category-status-toggle {
  display: inline-flex;
  justify-self: start;
  cursor: pointer;
}

.category-status-toggle input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.category-status-toggle span {
  position: relative;
  display: block;
  width: 30px;
  height: 18px;
  border: 1px solid #58687a;
  border-radius: 999px;
  background: #1b2631;
  transition: background .18s ease, border-color .18s ease;
}

.category-status-toggle span::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #a8b3c1;
  transition: transform .18s ease, background .18s ease;
}

.category-status-toggle input:checked + span {
  border-color: #079de1;
  background: #079de1;
}

.category-status-toggle input:checked + span::after {
  background: #fff;
  transform: translateX(12px);
}

.category-row-actions {
  display: flex;
  justify-content: flex-end;
  gap: 5px;
}

.category-row-action {
  width: 30px;
  min-height: 30px;
  padding: 0;
}

.category-empty-state {
  display: grid;
  place-items: center;
  min-height: 280px;
  padding: 28px;
  color: #8796a8;
  text-align: center;
}

.customer-admin-layout {
  grid-template-columns: minmax(680px, 1fr) minmax(360px, 430px);
}

.customer-table-toolbar {
  grid-template-columns: minmax(240px, 1fr) 180px 38px;
}

.customer-table-head,
.customer-table-row {
  display: grid;
  grid-template-columns: minmax(180px, 1.2fr) minmax(190px, 1.15fr) minmax(110px, .75fr) 72px 110px 58px;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #14202b;
}

.customer-table-head {
  color: #7f8ea1;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(10, 18, 26, .6);
}

.customer-table-row {
  color: #c9d6e2;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease;
}

.customer-table-row:hover,
.customer-table-row.active {
  background: rgba(0, 200, 255, .055);
}

.customer-table-row.active {
  box-shadow: inset 2px 0 0 #00c8ff;
}

.customer-table-row strong,
.customer-table-row span,
.customer-table-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.customer-table-row strong {
  color: #f4f8fc;
}

.customer-table-row small {
  display: block;
  margin-top: 4px;
  color: #8294a7;
  font-size: .76rem;
}

.customer-detail-card {
  padding: 0;
}

.customer-detail-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 18px;
  border-bottom: 1px solid #14202b;
}

.customer-detail-header h4 {
  margin: 0;
  color: #fff;
  font-size: 1.05rem;
}

.customer-detail-header p {
  margin: 5px 0 0;
  color: #8fa1b4;
  font-size: .84rem;
}

.customer-detail-body {
  display: grid;
  gap: 18px;
  padding: 18px;
}

.customer-detail-body h5 {
  margin: 0 0 10px;
  color: #fff;
  font-size: .9rem;
}

.customer-detail-body p {
  margin: 4px 0;
  color: #a9b7c5;
  line-height: 1.5;
}

.customer-access-box {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #172430;
  border-radius: 8px;
  background: #050c12;
}

.customer-access-box label {
  display: grid;
  gap: 7px;
  color: #8fa1b4;
  font-size: .74rem;
  font-weight: 850;
  text-transform: uppercase;
}

.customer-access-box select {
  width: 100%;
  min-height: 38px;
  border: 1px solid #1d2a36;
  border-radius: 6px;
  padding: 0 12px;
  color: #f8fafc;
  background: #071019;
  font: inherit;
  font-size: .84rem;
  font-weight: 750;
}

.customer-access-box .category-primary-button {
  width: 100%;
}

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

.customer-detail-list dt {
  color: #75879a;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.customer-detail-list dd {
  margin: 4px 0 0;
  color: #edf5fb;
  font-weight: 800;
}

.customer-order-summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid #1c2935;
  border-radius: 8px;
  background: #050c12;
}

.customer-order-summary span {
  color: #9aaabd;
}

.customer-order-summary strong {
  color: #00c8ff;
}

.customer-order-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.customer-order-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  color: #cbd5e1;
  font-size: .82rem;
}

.customer-order-list em {
  font-style: normal;
  color: #00c8ff;
}

.order-admin-layout {
  grid-template-columns: minmax(740px, 1fr) minmax(380px, 430px);
}

.order-table-toolbar {
  grid-template-columns: minmax(260px, 1fr) 210px 38px;
}

.order-table-head,
.order-table-row {
  display: grid;
  grid-template-columns: minmax(130px, .75fr) minmax(190px, 1.2fr) minmax(130px, .8fr) 118px 110px 58px;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #14202b;
}

.order-table-head {
  color: #7f8ea1;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(10, 18, 26, .6);
}

.order-table-row {
  color: #c9d6e2;
  cursor: pointer;
  transition: background 160ms ease, border-color 160ms ease;
}

.order-table-row:hover,
.order-table-row.active {
  background: rgba(0, 200, 255, .055);
}

.order-table-row.active {
  box-shadow: inset 2px 0 0 #00c8ff;
}

.order-table-row strong,
.order-table-row span,
.order-table-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.order-table-row small {
  display: block;
  margin-top: 4px;
  color: #8294a7;
  font-size: .76rem;
}

.order-status-box input {
  width: 100%;
  min-height: 38px;
  border: 1px solid #1d2a36;
  border-radius: 6px;
  padding: 0 12px;
  color: #f8fafc;
  background: #071019;
  font: inherit;
  font-size: .84rem;
  font-weight: 750;
}

.order-email-toggle {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 10px;
  color: #cbd5e1 !important;
  text-transform: none !important;
}

.order-email-toggle input {
  width: 16px;
  min-height: 16px;
  padding: 0;
}

.order-payment-link {
  margin-top: 12px;
}

.order-items-list {
  display: grid;
  gap: 8px;
}

.order-items-list article {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border: 1px solid #1c2935;
  border-radius: 8px;
  background: #050c12;
}

.order-items-list strong,
.order-items-list small {
  display: block;
}

.order-items-list small {
  margin-top: 4px;
  color: #8fa1b4;
}

.order-items-list span {
  color: #00c8ff;
  font-weight: 900;
  white-space: nowrap;
}

.customer-detail-empty {
  min-height: 320px;
  display: grid;
  place-content: center;
  gap: 8px;
  padding: 24px;
  text-align: center;
  color: #8fa1b4;
}

.customer-detail-empty strong {
  color: #fff;
}

.user-admin-layout {
  grid-template-columns: minmax(720px, 1fr) minmax(360px, 430px);
}

.user-table-toolbar {
  grid-template-columns: minmax(240px, 1fr) 190px 38px;
}

.user-table-head,
.user-table-row {
  display: grid;
  grid-template-columns: minmax(220px, 1.25fr) minmax(190px, 1fr) 112px minmax(130px, .8fr) 78px;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-bottom: 1px solid #14202b;
}

.user-table-head {
  color: #7f8ea1;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(10, 18, 26, .6);
}

.user-table-row {
  color: #c9d6e2;
  cursor: pointer;
  transition: background 160ms ease, box-shadow 160ms ease;
}

.user-table-row:hover,
.user-table-row.active {
  background: rgba(0, 200, 255, .055);
}

.user-table-row.active {
  box-shadow: inset 2px 0 0 #00c8ff;
}

.user-table-row strong,
.user-table-row span,
.user-table-row small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-name-cell {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
}

.user-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #153243;
  border-radius: 8px;
  color: #00c8ff;
  background: linear-gradient(135deg, rgba(0, 200, 255, .11), rgba(7, 16, 25, .92));
  font-weight: 900;
}

.user-name-cell strong {
  display: block;
  color: #f4f8fc;
}

.user-name-cell small {
  display: block;
  margin-top: 4px;
  color: #8294a7;
  font-size: .76rem;
}

.category-row-action.danger {
  border-color: rgba(244, 63, 94, .44);
  color: #fb7185;
}

.category-row-action.danger:hover {
  border-color: #fb7185;
  color: #fff;
  background: rgba(244, 63, 94, .12);
}

.user-detail-card {
  padding: 0;
}

.user-detail-header {
  align-items: center;
}

.user-editor-form {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.user-editor-form label {
  display: grid;
  gap: 7px;
  color: #8fa1b4;
  font-size: .74rem;
  font-weight: 850;
  text-transform: uppercase;
}

.user-editor-form input,
.user-editor-form select {
  width: 100%;
  min-height: 40px;
  border: 1px solid #1d2a36;
  border-radius: 6px;
  padding: 0 12px;
  color: #f8fafc;
  background: #071019;
  font: inherit;
  font-size: .84rem;
  font-weight: 750;
}

.user-editor-form input:focus,
.user-editor-form select:focus {
  outline: 0;
  border-color: #079de1;
  box-shadow: 0 0 0 2px rgba(7, 157, 225, .12);
}

.user-permission-box {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 14px;
  margin: 0;
  border: 1px solid #172430;
  border-radius: 8px;
  padding: 16px 14px 14px;
  background: #050c12;
}

.user-permission-box legend {
  padding: 0 8px;
  color: #00c8ff;
  font-size: .82rem;
  font-weight: 900;
}

.user-permission-box label {
  display: flex;
  grid-template-columns: none;
  align-items: center;
  gap: 9px;
  color: #cbd5e1;
  text-transform: none;
}

.user-permission-box input {
  width: 16px;
  min-height: 16px;
  accent-color: #00c8ff;
}

.user-editor-footer {
  justify-content: flex-end;
  padding-top: 4px;
}

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

.utility-card {
  min-height: 190px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 14px;
  padding: 18px;
  border: 1px solid #172430;
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(13,20,29,.92), rgba(5,8,12,.86));
  box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.utility-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0, 200, 255, .28);
  border-radius: 8px;
  color: #00c8ff;
  background: rgba(0, 200, 255, .08);
}

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

.utility-card small {
  color: #00c8ff;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.utility-card h4 {
  margin: 5px 0 8px;
  color: #fff;
}

.utility-card strong {
  display: block;
  color: #edf5fb;
  font-size: 1.15rem;
}

.utility-card p {
  margin: 8px 0 14px;
  color: #94a5b8;
  line-height: 1.5;
}

@media (max-width: 1180px) {
  .customer-admin-layout,
  .order-admin-layout,
  .utility-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .customer-table-head,
  .order-table-head,
  .user-table-head {
    display: none;
  }

  .customer-table-row,
  .order-table-row,
  .user-table-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .customer-table-toolbar,
  .order-table-toolbar,
  .user-table-toolbar,
  .user-permission-box,
  .customer-detail-list {
    grid-template-columns: 1fr;
  }
}

.category-table-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 56px;
  padding: 10px 14px;
  border-top: 1px solid #14202b;
  color: #8796a8;
  font-size: .72rem;
}

.category-pagination,
.category-pagination > span {
  display: flex;
  align-items: center;
  gap: 6px;
}

.category-pagination button,
.category-pagination span button {
  width: 30px;
  min-height: 30px;
  padding: 0;
}

.category-pagination span button.active {
  border-color: #079de1;
  color: #fff;
  background: rgba(7, 157, 225, .18);
}

.category-pagination button:disabled {
  opacity: .38;
  cursor: default;
}

.category-editor-column {
  position: sticky;
  top: 80px;
}

.category-editor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 12px 16px;
}

.category-editor-header h4 {
  margin: 0;
  color: #f8fafc;
  font-size: 1rem;
}

.category-delete-button {
  min-height: 32px;
  border-color: rgba(239, 68, 68, .35);
  color: #ff5b68;
  background: rgba(127, 29, 29, .08);
}

.category-delete-button:hover {
  border-color: rgba(239, 68, 68, .65);
  background: rgba(127, 29, 29, .18);
}

.category-delete-button.hidden {
  display: none;
}

.category-editor-tabs {
  display: flex;
  align-items: center;
  gap: 26px;
  min-width: 0;
  margin: 0 16px;
  border-bottom: 1px solid #1a2733;
  overflow-x: auto;
  overflow-y: hidden;
}

.category-editor-tabs button {
  position: relative;
  flex: 0 0 auto;
  min-height: 44px;
  border: 0;
  padding: 0 1px;
  color: #9ba8b8;
  background: transparent;
  font: inherit;
  font-size: .76rem;
  cursor: pointer;
}

.category-editor-tabs button::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: transparent;
}

.category-editor-tabs button.active {
  color: #fff;
}

.category-editor-tabs button.active::after {
  background: #00baf2;
}

.category-editor-body {
  min-height: 388px;
  padding: 18px 16px;
}

.category-editor-pane {
  display: none;
  gap: 14px;
}

.category-editor-pane.active {
  display: grid;
}

.category-editor-body label {
  display: grid;
  gap: 7px;
  color: #b3bfcd;
  font-size: .72rem;
  font-weight: 700;
}

.category-editor-body input,
.category-editor-body select,
.category-editor-body textarea {
  width: 100%;
  min-height: 38px;
  border: 1px solid #1d2b37;
  border-radius: 6px;
  color: #edf3f8;
  background: #050c12;
  padding: 9px 10px;
  font: inherit;
  font-size: .76rem;
}

.category-editor-body textarea {
  resize: vertical;
  line-height: 1.45;
}

.category-editor-body select[multiple] {
  min-height: 190px;
}

.category-editor-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px;
}

.category-editor-body label small,
.category-field-help {
  margin: -2px 0 0;
  color: #78889a;
  font-size: .68rem;
  font-weight: 500;
}

.category-image-upload {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  min-height: 76px;
  border: 1px dashed #304253;
  border-radius: 6px;
  color: #00baf2 !important;
  background: #061018;
  cursor: pointer;
}

.category-image-upload svg {
  width: 18px;
  height: 18px;
}

.category-image-upload input {
  display: none;
}

.category-asset-section {
  display: grid;
  gap: 10px;
  padding-top: 14px;
  border-top: 1px solid #172430;
}

.category-asset-section:first-of-type {
  padding-top: 0;
  border-top: 0;
}

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

.category-asset-heading > div {
  min-width: 0;
}

.category-asset-heading strong,
.category-asset-heading small {
  display: block;
}

.category-asset-heading strong {
  color: #dce5ee;
  font-size: .73rem;
}

.category-asset-heading small {
  margin-top: 4px;
  color: #718396;
  font-size: .64rem;
}

.category-remove-asset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 30px;
  border: 1px solid #253441;
  border-radius: 6px;
  padding: 0 9px;
  color: #91a1b2;
  background: #071019;
  font: inherit;
  font-size: .67rem;
  font-weight: 700;
  cursor: pointer;
}

.category-remove-asset:hover {
  border-color: rgba(239, 68, 68, .5);
  color: #ff6b78;
}

.category-remove-asset:disabled {
  opacity: .4;
  cursor: default;
}

.category-remove-asset svg {
  width: 14px;
  height: 14px;
}

.category-icon-preview {
  display: grid;
  place-items: center;
  min-height: 86px;
  overflow: hidden;
  border: 1px solid #1d2b37;
  border-radius: 6px;
  color: #00baf2;
  background: radial-gradient(circle at center, rgba(0, 186, 242, .1), #050c12 68%);
}

.category-icon-preview .category-icon-image {
  width: 56px;
  height: 56px;
  object-fit: contain;
}

.category-icon-preview .category-icon-glyph {
  font-size: 1.8rem;
  line-height: 1;
}

.category-image-preview {
  display: grid;
  place-items: center;
  min-height: 145px;
  border: 1px solid #1d2b37;
  border-radius: 6px;
  color: #79899a;
  background: #050c12;
  overflow: hidden;
}

.category-image-preview img {
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.category-image-placeholder {
  display: grid;
  justify-items: center;
  gap: 9px;
  color: #708194;
  font-size: .68rem;
}

.category-image-placeholder .category-icon-image {
  width: 48px;
  height: 48px;
  object-fit: contain;
}

.category-image-placeholder .category-icon-glyph {
  color: #00baf2;
  font-size: 1.7rem;
  line-height: 1;
}

.category-editor-pane .category-admin-preview {
  grid-template-columns: 72px minmax(0, 1fr);
  min-height: 98px;
}

.category-editor-pane .category-preview-icon {
  width: 72px;
  height: 64px;
}

.category-preview-icon .category-icon-image {
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.category-preview-icon .category-icon-glyph {
  line-height: 1;
}

.category-editor-meta {
  border-top: 1px solid #172430;
}

.category-product-count {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin: 14px 16px;
  padding: 11px;
  border: 1px solid #172430;
  border-radius: 6px;
  background: #050c12;
}

.category-product-count > span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  color: #00baf2;
  background: rgba(7, 157, 225, .12);
}

.category-product-count svg {
  width: 19px;
  height: 19px;
}

.category-product-count p {
  margin: 0;
  color: #a9b5c3;
  font-size: .72rem;
}

.category-product-count strong {
  display: block;
  margin-top: 4px;
  color: #fff;
  font-size: 1.05rem;
}

.category-editor-meta dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 0 16px;
  padding: 14px 0;
  border-top: 1px solid #172430;
}

.category-editor-meta dl div {
  min-width: 0;
}

.category-editor-meta dt {
  color: #7f8fa1;
  font-size: .68rem;
}

.category-editor-meta dd {
  margin: 5px 0 0;
  color: #cbd5e1;
  font-size: .7rem;
}

.category-editor-footer {
  justify-content: flex-end;
  padding: 14px 16px;
  border-top: 1px solid #172430;
}

.category-editor-footer .category-primary-button {
  min-width: 150px;
}

.category-table-row.dragging {
  opacity: .42;
}

.category-table-row.drag-over {
  box-shadow: inset 0 2px 0 #079de1;
}

@media (max-width: 1320px) {
  .category-admin-layout {
    grid-template-columns: minmax(560px, 1fr) 390px;
  }

  .category-table-head,
  .category-table-row {
    grid-template-columns: 86px minmax(130px, 1fr) minmax(145px, 1fr) 58px 58px 68px;
  }
}

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

  .category-editor-column {
    position: static;
  }
}

@media (max-width: 900px) {
  body[data-page="admin"] .admin-topbar {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  body[data-page="admin"] .admin-topbar > .brand {
    grid-column: 2;
    border-right: 0;
  }

  body[data-page="admin"] .admin-topbar > .admin-menu-button {
    grid-column: 1;
  }

  body[data-page="admin"] .admin-topbar > .main-nav {
    display: none;
  }

  body[data-page="admin"] .admin-shell {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .admin-sidebar {
    position: fixed;
    z-index: 40;
    top: 60px;
    bottom: 0;
    left: 0;
    display: none;
    width: min(280px, 86vw);
    min-height: 0;
    border-right: 1px solid #1f2a35;
    border-bottom: 0;
    overflow-y: auto;
    box-shadow: 18px 0 50px rgba(0, 0, 0, .48);
  }

  body[data-page="admin"] .admin-shell.sidebar-open .admin-sidebar {
    display: block;
  }

  body[data-page="admin"] .admin-workspace {
    width: 100%;
    min-width: 0;
    padding: 18px 14px 32px;
  }

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

  .category-stat:nth-child(3) {
    border-left: 0;
    border-top: 1px solid #172430;
  }

  .category-stat:nth-child(4) {
    border-top: 1px solid #172430;
  }
}

@media (max-width: 680px) {
  .category-page-heading,
  .category-table-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .category-page-actions,
  .category-page-actions button {
    flex: 1;
  }

  .category-table-toolbar {
    grid-template-columns: minmax(0, 1fr) 38px;
  }

  .category-table-toolbar select {
    grid-column: 1;
  }

  .category-filter-button {
    grid-column: 2;
    grid-row: 2;
    width: 38px;
    padding: 0;
    font-size: 0;
  }

  .category-editor-header,
  .category-editor-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .category-delete-button,
  .category-editor-footer button {
    width: 100%;
  }

  .category-editor-tabs {
    gap: 18px;
  }

  .category-editor-grid,
  .category-editor-meta dl {
    grid-template-columns: 1fr;
  }
}

/* Brand administration */
.brand-admin-panel,
.brand-admin-panel * {
  letter-spacing: 0;
}

.brand-admin-layout {
  grid-template-columns: minmax(610px, 1fr) minmax(380px, 430px);
}

.brand-table-head,
.brand-table-row {
  grid-template-columns: 92px minmax(170px, 1.15fr) minmax(165px, 1fr) 64px 62px 72px;
  min-width: 700px;
}

.brand-table-row {
  min-height: 72px;
}

.brand-name-cell {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
}

.brand-row-logo {
  display: grid;
  place-items: center;
  width: 54px;
  height: 38px;
  overflow: hidden;
  border: 1px solid #263746;
  border-radius: 5px;
  color: #00c8ff;
  background: radial-gradient(circle at center, rgba(0, 200, 255, .1), #050c12 72%);
  font-size: .72rem;
  font-weight: 900;
}

.brand-row-logo img {
  width: 100%;
  height: 100%;
  padding: 7px;
  object-fit: contain;
}

.brand-name-copy,
.brand-destination-cell {
  min-width: 0;
}

.brand-name-copy strong,
.brand-name-copy small,
.brand-destination-cell a,
.brand-destination-cell small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-name-copy strong {
  color: #f8fafc;
  font-size: .79rem;
}

.brand-name-copy small,
.brand-destination-cell small {
  margin-top: 4px;
  color: #748599;
  font-size: .66rem;
}

.brand-destination-cell a {
  color: #00baf2;
  font-size: .72rem;
  font-weight: 750;
}

.brand-destination-cell a:hover {
  color: #75ddff;
}

.brand-product-cell {
  color: #e7eef6;
  text-align: center;
}

.brand-sync-status {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #6f8396;
}

.brand-sync-status svg {
  width: 15px;
  height: 15px;
  color: #10d6a0;
}

.brand-editor-body {
  min-height: 390px;
}

.brand-editor-tabs {
  overflow: hidden;
}

.brand-destination-summary {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  margin-top: 4px;
  padding: 11px;
  border: 1px solid #172430;
  border-radius: 6px;
  background: #050c12;
}

.brand-destination-summary > span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 6px;
  color: #00baf2;
  background: rgba(7, 157, 225, .12);
}

.brand-destination-summary svg {
  width: 19px;
  height: 19px;
}

.brand-destination-summary p {
  min-width: 0;
  margin: 0;
  color: #8999aa;
  font-size: .69rem;
}

.brand-destination-summary strong {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: #e9f1f7;
  font-size: .72rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-logo-upload {
  display: flex !important;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  min-height: 76px;
  border: 1px dashed #304253;
  border-radius: 6px;
  color: #00baf2 !important;
  background: #061018;
  cursor: pointer;
}

.category-image-upload:hover {
  border-color: #079de1;
  background: rgba(7, 157, 225, .06);
}

.category-image-upload > span,
.brand-logo-upload > span {
  display: grid;
  gap: 4px;
  justify-items: center;
}

.category-image-upload small,
.brand-logo-upload small {
  color: #718396;
  font-size: .64rem;
  font-weight: 600;
}

.brand-logo-upload:hover {
  border-color: #079de1;
  background: rgba(7, 157, 225, .06);
}

.brand-logo-upload svg {
  width: 18px;
  height: 18px;
}

.brand-logo-upload input {
  display: none;
}

.brand-editor-pane .brand-admin-preview {
  grid-template-columns: 112px minmax(0, 1fr);
  min-height: 132px;
  border-radius: 6px;
  background: #050c12;
}

.brand-editor-pane .brand-preview-logo {
  width: 112px;
  height: 82px;
  border-radius: 6px;
}

.brand-editor-pane .brand-preview-logo img {
  max-width: 94px;
  max-height: 60px;
}

.brand-preview-copy {
  min-width: 0;
}

.brand-preview-copy strong,
.brand-preview-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
}

.brand-preview-copy a {
  display: block;
  margin-top: 5px;
  overflow: hidden;
  color: #00baf2;
  font-size: .69rem;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-remove-logo {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 7px;
  min-height: 32px;
  border: 1px solid #253441;
  border-radius: 6px;
  padding: 0 11px;
  color: #9aabbc;
  background: #071019;
  font: inherit;
  font-size: .7rem;
  font-weight: 700;
  cursor: pointer;
}

.brand-remove-logo:hover {
  border-color: #43566a;
  color: #fff;
}

.brand-remove-logo:disabled {
  opacity: .42;
  cursor: default;
}

.brand-remove-logo svg {
  width: 15px;
  height: 15px;
}

.brand-category-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 12px;
  border: 1px solid #172430;
  border-radius: 6px;
  background: #050c12;
}

.brand-category-heading strong,
.brand-category-heading small {
  display: block;
}

.brand-category-heading strong {
  color: #fff;
  font-size: .82rem;
}

.brand-category-heading small {
  margin-top: 4px;
  color: #8898aa;
  font-size: .68rem;
}

.brand-category-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.brand-category-actions .category-secondary-button {
  min-height: 34px;
  padding-inline: 12px;
  font-size: .68rem;
}

.brand-category-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.brand-category-option {
  position: relative;
  display: flex !important;
  align-items: center;
  gap: 9px;
  min-height: 46px;
  border: 1px solid #172838;
  border-radius: 6px;
  padding: 9px 10px;
  color: #cfdae5 !important;
  background: #071019;
  cursor: pointer;
}

.brand-category-option:hover {
  border-color: #1f79a5;
  background: rgba(7, 157, 225, .07);
}

.brand-category-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.brand-category-check {
  display: grid;
  flex: 0 0 24px;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid #244057;
  border-radius: 6px;
  color: transparent;
  background: #050c12;
}

.brand-category-option input:checked + .brand-category-check {
  border-color: #00baf2;
  color: #00121a;
  background: #00baf2;
}

.brand-category-option input:checked ~ span:last-child {
  color: #fff;
}

.brand-category-option span:last-child {
  min-width: 0;
  overflow: hidden;
  font-size: .75rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-table-row.dragging {
  opacity: .42;
}

.brand-table-row.drag-over {
  box-shadow: inset 0 2px 0 #079de1;
}

@media (max-width: 1320px) {
  .brand-admin-layout {
    grid-template-columns: minmax(540px, 1fr) 380px;
  }

  .brand-table-head,
  .brand-table-row {
    grid-template-columns: 86px minmax(155px, 1.1fr) minmax(145px, 1fr) 60px 58px 68px;
  }
}

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

@media (max-width: 680px) {
  .brand-sync-status {
    justify-content: flex-end;
  }

  .brand-editor-pane .brand-admin-preview {
    grid-template-columns: 1fr;
  }

  .brand-editor-pane .brand-preview-logo {
    width: 100%;
  }

  .brand-category-heading {
    grid-template-columns: 1fr;
  }

  .brand-category-actions {
    justify-content: stretch;
  }

  .brand-category-actions .category-secondary-button {
    flex: 1;
  }

  .brand-category-options {
    grid-template-columns: 1fr;
  }

  .brand-remove-logo {
    width: 100%;
  }
}
/* Premium storefront home */
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
body[data-page="store"] { background: #05080c; color: #f4f8fc; }
body[data-page="store"]::before { display: none; }
body[data-page="about"] { background: #05080c; color: #f4f8fc; }
body[data-page="about"]::before { display: none; }
body[data-page="store"] .home-site-header { position: absolute; inset: 0 0 auto; z-index: 40; grid-template-columns: auto auto minmax(0, 1fr) auto auto; min-height: 68px; padding: 0 max(24px, 4vw); border-bottom-color: rgba(31, 42, 53, .72); background: rgba(2, 5, 8, .78); box-shadow: none; backdrop-filter: blur(16px); }
body[data-page="about"] .home-site-header { position: absolute; inset: 0 0 auto; z-index: 40; grid-template-columns: auto auto minmax(0, 1fr) auto auto; min-height: 68px; padding: 0 max(24px, 4vw); border-bottom-color: rgba(31, 42, 53, .72); background: rgba(2, 5, 8, .78); box-shadow: none; backdrop-filter: blur(16px); }
body[data-page="store"] .home-site-header .premium-brand { min-width: 190px; }
body[data-page="about"] .home-site-header .premium-brand { min-width: 190px; }
body[data-page="store"] .home-site-header .brand-logo { width: 42px; height: 42px; border-radius: 8px; }
body[data-page="about"] .home-site-header .brand-logo { width: 42px; height: 42px; border-radius: 8px; }
body[data-page="store"] .home-site-header .premium-nav { justify-self: center; gap: 26px; }
body[data-page="about"] .home-site-header .premium-nav { justify-self: center; gap: 26px; }
body[data-page="store"] .home-site-header .premium-nav a,
body[data-page="store"] .home-site-header .premium-nav button { color: #c9d4de; font-size: .76rem; }
body[data-page="about"] .home-site-header .premium-nav a,
body[data-page="about"] .home-site-header .premium-nav button { color: #c9d4de; font-size: .76rem; }
body[data-page="store"] .home-site-header .premium-nav a:hover,
body[data-page="store"] .home-site-header .premium-nav button:hover { color: #00c8ff; }
body[data-page="about"] .home-site-header .premium-nav a:hover,
body[data-page="about"] .home-site-header .premium-nav button:hover { color: #00c8ff; }
body[data-page="store"] .home-site-header .premium-nav .offer-link,
body[data-page="store"] .mobile-nav-drawer .offer-link { color: #ff3158; }
body[data-page="about"] .home-site-header .premium-nav .offer-link,
body[data-page="about"] .mobile-nav-drawer .offer-link { color: #c9d4de; }
body[data-page="store"] .home-site-header .premium-nav .offer-link:hover,
body[data-page="store"] .mobile-nav-drawer .offer-link:hover { color: #ff6a84; }
body[data-page="about"] .home-site-header .premium-nav .offer-link:hover,
body[data-page="about"] .mobile-nav-drawer .offer-link:hover { color: #00c8ff; }
body[data-page="store"] .home-site-header .premium-nav .offer-link::after { background: #ff3158; }
body[data-page="about"] .home-site-header .premium-nav .offer-link::after { background: #00c8ff; }
body[data-page="store"] .home-header-search { grid-template-columns: 0 38px; width: 40px; min-height: 40px; border-color: transparent; background: transparent; transition: width 180ms ease, grid-template-columns 180ms ease, border-color 180ms ease; }
body[data-page="store"] .home-header-search:focus-within { width: 210px; grid-template-columns: minmax(0, 1fr) 38px; border-color: #1f2a35; background: #0b1118; }
body[data-page="store"] .home-header-search input { width: 0; padding: 0; opacity: 0; transition: opacity 160ms ease; }
body[data-page="store"] .home-header-search:focus-within input { width: auto; padding: 0 10px; opacity: 1; }
body[data-page="store"] .header-icon-button,
body[data-page="store"] .header-cart { border-color: transparent; background: transparent; }
body[data-page="about"] .header-icon-button,
body[data-page="about"] .header-cart { border-color: transparent; background: transparent; }

.home-page { overflow: hidden; background: #05080c; }
.home-hero { position: relative; min-height: 620px; height: 76vh; max-height: 780px; display: grid; align-items: center; overflow: hidden; border-bottom: 1px solid #1f2a35; }
.home-hero-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.home-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3, 6, 9, .98) 0%, rgba(3, 6, 9, .82) 29%, rgba(3, 6, 9, .15) 66%, rgba(3, 6, 9, .24) 100%), linear-gradient(0deg, rgba(3, 6, 9, .72), transparent 32%); }
.home-hero-content { position: relative; z-index: 2; width: min(1380px, 92%); margin: 48px auto 0; }
.home-kicker { margin: 0 0 18px; color: #00c8ff; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
.home-hero h1 { max-width: 680px; margin: 0; color: #fff; font-size: 64px; line-height: 1.03; letter-spacing: 0; }
.home-hero h1 span { color: #00c8ff; }
.home-hero-content > p:not(.home-kicker) { max-width: 460px; margin: 20px 0 0; color: #b7c3cf; font-size: 1rem; line-height: 1.6; }
.home-hero-actions { display: flex; gap: 12px; margin-top: 28px; }
.header-consulting-cta { display: grid; grid-template-columns: 30px minmax(0, 1fr) 12px; align-items: center; gap: 8px; min-width: 156px; height: 44px; padding: 6px 9px; border: 1px solid rgba(0, 200, 255, .34); border-radius: 7px; background: rgba(5, 13, 20, .8); box-shadow: inset 0 1px rgba(255, 255, 255, .04), 0 0 24px rgba(0, 200, 255, .06); color: #f5f9fc; text-decoration: none; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease, box-shadow 160ms ease; }
.header-consulting-cta:hover { border-color: #00c8ff; background: rgba(7, 20, 29, .96); box-shadow: inset 0 1px rgba(255, 255, 255, .05), 0 0 28px rgba(0, 200, 255, .13); transform: translateY(-2px); }
.header-consulting-icon { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #245065; border-radius: 6px; background: #07151d; color: #00c8ff; }
.header-consulting-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.fallback-lucide-icon { display: inline-grid; place-items: center; width: 1.15em; height: 1.15em; color: currentColor; line-height: 1; vertical-align: -0.16em; }
.fallback-lucide-icon svg,
.cart-icon,
.header-consulting-cta svg { display: block; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; }
.fallback-lucide-icon svg { width: 100%; height: 100%; stroke-width: 2; }
.cart-icon { width: 22px; height: 22px; stroke-width: 1.9; }
.header-consulting-cta small, .header-consulting-cta strong { display: block; letter-spacing: 0; white-space: nowrap; }
.header-consulting-cta small { margin-bottom: 2px; color: #00c8ff; font-size: .48rem; font-weight: 900; text-transform: uppercase; }
.header-consulting-cta strong { font-size: .68rem; line-height: 1.1; }
.header-consulting-arrow { width: 12px; fill: none; stroke: #8da1b1; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.home-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #273746; border-radius: 5px; padding: 0 22px; color: #f7fbff; font-size: .74rem; font-weight: 900; text-transform: uppercase; transition: background 160ms ease, border-color 160ms ease, transform 160ms ease; }
.home-button:hover { transform: translateY(-2px); }
.home-button-primary { border-color: #00aeea; background: #069fe3; box-shadow: 0 12px 30px rgba(0, 167, 226, .18); }
.home-button-primary:hover { background: #00b8f4; }
.home-button-secondary { background: rgba(7, 12, 18, .76); backdrop-filter: blur(10px); }
.home-button-secondary:hover { border-color: #00c8ff; color: #00c8ff; }

@media (max-width: 1250px) { .header-consulting-cta { display: none; } }

/* Consulting page */
.consulting-page { overflow: hidden; background: #05080c; }
.consulting-hero { position: relative; min-height: 690px; display: grid; align-items: center; overflow: hidden; border-bottom: 1px solid #172631; }
.consulting-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 62% center; }
.consulting-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3, 7, 10, .99) 0%, rgba(3, 7, 10, .9) 34%, rgba(3, 7, 10, .3) 69%, rgba(3, 7, 10, .18)), linear-gradient(0deg, rgba(3, 7, 10, .76), transparent 42%); }
.consulting-hero-content { position: relative; z-index: 2; width: min(1380px, 92%); margin: 54px auto 0; }
.consulting-hero h1 { max-width: 700px; margin: 0; color: #fff; font-size: clamp(3.5rem, 6.2vw, 6.4rem); line-height: .96; letter-spacing: 0; }
.consulting-hero h1 span { color: #00c8ff; }
.consulting-hero-content > p:not(.home-kicker) { max-width: 570px; margin: 24px 0 0; color: #aebdca; font-size: 1rem; line-height: 1.72; }
.consulting-hero-actions { display: flex; gap: 12px; margin-top: 30px; }
.consulting-whatsapp-button { gap: 10px; }
.consulting-whatsapp-button svg { width: 18px; height: 18px; fill: currentColor; }
.consulting-section { width: min(1380px, 92%); margin: 0 auto; padding: 76px 0 0; }
.consulting-section-heading { max-width: 720px; }
.consulting-section-heading h2 { margin: 0; color: #f5f8fb; font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1.04; }
.consulting-section-heading > p:last-child { margin: 18px 0 0; color: #91a4b4; line-height: 1.7; }
.consulting-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 34px; }
.consulting-steps article, .consulting-analysis-grid article { min-height: 220px; border: 1px solid #1a2b37; border-radius: 7px; padding: 28px; background: linear-gradient(145deg, rgba(10, 20, 28, .96), rgba(6, 11, 16, .96)); box-shadow: inset 0 1px rgba(255, 255, 255, .025); }
.consulting-steps article > span { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #1e5269; border-radius: 6px; background: #071923; color: #00c8ff; font-size: .72rem; font-weight: 900; }
.consulting-steps h3, .consulting-analysis-grid h3 { margin: 28px 0 10px; color: #f0f5f8; font-size: 1rem; }
.consulting-steps p, .consulting-analysis-grid p { margin: 0; color: #8fa2b1; font-size: .82rem; line-height: 1.65; }
.consulting-analysis-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 34px; }
.consulting-analysis-grid article { min-height: 240px; }
.consulting-analysis-grid .home-benefit-icon { width: 48px; height: 48px; }
.consulting-analysis-grid h3 { margin-top: 24px; }
.consulting-final-cta { width: min(1380px, 92%); min-height: 230px; display: flex; align-items: center; justify-content: space-between; gap: 40px; margin: 76px auto; border: 1px solid #1c3e4d; border-radius: 8px; padding: 38px 42px; background: linear-gradient(110deg, rgba(0, 200, 255, .1), transparent 42%), #081018; }
.consulting-final-cta h2 { margin: 0; color: #fff; font-size: clamp(2rem, 4vw, 3.6rem); }
.consulting-final-cta p:last-child { max-width: 680px; margin: 14px 0 0; color: #93a7b7; line-height: 1.65; }
.consulting-final-cta > a { flex: 0 0 auto; min-width: 230px; }

@media (max-width: 900px) {
  .consulting-hero { min-height: 620px; }
  .consulting-hero > img { object-position: 68% center; opacity: .72; }
  .consulting-hero h1 { font-size: 3.2rem; }
  .consulting-steps, .consulting-analysis-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .consulting-final-cta { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 600px) {
  .consulting-hero { min-height: 650px; align-items: end; padding-bottom: 54px; }
  .consulting-hero > img { height: 58%; object-position: 64% 20%; }
  .consulting-hero-shade { background: linear-gradient(0deg, #05080c 25%, rgba(5, 8, 12, .78) 59%, rgba(5, 8, 12, .14)); }
  .consulting-hero-content { width: calc(100% - 32px); margin: 0 auto; }
  .consulting-hero h1 { font-size: 2.65rem; }
  .consulting-hero-content > p:not(.home-kicker) { font-size: .84rem; }
  .consulting-hero-actions { align-items: stretch; flex-direction: column; }
  .consulting-hero-actions .home-button { width: 100%; }
  .consulting-section { width: calc(100% - 32px); padding-top: 56px; }
  .consulting-section-heading h2 { font-size: 2rem; }
  .consulting-steps, .consulting-analysis-grid { grid-template-columns: 1fr; }
  .consulting-steps article, .consulting-analysis-grid article { min-height: 0; padding: 24px; }
  .consulting-final-cta { width: calc(100% - 32px); min-height: 0; margin: 56px auto; padding: 28px 22px; }
  .consulting-final-cta > a { width: 100%; min-width: 0; }
}

.home-band { padding: 28px max(24px, 4vw); border-bottom: 1px solid #16232d; background: #060b10; }
.home-section { width: min(1380px, 92%); margin: 0 auto; padding: 52px 0 0; }
.home-section-heading { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; }
.home-section-heading h2 { margin: 0; color: #eaf0f5; font-size: .86rem; font-weight: 900; text-transform: uppercase; }
.home-section-heading > a { min-height: 36px; display: inline-flex; align-items: center; border: 1px solid #25333f; border-radius: 4px; padding: 0 14px; color: #aab6c2; font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.home-section-heading > a:hover { border-color: #00c8ff; color: #00c8ff; }
.home-brands .home-section-heading,
.home-brand-row { width: min(1380px, 92%); margin-left: auto; margin-right: auto; }
.home-brand-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px; align-items: center; min-height: 76px; }
.home-brand-row a { min-width: 0; height: 60px; display: grid; place-items: center; color: #c8d1da; filter: grayscale(1); opacity: .82; transition: filter 160ms ease, opacity 160ms ease, color 160ms ease; }
.home-brand-row a:hover { filter: grayscale(0); opacity: 1; color: #fff; }
.home-brand-row img { max-width: 170px; max-height: 42px; object-fit: contain; }
.home-brand-row strong { overflow: hidden; font-size: 1.15rem; letter-spacing: 0; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; }
.home-brand-fallback { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; align-items: center; max-width: 100%; }
.home-brand-fallback > span { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #29404d; border-radius: 5px; color: #00c8ff; background: #071019; font-size: .68rem; font-weight: 900; }
.home-brand-fallback strong { min-width: 0; font-size: .86rem; }
.home-empty-state { grid-column: 1 / -1; margin: 0; color: #7f8d9b; font-size: .8rem; }

.home-category-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.home-category-card { min-width: 0; overflow: hidden; border: 1px solid #1f2a35; border-radius: 6px; background: #0b1118; transition: border-color 160ms ease, background 160ms ease, transform 160ms ease; }
.home-category-card:hover { border-color: #00aee8; background: #101923; transform: translateY(-3px); }
.home-category-media { height: 210px; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 55%, rgba(0, 200, 255, .12), transparent 52%), #070c11; }
.home-category-media img { width: 100%; height: 100%; padding: 18px; object-fit: contain; filter: drop-shadow(0 18px 24px rgba(0, 0, 0, .5)); transition: transform 180ms ease; }
.home-category-card:hover img { transform: scale(1.04); }
.home-category-media > span { color: #00c8ff; font-size: 2.2rem; opacity: .7; }
.home-category-media > span .category-icon-image { width: 64px; height: 64px; object-fit: contain; }
.home-category-card h3 { min-height: 34px; display: flex; align-items: center; gap: 9px; margin: 12px 14px 6px; color: #f2f6f9; font-size: .88rem; text-transform: uppercase; }
.home-category-icon { flex: 0 0 auto; width: 28px; height: 28px; display: grid; place-items: center; overflow: hidden; border: 1px solid #233642; border-radius: 5px; color: #00c8ff; background: #071019; }
.home-category-icon .category-icon-image { width: 19px; height: 19px; object-fit: contain; }
.home-category-icon .category-icon-glyph { line-height: 1; }
.home-category-card small { display: block; margin: 0 14px 15px; color: #8da0af; font-size: .66rem; font-weight: 800; text-transform: uppercase; }
.home-category-card small b { color: #00c8ff; }

.home-promotions { position: relative; }
.home-promotion-heading { display: grid; justify-items: center; margin-bottom: 24px; text-align: center; }
.home-promotion-heading .home-kicker { margin: 0 0 7px; }
.home-promotion-heading h2 { margin: 0; color: #f5f9fc; font-size: clamp(1.8rem, 3vw, 2.7rem); line-height: 1.05; text-transform: uppercase; }
.home-promotion-heading > p:last-child { margin: 10px 0 0; color: #8fa0ad; font-size: .78rem; line-height: 1.5; }
.home-promotion-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 320px)); justify-content: center; gap: 12px; }
.home-promotion-card { position: relative; min-width: 0; display: grid; grid-template-rows: 220px minmax(0, 1fr); overflow: hidden; border: 1px solid #1e303c; border-radius: 7px; background: #0a1118; color: inherit; transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.home-promotion-card:hover { border-color: #00bce9; box-shadow: 0 18px 42px rgba(0, 0, 0, .32), inset 0 0 24px rgba(0, 200, 255, .025); transform: translateY(-3px); }
.home-promotion-badge { position: absolute; z-index: 2; top: 12px; left: 12px; min-height: 27px; display: inline-flex; align-items: center; border: 1px solid rgba(101, 226, 255, .36); border-radius: 4px; padding: 0 9px; background: #00b7e8; color: #001018; font-size: .66rem; font-weight: 950; text-transform: uppercase; }
.home-promotion-media { min-width: 0; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at 50% 56%, rgba(0, 200, 255, .11), transparent 54%), #060c11; }
.home-promotion-media img { width: 100%; height: 100%; padding: 15px; object-fit: contain; filter: drop-shadow(0 18px 26px rgba(0, 0, 0, .56)); transition: transform 180ms ease; }
.home-promotion-card:hover .home-promotion-media img { transform: scale(1.035); }
.home-promotion-placeholder { color: #758491; font-size: .72rem; }
.home-promotion-copy { min-width: 0; display: grid; align-content: start; padding: 16px; }
.home-promotion-copy > small { color: #00c8ff; font-size: .62rem; font-weight: 900; text-transform: uppercase; }
.home-promotion-name { min-height: 42px; display: -webkit-box; overflow: hidden; margin-top: 7px; color: #eef5f9; font-size: .88rem; line-height: 1.38; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.home-promotion-prices { display: grid; gap: 3px; margin-top: 14px; }
.home-promotion-prices del { color: #748492; font-size: .7rem; }
.home-promotion-prices b { color: #00c8ff; font-size: 1.05rem; line-height: 1.2; }
.home-promotion-button { min-height: 41px; display: inline-flex; align-items: center; justify-content: center; margin-top: 14px; border: 1px solid #00aee2; border-radius: 5px; padding: 0 14px; background: rgba(0, 181, 231, .08); color: #e9f9ff; font-size: .68rem; font-weight: 950; text-transform: uppercase; transition: background 160ms ease, color 160ms ease; }
.home-promotion-card:hover .home-promotion-button { background: #00b8eb; color: #001018; }
.home-promotion-benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 24px; border-top: 1px solid #1a2c37; border-bottom: 1px solid #1a2c37; }
.home-promotion-benefits article { min-width: 0; min-height: 88px; display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; align-items: center; border-right: 1px solid #1a2c37; padding: 16px 20px; }
.home-promotion-benefits article:last-child { border-right: 0; }
.home-promotion-benefits .home-benefit-icon { width: 42px; height: 42px; }
.home-promotion-benefits .home-benefit-icon svg { width: 29px; height: 29px; }
.home-promotion-benefits article div { min-width: 0; display: grid; gap: 3px; }
.home-promotion-benefits strong { color: #eef5f9; font-size: .72rem; line-height: 1.25; text-transform: uppercase; }
.home-promotion-benefits small { color: #8494a1; font-size: .65rem; line-height: 1.35; }
.home-promotion-cta { display: flex; justify-content: center; margin-top: 24px; }
.home-promotion-cta .home-button { min-width: 250px; }

@media (min-width: 761px) {
  .home-promotion-grid:has(> .home-promotion-card:only-child) { grid-template-columns: minmax(0, 320px); }
  .home-promotion-grid:has(> .home-promotion-card:nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 320px)); }
}

@media (min-width: 1181px) {
  .home-promotion-grid:has(> .home-promotion-card:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 320px)); }
}

.home-product-rail-wrap { position: relative; }
.home-product-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); grid-template-rows: 1fr; gap: 12px; overflow-x: auto; padding: 1px 1px 8px; scrollbar-width: none; scroll-snap-type: x proximity; }
.home-product-rail::-webkit-scrollbar { display: none; }
.home-product-card { position: relative; min-height: 390px; display: grid; grid-template-rows: 220px minmax(0, 1fr); overflow: hidden; border: 1px solid #1f2a35; border-radius: 6px; background: #0b1118; scroll-snap-align: start; transition: border-color 160ms ease, transform 160ms ease; }
.home-product-card:hover { border-color: #00aee8; transform: translateY(-2px); }
.home-product-rank { position: absolute; top: 10px; left: 10px; z-index: 2; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 5px; background: #00aee8; color: #001119; font-size: .65rem; font-weight: 900; }
.home-product-media { display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at center, rgba(0, 200, 255, .11), transparent 55%), #070c11; }
.home-product-media img { width: 100%; height: 100%; padding: 18px; object-fit: contain; filter: drop-shadow(0 18px 24px rgba(0,0,0,.52)); }
.home-product-media > span { color: #687887; font-size: .7rem; }
.home-product-info { position: relative; display: grid; align-content: end; padding: 16px 52px 16px 16px; }
.home-product-info > small { color: #00c8ff; font-size: .62rem; font-weight: 900; text-transform: uppercase; }
.home-product-info h3 { min-height: 40px; margin: 6px 0 12px; color: #edf3f8; font-size: .82rem; line-height: 1.35; }
.home-product-info strong { color: #fff; font-size: .92rem; }
.home-product-info .catalog-pix-price { margin-top: 3px; font-size: .72rem; }
.home-product-info p { margin: 4px 0 0; color: #00bdea; font-size: .66rem; }
.home-product-info button { position: absolute; right: 14px; bottom: 16px; width: 34px; height: 34px; border: 1px solid #29404e; border-radius: 4px; background: #091119; color: #00c8ff; cursor: pointer; font-size: 1.1rem; }
.home-product-info button:hover { border-color: #00c8ff; background: #101923; }
.home-rail-arrow { position: absolute; top: 45%; z-index: 3; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #293946; border-radius: 50%; background: rgba(7, 13, 19, .92); color: #dfe8ef; cursor: pointer; font-size: 1.4rem; }
.home-rail-arrow:hover { border-color: #00c8ff; color: #00c8ff; }
.home-rail-prev { left: -17px; }.home-rail-next { right: -17px; }

.home-setup-card { min-height: 260px; display: grid; grid-template-columns: minmax(220px, .78fr) minmax(480px, 2fr) minmax(190px, .65fr); gap: 24px; align-items: center; padding: 30px; border: 1px solid #1f2a35; border-radius: 7px; background: radial-gradient(circle at 55% 35%, rgba(0, 200, 255, .08), transparent 35%), #081018; }
.home-setup-copy h2 { margin: 0; color: #fff; font-size: 1.65rem; line-height: 1.08; }.home-setup-copy h2 span { color: #00c8ff; }.home-setup-copy p { max-width: 260px; margin: 14px 0 20px; color: #9eacba; font-size: .75rem; line-height: 1.55; }
.home-setup-products { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; align-items: center; gap: 12px; }
.home-setup-product { position: relative; min-width: 0; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 10px; }.home-setup-product > b { color: #00c8ff; font-size: 1.1rem; }.home-setup-product a { min-width: 0; display: grid; justify-items: center; gap: 10px; }.home-setup-product img, .home-setup-product i { width: 100%; max-width: 170px; height: 120px; object-fit: contain; filter: drop-shadow(0 16px 24px rgba(0,0,0,.5)); }.home-setup-product small { color: #c4ced7; font-size: .62rem; font-weight: 800; text-align: center; text-transform: uppercase; }
.home-setup-total { display: flex; align-items: center; justify-content: center; gap: 18px; }.home-setup-total > span { color: #6f8190; font-size: 1.4rem; }.home-setup-total div { display: grid; }.home-setup-total small { color: #8c9aa8; font-size: .65rem; font-weight: 900; text-transform: uppercase; }.home-setup-total strong { margin-top: 4px; color: #00c8ff; font-size: 1.45rem; }.home-setup-total p { margin: 5px 0 0; color: #8d9aa7; font-size: .68rem; }

.home-benefit-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.home-benefit-grid article { min-height: 190px; padding: 24px 20px; border: 1px solid #1f2a35; border-radius: 6px; background: #0b1118; }
.home-benefit-grid i,
.home-benefit-icon { width: 46px; height: 46px; display: grid; place-items: center; color: #00c8ff; font-size: 1.8rem; font-style: normal; }
.home-benefit-icon svg { width: 31px; height: 31px; fill: none; stroke: #00a8ff; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.home-benefit-grid h3 { margin: 20px 0 8px; color: #eef4f8; font-size: .78rem; line-height: 1.35; text-transform: uppercase; }
.home-benefit-grid p { margin: 0; color: #8998a6; font-size: .68rem; line-height: 1.55; }

.home-instagram-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.home-instagram { display: none !important; }
.home-instagram-grid a { height: 190px; overflow: hidden; border: 1px solid #182630; border-radius: 5px; background: #080d12; }
.home-instagram-grid img { width: 100%; height: 100%; object-fit: cover; object-position: var(--feed-position) center; filter: saturate(.8) contrast(1.06); transition: transform 180ms ease, filter 180ms ease; }.home-instagram-grid a:hover img { transform: scale(1.04); filter: saturate(1.1) contrast(1.05); }

.home-footer { position: relative; z-index: 1; margin-top: 56px; padding: 42px max(24px, 4vw) 22px; border-top: 1px solid #172630; background: #04080b; }
.home-footer-grid { width: min(1380px, 100%); margin: 0 auto; display: grid; grid-template-columns: minmax(260px, 1.3fr) minmax(170px, .7fr) minmax(220px, .8fr); gap: 56px; align-items: start; }
.home-footer h3 { margin: 0 0 14px; color: #e5edf3; font-size: .72rem; text-transform: uppercase; }.home-footer nav, .home-footer nav > div { display: grid; align-content: start; gap: 8px; }.home-footer nav a { color: #8f9daa; font-size: .7rem; }.home-footer nav a:hover { color: #00c8ff; }.home-footer-brand p { max-width: 300px; color: #84929f; font-size: .72rem; line-height: 1.6; }.home-footer-contact { gap: 10px !important; }.home-social-link { min-height: 38px; width: fit-content; min-width: 156px; display: inline-flex !important; align-items: center; gap: 10px; border: 1px solid #24323d; border-radius: 6px; padding: 0 13px; color: #dce8ef !important; font-size: .72rem !important; font-weight: 800; }.home-social-link svg { width: 18px; height: 18px; fill: #00c8ff; flex: 0 0 auto; }.home-social-link:hover { border-color: #00c8ff; background: rgba(0, 200, 255, .08); color: #fff !important; }.home-footer-bottom { width: min(1380px, 100%); margin: 34px auto 0; padding-top: 20px; display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 14px; border-top: 1px solid #15232d; color: #758491; font-size: .66rem; }

/* About page */
.about-page { overflow: hidden; background: #05080c; }
.about-hero { position: relative; min-height: 760px; display: grid; grid-template-columns: minmax(0, .92fr) minmax(460px, 1.08fr); gap: clamp(28px, 5vw, 78px); align-items: center; width: min(1380px, 92%); margin: 0 auto; padding: 132px 0 72px; }
.about-hero::before { content: ""; position: absolute; inset: 0 -12vw auto auto; width: 58vw; height: 520px; pointer-events: none; background: radial-gradient(circle at 50% 45%, rgba(0, 200, 255, .16), transparent 58%); filter: blur(4px); }
.about-hero-copy { position: relative; z-index: 2; }
.about-hero-copy h1 { max-width: 720px; margin: 0; color: #fff; font-size: clamp(3rem, 6vw, 5.9rem); line-height: .98; letter-spacing: 0; text-transform: uppercase; }
.about-hero-copy h1 span { color: #00c8ff; }
.about-hero-copy > p:not(.home-kicker) { max-width: 620px; margin: 24px 0 0; color: #aebbc7; font-size: 1rem; line-height: 1.76; }
.about-hero-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
.about-hero-points span { min-height: 78px; display: flex; align-items: center; gap: 12px; border: 1px solid #1f2a35; border-radius: 6px; padding: 12px 14px; background: rgba(11, 17, 24, .78); color: #f1f6fb; font-size: .75rem; font-weight: 900; text-transform: uppercase; }
.about-hero-points .home-benefit-icon { width: 34px; height: 34px; flex: 0 0 auto; }
.about-hero-points .home-benefit-icon svg { width: 26px; height: 26px; }
.about-hero-visual { position: relative; min-height: 570px; }
.about-hero-glow { position: absolute; inset: 7% 4% 0; border: 1px solid rgba(0, 200, 255, .18); border-radius: 8px; background: radial-gradient(circle at 56% 42%, rgba(0, 200, 255, .2), transparent 42%), linear-gradient(135deg, rgba(11, 17, 24, .92), rgba(3, 6, 9, .62)); box-shadow: inset 0 0 60px rgba(0, 200, 255, .05), 0 35px 80px rgba(0, 0, 0, .55); transform: skewX(-2deg); }
.about-hero-stage { position: relative; z-index: 2; min-height: 570px; }
.about-hero-stage > img { width: 100%; height: 570px; object-fit: cover; border: 1px solid #1f2a35; border-radius: 7px; filter: saturate(.9) contrast(1.05); }
.about-hero-product { position: absolute; margin: 0; overflow: hidden; border: 1px solid rgba(0, 200, 255, .16); border-radius: 7px; background: #070c11; box-shadow: 0 22px 60px rgba(0, 0, 0, .42); }
.about-hero-product img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.92) contrast(1.04); }
.about-product-1 { left: 6%; top: 9%; width: 36%; height: 28%; }
.about-product-2 { right: 9%; top: 7%; width: 41%; height: 31%; }
.about-product-3 { left: 12%; top: 43%; width: 31%; height: 28%; }
.about-product-4 { right: 7%; top: 44%; width: 36%; height: 26%; }
.about-product-5 { left: 24%; bottom: 5%; width: 48%; height: 24%; }
.about-product-6 { right: 0; bottom: 18%; width: 26%; height: 24%; }
.about-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.about-metric-card { min-height: 190px; padding: 24px 20px; border: 1px solid #1f2a35; border-radius: 6px; background: radial-gradient(circle at 18% 20%, rgba(0, 200, 255, .09), transparent 44%), #0b1118; transition: border-color 160ms ease, transform 160ms ease; }
.about-metric-card:hover { border-color: #00aee8; transform: translateY(-2px); }
.about-metric-card h2 { margin: 20px 0 8px; color: #eef4f8; font-size: .84rem; text-transform: uppercase; }
.about-metric-card p { margin: 0; color: #8998a6; font-size: .72rem; line-height: 1.58; }
.about-mission { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: 38px; align-items: center; }
.about-mission-copy h2 { max-width: 560px; margin: 0; color: #fff; font-size: clamp(2rem, 4vw, 4rem); line-height: 1.02; text-transform: uppercase; }
.about-mission-copy p { max-width: 640px; color: #9daab7; font-size: .96rem; line-height: 1.72; }
.about-mission-gallery { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 210px; gap: 12px; }
.about-mission-gallery > img,
.about-mission-photo { min-width: 0; overflow: hidden; border: 1px solid #1f2a35; border-radius: 6px; background: #070c11; }
.about-mission-photo:first-child { grid-row: span 2; }
.about-mission-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.9) contrast(1.05); transition: transform 180ms ease; }
.about-mission-photo:hover img { transform: scale(1.035); }
.about-choice-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.about-brand-band { margin-top: 52px; }
.about-brand-row { grid-template-columns: repeat(6, minmax(120px, 1fr)); }
.about-brand-row a { height: 74px; border: 1px solid rgba(31, 42, 53, .72); border-radius: 6px; background: rgba(8, 14, 20, .74); }
.about-brand-row a:hover { border-color: rgba(0, 200, 255, .55); background: rgba(0, 200, 255, .06); }
.about-brand-row img { max-width: 150px; max-height: 38px; }
.about-cta { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 42px; padding: 34px; border: 1px solid #1f2a35; border-radius: 7px; background: radial-gradient(circle at 86% 20%, rgba(0, 200, 255, .14), transparent 32%), #081018; }
.about-cta h2 { margin: 0; color: #fff; font-size: clamp(1.9rem, 3.4vw, 3.4rem); line-height: 1.02; text-transform: uppercase; }
.about-cta p:not(.home-kicker) { max-width: 620px; margin: 14px 0 0; color: #9daab7; line-height: 1.62; }

@media (max-width: 1180px) {
  body[data-page="store"] .home-site-header .premium-nav { gap: 14px; }
  body[data-page="about"] .home-site-header .premium-nav { gap: 14px; }
  .home-category-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-benefit-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-setup-card { grid-template-columns: minmax(200px, .8fr) 2fr; }.home-setup-total { grid-column: 1 / -1; justify-content: flex-end; }
  .home-instagram-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-footer-grid { grid-template-columns: minmax(240px, 1.2fr) repeat(2, minmax(0, 1fr)); gap: 32px; }.home-footer-brand { grid-row: span 1; }
  .about-hero { grid-template-columns: 1fr; min-height: auto; }
  .about-hero-visual { min-height: 520px; }
  .about-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-mission { grid-template-columns: 1fr; }
}
@media (max-width: 1040px) {
  body[data-page="store"] .home-site-header { position: absolute; grid-template-columns: auto auto 1fr auto auto; }
  body[data-page="about"] .home-site-header { position: absolute; grid-template-columns: auto auto 1fr auto auto; }
  body[data-page="store"] .home-site-header .home-header-search { justify-self: end; }
  .home-brand-row { grid-template-columns: repeat(5, minmax(110px, 1fr)); overflow-x: auto; }
}
@media (max-width: 760px) {
  body[data-page="store"] .home-site-header { grid-template-columns: auto 1fr auto auto; column-gap: 8px; min-height: 62px; padding: 8px 14px; }
  body[data-page="about"] .home-site-header { grid-template-columns: auto 1fr auto auto; column-gap: 8px; min-height: 62px; padding: 8px 14px; }
  body[data-page="store"] .home-site-header .premium-brand { min-width: 0; }
  body[data-page="about"] .home-site-header .premium-brand { min-width: 0; }
  body[data-page="store"] .home-site-header .mobile-menu-toggle { grid-column: 3; grid-row: 1; justify-self: end; }
  body[data-page="about"] .home-site-header .mobile-menu-toggle { grid-column: 3; grid-row: 1; justify-self: end; }
  body[data-page="store"] .home-site-header .header-actions { grid-column: 4; grid-row: 1; justify-self: end; }
  body[data-page="about"] .home-site-header .header-actions { grid-column: 4; grid-row: 1; justify-self: end; }
  body[data-page="store"] .home-site-header .header-cart { width: 48px; min-width: 48px; justify-self: end; }
  body[data-page="about"] .home-site-header .header-cart { width: 48px; min-width: 48px; justify-self: end; }
  body[data-page="store"] .mobile-nav-drawer { left: auto; right: 8px; width: min(340px, calc(100vw - 16px)); gap: 9px; padding: 14px; }
  body[data-page="about"] .mobile-nav-drawer { left: auto; right: 8px; width: min(340px, calc(100vw - 16px)); gap: 9px; padding: 14px; }
  body[data-page="store"] .home-site-header .home-header-search,
  body[data-page="store"] .home-site-header .header-icon-button,
  body[data-page="store"] .home-site-header .account-menu-wrap { display: none; }
  body[data-page="about"] .home-site-header .header-search,
  body[data-page="about"] .home-site-header .header-icon-button,
  body[data-page="about"] .home-site-header .account-menu-wrap { display: none; }
  .home-hero { min-height: 570px; height: 78vh; }.home-hero-media { object-position: 64% center; }.home-hero-shade { background: linear-gradient(90deg, rgba(3,6,9,.96), rgba(3,6,9,.46)), linear-gradient(0deg, rgba(3,6,9,.75), transparent 45%); }.home-hero-content { width: calc(100% - 32px); margin-top: 45px; }.home-hero h1 { font-size: 43px; }.home-hero-content > p:not(.home-kicker) { max-width: 330px; font-size: .88rem; }.home-hero-actions { align-items: stretch; flex-direction: column; width: min(280px, 100%); }
  .home-band { padding-left: 16px; padding-right: 16px; }.home-section { width: calc(100% - 32px); padding-top: 40px; }.home-section-heading { align-items: flex-start; }.home-section-heading h2 { line-height: 1.35; }
  .home-brand-row, .home-brands .home-section-heading { width: 100%; }.home-brand-row { grid-template-columns: repeat(5, 130px); gap: 12px; }.home-brand-row img { max-width: 110px; }.home-brand-row strong { font-size: .86rem; }
  .home-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.home-category-media { height: 170px; }
  .home-product-rail { grid-auto-columns: minmax(235px, 78vw); }.home-rail-arrow { display: none; }
  .home-setup-card { grid-template-columns: 1fr; padding: 22px 16px; }.home-setup-products { overflow-x: auto; }.home-setup-product img, .home-setup-product i { min-width: 120px; height: 100px; }.home-setup-total { grid-column: auto; justify-content: flex-start; }
  .home-benefit-grid { grid-template-columns: 1fr; }.home-benefit-grid article { min-height: 150px; }
  .home-instagram-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.home-instagram-grid a { height: 160px; }
  .home-footer { padding-left: 16px; padding-right: 16px; }.home-footer-grid { grid-template-columns: 1fr; gap: 28px; }.home-footer-brand { grid-column: 1 / -1; }.home-footer-bottom { flex-direction: column; }.home-social-link { width: 100%; justify-content: center; }
  .about-hero { width: calc(100% - 32px); padding: 108px 0 48px; }
  .about-hero-copy h1 { font-size: 43px; }
  .about-hero-copy > p:not(.home-kicker) { font-size: .88rem; }
  .about-hero-points { grid-template-columns: 1fr; }
  .about-hero-visual,
  .about-hero-stage { min-height: 390px; }
  .about-hero-glow { inset: 5% 0 0; }
  .about-hero-product { border-radius: 5px; }
  .about-product-1 { left: 0; top: 5%; width: 48%; height: 27%; }
  .about-product-2 { right: 0; top: 10%; width: 48%; height: 27%; }
  .about-product-3 { left: 5%; top: 40%; width: 42%; height: 25%; }
  .about-product-4 { right: 5%; top: 43%; width: 42%; height: 25%; }
  .about-product-5 { left: 10%; bottom: 4%; width: 58%; height: 24%; }
  .about-product-6 { right: 0; bottom: 12%; width: 35%; height: 23%; }
  .about-metrics { grid-template-columns: 1fr; }
  .about-mission-gallery { grid-template-columns: 1fr; grid-auto-rows: 230px; }
  .about-mission-photo:first-child { grid-row: auto; }
  .about-choice-grid { grid-template-columns: 1fr; }
  .about-brand-row { grid-template-columns: repeat(3, 150px); }
  .about-cta { flex-direction: column; align-items: flex-start; padding: 24px 18px; }
}
@media (max-width: 420px) { .home-category-grid { grid-template-columns: 1fr; }.home-category-media { height: 210px; }.home-instagram-grid { grid-template-columns: 1fr 1fr; }.home-hero h1 { font-size: 38px; } }

/* Final admin sidebar overrides */
body[data-page="admin"] .admin-topbar { grid-template-columns: 58px minmax(0, 1fr); }
body[data-page="admin"] .admin-topbar > .brand { display: none; }
body[data-page="admin"] .admin-topbar > .admin-menu-button { grid-column: 1; }
body[data-page="admin"] .admin-topbar > .main-nav { grid-column: 2; }
body[data-page="admin"] .admin-shell { grid-template-columns: 250px minmax(0, 1fr); }
body[data-page="admin"] .admin-sidebar { position: sticky; top: 0; min-height: calc(100vh - 60px); padding: 16px 12px; background: #060a10; font-family: Inter, "Segoe UI", Arial, sans-serif; }
body[data-page="admin"] .admin-tabs { gap: 2px; }
body[data-page="admin"] .admin-tab, body[data-page="admin"] .admin-store-link { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; justify-content: stretch; gap: 10px; min-height: 34px; border: 0; border-radius: 6px; padding: 0 9px; color: #aeb8c6; background: transparent; font-size: .78rem; font-weight: 750; letter-spacing: 0; }
body[data-page="admin"] .admin-tab.active, body[data-page="admin"] .admin-tab:hover, body[data-page="admin"] .admin-store-link:hover { color: #eef7ff; background: #082b42; }
body[data-page="admin"] .admin-tab svg, body[data-page="admin"] .admin-store-link svg { width: 15px; height: 15px; color: #7f8a99; stroke-width: 2; }
body[data-page="admin"] .admin-tab.active svg, body[data-page="admin"] .admin-tab:hover svg, body[data-page="admin"] .admin-store-link:hover svg { color: #d5eefc; }

/* Setup builder */
.setup-builder-page { min-height: 100vh; padding: 110px max(18px, 4vw) 56px; background: radial-gradient(circle at 78% 12%, rgba(0, 200, 255, .12), transparent 28%), #05080c; }
.setup-builder-hero { width: min(1380px, 100%); margin: 0 auto 26px; padding: 34px 0 10px; }
.setup-builder-hero h1 { max-width: 760px; margin: 8px 0 0; color: #f8fafc; font-size: clamp(2.2rem, 5vw, 4.9rem); line-height: .98; letter-spacing: 0; text-transform: uppercase; }
.setup-builder-hero p:not(.eyebrow) { max-width: 560px; margin: 18px 0 0; color: #9fb0c2; font-size: 1rem; line-height: 1.65; }
.setup-builder-shell { width: min(1380px, 100%); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; }
.setup-builder-main { display: grid; gap: 16px; min-width: 0; }
.setup-step { scroll-margin-top: 96px; border: 1px solid #172430; border-radius: 8px; background: linear-gradient(180deg, rgba(8, 17, 25, .96), rgba(4, 9, 14, .98)); overflow: hidden; }
.setup-step > header { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 18px; border-bottom: 1px solid #14202b; }
.setup-step > header > span { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid #1d3a4d; border-radius: 7px; color: #00c8ff; background: rgba(0, 200, 255, .08); font-size: .82rem; font-weight: 900; }
.setup-step h2 { margin: 0; color: #f8fafc; font-size: 1.08rem; letter-spacing: 0; }
.setup-step p { margin: 5px 0 0; color: #8fa1b4; font-size: .78rem; }
.setup-step-count { min-width: max-content; color: #7f94a8; font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.setup-option-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 260px)); justify-content: start; gap: 12px; padding: 14px; }
.setup-option { min-width: 0; display: grid; grid-template-rows: auto auto auto auto; gap: 8px; border: 1px solid #1a2935; border-radius: 7px; padding: 10px; color: #dbe5f0; background: #071019; text-align: left; cursor: pointer; transition: border-color 160ms ease, transform 160ms ease, background 160ms ease; }
.setup-option:hover, .setup-option.selected { border-color: #00c8ff; background: rgba(0, 200, 255, .08); transform: translateY(-1px); }
.setup-option-media { display: grid; place-items: center; width: 100%; height: 216px; overflow: hidden; border-radius: 5px; background: radial-gradient(circle at center, rgba(0, 200, 255, .12), transparent 58%), #050a0f; }
.setup-option-media img { box-sizing: border-box; display: block; width: calc(100% - 24px); height: calc(100% - 24px); max-width: calc(100% - 24px); max-height: calc(100% - 24px); object-fit: contain; object-position: center; padding: 0; filter: drop-shadow(0 14px 18px rgba(0,0,0,.45)); }
.setup-option strong { min-height: 38px; color: #f8fafc; font-size: .82rem; line-height: 1.32; }
.setup-empty-step { grid-column: 1 / -1; margin: 0; padding: 18px; border: 1px dashed #1d3a4d; border-radius: 7px; color: #8fa1b4; background: rgba(0, 200, 255, .04); }

/* Photo studio */
body[data-page="photo-studio"] {
  background: #05080c;
  color: #f4f8fc;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}

body[data-page="photo-studio"]::before {
  display: none;
}

.photo-studio-shell {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  min-height: calc(100vh - 60px);
  background: #05080c;
}

.photo-studio-sidebar {
  position: sticky;
  top: 0;
  min-height: calc(100vh - 60px);
  padding: 16px 12px;
  border-right: 1px solid #1f2a35;
  background: #060a10;
}

.photo-studio-sidebar .admin-tabs {
  display: grid;
  gap: 2px;
  margin-top: 22px;
}

.photo-studio-sidebar .admin-tab {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-height: 34px;
  border: 0;
  border-radius: 6px;
  padding: 0 9px;
  color: #aeb8c6;
  background: transparent;
  font-size: .78rem;
  font-weight: 750;
  text-decoration: none;
}

.photo-studio-sidebar .admin-tab.active,
.photo-studio-sidebar .admin-tab:hover {
  color: #eef7ff;
  background: #082b42;
}

.photo-studio-sidebar .admin-tab svg {
  width: 15px;
  height: 15px;
  color: #7f8a99;
}

.photo-studio-workspace {
  min-width: 0;
  padding: 22px 24px 52px;
}

.photo-studio-hero,
.studio-card {
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(12, 20, 28, .95), rgba(5, 9, 14, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}

.photo-studio-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
  padding: 24px;
}

.photo-studio-hero h1 {
  margin: 8px 0 7px;
  color: #fff;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  line-height: 1;
}

.photo-studio-hero p {
  max-width: 720px;
  margin: 0;
  color: #9fb0c0;
  line-height: 1.55;
}

.photo-studio-status {
  min-width: 150px;
  border: 1px solid #1d3446;
  border-radius: 6px;
  padding: 11px 14px;
  color: #00c8ff;
  background: rgba(0, 200, 255, .08);
  font-size: .78rem;
  font-weight: 900;
  text-align: center;
  text-transform: uppercase;
}

.photo-studio-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: 16px;
  align-items: start;
}

.photo-studio-grid .studio-card:nth-child(3) {
  grid-column: 1 / -1;
}

.studio-simple-grid {
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
}

.studio-simple-grid .studio-card:nth-child(3) {
  grid-column: 1 / -1;
}

.studio-simple-main .studio-dropzone {
  margin-top: 16px;
}

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

.studio-history-compact .studio-history-row:nth-child(n + 6) {
  display: none;
}

.studio-card {
  min-width: 0;
  padding: 18px;
}

.studio-card h2,
.studio-section-heading h2 {
  margin: 0 0 16px;
  color: #fff;
  font-size: 1.05rem;
}

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

.studio-form-grid label,
.studio-switches label {
  min-width: 0;
  display: grid;
  gap: 7px;
  color: #b7c6d7;
  font-size: .78rem;
  font-weight: 850;
}

.studio-form-grid input,
.studio-form-grid select,
.studio-form-grid textarea,
.studio-section-heading input {
  width: 100%;
  min-width: 0;
  border: 1px solid #263746;
  border-radius: 6px;
  background: #070d13;
  color: #f8fafc;
  padding: 12px;
  font: inherit;
  font-weight: 750;
  outline: 0;
}

.studio-form-grid textarea {
  resize: vertical;
}

.studio-form-grid input:focus,
.studio-form-grid select:focus,
.studio-form-grid textarea:focus,
.studio-section-heading input:focus {
  border-color: #00c8ff;
  box-shadow: 0 0 0 2px rgba(0, 200, 255, .12);
}

.studio-dropzone {
  min-height: 210px;
  display: grid;
  place-items: center;
  gap: 8px;
  border: 1px dashed #28516a;
  border-radius: 8px;
  background: radial-gradient(circle at 50% 20%, rgba(0, 200, 255, .1), transparent 55%), #070d13;
  color: #c8d5e2;
  padding: 28px;
  text-align: center;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease;
}

.studio-dropzone.dragging,
.studio-dropzone:hover {
  border-color: #00c8ff;
  background: rgba(0, 200, 255, .08);
}

.studio-dropzone input {
  display: none;
}

.studio-dropzone svg {
  width: 36px;
  height: 36px;
  color: #00c8ff;
}

.studio-dropzone strong {
  color: #fff;
}

.studio-dropzone span,
.studio-empty {
  color: #8fa1b4;
  font-size: .82rem;
}

.studio-source-list {
  display: grid;
  gap: 10px;
  margin-top: 14px;
}

.studio-source-card,
.studio-history-row {
  min-width: 0;
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr) auto;
  gap: 13px;
  align-items: center;
  border: 1px solid #1c2d3a;
  border-radius: 8px;
  background: rgba(7, 13, 19, .84);
  padding: 10px;
}

.studio-source-card img,
.studio-history-row img,
.studio-history-row > span {
  width: 82px;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 6px;
  background: #04080c;
  object-fit: contain;
}

.studio-source-card strong,
.studio-history-row strong {
  display: block;
  overflow: hidden;
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-source-card span,
.studio-history-row small {
  display: block;
  margin-top: 4px;
  color: #9fb0c0;
  font-size: .75rem;
}

.studio-source-card em,
.studio-history-row em {
  display: inline-block;
  margin-top: 5px;
  color: #ffd166;
  font-size: .72rem;
  font-style: normal;
  font-weight: 800;
}

.studio-card-actions,
.studio-section-heading,
.studio-switches,
.studio-cost-box {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.studio-card-actions {
  justify-content: flex-end;
}

.studio-presets {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.studio-preset {
  min-height: 116px;
  display: grid;
  grid-template-rows: auto auto 1fr;
  gap: 8px;
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: #070d13;
  color: #b9c7d5;
  padding: 13px;
  cursor: pointer;
  text-align: left;
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.studio-preset:hover,
.studio-preset.active {
  border-color: #00c8ff;
  background: rgba(0, 200, 255, .08);
  transform: translateY(-1px);
}

.studio-preset svg {
  width: 20px;
  height: 20px;
  color: #00c8ff;
}

.studio-preset strong {
  color: #fff;
  font-size: .82rem;
}

.studio-preset span {
  color: #8fa1b4;
  font-size: .72rem;
  line-height: 1.35;
}

.studio-switches {
  margin: 15px 0;
}

.studio-switches label {
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  min-height: 34px;
  border: 1px solid #1f2a35;
  border-radius: 6px;
  background: #070d13;
  padding: 8px 10px;
}

.studio-cost-box {
  justify-content: space-between;
  border: 1px solid #1d3446;
  border-radius: 8px;
  background: rgba(0, 200, 255, .06);
  padding: 12px;
  color: #c8d5e2;
}

.studio-cost-box strong {
  color: #fff;
}

.studio-cost-box small {
  flex-basis: 100%;
  color: #8fa1b4;
}

.studio-section-heading {
  justify-content: space-between;
  margin-bottom: 14px;
}

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

.studio-result-card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: #070d13;
}

.studio-select-result {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 2;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  border: 1px solid #263746;
  border-radius: 6px;
  background: rgba(5, 8, 12, .88);
  color: #d6e2ee;
  padding: 6px 8px;
  font-size: .72rem;
  font-weight: 800;
}

.studio-result-image {
  width: 100%;
  height: 260px;
  display: block;
  background: #030609;
  object-fit: contain;
}

.studio-result-body {
  display: grid;
  gap: 6px;
  padding: 13px;
}

.studio-result-body > span {
  color: #00c8ff;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-result-body strong {
  overflow: hidden;
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.studio-result-body small {
  color: #9fb0c0;
}

.studio-history {
  display: grid;
  gap: 9px;
}

.studio-history-row {
  grid-template-columns: 56px minmax(0, 1fr) auto auto;
}

.studio-history-row img,
.studio-history-row > span {
  width: 56px;
}

.studio-history-row > span svg {
  width: 22px;
  height: 22px;
  color: #00c8ff;
}

.studio-history-row em {
  margin: 0;
  color: #00e48a;
  text-transform: uppercase;
}

.studio-dialog {
  width: min(1180px, calc(100vw - 36px));
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: #060a10;
  color: #fff;
  padding: 16px;
}

.studio-dialog::backdrop {
  background: rgba(0, 0, 0, .72);
}

.studio-dialog > button {
  margin-left: auto;
}

.studio-compare {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.studio-compare figure {
  min-width: 0;
  margin: 0;
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: #030609;
  overflow: hidden;
}

.studio-compare figcaption {
  border-bottom: 1px solid #1f2a35;
  padding: 10px 12px;
  color: #00c8ff;
  font-size: .78rem;
  font-weight: 900;
  text-transform: uppercase;
}

.studio-compare img {
  width: 100%;
  height: min(70vh, 680px);
  object-fit: contain;
}

@media (max-width: 1100px) {
  .photo-studio-shell,
  .photo-studio-grid {
    grid-template-columns: 1fr;
  }

  .photo-studio-sidebar {
    position: static;
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid #1f2a35;
  }

  .photo-studio-sidebar .admin-tabs,
  .studio-presets,
  .studio-results {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .photo-studio-workspace {
    padding: 14px;
  }

  .photo-studio-hero,
  .studio-section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .studio-form-grid,
  .studio-presets,
  .studio-results,
  .studio-compare,
  .photo-studio-sidebar .admin-tabs {
    grid-template-columns: 1fr;
  }

  .studio-source-card,
  .studio-history-row {
    grid-template-columns: 1fr;
  }

  .studio-source-card img,
  .studio-history-row img,
  .studio-history-row > span {
    width: 100%;
    max-height: 220px;
  }

  .studio-card-actions {
    justify-content: flex-start;
  }
}
.setup-option small { color: #00c8ff; font-size: .67rem; font-weight: 900; text-transform: uppercase; }
.setup-option b { color: #fff; font-size: .9rem; }
.setup-step-pagination { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 62px; padding: 12px 14px; border-top: 1px solid #14202b; background: rgba(3, 8, 13, .58); }
.setup-step-pagination > p { margin: 0; color: #7f94a8; font-size: .72rem; }
.setup-page-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.setup-page-buttons button { width: 36px; height: 36px; display: inline-grid; place-items: center; border: 1px solid #20303d; border-radius: 6px; padding: 0; color: #cbd8e4; background: #071019; font: inherit; font-size: .76rem; font-weight: 900; cursor: pointer; transition: border-color 160ms ease, color 160ms ease, background 160ms ease, transform 160ms ease; }
.setup-page-buttons button:hover:not(:disabled), .setup-page-buttons button.active { border-color: #00c8ff; color: #fff; background: rgba(0, 200, 255, .12); transform: translateY(-1px); }
.setup-page-buttons button:disabled { opacity: .35; cursor: default; }
.setup-page-buttons svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.setup-page-ellipsis { min-width: 18px; color: #607487; font-size: .82rem; text-align: center; }
.setup-summary { position: sticky; top: 88px; min-width: 0; }
.setup-summary-card { display: grid; gap: 14px; border: 1px solid #172430; border-radius: 8px; padding: 18px; background: linear-gradient(180deg, rgba(8, 17, 25, .98), rgba(4, 9, 14, .99)); }
.setup-summary-card h2 { margin: 0; color: #fff; font-size: 1.4rem; }
.setup-summary-list { display: grid; gap: 8px; min-height: 80px; }
.setup-summary-list article { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid #14202b; }
.setup-summary-list span { min-width: 0; color: #cbd5e1; font-size: .78rem; line-height: 1.35; }
.setup-summary-list strong { color: #fff; font-size: .78rem; white-space: nowrap; }
.setup-summary-total { display: grid; gap: 3px; padding: 14px; border: 1px solid #1d3a4d; border-radius: 7px; background: rgba(0, 200, 255, .07); }
.setup-summary-total span, .setup-summary-total small, .setup-summary-note { color: #8fa1b4; font-size: .76rem; line-height: 1.5; }
.setup-summary-total strong { color: #00c8ff; font-size: 1.55rem; }
.setup-summary-card .button { width: 100%; min-height: 42px; }
@media (max-width: 1180px) { .setup-builder-shell { grid-template-columns: 1fr; } .setup-summary { position: static; } }
@media (max-width: 760px) { .setup-builder-page { padding: 82px 14px 36px; } .setup-step { scroll-margin-top: 82px; } .setup-step > header { grid-template-columns: 42px minmax(0, 1fr); padding: 15px 13px; } .setup-step-count { grid-column: 2; justify-self: start; } .setup-option-grid { grid-template-columns: 1fr; } .setup-option-media { min-height: 230px; } .setup-step-pagination { align-items: flex-start; flex-direction: column; padding: 13px; } .setup-page-buttons { width: 100%; justify-content: space-between; } .setup-page-buttons button { width: 40px; height: 40px; } .setup-builder-hero h1 { font-size: 2.2rem; } }

/* Dashboard metric icon cleanup */
body[data-page="admin"] .dashboard-metric-card::before,
body[data-page="admin"] .dashboard-metric-card::after {
  content: none !important;
  display: none !important;
}

/* Coupon admin */
.coupon-admin-layout {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .6fr);
}

.coupon-table-header,
.coupon-table-row {
  grid-template-columns: minmax(140px, 1fr) minmax(150px, 1fr) 110px 105px 96px;
}

.coupon-code-cell {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.coupon-code-cell strong {
  color: #f8fbff;
  letter-spacing: .04em;
}

.coupon-code-cell small {
  color: #00c8ff;
  font-size: .72rem;
  font-weight: 800;
}

.coupon-form,
.coupon-owner-report {
  display: grid;
  gap: 14px;
}

.coupon-detail-card {
  padding: 0;
  overflow: hidden;
}

.coupon-detail-card .coupon-form {
  padding: 20px;
}

.coupon-form label {
  display: grid;
  gap: 7px;
  min-width: 0;
  color: #a9b7c7;
  font-size: .76rem;
  font-weight: 900;
  text-transform: uppercase;
}

.coupon-form label > span {
  display: block;
  line-height: 1.2;
}

.coupon-form input,
.coupon-form select,
.coupon-form textarea {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  border: 1px solid #243342;
  border-radius: 6px;
  background: #071016;
  color: #f7fbff;
  padding: 0 12px;
  font: inherit;
  font-size: .9rem;
  font-weight: 700;
  text-transform: none;
  outline: none;
}

.coupon-form textarea {
  min-height: 82px;
  padding: 12px;
  resize: vertical;
}

.coupon-form input:focus,
.coupon-form select:focus,
.coupon-form textarea:focus {
  border-color: #00c8ff;
  box-shadow: 0 0 0 3px rgba(0, 200, 255, .1);
}

.coupon-form input::placeholder,
.coupon-form textarea::placeholder {
  color: #687787;
}

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

.coupon-active-toggle {
  display: flex !important;
  align-items: center;
  gap: 10px !important;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid #1e2b36;
  border-radius: 6px;
  background: rgba(7, 16, 22, .72);
  color: #f4f8fc !important;
  text-transform: none !important;
  font-size: .88rem !important;
}

.coupon-active-toggle input {
  width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  accent-color: #00c8ff;
}

.coupon-owner-report {
  margin-top: 18px;
  padding: 20px;
  padding-top: 18px;
  border-top: 1px solid #1d2b36;
}

.coupon-owner-report h5 {
  margin: 0;
  color: #fff;
  font-size: .98rem;
}

.coupon-commission-total {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(0, 200, 255, .25);
  border-radius: 7px;
  background: rgba(0, 200, 255, .07);
  color: #9fb1c4;
  font-weight: 800;
}

.coupon-commission-total strong {
  color: #00e676;
}

@media (max-width: 980px) {
  .coupon-admin-layout,
  .coupon-form-grid {
    grid-template-columns: 1fr;
  }

  .coupon-table-header {
    display: none;
  }

  .coupon-table-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

/* Customer order receipt */
.receipt-site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 74px;
  border-bottom: 1px solid #172632;
  background: rgba(3, 7, 10, .96);
  padding: 10px max(20px, calc((100vw - 1180px) / 2));
  backdrop-filter: blur(16px);
}

.receipt-site-header .brand {
  flex: 0 1 auto;
}

.receipt-header-link {
  color: #9fb0c0;
  font-size: .82rem;
  font-weight: 800;
  text-decoration: none;
}

.receipt-header-link:hover {
  color: #00c8ff;
}

.receipt-page {
  width: min(1120px, calc(100% - 32px));
  min-height: calc(100vh - 74px);
  margin: 0 auto;
  padding: 52px 0 72px;
}

.receipt-loading,
.receipt-error {
  display: grid;
  justify-items: center;
  width: min(620px, 100%);
  margin: 10vh auto 0;
  border: 1px solid #1b2a36;
  border-radius: 8px;
  background: #071017;
  padding: 52px 28px;
  text-align: center;
}

.receipt-loading strong,
.receipt-error h1 {
  margin: 14px 0 0;
  color: #f7fbff;
}

.receipt-loading p,
.receipt-error > p:not(.eyebrow) {
  margin: 8px 0 0;
  color: #8ea1b1;
}

.receipt-loader {
  width: 34px;
  height: 34px;
  border: 3px solid #163447;
  border-top-color: #00c8ff;
  border-radius: 50%;
  animation: receipt-spin .8s linear infinite;
}

.receipt-error-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #00c8ff;
  border-radius: 50%;
  color: #00c8ff;
  font-size: 1.25rem;
  font-weight: 900;
}

.receipt-error .button {
  margin-top: 24px;
}

@keyframes receipt-spin {
  to { transform: rotate(360deg); }
}

.receipt-document {
  display: grid;
  gap: 18px;
}

.receipt-hero,
.receipt-section,
.receipt-meta-grid,
.receipt-progress,
.receipt-actions {
  border: 1px solid #1b2a36;
  border-radius: 8px;
  background: #071017;
}

.receipt-hero {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 28px;
  overflow: hidden;
  padding: 34px 36px;
}

.receipt-hero::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 2px;
  background: #00c8ff;
  content: "";
}

.receipt-hero h1 {
  margin: 7px 0 0;
  color: #fff;
  font-size: clamp(2rem, 4vw, 3.3rem);
  line-height: 1.04;
}

.receipt-hero > div > p:last-child {
  max-width: 650px;
  margin: 14px 0 0;
  color: #9eb0bf;
  line-height: 1.65;
}

.receipt-status {
  flex: 0 0 auto;
  border: 1px solid #00c8ff;
  border-radius: 999px;
  background: rgba(0, 200, 255, .08);
  color: #00c8ff;
  padding: 9px 12px;
  font-size: .7rem;
  font-weight: 900;
  text-transform: uppercase;
}

.receipt-status.is-paid,
.receipt-status.is-delivered {
  border-color: #21d480;
  background: rgba(33, 212, 128, .08);
  color: #21d480;
}

.receipt-status.is-pending {
  border-color: #f4b426;
  background: rgba(244, 180, 38, .08);
  color: #f4b426;
}

.receipt-status.is-canceled {
  border-color: #718394;
  background: rgba(113, 131, 148, .08);
  color: #a7b3be;
}

.receipt-meta-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
}

.receipt-meta-grid article {
  display: grid;
  align-content: center;
  min-width: 0;
  min-height: 102px;
  border-right: 1px solid #1b2a36;
  padding: 18px 22px;
}

.receipt-meta-grid article:last-child {
  border-right: 0;
}

.receipt-meta-grid span,
.receipt-meta-grid small,
.receipt-delivery-info span {
  color: #708697;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
}

.receipt-meta-grid strong,
.receipt-delivery-info strong {
  min-width: 0;
  margin-top: 6px;
  overflow-wrap: anywhere;
  color: #f7fbff;
  font-size: .92rem;
}

.receipt-meta-grid small {
  margin-top: 5px;
  overflow-wrap: anywhere;
  text-transform: none;
}

.receipt-section {
  padding: 26px;
}

.receipt-section-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin-bottom: 20px;
}

.receipt-section-heading h2 {
  margin: 5px 0 0;
  color: #fff;
  font-size: 1.3rem;
}

.receipt-section-heading > span {
  color: #8ea2b2;
  font-size: .76rem;
  font-weight: 800;
}

.receipt-items {
  display: grid;
}

.receipt-item {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 70px 120px;
  gap: 14px;
  align-items: center;
  min-width: 0;
  border-top: 1px solid #172632;
  padding: 17px 0;
}

.receipt-item-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid #1c3d50;
  border-radius: 6px;
  background: #061821;
  color: #00c8ff;
}

.receipt-item-icon svg,
.receipt-delivery-card svg {
  width: 23px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.receipt-item > div:nth-child(2) {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.receipt-item strong {
  overflow-wrap: anywhere;
  color: #f7fbff;
}

.receipt-item span,
.receipt-item em {
  color: #8295a5;
  font-size: .76rem;
  font-style: normal;
}

.receipt-item b {
  color: #fff;
  text-align: right;
}

.receipt-empty {
  margin: 0;
  border-top: 1px solid #172632;
  padding: 20px 0 0;
  color: #8497a7;
}

.receipt-lower-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .72fr);
  gap: 18px;
}

.receipt-delivery-card .receipt-section-heading {
  align-items: flex-start;
}

.receipt-delivery-card svg {
  width: 30px;
  color: #00c8ff;
}

.receipt-delivery-info {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.receipt-delivery-info > div {
  display: grid;
  min-width: 0;
}

.receipt-totals > .eyebrow {
  margin-bottom: 12px;
}

.receipt-totals dl,
.receipt-totals dl div {
  margin: 0;
}

.receipt-totals dl div {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid #172632;
  padding: 11px 0;
}

.receipt-totals dt {
  color: #8da0b0;
}

.receipt-totals dd {
  margin: 0;
  color: #f7fbff;
  font-weight: 800;
}

.receipt-totals .receipt-discount dd {
  color: #21d480;
}

.receipt-totals .receipt-total-row {
  align-items: end;
  border-bottom: 0;
  padding-top: 18px;
}

.receipt-totals .receipt-total-row dd {
  color: #00c8ff;
  font-size: 1.65rem;
}

.receipt-progress {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  overflow: hidden;
}

.receipt-progress > div {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 9px;
  padding: 24px 12px;
  color: #637786;
  text-align: center;
}

.receipt-progress > div:not(:last-child)::after {
  position: absolute;
  top: 37px;
  right: -50%;
  width: 100%;
  height: 1px;
  background: #20313e;
  content: "";
}

.receipt-progress span {
  z-index: 1;
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border: 1px solid #2a3a46;
  border-radius: 50%;
  background: #071017;
  font-size: .7rem;
  font-weight: 900;
}

.receipt-progress strong {
  font-size: .72rem;
}

.receipt-progress .is-complete {
  color: #dff9ff;
}

.receipt-progress .is-complete span {
  border-color: #00c8ff;
  background: #062634;
  color: #00c8ff;
}

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

.receipt-actions > div {
  display: grid;
  gap: 4px;
}

.receipt-actions strong {
  color: #fff;
}

.receipt-actions span {
  color: #8396a6;
  font-size: .76rem;
}

@media (max-width: 820px) {
  .receipt-page {
    width: min(100% - 24px, 680px);
    padding-top: 24px;
  }

  .receipt-hero,
  .receipt-section-heading,
  .receipt-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .receipt-hero {
    display: grid;
    padding: 26px 22px;
  }

  .receipt-status {
    justify-self: start;
  }

  .receipt-meta-grid,
  .receipt-lower-grid,
  .receipt-actions {
    grid-template-columns: 1fr;
  }

  .receipt-meta-grid article {
    min-height: 82px;
    border-right: 0;
    border-bottom: 1px solid #1b2a36;
  }

  .receipt-meta-grid article:last-child {
    border-bottom: 0;
  }

  .receipt-item {
    grid-template-columns: 42px minmax(0, 1fr) auto;
  }

  .receipt-item em {
    grid-column: 2;
  }

  .receipt-item b {
    grid-column: 3;
    grid-row: 1 / span 2;
  }

  .receipt-actions .button {
    width: 100%;
  }
}

@media (max-width: 540px) {
  .receipt-site-header {
    min-height: 64px;
    padding: 8px 12px;
  }

  .receipt-site-header .brand span,
  .receipt-header-link {
    font-size: .68rem;
  }

  .receipt-site-header .brand-logo {
    width: 38px;
    height: 38px;
  }

  .receipt-section {
    padding: 20px 17px;
  }

  .receipt-item {
    gap: 10px;
  }

  .receipt-item b {
    font-size: .84rem;
  }

  .receipt-delivery-info {
    grid-template-columns: 1fr;
  }

  .receipt-progress {
    grid-template-columns: 1fr;
  }

  .receipt-progress > div {
    grid-template-columns: 32px minmax(0, 1fr);
    justify-items: start;
    padding: 13px 18px;
    text-align: left;
  }

  .receipt-progress > div:not(:last-child)::after {
    top: 39px;
    right: auto;
    bottom: -13px;
    left: 31px;
    width: 1px;
    height: 26px;
  }
}

/* Confirmed order */
.confirmation-header-status { color: #21d480; font-size: .75rem; font-weight: 850; }
.confirmation-page { width: min(820px, calc(100% - 32px)); min-height: calc(100vh - 74px); margin: 0 auto; padding: 48px 0 72px; }
.confirmation-card { display: grid; gap: 16px; }
.confirmation-hero, .confirmation-summary, .confirmation-products, .confirmation-delivery, .confirmation-actions { border: 1px solid #1b2a36; border-radius: 8px; background: #071017; }
.confirmation-hero { position: relative; display: grid; justify-items: center; overflow: hidden; padding: 42px 30px 38px; text-align: center; }
.confirmation-hero::before { position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, transparent, #21d480, transparent); content: ""; }
.confirmation-check { display: grid; width: 62px; height: 62px; margin-bottom: 19px; place-items: center; border: 1px solid rgba(33, 212, 128, .54); border-radius: 50%; background: rgba(33, 212, 128, .08); color: #21d480; box-shadow: 0 0 34px rgba(33, 212, 128, .12); }
.confirmation-check svg { width: 32px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.confirmation-hero .eyebrow { color: #21d480; }
.confirmation-hero h1 { margin: 2px 0 0; color: #fff; font-size: clamp(2.25rem, 6vw, 4.4rem); line-height: 1; }
.confirmation-hero > p:last-child { max-width: 560px; margin: 15px 0 0; color: #9cb0bf; line-height: 1.6; }
.confirmation-summary { display: grid; grid-template-columns: 1fr 1fr 1.1fr; overflow: hidden; }
.confirmation-summary > div { display: grid; min-width: 0; min-height: 96px; align-content: center; border-right: 1px solid #1b2a36; padding: 18px 22px; }
.confirmation-summary > div:last-child { border-right: 0; }
.confirmation-summary span { color: #708697; font-size: .66rem; font-weight: 850; text-transform: uppercase; }
.confirmation-summary strong { margin-top: 7px; overflow-wrap: anywhere; color: #f7fbff; font-size: .9rem; }
.confirmation-summary .confirmation-total strong { color: #21d480; font-size: 1.3rem; }
.confirmation-products { padding: 25px 26px; }
.confirmation-items { display: grid; }
.confirmation-items article { display: flex; justify-content: space-between; align-items: center; gap: 18px; border-top: 1px solid #172632; padding: 16px 0; }
.confirmation-items article > div { display: grid; gap: 4px; }
.confirmation-items strong, .confirmation-items b { color: #f7fbff; }
.confirmation-items span, .confirmation-items > p { color: #8196a6; font-size: .76rem; }
.confirmation-items b { white-space: nowrap; }
.confirmation-delivery { display: flex; align-items: center; gap: 15px; padding: 20px 23px; }
.confirmation-delivery svg { width: 31px; flex: 0 0 auto; fill: none; stroke: #00c8ff; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.confirmation-delivery > div { display: grid; gap: 4px; }
.confirmation-delivery strong { color: #f7fbff; }
.confirmation-delivery span { color: #8499a9; font-size: .78rem; }
.confirmation-actions { display: grid; grid-template-columns: auto 1fr 1fr; gap: 10px; align-items: center; padding: 18px; }
.confirmation-actions .button { justify-content: center; }
.receipt-actions > .privacy-footer-link, .confirmation-actions > .privacy-footer-link { font-size: .7rem; }

@media (max-width: 620px) {
  .confirmation-page { width: min(100% - 22px, 520px); padding-top: 22px; }
  .confirmation-hero { padding: 34px 20px 30px; }
  .confirmation-summary, .confirmation-actions { grid-template-columns: 1fr; }
  .confirmation-summary > div { min-height: 76px; border-right: 0; border-bottom: 1px solid #1b2a36; }
  .confirmation-summary > div:last-child { border-bottom: 0; }
  .confirmation-products { padding: 21px 18px; }
  .confirmation-header-status { font-size: .66rem; }
}

/* Mobile storefront app experience. Desktop styles remain untouched. */
.mobile-home-hero,
.mobile-benefit-strip,
.mobile-product-section,
.mobile-bottom-nav,
.mobile-search-overlay,
.mobile-account-overlay { display: none; }

@media (max-width: 760px) {
  :root { --mobile-header-height: 64px; --mobile-nav-height: 72px; }
  html { scroll-padding-top: calc(var(--mobile-header-height) + 12px); }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) {
    padding-top: var(--mobile-header-height);
    padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
    background: #05080c;
  }
  body.mobile-overlay-open { overflow: hidden; }

  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header,
  body[data-page="store"] .home-site-header,
  body[data-page="about"] .home-site-header {
    position: fixed;
    inset: 0 0 auto;
    z-index: 100;
    height: var(--mobile-header-height);
    min-height: var(--mobile-header-height);
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 42px 46px;
    gap: 5px;
    align-items: center;
    padding: 7px 10px;
    border-bottom: 1px solid rgba(0, 200, 255, .16);
    background: rgba(3, 7, 11, .94);
    box-shadow: 0 10px 28px rgba(0, 0, 0, .36);
    backdrop-filter: blur(18px);
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .mobile-menu-toggle {
    grid-column: 1;
    grid-row: 1;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    justify-self: start;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #e9f1f7;
    font-size: 1.25rem;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .premium-brand {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    justify-self: center;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .premium-brand span { display: none; }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .brand-logo,
  body[data-page="store"] .home-site-header .brand-logo,
  body[data-page="about"] .home-site-header .brand-logo {
    width: 46px;
    height: 46px;
    border-radius: 9px;
    object-fit: contain;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .header-search {
    grid-column: 3;
    grid-row: 1;
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    display: grid !important;
    grid-template-columns: 1fr !important;
    place-items: center;
    justify-self: end;
    overflow: visible;
    border: 0;
    border-radius: 8px;
    background: transparent;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .header-search input { display: none; }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .header-search button {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    color: #dce8f0;
    font-size: 1.35rem;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .header-actions {
    grid-column: 4;
    grid-row: 1;
    display: block;
    justify-self: end;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .account-menu-wrap { display: none !important; }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .header-cart {
    width: 44px;
    min-width: 44px;
    height: 42px;
    border: 0;
    background: transparent;
  }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .premium-nav { display: none; }
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .header-cart #cartCount {
    top: 0;
    right: -1px;
    min-width: 17px;
    height: 17px;
    font-size: .58rem;
  }

  .mobile-nav-drawer,
  body[data-page="store"] .mobile-nav-drawer,
  body[data-page="about"] .mobile-nav-drawer {
    position: fixed;
    inset: var(--mobile-header-height) 10px auto;
    z-index: 99;
    width: auto;
    max-height: calc(100dvh - var(--mobile-header-height) - var(--mobile-nav-height) - 18px);
    display: grid;
    gap: 2px;
    overflow-y: auto;
    padding: 10px;
    border: 1px solid #1d3543;
    border-radius: 10px;
    background: rgba(6, 12, 18, .98);
    box-shadow: 0 22px 60px rgba(0, 0, 0, .62), 0 0 28px rgba(0, 190, 245, .06);
  }
  .mobile-nav-drawer.hidden { display: none !important; }
  .mobile-nav-drawer > a,
  .mobile-nav-drawer summary {
    min-height: 42px;
    display: flex;
    align-items: center;
    border-radius: 7px;
    padding: 0 12px;
    color: #e8f0f6;
    font-size: .82rem;
    font-weight: 850;
  }
  .mobile-nav-drawer > a:active,
  .mobile-nav-drawer summary:active { background: rgba(0, 200, 255, .1); color: #00c8ff; }
  .mobile-nav-drawer details { border-top: 1px solid #172a35; border-bottom: 1px solid #172a35; }
  .mobile-nav-drawer details[open] summary { color: #00c8ff; }
  .mobile-category-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 0 4px 10px; }
  .mobile-category-link {
    min-height: 48px;
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    gap: 7px;
    align-items: center;
    border: 1px solid #172b37;
    border-radius: 7px;
    padding: 5px 7px;
    background: #08121a;
    color: #dce7ef;
    font-size: .68rem;
  }
  .mobile-category-icon { width: 25px; height: 25px; display: grid; place-items: center; overflow: hidden; }
  .mobile-category-icon .category-icon-image { width: 20px; height: 20px; object-fit: contain; }
  .mobile-nav-drawer .offer-link { color: #00c8ff !important; }

  .mobile-bottom-nav {
    position: fixed;
    inset: auto 0 0;
    z-index: 110;
    height: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: start;
    padding: 7px 5px calc(6px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(0, 200, 255, .16);
    background: rgba(3, 8, 12, .96);
    box-shadow: 0 -12px 30px rgba(0, 0, 0, .42);
    backdrop-filter: blur(18px);
  }
  .mobile-bottom-nav a {
    min-width: 0;
    height: 56px;
    display: grid;
    grid-template-rows: 30px auto;
    place-items: center;
    gap: 1px;
    color: #7f909f;
    font-size: .64rem;
    font-weight: 800;
  }
  .mobile-bottom-nav a > span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: currentColor;
    font-size: 1.15rem;
  }
  .mobile-bottom-nav a img,
  .mobile-bottom-nav a svg,
  .mobile-bottom-nav .category-icon-image { width: 23px; height: 23px; object-fit: contain; fill: currentColor; stroke: currentColor; }
  .mobile-bottom-nav a:nth-child(3) img { width: 28px; height: 18px; }
  .mobile-bottom-nav a small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-bottom-nav a.active,
  .mobile-bottom-nav a:active { color: #00c8ff; }
  .mobile-bottom-nav a.active > span { filter: drop-shadow(0 0 8px rgba(0, 200, 255, .42)); }

  .mobile-account-overlay {
    position: fixed;
    inset: 0;
    z-index: 180;
    display: grid;
    align-items: end;
  }
  .mobile-account-overlay.hidden { display: none !important; }
  .mobile-account-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: rgba(0, 3, 6, .76);
    backdrop-filter: blur(7px);
    animation: mobileFadeIn 160ms ease both;
  }
  .mobile-account-sheet {
    position: relative;
    z-index: 1;
    width: 100%;
    max-height: min(76dvh, 620px);
    overflow-y: auto;
    padding: 9px 16px calc(18px + env(safe-area-inset-bottom));
    border: 1px solid #1b3543;
    border-bottom: 0;
    border-radius: 14px 14px 0 0;
    background: #071018;
    box-shadow: 0 -22px 70px rgba(0, 0, 0, .72), 0 -1px 24px rgba(0, 200, 255, .08);
    animation: mobileAccountSlideIn 190ms cubic-bezier(.2, .8, .2, 1) both;
  }
  .mobile-account-handle {
    width: 38px;
    height: 4px;
    margin: 0 auto 14px;
    border-radius: 4px;
    background: #2a4351;
  }
  .mobile-account-sheet > header {
    min-height: 72px;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) 38px;
    gap: 12px;
    align-items: center;
    padding-bottom: 16px;
    border-bottom: 1px solid #172a35;
  }
  .mobile-account-avatar {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(0, 200, 255, .5);
    border-radius: 8px;
    background: #08202d;
    color: #00c8ff;
    font-size: 1.08rem;
    font-weight: 900;
    box-shadow: 0 0 22px rgba(0, 200, 255, .1);
  }
  .mobile-account-sheet header small {
    display: block;
    margin-bottom: 3px;
    color: #00c8ff;
    font-size: .61rem;
    font-weight: 900;
    letter-spacing: 0;
  }
  .mobile-account-sheet header h2 {
    margin: 0;
    color: #f6fbff;
    font-size: 1.08rem;
    line-height: 1.2;
  }
  .mobile-account-sheet header p {
    max-width: 100%;
    margin: 4px 0 0;
    overflow: hidden;
    color: #8298a8;
    font-size: .72rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-account-close {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border: 1px solid #203541;
    border-radius: 7px;
    background: #0a151d;
    color: #afbfca;
    font-size: 1.35rem;
  }
  .mobile-account-sheet nav { display: grid; gap: 8px; padding-top: 14px; }
  .mobile-account-sheet nav > a,
  .mobile-account-sheet nav > button {
    min-height: 62px;
    width: 100%;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    gap: 11px;
    align-items: center;
    border: 1px solid #19303d;
    border-radius: 8px;
    padding: 9px 11px;
    background: #09141c;
    color: #ecf5fa;
    text-align: left;
  }
  .mobile-account-sheet nav > a:active,
  .mobile-account-sheet nav > button:active { border-color: #00aee2; background: #0a202b; }
  .mobile-account-sheet nav > a > span,
  .mobile-account-sheet nav > button > span {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid #214150;
    border-radius: 7px;
    color: #00c8ff;
    font-size: 1.05rem;
  }
  .mobile-account-sheet nav strong { display: block; color: #f2f8fb; font-size: .82rem; }
  .mobile-account-sheet nav small { display: block; margin-top: 3px; color: #7f94a3; font-size: .68rem; line-height: 1.3; }
  .mobile-account-sheet nav b { color: #66808f; font-size: 1.15rem; text-align: right; }
  .mobile-account-sheet .mobile-account-admin-link,
  .mobile-account-sheet .mobile-account-primary-link {
    border-color: rgba(0, 200, 255, .5);
    background: linear-gradient(135deg, rgba(0, 200, 255, .14), rgba(5, 18, 27, .96));
    box-shadow: inset 0 0 24px rgba(0, 200, 255, .04);
  }
  @keyframes mobileAccountSlideIn {
    from { opacity: 0; transform: translate3d(0, 28px, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
  }

  .mobile-search-overlay {
    position: fixed;
    inset: 0;
    z-index: 150;
    display: block;
    overflow-y: auto;
    padding: max(8px, env(safe-area-inset-top)) 12px calc(24px + env(safe-area-inset-bottom));
    background: #05080c;
    animation: mobileFadeIn 160ms ease both;
  }
  .mobile-search-overlay.hidden { display: none; }
  .mobile-search-head {
    position: sticky;
    top: 0;
    z-index: 2;
    width: min(100%, 520px);
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 7px;
    margin: 0 auto;
    padding: 2px 0 12px;
    background: #05080c;
  }
  .mobile-search-head > button {
    width: 36px;
    height: 40px;
    display: grid;
    place-items: center;
    border: 1px solid #1d303d;
    border-radius: 7px;
    background: #081119;
    color: #dce8ef;
    padding: 0;
  }
  .mobile-search-head > button svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
  }
  .mobile-search-head label {
    min-width: 0;
    height: 40px;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: center;
    overflow: hidden;
    border: 1px solid #203946;
    border-radius: 7px;
    background: #09131a;
    color: #00c8ff;
    box-shadow: inset 0 0 18px rgba(0, 200, 255, .025);
  }
  .mobile-search-head label:focus-within {
    border-color: rgba(0, 200, 255, .68);
    box-shadow: 0 0 0 2px rgba(0, 200, 255, .08);
  }
  .mobile-search-head label span { display: grid; place-items: center; }
  .mobile-search-head label span svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
  }
  .mobile-search-head input {
    min-width: 0;
    width: 100%;
    height: 100%;
    border: 0;
    outline: 0;
    padding: 0 10px 0 0;
    background: transparent;
    color: #f6f9fb;
    font: inherit;
    font-size: .84rem;
    letter-spacing: 0;
  }
  .mobile-search-head input::placeholder { color: #728391; }
  .mobile-search-content { width: min(100%, 520px); display: grid; gap: 30px; margin: 0 auto; }
  .mobile-search-content h2 { margin: 0 0 12px; color: #dfe8ef; font-size: .76rem; text-transform: uppercase; }
  .mobile-search-products { display: grid; gap: 7px; }
  .mobile-search-product { min-height: 72px; display: grid; grid-template-columns: 64px 1fr; gap: 12px; align-items: center; border: 1px solid #172a35; border-radius: 8px; padding: 5px; background: #081018; }
  .mobile-search-product > span { width: 64px; height: 60px; display: grid; place-items: center; overflow: hidden; border-radius: 6px; background: #050a0e; }
  .mobile-search-product img { width: 100%; height: 100%; object-fit: contain; }
  .mobile-search-product div { min-width: 0; display: grid; gap: 5px; }
  .mobile-search-product strong { overflow: hidden; color: #eef3f7; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-search-product small { color: #00c8ff; font-size: .72rem; font-weight: 800; }
  .mobile-search-chips { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; scroll-snap-type: x proximity; }
  .mobile-search-chips::-webkit-scrollbar { display: none; }
  .mobile-search-chips a { flex: 0 0 116px; min-height: 68px; display: grid; place-items: center; gap: 5px; overflow: hidden; border: 1px solid #1a303c; border-radius: 8px; padding: 8px; background: #081018; color: #dce7ef; scroll-snap-align: start; font-size: .68rem; font-weight: 800; text-align: center; }
  .mobile-search-chips img,
  .mobile-search-chips .category-icon-image { max-width: 78px; width: auto; height: 26px; object-fit: contain; }
  .mobile-search-empty { color: #7f909e; font-size: .8rem; }

  body[data-page="store"] { padding-top: 0; }
  body[data-page="store"] .home-page { display: flex; flex-direction: column; overflow: hidden; padding-top: var(--mobile-header-height); }
  body[data-page="store"] .home-hero { display: none; }
  .mobile-home-hero { order: 1; position: relative; display: block; height: min(660px, calc(100svh - var(--mobile-header-height) - 18px)); min-height: 540px; overflow: hidden; border-bottom: 1px solid #142630; background: #05080c; }
  .mobile-hero-track { height: 100%; display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; scroll-snap-type: x mandatory; }
  .mobile-hero-track::-webkit-scrollbar { display: none; }
  .mobile-hero-slide { position: relative; min-width: 0; height: 100%; overflow: hidden; scroll-snap-align: start; }
  .mobile-hero-slide > img { position: absolute; inset: 0; width: 100%; height: 64%; object-fit: cover; object-position: center 38%; filter: saturate(.9) contrast(1.05); }
  .mobile-hero-slide:not(:first-child) > img { object-fit: contain; padding: 10px 18px 0; background: radial-gradient(circle at 50% 32%, rgba(0, 188, 242, .12), transparent 52%), #05080c; }
  .mobile-hero-gradient { position: absolute; inset: 0; background: linear-gradient(0deg, #05080c 0%, #05080c 25%, rgba(5, 8, 12, .74) 46%, rgba(5, 8, 12, .04) 76%); }
  .mobile-hero-copy { position: absolute; inset: auto 18px 54px; z-index: 2; max-width: 360px; animation: mobileRise 420ms ease both; }
  .mobile-hero-copy small { color: #00c8ff; font-size: .67rem; font-weight: 900; text-transform: uppercase; }
  .mobile-hero-copy h1 { display: -webkit-box; overflow: hidden; margin: 9px 0 10px; color: #fff; font-size: clamp(2.2rem, 11vw, 3.15rem); line-height: 1.02; letter-spacing: 0; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .mobile-hero-copy p { margin: 0; color: #a8b7c4; font-size: .84rem; line-height: 1.5; }
  .mobile-hero-copy a { min-height: 46px; width: fit-content; min-width: 154px; display: inline-flex; align-items: center; justify-content: center; margin-top: 18px; border: 1px solid #00bff3; border-radius: 7px; padding: 0 20px; background: #079fe1; box-shadow: 0 12px 30px rgba(0, 183, 239, .2); color: #fff; font-size: .72rem; font-weight: 900; text-transform: uppercase; }
  .mobile-hero-copy a:active { transform: scale(.97); background: #00b8f4; }
  .mobile-hero-dots { position: absolute; z-index: 3; right: 18px; bottom: 26px; display: flex; gap: 6px; }
  .mobile-hero-dots button { width: 7px; height: 7px; border: 0; border-radius: 50%; padding: 0; background: #40515e; transition: width 180ms ease, border-radius 180ms ease, background 180ms ease; }
  .mobile-hero-dots button.active { width: 24px; border-radius: 7px; background: #00c8ff; box-shadow: 0 0 10px rgba(0, 200, 255, .5); }

  .mobile-benefit-strip { order: 2; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 18px 14px 8px; background: #05080c; }
  .mobile-benefit-strip article { min-width: 0; min-height: 76px; display: grid; grid-template-columns: 32px 1fr; gap: 8px; align-items: center; border: 1px solid #18303d; border-radius: 8px; padding: 11px; background: #081018; box-shadow: inset 0 0 20px rgba(0, 200, 255, .02); }
  .mobile-benefit-strip .home-benefit-icon { width: 32px; height: 32px; }
  .mobile-benefit-strip .home-benefit-icon svg { width: 27px; height: 27px; }
  .mobile-benefit-strip strong { color: #dfe8ef; font-size: .68rem; line-height: 1.25; text-transform: uppercase; }

  body[data-page="store"] #categorias { order: 3; }
  body[data-page="store"] #marcas { order: 4; }
  body[data-page="store"] #mobileLaunches { order: 5; }
  body[data-page="store"] #mais-vendidos { order: 6; }
  body[data-page="store"] #mobileNews { order: 7; }
  body[data-page="store"] #monte-seu-setup { order: 8; }
  body[data-page="store"] #vantagens { display: none; }
  body[data-page="store"] #instagram { order: 9; }

  body[data-page="store"] .home-section { width: 100%; margin: 0; padding: 46px 14px 0; }
  body[data-page="store"] .home-band { padding: 46px 14px 0; border-bottom: 0; background: #05080c; }
  body[data-page="store"] .home-section-heading { min-height: 34px; align-items: center; margin-bottom: 15px; }
  body[data-page="store"] .home-section-heading h2 { font-size: .8rem; }
  body[data-page="store"] .home-section-heading > a { min-height: 32px; padding: 0 10px; font-size: .6rem; }

  body[data-page="store"] .home-category-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 132px;
    grid-template-columns: none;
    gap: 9px;
    overflow-x: auto;
    padding: 1px 1px 8px;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
  }
  body[data-page="store"] .home-category-grid::-webkit-scrollbar { display: none; }
  body[data-page="store"] .home-category-card { min-height: 134px; border-color: #1a3441; border-radius: 9px; scroll-snap-align: start; background: #081018; }
  body[data-page="store"] .home-category-media { height: 82px; background: radial-gradient(circle, rgba(0, 200, 255, .09), transparent 60%), #070d12; }
  body[data-page="store"] .home-category-media img { padding: 7px; }
  body[data-page="store"] .home-category-card h3 { min-height: 32px; gap: 6px; margin: 8px 8px 5px; font-size: .64rem; line-height: 1.15; }
  body[data-page="store"] .home-category-icon { width: 25px; height: 25px; }
  body[data-page="store"] .home-category-icon .category-icon-image { width: 17px; height: 17px; }
  body[data-page="store"] .home-category-card small { display: none; }

  body[data-page="store"] .home-brands .home-section-heading,
  body[data-page="store"] .home-brand-row { width: 100%; }
  body[data-page="store"] .home-brand-row {
    min-height: 0;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 142px;
    grid-template-columns: none;
    gap: 9px;
    overflow-x: auto;
    padding: 1px 1px 8px;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
  }
  body[data-page="store"] .home-brand-row::-webkit-scrollbar { display: none; }
  body[data-page="store"] .home-brand-row a { height: 76px; border: 1px solid #18303d; border-radius: 9px; padding: 12px; background: #081018; filter: grayscale(1); opacity: .9; scroll-snap-align: start; }
  body[data-page="store"] .home-brand-row img { max-width: 112px; max-height: 34px; }

  body[data-page="store"] .home-product-rail { grid-auto-columns: minmax(248px, 78vw); gap: 10px; padding: 1px 1px 8px; scroll-snap-type: x mandatory; }
  body[data-page="store"] .home-product-card { min-height: 410px; grid-template-rows: 238px minmax(0, 1fr); border-color: #1a303c; border-radius: 9px; background: #081018; scroll-snap-align: start; }
  body[data-page="store"] .home-product-media img { padding: 10px; }
  body[data-page="store"] .home-product-info { padding: 15px 50px 16px 15px; }
  body[data-page="store"] .home-product-info h3 { min-height: 40px; display: -webkit-box; overflow: hidden; margin: 7px 0 11px; font-size: .86rem; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  body[data-page="store"] .home-product-info strong { font-size: 1.03rem; }
  body[data-page="store"] .home-product-info p { font-size: .68rem; }
  body[data-page="store"] .home-product-info button { width: 38px; height: 38px; border-radius: 7px; }
  .mobile-product-badge { position: absolute; z-index: 3; top: 10px; right: 10px; max-width: 120px; overflow: hidden; border: 1px solid #1b4859; border-radius: 20px; padding: 5px 8px; background: rgba(5, 16, 23, .92); color: #00c8ff; font-size: .57rem; font-weight: 900; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }

  body[data-page="store"] .home-setup-card { border-radius: 9px; }
  body[data-page="store"] .home-instagram { display: none; }
  body[data-page="store"] + .home-footer { margin-top: 48px; }

  body[data-page="products"] .products-hero { padding: 36px 16px 26px; }
  body[data-page="products"] .products-hero h1 { font-size: 2rem; line-height: 1.08; }
  body[data-page="products"] .products-hero > p { font-size: .8rem; }
  body[data-page="products"] .section,
  body[data-page="category-detail"] .category-product-section,
  body[data-page="brand-detail"] .brand-product-section { padding-left: 14px; padding-right: 14px; }
  body[data-page="products"] .filters { display: flex; flex-wrap: nowrap; gap: 7px; overflow-x: auto; padding-bottom: 6px; scrollbar-width: none; }
  body[data-page="products"] .filter { flex: 0 0 auto; min-height: 38px; border-radius: 8px; }
  body[data-page="products"] .catalog-browser-toolbar { align-items: stretch; flex-direction: column; gap: 9px; margin-bottom: 14px; padding-bottom: 14px; }
  body[data-page="products"] .catalog-search-field { width: 100%; height: 42px; }
  body[data-page="products"] .catalog-results-count { align-self: flex-end; padding-right: 2px; }
  body[data-page="products"] .catalog-pagination { align-items: center; flex-direction: column; }
  body[data-page="products"] .catalog-page-buttons { width: 100%; justify-content: center; }
  body[data-page="products"] .catalog-page-buttons button,
  body[data-page="products"] .catalog-page-ellipsis { width: 34px; height: 34px; }

  body[data-page="products"] .product-grid,
  body[data-page="category-detail"] .product-grid,
  body[data-page="brand-detail"] .product-grid,
  .related-carousel { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  body:not([data-page="store"]) .product-card { min-width: 0; min-height: 346px; grid-template-rows: 190px minmax(0, 1fr); border-radius: 9px; }
  body:not([data-page="store"]) .product-card .product-visual { height: 190px; }
  body:not([data-page="store"]) .product-card .product-photo { width: 100%; height: 100%; object-fit: contain; padding: 6px; }
  body:not([data-page="store"]) .product-card .product-info { min-width: 0; padding: 12px 10px; }
  body:not([data-page="store"]) .product-card h3 { min-height: 38px; display: -webkit-box; overflow: hidden; margin: 6px 0 10px; font-size: .76rem; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  body:not([data-page="store"]) .product-card .product-bottom { display: grid; grid-template-columns: 1fr; gap: 7px; }
  body:not([data-page="store"]) .product-card .catalog-price-block strong { font-size: .88rem; }
  body:not([data-page="store"]) .product-card .details-button,
body:not([data-page="store"]) .product-card .add-cart { min-height: 36px; width: 100%; display: inline-flex; align-items: center; justify-content: center; margin: 0; border-radius: 7px; font-size: .65rem; }
  body:not([data-page="store"]) .product-card .details-button { border-color: #1a4050; background: #09141c; color: #dce8ef; }
  body:not([data-page="store"]) .product-card .add-cart { border: 1px solid #00aee8; background: #079fe1; color: #fff; }

  .category-hero-premium { min-height: 290px; padding: 42px 16px 30px; }
  .category-hero-premium h1 { font-size: clamp(2.6rem, 14vw, 4rem); }
  .category-hero-title { align-items: center; gap: 12px; }
  .category-hero-icon { width: 58px; height: 58px; }
  .brand-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 5px; scrollbar-width: none; }
  .brand-chips a { flex: 0 0 auto; }
  .category-filter-bar { padding: 18px 14px 0; }

  body[data-page="product-detail"] .premium-product-page { padding: 12px 12px 32px; }
  body[data-page="product-detail"] .premium-product-layout { grid-template-columns: 1fr; gap: 14px; }
  body[data-page="product-detail"] .premium-product-gallery,
  body[data-page="product-detail"] .premium-buy-card,
  body[data-page="product-detail"] .premium-tabs { border-radius: 9px; }
  body[data-page="product-detail"] .premium-main-image { min-height: 0; height: auto; max-height: none; }
  body[data-page="product-detail"] .premium-main-image img { width: 100%; height: 100%; object-fit: contain; }
  body[data-page="product-detail"] .premium-buy-card { padding: 14px; }
  body[data-page="product-detail"] .premium-buy-card h1 { font-size: 1.5rem; }
  body[data-page="product-detail"] .premium-tab-list { padding: 0 8px; }
  body[data-page="product-detail"] .premium-tab-list button { min-height: 44px; padding: 0 10px; font-size: .72rem; }

  .footer,
  .home-footer { padding-bottom: 26px; }
  .footer { grid-template-columns: 1fr; gap: 24px; }
  .footer nav { display: flex; flex-wrap: wrap; gap: 8px 14px; overflow-x: visible; padding-bottom: 0; }
  .offer-link,
  .tag { color: #00c8ff !important; }
  body:not([data-page="admin"]):not([data-page="checkout"]) .primary,
  body:not([data-page="admin"]):not([data-page="checkout"]) .cart-checkout-button,
  body:not([data-page="admin"]):not([data-page="checkout"]) .promo-banner {
    border-color: #00aee8 !important;
    background: #079fe1 !important;
    color: #fff !important;
    box-shadow: 0 10px 28px rgba(0, 174, 232, .2) !important;
  }
  [data-cart-remove] { border-color: #29404e !important; color: #9fb0bf !important; }

  @keyframes mobileFadeIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes mobileRise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
}

@media (max-width: 390px) {
  body[data-page="store"] .home-product-rail { grid-auto-columns: 82vw; }
  body[data-page="products"] .product-grid,
  body[data-page="category-detail"] .product-grid,
  body[data-page="brand-detail"] .product-grid,
  .related-carousel { grid-template-columns: 1fr; }
  body:not([data-page="store"]) .product-card { min-height: 420px; grid-template-rows: 250px minmax(0, 1fr); }
  body:not([data-page="store"]) .product-card .product-visual { height: 250px; }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-home-hero *, .mobile-search-overlay *, .mobile-bottom-nav * { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Home consultation */
.home-consulting-card {
  min-height: 220px;
  display: grid;
  grid-template-columns: 72px minmax(300px, 1.25fr) minmax(270px, .9fr) auto;
  gap: 28px;
  align-items: center;
  overflow: hidden;
  border: 1px solid #1d3b49;
  border-radius: 7px;
  padding: 34px 38px;
  background: linear-gradient(115deg, rgba(0, 200, 255, .09), transparent 38%), #081018;
  box-shadow: inset 0 1px rgba(255, 255, 255, .025), 0 22px 60px rgba(0, 0, 0, .22);
}

.home-consulting-icon {
  width: 64px;
  height: 64px;
  border: 1px solid #245065;
  border-radius: 7px;
  background: #07151d;
  box-shadow: 0 0 28px rgba(0, 200, 255, .1);
}

.home-consulting-icon svg { width: 36px; height: 36px; }
.home-consulting-copy .home-kicker { margin-bottom: 10px; }
.home-consulting-copy h2 { margin: 0; color: #f4f8fb; font-size: 1.45rem; line-height: 1.18; }
.home-consulting-copy > p:last-child { max-width: 660px; margin: 12px 0 0; color: #98a9b7; font-size: .78rem; line-height: 1.65; }
.home-consulting-points { display: grid; gap: 10px; }
.home-consulting-points span { position: relative; color: #c8d4dd; font-size: .74rem; line-height: 1.35; }
.home-consulting-points span::before { content: ""; width: 5px; height: 5px; display: inline-block; margin: 0 9px 2px 0; border-radius: 50%; background: #00c8ff; box-shadow: 0 0 9px rgba(0, 200, 255, .65); }
.home-consulting-button { min-width: 226px; gap: 10px; white-space: nowrap; }
.home-consulting-button svg { width: 18px; height: 18px; fill: currentColor; }

@media (max-width: 1080px) {
  .home-consulting-card { grid-template-columns: 64px minmax(0, 1fr) auto; }
  .home-consulting-points { grid-column: 2 / -1; grid-row: 2; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  body[data-page="store"] #consultoria { order: 9; }
  body[data-page="store"] #avaliacoes { order: 10; }
  body[data-page="store"] #instagram { order: 11; }
  .home-consulting-card { min-height: 0; grid-template-columns: 48px minmax(0, 1fr); gap: 16px 14px; border-radius: 9px; padding: 22px 18px; }
  .home-consulting-icon { width: 48px; height: 48px; }
  .home-consulting-icon svg { width: 28px; height: 28px; }
  .home-consulting-copy h2 { font-size: 1.15rem; }
  .home-consulting-copy > p:last-child { font-size: .75rem; }
  .home-consulting-points { grid-column: 1 / -1; grid-row: auto; grid-template-columns: 1fr; gap: 8px; padding-top: 2px; }
  .home-consulting-button { grid-column: 1 / -1; width: 100%; min-width: 0; min-height: 48px; }
}


.account-orders-page {
  position: relative;
  z-index: 1;
  width: min(1320px, calc(100% - 8vw));
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 4rem) 0;
}

.account-orders-hero {
  display: flex;
  justify-content: space-between;
  gap: 1.25rem;
  align-items: flex-end;
  margin-bottom: 1.25rem;
  padding: clamp(1.4rem, 3vw, 2.2rem);
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background:
    radial-gradient(circle at 16% 0%, rgba(0, 200, 255, .13), transparent 34rem),
    linear-gradient(145deg, rgba(13, 20, 29, .94), rgba(5, 8, 12, .86));
  box-shadow: 0 18px 55px rgba(0, 0, 0, .24);
}

.account-orders-hero h1 {
  margin: .25rem 0 .5rem;
  color: #fff;
  font-size: clamp(2.4rem, 6vw, 4.9rem);
  line-height: .95;
  letter-spacing: 0;
}

.account-orders-hero p {
  max-width: 660px;
  margin: 0;
  color: #a3b0bf;
  line-height: 1.6;
}

.account-orders-layout {
  display: grid;
  grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr);
  gap: 1rem;
  align-items: start;
}

.account-orders-list,
.account-order-detail {
  border: 1px solid #1f2a35;
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(12, 20, 29, .92), rgba(5, 8, 12, .9));
  box-shadow: 0 18px 55px rgba(0, 0, 0, .22);
}

.account-orders-list {
  display: grid;
  gap: .65rem;
  padding: .85rem;
}

.account-order-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  width: 100%;
  min-height: 92px;
  border: 1px solid #1f2a35;
  border-radius: 7px;
  background: #080d12;
  color: #eef6fb;
  padding: .9rem;
  text-align: left;
  cursor: pointer;
}

.account-order-card:hover,
.account-order-card.is-active {
  border-color: #00aee8;
  background: rgba(0, 174, 232, .08);
}

.account-order-card span {
  min-width: 0;
  display: grid;
  gap: .25rem;
}

.account-order-card small,
.account-order-card em,
.account-detail-grid small,
.account-detail-grid span {
  color: #8ea0b3;
  font-size: .76rem;
  font-style: normal;
}

.account-order-card strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.account-order-card b {
  color: #00c8ff;
  font-size: 1rem;
}

.account-orders-empty {
  min-height: 280px;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: .75rem;
  padding: 2rem;
  color: #93a4b7;
  text-align: center;
  border: 1px dashed rgba(0, 200, 255, .24);
  border-radius: 8px;
  background: rgba(0, 200, 255, .035);
}

.account-orders-empty strong {
  color: #fff;
  font-size: 1.1rem;
}

.account-order-detail {
  min-height: 420px;
  padding: clamp(1rem, 2.4vw, 1.6rem);
}

.account-detail-heading {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  padding-bottom: 1rem;
  border-bottom: 1px solid #1b2934;
}

.account-detail-heading h2 {
  margin: .35rem 0 0;
  color: #fff;
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  letter-spacing: 0;
}

.account-status-pill {
  flex: 0 0 auto;
  border: 1px solid rgba(245, 158, 11, .85);
  border-radius: 999px;
  color: #fbbf24;
  padding: .45rem .7rem;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.account-status-pill.is-paid {
  border-color: rgba(34, 197, 94, .75);
  color: #22c55e;
}

.account-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 1rem 0;
  border: 1px solid #1f2a35;
  border-radius: 7px;
  overflow: hidden;
}

.account-detail-grid > div {
  min-height: 92px;
  display: grid;
  align-content: center;
  gap: .28rem;
  padding: .95rem;
  border-right: 1px solid #1f2a35;
}

.account-detail-grid > div:last-child {
  border-right: 0;
}

.account-detail-grid strong {
  color: #f4f8fb;
}

.account-detail-section {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid #1f2a35;
  border-radius: 7px;
  background: rgba(0, 200, 255, .025);
}

.account-detail-section header {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .75rem;
}

.account-detail-items {
  display: grid;
  gap: .55rem;
}

.account-detail-items article {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto auto;
  gap: .75rem;
  align-items: center;
  padding: .75rem 0;
  border-top: 1px solid #1a2731;
}

.account-item-icon {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid #214152;
  border-radius: 6px;
  color: #00c8ff;
  background: #071019;
}

.account-detail-items strong,
.account-detail-items small {
  display: block;
}

.account-detail-items small {
  color: #8999aa;
  margin-top: .2rem;
}

.account-detail-items em {
  color: #9dadbd;
  font-style: normal;
}

.account-detail-items b,
.account-financial-summary dd {
  color: #f8fbff;
}

.account-detail-bottom {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .72fr);
  gap: 1rem;
  margin-top: 1rem;
}

.account-detail-bottom > section {
  padding: 1rem;
  border: 1px solid #1f2a35;
  border-radius: 7px;
  background: #080d12;
}

.account-detail-bottom h3 {
  margin: .65rem 0 .35rem;
  font-size: 1.25rem;
}

.account-detail-bottom p {
  margin: 0;
  color: #91a1b1;
}

.account-financial-summary dl {
  margin: .6rem 0 0;
}

.account-financial-summary div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .55rem 0;
  border-bottom: 1px solid #1a2731;
  color: #95a5b5;
}

.account-financial-summary div:last-child {
  border-bottom: 0;
}

.account-financial-summary dd {
  margin: 0;
  font-weight: 900;
}

.account-financial-summary .positive {
  color: #22c55e;
}

.account-total dd {
  color: #00c8ff;
  font-size: 1.45rem;
}

/* Verified customer reviews */
.verified-review-card.source-google header small { color: #67d7ff; }
.verified-review-card.source-external header small { color: #8dd9c4; }
.review-source-link { color: #00c8ff !important; font-weight: 850; }
.review-product-links { display: flex; flex-wrap: wrap; gap: .35rem .7rem; }
.review-product-links a { color: #dceaf3; }
.review-product-links a + a::before { content: "+"; margin-right: .7rem; color: #00c8ff; }

/* Admin review management */
body[data-page="admin"] .admin-reviews-page { padding: 0; }
.admin-review-heading { align-items: center; }
.admin-review-heading .button { display: inline-flex; align-items: center; gap: .45rem; }
.admin-review-heading .button svg { width: 17px; height: 17px; }
.admin-review-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 1rem; border: 1px solid #1f2c37; border-radius: 8px; overflow: hidden; background: #081018; }
.admin-review-stats article { min-height: 82px; display: grid; align-content: center; gap: .25rem; padding: .9rem 1rem; border-right: 1px solid #1f2c37; }
.admin-review-stats article:last-child { border-right: 0; }
.admin-review-stats small { color: #8fa2b4; }
.admin-review-stats strong { color: #fff; font-size: 1.45rem; }
.admin-reviews-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); gap: 1rem; align-items: start; }
.admin-review-list-panel,
.admin-review-editor { border: 1px solid #1f2c37; border-radius: 8px; background: linear-gradient(145deg, rgba(12, 22, 31, .97), rgba(6, 11, 16, .97)); overflow: hidden; }
.admin-review-list-panel > header,
.admin-review-editor > header { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border-bottom: 1px solid #1c2933; }
.admin-review-list-panel h4,
.admin-review-editor h4 { margin: 0 0 .25rem; color: #fff; font-size: 1.05rem; }
.admin-review-list-panel header p,
.admin-review-editor header p { margin: 0; color: #8295a7; font-size: .8rem; }
.admin-review-list { max-height: 660px; overflow: auto; padding: .7rem; }
.admin-review-row { width: 100%; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: .75rem; margin-bottom: .55rem; padding: .8rem; border: 1px solid #1c2b36; border-radius: 7px; background: #080e14; color: #eaf4fb; text-align: left; cursor: pointer; }
.admin-review-row:hover,
.admin-review-row.is-selected { border-color: #00aee8; background: rgba(0, 174, 232, .08); }
.admin-review-avatar { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid #16506a; border-radius: 6px; background: #08202c; color: #00c8ff; font-weight: 900; }
.admin-review-row-copy { min-width: 0; display: grid; gap: .3rem; }
.admin-review-row-copy > span { display: flex; align-items: center; gap: .5rem; min-width: 0; }
.admin-review-row-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-review-row-copy small { display: flex; align-items: center; gap: .45rem; color: #91a6b8; overflow: hidden; white-space: nowrap; }
.admin-review-row-copy .review-stars { font-size: .72rem; }
.admin-review-row-copy p { margin: 0; color: #8c9cab; font-size: .78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-origin { flex: 0 0 auto; border: 1px solid #27404f; border-radius: 999px; padding: .18rem .42rem; color: #9eb2c2; font-size: .62rem; font-style: normal; font-weight: 900; text-transform: uppercase; }
.review-origin.source-purchase { border-color: rgba(34, 197, 94, .45); color: #5ee48a; }
.review-origin.source-google { border-color: rgba(0, 200, 255, .45); color: #67d7ff; }
.review-origin.source-external { border-color: rgba(87, 190, 167, .45); color: #8dd9c4; }
.admin-review-row > b { color: #4ade80; font-size: .68rem; text-transform: uppercase; }
.admin-review-row > b.is-hidden { color: #94a3b8; }
.admin-review-editor { position: sticky; top: 80px; }
.admin-review-form { padding: 1rem; }
.admin-review-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.admin-review-form-grid label { display: grid; gap: .38rem; color: #afbdca; font-size: .75rem; font-weight: 850; }
.admin-review-form-grid label.full { grid-column: 1 / -1; }
.admin-review-products-field { display: grid; grid-column: 1 / -1; gap: .38rem; color: #afbdca; font-size: .75rem; font-weight: 850; }
.admin-review-products-field > small { color: #718597; font-weight: 500; }
.admin-review-form input,
.admin-review-form select,
.admin-review-form textarea { width: 100%; min-height: 42px; border: 1px solid #243440; border-radius: 6px; background: #071018; color: #f5f9fc; padding: .7rem .75rem; }
.admin-review-form textarea { min-height: 116px; resize: vertical; }
.admin-review-form :disabled { opacity: .68; cursor: not-allowed; }
.admin-review-form-grid label small { color: #718597; font-weight: 500; }
.admin-review-product-picker { max-height: 230px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; overflow: auto; padding: .55rem; border: 1px solid #243440; border-radius: 6px; background: #071018; }
.admin-review-form-grid .admin-review-product-picker label { min-height: 50px; display: flex; align-items: center; gap: .65rem; padding: .55rem; border: 1px solid #1b2a35; border-radius: 6px; background: #0a1219; cursor: pointer; }
.admin-review-form-grid .admin-review-product-picker label:has(input:checked) { border-color: #00aee8; background: rgba(0, 174, 232, .09); }
.admin-review-form-grid .admin-review-product-picker input { flex: 0 0 auto; width: 18px; min-height: 18px; accent-color: #00aee8; }
.admin-review-product-picker span { min-width: 0; display: grid; gap: .18rem; }
.admin-review-product-picker strong { overflow: hidden; color: #eef7fc; font-size: .75rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-review-purchase-products { min-height: 42px; display: flex; align-items: center; border: 1px solid rgba(34, 197, 94, .26); border-radius: 6px; background: rgba(34, 197, 94, .06); color: #dff9e7; padding: .7rem .75rem; }
.admin-review-published { display: flex; align-items: center; gap: .55rem; margin: 1rem 0; color: #d9e5ed; font-weight: 850; }
.admin-review-published input { width: 18px; min-height: 18px; accent-color: #00aee8; }
.admin-review-notice { display: flex; gap: .7rem; margin: 1rem 1rem 0; padding: .8rem; border: 1px solid rgba(34, 197, 94, .28); border-radius: 7px; background: rgba(34, 197, 94, .07); color: #a9b8c5; font-size: .78rem; }
.admin-review-notice svg { flex: 0 0 auto; width: 20px; color: #4ade80; }
.admin-review-notice span { display: grid; gap: .2rem; }
.admin-review-notice strong { color: #e9fff0; }
.admin-review-actions { display: flex; justify-content: flex-end; gap: .65rem; padding-top: 1rem; border-top: 1px solid #1b2933; }
.admin-review-actions .button { display: inline-flex; align-items: center; gap: .4rem; }
.admin-review-actions svg { width: 17px; height: 17px; }
.admin-review-status { min-height: 1.2rem; margin: .65rem 0 0; color: #65d8ff; font-size: .78rem; text-align: right; }

@media (max-width: 1000px) {
  .admin-reviews-layout { grid-template-columns: 1fr; }
  .admin-review-editor { position: static; }
}

@media (max-width: 680px) {
  .admin-review-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-review-stats article:nth-child(2) { border-right: 0; }
  .admin-review-stats article:nth-child(-n+2) { border-bottom: 1px solid #1f2c37; }
  .admin-review-form-grid { grid-template-columns: 1fr; }
  .admin-review-product-picker { grid-template-columns: 1fr; }
  .admin-review-form-grid label.full { grid-column: auto; }
  .admin-review-row { grid-template-columns: 40px minmax(0, 1fr); }
  .admin-review-row > b { grid-column: 2; }
}

/* Reviews admin v2 */
.admin-review-browser { overflow: hidden; border: 1px solid #1b2b36; border-radius: 8px; background: #071019; box-shadow: 0 18px 45px rgba(0, 0, 0, .22); }
.admin-reviews-page .button.primary { border-color: #00a9dd; background: #079fda; color: #fff; box-shadow: 0 8px 22px rgba(0, 159, 218, .16); }
.admin-reviews-page .button.primary:hover { border-color: #31d5ff; background: #00b8ef; box-shadow: 0 10px 28px rgba(0, 184, 239, .22); }
.admin-review-tabs { min-height: 58px; display: flex; align-items: stretch; gap: 1.4rem; overflow-x: auto; padding: 0 1.25rem; border-bottom: 1px solid #172630; scrollbar-width: none; }
.admin-review-tabs::-webkit-scrollbar { display: none; }
.admin-review-tabs button { position: relative; flex: 0 0 auto; display: inline-flex; align-items: center; gap: .45rem; border: 0; background: transparent; color: #8ea1b1; font: inherit; font-size: .82rem; font-weight: 850; cursor: pointer; }
.admin-review-tabs button span { min-width: 24px; border: 1px solid #243743; border-radius: 999px; padding: .13rem .4rem; color: #718899; font-size: .65rem; text-align: center; }
.admin-review-tabs button::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: #00c8ff; opacity: 0; transform: scaleX(.5); transition: opacity .18s ease, transform .18s ease; }
.admin-review-tabs button:hover,
.admin-review-tabs button.active { color: #38d4ff; }
.admin-review-tabs button.active span { border-color: rgba(0, 200, 255, .42); color: #6cddff; background: rgba(0, 200, 255, .08); }
.admin-review-tabs button.active::after { opacity: 1; transform: scaleX(1); box-shadow: 0 0 12px rgba(0, 200, 255, .52); }
.admin-review-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) auto 42px; gap: .7rem; padding: 1rem 1.25rem; border-bottom: 1px solid #172630; }
.admin-review-search { position: relative; display: block; }
.admin-review-search svg { position: absolute; top: 50%; left: .8rem; width: 17px; transform: translateY(-50%); color: #708596; pointer-events: none; }
.admin-review-search input,
.admin-review-filter-panel select { width: 100%; min-height: 42px; border: 1px solid #20323e; border-radius: 6px; outline: 0; background: #050c12; color: #eef7fc; padding: .65rem .8rem; }
.admin-review-search input { padding-left: 2.45rem; }
.admin-review-search input:focus,
.admin-review-filter-panel select:focus { border-color: #00b8ef; box-shadow: 0 0 0 2px rgba(0, 184, 239, .1); }
.admin-review-filter-toggle,
.admin-review-refresh { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: .45rem; border: 1px solid #253846; border-radius: 6px; background: #0a141c; color: #d9e8f1; font: inherit; font-size: .78rem; font-weight: 850; cursor: pointer; }
.admin-review-filter-toggle { padding: 0 .9rem; }
.admin-review-filter-toggle svg,
.admin-review-refresh svg { width: 17px; height: 17px; }
.admin-review-filter-toggle span { min-width: 20px; border-radius: 999px; background: #00b8ef; color: #001019; padding: .12rem .35rem; font-size: .65rem; }
.admin-review-filter-toggle:hover,
.admin-review-filter-toggle.active,
.admin-review-refresh:hover { border-color: #00aedd; color: #40d5ff; background: rgba(0, 184, 239, .08); }
.admin-review-filter-panel { display: grid; grid-template-columns: repeat(5, minmax(130px, 1fr)) auto; align-items: end; gap: .7rem; padding: 1rem 1.25rem; border-bottom: 1px solid #172630; background: #08131b; }
.admin-review-filter-panel label { display: grid; gap: .35rem; color: #8297a8; font-size: .69rem; font-weight: 850; }
.admin-review-filter-panel button { min-height: 42px; border: 0; background: transparent; color: #55cff3; font: inherit; font-size: .72rem; font-weight: 850; cursor: pointer; white-space: nowrap; }
.admin-review-card-list { display: grid; gap: .7rem; padding: 1rem; }
.admin-review-card { min-height: 154px; display: grid; grid-template-columns: minmax(230px, .8fr) minmax(320px, 1.5fr) 150px 44px; align-items: stretch; border: 1px solid #1d2e39; border-radius: 7px; background: linear-gradient(135deg, #09131b, #070d13); color: #eaf4fa; transition: border-color .18s ease, background-color .18s ease; }
.admin-review-card:hover { border-color: #28566b; background: linear-gradient(135deg, #0a1822, #070e14); }
.admin-review-card-product { min-width: 0; display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: .8rem; align-items: center; padding: .9rem; border-right: 1px solid #182833; }
.admin-review-product-media { width: 92px; height: 92px; overflow: hidden; border: 1px solid #1e3340; border-radius: 6px; background: #03070a; }
.admin-review-product-media img { width: 100%; height: 100%; display: block; object-fit: contain; }
.admin-review-product-placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: #32718b; background: repeating-linear-gradient(135deg, #0b1720 0 7px, #0e1b25 7px 14px); }
.admin-review-product-placeholder svg { width: 27px; height: 27px; }
.admin-review-product-copy { min-width: 0; display: grid; align-content: center; gap: .32rem; }
.admin-review-product-copy > strong { overflow: hidden; color: #fff; font-size: .84rem; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.admin-review-product-copy small { color: #7e93a4; font-size: .69rem; }
.admin-review-product-copy > span { display: flex; align-items: center; gap: .45rem; color: #00c8ff; font-size: .73rem; }
.admin-review-product-copy .review-stars { color: #00c8ff; letter-spacing: 1px; }
.admin-review-product-copy > span b { color: #9fb3c2; }
.admin-review-card-content { min-width: 0; display: grid; align-content: center; gap: .38rem; padding: 1rem 1.15rem; border-right: 1px solid #182833; }
.admin-review-customer { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.admin-review-customer > strong { overflow: hidden; color: #f5f9fc; font-size: .81rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-review-customer > span { flex: 0 0 auto; display: inline-flex; align-items: center; gap: .25rem; border: 1px solid rgba(0, 200, 255, .35); border-radius: 999px; background: rgba(0, 200, 255, .08); color: #54d7ff; padding: .17rem .42rem; font-size: .61rem; font-weight: 850; }
.admin-review-customer > span svg { width: 12px; height: 12px; }
.admin-review-customer em { margin-left: auto; color: #657d8f; font-size: .62rem; font-style: normal; white-space: nowrap; }
.admin-review-card-content h4 { margin: .1rem 0 0; color: #eaf5fb; font-size: .87rem; }
.admin-review-card-content p { margin: 0; overflow: hidden; color: #91a4b3; font-size: .76rem; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.admin-review-card-meta { display: grid; align-content: center; justify-items: start; gap: .65rem; padding: 1rem; border-right: 1px solid #182833; }
.admin-review-card-meta time { color: #718697; font-size: .68rem; line-height: 1.45; }
.admin-review-status-badge { display: inline-flex; align-items: center; border: 1px solid; border-radius: 999px; padding: .24rem .52rem; font-size: .62rem; font-weight: 900; text-transform: uppercase; }
.admin-review-status-badge.status-published { border-color: rgba(34, 197, 94, .38); background: rgba(34, 197, 94, .08); color: #55d984; }
.admin-review-status-badge.status-pending { border-color: rgba(245, 178, 27, .4); background: rgba(245, 178, 27, .08); color: #f6c44f; }
.admin-review-status-badge.status-rejected { border-color: rgba(239, 78, 98, .38); background: rgba(239, 78, 98, .07); color: #f27686; }
.admin-review-status-badge.status-draft { border-color: #41515d; background: rgba(148, 163, 184, .07); color: #aebbc5; }
.admin-review-card-actions { display: grid; align-content: center; gap: .4rem; padding: .55rem; }
.admin-review-card-actions button,
.admin-review-modal > header > button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #253845; border-radius: 5px; background: #0a141c; color: #a9bbc8; cursor: pointer; }
.admin-review-card-actions button svg,
.admin-review-modal > header > button svg { width: 15px; height: 15px; }
.admin-review-card-actions button:hover,
.admin-review-modal > header > button:hover { border-color: #00b8ef; color: #54d9ff; background: rgba(0, 184, 239, .09); }
.admin-review-card-actions button.danger:hover { border-color: #8f3342; color: #f27484; background: rgba(239, 78, 98, .08); }
.admin-review-list-footer { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1.25rem; border-top: 1px solid #172630; }
.admin-review-list-footer p { margin: 0; color: #7e93a3; font-size: .74rem; }
.admin-review-pagination { display: flex; align-items: center; gap: .35rem; }
.admin-review-pagination button,
.admin-review-pagination span { min-width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #243642; border-radius: 5px; background: #081119; color: #91a4b3; font: inherit; font-size: .72rem; }
.admin-review-pagination button { cursor: pointer; }
.admin-review-pagination button:hover,
.admin-review-pagination button.active { border-color: #00b8ef; background: rgba(0, 184, 239, .09); color: #48d5ff; }
.admin-review-pagination button:disabled { opacity: .35; cursor: default; }
.admin-review-pagination svg { width: 15px; }
.admin-review-feedback { min-height: 330px; display: grid; place-items: center; align-content: center; gap: .55rem; color: #708697; text-align: center; }
.admin-review-feedback > svg { width: 34px; height: 34px; color: #28647b; }
.admin-review-feedback strong { color: #edf7fc; font-size: 1rem; }
.admin-review-feedback p { margin: 0 0 .45rem; font-size: .78rem; }
.admin-review-feedback.error > svg { color: #e9a93b; }
.admin-review-skeleton { position: relative; grid-template-columns: 260px 1fr 150px; overflow: hidden; pointer-events: none; }
.admin-review-skeleton::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 20%, rgba(109, 168, 195, .09) 45%, transparent 70%); transform: translateX(-100%); animation: admin-review-shimmer 1.3s infinite; }
.admin-review-skeleton > span { margin: 1rem; border-radius: 6px; background: #101d26; }
.admin-review-skeleton > div { display: grid; align-content: center; gap: .65rem; padding: 1rem; border-inline: 1px solid #182833; }
.admin-review-skeleton i,
.admin-review-skeleton b { display: block; height: 12px; border-radius: 3px; background: #12222d; }
.admin-review-skeleton i:nth-child(1) { width: 36%; }
.admin-review-skeleton i:nth-child(2) { width: 72%; }
.admin-review-skeleton i:nth-child(3) { width: 94%; }
.admin-review-skeleton > b { width: 74px; margin: auto; }
@keyframes admin-review-shimmer { to { transform: translateX(100%); } }
.admin-review-modal-backdrop { position: fixed; z-index: 1200; inset: 0; display: grid; place-items: center; padding: 1.25rem; background: rgba(1, 5, 8, .82); backdrop-filter: blur(8px); }
.admin-review-modal { width: min(760px, 100%); max-height: calc(100vh - 2.5rem); overflow: auto; border: 1px solid #24404f; border-radius: 8px; background: #071019; box-shadow: 0 22px 80px rgba(0, 0, 0, .6), 0 0 28px rgba(0, 184, 239, .07); }
.admin-review-modal > header { position: sticky; z-index: 2; top: 0; min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border-bottom: 1px solid #1a2b36; background: rgba(7, 16, 25, .97); }
.admin-review-modal > header h4 { margin: .12rem 0; color: #fff; font-size: 1.08rem; }
.admin-review-modal > header p { margin: 0; color: #8195a5; font-size: .72rem; }
.admin-review-modal .admin-review-form { padding: 1rem; }
.admin-review-view-body { display: grid; gap: 1rem; padding: 1.15rem; }
.admin-review-view-product { display: flex; align-items: center; gap: .8rem; padding-bottom: 1rem; border-bottom: 1px solid #1a2a34; }
.admin-review-view-product img,
.admin-review-view-product > .admin-review-product-placeholder { width: 72px; height: 72px; flex: 0 0 auto; object-fit: contain; border: 1px solid #213642; border-radius: 6px; background-color: #03070a; }
.admin-review-view-product div { display: grid; gap: .3rem; }
.admin-review-view-product strong { color: #fff; }
.admin-review-view-product small { color: #7990a1; }
.admin-review-view-heading { display: flex; align-items: center; justify-content: space-between; gap: .8rem; }
.admin-review-view-heading > div { display: flex; align-items: center; gap: .5rem; }
.admin-review-view-heading > div > strong { color: #f3f8fb; }
.admin-review-view-heading > div > span { display: inline-flex; align-items: center; gap: .25rem; color: #4ed6ff; font-size: .7rem; }
.admin-review-view-heading svg { width: 14px; }
.admin-review-view-rating { display: flex; align-items: center; gap: .55rem; color: #00c8ff; }
.admin-review-view-rating .review-stars { color: #00c8ff; letter-spacing: 2px; }
.admin-review-view-body h3 { margin: 0; color: #fff; font-size: 1.2rem; }
.admin-review-view-body > p { margin: 0; color: #9eb0bd; line-height: 1.7; white-space: pre-wrap; }
.admin-review-view-body footer { display: flex; justify-content: space-between; gap: .8rem; padding-top: 1rem; border-top: 1px solid #1a2a34; color: #718797; font-size: .72rem; }
.admin-review-modal-footer { display: flex; justify-content: flex-end; gap: .65rem; padding: 0 1.15rem 1.15rem; }
.admin-review-modal-footer .button { display: inline-flex; align-items: center; gap: .4rem; }
.admin-review-modal-footer svg { width: 16px; }
.admin-review-toast { position: fixed; z-index: 1400; right: 1.25rem; bottom: 1.25rem; min-width: 280px; display: flex; align-items: center; gap: .65rem; border: 1px solid rgba(34, 197, 94, .38); border-radius: 7px; background: #08150f; color: #dff9e7; padding: .85rem 1rem; box-shadow: 0 16px 45px rgba(0, 0, 0, .45); animation: admin-review-toast-in .22s ease both; }
.admin-review-toast.tone-error { border-color: rgba(239, 78, 98, .4); background: #170b0e; color: #ffdfe3; }
.admin-review-toast svg { width: 19px; color: #4ade80; }
.admin-review-toast.tone-error svg { color: #f27484; }
@keyframes admin-review-toast-in { from { opacity: 0; transform: translateY(10px); } }

@media (max-width: 1180px) {
  .admin-review-filter-panel { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .admin-review-card { grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.3fr) 135px 44px; }
}

@media (max-width: 900px) {
  .admin-shell:has(.admin-reviews-page) { grid-template-columns: minmax(0, 1fr); }
  .admin-shell:has(.admin-reviews-page) > .admin-sidebar { display: none; }
  .admin-shell:has(.admin-reviews-page) > .admin-workspace { width: 100%; min-width: 0; padding: 18px 14px 32px; }
  .admin-review-card { grid-template-columns: minmax(210px, .85fr) minmax(250px, 1.15fr) 118px; }
  .admin-review-card-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; border-top: 1px solid #182833; }
  .admin-review-card-meta { border-right: 0; }
}

@media (max-width: 680px) {
  .admin-review-heading { align-items: flex-start; gap: .9rem; }
  .admin-review-heading .button { width: 100%; justify-content: center; }
  .admin-review-tabs { min-height: 52px; gap: 1rem; padding-inline: .9rem; }
  .admin-review-toolbar { grid-template-columns: 1fr auto; padding: .8rem; }
  .admin-review-search { grid-column: 1 / -1; }
  .admin-review-filter-toggle { justify-self: stretch; }
  .admin-review-filter-panel { grid-template-columns: 1fr; padding: .8rem; }
  .admin-review-card-list { padding: .7rem; }
  .admin-review-card { grid-template-columns: 1fr; }
  .admin-review-card-product { grid-template-columns: 78px minmax(0, 1fr); border-right: 0; border-bottom: 1px solid #182833; }
  .admin-review-product-media { width: 78px; height: 78px; }
  .admin-review-card-content { border-right: 0; border-bottom: 1px solid #182833; }
  .admin-review-customer { flex-wrap: wrap; }
  .admin-review-customer em { width: 100%; margin-left: 0; }
  .admin-review-card-meta { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #182833; }
  .admin-review-card-actions { grid-column: auto; justify-content: flex-start; border-top: 0; }
  .admin-review-list-footer { align-items: flex-start; flex-direction: column; }
  .admin-review-pagination { width: 100%; justify-content: flex-end; }
  .admin-review-modal-backdrop { align-items: end; padding: 0; }
  .admin-review-modal { width: 100%; max-height: 94vh; border-radius: 8px 8px 0 0; }
  .admin-review-form-grid { grid-template-columns: 1fr; }
  .admin-review-form-grid label.full { grid-column: auto; }
  .admin-review-product-picker { grid-template-columns: 1fr; }
  .admin-review-actions,
  .admin-review-modal-footer { display: grid; grid-template-columns: 1fr 1fr; }
  .admin-review-actions .button,
  .admin-review-modal-footer .button { justify-content: center; }
  .admin-review-view-heading,
  .admin-review-view-body footer { align-items: flex-start; flex-direction: column; }
  .admin-review-toast { right: .75rem; bottom: .75rem; left: .75rem; min-width: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-review-skeleton::after,
  .admin-review-toast { animation: none; }
}

.home-reviews {
  border-block: 1px solid #14232e;
  background: #060b10;
}

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

.verified-review-card {
  min-width: 0;
  padding: 24px;
  border: 1px solid #1b303e;
  border-radius: 8px;
  background: #09121a;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%);
}

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

.review-avatar {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #087aa0;
  border-radius: 50%;
  color: #00c8ff;
  background: #07202b;
  font-weight: 900;
}

.verified-review-card header strong,
.verified-review-card header small {
  display: block;
}

.verified-review-card header strong {
  color: #f7fbff;
}

.verified-review-card header small {
  margin-top: 3px;
  color: #17d88b;
  font-size: .75rem;
  font-weight: 800;
}

.review-stars {
  display: inline-flex;
  gap: 2px;
  color: #30414d;
  white-space: nowrap;
}

.review-stars .filled {
  color: #00c8ff;
}

.verified-review-card h3 {
  margin: 22px 0 8px;
  color: #fff;
  font-size: 1.08rem;
}

.verified-review-card > p {
  margin: 0;
  color: #aebbc7;
  line-height: 1.7;
}

.verified-review-card footer {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid #172834;
}

.verified-review-card footer a {
  overflow: hidden;
  color: #70dfff;
  font-size: .8rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.verified-review-card footer time {
  flex: 0 0 auto;
  color: #708494;
  font-size: .78rem;
}

.verified-review-card.compact {
  padding: 20px;
}

.reviews-empty-home,
.reviews-empty {
  grid-column: 1 / -1;
  padding: 34px;
  border: 1px dashed #18516a;
  border-radius: 8px;
  color: #91a7b8;
  background: #07141c;
  text-align: center;
}

.reviews-empty-home strong,
.reviews-empty-home span {
  display: block;
}

.reviews-empty-home strong,
.reviews-empty strong {
  color: #f5f9fc;
}

.reviews-empty-home span,
.reviews-empty p {
  margin: 8px 0 0;
}

/* Home reviews */
.home-reviews {
  overflow: hidden;
  padding-block: clamp(64px, 7vw, 104px);
  border-block: 1px solid #14232e;
  background: #05090d;
}

.home-reviews-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, .7fr) auto;
  align-items: center;
  gap: clamp(28px, 5vw, 72px);
  margin-bottom: 36px;
}

.home-reviews-intro h2 {
  max-width: 660px;
  margin: 7px 0 10px;
  color: #f7fbff;
  font-size: clamp(1.85rem, 3vw, 3rem);
  line-height: 1.05;
}

.home-reviews-intro > p:last-child {
  max-width: 600px;
  margin: 0;
  color: #8fa3b4;
  line-height: 1.65;
}

.home-reviews-summary {
  min-height: 76px;
}

.home-reviews-score {
  display: flex;
  align-items: center;
  gap: 16px;
}

.home-reviews-score > strong {
  color: #f8fcff;
  font-size: 2.6rem;
  line-height: 1;
}

.home-reviews-score > div,
.home-reviews-score > div > span:last-child {
  display: block;
}

.home-reviews-score .review-stars {
  font-size: 1.05rem;
}

.home-reviews-score > div > span:last-child {
  margin-top: 7px;
  color: #778c9d;
  font-size: .76rem;
}

.home-reviews-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}

.home-reviews-badges span {
  padding: 5px 9px;
  border: 1px solid #17455a;
  border-radius: 4px;
  color: #8edfff;
  background: #07151d;
  font-size: .67rem;
  font-weight: 850;
  text-transform: uppercase;
}

.home-reviews-all {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #25404f;
  border-radius: 5px;
  color: #eef8ff;
  font-size: .78rem;
  font-weight: 850;
  white-space: nowrap;
  transition: border-color .2s ease, color .2s ease, background .2s ease;
}

.home-reviews-all:hover {
  border-color: #00b8ff;
  color: #00c8ff;
  background: #071822;
}

.home-reviews-carousel {
  position: relative;
}

.home-reviews .home-review-grid {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  padding: 2px;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
}

.home-reviews .home-review-grid::-webkit-scrollbar {
  display: none;
}

.home-review-card {
  display: flex;
  flex: 0 0 calc((100% - 32px) / 3);
  min-width: 0;
  min-height: 390px;
  flex-direction: column;
  padding: 24px;
  border: 1px solid #172d3a;
  border-radius: 7px;
  background: #081119;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 3%);
  scroll-snap-align: start;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.home-reviews .home-review-grid[data-review-count="1"] .home-review-card { flex-basis: 100%; }
.home-reviews .home-review-grid[data-review-count="2"] .home-review-card { flex-basis: calc((100% - 16px) / 2); }

.home-review-card:hover,
.home-review-card:focus-visible {
  border-color: #087ba2;
  box-shadow: 0 0 24px rgb(0 184 255 / 7%), inset 0 1px 0 rgb(255 255 255 / 4%);
  outline: none;
  transform: translateY(-2px);
}

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

.home-review-avatar {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid #087aa0;
  border-radius: 50%;
  color: #00c8ff;
  background: #07202b;
  font-weight: 900;
}

.home-review-customer strong,
.home-review-customer small,
.home-review-rating time {
  display: block;
}

.home-review-customer strong {
  overflow: hidden;
  color: #f7fbff;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.home-review-customer small {
  margin-top: 4px;
  color: #50ddb0;
  font-size: .7rem;
  font-weight: 800;
}

.home-review-customer small.source-google {
  color: #67d7ff;
}

.home-review-rating {
  text-align: right;
}

.home-review-rating time {
  margin-top: 5px;
  color: #6f8292;
  font-size: .7rem;
}

.home-review-card-copy {
  flex: 1;
  padding: 25px 0 22px;
}

.home-review-card-copy h3 {
  margin: 0 0 10px;
  color: #f7fbff;
  font-size: 1.05rem;
}

.home-review-card-copy p {
  margin: 0;
  color: #a6b5c1;
  font-size: .9rem;
  line-height: 1.67;
}

.home-review-card-copy p.is-clamped {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.home-review-card-copy button {
  margin-top: 10px;
  padding: 0;
  border: 0;
  color: #59d8ff;
  background: transparent;
  font-size: .74rem;
  font-weight: 800;
  cursor: pointer;
}

.home-review-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 82px;
  padding-top: 16px;
  border-top: 1px solid #172834;
}

.home-review-products {
  display: grid;
  flex: 1;
  min-width: 0;
  gap: 7px;
}

.home-review-product {
  display: grid;
  min-width: 0;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  color: #dce9f2;
}

.home-review-product-media,
.home-review-product-placeholder {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  overflow: hidden;
  border: 1px solid #173342;
  border-radius: 5px;
  background: #04090d;
}

.home-review-product-placeholder {
  padding: 5px;
  color: #617585;
  font-size: .54rem;
  line-height: 1.15;
  text-align: center;
}

.home-review-product img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.home-review-product strong {
  display: -webkit-box;
  overflow: hidden;
  max-width: 150px;
  font-size: .76rem;
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.home-review-product-more {
  padding-left: 63px;
  color: #748b9d;
  font-size: .68rem;
}

.home-review-google {
  flex: 0 0 auto;
  color: #5bdcff;
  font-size: .72rem;
  font-weight: 850;
}

.home-reviews-arrow {
  position: absolute;
  z-index: 2;
  top: 50%;
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid #1b465a;
  border-radius: 50%;
  color: #dff7ff;
  background: #071119;
  box-shadow: 0 0 18px rgb(0 184 255 / 8%);
  cursor: pointer;
  transform: translateY(-50%);
}

.home-reviews-arrow span {
  font-size: 1.65rem;
  line-height: 1;
}

.home-reviews-arrow.previous { left: -19px; }
.home-reviews-arrow.next { right: -19px; }
.home-reviews-arrow:disabled { opacity: .25; cursor: default; }
.home-reviews-carousel.is-empty .home-reviews-arrow { display: none; }

.home-reviews-dots {
  display: none;
  justify-content: center;
  gap: 6px;
  margin-top: 18px;
}

.home-reviews-dots button {
  width: 6px;
  height: 6px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #29404f;
}

.home-reviews-dots button.active {
  width: 20px;
  border-radius: 5px;
  background: #00b8ff;
}

.home-reviews-trust {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-top: 32px;
  border-block: 1px solid #142733;
}

.home-reviews-trust span {
  display: flex;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 14px 12px;
  color: #9aacb9;
  font-size: .72rem;
  font-weight: 800;
  text-align: center;
}

.home-reviews-trust span > svg {
  width: 19px;
  height: 19px;
  flex: 0 0 19px;
  fill: none;
  stroke: #00b8ff;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.home-reviews-trust span + span { border-left: 1px solid #142733; }

.home-reviews-feedback {
  flex: 1 0 100%;
  padding: 42px 20px;
  border: 1px dashed #18516a;
  border-radius: 7px;
  color: #a7b8c5;
  background: #07141c;
  text-align: center;
}

.home-reviews-feedback strong { display: block; color: #eef8ff; }
.home-reviews-feedback button { margin-top: 14px; padding: 10px 14px; border: 1px solid #167a9e; border-radius: 4px; color: #dff8ff; background: #08202b; font-weight: 800; }
.home-reviews-summary-loading { color: #7f93a2; font-size: .8rem; }

.home-review-skeleton { pointer-events: none; }
.home-review-skeleton header { display: grid; grid-template-columns: 44px 1fr 80px; gap: 12px; }
.home-review-skeleton i,
.home-review-skeleton span,
.home-review-skeleton b,
.home-review-skeleton strong,
.home-review-skeleton p,
.home-review-skeleton footer { display: block; height: 12px; border-radius: 4px; background: linear-gradient(100deg, #10202a 20%, #17313f 40%, #10202a 60%); background-size: 220% 100%; animation: home-review-shimmer 1.5s linear infinite; }
.home-review-skeleton i { width: 44px; height: 44px; border-radius: 50%; }
.home-review-skeleton header span { margin-top: 7px; }
.home-review-skeleton header b { margin-top: 7px; }
.home-review-skeleton > div { padding: 28px 0; }
.home-review-skeleton strong { width: 62%; margin-bottom: 22px; }
.home-review-skeleton p { margin: 10px 0; }
.home-review-skeleton footer { height: 72px; margin-top: auto; }

@keyframes home-review-shimmer { to { background-position-x: -220%; } }

@media (max-width: 1080px) {
  .home-reviews-heading { grid-template-columns: minmax(0, 1fr) auto; }
  .home-reviews-summary { grid-column: 1; grid-row: 2; }
  .home-reviews-all { grid-column: 2; grid-row: 1 / span 2; }
  .home-review-card { flex-basis: calc((100% - 16px) / 2); }
  .home-reviews-trust { grid-template-columns: repeat(3, 1fr); }
  .home-reviews-trust span:nth-child(4) { border-left: 0; }
}

@media (max-width: 680px) {
  .home-reviews { padding-block: 58px; }
  .home-reviews-heading { display: flex; align-items: stretch; flex-direction: column; gap: 22px; margin-bottom: 28px; }
  .home-reviews-intro h2 { font-size: 2rem; }
  .home-reviews-all { width: 100%; }
  .home-reviews-score > strong { font-size: 2.25rem; }
  .home-review-card { flex-basis: 100%; min-height: 410px; padding: 19px; }
  .home-reviews .home-review-grid[data-review-count="1"] .home-review-card,
  .home-reviews .home-review-grid[data-review-count="2"] .home-review-card { flex-basis: 100%; }
  .home-review-card-head { grid-template-columns: 40px minmax(0, 1fr); }
  .home-review-avatar { width: 40px; height: 40px; }
  .home-review-rating { grid-column: 2; text-align: left; }
  .home-review-rating time { display: inline; margin-left: 9px; }
  .home-review-card-footer { align-items: flex-start; flex-direction: column; }
  .home-review-product strong { max-width: 180px; }
  .home-reviews-arrow { width: 32px; height: 32px; }
  .home-reviews-arrow.previous { left: -9px; }
  .home-reviews-arrow.next { right: -9px; }
  .home-reviews-dots { display: flex; }
  .home-reviews-trust { display: flex; overflow-x: auto; margin-top: 28px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .home-reviews-trust span { flex: 0 0 72%; scroll-snap-align: start; }
  .home-reviews-trust span + span { border-left: 1px solid #142733; }
}

@media (prefers-reduced-motion: reduce) {
  .home-reviews .home-review-grid { scroll-behavior: auto; }
  .home-review-card { transition: none; }
  .home-review-card:hover { transform: none; }
  .home-review-skeleton i,
  .home-review-skeleton span,
  .home-review-skeleton b,
  .home-review-skeleton strong,
  .home-review-skeleton p,
  .home-review-skeleton footer { animation: none; }
}

.reviews-page {
  width: min(1320px, calc(100% - 48px));
  margin: 0 auto;
  padding: 56px 0 100px;
}

.reviews-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(260px, .7fr);
  align-items: end;
  gap: 32px;
  padding: 54px;
  border: 1px solid #1b303e;
  border-radius: 8px;
  background: #071018;
}

.reviews-hero h1 {
  max-width: 780px;
  margin: 10px 0 18px;
  color: #fff;
  font-size: clamp(2.5rem, 5vw, 4.9rem);
  line-height: .98;
  letter-spacing: 0;
}

.reviews-hero h1 span,
.reviews-page .eyebrow {
  color: #00c8ff;
}

.reviews-hero p:not(.eyebrow) {
  max-width: 670px;
  margin: 0;
  color: #9eb0bf;
  line-height: 1.7;
}

.reviews-trust-mark {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 3px 14px;
  padding: 20px;
  border: 1px solid #075f7e;
  border-radius: 8px;
  background: #071b25;
}

.reviews-trust-mark svg {
  grid-row: 1 / 3;
  width: 44px;
  height: 44px;
  padding: 9px;
  border-radius: 6px;
  fill: none;
  stroke: #00c8ff;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
  background: #062b3a;
}

.reviews-trust-mark strong {
  color: #f7fbff;
}

.reviews-trust-mark span {
  color: #84a2b5;
  font-size: .82rem;
}

.reviews-summary {
  display: grid;
  grid-template-columns: .7fr 1.3fr;
  gap: 40px;
  margin: 20px 0 52px;
  padding: 28px 34px;
  border: 1px solid #182b38;
  border-radius: 8px;
  background: #070e14;
}

.reviews-average {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 4px 16px;
}

.reviews-average > strong {
  grid-row: 1 / 3;
  color: #fff;
  font-size: 3.5rem;
  line-height: 1;
}

.reviews-average > span:last-child {
  color: #8da2b2;
  font-size: .82rem;
}

.reviews-bars {
  display: grid;
  gap: 6px;
}

.reviews-bars > div {
  display: grid;
  grid-template-columns: 34px 1fr 24px;
  align-items: center;
  gap: 10px;
  color: #8194a3;
  font-size: .75rem;
}

.reviews-bars i {
  overflow: hidden;
  height: 5px;
  border-radius: 5px;
  background: #182630;
}

.reviews-bars b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #00c8ff;
}

.reviews-bars em {
  font-style: normal;
  text-align: right;
}

.reviews-layout {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(340px, .82fr);
  align-items: start;
  gap: 28px;
}

.reviews-layout > div {
  min-width: 0;
}

.reviews-section-heading {
  margin-bottom: 22px;
}

.reviews-section-heading h2 {
  margin: 6px 0 0;
  color: #fff;
  font-size: 2rem;
}

.review-composer {
  position: sticky;
  top: 92px;
  min-height: 305px;
  margin-top: 76px;
  padding: 26px;
  border: 1px solid #1b303e;
  border-radius: 8px;
  background: #08121a;
}

.review-login-state {
  display: flex;
  min-height: 251px;
  justify-content: center;
  flex-direction: column;
}

.review-login-state > span,
.review-form-heading > span {
  color: #00c8ff;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.review-login-state h2,
.review-form-heading h2 {
  margin: 9px 0;
  color: #fff;
  font-size: 1.45rem;
}

.review-login-state p,
.review-form-heading p {
  margin: 0 0 20px;
  color: #91a6b6;
  line-height: 1.55;
}

.verified-review-form {
  display: grid;
  gap: 18px;
}

.verified-review-form label,
.review-rating-field legend {
  color: #b9c5cf;
  font-size: .78rem;
  font-weight: 800;
}

.verified-review-form input,
.verified-review-form select,
.verified-review-form textarea {
  width: 100%;
  margin-top: 7px;
  border-color: #233947;
  color: #fff;
  background: #050b10;
}

.review-rating-field {
  margin: 0;
  padding: 0;
  border: 0;
}

.review-rating-field div {
  display: flex;
  gap: 5px;
  margin-top: 7px;
}

.review-rating-field button {
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid #263b48;
  border-radius: 6px;
  color: #435460;
  background: #071018;
  font-size: 1.25rem;
  cursor: pointer;
}

.review-rating-field button:hover,
.review-rating-field button.active {
  border-color: #00a9dc;
  color: #00c8ff;
  background: #06202b;
}

.review-form-footer {
  display: grid;
  gap: 14px;
}

.review-form-footer small {
  color: #718593;
  line-height: 1.5;
}

.review-form-status {
  min-height: 1.2em;
  margin: 0;
  color: #70dfff;
  font-size: .82rem;
}

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

.product-review-panel > p {
  grid-column: 1 / -1;
  color: #91a6b6;
}

.product-review-panel > p a {
  color: #00c8ff;
  font-weight: 800;
}

@media (max-width: 920px) {
  .reviews-layout,
  .reviews-hero {
    grid-template-columns: 1fr;
  }

  .review-composer {
    position: static;
    min-height: 0;
    margin-top: 0;
  }

  .review-login-state { min-height: 0; }
  .account-orders-layout,
  .account-detail-bottom {
    grid-template-columns: 1fr;
  }

  .account-orders-hero {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 620px) {
  .reviews-page {
    width: calc(100% - 24px);
    padding: 18px 0 92px;
  }

  .reviews-hero {
    gap: 24px;
    padding: 26px 20px;
  }

  .reviews-hero h1 {
    font-size: 2.65rem;
  }

  .reviews-summary,
  .home-review-grid,
  .reviews-grid,
  .product-review-panel {
    grid-template-columns: 1fr;
  }

  .reviews-summary {
    gap: 24px;
    margin-bottom: 38px;
    padding: 22px;
  }

  .verified-review-card {
    padding: 18px;
  }

  .verified-review-card header {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .verified-review-card header .review-stars {
    grid-column: 2;
  }

  .verified-review-card footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .review-composer {
    padding: 20px;
  }

  .account-orders-page {
    width: calc(100% - 24px);
    padding-top: 1rem;
  }

  .account-detail-heading,
  .account-detail-section header {
    align-items: flex-start;
    flex-direction: column;
  }

  .account-detail-grid {
    grid-template-columns: 1fr;
  }

  .account-detail-grid > div {
    border-right: 0;
    border-bottom: 1px solid #1f2a35;
  }

  .account-detail-grid > div:last-child {
    border-bottom: 0;
  }

  .account-detail-items article {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .account-detail-items em,
  .account-detail-items b {
    grid-column: 2;
  }

}

/* Product mobile header keeps the account action without changing other pages. */
@media (max-width: 760px) {
  body[data-page="product-detail"] .site-header {
    grid-template-columns: 44px minmax(46px, 1fr) 42px 42px 46px !important;
  }

  body[data-page="product-detail"] .site-header .premium-brand {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 0;
    grid-column: 1 / -1 !important;
    transform: translate(-50%, -50%);
  }

  body[data-page="product-detail"] .site-header .header-search {
    position: absolute;
    top: 50%;
    right: 100px;
    z-index: 1;
    transform: translateY(-50%);
  }

  body[data-page="product-detail"] .site-header .header-actions {
    position: absolute;
    top: 50%;
    right: 8px;
    z-index: 1;
    grid-column: auto !important;
    display: grid !important;
    grid-template-columns: 42px 46px;
    gap: 2px;
    align-items: center;
    transform: translateY(-50%);
  }

  body[data-page="product-detail"] .site-header .mobile-menu-toggle { z-index: 1; }
  body[data-page="product-detail"] .site-header .header-cart { grid-column: 2 !important; grid-row: 1 !important; }

  body[data-page="product-detail"] .site-header[data-premium-header="true"] .header-actions .account-menu-wrap.account-menu-wrap {
    width: 42px;
    height: 42px;
    display: block !important;
  }

  body[data-page="product-detail"] .site-header .account-menu-wrap > .account-button,
  body[data-page="product-detail"] .site-header .account-menu-wrap > .account-menu-trigger {
    width: 42px;
    min-width: 42px;
    height: 42px;
    display: grid !important;
    place-items: center;
    border: 0;
    border-radius: 8px;
    padding: 0;
    background: transparent;
    color: #dce8f0;
  }

  body[data-page="product-detail"] .site-header .account-menu-wrap svg {
    width: 21px;
    height: 21px;
  }
}

/* Desktop product experience. Mobile keeps the dedicated approved layout above. */
.desktop-product-experience { display: none; }
body.desktop-product-lightbox-open { overflow: hidden; }

.editor-card-note {
  margin: -4px 0 2px;
  color: #8095a5;
  font-size: .78rem;
  line-height: 1.45;
}

.product-detail-admin-grid textarea { min-height: 112px; }
.product-detail-admin-grid select[multiple] { min-height: 172px; }

@media (min-width: 761px) {
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-breadcrumb,
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-product-layout,
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-tabs,
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) > .premium-related { display: none !important; }

  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) {
    padding: 16px clamp(24px, 3.2vw, 64px) 56px;
    background:
      radial-gradient(circle at 72% 2%, rgba(0, 174, 239, .09), transparent 34rem),
      #05080c;
  }

  body[data-page="product-detail"] .desktop-product-experience {
    display: block;
    width: min(100%, 1500px);
    margin: 0 auto;
    color: #f4f8fb;
  }

  .desktop-product-experience *,
  .desktop-product-experience *::before,
  .desktop-product-experience *::after { box-sizing: border-box; }

  .desktop-product-experience button,
  .desktop-product-experience a { -webkit-tap-highlight-color: transparent; }

  .desktop-product-experience button { font: inherit; }

  .desktop-product-experience svg {
    display: block;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .desktop-product-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    margin: 0 0 14px;
    color: #718797;
    font-size: .78rem;
    white-space: nowrap;
    overflow: hidden;
  }

  .desktop-product-breadcrumb a { color: #a9bac6; }
  .desktop-product-breadcrumb a:hover { color: #00c8ff; }
  .desktop-product-breadcrumb strong {
    min-width: 0;
    color: #eaf2f7;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .desktop-product-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.28fr) minmax(390px, .92fr);
    gap: clamp(22px, 2.2vw, 38px);
    align-items: start;
  }

  .desktop-product-gallery,
  .desktop-product-buy-panel { min-width: 0; }

  .desktop-product-gallery {
    display: grid;
    gap: 12px;
  }

  .desktop-product-gallery-main {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
    height: clamp(480px, min(38vw, calc(100vh - 240px)), 600px);
    min-height: 0;
    overflow: hidden;
    border: 1px solid #1c303d;
    border-radius: 8px;
    background: #030609;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255,255,255,.025);
  }

  .desktop-product-gallery-main > img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    padding: clamp(10px, 1.25vw, 20px);
    object-fit: contain;
    object-position: center;
  }

  .desktop-product-gallery.is-empty .desktop-product-gallery-main {
    gap: 12px;
    color: #748896;
  }

  .desktop-product-gallery.is-empty svg { width: 44px; height: 44px; }

  .desktop-product-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 3;
    padding: 8px 11px;
    border: 1px solid rgba(0, 200, 255, .55);
    border-radius: 5px;
    color: #eafaff;
    background: #087dff;
    box-shadow: 0 10px 30px rgba(0, 116, 255, .28);
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
  }

  .desktop-product-favorite,
  .desktop-product-expand,
  .desktop-gallery-arrow {
    position: absolute;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid #29404f;
    border-radius: 999px;
    color: #e7f4fb;
    background: rgba(3, 8, 12, .8);
    backdrop-filter: blur(12px);
    cursor: pointer;
    transition: border-color 160ms ease, color 160ms ease, background 160ms ease, transform 160ms ease;
  }

  .desktop-product-favorite:hover,
  .desktop-product-expand:hover,
  .desktop-gallery-arrow:hover {
    border-color: #00c8ff;
    color: #00c8ff;
    background: rgba(4, 27, 38, .92);
    transform: translateY(-1px);
  }

  .desktop-product-favorite { top: 16px; right: 16px; }
  .desktop-product-favorite.active { color: #00c8ff; border-color: #00c8ff; background: #06202b; }
  .desktop-product-favorite.active svg { fill: currentColor; }
  .desktop-product-expand { right: 16px; bottom: 16px; }
  .desktop-gallery-arrow { top: 50%; transform: translateY(-50%); }
  .desktop-gallery-arrow:hover { transform: translateY(calc(-50% - 1px)); }
  .desktop-gallery-arrow.is-prev { left: 16px; }
  .desktop-gallery-arrow.is-next { right: 16px; }

  .desktop-product-thumbnails {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 48px) / 5);
    gap: 12px;
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: #1d536b transparent;
  }

  .desktop-product-thumbnails button {
    height: clamp(82px, 7vw, 104px);
    min-width: 0;
    overflow: hidden;
    scroll-snap-align: start;
    border: 1px solid #1c303d;
    border-radius: 7px;
    padding: 5px;
    background: #050a0f;
    cursor: pointer;
    transition: border-color 150ms ease, background 150ms ease;
  }

  .desktop-product-thumbnails button:hover,
  .desktop-product-thumbnails button.active {
    border-color: #00c8ff;
    background: #07141c;
  }

  .desktop-product-thumbnails img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  .desktop-product-buy-panel {
    position: sticky;
    top: 84px;
    display: grid;
    gap: 12px;
    padding: clamp(20px, 1.65vw, 28px);
    border: 1px solid #1c303d;
    border-radius: 8px;
    background: linear-gradient(145deg, rgba(11, 19, 27, .94), rgba(5, 9, 13, .96));
    box-shadow: 0 24px 70px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255,255,255,.03);
  }

  .desktop-product-brand {
    color: #00c8ff;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
  }

  .desktop-product-buy-panel h1 {
    min-width: 0;
    margin: 0;
    color: #f8fbfd;
    font-size: clamp(2rem, 2.6vw, 2.85rem);
    line-height: 1.03;
    letter-spacing: 0;
    overflow-wrap: anywhere;
  }

  .desktop-product-rating {
    display: flex;
    align-items: center;
    gap: 9px;
    width: max-content;
    max-width: 100%;
    border: 0;
    padding: 0;
    color: #00bfff;
    background: transparent;
    cursor: pointer;
  }

  .desktop-product-rating .review-stars { color: #00bfff; letter-spacing: 2px; }
  .desktop-product-rating span { color: #9db0bd; font-size: .78rem; white-space: nowrap; }
  .desktop-product-rating:hover span { color: #dce8ef; }

  .desktop-product-summary {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: #aab9c4;
    font-size: .86rem;
    line-height: 1.6;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .desktop-product-price {
    display: grid;
    gap: 3px;
    padding: 4px 0 2px;
  }

  .desktop-product-price > div { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
  .desktop-product-price > div span { color: #00c8ff; font-size: .9rem; font-weight: 900; }
  .desktop-product-price > div b {
    padding: 4px 7px;
    border-radius: 4px;
    color: #fff;
    background: #087dff;
    font-size: .64rem;
    letter-spacing: .04em;
  }

  .desktop-product-price > strong {
    color: #fff;
    font-size: clamp(2.25rem, 3vw, 3.35rem);
    line-height: 1;
    letter-spacing: 0;
  }

  .desktop-product-price > small { color: #c3ced6; font-size: .82rem; }

  .desktop-payment-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }

  .desktop-payment-methods span {
    display: grid;
    place-items: center;
    width: 50px;
    height: 30px;
    overflow: hidden;
    box-sizing: border-box;
    border: 1px solid #1b3442;
    border-radius: 6px;
    padding: 5px 8px;
    background: linear-gradient(180deg, #0a151d, #071018);
    box-shadow: inset 0 1px rgba(255, 255, 255, .025);
  }

  .desktop-payment-methods img {
    display: block;
    width: auto;
    max-width: 100%;
    height: 17px;
    object-fit: contain;
  }

  .desktop-payment-methods .payment-method-mark--pix img,
  .desktop-payment-methods .payment-method-mark--mastercard img { width: 19px; height: 19px; }
  .desktop-payment-methods .payment-method-mark--visa img,
  .desktop-payment-methods .payment-method-mark--elo img,
  .desktop-payment-methods .payment-method-mark--amex img { filter: brightness(0) invert(1); opacity: .94; }

  .desktop-product-benefits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .desktop-product-benefits article {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 66px;
    border: 1px solid #1c303d;
    border-radius: 7px;
    padding: 10px 12px;
    background: #071019;
  }

  .desktop-product-benefits article > svg { width: 32px; height: 32px; color: #00c8ff; }
  .desktop-product-benefits span { display: grid; gap: 3px; min-width: 0; }
  .desktop-product-benefits strong {
    color: #00c8ff;
    font-size: .68rem;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  .desktop-product-benefits small { color: #9eafbb; font-size: .72rem; }

  .desktop-product-purchase {
    display: grid;
    grid-template-columns: 126px minmax(0, 1fr);
    gap: 9px;
  }

  .desktop-product-quantity {
    display: grid;
    grid-template-columns: 40px 1fr 40px;
    align-items: center;
    min-height: 48px;
    border: 1px solid #1c303d;
    border-radius: 6px;
    background: #050a0f;
  }

  .desktop-product-quantity button {
    display: grid;
    place-items: center;
    height: 100%;
    border: 0;
    color: #00c8ff;
    background: transparent;
    cursor: pointer;
  }

  .desktop-product-quantity button:hover { background: rgba(0,200,255,.08); }
  .desktop-product-quantity svg { width: 16px; height: 16px; }
  .desktop-product-quantity output { color: #fff; font-size: .9rem; font-weight: 900; text-align: center; }

  .desktop-product-add,
  .desktop-product-buy,
  .desktop-product-favorite-text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 0;
    min-height: 48px;
    border-radius: 6px;
    cursor: pointer;
    transition: transform 160ms ease, border-color 160ms ease, color 160ms ease, background 160ms ease, box-shadow 160ms ease;
  }

  .desktop-product-add {
    border: 1px solid #078df9;
    color: #fff;
    background: linear-gradient(110deg, #05b8ef, #086df7);
    box-shadow: 0 14px 32px rgba(0, 123, 255, .22);
    font-size: .83rem;
    font-weight: 900;
    text-transform: uppercase;
  }

  .desktop-product-add:hover { transform: translateY(-1px); box-shadow: 0 18px 40px rgba(0, 146, 255, .32); }
  .desktop-product-add.is-complete { border-color: #00d987; background: #087b58; }
  .desktop-product-add:disabled,
  .desktop-product-buy:disabled { cursor: wait; opacity: .76; }

  .desktop-product-buy {
    grid-column: 1 / -1;
    border: 1px solid #00bff3;
    color: #f5fbff;
    background: rgba(0, 189, 243, .025);
    font-size: .82rem;
    font-weight: 900;
    text-transform: uppercase;
  }

  .desktop-product-buy:hover { color: #00c8ff; background: rgba(0, 200, 255, .08); transform: translateY(-1px); }

  .desktop-product-favorite-text {
    grid-column: 1 / -1;
    min-height: 30px;
    border: 0;
    color: #9eafb9;
    background: transparent;
    font-size: .78rem;
  }

  .desktop-product-favorite-text:hover,
  .desktop-product-favorite-text.active { color: #00c8ff; }
  .desktop-product-favorite-text.active svg { fill: currentColor; }
  .desktop-product-favorite-text svg { width: 17px; height: 17px; }

  .desktop-product-feature-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 22px;
    border: 1px solid #1c303d;
    border-radius: 8px;
    background: #071019;
  }

  .desktop-product-feature-strip article {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-height: 90px;
    padding: 16px 20px;
    border-right: 1px solid #1c303d;
  }

  .desktop-product-feature-strip article:last-child { border-right: 0; }
  .desktop-product-feature-strip article > svg { width: 38px; height: 38px; color: #00c8ff; }
  .desktop-product-feature-strip span { display: grid; gap: 5px; min-width: 0; }
  .desktop-product-feature-strip strong { color: #f1f7fa; font-size: .72rem; text-transform: uppercase; }
  .desktop-product-feature-strip small { color: #93a6b3; font-size: .72rem; line-height: 1.4; }

  .desktop-product-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
    align-items: stretch;
    margin-top: 16px;
  }

  .desktop-product-content.has-visual { grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr); }
  .desktop-product-content.has-support { grid-template-columns: minmax(0, 1.5fr) minmax(250px, .66fr); }
  .desktop-product-content.has-visual.has-support { grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr) minmax(240px, .62fr); }

  .desktop-product-tabs,
  .desktop-product-visual-card,
  .desktop-product-included-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid #1c303d;
    border-radius: 8px;
    background: #071019;
  }

  .desktop-product-tab-list {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    border-bottom: 1px solid #1c303d;
    padding: 0 12px;
    scrollbar-width: none;
  }

  .desktop-product-tab-list::-webkit-scrollbar { display: none; }
  .desktop-product-tab-list button {
    flex: 0 0 auto;
    min-height: 48px;
    border: 0;
    border-bottom: 2px solid transparent;
    padding: 0 12px;
    color: #9cafbb;
    background: transparent;
    font-size: .72rem;
    font-weight: 850;
    text-transform: uppercase;
    cursor: pointer;
  }

  .desktop-product-tab-list button:hover,
  .desktop-product-tab-list button.active { color: #00c8ff; border-bottom-color: #00c8ff; }

  .desktop-product-tab-panel { display: none; padding: 20px; }
  .desktop-product-tab-panel.active { display: block; }

  .desktop-description-layout { display: grid; gap: 18px; }
  .desktop-description-layout .premium-description-content { width: 100%; margin: 0; gap: 0; }
  .desktop-description-layout .premium-description-intro { padding-bottom: 14px; }
  .desktop-description-layout .premium-description-intro > p { padding-left: 14px; font-size: .88rem; line-height: 1.58; }
  .desktop-description-layout .premium-description-flow { width: 100%; padding-left: 0; gap: 0; }
  .desktop-description-layout .premium-description-section { gap: 10px; padding: 14px 0; }
  .desktop-description-layout .premium-description-flow p { font-size: .82rem; line-height: 1.62; }

  .desktop-product-highlights,
  .desktop-product-compatibility,
  .desktop-product-included-card ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 18px;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .desktop-product-highlights li,
  .desktop-product-compatibility li,
  .desktop-product-included-card li {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    color: #b9c8d2;
    font-size: .78rem;
    line-height: 1.45;
  }

  .desktop-product-highlights svg,
  .desktop-product-compatibility svg,
  .desktop-product-included-card li svg { width: 17px; height: 17px; color: #00c8ff; }

  .desktop-product-spec-table { width: 100%; border-collapse: collapse; }
  .desktop-product-spec-table th,
  .desktop-product-spec-table td { border-bottom: 1px solid #1c303d; padding: 12px 10px; text-align: left; }
  .desktop-product-spec-table tr:last-child th,
  .desktop-product-spec-table tr:last-child td { border-bottom: 0; }
  .desktop-product-spec-table th { width: 38%; color: #7f93a1; font-size: .7rem; text-transform: uppercase; }
  .desktop-product-spec-table td { color: #e4edf2; font-size: .8rem; font-weight: 750; }

  .desktop-product-visual-card { position: relative; min-height: 260px; background: #03070a; }
  .desktop-product-visual-card > img { width: 100%; height: 100%; min-height: 260px; object-fit: contain; object-position: center; opacity: .78; }
  .desktop-product-visual-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3,8,12,.94) 0%, rgba(3,8,12,.48) 45%, rgba(3,8,12,.08) 100%);
    pointer-events: none;
  }

  .desktop-product-visual-card > div {
    position: absolute;
    top: 24px;
    left: 24px;
    z-index: 1;
    display: grid;
    gap: 3px;
    width: min(52%, 220px);
    text-transform: uppercase;
  }

  .desktop-product-visual-card small { color: #f4f8fb; font-size: .82rem; font-weight: 900; }
  .desktop-product-visual-card strong { color: #00c8ff; font-size: clamp(1.3rem, 1.6vw, 1.8rem); line-height: 1; }
  .desktop-product-visual-card span { margin-top: 14px; color: #c4d1da; font-size: .65rem; line-height: 1.45; }

  .desktop-product-included-card { display: grid; align-content: start; gap: 22px; padding: 20px; }
  .desktop-product-included-card > div > small,
  .desktop-product-warranty small { display: block; margin-bottom: 12px; color: #00c8ff; font-size: .68rem; font-weight: 900; text-transform: uppercase; }
  .desktop-product-included-card ul { grid-template-columns: 1fr; gap: 9px; }

  .desktop-product-warranty {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    padding-top: 20px;
    border-top: 1px solid #1c303d;
  }

  .desktop-product-warranty > svg { width: 34px; height: 34px; color: #00c8ff; }
  .desktop-product-warranty span { min-width: 0; }
  .desktop-product-warranty small { margin-bottom: 5px; }
  .desktop-product-warranty strong { color: #f4f8fb; font-size: .85rem; }
  .desktop-product-warranty p { margin: 6px 0 0; color: #95a8b5; font-size: .72rem; line-height: 1.45; }

  .desktop-review-empty { display: grid; gap: 14px; color: #9eb0bc; }
  .desktop-review-empty p { margin: 0; }
  .desktop-review-empty .row-action { width: max-content; }

  .desktop-review-layout { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 20px; }
  .desktop-review-layout > aside { display: grid; align-content: start; gap: 7px; }
  .desktop-review-layout > aside > strong { color: #fff; font-size: 2.5rem; line-height: 1; }
  .desktop-review-layout > aside > span { color: #93a7b5; font-size: .72rem; }
  .desktop-review-layout > aside > div { display: grid; grid-template-columns: 12px 1fr 18px; gap: 6px; align-items: center; }
  .desktop-review-layout aside i { height: 4px; overflow: hidden; border-radius: 999px; background: #14232d; }
  .desktop-review-layout aside i b { display: block; height: 100%; background: #00c8ff; }
  .desktop-review-layout aside em,
  .desktop-review-layout aside small { color: #7d919f; font-size: .65rem; font-style: normal; }
  .desktop-review-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }

  .desktop-product-related { margin-top: 22px; }
  .desktop-product-related > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 12px; }
  .desktop-product-related header small { color: #00c8ff; font-size: .7rem; font-weight: 900; text-transform: uppercase; }
  .desktop-product-related h2 { margin: 3px 0 0; color: #f5f9fc; font-size: 1.18rem; }
  .desktop-product-related header a { color: #9db0bc; font-size: .76rem; font-weight: 800; }
  .desktop-product-related header a:hover { color: #00c8ff; }

  .desktop-product-related > div {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 42px) / 4);
    gap: 14px;
    overflow-x: auto;
    padding-bottom: 6px;
    scroll-snap-type: x proximity;
    scrollbar-width: thin;
    scrollbar-color: #1d536b transparent;
  }

  .desktop-related-product {
    position: relative;
    min-width: 0;
    min-height: 154px;
    overflow: hidden;
    scroll-snap-align: start;
    border: 1px solid #1c303d;
    border-radius: 7px;
    background: #071019;
  }

  .desktop-related-product > a {
    display: grid;
    grid-template-columns: minmax(100px, 42%) minmax(0, 1fr);
    height: 100%;
    color: inherit;
  }

  .desktop-related-media { display: grid; place-items: center; min-height: 152px; padding: 10px; background: #03070a; }
  .desktop-related-media img { width: 100%; height: 100%; max-height: 136px; object-fit: contain; }
  .desktop-related-media svg { width: 34px; height: 34px; color: #40535f; }
  .desktop-related-copy { display: grid; align-content: center; gap: 4px; min-width: 0; padding: 14px 46px 14px 14px; }
  .desktop-related-copy small { color: #7e929f; font-size: .62rem; }
  .desktop-related-copy strong {
    display: -webkit-box;
    overflow: hidden;
    color: #f3f8fb;
    font-size: .83rem;
    line-height: 1.25;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .desktop-related-copy b { color: #fff; font-size: .85rem; }
  .desktop-related-copy em { color: #8fa2af; font-size: .62rem; font-style: normal; line-height: 1.3; }

  .desktop-related-product > button {
    position: absolute;
    right: 10px;
    bottom: 10px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid #00aee5;
    border-radius: 5px;
    color: #001017;
    background: #00bdf2;
    cursor: pointer;
  }
  .desktop-related-product > button:hover,
  .desktop-related-product > button.is-complete { color: #fff; background: #087dff; }
  .desktop-related-product > button svg { width: 18px; height: 18px; }

  .desktop-product-lightbox[hidden] { display: none !important; }
  .desktop-product-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: grid;
    place-items: center;
    padding: 36px;
    background: rgba(0, 3, 6, .95);
    backdrop-filter: blur(18px);
  }
  .desktop-product-lightbox > button {
    position: fixed;
    top: 22px;
    right: 22px;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid #28404e;
    border-radius: 999px;
    color: #fff;
    background: #071019;
    cursor: pointer;
  }
  .desktop-product-lightbox > img { width: 100%; height: 100%; max-width: 1500px; max-height: calc(100vh - 72px); object-fit: contain; }
}

@media (min-width: 761px) and (max-width: 1366px) {
  body[data-page="product-detail"] .premium-product-page:not(.pc-product-page) { padding-inline: 28px; }
  .desktop-product-hero { grid-template-columns: minmax(0, 1.2fr) minmax(370px, .92fr); gap: 22px; }
  .desktop-product-gallery-main { height: clamp(450px, min(37vw, calc(100vh - 225px)), 530px); }
  .desktop-product-buy-panel { gap: 9px; padding: 18px; }
  .desktop-product-buy-panel h1 { font-size: clamp(1.8rem, 2.45vw, 2.3rem); }
  .desktop-product-summary { font-size: .8rem; line-height: 1.5; -webkit-line-clamp: 2; }
  .desktop-product-price > strong { font-size: clamp(2.1rem, 2.8vw, 2.7rem); }
  .desktop-product-feature-strip article { grid-template-columns: 38px minmax(0, 1fr); padding: 13px 15px; }
  .desktop-product-feature-strip article > svg { width: 32px; height: 32px; }
  .desktop-product-content.has-visual.has-support { grid-template-columns: minmax(0, 1.25fr) minmax(250px, .72fr) minmax(220px, .58fr); }
  .desktop-product-tab-list button { padding-inline: 9px; font-size: .66rem; }
  .desktop-product-tab-panel { padding: 16px; }
  .desktop-related-product > a { grid-template-columns: minmax(86px, 39%) minmax(0, 1fr); }
}

@media (min-width: 761px) and (max-width: 1120px) {
  .desktop-product-hero { grid-template-columns: minmax(0, 1.08fr) minmax(350px, .92fr); }
  .desktop-product-gallery-main { height: clamp(410px, 43vw, 480px); }
  .desktop-product-content.has-visual.has-support { grid-template-columns: minmax(0, 1.35fr) minmax(240px, .7fr); }
  .desktop-product-content.has-visual.has-support .desktop-product-included-card { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .desktop-product-related > div { grid-auto-columns: calc((100% - 28px) / 3); }
}

/* Keep the drawer state authoritative after all legacy and page-specific rules. */
#cartBackdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

#cartDrawer.is-open {
  transform: translate3d(0, 0, 0);
  visibility: visible;
  transition-delay: 0s;
}

#cartDrawer .cart-drawer-notice.hidden {
  display: block !important;
  min-height: 0;
  max-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  opacity: 0;
  visibility: hidden;
}

/* Admin users directory. Deliberately scoped so no other admin page is affected. */
.user-admin-panel {
  color: #eef6fc;
}

.user-page-heading,
.user-page-actions,
.user-button,
.user-icon-button,
.user-row-actions,
.user-table-footer,
.user-table-footer nav,
.user-table-footer nav > span,
.user-drawer-actions,
.user-section-heading {
  display: flex;
  align-items: center;
}

.user-page-heading {
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 18px;
}

.user-page-heading h3 {
  margin: 0;
  color: #f8fbff;
  font-size: clamp(1.55rem, 2vw, 2rem);
  letter-spacing: 0;
}

.user-page-heading p {
  margin: 7px 0 0;
  color: #8295a8;
  font-size: .86rem;
}

.user-page-actions {
  gap: 9px;
}

.user-button,
.user-icon-button,
.user-view-button,
.user-drawer-actions button,
.user-table-footer button,
.user-action-menu summary,
.user-action-menu button {
  border: 1px solid #203140;
  border-radius: 6px;
  color: #e9f3fb;
  background: #0a121a;
  font: inherit;
  font-size: .78rem;
  font-weight: 800;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.user-button {
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 14px;
}

.user-button.primary {
  border-color: #009bd5;
  color: #00111a;
  background: #13b9ec;
}

.user-button:hover,
.user-icon-button:hover,
.user-view-button:hover,
.user-drawer-actions button:hover,
.user-table-footer button:not(:disabled):hover,
.user-action-menu summary:hover,
.user-action-menu button:hover {
  border-color: #00bde9;
  color: #fff;
  background: #0d1b25;
}

.user-button.primary:hover {
  color: #00111a;
  background: #3ac8f1;
}

.user-button svg,
.user-icon-button svg,
.user-drawer-actions svg,
.user-action-menu svg,
.user-table-footer svg {
  width: 16px;
  height: 16px;
}

.user-stats {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.user-metric-card {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 8px 10px;
  min-height: 126px;
  padding: 14px;
  border: 1px solid #172735;
  border-radius: 8px;
  background: #081119;
}

.user-metric-icon {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid #145b73;
  border-radius: 7px;
  color: #00c8ff;
  background: #08202b;
}

.user-metric-icon svg {
  width: 18px;
  height: 18px;
}

.user-metric-card small {
  display: block;
  color: #7f94a8;
  font-size: .67rem;
  font-weight: 800;
}

.user-metric-card strong {
  display: block;
  margin-top: 3px;
  color: #f7fbff;
  font-size: 1.12rem;
  line-height: 1.15;
}

.user-metric-card em {
  align-self: center;
  color: #26d985;
  font-size: .69rem;
  font-style: normal;
  font-weight: 900;
}

.user-metric-card em.negative {
  color: #ff7188;
}

.user-metric-card p {
  grid-column: 1 / -1;
  margin: 0;
  color: #71879a;
  font-size: .68rem;
  line-height: 1.35;
}

.user-directory {
  border: 1px solid #172735;
  border-radius: 8px;
  background: #070e15;
}

.user-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px;
  border-bottom: 1px solid #172735;
}

.user-search {
  position: relative;
  flex: 2 1 310px;
  min-width: 250px;
}

.user-search svg {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 16px;
  height: 16px;
  color: #7690a4;
  transform: translateY(-50%);
  pointer-events: none;
}

.user-search input,
.user-filter-bar select,
.user-drawer textarea,
.user-editor-form input,
.user-editor-form select {
  min-height: 38px;
  border: 1px solid #1b2a37;
  border-radius: 6px;
  color: #edf6fc;
  background: #050c12;
  font: inherit;
  font-size: .75rem;
}

.user-search input {
  width: 100%;
  padding: 0 12px 0 38px;
}

.user-filter-bar select {
  flex: 1 1 145px;
  max-width: 190px;
  padding: 0 30px 0 10px;
}

.user-search input:focus,
.user-filter-bar select:focus,
.user-drawer textarea:focus,
.user-editor-form input:focus,
.user-editor-form select:focus {
  outline: 0;
  border-color: #009fd0;
  box-shadow: 0 0 0 2px rgba(0, 184, 230, .1);
}

.user-icon-button {
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  min-height: 38px;
  padding: 0;
}

.user-table-shell {
  overflow: visible;
}

.user-table-head,
.user-table-row {
  display: grid;
  grid-template-columns: minmax(210px, 1.8fr) minmax(175px, 1.35fr) minmax(105px, .8fr) 62px minmax(100px, .8fr) minmax(105px, .8fr) 104px 96px;
  gap: 12px;
  align-items: center;
  min-width: 1120px;
  padding: 11px 14px;
}

.user-table-head {
  border-bottom: 1px solid #172735;
  color: #6f879a;
  background: #09121a;
  font-size: .66rem;
  font-weight: 900;
  text-transform: uppercase;
}

.user-table-row {
  position: relative;
  min-height: 68px;
  border-bottom: 1px solid #13212c;
  color: #bac9d5;
  cursor: pointer;
}

.user-table-row:last-child {
  border-bottom: 0;
}

.user-table-row:hover {
  background: #0a151e;
  box-shadow: inset 2px 0 0 #00bce9;
}

.user-name-cell,
.user-contact-cell {
  min-width: 0;
}

.user-name-cell {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
}

.user-avatar,
.user-drawer-avatar {
  display: grid;
  place-items: center;
  border: 1px solid #12647f;
  border-radius: 8px;
  color: #12c9f6;
  background: #08212c;
  font-weight: 900;
}

.user-avatar {
  width: 40px;
  height: 40px;
}

.user-name-cell strong,
.user-contact-cell strong {
  display: block;
  overflow: hidden;
  color: #edf5fb;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-name-cell small,
.user-contact-cell small {
  display: block;
  margin-top: 4px;
  overflow: hidden;
  color: #748b9e;
  font-size: .67rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-money-cell {
  color: #eef8fd;
  white-space: nowrap;
}

.user-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  min-height: 25px;
  padding: 0 9px;
  border: 1px solid #23404e;
  border-radius: 999px;
  color: #98adc0;
  background: #0c1821;
  font-size: .64rem;
  font-weight: 900;
  white-space: nowrap;
}

.user-status-badge.active {
  border-color: #176746;
  color: #4ce49a;
  background: #092219;
}

.user-status-badge.recurring {
  border-color: #116481;
  color: #20caf7;
  background: #08212c;
}

.user-status-badge.blocked {
  border-color: #833142;
  color: #ff7188;
  background: #260d14;
}

.user-row-actions {
  position: relative;
  justify-content: flex-end;
  gap: 6px;
}

.user-view-button {
  min-height: 31px;
  padding: 0 11px;
}

.user-action-menu {
  position: relative;
}

.user-action-menu summary {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  list-style: none;
}

.user-action-menu summary::-webkit-details-marker {
  display: none;
}

.user-action-menu summary svg {
  width: 17px;
  height: 17px;
}

.user-action-menu > div {
  position: absolute;
  z-index: 15;
  top: calc(100% + 6px);
  right: 0;
  display: grid;
  width: 190px;
  padding: 6px;
  border: 1px solid #263846;
  border-radius: 7px;
  background: #071019;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .42);
}

.user-action-menu button {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 36px;
  padding: 0 10px;
  border-color: transparent;
  text-align: left;
}

.user-action-menu button.danger,
.user-drawer-actions button.danger {
  color: #ff7188;
}

.user-action-menu button:disabled,
.user-drawer-actions button:disabled,
.user-button:disabled {
  opacity: .4;
  cursor: not-allowed;
}

.user-empty-state {
  display: grid;
  place-items: center;
  min-height: 280px;
  padding: 30px;
  color: #71889c;
  text-align: center;
}

.user-empty-state svg {
  width: 34px;
  height: 34px;
  margin-bottom: 12px;
  color: #00bde9;
}

.user-empty-state strong {
  color: #edf6fc;
}

.user-empty-state p {
  margin: 7px 0 0;
}

.user-table-footer {
  justify-content: space-between;
  gap: 16px;
  min-height: 58px;
  padding: 10px 14px;
  border-top: 1px solid #172735;
}

.user-table-footer p {
  margin: 0;
  color: #70879a;
  font-size: .7rem;
}

.user-table-footer nav,
.user-table-footer nav > span {
  gap: 5px;
}

.user-table-footer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 32px;
  min-height: 32px;
  padding: 0 9px;
}

.user-table-footer button.active {
  border-color: #00bde9;
  color: #001019;
  background: #13b9ec;
}

.user-table-footer button:disabled {
  opacity: .35;
  cursor: default;
}

body.user-drawer-open {
  overflow: hidden;
}

.user-drawer-layer {
  position: fixed;
  z-index: 1300;
  inset: 0;
}

.user-drawer-backdrop {
  position: absolute;
  inset: 0;
  width: 100%;
  border: 0;
  background: rgba(0, 4, 8, .76);
  backdrop-filter: blur(3px);
}

.user-drawer {
  position: absolute;
  top: 0;
  right: 0;
  width: min(680px, 100vw);
  height: 100%;
  overflow-y: auto;
  border-left: 1px solid #1b3442;
  color: #dbe8f2;
  background: #060d13;
  box-shadow: -22px 0 70px rgba(0, 0, 0, .48);
  animation: user-drawer-enter 180ms ease both;
}

@keyframes user-drawer-enter {
  from { opacity: 0; transform: translate3d(24px, 0, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

.user-drawer-close {
  position: absolute;
  z-index: 2;
  top: 14px;
  right: 14px;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid #20313e;
  border-radius: 6px;
  color: #d9e7f1;
  background: #0a131b;
  cursor: pointer;
}

.user-drawer-close svg {
  width: 18px;
  height: 18px;
}

.user-drawer-profile {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 15px;
  align-items: center;
  padding: 28px 64px 22px 24px;
  border-bottom: 1px solid #182934;
  background: #08121a;
}

.user-drawer-avatar {
  width: 64px;
  height: 64px;
  font-size: 1.1rem;
}

.user-drawer-profile h4,
.user-editor-header h4 {
  margin: 8px 0 3px;
  color: #f5faff;
  font-size: 1.28rem;
}

.user-drawer-profile p,
.user-editor-header p {
  margin: 0;
  color: #8ca0b3;
}

.user-drawer-profile small {
  display: block;
  margin-top: 7px;
  color: #6f8698;
}

.user-drawer-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-bottom: 1px solid #182934;
}

.user-drawer-kpis article {
  padding: 17px 18px;
  border-right: 1px solid #182934;
}

.user-drawer-kpis article:last-child {
  border-right: 0;
}

.user-drawer-kpis small,
.user-identity-grid small,
.user-section-heading small {
  display: block;
  color: #6f879a;
  font-size: .65rem;
  font-weight: 900;
  text-transform: uppercase;
}

.user-drawer-kpis strong {
  display: block;
  margin-top: 6px;
  color: #f4f9fd;
  font-size: 1.05rem;
}

.user-drawer-section {
  padding: 20px 24px;
  border-bottom: 1px solid #182934;
}

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

.user-identity-grid strong {
  display: block;
  margin-top: 5px;
  overflow-wrap: anywhere;
  color: #e5eff6;
  font-size: .78rem;
}

.user-section-heading {
  justify-content: space-between;
  margin-bottom: 13px;
}

.user-section-heading h5 {
  margin: 4px 0 0;
  color: #f2f8fc;
  font-size: 1rem;
}

.user-section-heading > strong {
  display: grid;
  place-items: center;
  min-width: 28px;
  height: 28px;
  border: 1px solid #1a4050;
  border-radius: 6px;
  color: #00c7f5;
  background: #08212b;
  font-size: .72rem;
}

.user-order-history,
.user-address-list {
  display: grid;
  gap: 8px;
}

.user-order-history button {
  display: grid;
  grid-template-columns: minmax(110px, 1fr) auto auto 18px;
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 9px 11px;
  border: 1px solid #172934;
  border-radius: 7px;
  color: #c8d7e2;
  background: #081119;
  text-align: left;
  cursor: pointer;
}

.user-order-history span strong,
.user-order-history span small {
  display: block;
}

.user-order-history span strong {
  color: #eff8fd;
}

.user-order-history span small {
  margin-top: 4px;
  color: #758b9e;
  font-size: .68rem;
}

.user-order-history em {
  font-style: normal;
}

.user-order-history b {
  color: #00c8f5;
  white-space: nowrap;
}

.user-order-history svg {
  width: 16px;
  height: 16px;
}

.user-address-list article {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 11px;
  padding: 13px;
  border: 1px solid #172934;
  border-radius: 7px;
  background: #081119;
}

.user-address-list article.primary {
  border-color: #14526a;
}

.user-address-list article > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 6px;
  color: #00c5f3;
  background: #08212b;
}

.user-address-list svg {
  width: 17px;
  height: 17px;
}

.user-address-list em {
  display: inline-block;
  margin-bottom: 5px;
  color: #00c7f5;
  font-size: .62rem;
  font-style: normal;
  font-weight: 900;
  text-transform: uppercase;
}

.user-address-list strong {
  display: block;
  color: #e7f0f7;
  font-size: .8rem;
}

.user-address-list p {
  margin: 5px 0 0;
  color: #7890a3;
  font-size: .72rem;
  line-height: 1.45;
}

.user-section-empty {
  padding: 22px;
  border: 1px dashed #1b3341;
  border-radius: 7px;
  color: #71889b;
  text-align: center;
}

.user-drawer textarea {
  width: 100%;
  min-height: 108px;
  resize: vertical;
  padding: 11px;
  line-height: 1.5;
}

.user-drawer-section .user-button {
  margin-top: 10px;
}

.user-drawer-actions {
  flex-wrap: wrap;
  gap: 7px;
  padding: 18px 24px 28px;
}

.user-drawer-actions button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 37px;
  padding: 0 11px;
}

.user-editor-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 26px 62px 20px 24px;
  border-bottom: 1px solid #182934;
  background: #08121a;
}

.user-editor-form {
  display: grid;
  gap: 14px;
  padding: 22px 24px 28px;
}

.user-editor-form label {
  display: grid;
  gap: 7px;
  color: #7f95a8;
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.user-editor-form input,
.user-editor-form select {
  width: 100%;
  padding: 0 11px;
  color: #eef7fc;
  font-size: .8rem;
  font-weight: 700;
  text-transform: none;
}

.user-editor-form input[readonly] {
  color: #7e93a5;
  background: #081018;
}

.user-profile-box {
  display: grid;
  gap: 12px;
  margin: 3px 0 0;
  padding: 15px;
  border: 1px solid #1b2d39;
  border-radius: 7px;
  background: #071018;
}

.user-profile-box legend {
  padding: 0 7px;
  color: #00c7f5;
  font-size: .72rem;
  font-weight: 900;
}

.user-profile-box > p {
  margin: 0;
  color: #8297a8;
  font-size: .74rem;
  line-height: 1.45;
}

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

.user-profile-wide {
  grid-column: 1 / -1;
}

.user-permission-box {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 3px 0 0;
  padding: 15px;
  border: 1px solid #1b2d39;
  border-radius: 7px;
  background: #071018;
}

.user-permission-box legend {
  padding: 0 7px;
  color: #00c7f5;
  font-size: .72rem;
  font-weight: 900;
}

.user-permission-box label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #bccbd6;
  font-size: .74rem;
  text-transform: none;
}

.user-permission-box input {
  width: 16px;
  min-height: 16px;
  accent-color: #00bde9;
}

.user-editor-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 4px;
}

@media (max-width: 1380px) {
  .user-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) and (min-width: 761px) {
  .user-table-head,
  .user-table-row {
    grid-template-columns: minmax(190px, 1.7fr) minmax(170px, 1.3fr) 62px minmax(100px, .8fr) 100px 96px;
    min-width: 0;
  }

  .user-table-head > :nth-child(3),
  .user-table-row > :nth-child(3),
  .user-table-head > :nth-child(6),
  .user-table-row > :nth-child(6) {
    display: none;
  }

  .user-table-shell {
    overflow-x: auto;
  }
}

@media (max-width: 760px) {
  .user-page-heading {
    align-items: flex-start;
  }

  .user-page-actions {
    width: 100%;
  }

  .user-page-actions .user-button {
    flex: 1;
  }

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

  .user-metric-card {
    min-height: 118px;
    padding: 11px;
  }

  .user-metric-card strong {
    font-size: .96rem;
    overflow-wrap: anywhere;
  }

  .user-search {
    flex-basis: 100%;
    min-width: 100%;
  }

  .user-filter-bar select {
    flex: 1 1 calc(50% - 5px);
    max-width: none;
  }

  .user-table-head {
    display: none;
  }

  .user-table-shell {
    padding: 10px;
    overflow: visible;
  }

  .user-table-body {
    display: grid;
    gap: 9px;
  }

  .user-table-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 14px;
    min-width: 0;
    padding: 14px;
    border: 1px solid #172a36;
    border-radius: 8px;
    background: #081119;
  }

  .user-table-row:hover {
    box-shadow: none;
  }

  .user-name-cell,
  .user-contact-cell,
  .user-row-actions {
    grid-column: 1 / -1;
  }

  .user-data-cell,
  .user-money-cell {
    display: flex !important;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    color: #e8f2f9;
  }

  .user-table-row .user-data-cell {
    overflow-wrap: anywhere;
    white-space: normal !important;
  }

  .user-data-cell::before,
  .user-money-cell::before,
  .user-contact-cell::before {
    content: attr(data-label);
    color: #698095;
    font-size: .62rem;
    font-weight: 900;
    text-transform: uppercase;
  }

  .user-contact-cell {
    display: grid;
    gap: 3px;
  }

  .user-status-badge {
    align-self: end;
  }

  .user-row-actions {
    justify-content: flex-start;
  }

  .user-view-button {
    flex: 1;
  }

  .user-action-menu > div {
    right: auto;
    left: 0;
  }

  .user-table-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .user-table-footer nav {
    width: 100%;
    justify-content: space-between;
  }

  .user-drawer {
    width: 100%;
    border-left: 0;
  }

  .user-drawer-profile {
    padding-left: 18px;
  }

  .user-drawer-section,
  .user-drawer-actions,
  .user-editor-form {
    padding-left: 18px;
    padding-right: 18px;
  }

  .user-profile-grid {
    grid-template-columns: 1fr;
  }

  .user-profile-wide {
    grid-column: auto;
  }

  .user-order-history button {
    grid-template-columns: minmax(100px, 1fr) auto 16px;
  }

  .user-order-history em {
    display: none;
  }
}

@media (max-width: 430px) {
  .user-page-heading {
    display: grid;
  }

  .user-page-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .user-filter-bar select {
    flex-basis: 100%;
  }

  .user-drawer-kpis,
  .user-identity-grid,
  .user-permission-box {
    grid-template-columns: 1fr;
  }

  .user-drawer-kpis article {
    border-right: 0;
    border-bottom: 1px solid #182934;
  }

  .user-drawer-kpis article:last-child {
    border-bottom: 0;
  }
}
/* Coupon and partner management */
.coupon-v2-panel,
[data-admin-panel="partners"] {
  color: #f4f8fc;
}

.coupon-load-state {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  min-height: 190px;
  padding: 28px;
  border: 1px solid #1b3240;
  color: #f4f8fc;
  background: linear-gradient(110deg, #091923, #080f16 56%, #07131b);
}

.coupon-load-state h2 { margin: 4px 0 7px; font-size: 30px; }
.coupon-load-state p { max-width: 580px; margin: 0; color: #8fa6b9; }
.coupon-load-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid #087da2;
  color: #00c8ff;
  background: #052534;
}
.coupon-load-icon svg { width: 22px; height: 22px; }
.coupon-load-state.is-loading .coupon-load-icon svg { animation: coupon-spin .9s linear infinite; }
.coupon-load-state.is-error .coupon-load-icon { border-color: #6b3944; color: #ff7187; background: #26131a; }
.coupon-load-lines { display: grid; width: 150px; gap: 8px; }
.coupon-load-lines i {
  display: block;
  height: 8px;
  overflow: hidden;
  background: #12242f;
}
.coupon-load-lines i::after {
  display: block;
  width: 55%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #1e5268, transparent);
  animation: coupon-shimmer 1.25s ease-in-out infinite;
  content: "";
}
.coupon-load-lines i:nth-child(2) { width: 80%; }
.coupon-load-lines i:nth-child(3) { width: 62%; }
@keyframes coupon-spin { to { transform: rotate(360deg); } }
@keyframes coupon-shimmer { from { transform: translateX(-100%); } to { transform: translateX(190%); } }

.coupon-page-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px 24px;
  margin-bottom: 16px;
  border: 1px solid #1b3240;
  background: linear-gradient(105deg, #0a1821 0%, #0b1119 50%, #0c1118 100%);
}

.coupon-page-head h2,
.partner-page-head h1 {
  margin: 3px 0 5px;
  font-size: clamp(28px, 3vw, 44px);
  line-height: 1;
}

.coupon-page-head p,
.partner-page-head p,
.coupon-editor-head p,
.partner-section > header p {
  margin: 0;
  color: #8fa6b9;
  font-size: 14px;
}

.admin-eyebrow {
  color: #00c8ff;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.coupon-page-head .button,
.partner-section .button,
.coupon-editor-actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.coupon-page-head .button svg,
.partner-section .button svg,
.coupon-editor-actions .button svg {
  width: 17px;
  height: 17px;
}

.coupon-stats-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.coupon-stat-card {
  display: flex;
  align-items: center;
  min-width: 0;
  min-height: 96px;
  gap: 12px;
  padding: 16px;
  border: 1px solid #1c3442;
  background: #09121a;
}

.coupon-stat-card > span {
  display: grid;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #036e91;
  color: #00c8ff;
  background: #052534;
}

.coupon-stat-card svg { width: 20px; height: 20px; }
.coupon-stat-card div { min-width: 0; }
.coupon-stat-card small,
.coupon-stat-card em { display: block; color: #839caf; font-size: 11px; font-style: normal; }
.coupon-stat-card strong { display: block; margin-top: 3px; overflow: hidden; color: #fff; font-size: 21px; text-overflow: ellipsis; white-space: nowrap; }

.coupon-table-card,
.partner-section {
  border: 1px solid #1b3240;
  background: #071018;
}

.coupon-filter-bar {
  display: grid;
  grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(138px, .65fr)) repeat(2, minmax(130px, .55fr));
  gap: 10px;
  padding: 14px;
  border-bottom: 1px solid #1b3240;
}

.coupon-filter-bar input,
.coupon-filter-bar select,
.coupon-editor input,
.coupon-editor select,
.coupon-editor textarea,
.partner-profile input,
.partner-profile select,
.partner-profile textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid #203947;
  border-radius: 6px;
  outline: 0;
  color: #f4f8fc;
  background: #071018;
  padding: 9px 11px;
}

.coupon-filter-bar input:focus,
.coupon-filter-bar select:focus,
.coupon-editor input:focus,
.coupon-editor select:focus,
.coupon-editor textarea:focus,
.partner-profile input:focus,
.partner-profile select:focus,
.partner-profile textarea:focus {
  border-color: #00bcec;
  box-shadow: 0 0 0 2px rgb(0 188 236 / 12%);
}

.coupon-search { position: relative; }
.coupon-search svg { position: absolute; z-index: 1; top: 12px; left: 12px; width: 17px; height: 17px; color: #7c96a9; }
.coupon-search input { padding-left: 38px; }
.date-filter { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 7px; color: #7f98ac; font-size: 11px; }

.coupon-table-scroll { width: 100%; overflow-x: auto; }
.coupon-data-table { width: 100%; min-width: 1100px; border-collapse: collapse; }
.coupon-data-table th { padding: 12px 14px; color: #7ea3c3; background: #0b151e; font-size: 10px; text-align: left; text-transform: uppercase; }
.coupon-data-table td { padding: 13px 14px; border-top: 1px solid #172d39; color: #c5d3df; font-size: 12px; vertical-align: middle; }
.coupon-data-table tbody tr { transition: background .18s ease; }
.coupon-data-table tbody tr:hover { background: #0a1b25; }
.coupon-data-table td > strong,
.coupon-data-table td > small { display: block; }
.coupon-data-table td > small { max-width: 230px; margin-top: 3px; overflow: hidden; color: #7893a7; text-overflow: ellipsis; white-space: nowrap; }
.coupon-code { color: #00c8ff; letter-spacing: 0; }

.status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid #29404d;
  border-radius: 999px;
  color: #aac0d0;
  background: #111c24;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}
.status-pill.is-active { border-color: #087d56; color: #39e3a0; background: #073023; }
.status-pill.is-inactive,
.status-pill.is-expired { border-color: #613340; color: #ff7890; background: #28131a; }
.status-pill.is-scheduled,
.status-pill.is-limit { border-color: #7b5d0d; color: #ffd35a; background: #2a2208; }

.table-actions { display: flex; gap: 5px; }
.table-actions button,
.coupon-pagination button,
.icon-button {
  display: inline-grid;
  width: 34px;
  height: 34px;
  padding: 0;
  place-items: center;
  border: 1px solid #29404e;
  border-radius: 5px;
  color: #c5d5df;
  background: #0b151e;
  cursor: pointer;
}
.table-actions button:hover,
.coupon-pagination button:hover:not(:disabled),
.icon-button:hover { border-color: #00bcec; color: #00c8ff; }
.table-actions button.danger { color: #ff516b; }
.table-actions svg,
.coupon-pagination svg,
.icon-button svg { width: 15px; height: 15px; }

.coupon-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-top: 1px solid #1b3240;
  color: #829bad;
  font-size: 12px;
}
.coupon-pagination div { display: flex; align-items: center; gap: 10px; }
.coupon-pagination button:disabled { opacity: .35; cursor: default; }

.coupon-empty,
.partner-empty {
  display: grid;
  min-height: 150px;
  place-items: center;
  align-content: center;
  gap: 8px;
  color: #859daf;
  text-align: center;
}
.coupon-empty svg,
.partner-empty svg { width: 28px; height: 28px; color: #00bcec; }

.coupon-editor {
  position: fixed;
  z-index: 400;
  top: 0;
  right: 0;
  width: min(780px, 94vw);
  height: 100dvh;
  overflow-y: auto;
  border-left: 1px solid #1e4658;
  color: #edf6fb;
  background: #060d13;
  box-shadow: -26px 0 70px rgb(0 0 0 / 58%);
}
.coupon-editor-head {
  position: sticky;
  z-index: 3;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px;
  border-bottom: 1px solid #1b3442;
  background: rgb(6 13 19 / 96%);
  backdrop-filter: blur(14px);
}
.coupon-editor-head h3 { margin: 4px 0 5px; font-size: 26px; }
.coupon-form-section { padding: 20px 24px; border-bottom: 1px solid #162e3b; }
.coupon-form-section h4 { margin: 0 0 14px; font-size: 15px; }
.coupon-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.coupon-form-grid.thirds { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.coupon-form-grid label { display: grid; min-width: 0; gap: 6px; color: #91a9ba; font-size: 11px; font-weight: 700; }
.coupon-form-grid label.wide,
.coupon-form-grid .wide { grid-column: 1 / -1; }
.coupon-form-grid select[multiple] { min-height: 112px; }
.partner-account-preview {
  padding: 14px;
  border: 1px solid #1d3a49;
  border-radius: 6px;
  background: #07141c;
}
.partner-account-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 18px;
}
.partner-account-summary > div {
  display: grid;
  min-width: 0;
  gap: 4px;
}
.partner-account-summary > div.wide { grid-column: 1 / -1; }
.partner-account-summary small {
  color: #6f91a6;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.partner-account-summary strong {
  color: #eef7fb;
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.partner-account-empty {
  display: flex;
  align-items: center;
  min-height: 42px;
  gap: 10px;
  color: #8fa8b8;
  font-size: 12px;
}
.partner-account-empty svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  color: #00c8ff;
}
.coupon-check-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-top: 14px; }
.coupon-check-grid label { display: flex; align-items: center; gap: 8px; padding: 10px; border: 1px solid #1d3846; color: #b7c9d5; background: #09151d; font-size: 12px; }
.coupon-check-grid input { width: 16px; min-height: 16px; }
.coupon-help { margin: 9px 0 0; color: #6f899c; font-size: 11px; }
.coupon-editor-actions { position: sticky; bottom: 0; display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid #1b3442; background: rgb(6 13 19 / 97%); }
.coupon-editor .hidden { display: none !important; }

.partner-mini-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.partner-mini-stats span { padding: 12px; border: 1px solid #1d3846; background: #08141c; }
.partner-mini-stats small,
.partner-mini-stats strong { display: block; }
.partner-mini-stats small { color: #7895aa; font-size: 10px; }
.partner-mini-stats strong { margin-top: 5px; color: #00c8ff; font-size: 16px; }
.commission-selection { display: grid; max-height: 170px; overflow-y: auto; gap: 6px; margin-bottom: 12px; }
.commission-selection label { display: flex; align-items: center; gap: 8px; padding: 9px; border: 1px solid #1d3846; }
.commission-selection input { width: 15px; min-height: 15px; }

.coupon-toast-region { position: fixed; z-index: 1000; right: 20px; bottom: 20px; display: grid; max-width: min(380px, calc(100vw - 30px)); gap: 8px; }
.coupon-toast { padding: 13px 15px; border: 1px solid #087c57; color: #d8fff0; background: #08261c; box-shadow: 0 12px 34px rgb(0 0 0 / 40%); font-size: 13px; }
.coupon-toast.is-error { border-color: #853246; color: #ffe0e5; background: #2a1118; }
.coupon-ui-busy { cursor: progress; }

/* Checkout coupon */
.summary-coupon-box { padding: 16px 0; border-top: 1px solid #1c3441; border-bottom: 1px solid #1c3441; }
.summary-coupon-title { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.summary-coupon-title h3 { margin: 0; font-size: 14px; }
.summary-coupon-title p { margin: 3px 0 0; color: #7f99ab; font-size: 11px; }
.summary-coupon-box .inline-control { display: grid; grid-template-columns: 1fr auto; gap: 7px; }
.summary-coupon-box input { min-width: 0; border: 1px solid #213b49; border-radius: 5px; color: #eef7fb; background: #071018; }
.coupon-feedback { min-height: 17px; margin: 8px 0 0; color: #86a2b5; font-size: 11px; }
.coupon-feedback.is-loading { color: #64cceb; }
.coupon-feedback.is-success { color: #45e6a4; }
.coupon-feedback.is-error { color: #ff8095; }
.summary-coupon-box button[aria-busy="true"] { cursor: progress; opacity: .72; }
.order-totals .discount-row dd { color: #45e6a4; font-weight: 800; }
.coupon-applied-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; padding: 11px; border: 1px solid #087653; color: #a9f5d3; background: #08241b; }
.coupon-applied-card > div { min-width: 0; }
.coupon-applied-card strong,
.coupon-applied-card span { display: block; }
.coupon-applied-card strong { color: #45e6a4; font-size: 13px; }
.coupon-applied-card span { margin-top: 2px; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.coupon-applied-card button { border: 0; color: #ff7188; background: transparent; font-size: 11px; font-weight: 800; cursor: pointer; }

/* Protected partner portal */
.partner-body { min-height: 100vh; margin: 0; color: #eef6fb; background: #05080c; }
.partner-topbar { position: sticky; z-index: 30; top: 0; display: flex; align-items: center; justify-content: space-between; height: 68px; padding: 0 28px; border-bottom: 1px solid #17303d; background: rgb(5 8 12 / 96%); backdrop-filter: blur(16px); }
.partner-brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.partner-brand img { width: 42px; height: 42px; object-fit: contain; }
.partner-brand strong,
.partner-brand small { display: block; }
.partner-brand small { margin-top: 2px; color: #7894a7; font-size: 10px; }
.partner-topbar > div { display: flex; align-items: center; gap: 16px; color: #a9bcc9; font-size: 12px; }
.partner-topbar a,
.partner-topbar button { border: 0; color: #cfe0e9; background: transparent; font: inherit; text-decoration: none; cursor: pointer; }
.partner-topbar a:hover,
.partner-topbar button:hover { color: #00c8ff; }
.partner-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); min-height: calc(100vh - 68px); }
.partner-sidebar { position: sticky; top: 68px; height: calc(100vh - 68px); padding: 22px 14px; border-right: 1px solid #17303d; background: #070c12; }
.partner-sidebar p { margin: 0 10px 12px; color: #668299; font-size: 10px; font-weight: 800; }
.partner-sidebar button { display: flex; align-items: center; width: 100%; gap: 10px; min-height: 42px; margin-bottom: 4px; padding: 0 12px; border: 1px solid transparent; border-radius: 5px; color: #9eb1bf; background: transparent; cursor: pointer; text-align: left; }
.partner-sidebar button:hover { color: #fff; background: #0b1821; }
.partner-sidebar button.active { border-color: #084761; color: #fff; background: #09283a; }
.partner-sidebar svg { width: 17px; height: 17px; color: #00c8ff; }
.partner-main { min-width: 0; padding: 30px; }
.partner-page-head { margin-bottom: 20px; }
.partner-section { margin-top: 18px; }
.partner-section > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid #1b3240; }
.partner-section > header h2 { margin: 0 0 4px; font-size: 20px; }
.partner-coupon-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 16px; }
.partner-coupon-card { min-width: 0; padding: 16px; border: 1px solid #1d3948; background: #08151d; }
.partner-coupon-card header { display: flex; align-items: center; justify-content: space-between; }
.partner-coupon-card header small { color: #7f9caf; font-size: 10px; text-transform: uppercase; }
.partner-coupon-card > strong { display: block; margin-top: 16px; color: #00c8ff; font-size: 25px; }
.partner-coupon-card > p { min-height: 34px; color: #9db1bf; font-size: 12px; }
.partner-coupon-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin: 14px 0; }
.partner-coupon-card dl div { padding: 9px; border: 1px solid #1a3340; }
.partner-coupon-card dt { color: #6f8a9f; font-size: 9px; text-transform: uppercase; }
.partner-coupon-card dd { margin: 4px 0 0; color: #eff7fb; font-size: 12px; font-weight: 800; }
.partner-card-actions { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
.partner-card-actions input { min-width: 0; border: 1px solid #1f3a48; color: #7893a6; background: #050c11; font-size: 10px; }
.partner-card-actions button { display: flex; align-items: center; gap: 6px; border: 1px solid #087aa0; color: #00c8ff; background: #072231; cursor: pointer; font-size: 10px; font-weight: 800; }
.partner-card-actions svg { width: 14px; height: 14px; }
.partner-profile { padding-bottom: 18px; }
.partner-profile form { padding: 20px; }
.form-submit { display: flex; justify-content: flex-end; }
.partner-loading,
.partner-access-error { display: grid; min-height: 100vh; place-items: center; align-content: center; gap: 14px; text-align: center; }
.partner-loading span { width: 34px; height: 34px; border: 2px solid #173b4d; border-top-color: #00c8ff; border-radius: 50%; animation: coupon-spin .8s linear infinite; }
.partner-access-error svg { width: 42px; height: 42px; color: #ff5570; }
.partner-access-error h1,
.partner-access-error p { margin: 0; }
@keyframes coupon-spin { to { transform: rotate(360deg); } }

@media (max-width: 1280px) {
  .coupon-stats-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .coupon-filter-bar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .coupon-search { grid-column: span 2; }
  .partner-coupon-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .coupon-load-state { grid-template-columns: auto 1fr; min-height: 160px; padding: 18px; }
  .coupon-load-state h2 { font-size: 24px; }
  .coupon-load-state p { font-size: 12px; }
  .coupon-load-lines,
  .coupon-load-state > .button { grid-column: 1 / -1; width: 100%; }
  .coupon-page-head { align-items: flex-start; padding: 17px; }
  .coupon-page-head h2 { font-size: 30px; }
  .coupon-page-head p { display: none; }
  .coupon-page-head .button { min-height: 38px; padding: 0 12px; font-size: 11px; }
  .coupon-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .coupon-stat-card { min-height: 84px; padding: 12px; }
  .coupon-stat-card > span { flex-basis: 34px; width: 34px; height: 34px; }
  .coupon-stat-card strong { font-size: 17px; }
  .coupon-filter-bar { grid-template-columns: 1fr 1fr; }
  .coupon-search { grid-column: 1 / -1; }
  .date-filter { grid-template-columns: 1fr; gap: 3px; }
  .coupon-editor { width: 100vw; }
  .coupon-editor-head,
  .coupon-form-section { padding: 17px; }
  .coupon-form-grid,
  .coupon-form-grid.thirds { grid-template-columns: 1fr; }
  .coupon-form-grid label.wide,
  .coupon-form-grid .wide { grid-column: auto; }
  .partner-account-preview { grid-column: auto; }
  .partner-account-summary { grid-template-columns: 1fr; }
  .partner-account-summary > div.wide { grid-column: auto; }
  .coupon-check-grid { grid-template-columns: 1fr; }
  .partner-mini-stats { grid-template-columns: 1fr 1fr; }
  .coupon-editor-actions { padding: 13px 17px; }
  .summary-coupon-title p { display: none; }

  .partner-topbar { height: 60px; padding: 0 14px; }
  .partner-brand img { width: 36px; height: 36px; }
  .partner-brand small,
  .partner-topbar > div > span { display: none; }
  .partner-topbar > div { gap: 10px; }
  .partner-layout { display: block; min-height: calc(100vh - 60px); }
  .partner-sidebar { position: fixed; z-index: 40; top: auto; right: 0; bottom: 0; left: 0; display: grid; width: 100%; height: 66px; grid-template-columns: repeat(5, 1fr); padding: 5px; border-top: 1px solid #1c3948; border-right: 0; background: rgb(5 10 15 / 97%); backdrop-filter: blur(16px); }
  .partner-sidebar p { display: none; }
  .partner-sidebar button { display: grid; min-height: 54px; place-items: center; align-content: center; gap: 3px; margin: 0; padding: 4px; border-radius: 4px; font-size: 9px; text-align: center; }
  .partner-sidebar svg { width: 18px; height: 18px; }
  .partner-main { padding: 20px 12px 84px; }
  .partner-page-head h1 { font-size: 32px; }
  .partner-coupon-grid { grid-template-columns: 1fr; padding: 10px; }
  .partner-section > header { align-items: flex-start; padding: 14px; }
  .partner-section > header .button { min-height: 36px; padding: 0 10px; font-size: 10px; }
}

.coupon-admin-table { min-width: 1740px; }
.coupon-description-cell { display: block; max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.coupon-report-drawer { width: min(940px, 96vw); }
.coupon-detail-stats { margin: 0; }
.coupon-detail-list { display: grid; grid-template-columns: 1fr 1fr; margin: 0; border: 1px solid #1d3846; }
.coupon-detail-list > div { padding: 12px 14px; border-right: 1px solid #1d3846; border-bottom: 1px solid #1d3846; }
.coupon-detail-list > div:nth-child(2n) { border-right: 0; }
.coupon-detail-list dt { color: #7895aa; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.coupon-detail-list dd { margin: 5px 0 0; color: #eef7fb; font-size: 13px; }
.coupon-report-table { min-width: 760px; }

.partner-coupon-picker { display: grid; gap: 7px; color: #91a9ba; font-size: 11px; font-weight: 700; }
.partner-coupon-picker select { min-height: 164px; }
.partner-coupon-picker small { color: #6f899c; font-weight: 400; }
.partner-linked-list,
.partner-history-list { display: grid; gap: 7px; margin-top: 12px; }
.partner-linked-list span,
.partner-history-list span { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 12px; border: 1px solid #1d3846; background: #08141c; }
.partner-linked-list small,
.partner-history-list small { color: #7895aa; font-size: 10px; text-align: right; }
.partner-linked-list em { color: #7895aa; font-size: 12px; }

.partner-dashboard-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.partner-charts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.partner-chart { min-width: 0; padding: 18px; border: 1px solid #1b3240; background: #071018; }
.partner-chart > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.partner-chart h3 { margin: 0; color: #f4f8fc; font-size: 16px; }
.partner-chart header span { color: #708da2; font-size: 10px; }
.partner-chart-bars { display: grid; height: 180px; grid-template-columns: repeat(14, minmax(5px, 1fr)); align-items: end; gap: 6px; padding-top: 12px; border-bottom: 1px solid #1c3542; }
.partner-chart-column { display: grid; height: 100%; grid-template-rows: minmax(0, 1fr) 18px; align-items: end; gap: 5px; }
.partner-chart-column > span { display: block; width: 100%; height: var(--bar-height); min-height: 2px; background: linear-gradient(180deg, #00c8ff, #057ba5); box-shadow: 0 0 12px rgb(0 200 255 / 18%); transition: height .25s ease; }
.partner-chart-column small { overflow: hidden; color: #668397; font-size: 8px; text-align: center; }
.coupon-performance-list { display: grid; gap: 12px; }
.coupon-performance-list > div { display: grid; grid-template-columns: 88px minmax(80px, 1fr) auto; align-items: center; gap: 10px; }
.coupon-performance-list strong { overflow: hidden; color: #ddecf4; font-size: 11px; text-overflow: ellipsis; }
.coupon-performance-list span { display: block; height: 7px; overflow: hidden; background: #102631; }
.coupon-performance-list i { display: block; width: var(--progress); height: 100%; background: #00c8ff; }
.coupon-performance-list small { color: #7896aa; font-size: 9px; white-space: nowrap; }
.partner-copy-actions { display: flex; gap: 5px; }
.partner-copy-actions button { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid #17617c; color: #00c8ff; background: #07202d; cursor: pointer; }
.partner-copy-actions svg { width: 14px; height: 14px; }
.partner-commission-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.partner-coupons-table,
.partner-sales-table,
.commission-data-table { min-width: 1220px; }

@media (max-width: 1080px) {
  .partner-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .partner-charts-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .coupon-detail-list { grid-template-columns: 1fr; }
  .coupon-detail-list > div { border-right: 0; }
  .partner-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .partner-charts-grid { gap: 10px; }
  .partner-chart { padding: 14px; }
  .partner-chart-bars { height: 150px; gap: 3px; }
  .coupon-performance-list > div { grid-template-columns: 68px minmax(52px, 1fr); }
  .coupon-performance-list small { grid-column: 1 / -1; }
  .partner-commission-filters { grid-template-columns: 1fr 1fr; }
  .partner-linked-list span,
  .partner-history-list span { align-items: flex-start; flex-direction: column; gap: 3px; }
  .partner-linked-list small,
  .partner-history-list small { text-align: left; }

  .partner-section .coupon-table-scroll,
  .coupon-v2-panel .coupon-table-scroll { overflow: visible; }
  .partner-section .coupon-data-table,
  .coupon-v2-panel .coupon-admin-table { display: block; min-width: 0; }
  .partner-section .coupon-data-table thead,
  .coupon-v2-panel .coupon-admin-table thead { display: none; }
  .partner-section .coupon-data-table tbody,
  .coupon-v2-panel .coupon-admin-table tbody { display: grid; gap: 10px; padding: 10px; }
  .partner-section .coupon-data-table tr,
  .coupon-v2-panel .coupon-admin-table tr { display: grid; padding: 12px; border: 1px solid #1b3442; background: #08141c; }
  .partner-section .coupon-data-table td,
  .coupon-v2-panel .coupon-admin-table td { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid #142a36; text-align: right; }
  .partner-section .coupon-data-table td:first-child,
  .coupon-v2-panel .coupon-admin-table td:first-child { border-top: 0; }
  .partner-section .coupon-data-table td::before,
  .coupon-v2-panel .coupon-admin-table td::before { flex: 0 0 42%; color: #6f91a7; font-size: 9px; font-weight: 800; text-align: left; text-transform: uppercase; }
  .coupon-admin-table td:nth-child(1)::before { content: "Cupom"; }
  .coupon-admin-table td:nth-child(4)::before { content: "Desconto"; }
  .coupon-admin-table td:nth-child(8)::before { content: "Usos"; }
  .coupon-admin-table td:nth-child(10)::before { content: "Vendido"; }
  .coupon-admin-table td:nth-child(11)::before { content: "Comissao"; }
  .coupon-admin-table td:nth-child(12)::before { content: "Status"; }
  .coupon-admin-table td:nth-child(13)::before { content: "Acoes"; }
  .coupon-admin-table td:nth-child(2),
  .coupon-admin-table td:nth-child(3),
  .coupon-admin-table td:nth-child(5),
  .coupon-admin-table td:nth-child(6),
  .coupon-admin-table td:nth-child(7),
  .coupon-admin-table td:nth-child(9) { display: none; }
  .coupon-admin-table .coupon-row-actions { justify-content: flex-end; flex-wrap: wrap; }
  .partner-coupons-table td:nth-child(1)::before { content: "Codigo"; }
  .partner-coupons-table td:nth-child(2)::before { content: "Descricao"; }
  .partner-coupons-table td:nth-child(3)::before { content: "Desconto"; }
  .partner-coupons-table td:nth-child(4)::before { content: "Validade"; }
  .partner-coupons-table td:nth-child(5)::before { content: "Usos"; }
  .partner-coupons-table td:nth-child(6)::before { content: "Limite"; }
  .partner-coupons-table td:nth-child(7)::before { content: "Vendas"; }
  .partner-coupons-table td:nth-child(8)::before { content: "Comissao"; }
  .partner-coupons-table td:nth-child(9)::before { content: "Status"; }
  .partner-coupons-table td:nth-child(10)::before { content: "Divulgacao"; }
  .partner-sales-table td:nth-child(1)::before,
  .commission-data-table td:nth-child(1)::before { content: "Pedido"; }
  .partner-sales-table td:nth-child(2)::before { content: "Data"; }
  .partner-sales-table td:nth-child(3)::before { content: "Cliente"; }
  .partner-sales-table td:nth-child(4)::before,
  .commission-data-table td:nth-child(2)::before { content: "Cupom"; }
  .partner-sales-table td:nth-child(5)::before { content: "Original"; }
  .partner-sales-table td:nth-child(6)::before { content: "Desconto"; }
  .partner-sales-table td:nth-child(7)::before { content: "Final"; }
  .partner-sales-table td:nth-child(8)::before,
  .commission-data-table td:nth-child(7)::before { content: "Comissao"; }
  .partner-sales-table td:nth-child(9)::before { content: "Pagamento"; }
  .partner-sales-table td:nth-child(10)::before,
  .commission-data-table td:nth-child(10)::before { content: "Status"; }
  .commission-data-table td:nth-child(3)::before { content: "Venda"; }
  .commission-data-table td:nth-child(4)::before { content: "Pedido"; }
  .commission-data-table td:nth-child(5)::before { content: "Base"; }
  .commission-data-table td:nth-child(6)::before { content: "Regra"; }
  .commission-data-table td:nth-child(8)::before { content: "Liberacao"; }
  .commission-data-table td:nth-child(9)::before { content: "Pagamento"; }
}

/* Official horizontal SimRacingHouse wordmark. The square mark remains available
   for favicons, compact navigation and administrative icon surfaces. */
.brand-logo.brand-logo-wide,
.mobile-product-footer .brand-logo-wide {
  display: block;
  width: 238px;
  max-width: 100%;
  height: 54px;
  border: 0;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
  background: #000;
  box-shadow: none;
  mix-blend-mode: screen;
}

body[data-page="store"] .home-site-header .brand-logo.brand-logo-wide,
body[data-page="about"] .home-site-header .brand-logo.brand-logo-wide {
  width: 238px;
  height: 54px;
  border: 0;
  border-radius: 0;
  object-fit: cover;
}

body[data-page="store"] .home-site-header .premium-brand:has(> .brand-logo-wide),
body[data-page="about"] .home-site-header .premium-brand:has(> .brand-logo-wide) {
  min-width: 238px;
}

.brand-logo-wide + span {
  display: none;
}

.brand:has(> .brand-logo-wide) {
  min-width: 238px;
  gap: 0;
}

.home-footer-brand .brand-logo-wide {
  width: 260px;
  height: 58px;
}

.checkout-header .brand-logo-wide,
.checkout-footer .brand-logo-wide,
.receipt-site-header .brand-logo-wide {
  width: 230px;
  height: 52px;
}

.mobile-product-footer .brand-logo-wide {
  width: min(260px, 86vw);
  height: 58px;
  margin-inline: auto;
}

@media (max-width: 1380px) and (min-width: 761px) {
  body:not([data-page="admin"]):not([data-page="checkout"]) .site-header .brand-logo-wide {
    width: 205px;
    height: 48px;
  }

  body:not([data-page="admin"]):not([data-page="checkout"]) .site-header .brand:has(> .brand-logo-wide) {
    min-width: 205px;
  }

  body[data-page="store"] .home-site-header .brand-logo.brand-logo-wide,
  body[data-page="about"] .home-site-header .brand-logo.brand-logo-wide {
    width: 190px;
    height: 44px;
  }

  body[data-page="store"] .home-site-header .premium-brand:has(> .brand-logo-wide),
  body[data-page="about"] .home-site-header .premium-brand:has(> .brand-logo-wide) {
    min-width: 190px;
  }
}

/* Product variations */
.product-variation-editor {
  display: grid;
  gap: 16px;
}

.product-variation-editor-heading,
.product-variation-editor-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.product-variation-editor-heading h4 {
  margin-bottom: 4px;
}

.product-variation-editor-heading .editor-card-note {
  margin: 0;
}

.product-variation-editor-actions {
  justify-content: flex-start;
  padding-top: 2px;
}

.product-variation-editor-actions span {
  color: #82a1b8;
  font-size: .78rem;
}

.product-variant-option-list,
.product-variant-combination-list {
  display: grid;
  gap: 9px;
  min-width: 0;
}

.product-variant-option-row {
  display: grid;
  grid-template-columns: minmax(150px, .8fr) minmax(120px, .4fr) minmax(260px, 1.6fr) 42px;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid #233340;
  border-radius: 7px;
  background: #070c11;
}

.product-variant-values-field {
  min-width: 0;
}

.product-variant-option-row .icon-button {
  width: 42px;
  min-width: 42px;
  height: 42px;
  padding: 0;
}

.product-variant-empty {
  min-height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px dashed #284153;
  border-radius: 7px;
  color: #7894a9;
  background: rgba(4, 12, 18, .58);
}

.product-variant-empty svg {
  width: 20px;
  height: 20px;
  color: #00c8ff;
}

.product-variant-combination-list {
  overflow-x: auto;
  padding-bottom: 2px;
}

.product-variant-table-head,
.product-variant-row {
  min-width: 1110px;
  display: grid;
  grid-template-columns: minmax(180px, 1.35fr) minmax(105px, .68fr) minmax(95px, .62fr) minmax(95px, .62fr) minmax(175px, 1.08fr) minmax(220px, 1.4fr) minmax(64px, .42fr);
  gap: 8px;
  align-items: center;
}

.product-variant-table-head {
  padding: 0 10px;
  color: #7894a9;
  font-size: .68rem;
  font-weight: 900;
  text-transform: uppercase;
}

.product-variant-row {
  min-height: 62px;
  padding: 9px 10px;
  border: 1px solid #1d2b36;
  border-radius: 6px;
  background: #080e14;
}

.product-variant-row > strong {
  min-width: 0;
  overflow: hidden;
  color: #f5f9fc;
  font-size: .78rem;
  line-height: 1.3;
  text-overflow: ellipsis;
}

.product-variant-row input {
  min-width: 0;
  min-height: 38px;
  padding: 8px 9px;
  font-size: .76rem;
}

.product-variant-image-control {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
}

.product-variant-image-control select {
  min-width: 0;
  min-height: 38px;
  padding: 7px 8px;
  font-size: .72rem;
}

.product-variant-image-thumb {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border: 1px solid #294252;
  border-radius: 5px;
  background: #03070a;
  color: #00c8ff;
}

.product-variant-image-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.product-variant-image-thumb svg {
  width: 17px;
  height: 17px;
}

.product-variant-stock-fields {
  display: grid;
  grid-template-columns: auto minmax(64px, 1fr);
  align-items: center;
  gap: 7px;
}

.product-variant-stock-fields label,
.product-variant-active {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #9db1c0;
  font-size: .7rem;
  white-space: nowrap;
}

.product-variant-stock-fields input[type="checkbox"],
.product-variant-active input {
  width: 17px;
  min-width: 17px;
  height: 17px;
  min-height: 17px;
  padding: 0;
  accent-color: #00baf2;
}

.product-variant-active {
  justify-content: center;
}

.product-variant-selector {
  display: grid;
  gap: 12px;
  margin: 14px 0;
  padding: 14px 0;
  border-top: 1px solid #1d2c37;
  border-bottom: 1px solid #1d2c37;
}

.product-variant-selector-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.product-variant-selector-heading strong {
  color: #f7fafc;
  font-size: .84rem;
}

.product-variant-selector-heading span {
  min-width: 0;
  overflow: hidden;
  color: #00c8ff;
  font-size: .7rem;
  font-weight: 800;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-variant-selector fieldset {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.product-variant-selector legend {
  width: 100%;
  margin-bottom: 7px;
  color: #9db1c0;
  font-size: .72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.product-variant-selector legend span {
  margin-left: 6px;
  color: #eef5fa;
  font-weight: 700;
  text-transform: none;
}

.product-variant-values {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.product-variant-values button {
  min-width: 52px;
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #2a3a46;
  border-radius: 5px;
  background: #080e14;
  color: #d7e1e8;
  font: inherit;
  font-size: .76rem;
  font-weight: 800;
  cursor: pointer;
  transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.product-variant-values button:hover:not(:disabled) {
  border-color: #00aee8;
  color: #fff;
  transform: translateY(-1px);
}

.product-variant-values button.active {
  border-color: #00c8ff;
  background: #062130;
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(0, 200, 255, .18);
}

.product-variant-values button:disabled {
  opacity: .34;
  cursor: not-allowed;
  text-decoration: line-through;
}

.product-variant-values.is-swatches button {
  min-width: 46px;
  padding-inline: 9px;
}

.product-variant-values.is-swatches button i {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  border: 2px solid #596873;
  border-radius: 50%;
  background: var(--variant-swatch);
  box-shadow: 0 0 0 2px #080e14;
}

.product-variant-values.is-swatches button.active i {
  border-color: #fff;
  box-shadow: 0 0 0 2px #00c8ff;
}

.product-variant-availability {
  min-height: 18px;
  margin: -2px 0 0;
  color: #1bd783;
  font-size: .72rem;
  font-weight: 800;
}

.product-variant-availability.is-unavailable {
  color: #ff647c;
}

@media (max-width: 980px) {
  .product-variant-option-row {
    grid-template-columns: minmax(140px, 1fr) minmax(120px, .5fr) 42px;
  }

  .product-variant-values-field {
    grid-column: 1 / 3;
    grid-row: 2;
  }

  .product-variant-option-row .icon-button {
    grid-column: 3;
    grid-row: 1 / 3;
    align-self: end;
  }
}

@media (max-width: 760px) {
  .product-variation-editor-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .product-variation-editor-heading .secondary-button,
  .product-variation-editor-actions .secondary-button {
    width: 100%;
  }

  .product-variation-editor-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .product-variant-option-row {
    grid-template-columns: minmax(0, 1fr) 42px;
  }

  .product-variant-option-row > label {
    grid-column: 1;
  }

  .product-variant-values-field {
    grid-column: 1 / 3;
    grid-row: auto;
  }

  .product-variant-option-row .icon-button {
    grid-column: 2;
    grid-row: 1;
  }

  .product-variant-selector {
    gap: 14px;
    margin-block: 16px;
    padding-block: 16px;
  }

  .product-variant-selector-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  .product-variant-selector-heading span {
    max-width: 100%;
    text-align: left;
  }

  .product-variant-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-variant-values button {
    width: 100%;
    min-height: 44px;
  }

  .product-variant-values.is-swatches {
    display: flex;
  }

  .product-variant-values.is-swatches button {
    width: auto;
    min-width: 54px;
  }
}

@media (max-width: 760px) {
  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .premium-brand:has(> .brand-logo-wide),
  body[data-page="store"] .home-site-header .premium-brand:has(> .brand-logo-wide),
  body[data-page="about"] .home-site-header .premium-brand:has(> .brand-logo-wide) {
    width: min(188px, 100%);
    min-width: 0;
  }

  body:not([data-page="admin"]):not([data-page="checkout"]):not([data-page="login"]):not([data-page="register"]) .site-header .brand-logo.brand-logo-wide,
  body[data-page="store"] .home-site-header .brand-logo.brand-logo-wide,
  body[data-page="about"] .home-site-header .brand-logo.brand-logo-wide {
    width: 100%;
    height: 42px;
    border: 0;
    border-radius: 0;
    object-fit: cover;
  }

  .checkout-header .brand:has(> .brand-logo-wide),
  .checkout-footer .brand:has(> .brand-logo-wide) {
    min-width: 0;
  }

  .checkout-header .brand-logo-wide,
  .checkout-footer .brand-logo-wide,
  .receipt-site-header .brand-logo-wide {
    width: min(185px, 52vw);
    height: 42px;
  }

  body[data-page="account-confirmation"] .auth-minimal-header,
  body[data-page="password-reset"] .auth-minimal-header {
    display: flex;
    height: 64px;
    min-height: 64px;
    padding: 7px 11px;
  }

  body[data-page="account-confirmation"] .auth-minimal-header .brand,
  body[data-page="password-reset"] .auth-minimal-header .brand {
    width: min(190px, 58vw);
    min-width: 0;
  }

  body[data-page="account-confirmation"] .auth-minimal-header .brand-logo-wide,
  body[data-page="password-reset"] .auth-minimal-header .brand-logo-wide {
    width: 100%;
    height: 42px;
  }

  body[data-page="account-confirmation"] .auth-minimal-header .button,
  body[data-page="password-reset"] .auth-minimal-header .button {
    width: auto;
    min-height: 38px;
    margin: 0 0 0 auto;
    padding-inline: 12px;
    font-size: .72rem;
  }
}

/* Full mobile administration */
.admin-sidebar-backdrop,
.admin-mobile-nav {
  display: none;
}

@media (max-width: 760px) {
  body[data-page="admin"] {
    min-width: 0;
    padding-bottom: calc(66px + env(safe-area-inset-bottom));
    overflow-x: hidden;
    background: #05080c;
  }

  body[data-page="admin"].admin-menu-open {
    overflow: hidden;
  }

  body[data-page="admin"] .admin-topbar {
    position: sticky;
    z-index: 100;
    top: 0;
    display: grid;
    width: 100%;
    height: 60px;
    min-height: 60px;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 8px;
    box-sizing: border-box;
    border-bottom: 1px solid #172430;
    padding: 6px 10px;
    background: rgba(4, 9, 14, .97);
    backdrop-filter: blur(16px);
  }

  body[data-page="admin"] .admin-topbar > .admin-menu-button {
    grid-column: 1;
    grid-row: 1;
    width: 44px;
    min-height: 44px;
    border: 1px solid #1c3040;
    border-radius: 6px;
    color: #d9e7f1;
    background: #071019;
  }

  body[data-page="admin"] .admin-topbar > .admin-menu-button svg {
    width: 20px;
    height: 20px;
  }

  body[data-page="admin"] .admin-topbar > .brand {
    display: flex;
    min-width: 0;
    height: 44px;
    grid-column: 2;
    grid-row: 1;
    gap: 8px;
    border-right: 0;
    padding: 0;
  }

  body[data-page="admin"] .admin-topbar > .brand .brand-logo {
    width: 36px;
    height: 36px;
    border-radius: 5px;
    object-fit: contain;
  }

  body[data-page="admin"] .admin-topbar > .brand span {
    min-width: 0;
  }

  body[data-page="admin"] .admin-topbar > .brand strong,
  body[data-page="admin"] .admin-topbar > .brand small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body[data-page="admin"] .admin-topbar > .brand strong {
    font-size: .82rem;
  }

  body[data-page="admin"] .admin-topbar > .brand small {
    color: #6f8598;
    font-size: .62rem;
  }

  body[data-page="admin"] .admin-topbar > .main-nav {
    display: flex;
    min-width: 0;
    grid-column: 3;
    grid-row: 1;
    gap: 5px;
    padding: 0;
  }

  body[data-page="admin"] .admin-notification,
  body[data-page="admin"] .admin-profile-button {
    display: none;
  }

  body[data-page="admin"] .admin-store-button,
  body[data-page="admin"] #logoutButton {
    display: inline-flex;
    min-width: 0;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    border: 1px solid #1c3040;
    border-radius: 6px;
    padding: 0 9px;
    color: #d9e7f1;
    background: #071019;
    font-size: .66rem;
    font-weight: 850;
    white-space: nowrap;
  }

  body[data-page="admin"] .admin-shell {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .admin-sidebar {
    position: fixed;
    z-index: 72;
    top: 64px;
    bottom: calc(66px + env(safe-area-inset-bottom));
    left: 0;
    display: block;
    width: min(330px, 88vw);
    min-height: 0;
    border-right: 1px solid #213747;
    border-bottom: 0;
    padding: 12px 10px 22px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #050b11;
    box-shadow: 22px 0 56px rgba(0, 0, 0, .62);
    transform: translateX(-105%);
    visibility: hidden;
    transition: transform 180ms ease, visibility 180ms ease;
  }

  body[data-page="admin"] .admin-shell.sidebar-open .admin-sidebar {
    display: block;
    transform: translateX(0);
    visibility: visible;
  }

  body[data-page="admin"] .admin-sidebar .admin-brand {
    position: sticky;
    z-index: 2;
    top: -12px;
    background: #050b11;
  }

  body[data-page="admin"] .admin-sidebar .admin-tab,
  body[data-page="admin"] .admin-sidebar .admin-store-link {
    min-height: 44px;
    font-size: .8rem;
  }

  body[data-page="admin"] .admin-sidebar .admin-tabs {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .admin-sidebar .admin-section-label {
    margin-top: 14px;
  }

  body[data-page="admin"] .admin-sidebar-backdrop {
    position: fixed;
    z-index: 65;
    inset: 64px 0 calc(66px + env(safe-area-inset-bottom));
    display: block;
    border: 0;
    padding: 0;
    background: rgba(0, 0, 0, .7);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 180ms ease, visibility 180ms ease;
  }

  body[data-page="admin"] .admin-shell.sidebar-open .admin-sidebar-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  body[data-page="admin"] .admin-mobile-nav {
    position: fixed;
    z-index: 90;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    min-height: calc(66px + env(safe-area-inset-bottom));
    grid-template-columns: repeat(auto-fit, minmax(56px, 1fr));
    padding: 5px 6px calc(5px + env(safe-area-inset-bottom));
    border-top: 1px solid #1d3444;
    background: rgba(4, 10, 15, .98);
    box-shadow: 0 -14px 34px rgba(0, 0, 0, .42);
    backdrop-filter: blur(18px);
  }

  body[data-page="admin"] .admin-mobile-nav button {
    display: grid;
    min-width: 0;
    min-height: 54px;
    place-items: center;
    align-content: center;
    gap: 3px;
    border: 0;
    border-radius: 6px;
    padding: 4px 2px;
    color: #75899a;
    background: transparent;
    font: inherit;
    cursor: pointer;
  }

  body[data-page="admin"] .admin-mobile-nav button.hidden {
    display: none;
  }

  body[data-page="admin"] .admin-mobile-nav button.active,
  body[data-page="admin"] .admin-mobile-nav button[aria-expanded="true"] {
    color: #00c8ff;
    background: rgba(0, 200, 255, .09);
  }

  body[data-page="admin"] .admin-mobile-nav svg {
    width: 19px;
    height: 19px;
    stroke-width: 1.9;
  }

  body[data-page="admin"] .admin-mobile-nav span {
    max-width: 100%;
    overflow: hidden;
    font-size: .58rem;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body[data-page="admin"] .admin-workspace {
    width: 100%;
    min-width: 0;
    padding: 12px 10px 24px;
  }

  body[data-page="admin"] .admin-panel,
  body[data-page="admin"] .admin-panel > *,
  body[data-page="admin"] .product-editor-layout,
  body[data-page="admin"] .product-editor-form,
  body[data-page="admin"] .product-editor-side,
  body[data-page="admin"] .category-admin-layout,
  body[data-page="admin"] .category-table-card,
  body[data-page="admin"] .category-editor-column,
  body[data-page="admin"] .category-editor-card,
  body[data-page="admin"] .utility-grid {
    min-width: 0;
    max-width: 100%;
  }

  body[data-page="admin"] .admin-panel-heading,
  body[data-page="admin"] .product-editor-heading,
  body[data-page="admin"] .category-page-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 14px;
    padding-inline: 0;
  }

  body[data-page="admin"] .admin-panel-heading h3,
  body[data-page="admin"] .product-editor-heading h3,
  body[data-page="admin"] .category-page-heading h3 {
    max-width: 100%;
    margin: 0;
    font-size: clamp(1.5rem, 7vw, 2rem);
    line-height: 1.08;
    overflow-wrap: anywhere;
  }

  body[data-page="admin"] .category-page-heading p,
  body[data-page="admin"] .product-editor-heading p {
    font-size: .72rem;
  }

  body[data-page="admin"] .product-editor-actions,
  body[data-page="admin"] .category-page-actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body[data-page="admin"] .product-editor-actions > *,
  body[data-page="admin"] .category-page-actions > * {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding-inline: 9px;
    font-size: .7rem;
  }

  body[data-page="admin"] .product-editor-actions #saveProductButton {
    grid-column: 1 / -1;
  }

  body[data-page="admin"] .product-editor-layout,
  body[data-page="admin"] .product-editor-side,
  body[data-page="admin"] .editor-grid,
  body[data-page="admin"] .media-editor,
  body[data-page="admin"] .pricing-grid,
  body[data-page="admin"] .fee-grid,
  body[data-page="admin"] .admin-form,
  body[data-page="admin"] .category-admin-layout,
  body[data-page="admin"] .category-editor-grid,
  body[data-page="admin"] .two-columns,
  body[data-page="admin"] .utility-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .span-2,
  body[data-page="admin"] .span-3,
  body[data-page="admin"] .form-wide {
    grid-column: auto;
  }

  body[data-page="admin"] .editor-card,
  body[data-page="admin"] .admin-form,
  body[data-page="admin"] .utility-card {
    border-radius: 7px;
    padding: 14px;
  }

  body[data-page="admin"] .editor-card h4 {
    margin-bottom: 12px;
    font-size: 1rem;
  }

  body[data-page="admin"] input:not([type="checkbox"]):not([type="radio"]),
  body[data-page="admin"] select,
  body[data-page="admin"] textarea {
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    font-size: 16px;
  }

  body[data-page="admin"] textarea {
    line-height: 1.45;
  }

  body[data-page="admin"] button,
  body[data-page="admin"] a.button,
  body[data-page="admin"] .row-action,
  body[data-page="admin"] .category-primary-button,
  body[data-page="admin"] .category-secondary-button {
    touch-action: manipulation;
  }

  body[data-page="admin"] .image-preview {
    display: grid;
    min-height: 140px;
    grid-auto-columns: minmax(150px, 72vw);
    grid-auto-flow: column;
    grid-template-columns: none;
    place-items: stretch;
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }

  body[data-page="admin"] .preview-item {
    scroll-snap-align: start;
  }

  body[data-page="admin"] .preview-item img {
    height: 150px;
    object-fit: contain;
    background: #05090d;
  }

  body[data-page="admin"] .preview-count {
    position: sticky;
    left: 0;
    align-self: end;
  }

  body[data-page="admin"] .admin-list {
    gap: 9px;
  }

  body[data-page="admin"] .admin-row {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    border-radius: 7px;
    padding: 11px;
  }

  body[data-page="admin"] .admin-thumb {
    width: 68px;
    height: 62px;
    border-radius: 5px;
    object-fit: contain;
  }

  body[data-page="admin"] .admin-row h4 {
    font-size: .88rem;
    line-height: 1.28;
    overflow-wrap: anywhere;
  }

  body[data-page="admin"] .admin-row p {
    font-size: .72rem;
    line-height: 1.42;
    overflow-wrap: anywhere;
  }

  body[data-page="admin"] .admin-row-actions {
    display: grid;
    width: 100%;
    grid-column: 1 / -1;
    grid-template-columns: minmax(0, 1fr) auto auto;
    justify-content: stretch;
  }

  body[data-page="admin"] .product-publish-control {
    min-width: 0;
  }

  body[data-page="admin"] .product-publish-control select,
  body[data-page="admin"] .admin-row-actions .row-action {
    min-height: 44px;
  }

  body[data-page="admin"] .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  body[data-page="admin"] .dashboard-metric-card,
  body[data-page="admin"] .metric-card {
    min-height: 112px;
    padding: 11px;
  }

  body[data-page="admin"] .dashboard-metric-card strong,
  body[data-page="admin"] .metric-card strong {
    font-size: 1.2rem;
    overflow-wrap: anywhere;
  }

  body[data-page="admin"] .dashboard-metric-card span,
  body[data-page="admin"] .metric-card span,
  body[data-page="admin"] .dashboard-metric-card small {
    font-size: .62rem;
    line-height: 1.25;
  }

  body[data-page="admin"] .channel-dashboard,
  body[data-page="admin"] .dashboard-main-grid,
  body[data-page="admin"] .dashboard-bottom-grid,
  body[data-page="admin"] .home-featured-list {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .admin-dashboard-card {
    min-width: 0;
    padding: 14px;
  }

  body[data-page="admin"] .dashboard-card-heading {
    gap: 8px;
  }

  body[data-page="admin"] .dashboard-period-bar,
  body[data-page="admin"] .home-featured-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  body[data-page="admin"] .category-stats,
  body[data-page="admin"] .user-stats,
  body[data-page="admin"] .coupon-stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
  }

  body[data-page="admin"] .category-stat {
    min-height: 88px;
    border-top: 1px solid #172430;
    padding: 12px;
  }

  body[data-page="admin"] .category-stat:nth-child(-n + 2) {
    border-top: 0;
  }

  body[data-page="admin"] .category-stat:nth-child(odd) {
    border-left: 0;
  }

  body[data-page="admin"] .category-stat span {
    align-items: flex-start;
    font-size: .64rem;
    line-height: 1.25;
  }

  body[data-page="admin"] .category-stat strong {
    font-size: 1.05rem;
  }

  body[data-page="admin"] .category-table-toolbar,
  body[data-page="admin"] .customer-table-toolbar,
  body[data-page="admin"] .order-table-toolbar,
  body[data-page="admin"] .brand-table-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    gap: 8px;
    padding: 10px;
  }

  body[data-page="admin"] .category-table-toolbar .category-search,
  body[data-page="admin"] .customer-table-toolbar .category-search,
  body[data-page="admin"] .order-table-toolbar .category-search,
  body[data-page="admin"] .brand-table-toolbar .category-search {
    grid-column: 1 / -1;
  }

  body[data-page="admin"] .category-table-toolbar select,
  body[data-page="admin"] .customer-table-toolbar select,
  body[data-page="admin"] .order-table-toolbar select,
  body[data-page="admin"] .brand-table-toolbar select {
    grid-column: 1;
  }

  body[data-page="admin"] .category-table-toolbar .category-icon-button,
  body[data-page="admin"] .customer-table-toolbar .category-icon-button,
  body[data-page="admin"] .order-table-toolbar .category-icon-button,
  body[data-page="admin"] .brand-table-toolbar .category-icon-button {
    width: 44px;
    min-height: 44px;
    grid-column: 2;
    grid-row: 2;
  }

  body[data-page="admin"] .category-table-scroll {
    overflow: visible;
  }

  body[data-page="admin"] .category-table-head,
  body[data-page="admin"] .brand-table-head,
  body[data-page="admin"] .customer-table-head,
  body[data-page="admin"] .order-table-head {
    display: none;
  }

  body[data-page="admin"] .category-table-row,
  body[data-page="admin"] .brand-table-row {
    display: grid;
    min-width: 0;
    min-height: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    margin: 9px;
    border: 1px solid #172b38;
    border-radius: 7px;
    padding: 12px;
    background: #081119;
  }

  body[data-page="admin"] .category-order-cell {
    grid-column: 1;
  }

  body[data-page="admin"] .category-name-cell,
  body[data-page="admin"] .brand-name-cell {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  body[data-page="admin"] .category-description-cell,
  body[data-page="admin"] .brand-destination-cell {
    grid-column: 1 / -1;
    grid-row: 3;
    overflow: visible;
    color: #8497a8;
    font-size: .72rem;
    line-height: 1.4;
    text-overflow: clip;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body[data-page="admin"] .category-product-cell,
  body[data-page="admin"] .brand-product-cell {
    grid-column: 1;
    grid-row: 4;
    justify-self: start;
  }

  body[data-page="admin"] .category-product-cell::before,
  body[data-page="admin"] .brand-product-cell::before {
    content: "Produtos: ";
    color: #728698;
  }

  body[data-page="admin"] .category-status-toggle {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
  }

  body[data-page="admin"] .category-row-actions {
    grid-column: 2;
    grid-row: 4;
  }

  body[data-page="admin"] .category-row-action {
    width: 42px;
    min-height: 42px;
  }

  body[data-page="admin"] .category-table-footer,
  body[data-page="admin"] .category-editor-header,
  body[data-page="admin"] .category-editor-footer {
    align-items: stretch;
    flex-direction: column;
    gap: 9px;
  }

  body[data-page="admin"] .category-pagination {
    width: 100%;
    justify-content: space-between;
  }

  body[data-page="admin"] .category-editor-header,
  body[data-page="admin"] .category-editor-body,
  body[data-page="admin"] .category-editor-footer {
    padding: 14px;
  }

  body[data-page="admin"] .category-editor-tabs {
    width: 100%;
    gap: 20px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  body[data-page="admin"] .category-editor-tabs button {
    flex: 0 0 auto;
    min-height: 44px;
  }

  body[data-page="admin"] .category-delete-button,
  body[data-page="admin"] .category-editor-footer button {
    width: 100%;
    min-height: 44px;
  }

  body[data-page="admin"] .customer-table-body,
  body[data-page="admin"] .order-table-body {
    display: grid;
    gap: 9px;
    padding: 9px;
  }

  body[data-page="admin"] .customer-table-row,
  body[data-page="admin"] .order-table-row {
    display: grid;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 14px;
    border: 1px solid #172b38;
    border-radius: 7px;
    padding: 13px;
    background: #081119;
  }

  body[data-page="admin"] .customer-table-row > :nth-child(1),
  body[data-page="admin"] .customer-table-row > :nth-child(2),
  body[data-page="admin"] .order-table-row > :nth-child(1),
  body[data-page="admin"] .order-table-row > :nth-child(2) {
    grid-column: 1 / -1;
  }

  body[data-page="admin"] .customer-table-row > :nth-child(3),
  body[data-page="admin"] .order-table-row > :nth-child(3) {
    grid-column: 1;
  }

  body[data-page="admin"] .customer-table-row > :nth-child(4),
  body[data-page="admin"] .order-table-row > :nth-child(4) {
    grid-column: 2;
    justify-self: end;
  }

  body[data-page="admin"] .customer-table-row > :nth-child(5),
  body[data-page="admin"] .order-table-row > :nth-child(5) {
    grid-column: 1;
  }

  body[data-page="admin"] .customer-table-row > :nth-child(6),
  body[data-page="admin"] .order-table-row > :nth-child(6) {
    grid-column: 2;
    justify-self: end;
  }

  body[data-page="admin"] .customer-table-row strong,
  body[data-page="admin"] .customer-table-row span,
  body[data-page="admin"] .customer-table-row small,
  body[data-page="admin"] .order-table-row strong,
  body[data-page="admin"] .order-table-row span,
  body[data-page="admin"] .order-table-row small {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  body[data-page="admin"] .customer-table-row .row-action,
  body[data-page="admin"] .order-table-row .row-action {
    min-height: 42px;
  }

  body[data-page="admin"] .customer-detail-header {
    align-items: stretch;
    flex-direction: column;
  }

  body[data-page="admin"] .customer-detail-list {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .customer-order-list article {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  body[data-page="admin"] .customer-order-list article strong {
    grid-column: 1 / -1;
  }

  body[data-page="admin"] .admin-actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-page="admin"] .admin-actions > * {
    width: 100%;
    min-height: 44px;
  }

  body[data-page="admin"] .coupon-editor,
  body[data-page="admin"] .user-drawer {
    max-width: 100vw;
  }

  body[data-page="admin"] .coupon-editor {
    top: 64px;
    right: 0;
    bottom: calc(66px + env(safe-area-inset-bottom));
    left: 0;
    width: auto;
    height: auto;
  }

  body[data-page="admin"] .user-drawer-layer {
    top: 64px;
    bottom: calc(66px + env(safe-area-inset-bottom));
    height: auto;
  }

  body[data-page="admin"] .coupon-filter-bar {
    grid-template-columns: minmax(0, 1fr);
  }

  body[data-page="admin"] .coupon-search {
    grid-column: auto;
  }

  body[data-page="admin"] .coupon-editor-actions {
    gap: 8px;
  }

  body[data-page="admin"] .coupon-editor-actions button {
    min-height: 44px;
  }
}

@media (max-width: 390px) {
  body[data-page="admin"] .admin-topbar > .brand strong {
    font-size: .74rem;
  }

  body[data-page="admin"] .admin-topbar > .brand small {
    display: none;
  }

  body[data-page="admin"] .admin-store-button {
    display: none;
  }

  body[data-page="admin"] .dashboard-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-page="admin"] .dashboard-metric-card,
  body[data-page="admin"] .metric-card {
    min-height: 104px;
    padding: 9px;
  }

  body[data-page="admin"] .admin-row-actions {
    grid-template-columns: minmax(0, 1fr) 1fr 1fr;
  }

  body[data-page="admin"] .admin-row-actions .row-action {
    padding-inline: 8px;
    font-size: .7rem;
  }
}

/* Privacy and LGPD */
.privacy-footer-link {
  width: fit-content;
  text-decoration: none;
}

.privacy-footer-link:hover,
.privacy-footer-link:focus-visible {
  color: #fff;
}

.privacy-page {
  min-height: 100vh;
  padding: clamp(1.5rem, 4vw, 4rem) 5vw 5rem;
  background:
    radial-gradient(circle at 82% 4%, rgba(0, 200, 255, 0.1), transparent 30rem),
    #05080c;
  color: #f5f9fc;
}

.privacy-container {
  width: min(1160px, 100%);
  margin: 0 auto;
}

.privacy-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
  gap: clamp(1.2rem, 4vw, 3.5rem);
  align-items: end;
  border: 1px solid #1a2a36;
  border-top-color: #00c8ff;
  border-radius: 8px;
  background: linear-gradient(145deg, rgba(10, 19, 28, 0.98), rgba(5, 9, 14, 0.94));
  padding: clamp(1.5rem, 4vw, 3.4rem);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
}

.privacy-hero h1 {
  max-width: 12ch;
  margin: 0.45rem 0 1rem;
  color: #fff;
  font-size: clamp(2.4rem, 6vw, 5.2rem);
  line-height: 0.98;
}

.privacy-hero-copy {
  max-width: 720px;
  margin: 0;
  color: #a6b5c4;
  font-size: clamp(0.96rem, 1.6vw, 1.12rem);
  line-height: 1.7;
}

.privacy-version {
  display: grid;
  gap: 0.7rem;
  border-left: 1px solid #223440;
  padding-left: clamp(1rem, 3vw, 2rem);
}

.privacy-version span {
  color: #7890a3;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.privacy-version strong {
  color: #eef7fc;
  font-size: 1rem;
}

.privacy-layout {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  margin-top: 22px;
}

.privacy-nav {
  position: sticky;
  top: 92px;
  display: grid;
  gap: 4px;
  border: 1px solid #172734;
  border-radius: 8px;
  background: #071019;
  padding: 12px;
}

.privacy-nav strong {
  margin: 4px 8px 8px;
  color: #7d91a3;
  font-size: 0.7rem;
  text-transform: uppercase;
}

.privacy-nav a {
  border-radius: 6px;
  color: #b3c0cc;
  padding: 9px 10px;
  font-size: 0.78rem;
  font-weight: 750;
  text-decoration: none;
}

.privacy-nav a:hover,
.privacy-nav a:focus-visible {
  background: rgba(0, 200, 255, 0.09);
  color: #fff;
}

.privacy-content {
  display: grid;
  gap: 12px;
}

.privacy-section {
  scroll-margin-top: 92px;
  border: 1px solid #172734;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(8, 17, 25, 0.98), rgba(5, 11, 17, 0.98));
  padding: clamp(1.2rem, 3vw, 2rem);
}

.privacy-section h2 {
  margin: 0 0 0.85rem;
  color: #fff;
  font-size: clamp(1.15rem, 2.4vw, 1.55rem);
}

.privacy-section h3 {
  margin: 1.2rem 0 0.5rem;
  color: #dce8f0;
  font-size: 0.95rem;
}

.privacy-section p,
.privacy-section li {
  color: #9fb0bf;
  font-size: 0.9rem;
  line-height: 1.7;
}

.privacy-section p {
  margin: 0.65rem 0;
}

.privacy-section ul {
  display: grid;
  gap: 0.55rem;
  margin: 0.8rem 0 0;
  padding-left: 1.15rem;
}

.privacy-section a {
  color: #00c8ff;
  font-weight: 800;
}

.privacy-highlight {
  border-left: 3px solid #00c8ff;
  background: rgba(0, 200, 255, 0.055);
  padding: 0.85rem 1rem;
}

.privacy-contact {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 1rem;
}

.privacy-contact a {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #00c8ff;
  border-radius: 6px;
  padding: 0 15px;
  text-decoration: none;
}

.privacy-contact a:first-child {
  background: #00a9ea;
  color: #031018;
}

@media (max-width: 800px) {
  .privacy-page {
    padding: 1rem 12px 6rem;
  }

  .privacy-hero,
  .privacy-layout {
    grid-template-columns: 1fr;
  }

  .privacy-version {
    border-top: 1px solid #223440;
    border-left: 0;
    padding-top: 1rem;
    padding-left: 0;
  }

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

  .privacy-nav strong {
    grid-column: 1 / -1;
  }
}

@media (max-width: 430px) {
  .privacy-hero,
  .privacy-section {
    padding: 1.15rem;
  }

  .privacy-nav {
    grid-template-columns: 1fr;
  }

  .privacy-nav strong {
    grid-column: auto;
  }

  .auth-card .auth-consent-option {
    padding: 0.72rem;
  }
}

@media (max-width: 1180px) {
  .home-promotion-grid { grid-template-columns: repeat(2, minmax(0, 320px)); }
  .home-promotion-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-promotion-benefits article:nth-child(2) { border-right: 0; }
  .home-promotion-benefits article:nth-child(-n + 2) { border-bottom: 1px solid #1a2c37; }
}

@media (max-width: 760px) {
  body[data-page="store"] #promocoes { order: 5; }
  body[data-page="store"] #mobileLaunches { order: 6; }
  body[data-page="store"] #mais-vendidos { order: 7; }
  body[data-page="store"] #mobileNews { order: 8; }
  body[data-page="store"] #monte-seu-setup { order: 9; }
  body[data-page="store"] #consultoria { order: 10; }
  body[data-page="store"] #avaliacoes { order: 11; }
  body[data-page="store"] #instagram { order: 12; }

  .home-promotion-heading { justify-items: start; margin-bottom: 17px; text-align: left; }
  .home-promotion-heading h2 { font-size: 1.7rem; }
  .home-promotion-heading > p:last-child { font-size: .74rem; }
  .home-promotion-grid {
    grid-auto-flow: column;
    grid-auto-columns: minmax(254px, 84vw);
    grid-template-columns: none;
    gap: 10px;
    overflow-x: auto;
    padding: 1px 1px 9px;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
  }
  .home-promotion-grid::-webkit-scrollbar { display: none; }
  .home-promotion-card { grid-template-rows: 224px minmax(0, 1fr); scroll-snap-align: start; }
  .home-promotion-card:hover { transform: none; }
  .home-promotion-name { font-size: .84rem; }
  .home-promotion-benefits { gap: 8px; margin-top: 18px; border: 0; }
  .home-promotion-benefits article,
  .home-promotion-benefits article:nth-child(2),
  .home-promotion-benefits article:nth-child(-n + 2) { min-height: 82px; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; border: 1px solid #1a303c; border-radius: 7px; padding: 11px; background: #081018; }
  .home-promotion-benefits .home-benefit-icon { width: 34px; height: 34px; }
  .home-promotion-benefits .home-benefit-icon svg { width: 25px; height: 25px; }
  .home-promotion-benefits strong { font-size: .62rem; }
  .home-promotion-benefits small { font-size: .58rem; }
  .home-promotion-cta { margin-top: 17px; }
  .home-promotion-cta .home-button { width: 100%; min-width: 0; }

  .promotion-editor-heading { align-items: stretch; flex-direction: column; }
  .promotion-switch { min-width: 0; }
}

/* Product promotions */
.product-editor-tabs {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  margin: 0 0 14px;
  border: 1px solid #1c2b36;
  border-radius: 7px;
  padding: 4px;
  background: #080d13;
  scrollbar-width: none;
}

.product-editor-tabs::-webkit-scrollbar { display: none; }

.product-editor-tabs button {
  min-width: max-content;
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 5px;
  padding: 0 14px;
  background: transparent;
  color: #91a3b2;
  font: inherit;
  font-size: .72rem;
  font-weight: 850;
  cursor: pointer;
}

.product-editor-tabs button:hover,
.product-editor-tabs button.active {
  border-color: #1b3f4f;
  background: rgba(0, 200, 255, .08);
  color: #eefaff;
}

.product-editor-tabs button.active {
  box-shadow: inset 0 -2px #00c8ff;
  color: #00c8ff;
}

.product-editor-feedback {
  min-height: 42px;
  display: flex;
  align-items: center;
  margin: 0 0 14px;
  border: 1px solid #20404c;
  border-radius: 6px;
  padding: 9px 12px;
  background: #08141b;
  color: #b9dce9;
  font-size: .78rem;
  line-height: 1.45;
}

.product-editor-feedback[hidden] { display: none; }
.product-editor-feedback.is-loading { border-color: rgba(0, 200, 255, .4); color: #c5f2ff; }
.product-editor-feedback.is-success { border-color: rgba(36, 204, 132, .42); background: rgba(15, 90, 59, .14); color: #aaf1cf; }
.product-editor-feedback.is-error { border-color: rgba(241, 179, 65, .48); background: rgba(125, 77, 13, .14); color: #f2d28f; }

#saveProductButton[aria-busy="true"] {
  cursor: wait;
  opacity: .72;
}

.promotion-price-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.promotion-date-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.promotion-date-grid small { color: #718594; font-size: .66rem; font-weight: 600; line-height: 1.4; }

.promotion-how-it-works {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border-top: 1px solid #1c2b36;
  padding-top: 16px;
}

.promotion-how-it-works > svg {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(0, 200, 255, .3);
  border-radius: 6px;
  padding: 9px;
  color: #00c8ff;
  background: rgba(0, 200, 255, .06);
}

.promotion-how-it-works strong { display: block; color: #edf7fb; font-size: .82rem; }
.promotion-how-it-works p { margin: 5px 0 0; color: #879aa8; font-size: .72rem; line-height: 1.55; }

.promotion-site-preview-card { position: sticky; top: 88px; }
.promotion-site-preview { overflow: hidden; border: 1px solid #203541; border-radius: 7px; background: #071017; }
.promotion-site-preview-media { position: relative; aspect-ratio: 4 / 3; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle at center, rgba(0, 200, 255, .12), transparent 58%), #05090d; }
.promotion-site-preview-media img { width: 100%; height: 100%; padding: 12px; object-fit: contain; }
.promotion-site-preview-media > span { width: 52px; height: 52px; display: grid; place-items: center; color: #4c6473; }
.promotion-site-preview-media > b { position: absolute; top: 10px; left: 10px; border-radius: 4px; padding: 5px 8px; background: #00c8ff; color: #001018; font-size: .7rem; }
.promotion-site-preview-copy { display: grid; gap: 8px; border-top: 1px solid #1b2d38; padding: 15px; }
.promotion-site-preview-copy > strong { color: #f3f8fb; font-size: .93rem; line-height: 1.35; }
.promotion-site-preview-prices { display: flex; flex-wrap: wrap; gap: 7px; align-items: baseline; }
.promotion-site-preview-prices del { color: #6f8290; font-size: .72rem; }
.promotion-site-preview-prices b { color: #00c8ff; font-size: 1.2rem; }
.promotion-site-preview-copy > span { color: #8799a7; font-size: .7rem; }
.promotion-site-preview-copy > button { min-height: 38px; border: 1px solid #00aeda; border-radius: 5px; background: rgba(0, 200, 255, .08); color: #dff8ff; font: inherit; font-size: .7rem; font-weight: 900; }
.promotion-preview-disclaimer { margin: 10px 0 0; color: #647886; font-size: .65rem; line-height: 1.45; }

.catalog-promotion-meta,
.product-promotion-price-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.catalog-promotion-meta del,
.product-promotion-price-meta del {
  color: #748795;
  font-size: .72rem;
  font-weight: 700;
}

.catalog-promotion-meta b,
.product-promotion-price-meta b {
  border-radius: 4px;
  padding: 3px 6px;
  background: #078fe5;
  color: #fff;
  font-size: .62rem;
  font-weight: 900;
}

.catalog-card-price { color: #f6fafc; }
.catalog-installment-price { color: #8598a6; font-size: .68rem; line-height: 1.35; }
.catalog-price-block-compact { gap: 2px; }

.admin-promotions-page {
  color: #d8e4eb;
}

.promotions-admin-heading {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  margin-bottom: 14px;
  border: 1px solid #1c2c37;
  border-radius: 8px;
  padding: 22px;
  background: linear-gradient(115deg, rgba(0, 200, 255, .09), transparent 42%), #091018;
}

.promotions-admin-heading .eyebrow { color: #00c8ff; font-size: .68rem; font-weight: 900; text-transform: uppercase; }
.promotions-admin-heading h2 { margin: 5px 0 0; color: #f6fafc; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1; }
.promotions-admin-heading p { margin: 8px 0 0; color: #7f93a2; font-size: .72rem; }
.promotions-admin-heading p span { margin: 0 5px; color: #405664; }
.promotions-admin-heading .button { flex: 0 0 auto; }

.promotion-summary-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}

.promotion-summary-card {
  min-width: 0;
  min-height: 78px;
  display: grid;
  align-content: center;
  gap: 6px;
  border: 1px solid #1c2d38;
  border-radius: 7px;
  padding: 12px 14px;
  background: #091119;
  color: #8fa2b0;
  text-align: left;
  cursor: pointer;
}

.promotion-summary-card:hover,
.promotion-summary-card.is-selected { border-color: #00aeda; background: rgba(0, 200, 255, .07); }
.promotion-summary-card span { overflow: hidden; font-size: .68rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.promotion-summary-card strong { color: #f2f8fb; font-size: 1.35rem; }
.promotion-summary-card.is-active strong { color: #29d793; }
.promotion-summary-card.is-scheduled strong { color: #53c8f0; }
.promotion-summary-card.is-ended strong { color: #8394a0; }
.promotion-summary-card.is-invalid strong { color: #efbf63; }

.promotion-admin-create {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(240px, 420px) auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 14px;
  border: 1px solid #1c2d38;
  border-radius: 7px;
  padding: 14px;
  background: #081018;
}

.promotion-admin-create > div { display: grid; gap: 3px; }
.promotion-admin-create strong { color: #f0f7fa; font-size: .82rem; }
.promotion-admin-create span { color: #8195a4; font-size: .7rem; }
.promotion-admin-create select,
.promotion-admin-filters input,
.promotion-admin-filters select {
  width: 100%;
  min-height: 42px;
  border: 1px solid #20323e;
  border-radius: 6px;
  padding: 0 11px;
  background: #050b10;
  color: #eaf4f8;
  font: inherit;
  font-size: .75rem;
}

.promotion-admin-list-card { overflow: hidden; border: 1px solid #1c2d38; border-radius: 8px; background: #070d13; }
.promotion-admin-list-card > header { display: flex; justify-content: space-between; gap: 12px; align-items: center; border-bottom: 1px solid #1c2d38; padding: 15px 16px; }
.promotion-admin-list-card > header h3 { margin: 0; color: #f2f8fb; font-size: 1rem; }
.promotion-admin-list-card > header span { display: block; margin-top: 3px; color: #78909f; font-size: .68rem; }
.promotion-filter-reset { min-height: 38px; }

.promotion-admin-filters {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) repeat(4, minmax(145px, .75fr)) repeat(2, minmax(150px, .8fr));
  gap: 8px;
  border-bottom: 1px solid #1c2d38;
  padding: 12px;
  background: #091119;
}

.promotion-admin-filters label { min-width: 0; display: grid; gap: 5px; color: #7f94a2; font-size: .62rem; font-weight: 800; }
.promotion-admin-search { position: relative; align-self: end; }
.promotion-admin-search svg { position: absolute; z-index: 1; top: 50%; left: 11px; width: 17px; height: 17px; color: #657c8b; transform: translateY(-50%); pointer-events: none; }
.promotion-admin-search input { padding-left: 36px; }

.promotion-admin-table-head,
.promotion-admin-row {
  display: grid;
  grid-template-columns: minmax(250px, 2.15fr) repeat(3, minmax(90px, .78fr)) repeat(2, minmax(100px, .8fr)) minmax(90px, .72fr) 88px;
  gap: 12px;
  align-items: center;
}

.promotion-admin-table-head { min-height: 42px; border-bottom: 1px solid #1c2d38; padding: 0 14px; color: #78909e; font-size: .61rem; font-weight: 900; text-transform: uppercase; }
.promotion-admin-row { min-height: 78px; border-bottom: 1px solid #162630; padding: 10px 14px; color: #b9c8d1; font-size: .72rem; }
.promotion-admin-row:last-child { border-bottom: 0; }
.promotion-admin-row:hover { background: rgba(0, 200, 255, .025); }
.promotion-admin-product { min-width: 0; display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 10px; align-items: center; }
.promotion-admin-product img,
.promotion-admin-placeholder { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid #1c3441; border-radius: 6px; object-fit: contain; background: #050a0e; }
.promotion-admin-placeholder svg { width: 22px; color: #5f7786; }
.promotion-admin-product > span { min-width: 0; }
.promotion-admin-product strong,
.promotion-admin-product small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.promotion-admin-product strong { color: #f1f7fa; font-size: .76rem; }
.promotion-admin-product small { margin-top: 4px; color: #78909e; font-size: .64rem; }
.promotion-admin-sale-price { color: #00c8ff; }
.promotion-admin-discount { color: #dff9ff; }
.promotion-admin-status { display: inline-flex; width: max-content; min-height: 25px; align-items: center; border: 1px solid #334550; border-radius: 999px; padding: 0 8px; color: #aab8c1; background: #111920; font-size: .59rem; font-style: normal; font-weight: 900; white-space: nowrap; }
.promotion-admin-status.is-active { border-color: rgba(38, 214, 147, .42); color: #50e3ad; background: rgba(20, 113, 77, .13); }
.promotion-admin-status.is-scheduled { border-color: rgba(0, 200, 255, .35); color: #63dbfa; background: rgba(0, 113, 153, .13); }
.promotion-admin-status.is-ended,
.promotion-admin-status.is-disabled { color: #8496a2; }
.promotion-admin-status.is-invalid { border-color: rgba(239, 191, 99, .4); color: #efc777; background: rgba(110, 69, 11, .14); }
.promotion-admin-actions { display: flex; justify-content: flex-end; gap: 7px; align-items: center; }
.promotion-admin-actions .icon-action { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #263946; border-radius: 6px; background: #0a1219; color: #b7c6cf; cursor: pointer; }
.promotion-admin-actions .icon-action:hover { border-color: #00aeda; color: #00c8ff; }
.promotion-admin-actions .icon-action svg { width: 16px; height: 16px; }

.promotion-quick-switch { position: relative; display: block; width: 38px; height: 22px; cursor: pointer; }
.promotion-quick-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.promotion-quick-switch span { position: absolute; inset: 0; border: 1px solid #344650; border-radius: 999px; background: #111920; }
.promotion-quick-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: #768894; transition: transform 160ms ease, background 160ms ease; }
.promotion-quick-switch input:checked + span { border-color: #00aeda; background: rgba(0, 200, 255, .12); }
.promotion-quick-switch input:checked + span::after { background: #00c8ff; transform: translateX(16px); }
.promotion-quick-switch input:focus-visible + span { outline: 2px solid #00c8ff; outline-offset: 2px; }

.promotion-admin-empty { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 8px; padding: 28px; color: #718693; text-align: center; }
.promotion-admin-empty svg { width: 34px; height: 34px; color: #315a6e; }
.promotion-admin-empty strong { color: #dce8ee; }
.promotion-admin-empty span { font-size: .72rem; }

@media (max-width: 1380px) {
  .promotion-admin-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .promotion-admin-search { grid-column: span 2; }
  .promotion-admin-table-head,
  .promotion-admin-row { grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(82px, .7fr)) repeat(2, minmax(88px, .72fr)) minmax(82px, .68fr) 82px; gap: 8px; }
}

@media (max-width: 1050px) {
  .promotion-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .promotion-admin-create { grid-template-columns: 1fr auto; }
  .promotion-admin-create > div { grid-column: 1 / -1; }
  .promotion-admin-table-head { display: none; }
  .promotion-admin-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; padding: 14px; }
  .promotion-admin-row > [data-label] { min-width: 0; display: grid; gap: 4px; }
  .promotion-admin-row > [data-label]::before { content: attr(data-label); color: #637a89; font-size: .56rem; font-weight: 900; text-transform: uppercase; }
  .promotion-admin-row .promotion-admin-product { grid-column: span 2; display: grid; grid-template-columns: 54px minmax(0, 1fr); }
  .promotion-admin-row .promotion-admin-actions { align-self: start; }
}

@media (max-width: 760px) {
  .product-editor-tabs { margin-inline: -2px; }
  .product-editor-tabs button { min-height: 42px; padding-inline: 12px; }
  .promotion-price-grid,
  .promotion-date-grid { grid-template-columns: 1fr; }
  .promotion-site-preview-card { position: static; }
  .promotions-admin-heading { align-items: stretch; flex-direction: column; padding: 16px; }
  .promotions-admin-heading .button { width: 100%; }
  .promotion-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .promotion-summary-card { min-height: 70px; }
  .promotion-admin-create { grid-template-columns: 1fr; }
  .promotion-admin-create > div { grid-column: auto; }
  .promotion-admin-create .button { width: 100%; }
  .promotion-admin-list-card > header { align-items: stretch; flex-direction: column; }
  .promotion-filter-reset { width: 100%; }
  .promotion-admin-filters { grid-template-columns: 1fr; }
  .promotion-admin-search { grid-column: auto; }
  .promotion-admin-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .promotion-admin-row .promotion-admin-product,
  .promotion-admin-row .promotion-admin-actions { grid-column: 1 / -1; }
  .promotion-admin-row .promotion-admin-actions { justify-content: space-between; border-top: 1px solid #162630; padding-top: 10px; }
  .promotion-admin-status { white-space: normal; }
}
