:root {
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-soft: #f0f4ff;
  --text: #172033;
  --muted: #667085;
  --line: #e4e8f0;
  --brand: #2563eb;
  --brand-dark: #1849b5;
  --success: #14804a;
  --warning: #b54708;
  --danger: #b42318;
  --shadow: 0 16px 48px rgba(23, 32, 51, 0.09);
  --radius: 20px;
}

* { box-sizing: border-box; }

html { color-scheme: light; scroll-behavior: auto; }

body {
  margin: 0;
  min-width: 320px;
  background: var(--bg);
  color: var(--text);
  font: 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, input, select { min-height: 44px; }
button { cursor: pointer; }
img { max-width: 100%; height: auto; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
.primary, .secondary, .pay-option, .plan-action, .back-link, .home-recharge-cta, .home-invite-cta, .site-header nav a, .site-header nav .bookmark-nav { min-height: 44px; }
button, a, .pay-option { touch-action: manipulation; }

html.is-navigating body::after {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, var(--brand), #7c3aed, #14b8a6);
  box-shadow: 0 1px 7px rgba(37, 99, 235, .32);
  content: "";
  pointer-events: none;
  transform-origin: left;
  animation: navigation-progress 1.1s ease-out infinite;
}

@keyframes navigation-progress {
  0% { transform: scaleX(.08); opacity: .7; }
  65% { transform: scaleX(.72); opacity: 1; }
  100% { transform: scaleX(.94); opacity: .78; }
}

.site-header,
.admin-header {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 64px;
  padding: 10px max(18px, env(safe-area-inset-left));
  background: rgba(255, 255, 255, 0.98);
  border-bottom: 1px solid rgba(228, 232, 240, 0.85);
}

.brand { flex: 0 0 auto; display: inline-flex; align-items: baseline; gap: 8px; min-width: max-content; white-space: nowrap; font-size: 20px; font-weight: 850; letter-spacing: -.02em; }
.brand span { color: var(--muted); font-size: 12px; font-weight: 650; }
.site-header { flex-wrap: wrap; overflow: hidden; box-shadow: 0 4px 18px rgba(23,32,51,.035); }
.site-header nav { display: flex; width: 100%; min-width: 0; gap: 7px; overflow-x: auto; color: var(--muted); font-size: 13px; scrollbar-width: none; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
.site-header nav::-webkit-scrollbar { display: none; }
.site-header nav a, .site-header nav .bookmark-nav { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 38px; padding: 5px 10px; scroll-snap-align: start; background: #f5f7fa; color: var(--muted); border: 0; border-radius: 999px; font-size: 13px; }
.site-header nav a:hover, .site-header nav .bookmark-nav:hover { color: var(--brand); }

.page { width: min(1120px, calc(100% - 28px)); margin: 0 auto; padding: 34px 0 72px; }
.page.narrow { width: min(680px, calc(100% - 28px)); }

.hero { min-width: 0; padding: 24px 0 30px; text-align: center; }
.eyebrow, .step-kicker { color: var(--brand); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.hero h1 { max-width: 800px; margin: 10px auto 14px; overflow-wrap: anywhere; font-size: clamp(31px, 6vw, 58px); line-height: 1.08; letter-spacing: -.045em; }
.hero > p { max-width: 620px; margin: 0 auto; color: var(--muted); font-size: 17px; }
.trust-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 22px; }
.trust-row span { padding: 7px 11px; background: #eaf1ff; border-radius: 999px; color: #244a93; font-size: 12px; font-weight: 700; }

.page.pricing-page { width: min(1320px, calc(100% - 28px)); }
.home-conversion-hero { display: grid; justify-items: center; padding: clamp(52px, 9vw, 112px) 18px clamp(46px, 7vw, 82px); text-align: center; }
.home-conversion-hero .eyebrow { color: #5b3fd2; }
.home-conversion-hero h1 { max-width: 1080px; margin: 14px 0 18px; font-size: clamp(48px, 7.8vw, 96px); line-height: .98; letter-spacing: -.065em; }
.home-conversion-hero > strong { color: #6040e8; font-size: clamp(23px, 3.4vw, 43px); line-height: 1.25; }
.home-conversion-hero > p { max-width: 780px; margin: 20px 0 0; color: #596579; font-size: clamp(15px, 1.6vw, 20px); }
.home-hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }
.home-recharge-cta { min-width: 250px; min-height: 60px; background: linear-gradient(135deg, #4f46e5, #7c3aed); border-radius: 17px; box-shadow: 0 14px 30px rgba(88,65,220,.26); font-size: 20px; }
.home-recharge-cta:hover { background: linear-gradient(135deg, #4338ca, #6d28d9); transform: translateY(-1px); }
.home-recharge-cta span { margin-left: 12px; font-size: 24px; }
.home-invite-cta { min-width: 220px; min-height: 60px; background: #fff7df; color: #8a4b00; border: 1px solid #efc45d; border-radius: 17px; font-size: 16px; font-weight: 850; }
.home-invite-cta:hover { background: #ffedb8; border-color: #e0aa28; }
.home-hero-assurances { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin-top: 21px; color: #5e697c; font-size: 13px; font-weight: 700; }
.home-hero-assurances span::first-letter { color: var(--success); }
.pricing-hero { padding-block: 32px 36px; }
.pricing-hero .eyebrow { color: #171717; }
.pricing-hero h2 { max-width: 980px; margin: 10px auto 14px; font-size: clamp(34px, 5vw, 60px); line-height: 1.08; letter-spacing: -.055em; }
.pricing-hero > p { max-width: 720px; color: #535862; }
.billing-pill { display: inline-flex; align-items: center; min-height: 40px; padding: 7px 15px; margin-top: 22px; background: #f2f2f2; border: 1px solid #dedede; border-radius: 999px; color: #242424; font-size: 13px; font-weight: 750; }
.plan-guide-hero { margin-top: 12px; }

.home-carousel {
  position: relative;
  overflow: hidden;
  margin-bottom: 26px;
  background: #fff;
  border: 1px solid #e3e7ef;
  border-radius: var(--radius);
  box-shadow: 0 16px 42px rgba(15, 23, 42, .1);
  touch-action: pan-y;
}
.home-carousel.default-carousel { background: #f4f6ff; border: 1px solid #e1e7f2; }
.home-reviews + .home-carousel { margin-top: 34px; }
.carousel-slide { position: relative; min-height: 0; }
.carousel-slide[hidden] { display: none !important; }
.carousel-slide picture, .carousel-slide img { display: block; width: 100%; }
.carousel-slide img { aspect-ratio: 8 / 3; object-fit: cover; object-position: center; background: #eef2f7; }
.carousel-copy {
  position: absolute;
  inset: auto 0 0;
  padding: clamp(26px, 6vw, 56px) clamp(22px, 6vw, 64px) 28px;
  background: linear-gradient(180deg, transparent, rgba(7, 13, 25, .88));
  color: #fff;
  pointer-events: none;
}
.carousel-copy h2 { max-width: 760px; margin: 0; font-size: clamp(25px, 4.5vw, 48px); line-height: 1.1; letter-spacing: -.035em; }
.carousel-copy p { max-width: 680px; margin: 10px 0 0; color: #e6ebf4; font-size: clamp(14px, 2vw, 18px); }
.carousel-control {
  position: absolute;
  z-index: 3;
  top: 50%;
  display: grid;
  place-items: center;
  width: 46px;
  min-height: 46px;
  padding: 0;
  transform: translateY(-50%);
  background: rgba(17, 24, 39, .62);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 50%;
  font-size: 30px;
  line-height: 1;
}
.carousel-control:hover, .carousel-control:focus-visible { background: rgba(37, 99, 235, .9); }
.carousel-control.previous { left: 14px; }
.carousel-control.next { right: 14px; }
.carousel-dots { position: absolute; z-index: 4; right: 18px; bottom: 16px; display: flex; gap: 7px; }
.carousel-dot { width: 10px; min-height: 10px; padding: 0; background: rgba(255, 255, 255, .55); border: 0; border-radius: 999px; }
.carousel-dot[aria-current="true"] { width: 28px; background: #fff; }
.home-trust-bar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; margin-bottom: 14px; background: #e5e9f0; border: 1px solid #e5e9f0; border-radius: 16px; }
.home-trust-bar article { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 15px; background: #fff; }
.home-trust-bar article > span { flex: 0 0 auto; display: grid; place-items: center; width: 34px; height: 34px; background: #edf3ff; color: var(--brand); border-radius: 11px; font-size: 13px; font-weight: 900; }
.home-trust-bar article > div { display: grid; min-width: 0; }
.home-trust-bar strong { font-size: 13px; line-height: 1.3; }
.home-trust-bar small { overflow-wrap: anywhere; color: var(--muted); font-size: 11px; line-height: 1.45; }

.lookup-query-grid { display: grid; gap: 22px; margin-top: 24px; text-align: left; }
.lookup-query-grid > section { padding: 18px; background: #f7f9fc; border: 1px solid var(--line); border-radius: 14px; }
.lookup-query-grid h2 { margin: 0 0 14px; font-size: 19px; }
.lookup-results { display: grid; gap: 12px; margin-top: 18px; }
.lookup-result-heading { padding: 20px; text-align: center; background: #eaf1ff; border-radius: 16px; }
.lookup-result-heading h2 { margin: 5px 0; font-size: 24px; }
.lookup-result-heading p { margin: 0; color: var(--muted); }
.lookup-order-card { padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 6px 20px rgba(23, 32, 51, .04); }
.lookup-order-card h3 { margin: 3px 0 12px; }
.lookup-order-card dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.lookup-order-card dl div { min-width: 0; padding: 10px; background: #f7f9fc; border-radius: 10px; }
.lookup-order-card dt { color: var(--muted); font-size: 12px; }
.lookup-order-card dd { margin: 2px 0 0; overflow-wrap: anywhere; font-weight: 750; }

.plan-grid { display: grid; gap: 18px; align-items: stretch; }
.plan-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 22px;
  overflow: hidden;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 8px 24px rgba(23, 32, 51, .04);
}
.official-plan-card { padding: 26px 24px 22px; border-color: #dfe3ea; border-radius: 22px; box-shadow: 0 8px 26px rgba(20, 31, 51, .055); }
.official-plan-card:hover { border-color: #aaa; transform: translateY(-2px); transition: transform .18s ease, border-color .18s ease; }
.plan-card-heading { min-height: 122px; }
.plan-family { display: inline-block; margin-bottom: 6px; color: #6a6a6a; font-size: 12px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.plan-badge { float: right; align-self: flex-start; padding: 4px 9px; background: #ececec; color: #242424; border-radius: 999px; font-size: 12px; font-weight: 800; }
.plan-card h2 { margin: 0 0 6px; overflow-wrap: anywhere; font-size: 30px; line-height: 1.16; letter-spacing: -.035em; }
.plan-tagline { margin: 0; color: #666; font-size: 14px; }
.plan-price { margin: 18px 0 14px; white-space: nowrap; font-size: clamp(32px, 3vw, 42px); font-weight: 760; letter-spacing: -.045em; }
.plan-price small, .price small { margin-left: 4px; color: var(--muted); font-size: 13px; font-weight: 600; }
.plan-fit { min-height: 86px; padding: 12px 13px; margin: 0 0 13px; background: #f7f7f7; border-radius: 12px; }
.plan-fit span { color: #777; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.plan-fit p { margin: 3px 0 0; color: #343434; font-size: 13px; line-height: 1.5; }
.plan-action { width: 100%; background: #171717; border-radius: 999px; box-shadow: none; }
.plan-action:hover { background: #333; }
.plan-compare-link { width: 100%; min-height: 38px; padding: 5px 8px; background: transparent; color: #4f5e73; border: 0; font-size: 12px; font-weight: 800; }
.plan-compare-link:hover { color: var(--brand); }
.plan-entitlements { flex: 1; padding-top: 20px; margin-top: 5px; border-top: 1px solid #eceef2; }
.plan-entitlements h3, .checkout-plan-benefits h2 { margin: 0 0 13px; font-size: 14px; line-height: 1.45; }
.plan-benefits { display: grid; gap: 11px; padding: 0; margin: 0; list-style: none; }
.plan-benefits li { position: relative; padding-left: 25px; overflow-wrap: anywhere; color: #303030; font-size: 14px; line-height: 1.45; }
.plan-benefits li::before { content: "✓"; position: absolute; top: 0; left: 0; font-weight: 850; }
.official-plan-card .stock { padding-top: 16px; margin: 20px 0 0; border-top: 1px solid #e6e6e6; }
.official-plan-card.recommended { background: #171717; color: #fff; border-color: #171717; }
.official-plan-card.recommended .plan-family,
.official-plan-card.recommended .plan-tagline,
.official-plan-card.recommended .plan-price small { color: #bcbcbc; }
.official-plan-card.recommended .plan-badge { background: #fff; color: #171717; }
.official-plan-card.recommended .plan-benefits li { color: #f2f2f2; }
.official-plan-card.recommended .plan-entitlements { border-color: #353535; }
.official-plan-card.recommended .plan-fit { background: #292929; }
.official-plan-card.recommended .plan-fit span { color: #aaa; }
.official-plan-card.recommended .plan-fit p { color: #f2f2f2; }
.official-plan-card.recommended .plan-action { background: #fff; color: #171717; }
.official-plan-card.recommended .plan-compare-link { color: #d5d5d5; }
.official-plan-card.recommended .stock { border-color: #3c3c3c; }
.official-plan-card.recommended .stock.ready { color: #79dfa8; }
.official-plan-card.recommended .stock.empty { color: #ffc27a; }
.plan-disclaimer { display: flex; align-items: flex-start; gap: 12px; padding: 16px 18px; margin-top: 22px; background: #f5f5f5; border: 1px solid #e2e2e2; border-radius: 14px; color: #5d5d5d; font-size: 13px; }
.plan-disclaimer strong { flex: 0 0 auto; color: #242424; }
.selected-plan-fit { padding: 14px; margin: 14px 0; background: #f3f6fb; border: 1px solid #e2e8f2; border-radius: 13px; }
.selected-plan-fit p { margin: 4px 0; color: #303949; font-size: 14px; }
.selected-plan-fit small { display: block; color: var(--muted); font-size: 12px; }
.selected-plan-fit .plan-compare-link { width: auto; padding-inline: 0; }
.plan-guide-dialog { width: min(1040px, calc(100% - 28px)); max-height: min(860px, calc(100vh - 28px)); padding: 0; overflow: auto; background: #fff; color: var(--text); border: 0; border-radius: 24px; box-shadow: 0 30px 100px rgba(8, 15, 30, .36); }
.plan-guide-dialog::backdrop { background: rgba(10, 16, 29, .72); }
.plan-guide-header { position: sticky; top: 0; z-index: 2; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 26px 28px 20px; background: #fff; border-bottom: 1px solid var(--line); }
.plan-guide-header h2 { margin: 5px 0 5px; font-size: clamp(26px, 5vw, 40px); line-height: 1.15; letter-spacing: -.04em; }
.plan-guide-header p { margin: 0; color: var(--muted); }
.plan-guide-header > button { flex: 0 0 auto; display: grid; place-items: center; width: 44px; min-height: 44px; padding: 0; background: #f0f2f6; color: #657083; border: 0; border-radius: 50%; font-size: 28px; }
.plan-guide-table-wrap { padding: 24px 28px 0; overflow-x: auto; }
.plan-guide-table { min-width: 760px; white-space: normal; }
.plan-guide-table th, .plan-guide-table td { padding: 17px 14px; vertical-align: top; border-bottom: 1px solid var(--line); }
.plan-guide-table thead th { background: #f7f9fc; color: #526078; }
.plan-guide-table tbody th { width: 150px; font-size: 17px; }
.plan-guide-table tbody th small { display: block; color: var(--brand); font-size: 11px; }
.plan-guide-table tr.is-popular { background: #f1f5ff; }
.usage-level { display: inline-flex; padding: 4px 9px; background: #eef1f5; color: #46546a; border-radius: 999px; font-size: 12px; font-weight: 800; }
.usage-level.level-2 { background: #e7efff; color: #244a93; }
.usage-level.level-3 { background: #eeeafe; color: #5b3fb5; }
.usage-level.level-4 { background: #171717; color: #fff; }
.plan-guide-warning { padding: 16px 18px; margin: 22px 28px 0; background: #fff8e6; color: #754500; border: 1px solid #f3c657; border-radius: 14px; }
.plan-guide-warning p { margin: 4px 0 0; font-size: 13px; }
.plan-guide-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 22px 28px 28px; }
.stock { margin-bottom: 14px; font-size: 13px; font-weight: 700; }
.stock.ready { color: var(--success); }
.stock.empty { color: var(--warning); }

.primary,
.secondary,
.pay-option,
.mini {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 11px 17px;
  border: 0;
  border-radius: 13px;
  font-weight: 800;
  text-align: center;
}
.primary { background: var(--brand); color: #fff; box-shadow: 0 8px 20px rgba(37, 99, 235, .22); }
.primary:hover { background: var(--brand-dark); }
.secondary { background: #eef2f7; color: var(--text); }
.mini { min-height: 36px; padding: 6px 10px; background: #eaf1ff; color: var(--brand-dark); font-size: 13px; }

.how-it-works { margin-top: 32px; padding: 26px; background: #fff; color: var(--text); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 8px 28px rgba(23,32,51,.045); }
.how-it-works h2 { margin: 0 0 18px; }
.how-it-works ol { display: grid; gap: 12px; padding: 0; margin: 0; list-style: none; }
.how-it-works li { display: flex; align-items: center; gap: 12px; color: #435067; }
.how-it-works b { flex: 0 0 auto; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #edf3ff; color: var(--brand); }

.back-link { display: inline-flex; align-items: center; margin-bottom: 16px; color: var(--muted); font-weight: 700; }
.purchase-card, .status-card, .admin-login {
  padding: 22px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.product-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-top: 8px; }
.product-heading h1, .status-card h1, .admin-login h1 { margin: 0; font-size: clamp(26px, 7vw, 40px); line-height: 1.15; letter-spacing: -.035em; }
.product-heading p { margin: 7px 0 0; color: var(--muted); font-size: 14px; }
.product-service-proof { display: flex; flex-wrap: wrap; gap: 7px 12px; margin-top: 12px; color: #4f46e5; font-size: 13px; font-weight: 800; }
.product-service-proof span { display: inline-flex; align-items: center; min-height: 30px; padding: 4px 10px; background: #f0edff; border-radius: 999px; }
.price { white-space: nowrap; font-size: 29px; font-weight: 880; letter-spacing: -.04em; }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; padding: 0; margin: 22px 0; list-style: none; }
.steps li { min-width: 0; padding-top: 9px; border-top: 3px solid var(--line); color: var(--muted); font-size: 11px; text-align: center; }
.steps li.active { border-color: var(--brand); color: var(--brand); font-weight: 800; }
.steps.purchase-flow-steps { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 18px; }

.checkout-form, .admin-login form { display: grid; gap: 16px; }
.checkout-plan-benefits { padding: 20px; margin: 22px 0; background: #f7f7f7; border: 1px solid #e2e2e2; border-radius: 16px; }
.checkout-plan-benefits > p { margin: -5px 0 15px; color: var(--muted); font-size: 14px; }
.checkout-plan-benefits .plan-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.checkout-plan-benefits > small { display: block; margin-top: 16px; color: var(--muted); line-height: 1.55; }
button:disabled { cursor: not-allowed; opacity: .58; box-shadow: none; }
.purchase-checkout-grid { display: grid; gap: 14px; }
.compact-plan-card, .purchase-form { padding: 18px; border: 1px solid var(--line); border-radius: 16px; }
.compact-plan-card { background: #f8fafc; }
.compact-plan-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.compact-plan-heading h2, .purchase-form-heading h2 { margin: 2px 0 0; font-size: 20px; line-height: 1.3; }
.compact-plan-card .plan-benefits { gap: 9px; }
.compact-benefit-note { margin: 14px 0 0; color: var(--muted); font-size: 12px; }
.stock-pill { flex: 0 0 auto; padding: 4px 9px; border-radius: 999px; font-size: 11px; font-weight: 800; }
.stock-pill.ready { background: #e7f6ed; color: var(--success); }
.stock-pill.empty { background: #fff2e2; color: var(--warning); }
.purchase-assurances { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 16px; }
.purchase-assurances span { padding: 5px 9px; background: #eaf1ff; color: #244a93; border-radius: 999px; font-size: 11px; font-weight: 750; }
.purchase-action-column { display: grid; gap: 14px; align-content: start; }
.login-step-card { padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 16px; transition: border-color .2s ease, background .2s ease; }
.login-step-card.completed { background: #f7fbf8; border-color: #b9ddc6; }
.login-step-card.completed .step-kicker::after { content: " · 已完成"; color: var(--success); }
.accepted-payments { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 13px; margin-top: 16px; background: #f8fafc; border: 1px solid var(--line); border-radius: 13px; }
.accepted-payments-label { width: 100%; color: var(--muted); font-size: 12px; font-weight: 750; }
.payment-brand { display: inline-flex; align-items: center; gap: 6px; color: #344054; font-size: 12px; font-weight: 800; white-space: nowrap; }
.payment-brand i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 8px; color: #fff; font-size: 12px; font-style: normal; }
.payment-brand.wechat i { background: #07c160; }
.payment-brand.alipay i { background: #1677ff; }
.payment-brand.huabei i { background: linear-gradient(135deg, #1677ff, #7a5cff); }
.login-step-actions { display: grid; gap: 10px; margin-top: 16px; }
.login-step-actions a, .login-step-actions button { width: 100%; }
.purchase-form { align-content: start; background: #fff; }
.purchase-form[hidden] { display: none; }
.purchase-form:not([hidden]) { scroll-margin-top: 82px; }
.purchase-form-heading p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.guided-verification-form { gap: 22px; padding: 0; overflow: hidden; }
.guided-verification-heading { padding: 18px 24px 0; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.authorization-guide {
  padding: 22px 26px;
  margin: 0 24px;
  background: #eff7ff;
  border: 1px solid #c9defb;
  border-radius: 20px;
}
.authorization-guide-heading { display: grid; gap: 3px; margin-bottom: 22px; }
.authorization-guide-heading span { color: #2563eb; font-size: 12px; font-weight: 850; letter-spacing: .08em; }
.authorization-guide-heading h3 { margin: 0; color: #1d2b43; font-size: 22px; }
.authorization-quick-path {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 12px 14px;
  margin: 0 0 18px;
  background: #fff;
  border: 1px solid #c9defb;
  border-radius: 14px;
  color: #1d2b43;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.4;
}
.authorization-quick-path span { display: inline-flex; align-items: center; gap: 6px; }
.authorization-quick-path b {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  background: #2867ec;
  color: #fff;
  border-radius: 50%;
  font-size: 12px;
}
.authorization-quick-path i { color: #8aa0c2; font-style: normal; font-weight: 850; }
.authorization-next-hint {
  margin: 10px 0 0;
  padding: 10px 12px;
  background: #e8f1ff;
  color: #1d4fbf;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 750;
}
.authorization-guide ol { display: grid; gap: 20px; padding: 0; margin: 0; list-style: none; }
.authorization-guide li { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 18px; align-items: start; }
.authorization-guide li > div { min-width: 0; padding-top: 5px; }
.authorization-guide li strong { color: #26364f; font-size: 18px; }
.authorization-guide li p { margin: 7px 0 0; color: #617089; font-size: 15px; line-height: 1.65; }
.authorization-guide li p a { color: var(--brand); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.authorization-step-number {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  background: #2867ec;
  color: #fff;
  border-radius: 50%;
  box-shadow: 0 7px 18px rgba(37,99,235,.2);
  font-size: 19px;
  font-weight: 850;
}
.authorization-main-step > div { padding-top: 0 !important; }
.authorization-link-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; color: #26364f; font-size: 18px; font-weight: 760; line-height: 1.5; }
.authorization-primary-link { color: #2463dc; font-size: 20px; font-weight: 850; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; overflow-wrap: anywhere; }
.authorization-link-actions { display: inline-flex; gap: 6px; }
.authorization-link-actions a, .authorization-link-actions button { display: grid; place-items: center; width: 34px; height: 34px; padding: 0; background: #fff; color: #718096; border: 1px solid #d1dbea; border-radius: 9px; box-shadow: none; font-size: 17px; line-height: 1; }
.authorization-link-actions a:hover, .authorization-link-actions button:hover { color: #2463dc; border-color: #8eb7f1; transform: none; }
.authorization-session-check { padding: 0 0 18px; margin-bottom: 18px; border-bottom: 1px solid #cfdef2; }
.authorization-session-check code { padding: 2px 6px; background: #fff; color: #344054; border: 1px solid #d8e2ef; border-radius: 6px; font: 13px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace; }
.authorization-session-check small { display: block; padding: 10px 12px; margin-top: 10px; background: #fff8e6; color: #7a4d00; border: 1px solid #efc14f; border-radius: 10px; font-size: 11px; line-height: 1.55; }
.authorization-session-check small strong { color: #7a4d00; font-size: inherit; }
.authorization-guide-unavailable { display: grid; gap: 3px; padding: 12px 14px; margin-top: 12px; background: #fff8e6; border: 1px solid #efc14f; border-radius: 12px; }
.authorization-guide-unavailable span { color: #7a4d00; font-size: 12px; }
.authorization-redacted-preview { margin-top: 18px; overflow: hidden; background: #fff; border: 1px solid #c6dbf8; border-radius: 20px; box-shadow: 0 10px 26px rgba(46,91,158,.07); }
.redacted-browser-bar { display: flex; align-items: center; gap: 6px; min-height: 46px; padding: 10px 15px; background: #f6f8fb; border-bottom: 1px solid #e1e8f1; }
.redacted-browser-bar i { width: 8px; height: 8px; background: #c4cfdd; border-radius: 50%; }
.redacted-browser-bar span { min-width: 0; margin-left: 6px; overflow: hidden; color: #667085; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.redacted-screen { position: relative; display: grid; gap: 16px; min-height: 355px; padding: 26px; background: #fff; }
.redacted-preview-title { display: grid; gap: 3px; }
.redacted-preview-title strong { color: #1f2f49; font-size: 18px; }
.redacted-preview-title small { color: #7b8799; font-size: 11px; }
.redacted-lines { display: grid; align-content: center; gap: 8px; min-width: 0; min-height: 142px; padding: 16px; border: 2px solid #ff6666; border-radius: 4px; }
.redacted-lines b { display: block; height: 8px; background: linear-gradient(90deg, #e5eaf2 0 32%, #cfd7e4 32% 65%, #e8edf4 65% 100%); border-radius: 3px; }
.redacted-lines b:nth-child(2n) { width: 84%; }
.redacted-lines b:nth-child(3n) { width: 68%; }
.redacted-callout { display: grid; align-content: center; gap: 7px; padding: 15px 16px; background: #f7fbff; border: 2px solid #6ca5ff; border-radius: 12px; box-shadow: 0 0 0 4px rgba(37,99,235,.05); }
.redacted-callout strong { color: #245ebc; font-size: 13px; }
.redacted-callout span { padding: 10px 11px; overflow: hidden; background: #fff; color: #344054; border: 1px solid #dbe5f3; border-radius: 8px; font: 14px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; text-overflow: ellipsis; white-space: nowrap; }
.redacted-callout small { color: #718096; font-size: 10px; line-height: 1.4; }
.redacted-safe-response { display: grid; align-content: center; gap: 9px; min-width: 0; min-height: 220px; padding: 22px 24px; overflow: hidden; background: #fbfcfe; color: #344054; border: 2px solid #ff5d5d; border-radius: 3px; font: 14px/1.45 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.redacted-safe-response > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.redacted-token-line { display: block; padding: 9px 11px; margin: 2px -3px; background: #edf5ff; color: #245ebc; border: 2px solid #69a5ff; border-radius: 7px; }
.redacted-token-line strong { color: #174ea6 !important; font: inherit !important; font-weight: 850 !important; }
.redacted-security-note { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px 26px; color: #ff4d4f; font-size: 11px; line-height: 1.5; text-align: center; }
.redacted-security-note strong { color: #ff4d4f !important; font-size: inherit !important; }
.authorization-redacted-preview > p { padding: 13px 16px; margin: 0; background: #f2f7fd; color: #8090a6; border-top: 1px solid #e1ebf7; font-size: 13px; text-align: center; }
.authorization-redacted-preview > p strong { color: #617089; font-size: inherit; }
.authorization-inline-warning { padding: 13px 15px; margin: 22px 0 0; background: #edf8f0; color: #1f6b3a; border: 1px solid #8fd3a8; border-radius: 12px; font-size: 12px; line-height: 1.6; }
.authorization-paste-section { display: grid; gap: 14px; padding: 0 24px 24px; }
.authorization-paste-section h3 { margin: 2px 0 0; font-size: 24px; }
.authorization-paste-section > div > p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.verification-key-input { min-height: 72px; padding: 16px; background: #fbfcfe; font: 15px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.session-preview { margin-top: 14px; cursor: zoom-in; }
.session-preview .redacted-screen { min-height: 0; padding: 10px; }
.session-json-preview { min-height: 0; max-height: 230px; align-content: start; gap: 2px; padding: 10px 12px; color: #3a4657; font-size: 9px; font-weight: 500; line-height: 1.55; letter-spacing: 0; }
.session-json-warning { color: #d2622a !important; }
.authorization-copy-notes { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 30px; margin-top: 12px; color: #ff4d4f; font-size: 12px; font-weight: 700; line-height: 1.6; text-align: center; }
.authorization-figure-caption { margin: 12px 0 0; color: #8090a6; font-size: 13px; line-height: 1.6; text-align: center; }
body.session-preview-expanded .session-preview { position: fixed; inset: 3vh 4vw; z-index: 140; overflow: auto; cursor: zoom-out; box-shadow: 0 24px 60px rgba(15,35,70,.35); }
body.session-preview-expanded .session-json-preview { max-height: none; }
.session-json-example { margin: 0; padding: 16px 18px; overflow-x: auto; background: #fbfcfe; color: #55647e; border: 1px solid #dbe5f3; border-radius: 12px; font: 13px/1.7 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.session-json-example code { font: inherit; color: inherit; white-space: pre; }
textarea.session-json-input { min-height: 170px; resize: vertical; line-height: 1.55; }
.checkout-fields-inline { display: grid; gap: 12px; }
@keyframes reveal-checkout-step {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}
.authorization-confirmation > p { color: var(--muted); }
.confirmation-list { display: grid; gap: 0; margin: 18px 0 22px; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.confirmation-list div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 15px; background: #f8fafc; border-bottom: 1px solid var(--line); }
.confirmation-list div:last-child { border-bottom: 0; }
.confirmation-list dt { color: var(--muted); }
.confirmation-list dd { margin: 0; font-weight: 800; text-align: right; }
.confirmation-order-form { display: grid; gap: 16px; }
.checkout-extras { display: grid; gap: 10px; }
.checkout-option-card {
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
}
.checkout-option {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  cursor: pointer;
}
.checkout-option span { display: grid; flex: 1; gap: 2px; min-width: 0; }
.checkout-option strong { font-size: 15px; line-height: 1.3; }
.checkout-option small { color: var(--muted); font-size: 12px; font-weight: 600; line-height: 1.5; }
.checkout-option input { flex: 0 0 auto; width: 18px; min-height: 18px; margin: 0; }
.checkout-option > b { flex: 0 0 auto; color: #5542db; font-size: 14px; }
.checkout-option-link { flex: 0 0 auto; color: var(--brand); font-size: 13px; font-weight: 800; }
.checkout-option-note { margin: 8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.checkout-option-note a { color: var(--brand); font-weight: 800; }
.invoice-choice-panel { background: #fffaf3; border-color: #edd7a8; }
.invoice-choice-badge { display: none; }
.invoice-choice { color: #402b05; }
.invoice-choice input { accent-color: #b54708; }
.invoice-choice small { color: #7a4d00; }
.invoice-choice-panel > p { margin: 8px 0 0; color: #7a4d00; font-size: 12px; }
.protection-choice-panel { background: #f6f4ff; border-color: #d5cef8; }
.checkout-option.protection-choice,
.checkout-option.invoice-choice {
  padding: 0;
  margin: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.checkout-option.protection-choice:has(input:checked),
.checkout-option.invoice-choice:has(input:checked) {
  border: 0;
  box-shadow: none;
}
.checkout-option.protection-choice input,
.checkout-option.invoice-choice input { margin: 0; }
.checkout-option.protection-choice strong { font-size: 15px; }
.checkout-option.protection-choice small { color: #675fa3; font-size: 12px; }
.protection-choice-heading { display: flex; align-items: start; justify-content: space-between; gap: 16px; }
.protection-choice-heading h2 { margin: 6px 0 0; color: #24205a; font-size: 21px; }
.protection-choice-heading > strong { flex: 0 0 auto; color: #5542db; font-size: 20px; }
.protection-choice-badge { display: inline-flex; padding: 4px 9px; background: #5b49df; color: #fff; border-radius: 999px; font-size: 11px; font-weight: 850; }
.protection-choice { align-items: flex-start; padding: 14px; margin-top: 14px; background: #fff; border: 1px solid #cbc4ff; border-radius: 13px; color: #29265f; cursor: pointer; }
.protection-choice:has(input:checked) { border-color: #5b49df; box-shadow: 0 0 0 3px rgba(91, 73, 223, .13); }
.protection-choice input { margin-top: 3px; accent-color: #5b49df; }
.protection-choice span { display: grid; gap: 4px; }
.protection-choice strong { font-size: 17px; }
.protection-choice small { color: #675fa3; font-size: 13px; font-weight: 700; }
.protection-coverage { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 11px; }
.protection-coverage p { padding: 11px 12px; margin: 0; background: rgba(255,255,255,.72); color: #555174; border: 1px solid #ddd9f6; border-radius: 11px; font-size: 12px; line-height: 1.65; }
.protection-coverage b { color: #3a327f; }
.protection-legal { margin: 11px 2px 0; color: #696580; font-size: 11px; line-height: 1.65; }
.protection-legal a { color: #4d3bd1; font-weight: 800; }
.protection-status-card { padding: 13px 15px; margin: 14px 0; border-radius: 12px; font-size: 13px; line-height: 1.6; }
.protection-status-card.included { background: #eef9f4; color: #17643b; border: 1px solid #bce2ca; }
.protection-status-card.basic { background: #f8fafc; color: #667085; border: 1px solid var(--line); }
.receipt-choice-note { padding: 12px 14px; margin: 0; background: #edf7f1; color: #17643b; border: 1px solid #bce2ca; border-radius: 12px; font-size: 13px; }
.receipt-example-banner { display: grid; gap: 12px; align-items: center; padding: 16px 18px; margin: 0 0 18px; background: #fff8e6; color: #754500; border: 1px solid #efc14f; border-radius: 14px; }
.receipt-example-banner p { margin: 3px 0 0; font-size: 13px; }
.receipt-example-banner .secondary { background: #fff; }
label { display: grid; gap: 7px; color: #344054; font-size: 14px; font-weight: 700; }
input, select, textarea {
  width: 100%;
  min-height: 48px;
  padding: 11px 13px;
  background: #fff;
  color: var(--text);
  border: 1px solid #cfd6e3;
  border-radius: 11px;
  outline: none;
  font-size: 16px;
}
textarea { min-height: 100px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.privacy-note { margin: 0; color: var(--muted); font-size: 13px; }
.sticky-action { position: static; width: 100%; }

.status-card { margin-top: 20px; text-align: center; }
.status-card > p { color: var(--muted); }
.status-icon { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 16px; border-radius: 50%; background: #eaf1ff; color: var(--brand); font-size: 28px; font-weight: 900; }
.order-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 0; margin: 20px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.order-summary strong { white-space: nowrap; font-size: 20px; }
.timeline { display: grid; grid-template-columns: repeat(4, 1fr); padding: 0; margin: 28px 0; list-style: none; }
.timeline li { position: relative; color: var(--muted); font-size: 11px; }
.timeline li::before { content: ""; position: absolute; top: 15px; left: -50%; width: 100%; height: 2px; background: var(--line); z-index: 0; }
.timeline li:first-child::before { display: none; }
.timeline span { position: relative; z-index: 1; display: grid; place-items: center; width: 32px; height: 32px; margin: 0 auto 6px; border-radius: 50%; background: #eef1f5; font-weight: 800; }
.timeline li.done { color: var(--text); font-weight: 700; }
.timeline li.done span, .timeline li.done::before { background: var(--brand); color: #fff; }

.pay-card h1 { margin: 6px 0 0; }
.pay-card form { display: grid; gap: 10px; }
.invoice-payment-notice { display: grid; gap: 3px; padding: 14px 15px; margin: 0 0 16px; background: #fff8e6; border: 1px solid #f2b94b; border-radius: 13px; color: #7a4d00; text-align: left; }
.invoice-payment-notice strong { color: #713b00; }
.invoice-payment-notice span { font-size: 13px; }
.receipt-payment-notice { display: grid; gap: 3px; padding: 14px 15px; margin: 0 0 16px; background: #edf7f1; border: 1px solid #b9ddc6; border-radius: 13px; color: #17643b; text-align: left; }
.receipt-payment-notice span { font-size: 13px; }
.receipt-ready-card { display: grid; gap: 14px; align-items: center; padding: 18px; margin: 20px 0 14px; background: linear-gradient(135deg, #edf7f1, #f9fffb); border: 1px solid #b9ddc6; border-radius: 15px; text-align: left; }
.receipt-ready-card h2 { margin: 3px 0; font-size: 21px; }
.receipt-ready-card p { margin: 0; color: #496455; font-size: 13px; }

.receipt-body { background: #222731; }
.receipt-shell { width: min(1120px, calc(100% - 28px)); margin: 0 auto; padding: 26px 0 54px; }
.receipt-toolbar { display: grid; gap: 16px; padding: 20px; margin-bottom: 18px; background: #fff; border-radius: 18px; box-shadow: 0 16px 48px rgba(0,0,0,.2); }
.receipt-toolbar p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.receipt-toolbar label { align-self: end; }
.receipt-toolbar-actions { display: flex; align-items: end; gap: 9px; }
.receipt-toolbar-actions > * { flex: 1; }
.receipt-document { position: relative; min-height: 1080px; padding: clamp(30px, 6vw, 64px); overflow: hidden; background: #fff; color: #111827; border-radius: 18px; box-shadow: 0 20px 70px rgba(0,0,0,.3); }
.receipt-document.refund::before { content: "退款状态"; position: absolute; top: 120px; right: -52px; width: 260px; padding: 8px; transform: rotate(35deg); background: #b42318; color: #fff; text-align: center; font-weight: 900; letter-spacing: .16em; }
.receipt-example-watermark { position: absolute; z-index: 3; top: 122px; right: -64px; width: 310px; padding: 9px; transform: rotate(35deg); background: #b54708; color: #fff; text-align: center; font-size: 13px; font-weight: 900; letter-spacing: .08em; }
.receipt-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 24px; border-bottom: 1px solid #d8dee9; }
.receipt-title span { color: #607089; font-size: 13px; font-weight: 750; }
.receipt-title h1 { margin: 3px 0 0; font-size: clamp(34px, 7vw, 54px); line-height: 1.1; letter-spacing: -.05em; }
.receipt-title > strong { font-size: clamp(20px, 4vw, 31px); text-align: right; }
.receipt-reference { padding: 24px 0; }
.receipt-reference dl { display: flex; flex-wrap: wrap; gap: 12px 34px; margin: 0; }
.receipt-reference dl div { display: grid; grid-template-columns: auto auto; gap: 10px; }
.receipt-reference dt { color: #697586; font-weight: 700; }
.receipt-reference dd { margin: 0; font-weight: 700; }
.receipt-parties { display: grid; grid-template-columns: minmax(0, 1fr) minmax(210px, .6fr); gap: 24px; min-height: 178px; padding: 28px 0; border-top: 1px solid #e2e7ef; }
.receipt-issuer { display: grid; align-content: start; gap: 2px; }
.receipt-issuer strong { margin-bottom: 3px; font-size: 18px; }
.receipt-issuer span { color: #667085; }
.receipt-customer { display: grid; align-content: start; justify-items: end; gap: 6px; text-align: right; }
.receipt-customer span { color: #667085; font-weight: 700; }
.receipt-customer strong { max-width: 100%; overflow-wrap: anywhere; font-size: 20px; }
.receipt-document > h2 { margin: 30px 0 50px; font-size: clamp(25px, 4vw, 38px); line-height: 1.25; letter-spacing: -.025em; }
.receipt-table-wrap { width: 100%; overflow-x: auto; }
.receipt-table { min-width: 700px; white-space: normal; }
.receipt-table th, .receipt-table td { padding: 14px 10px; border-bottom: 1px solid #d9dfe9; }
.receipt-table th { color: #687589; font-weight: 650; }
.receipt-table th:nth-last-child(-n+3), .receipt-table td:nth-last-child(-n+3) { text-align: right; }
.receipt-total { display: flex; justify-content: flex-end; padding: 24px 0; border-bottom: 1px solid #d9dfe9; }
.receipt-total dl { width: min(100%, 360px); margin: 0; }
.receipt-total dl div { display: flex; justify-content: space-between; gap: 24px; padding: 7px 0; }
.receipt-total dd { margin: 0; font-variant-numeric: tabular-nums; }
.receipt-total .grand-total { padding-top: 15px; margin-top: 7px; border-top: 1px solid #d9dfe9; font-size: 18px; font-weight: 850; }
.receipt-legal { padding: 16px 18px; margin-top: 36px; background: #f5f7fa; border-left: 4px solid #53657f; border-radius: 10px; }
.receipt-legal p { margin: 4px 0 0; color: #5e6b7e; font-size: 12px; }
.receipt-document > footer { display: flex; justify-content: space-between; gap: 16px; padding-top: 35px; margin-top: 65px; border-top: 1px solid #e2e7ef; color: #8490a2; font-size: 12px; }
.pay-method-hint { margin: 8px 0 0; color: var(--muted); font-size: 14px; }
.pay-option-grid { display: grid; gap: 10px; margin-top: 4px; }
.pay-option { width: 100%; justify-content: space-between; background: #fff; border: 1px solid var(--line); color: var(--text); box-shadow: none; text-align: left; }
.pay-option:hover { border-color: #8bb4ff; background: #f6f9ff; }
.pay-option span { display: grid; }
.pay-option small { color: var(--muted); font-weight: 500; }
.pay-option .payment-brand { flex: 0 0 auto; width: 36px; height: 36px; margin: 0; }
.pay-option.wechat { border-color: #9ee0b8; }
.pay-option.alipay { border-color: #9fd4f5; }
.checkout-option-kicker { margin-bottom: 8px; color: #5b49df; font-size: 12px; font-weight: 850; letter-spacing: .04em; }
@media (min-width: 640px) {
  .pay-option-grid { grid-template-columns: 1fr 1fr; }
}
.empty-state { padding: 18px; background: #fff7ed; color: var(--warning); border-radius: 12px; }

.site-footer { display: grid; gap: 18px; padding: 32px max(18px, env(safe-area-inset-left)) max(32px, env(safe-area-inset-bottom)); background: #111827; color: #aab4c5; font-size: 12px; }
.site-footer a { color: #fff; }
.site-footer strong { color: #fff; font-size: 16px; }
.site-footer p { margin: 4px 0 0; }
.site-footer nav { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.site-footer small { padding-top: 15px; border-top: 1px solid #263249; }
.site-footer .site-compliance { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0; color: #d5dbea; }

.customer-tools { position: fixed; z-index: 24; right: max(14px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); display: grid; gap: 8px; }
.customer-tools a, .customer-tools button { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 9px 13px; background: #fff; color: #243047; border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 10px 28px rgba(16,24,40,.16); font-size: 13px; font-weight: 800; }
.customer-tools span { display: grid; place-items: center; width: 25px; height: 25px; background: #edf2ff; color: var(--brand); border-radius: 50%; font-weight: 900; }
.customer-tools a:last-child span { background: #07c160; color: #fff; }
.bookmark-tip { position: fixed; z-index: 50; left: 50%; bottom: max(88px, calc(env(safe-area-inset-bottom) + 76px)); width: min(430px, calc(100% - 28px)); padding: 20px; transform: translateX(-50%); background: #111827; color: #fff; border: 1px solid #31405b; border-radius: 18px; box-shadow: 0 20px 60px rgba(0,0,0,.32); }
.bookmark-tip[hidden] { display: none; }
.bookmark-tip strong { font-size: 18px; }
.bookmark-tip p { margin: 6px 0 14px; color: #d1d8e4; }
.bookmark-tip button { width: 100%; min-height: 42px; background: #fff; color: #111827; border: 0; border-radius: 11px; font-weight: 800; }

.content-section { margin-top: 42px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.section-heading h2 { margin: 3px 0 0; font-size: clamp(25px, 4vw, 38px); line-height: 1.15; letter-spacing: -.035em; }
.section-heading > a { flex: 0 0 auto; color: var(--brand); font-weight: 800; }
.tutorial-promo, .enterprise-promo, .codex-promo { display: grid; gap: 22px; align-items: center; padding: clamp(24px, 5vw, 48px); background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
.tutorial-promo h2, .enterprise-promo h2, .codex-promo h2 { margin: 5px 0 10px; font-size: clamp(26px, 4vw, 42px); line-height: 1.12; letter-spacing: -.04em; }
.tutorial-promo p, .enterprise-promo p, .codex-promo p { max-width: 700px; color: var(--muted); }
.tutorial-promo ol { display: grid; gap: 8px; padding: 0; margin: 0; counter-reset: tutorial; list-style: none; }
.tutorial-promo li { padding: 12px 15px; background: #f3f6fb; border-radius: 12px; font-weight: 750; }
.tutorial-promo li::before { counter-increment: tutorial; content: counter(tutorial); display: inline-grid; place-items: center; width: 25px; height: 25px; margin-right: 9px; background: var(--brand); color: #fff; border-radius: 50%; font-size: 12px; }
.enterprise-promo { background: linear-gradient(135deg, #111827, #1c2f52); color: #fff; }
.enterprise-promo p { color: #c6d0df; }
.enterprise-promo .secondary { justify-self: start; }
.codex-promo { background: linear-gradient(135deg, #eef2ff, #f8f5ff); border-color: #d9d8ff; }
.codex-promo .secondary { justify-self: start; }
.compact-benefit-note a { color: var(--brand); font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.legal-page .article-shell { max-width: 920px; margin-inline: auto; }
.legal-config-note { padding: 14px 16px; background: #fff8e6; border: 1px solid #f2c35c; border-radius: 12px; color: #7a4d00; }
.trust-facts { display: grid; gap: 0; margin: 18px 0 0; background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.trust-facts div { display: grid; grid-template-columns: minmax(95px, .35fr) minmax(0, 1fr); gap: 16px; padding: 15px 17px; border-bottom: 1px solid var(--line); }
.trust-facts div:last-child { border-bottom: 0; }
.trust-facts dt { color: var(--muted); font-weight: 750; }
.trust-facts dd { margin: 0; overflow-wrap: anywhere; font-weight: 700; }
.trust-facts a { color: var(--brand); }
.pending-fact { color: #9a6700; font-weight: 650; }

.review-grid, .blog-grid { display: grid; gap: 14px; }
.review-card { display: grid; gap: 14px; min-width: 0; padding: 22px; margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 18px; box-shadow: 0 8px 24px rgba(23,32,51,.05); }
.review-card p { margin: 0; color: #303949; font-size: 15px; }
.review-stars { color: #f59e0b; letter-spacing: 2px; }
.review-card footer { display: grid; }
.review-card footer span, .review-card footer small { color: var(--muted); font-size: 12px; }
.review-card footer small { margin-top: 5px; color: var(--success); font-weight: 750; }
.review-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 16px; padding: 6px 0 28px; color: var(--muted); }
.review-summary-stars, .review-showcase-stars { color: #fbb11f; letter-spacing: 3px; font-size: 22px; }
.review-summary strong { color: var(--text); font-size: 25px; letter-spacing: -.03em; }
.review-summary span { padding-right: 16px; border-right: 1px solid #d7deea; }
.review-summary a { color: var(--brand); font-weight: 800; }
.review-showcase-grid { display: grid; gap: 18px; }
.review-showcase-card { display: grid; gap: 20px; min-width: 0; padding: 26px; background: #fff; border: 1px solid #e2e8f2; border-radius: 22px; box-shadow: 0 10px 28px rgba(23,32,51,.055); }
.review-showcase-quote { min-height: 96px; margin: 0; color: #3f4d64; font-size: 18px; line-height: 1.65; }
.review-showcase-meta { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding-top: 8px; border-bottom: 1px solid #e8edf5; padding-bottom: 18px; }
.review-showcase-meta time { color: #8fa0ba; font-size: 15px; }
.review-showcase-card footer { display: flex; align-items: center; gap: 12px; min-width: 0; }
.review-avatar { display: grid; flex: 0 0 44px; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, #c7c7ff, #7a61f4); color: #fff; font-size: 20px; font-weight: 850; }
.review-showcase-card footer > div { display: grid; gap: 2px; min-width: 0; }
.review-showcase-card footer strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-showcase-card footer span { overflow: hidden; color: #93a3bb; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.review-showcase-card footer small { margin-left: auto; padding: 7px 11px; border: 1px solid #dce4f0; border-radius: 999px; color: #697991; font-size: 12px; white-space: nowrap; }
.home-reviews { padding: clamp(22px, 4vw, 38px); background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: 0 8px 28px rgba(23,32,51,.045); }
.home-reviews .section-heading { margin-bottom: 20px; }
.review-empty-state { display: grid; gap: 4px; padding: 18px; background: #f7f9fc; border: 1px dashed #cfd7e4; border-radius: 14px; }
.review-empty-state p { max-width: 820px; margin: 0; color: var(--muted); font-size: 13px; }
.blog-card { min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: 18px; transition: transform .18s ease, border-color .18s ease; }
.blog-card:hover { transform: translateY(-2px); border-color: #a9bfe9; }
.blog-card > a { display: flex; flex-direction: column; height: 100%; min-height: 300px; padding: 22px; }
.blog-card-label { color: var(--brand); font-size: 12px; font-weight: 850; }
.blog-card h2 { margin: 9px 0 10px; overflow-wrap: anywhere; font-size: 21px; line-height: 1.3; letter-spacing: -.02em; }
.blog-card p { flex: 1; margin: 0; color: var(--muted); font-size: 14px; }
.blog-card footer { display: flex; justify-content: space-between; gap: 12px; padding-top: 17px; margin-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.blog-card footer span { color: var(--brand); font-weight: 800; }

.content-page, .article-page { width: min(1180px, calc(100% - 28px)); }
.breadcrumbs { display: flex; gap: 8px; align-items: center; overflow: hidden; margin-bottom: 25px; color: var(--muted); font-size: 13px; white-space: nowrap; }
.breadcrumbs a { color: var(--brand); }
.breadcrumbs span:last-child { overflow: hidden; text-overflow: ellipsis; }
.content-hero { max-width: 900px; padding: 32px 0 46px; }
.content-hero h1 { margin: 8px 0 16px; font-size: clamp(34px, 6vw, 62px); line-height: 1.08; letter-spacing: -.05em; }
.content-hero > p { max-width: 760px; margin: 0; color: var(--muted); font-size: 17px; }
.topic-links { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 25px; }
.topic-links a { padding: 8px 12px; background: #eaf1ff; color: #244a93; border-radius: 999px; font-size: 13px; font-weight: 750; }
.content-cta { display: grid; justify-items: start; gap: 10px; padding: clamp(25px, 5vw, 50px); margin-top: 42px; background: #111827; color: #fff; border-radius: 24px; }
.content-cta h2, .content-cta p { margin: 0; }
.content-cta p { color: #bdc8d8; }
#recharge-plans { scroll-margin-top: 90px; }

.article-shell { max-width: 820px; padding: clamp(24px, 5vw, 54px); margin: 0 auto; background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
.article-shell > header h1 { margin: 8px 0 16px; font-size: clamp(31px, 5.5vw, 52px); line-height: 1.12; letter-spacing: -.045em; }
.article-lead { color: #4b5565; font-size: 18px; }
.article-meta { display: flex; flex-wrap: wrap; gap: 7px 16px; padding-top: 17px; margin-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.article-body { color: #273247; font-size: 17px; line-height: 1.9; }
.article-body h2 { margin: 42px 0 13px; color: var(--text); font-size: 29px; line-height: 1.3; letter-spacing: -.025em; }
.article-body h3 { margin: 28px 0 10px; color: var(--text); font-size: 22px; }
.article-body p { margin: 0 0 20px; }
.article-body ul { display: grid; gap: 8px; padding-left: 22px; margin: 0 0 23px; }
.article-notice { padding: 16px 18px; margin-top: 35px; background: #f7f9fc; border-left: 4px solid var(--brand); border-radius: 12px; }
.article-notice p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.article-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.related-posts { margin-top: 48px; }

.tutorial-item { display: grid; gap: 20px; padding: clamp(22px, 5vw, 42px); margin-bottom: 24px; background: #fff; border: 1px solid var(--line); border-radius: 24px; }
.tutorial-item > header h2 { margin: 4px 0 8px; font-size: clamp(26px, 4vw, 40px); line-height: 1.2; }
.tutorial-item > header p { margin: 0; color: var(--muted); }
.tutorial-video { display: block; width: 100%; max-height: 680px; background: #080b11; border-radius: 18px; }
.tutorial-placeholder { display: grid; place-items: center; min-height: 310px; padding: 30px; background: linear-gradient(135deg, #101827, #20365c); color: #fff; border-radius: 18px; text-align: center; }
.tutorial-placeholder span { font-size: 24px; font-weight: 850; }
.tutorial-placeholder p { max-width: 520px; color: #c5cfdd; }
.tutorial-transcript { max-width: 820px; }
.business-feature-grid { display: grid; gap: 14px; }
.business-feature-grid article { padding: 24px; background: #fff; border: 1px solid var(--line); border-radius: 18px; }
.business-feature-grid b { color: var(--brand); font-size: 13px; }
.business-feature-grid h2 { margin: 7px 0; }
.business-feature-grid p { margin: 0; color: var(--muted); }
.compliance-block { padding: clamp(24px, 5vw, 42px); background: #fff; border: 1px solid var(--line); border-radius: 22px; }
.compliance-block h2 { margin-top: 0; }
.compliance-block li { margin-bottom: 8px; }

.contact-hero { padding-bottom: 34px; }
.contact-card { display: grid; gap: 26px; align-items: center; padding: clamp(24px, 5vw, 48px); background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
.contact-details h2 { margin: 13px 0 18px; font-size: clamp(28px, 5vw, 44px); line-height: 1.15; }
.wechat-service-badge { display: inline-flex; align-items: center; gap: 8px; color: #15733f; font-size: 13px; font-weight: 850; }
.wechat-service-badge i { display: grid; place-items: center; width: 28px; height: 28px; background: #07c160; color: #fff; border-radius: 9px; font-style: normal; }
.wechat-id-box { display: grid; gap: 9px; padding: 17px; background: #f4fbf7; border: 1px solid #bce7cc; border-radius: 15px; }
.wechat-id-box span { color: #4c6b59; font-size: 12px; font-weight: 750; }
.wechat-id-box strong { overflow-wrap: anywhere; color: #075c30; font-size: 23px; }
.wechat-id-box button { justify-self: start; }
.contact-details ul { display: grid; gap: 8px; padding-left: 20px; margin: 22px 0; color: var(--muted); font-size: 14px; }
.contact-unconfigured { padding: 17px; background: #fff7ed; border: 1px solid #fed7aa; border-radius: 14px; }
.contact-unconfigured p { margin: 4px 0 0; color: var(--warning); font-size: 13px; }
.contact-qr-wrap { min-width: 0; }
.contact-qr { margin: 0; text-align: center; }
.contact-qr-trigger { position: relative; display: block; width: min(100%, 340px); padding: 0; margin: 0 auto; overflow: hidden; border: 0; border-radius: 22px; background: #fff; color: inherit; cursor: zoom-in; }
.contact-qr-trigger img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; background: #fff; border: 12px solid #f5f7fa; border-radius: 22px; }
.contact-qr-zoom-hint { position: absolute; right: 18px; bottom: 18px; padding: 7px 10px; background: rgba(16, 24, 40, .82); color: #fff; border-radius: 999px; box-shadow: 0 5px 18px rgba(16, 24, 40, .2); font-size: 12px; font-weight: 800; }
.contact-qr-trigger:hover img { border-color: #e7ecf4; }
.contact-qr-trigger:focus-visible { outline: 3px solid rgba(37, 99, 235, .35); outline-offset: 4px; }
.contact-qr figcaption { margin-top: 10px; color: var(--muted); font-size: 13px; }
.support-qr-dialog { width: min(620px, calc(100% - 24px)); max-height: calc(100vh - 24px); padding: 0; overflow: visible; border: 0; border-radius: 24px; background: transparent; color: var(--text); }
.support-qr-dialog::backdrop { background: rgba(8, 15, 30, .76); backdrop-filter: blur(4px); }
.support-qr-dialog-card { position: relative; display: grid; justify-items: center; padding: clamp(22px, 4vw, 34px); background: #fff; border-radius: 24px; box-shadow: 0 30px 100px rgba(8, 15, 30, .4); text-align: center; }
.support-qr-dialog-card h2 { margin: 7px 44px 18px; font-size: clamp(24px, 5vw, 34px); }
.support-qr-dialog-card img { display: block; width: min(100%, 520px); max-height: 68vh; object-fit: contain; background: #fff; border: 10px solid #f5f7fa; border-radius: 18px; }
.support-qr-dialog-card p { margin: 14px 0 0; color: var(--muted); font-size: 13px; }
.support-qr-dialog-close { position: absolute; top: 14px; right: 14px; display: grid; place-items: center; width: 44px; min-height: 44px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: #f6f8fb; color: var(--text); font-size: 28px; line-height: 1; cursor: pointer; }
.support-qr-dialog-close:hover { background: #edf1f7; }
.contact-qr-placeholder { display: grid; place-items: center; min-height: 300px; padding: 30px; background: #f4f6f9; color: var(--muted); border: 2px dashed #cdd5e2; border-radius: 20px; text-align: center; }
.contact-qr-placeholder span { color: var(--text); font-size: 22px; font-weight: 850; }
.contact-qr-placeholder p { margin: 5px 0 0; }
.contact-hours { padding: 28px; background: #fff; border: 1px solid var(--line); border-radius: 20px; }
.contact-hours h2 { margin-top: 0; }
.contact-hours > div { display: grid; gap: 10px; }
.contact-hours article { display: flex; align-items: center; gap: 13px; padding: 14px; background: #f7f9fc; border-radius: 13px; }
.contact-hours article b { color: var(--brand); }
.contact-hours article p { margin: 0; }
.support-admin-grid { display: grid; gap: 18px; }
.support-qr-preview { margin: 0; text-align: center; }
.support-qr-preview img { display: block; width: min(100%, 260px); aspect-ratio: 1; margin: 0 auto; object-fit: contain; background: #fff; border: 8px solid #f4f6f9; border-radius: 16px; }
.support-qr-preview figcaption { margin-top: 7px; color: var(--muted); font-size: 12px; }

.admin-body { background: #f3f5f9; }
.admin-header { position: sticky; align-items: center; }
.admin-header nav { display: none; position: absolute; top: 64px; left: 12px; right: 12px; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.admin-header nav.open { display: grid; }
.admin-header nav a, .admin-header nav button { display: flex; align-items: center; min-height: 42px; padding: 8px 10px; border: 0; background: transparent; color: #344054; font-weight: 700; }
.admin-header nav a[aria-current="page"] { background: #eaf1ff; color: var(--brand); }
.admin-header nav form { margin: 0; }
.nav-toggle { min-height: 42px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.admin-main { width: min(1220px, calc(100% - 24px)); margin: 0 auto; padding: 24px 0 70px; }
.admin-main h1 { margin: 0 0 18px; font-size: 28px; }
.admin-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-bottom: 18px; }
.admin-stats article { padding: 16px; background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.admin-stats span { display: block; color: var(--muted); font-size: 13px; }
.admin-stats strong { display: block; margin-top: 4px; font-size: 28px; }
.admin-panel { padding: 18px; margin-bottom: 16px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 6px 22px rgba(23, 32, 51, .04); }
.admin-panel h2 { margin: 0 0 14px; font-size: 20px; }
.admin-panel form, form.admin-panel { display: grid; gap: 14px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.panel-heading h1, .panel-heading h2 { margin: 0; }
.panel-heading > form { margin-left: auto; }
.form-grid { display: grid; gap: 12px; }
.check { display: flex; grid-template-columns: none; align-items: center; gap: 9px; }
.check input { width: 20px; min-height: 20px; }
.table-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table { width: 100%; border-collapse: collapse; white-space: nowrap; }
th, td { padding: 11px 10px; border-bottom: 1px solid var(--line); font-size: 13px; text-align: left; }
th { color: var(--muted); font-size: 12px; }
tbody tr:hover { background: #f8faff; }
code { font: 12px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.inline { display: inline-flex !important; margin: 0; }
.status-pill { display: inline-flex; padding: 4px 8px; background: #eef2f7; border-radius: 999px; color: #344054; font-size: 11px; font-weight: 750; }
.alert { padding: 12px 14px; margin-bottom: 16px; background: #eaf1ff; color: #244a93; border-radius: 11px; font-weight: 700; }
.alert.error { background: #fef3f2; color: var(--danger); }
.configured, .not-configured { margin-left: 5px; padding: 2px 7px; border-radius: 999px; font-size: 11px; }
.configured { background: #e7f6ed; color: var(--success); }
.not-configured { background: #fff1f0; color: var(--danger); }
.callback-box { padding: 12px; overflow-wrap: anywhere; background: #f6f8fb; border-radius: 10px; }
.callback-box code { white-space: normal; }
.admin-login { margin-top: 40px; }
.carousel-admin-previews { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; margin-bottom: 16px; }
.carousel-admin-previews figure { min-width: 0; margin: 0; }
.carousel-admin-previews figcaption { margin-bottom: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.carousel-admin-previews img, .image-missing { width: 100%; aspect-ratio: 8 / 3; object-fit: cover; background: #eef2f7; border-radius: 10px; }
.carousel-admin-previews figure:nth-child(2) img, .carousel-admin-previews figure:nth-child(2) .image-missing { aspect-ratio: 5 / 6; }
.image-missing { display: grid; place-items: center; color: var(--muted); font-size: 12px; }
.carousel-admin-actions { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 14px; margin-top: 14px; border-top: 1px solid var(--line); }
.carousel-admin-actions form { margin: 0; }
.danger-action { color: var(--danger); }
.carousel-admin-card.is-deleted { opacity: .78; }

.site-header nav .invite-nav-link {
  background: linear-gradient(135deg, #fff4d9, #ffedb8);
  color: #8a4b00;
  border: 1px solid #f2cf77;
  font-weight: 850;
}
.invited-visitor-notice { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px 16px; margin: -18px 0 22px; background: #eaf8ef; color: #17643b; border: 1px solid #bce2ca; border-radius: 14px; text-align: center; }
.invited-visitor-notice span { font-size: 13px; }
.referral-highlight {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 22px;
  align-items: center;
  padding: clamp(24px, 4vw, 38px);
  margin-bottom: 34px;
  overflow: hidden;
  background: linear-gradient(135deg, #fff8e8 0%, #fff 58%, #f3efff 100%);
  border: 2px solid #efc45d;
  box-shadow: 0 18px 42px rgba(154, 95, 0, .1);
}
.referral-gift { display: grid; flex: 0 0 auto; place-items: center; width: 72px; height: 72px; background: linear-gradient(135deg, #f59e0b, #7c3aed); color: #fff; border-radius: 22px; box-shadow: 0 12px 25px rgba(124,58,237,.2); font-size: 27px; font-weight: 950; transform: rotate(-4deg); }
.referral-gift.large { width: 88px; height: 88px; border-radius: 27px; font-size: 34px; }
.referral-highlight-copy h2 { margin: 5px 0 7px; font-size: clamp(24px, 3vw, 36px); line-height: 1.15; letter-spacing: -.035em; }
.referral-highlight-copy > p { max-width: 720px; margin: 0; color: #5c6474; }
.referral-highlight-copy > small { display: block; margin-top: 12px; color: #8a5a04; font-weight: 700; }
.referral-steps { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px; }
.referral-steps span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; background: rgba(255,255,255,.82); border: 1px solid #ecd79d; border-radius: 999px; color: #60451b; font-size: 12px; font-weight: 750; }
.referral-steps b { display: grid; place-items: center; width: 20px; height: 20px; background: #f59e0b; color: #fff; border-radius: 50%; font-size: 11px; }
.referral-highlight-actions { display: grid; gap: 9px; min-width: 178px; }
.referral-highlight-actions .primary, .referral-highlight-actions .secondary { width: 100%; }

.product-coupon-banner { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 16px 18px; margin: 0 0 18px; background: linear-gradient(135deg, #fff8e8, #f7f2ff); border: 1px solid #e9c76f; border-radius: 15px; }
.product-coupon-icon { display: grid; place-items: center; width: 45px; height: 45px; background: #f59e0b; color: #fff; border-radius: 13px; font-weight: 900; }
.product-coupon-banner p { margin: 3px 0 0; color: #70501d; font-size: 13px; line-height: 1.55; }

.coupon-choice-panel { background: #fffdf6; border-color: #ecd79d; }
.coupon-choice-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.coupon-choice-heading h2, .coupon-choice-heading strong { margin: 0; font-size: 15px; }
.coupon-choice-badge { display: inline-flex; padding: 3px 9px; background: #f59e0b; color: #fff; border-radius: 999px; font-size: 11px; font-weight: 850; }
.coupon-count { flex: 0 0 auto; padding: 5px 9px; background: #fff; color: #8a5a04; border: 1px solid #efd38a; border-radius: 999px; font-size: 12px; font-weight: 800; }
.coupon-options { display: grid; gap: 9px; }
.coupon-option { display: flex; grid-template-columns: none; align-items: center; gap: 11px; min-height: 68px; padding: 12px 14px; background: #fff; border: 1px solid #e9d8a9; border-radius: 13px; cursor: pointer; }
.coupon-option:has(input:checked) { border-color: #e29b0b; box-shadow: 0 0 0 3px rgba(245,158,11,.14); }
.coupon-option input { flex: 0 0 auto; width: 20px; min-height: 20px; accent-color: #d88900; }
.coupon-option span { display: grid; flex: 1; gap: 2px; min-width: 0; }
.coupon-option strong { color: #553709; font-size: 16px; }
.coupon-option small { overflow-wrap: anywhere; color: #8a7044; font-size: 12px; }
.coupon-option > b { flex: 0 0 auto; color: #b75d00; font-size: 16px; }
.coupon-option.no-coupon { background: #fafafa; border-color: #e2e2e2; }
.coupon-option.no-coupon strong { color: #535862; }
.coupon-choice-note, .coupon-choice-empty > p { margin: 12px 0 0; color: #795817; font-size: 12px; }
.coupon-choice-empty .secondary { margin-top: 14px; }
.checkout-price-summary { display: grid; gap: 0; padding: 18px; background: #f8fafc; border: 1px solid var(--line); border-radius: 15px; }
.checkout-price-summary h2 { margin: 0 0 9px; font-size: 18px; }
.checkout-price-summary > div { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 0; color: #5f6979; }
.checkout-price-summary > div[hidden] { display: none; }
.checkout-price-summary > div strong { color: var(--text); }
.checkout-price-summary [data-coupon-summary] strong { color: #b54708; }
.checkout-price-summary [data-protection-summary] strong { color: #5542db; }
.checkout-price-summary .checkout-price-total { padding-top: 13px; margin-top: 5px; border-top: 1px solid var(--line); }
.checkout-price-total span { color: var(--text); font-weight: 800; }
.checkout-price-total strong { color: #ef6c00 !important; font-size: 25px; }

.page.referral-page { width: min(920px, calc(100% - 28px)); }
.share-card { display: grid; gap: 24px; }
.share-hero { display: flex; gap: 20px; align-items: center; }
.share-hero h1 { margin: 6px 0 9px; font-size: clamp(31px, 5vw, 50px); line-height: 1.08; letter-spacing: -.045em; }
.share-hero p { margin: 0; color: var(--muted); }
.referral-rule-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.referral-rule-grid article { display: grid; align-content: start; gap: 4px; min-width: 0; padding: 16px; background: #f8fafc; border: 1px solid var(--line); border-radius: 14px; }
.referral-rule-grid b { display: grid; place-items: center; width: 29px; height: 29px; margin-bottom: 5px; background: #f59e0b; color: #fff; border-radius: 50%; }
.referral-rule-grid strong { font-size: 14px; }
.referral-rule-grid span { color: var(--muted); font-size: 12px; }
.referral-rules { padding: 17px 18px; background: #fff9e9; border: 1px solid #edd28a; border-radius: 14px; }
.referral-rules ul { margin: 8px 0 0; padding-left: 20px; color: #70531d; font-size: 13px; }
.share-result { padding: 26px; text-align: left; }
.share-result h2 { margin: 6px 0; }
.share-result-actions { display: flex; gap: 10px; margin-top: 13px; }
.referral-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 20px; }
.referral-summary-grid article { padding: 14px; background: #f7f8fc; border: 1px solid var(--line); border-radius: 13px; text-align: center; }
.referral-summary-grid strong { display: block; color: #5b35d5; font-size: 24px; }
.referral-summary-grid span { color: var(--muted); font-size: 12px; }
.referral-admin-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 639px) {
  html, body { overflow-x: hidden; }
  .page, .page.narrow, .page.pricing-page, .page.referral-page, .content-page, .article-page { width: calc(100% - 20px); padding-top: 18px; padding-bottom: 88px; }
  .home-conversion-hero h1 { font-size: 32px; letter-spacing: -.04em; }
  .home-conversion-hero > strong { font-size: 18px; }
  .product-heading { display: grid; gap: 10px; }
  .product-heading .price { font-size: 28px; }
  .product-service-proof { gap: 6px; }
  .product-service-proof span { min-height: 28px; padding: 3px 8px; }
  .steps.purchase-flow-steps { gap: 3px; }
  .steps.purchase-flow-steps li { padding-top: 7px; font-size: 11px; line-height: 1.25; }
  .authorization-guide { margin: 0; padding: 16px 12px; }
  .authorization-main-step .authorization-redacted-preview { margin-left: 0; }
  .authorization-primary-link { min-width: 0; width: 100%; }
  .authorization-quick-path { width: 100%; }
  .checkout-option { align-items: flex-start; gap: 8px; }
  .checkout-option > b { display: none; }
  .checkout-option-card { padding: 12px; }
  .checkout-option small { overflow-wrap: anywhere; }
  .confirmation-list div { flex-direction: column; align-items: flex-start; gap: 4px; }
  .confirmation-list dd { text-align: left; }
  .purchase-form:not([hidden]) { scroll-margin-top: 12px; }
  .guided-verification-heading { padding: 16px 14px 0; }
  .how-it-works { padding: 18px 16px; }
  .how-it-works ol { grid-template-columns: 1fr; }
  .pay-option { justify-content: flex-start; min-height: 56px; }
  .pay-option i { margin-left: auto; }
  .pay-option-grid { grid-template-columns: 1fr; }
  input, textarea, select { font-size: 16px !important; }
  textarea.session-json-input, .verification-key-input { min-height: 168px; font-size: 16px !important; }
  .content-section, .how-it-works, .home-trust-bar, .admin-panel {
    content-visibility: visible;
  }
  .site-header { position: sticky; flex-wrap: nowrap; gap: 8px; min-height: 58px; padding: 8px 10px; }
  .site-header .brand { min-height: 40px; font-size: 17px; }
  .site-header .brand span { display: none; }
  .site-header nav { flex: 1 1 auto; justify-content: flex-end; width: auto; margin: 0; padding: 0; overflow: visible; gap: 4px; }
  .site-header nav a { min-height: 36px; padding: 5px 7px; background: transparent; color: #3e4b61; font-size: 12px; }
  .site-header nav a:nth-child(n+2):nth-child(-n+6),
  .site-header nav .bookmark-nav { display: none; }
  .admin-header { padding-inline: 12px; }
  .admin-header nav { top: 60px; left: 8px; right: 8px; max-height: calc(100vh - 72px); overflow-y: auto; }
  .admin-main { width: min(100% - 16px, 620px); padding-top: 18px; }
  .admin-main h1 { font-size: 24px; }
  .admin-panel { padding: 14px; border-radius: 13px; }
  .panel-heading { flex-wrap: wrap; align-items: flex-start; }
  .panel-heading > form { margin-left: 0; }
  .page.pricing-page { width: min(100% - 20px, 520px); padding-top: 8px; padding-bottom: 40px; }
  .home-conversion-hero { justify-items: stretch; padding: 26px 4px 22px; text-align: left; }
  .home-conversion-hero .eyebrow { font-size: 11px; }
  .home-conversion-hero h1 { margin: 7px 0 5px; font-size: clamp(28px, 9vw, 38px); line-height: 1.08; }
  .home-conversion-hero > strong { font-size: 16px; line-height: 1.5; }
  .home-conversion-hero > p, .home-invite-cta { display: none; }
  .home-hero-actions { display: block; width: 100%; margin-top: 17px; }
  .home-recharge-cta { width: 100%; min-height: 50px; border-radius: 13px; font-size: 17px; }
  .home-hero-assurances { justify-content: flex-start; gap: 4px 12px; margin-top: 12px; font-size: 11px; }
  .home-hero-assurances span:nth-child(n+3) { display: none; }
  .invited-visitor-notice { display: grid; gap: 2px; margin-top: -10px; }
  .referral-highlight { grid-template-columns: 1fr; gap: 16px; padding: 22px 18px; }
  .referral-gift { width: 58px; height: 58px; border-radius: 18px; font-size: 22px; }
  .referral-highlight-copy h2 { font-size: 26px; }
  .referral-highlight-actions { grid-template-columns: 1fr 1fr; min-width: 0; }
  .product-coupon-banner { grid-template-columns: auto minmax(0, 1fr); }
  .product-coupon-banner .secondary { grid-column: 1 / -1; width: 100%; }
  .coupon-choice-panel { padding: 16px; }
  .coupon-choice-heading { display: grid; }
  .coupon-count { justify-self: start; }
  .coupon-option { align-items: flex-start; }
  .protection-choice-panel { padding: 16px; }
  .protection-choice-heading { gap: 10px; }
  .protection-coverage { grid-template-columns: 1fr; }
  .share-hero { display: grid; }
  .referral-gift.large { width: 68px; height: 68px; }
  .referral-rule-grid, .referral-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .share-result-actions { display: grid; }
  .referral-admin-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-service-proof { font-size: 12px; }
  .pricing-page > .referral-highlight,
  .pricing-page > .home-trust-bar,
  .pricing-page > .home-reviews,
  .pricing-page > .plan-disclaimer,
  .pricing-page > .how-it-works,
  .pricing-page > .codex-promo,
  .pricing-page > .tutorial-promo,
  .pricing-page > .enterprise-promo,
  .pricing-page > .home-blog { display: none; }
  .home-reviews { padding: 20px 17px; border-radius: 18px; }
  .home-reviews .section-heading h2 { font-size: 24px; }
  .review-summary { justify-content: flex-start; gap: 7px 10px; padding-bottom: 20px; }
  .review-summary-stars { font-size: 18px; }
  .review-summary strong { font-size: 20px; }
  .review-summary span { padding-right: 10px; }
  .review-showcase-card { padding: 20px 17px; border-radius: 18px; }
  .review-showcase-quote { min-height: 0; font-size: 16px; }
  .review-showcase-card footer small { display: none; }
  .pricing-hero { padding: 15px 0 14px; text-align: left; border-top: 1px solid var(--line); }
  .pricing-hero .eyebrow { display: none; }
  .pricing-hero h2 { margin: 0; font-size: 22px; letter-spacing: -.03em; }
  .pricing-hero > p, .pricing-hero .billing-pill, .pricing-hero .plan-guide-hero { display: none; }
  .home-carousel { margin-inline: -2px; border-radius: 18px; box-shadow: 0 11px 28px rgba(15, 23, 42, .12); }
  .carousel-slide img { aspect-ratio: 5 / 6; }
  .carousel-copy { padding: 70px 18px 22px; }
  .carousel-copy h2 { font-size: clamp(24px, 8vw, 34px); }
  .carousel-copy p { margin-top: 7px; font-size: 14px; }
  .carousel-control { top: 42%; width: 44px; min-height: 44px; opacity: .9; }
  .carousel-control.previous { left: 8px; }
  .carousel-control.next { right: 8px; }
  .carousel-dots { right: 14px; bottom: 12px; }
  .lookup-order-card dl { grid-template-columns: 1fr; }
  .carousel-admin-previews { grid-template-columns: 1fr; }
  .plan-grid { gap: 10px; }
  .official-plan-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px 12px; padding: 17px 16px 15px; border-radius: 16px; }
  .official-plan-card:hover { transform: none; }
  .plan-card-heading { min-height: 0; }
  .plan-family, .plan-tagline, .plan-entitlements, .plan-compare-link { display: none; }
  .plan-card h2 { margin: 2px 0 0; font-size: 24px; }
  .plan-badge { margin-bottom: 3px; padding: 3px 7px; font-size: 10px; }
  .plan-price { align-self: center; margin: 0; font-size: 28px; }
  .plan-fit { grid-column: 1 / -1; min-height: 0; padding: 8px 10px; margin: 0; }
  .plan-fit span { display: none; }
  .plan-fit p { margin: 0; font-size: 12px; line-height: 1.45; }
  .plan-action { grid-column: 1 / -1; min-height: 46px; }
  .official-plan-card .stock { grid-column: 1 / -1; padding-top: 8px; margin: 0; font-size: 11px; }
  .plan-guide-dialog { width: calc(100% - 16px); max-height: calc(100vh - 16px); border-radius: 18px; }
  .plan-guide-header { padding: 20px 18px 16px; }
  .plan-guide-table-wrap { padding: 16px 18px 0; }
  .plan-guide-warning { margin: 18px 18px 0; }
  .plan-guide-actions { display: grid; padding: 18px; }
  .plan-disclaimer { display: grid; gap: 5px; }
  .checkout-plan-benefits .plan-benefits { grid-template-columns: 1fr; }
  .product-page { padding-top: 12px; padding-bottom: 36px; }
  .product-page .back-link { min-height: 38px; padding: 5px 0; }
  .purchase-card-compact { padding: 16px 14px; border-radius: 16px; }
  .purchase-card-compact > .step-kicker { font-size: 11px; }
  .product-heading { grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 8px; }
  .product-heading h1 { font-size: 25px; }
  .product-heading p { display: -webkit-box; margin-top: 5px; overflow: hidden; font-size: 12px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .product-heading .price { font-size: 25px; }
  .product-service-proof span:nth-child(n+3) { display: none; }
  .steps.purchase-flow-steps, .purchase-checkout-grid > .compact-plan-card { display: none; }
  .purchase-checkout-grid { margin-top: 16px; }
  .login-step-card { padding: 15px; border-radius: 13px; }
  .accepted-payments { padding: 10px; margin-top: 12px; }
  .login-step-actions { margin-top: 12px; }
  .authorization-quick-path, .authorization-redacted-preview, .authorization-next-hint { display: none; }
  .steps.purchase-flow-steps li { font-size: 10px; line-height: 1.35; }
  .guided-verification-heading { padding: 20px 18px 0; }
  .authorization-guide { padding: 21px 13px; margin: 0 8px; border-radius: 18px; }
  .authorization-quick-path { gap: 6px 8px; padding: 10px 11px; font-size: 13px; }
  .authorization-next-hint { font-size: 12px; }
  .authorization-guide-heading h3 { font-size: 20px; }
  .authorization-guide li { grid-template-columns: 32px minmax(0, 1fr); gap: 10px; }
  .authorization-step-number { width: 32px; height: 32px; }
  .authorization-guide li strong { font-size: 15px; }
  .authorization-guide li p { font-size: 13px; }
  .authorization-link-row { gap: 5px; font-size: 15px; }
  .authorization-primary-link { width: min-content; min-width: 168px; font-size: 16px; line-height: 1.45; }
  .authorization-link-actions { margin-left: 0; }
  .authorization-link-actions a, .authorization-link-actions button { width: 31px; height: 31px; }
  .authorization-main-step .authorization-redacted-preview { margin-left: -42px; }
  .authorization-paste-section { padding: 0 10px 20px; }
  .authorization-paste-section h3 { font-size: 21px; }
  .redacted-browser-bar { min-height: 40px; padding: 8px 10px; }
  .redacted-screen { min-height: 0; padding: 12px; gap: 10px; }
  .redacted-safe-response { min-height: 180px; padding: 14px 12px; gap: 7px; font-size: 10px; }
  .redacted-token-line { padding: 7px 6px; }
  .redacted-security-note { display: grid; gap: 3px; font-size: 9px; }
  .authorization-redacted-preview > p { padding: 10px; font-size: 11px; }
  .session-json-preview { max-height: 190px; font-size: 7px; }
  .authorization-copy-notes { gap: 3px 14px; font-size: 10px; }
  .authorization-figure-caption { font-size: 11px; }
  .session-json-example { font-size: 11px; padding: 12px 14px; }
  textarea.session-json-input { min-height: 150px; }
  body.session-preview-expanded .session-preview { inset: 2vh 3vw; }
  .redacted-lines { min-height: 100px; padding: 11px; gap: 6px; }
  .redacted-lines b { height: 6px; }
  .redacted-callout span { font-size: 12px; }
  .section-heading { display: grid; align-items: start; }
  .blog-card > a { min-height: 0; }
  .article-shell { padding: 23px 19px; border-radius: 18px; }
  .article-body { font-size: 16px; }
  .article-body h2 { font-size: 25px; }
  .tutorial-placeholder { min-height: 220px; }
  .customer-tools { display: none; }
  .site-footer { gap: 14px; padding: 24px 14px max(24px, env(safe-area-inset-bottom)); }
  .site-footer > div p { font-size: 11px; }
  .site-footer nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 14px; }
  .site-footer nav a:nth-child(-n+8) { display: none; }
  .site-footer small { padding-top: 12px; line-height: 1.55; }
  .receipt-shell { width: min(100% - 16px, 560px); padding-top: 8px; }
  .receipt-toolbar { border-radius: 14px; }
  .receipt-toolbar-actions { display: grid; }
  .receipt-document { min-height: 900px; padding: 26px 20px; border-radius: 12px; }
  .receipt-title { display: grid; }
  .receipt-title > strong { text-align: left; }
  .receipt-reference dl { display: grid; }
  .receipt-reference dl div { display: grid; grid-template-columns: 100px minmax(0, 1fr); }
  .receipt-reference dd { overflow-wrap: anywhere; }
  .receipt-parties { grid-template-columns: 1fr; min-height: 0; }
  .receipt-customer { justify-items: start; text-align: left; }
  .receipt-document > h2 { margin: 28px 0; }
  .receipt-document > footer { display: grid; margin-top: 40px; }
}

@media (min-width: 640px) {
  .site-header { padding-inline: 28px; }
  .site-header { flex-wrap: wrap; }
  .site-header nav { flex: 1 0 100%; width: 100%; min-width: 0; justify-content: flex-start; gap: 12px; }
  .site-header nav a, .site-header nav .bookmark-nav { min-height: 40px; padding-inline: 6px; background: transparent; }
  .page { padding-top: 52px; }
  .plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .how-it-works ol { grid-template-columns: repeat(5, 1fr); }
  .purchase-card, .status-card, .admin-login { padding: 34px; }
  .steps li, .timeline li { font-size: 13px; }
  .login-step-actions { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
  .checkout-fields-inline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-stats { grid-template-columns: repeat(5, 1fr); }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lookup-query-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .review-grid, .blog-grid, .review-showcase-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tutorial-promo, .enterprise-promo { grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr); }
  .enterprise-promo { grid-template-columns: minmax(0, 1fr) auto; }
  .business-feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .site-footer { grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr); }
  .site-footer .site-compliance, .site-footer small { grid-column: 1 / -1; }
  .contact-card { grid-template-columns: minmax(0, 1fr) minmax(280px, .7fr); }
  .contact-hours > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .support-admin-grid { grid-template-columns: minmax(0, 1fr) minmax(240px, .5fr); align-items: start; }
  .receipt-toolbar { grid-template-columns: minmax(0, 1fr) minmax(260px, .8fr) minmax(270px, auto); align-items: end; }
  .receipt-ready-card { grid-template-columns: minmax(0, 1fr) auto; }
  .receipt-example-banner { grid-template-columns: minmax(0, 1fr) auto; }
}

@media (min-width: 920px) {
  .admin-body { min-height: 100vh; }
  .admin-header {
    position: fixed;
    inset: 0 auto 0 0;
    width: 232px;
    min-height: 100vh;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: column;
    gap: 18px;
    padding: 22px 14px;
    overflow-y: auto;
    background: #fff;
    border-right: 1px solid var(--line);
    border-bottom: 0;
  }
  .admin-header .brand { padding: 0 9px 12px; border-bottom: 1px solid var(--line); }
  .admin-header .nav-toggle { display: none; }
  .admin-header nav { position: static; display: grid; flex: 0 0 auto; gap: 3px; padding: 0; background: transparent; border: 0; box-shadow: none; }
  .admin-header nav a, .admin-header nav button { width: 100%; min-height: 40px; padding-inline: 12px; border-radius: 9px; }
  .admin-header nav a:hover, .admin-header nav button:hover { background: #eef4ff; color: var(--brand); }
  .admin-header nav form { width: 100%; padding-top: 8px; margin-top: 8px; border-top: 1px solid var(--line); }
  .admin-main { width: auto; max-width: none; margin: 0 0 0 232px; padding: 32px clamp(24px, 3vw, 48px) 72px; }
  .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .purchase-checkout-grid { grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: start; }
  .purchase-checkout-grid.verification-active { grid-template-columns: 1fr; }
  .purchase-checkout-grid.verification-active > .compact-plan-card { display: none; }
  .review-grid, .review-showcase-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .blog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .home-trust-bar { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (min-width: 1360px) {
  .admin-main .form-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 919px) {
  .home-trust-bar article:last-child { grid-column: 1 / -1; }
}

@media (min-width: 1180px) {
  .site-header { flex-wrap: nowrap; padding-inline: max(28px, calc((100% - 1440px) / 2)); }
  .site-header nav { flex: 1 1 auto; width: auto; justify-content: flex-end; }
  .plan-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

@supports (content-visibility: auto) {
  @media (min-width: 920px) {
    .content-section,
    .how-it-works,
    .home-trust-bar,
    .admin-panel {
      content-visibility: auto;
      contain-intrinsic-size: auto 360px;
    }
  }
}

@media print {
  @page { size: A4; margin: 12mm; }
  html, body.receipt-body { min-width: 0; background: #fff; }
  .no-print { display: none !important; }
  .receipt-shell { width: 100%; margin: 0; padding: 0; }
  .receipt-document { min-height: 0; padding: 8mm; overflow: visible; border-radius: 0; box-shadow: none; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .receipt-title h1 { font-size: 30pt; }
  .receipt-document > h2 { margin-block: 14mm; font-size: 20pt; }
  .receipt-parties { min-height: 34mm; }
  .receipt-table-wrap { overflow: visible; }
  .receipt-table { min-width: 0; }
  .receipt-document > footer { margin-top: 18mm; }
}