/* Brand-specific checkout surface. Payment behavior remains in checkout.js. */
:where(.checkout-shell, .checkout-page)[data-checkout-brand] {
  --checkout-canvas: #f6f8fc;
  --checkout-card: #fff;
  --checkout-line: #d8e1ef;
  --checkout-text: #172033;
  --checkout-soft: #536278;
  --checkout-accent: #315bd8;
  --checkout-accent-strong: #274caf;
  min-height: 100vh;
  background: var(--checkout-canvas) !important;
  color: var(--checkout-text);
}

/* Product sites retain a distinct character rather than inheriting the generic wiki blue. */
.checkout-shell[data-checkout-brand^="happ"], .checkout-page[data-checkout-brand^="happ"] { --checkout-canvas:#f3f7ff; --checkout-card:#fff; --checkout-line:#cfdbef; --checkout-text:#172642; --checkout-soft:#58708e; --checkout-accent:#2e65d7; --checkout-accent-strong:#214ea9; }
.checkout-shell[data-checkout-brand^="incy"], .checkout-page[data-checkout-brand^="incy"] { --checkout-canvas:#071612; --checkout-card:#0d2019; --checkout-line:#24473a; --checkout-text:#ecfff5; --checkout-soft:#a8c0b5; --checkout-accent:#5ce0a8; --checkout-accent-strong:#26ae78; }
.checkout-shell[data-checkout-brand^="karing"], .checkout-page[data-checkout-brand^="karing"] { --checkout-canvas:#f4f7f8; --checkout-card:#fff; --checkout-line:#cddcdf; --checkout-text:#1d3437; --checkout-soft:#60777a; --checkout-accent:#158a81; --checkout-accent-strong:#0e6e68; }
.checkout-shell[data-checkout-brand="nasa"], .checkout-page[data-checkout-brand="nasa"] { --checkout-canvas:#071211; --checkout-card:#0d1d1b; --checkout-line:#2b4943; --checkout-text:#f2fffb; --checkout-soft:#acc5bd; --checkout-accent:#17bd91; --checkout-accent-strong:#0c926d; }
.checkout-shell[data-checkout-brand^="nekobox"], .checkout-page[data-checkout-brand^="nekobox"] { --checkout-canvas:#fff7f3; --checkout-card:#fffdfa; --checkout-line:#ecd4c8; --checkout-text:#482d35; --checkout-soft:#806771; --checkout-accent:#d45b74; --checkout-accent-strong:#b54160; }
.checkout-shell[data-checkout-brand="nekoray"], .checkout-page[data-checkout-brand="nekoray"] { --checkout-canvas:#f3fbfa; --checkout-card:#fff; --checkout-line:#c6e4df; --checkout-text:#173a38; --checkout-soft:#5f7e7b; --checkout-accent:#0f9386; --checkout-accent-strong:#08766c; }
.checkout-shell[data-checkout-brand^="streisand"], .checkout-page[data-checkout-brand^="streisand"] { --checkout-canvas:#fff8f3; --checkout-card:#fffdfb; --checkout-line:#ebd5c6; --checkout-text:#442c28; --checkout-soft:#7d665e; --checkout-accent:#d56748; --checkout-accent-strong:#ae472f; }
.checkout-shell[data-checkout-brand^="v2raytun"], .checkout-page[data-checkout-brand^="v2raytun"] { --checkout-canvas:#eff7ff; --checkout-card:#fff; --checkout-line:#c9dceb; --checkout-text:#17304c; --checkout-soft:#5e7590; --checkout-accent:#1475cf; --checkout-accent-strong:#0b59a1; }
.checkout-shell[data-checkout-brand="clash"], .checkout-page[data-checkout-brand="clash"] { --checkout-canvas:#f3f7ff; --checkout-card:#fff; --checkout-line:#d0dcf1; --checkout-text:#1a3158; --checkout-soft:#61738e; --checkout-accent:#2c6ed5; --checkout-accent-strong:#1f52ac; }
.checkout-shell[data-checkout-brand^="hiddify"], .checkout-page[data-checkout-brand^="hiddify"] { --checkout-canvas:#f2f8ff; --checkout-card:#fff; --checkout-line:#cbddef; --checkout-text:#18345a; --checkout-soft:#607899; --checkout-accent:#2874d3; --checkout-accent-strong:#185aa8; }
.checkout-shell[data-checkout-brand="hysteria"], .checkout-page[data-checkout-brand="hysteria"] { --checkout-canvas:#f1fbf9; --checkout-card:#fff; --checkout-line:#c9e7e0; --checkout-text:#1a3e3a; --checkout-soft:#62817d; --checkout-accent:#129c89; --checkout-accent-strong:#087866; }
.checkout-shell[data-checkout-brand="reality"], .checkout-page[data-checkout-brand="reality"] { --checkout-canvas:#f4f7fa; --checkout-card:#fff; --checkout-line:#d3dce7; --checkout-text:#26364a; --checkout-soft:#68788b; --checkout-accent:#4963b7; --checkout-accent-strong:#374b90; }
.checkout-shell[data-checkout-brand="shadowsocks"], .checkout-page[data-checkout-brand="shadowsocks"] { --checkout-canvas:#fff9f0; --checkout-card:#fffefa; --checkout-line:#ead8bb; --checkout-text:#493b24; --checkout-soft:#7d705c; --checkout-accent:#c78020; --checkout-accent-strong:#9e6114; }
.checkout-shell[data-checkout-brand="singbox"], .checkout-page[data-checkout-brand="singbox"] { --checkout-canvas:#f1fbfb; --checkout-card:#fff; --checkout-line:#c8e7e8; --checkout-text:#183a42; --checkout-soft:#627e84; --checkout-accent:#138f9c; --checkout-accent-strong:#0a707a; }
.checkout-shell[data-checkout-brand="tuic"], .checkout-page[data-checkout-brand="tuic"] { --checkout-canvas:#f6f6ff; --checkout-card:#fff; --checkout-line:#d8d9ef; --checkout-text:#30335f; --checkout-soft:#72749a; --checkout-accent:#606ac5; --checkout-accent-strong:#4952a2; }
.checkout-shell[data-checkout-brand="v2box"], .checkout-page[data-checkout-brand="v2box"] { --checkout-canvas:#fff8f1; --checkout-card:#fff; --checkout-line:#edd8c4; --checkout-text:#4b3423; --checkout-soft:#826956; --checkout-accent:#c97331; --checkout-accent-strong:#a35720; }
.checkout-shell[data-checkout-brand="v2rayn"], .checkout-page[data-checkout-brand="v2rayn"] { --checkout-canvas:#f4f9ff; --checkout-card:#fff; --checkout-line:#d1e0f1; --checkout-text:#1d3752; --checkout-soft:#637b94; --checkout-accent:#3479bb; --checkout-accent-strong:#275f94; }
.checkout-shell[data-checkout-brand="v2rayng"], .checkout-page[data-checkout-brand="v2rayng"] { --checkout-canvas:#f4fbf6; --checkout-card:#fff; --checkout-line:#cbe5d2; --checkout-text:#203d2a; --checkout-soft:#678071; --checkout-accent:#2e9d59; --checkout-accent-strong:#217b43; }
.checkout-shell[data-checkout-brand="vless"], .checkout-page[data-checkout-brand="vless"] { --checkout-canvas:#f0fbfa; --checkout-card:#fff; --checkout-line:#c9e9e4; --checkout-text:#173d3b; --checkout-soft:#5f807d; --checkout-accent:#0e9c8d; --checkout-accent-strong:#08766c; }
.checkout-shell[data-checkout-brand="vpn-wiki"], .checkout-page[data-checkout-brand="vpn-wiki"] { --checkout-canvas:#f5f8fc; --checkout-card:#fff; --checkout-line:#d3deea; --checkout-text:#1c3048; --checkout-soft:#64778e; --checkout-accent:#336ec7; --checkout-accent-strong:#2457a2; }
.checkout-shell[data-checkout-brand="vps"], .checkout-page[data-checkout-brand="vps"] { --checkout-canvas:#f5f8fb; --checkout-card:#fff; --checkout-line:#d6dfe9; --checkout-text:#253342; --checkout-soft:#6b7888; --checkout-accent:#4a6a8d; --checkout-accent-strong:#38536f; }
.checkout-shell[data-checkout-brand="wireguard"], .checkout-page[data-checkout-brand="wireguard"] { --checkout-canvas:#fff7f7; --checkout-card:#fff; --checkout-line:#efd1d1; --checkout-text:#4b2528; --checkout-soft:#84666b; --checkout-accent:#cc4d55; --checkout-accent-strong:#a8363e; }
.checkout-shell[data-checkout-brand="xray"], .checkout-page[data-checkout-brand="xray"] { --checkout-canvas:#fff7f5; --checkout-card:#fff; --checkout-line:#edd5ce; --checkout-text:#4a2b28; --checkout-soft:#816763; --checkout-accent:#c55846; --checkout-accent-strong:#9d3e30; }

:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-header,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .site-header--checkout { border-color: var(--checkout-line); }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .brand__mark,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .brand-mark { background: var(--checkout-accent) !important; color: #fff !important; box-shadow: none !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-panel,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-summary,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-summary-card { border-color: var(--checkout-line) !important; background: var(--checkout-card) !important; box-shadow: 0 18px 46px color-mix(in srgb, var(--checkout-text) 10%, transparent) !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-status,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-return,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .payment-consent,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-consent { border-color: var(--checkout-line); color: var(--checkout-soft); }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .tariff-card,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .period-card,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .payment-method-card,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-field input { border-color: var(--checkout-line) !important; background: var(--checkout-card) !important; color: var(--checkout-text) !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .tariff-card:has(input:checked),
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .period-card:has(input:checked),
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .payment-method-card:has(input:checked) { border-color: var(--checkout-accent) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--checkout-accent) 15%, transparent) !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-submit:not(:disabled),
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .button--gold:not(:disabled),
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .primary-btn:not(:disabled) { background: var(--checkout-accent) !important; border-color: var(--checkout-accent) !important; color: #fff !important; box-shadow: none !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-submit:not(:disabled):hover,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .button--gold:not(:disabled):hover,
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .primary-btn:not(:disabled):hover { background: var(--checkout-accent-strong) !important; border-color: var(--checkout-accent-strong) !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-field input:focus { outline: 3px solid color-mix(in srgb, var(--checkout-accent) 24%, transparent); border-color: var(--checkout-accent) !important; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] h1 { max-inline-size: min(100%, 16ch); font-size: clamp(2rem, 4.6vw, 4.2rem) !important; line-height: 1.04 !important; letter-spacing: 0 !important; overflow-wrap: anywhere; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-main { padding-bottom: 88px; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-form { gap: 22px; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-legal-consents { display: grid; gap: 12px; padding-top: 2px; }
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-submit-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  min-width: 0;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-submit-row .checkout-submit {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary {
  margin: 4px 0 0;
  padding: 20px;
  border: 1px solid var(--checkout-line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--checkout-card) 94%, var(--checkout-accent) 6%);
  color: var(--checkout-text);
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary h2 {
  margin: 0 0 16px;
  font-size: 1.2rem;
  line-height: 1.25;
  letter-spacing: 0;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary dl {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary dl > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary dt {
  color: var(--checkout-soft);
  font-size: .82rem;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary dd {
  margin: 0;
  font-weight: 750;
  overflow-wrap: anywhere;
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary__total {
  grid-column: 1 / -1;
  grid-template-columns: 1fr auto !important;
  align-items: baseline;
  padding-top: 14px;
  border-top: 1px solid var(--checkout-line);
}
:where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary__total dd {
  color: var(--checkout-accent);
  font-size: 1.35rem;
}
@media (max-width: 760px) {
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-header,
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .site-header--checkout { min-height: 62px; }
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-main { width: min(100% - 24px, 1180px); padding-top: 26px; padding-bottom: 56px; }
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] h1 { font-size: clamp(2rem, 10vw, 3.1rem) !important; }
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-panel,
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-summary,
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .checkout-summary-card { border-radius: 12px !important; }
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary dl { grid-template-columns: minmax(0, 1fr); }
  :where(.checkout-shell, .checkout-page)[data-checkout-brand] .funnel-order-summary__total { grid-column: 1; }
}