/* pd.cash public-page layer. Loaded after pd-responsive-fixes on all 25 public pages.
   2026-10-10 consolidation: sections 1-23 from 10-08..10-10 merged into one ordered file.
   Rules: one section rhythm, left-aligned section heads (closing call-to-action card stays centred),
   dark surfaces only, no decoration for its own sake. Page-specific fixes are at the end. */

/* ---------- 1. Global ---------- */

/* Page-to-page crossfade (same-origin navigations, Chromium/Safari 18+) */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; }
}

/* No decoration for its own sake: glow layer, cursor aura, glowing scroll bar, blur blobs,
   shimmer word, green glows, orbit rings, floating/breathing animations, sheen, tilt, spotlights */
:has(> #aura), #prog { display: none !important; }
.absolute.rounded-full[class*=" blur-"] { display: none !important; }
.shine { background: none !important; -webkit-text-fill-color: currentColor; color: inherit !important; }
.shadow-green-sm, .shadow-green-md, .shadow-green-lg { --tw-shadow: 0 0 #0000 !important; }
.btn-green, .btn-green:hover, .orbit-dot, .pp-final, [class*="shadow-[0_0_12px"] { box-shadow: none !important; }
.pdig-glow, .orbit { display: none !important; }
.animate-float, .animate-breathe, .animate-gridpan, .animate-shimmer, .animate-spinslow, .animate-spinrev { animation: none !important; }
body .btn-green:after, body .btn-outline:before { content: none; }
body .card, body .card:hover { transform: none; box-shadow: none; }
body .card:before, body .card:after { content: none; }
body .card:not(a):not(:has(a)):hover { border-color: hsla(0,0%,100%,.08); }

/* Reveal: fade + short slide, no blur; never leaves content hidden (print, previews, stalled observer) */
@keyframes revealIn { 0% { transform: translateY(12px); } to { transform: none; } }
@keyframes pdRevealFailsafe { to { opacity: 1; transform: none; } }
body .reveal { filter: none; }
body .reveal:not(.in) { transform: translateY(12px); animation: pdRevealFailsafe .6s ease 2.5s forwards; }
@media print { body .reveal { opacity: 1 !important; transform: none !important; animation: none; } }

/* Readability and tap size: nothing under 12px, dim small text brightened, 48px pills */
body .text-\[10px\]:not(svg), body .text-\[11px\]:not(svg), body span.text-\[11\.5px\] { font-size: 12px; }
@media (min-width: 640px) { body .sm\:text-\[11px\]:not(svg) { font-size: 12px; } }
body :is(.text-\[11px\], .text-\[12px\], .text-\[13px\]):is(.text-white\/40, .text-white\/45, .text-white\/50, .text-white\/55) { color: rgba(255,255,255,.7); }
footer .pd-motion-foot, body #pdMotionSkip { min-height: 44px; }
footer .pd-motion-foot { display: inline-flex; align-items: center; }
main pre { font-size: 12.5px; }
@media (max-width: 639px) { main pre { white-space: pre-wrap; overflow-wrap: anywhere; } }
/* Phones: the base mobile text boost (0,2,4) also caught 10/11px labels and captions and blew them up to 16px.
   Captions go to 14px as the base intended; uppercase/mono labels and code keep their desktop size. */
@media (max-width: 767px) {
  :is(main, footer) :is(p, li, dd)[class]:is(.text-\[10px\], .text-\[11px\]):not(pre *):not(code *) { font-size: .875rem; line-height: 1.55; }
  :is(main, footer) :is(p, li, dd)[class]:is(.text-\[10px\], .text-\[11px\]):is(.uppercase, .font-mono):not(pre *):not(code *) { font-size: 12px; line-height: 1.5; }
  main :is(code, pre *) { font-size: inherit; }
}
body main #scStats p[class*="tracking-"] { font-size: 12px; }
main .pd-email-notice p.pd-email-notice__eyebrow:not(pre *):not(code *) { font-size: 12px; line-height: 1.5; }

/* ---------- 2. Type ---------- */

main h1.display { text-wrap: balance; }
main h2.display { line-height: 1.05; letter-spacing: -.03em; text-wrap: balance; }
main .display-2 { line-height: 1.2; }

/* One h2 scale: solution pages, the home WordPress/pricing/FAQ heads and every closing card use the homepage size */
main h2.display[class~="text-[1.9rem]"][class~="lg:text-[2.7rem]"],
main h2.display[class~="text-[2rem]"][class~="sm:text-[2.6rem]"],
main h2.display[class~="lg:text-[2.9rem]"],
main #faq h2.display { font-size: 2.1rem; }
@media (min-width: 640px) {
  main h2.display[class~="text-[1.9rem]"][class~="lg:text-[2.7rem]"],
  main h2.display[class~="text-[2rem]"][class~="sm:text-[2.6rem]"],
  main h2.display:is([class~="lg:text-[2.9rem]"], [class~="lg:text-[3.4rem]"]),
  main #faq h2.display,
  main .shadow-green-lg h2.display { font-size: 3rem; }
}
@media (min-width: 1024px) {
  main h2.display[class~="text-[1.9rem]"][class~="lg:text-[2.7rem]"],
  main h2.display[class~="text-[2rem]"][class~="sm:text-[2.6rem]"],
  main h2.display:is([class~="lg:text-[2.9rem]"], [class~="lg:text-[3.4rem]"]),
  main #faq h2.display,
  main .shadow-green-lg h2.display { font-size: 3.2rem; }
}

/* Section labels: only the hero keeps one; no numbered chips, no mono label above any other h2 */
main span.mr-3.inline-flex.h-6.rounded-full.font-mono { display: none; }
main .font-mono.uppercase:has(+ h2) { display: none !important; }
main > section:not(:first-child) :is(.reveal, .reveal-now) > span:is(.font-mono.uppercase, :has(> .font-mono.uppercase)):has(+ h2) { display: none; }
main > section:not(:first-child) :is(.reveal, .reveal-now) > span:is(.font-mono.uppercase, :has(> .font-mono.uppercase)) + h2 { margin-top: 0; }

/* ---------- 3. Layout rhythm ---------- */

/* Phones: content sections 80px top and bottom */
main > section.relative.py-16:not(.border-t):not(#verticals) { padding-top: 5rem; padding-bottom: 5rem; }
main > section#product { padding-top: 5rem; }

/* 640+: every content section 96px (was 96 on home, 112 on solution pages, 64 on plugin docs, 0 under the home dashboard).
   Legal, contact and /pricing keep their own document rhythm; the closing call-to-action keeps its top. */
@media (min-width: 640px) {
  main:not(:has(details.toc, #onboarding-form, .pp)) > section:not(:first-child) { padding-bottom: 96px; }
  main:not(:has(details.toc, #onboarding-form, .pp)) > section:not(:first-child):not(:last-child) { padding-top: 96px; }
}
main > section.relative.py-20:has(> div > .reveal.rounded-5xl.shadow-green-lg) { padding-top: 0; }

/* Section heads: left-aligned on the content edge everywhere, FAQ included.
   The closing call-to-action card (last section) stays centred. */
main > section:not(:first-child):not(:last-child) .mx-auto.text-center:is(.max-w-xl, .max-w-2xl, .max-w-3xl) { margin-left: 0; text-align: left; }
main > section:not(:first-child):not(:last-child) .mx-auto.text-center:is(.max-w-xl, .max-w-2xl, .max-w-3xl) .mx-auto { margin-left: 0; }
main > section:not(:first-child):not(:last-child) .mx-auto.text-center:is(.max-w-xl, .max-w-2xl, .max-w-3xl) .justify-center { justify-content: flex-start; }
main > section:not(:first-child):not(:last-child) .mx-auto:is(.max-w-3xl, .max-w-4xl):has(> details, > .reveal > details, .faq-q) { margin-left: 0; }
main > section:not(:first-child):not(:last-child) > div > .reveal.text-center:has(> a.pill) { text-align: left; }
main > section:not(:first-child):not(:last-child) > div > .reveal.text-center:has(> a.pill) > .mx-auto { margin-left: 0; }
main > section:not(:first-child):not(:last-child) > div > .flex.justify-center:has(> a.pill) { justify-content: flex-start; }
/* One content width: narrow centred containers (WordPress plans table, version card) join the edge */
main > section:not(:first-child):not(:last-child) > .mx-auto.max-w-5xl { max-width: 80rem; }
main > section:not(:first-child):not(:last-child) > div > p.reveal.text-center { text-align: left; }
main > section:not(:first-child):not(:last-child) > div > .card.mx-auto { margin-left: 0; }
@media (min-width: 1024px) { main .reveal.mx-auto.text-center.max-w-2xl { max-width: 48rem; } }

/* ---------- 4. Components ---------- */

/* Header on phones/tablets: the signup CTA stays visible next to the menu button instead of inside the menu */
.pd-nav-cta { display: inline-flex; align-items: center; margin-left: auto; margin-right: .6rem; min-height: 40px; padding: 0 1rem; font-size: 14px; }
@media (min-width: 1024px) { .pd-nav-cta { display: none; } }
@media (max-width: 359px) { .pd-nav-cta { padding: 0 .8rem; font-size: 13px; } }
/* NAV_SIGNIN_V1 (loop2 92, 2026-11-02): on phones 'Sign in' was only inside the menu, yet 244 of 950 phone homepage visits in 7 days
   went on to /login (most then 302 to /dashboard: returning merchants). It now sits in the bar next to 'Start free'. */
.pd-nav-in { display: inline-flex; align-items: center; margin-left: auto; min-height: 40px; padding: 0 .7rem; font-size: 14px; font-weight: 700; color: rgba(255,255,255,.85); white-space: nowrap; }
.pd-nav-in + .pd-nav-cta { margin-left: 0; }
@media (min-width: 1024px) { .pd-nav-in { display: none; } }
.pd-nav-in, .pd-nav-cta { flex: none; white-space: nowrap; }
@media (max-width: 419px) { #navShell { padding-left: .6rem; padding-right: .4rem; } .pd-nav-in { padding: 0 .45rem; font-size: 13px; } .pd-nav-cta { padding: 0 .75rem; font-size: 13px; margin-right: .4rem; } }
@media (max-width: 359px) { #navShell a[aria-label="PD CASH home"] > span + span { display: none; } }

/* Pills: one line, 48px, two-button groups stack full width on phones */
main a.pill { min-height: 48px; white-space: nowrap; }
main a.pill:not([class*="flex"]) { display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 639px) {
  main .flex:has(> a.pill + a.pill) { flex-direction: column; align-items: stretch; }
  main .flex:has(> a.pill + a.pill) > a.pill { width: 100%; justify-content: center; padding-left: 1.25rem; padding-right: 1.25rem; }
}
@media (min-width: 640px) { main .flex:has(> a.pill + a.pill) { flex-wrap: wrap; } }

/* Icon cards: compact, icon-left on phones (one-line items were ~290px tall each) */
@media (max-width: 639px) {
  main .grid > article.card.p-7 { padding: 1.25rem 1.35rem; }
  main .grid > article.card > a.mt-6 { margin-top: .9rem; }
  main .grid > article.card:has(> span.mb-6:first-child) { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 16px; align-content: start; padding: 20px; }
  main .grid > article.card > span.mb-6:first-child { grid-row: span 3; margin-bottom: 0; height: 2.25rem; width: 2.25rem; }
  main .grid > article.card:has(> span.mb-6:first-child) > :not(:first-child) { grid-column: 2; margin-top: 0; }
  main .grid > article.card:has(> span.mb-6:first-child) > :nth-child(n+3) { margin-top: .5rem; }
  main .grid > article.card:has(> span.mb-6:first-child) > a { justify-self: start; }
}

/* Features add-on grid: 11 cards in 3 columns leave a hole; last card spans it */
@media (min-width: 1024px) {
  main .grid[class~="lg:grid-cols-3"] > article.card:last-child:nth-child(3n+2) { grid-column: span 2; }
}

/* "Keep reading" cards: even excerpts */
main section.border-t article p.flex-1[class~="text-[14px]"],
main section.border-t a p.flex-1[class~="text-[14px]"] {
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
/* ...header link sits on the h2 baseline (bottom-aligned, its 44px box floated above the text) */
main section.border-t .reveal.flex.justify-between:has(> h2 + a) { align-items: baseline; }

/* Breadcrumb: 44px hit area on the 15px-tall links without moving the trail */
nav[aria-label="Breadcrumb"] a { position: relative; }
nav[aria-label="Breadcrumb"] a::after { content: ""; position: absolute; inset: -14px -6px; }

/* Step markers: 4 matches 1-3 */
main ol > li > span.z-10.bg-cash-green { border: 1px solid rgba(54,210,64,.4); background: #000; color: #36d240; box-shadow: none; }

/* Related-policies nav (legal pages) */
main .pd-related ul { display: grid; gap: 4px 32px; margin-top: 12px; }
@media (min-width: 640px) { main .pd-related ul { grid-template-columns: 1fr 1fr; } }
main .pd-related a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; text-decoration-color: rgba(255,255,255,.25); text-underline-offset: 4px; }
main .pd-related a:hover { color: #36d240; }

/* Footer: two link columns on phones instead of one ~2,500px stack */
@media (max-width: 767px) {
  footer .grid.md\:grid-cols-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.25rem; row-gap: 2.5rem; }
  footer .grid.md\:grid-cols-5 > :first-child { grid-column: 1 / -1; }
}
/* ...and the bottom row (copyright, policy links, pause) on the same left edge as the columns */
@media (max-width: 639px) {
  footer .flex-col.items-center:has(> .pd-motion-foot) { align-items: flex-start; }
  footer .flex-col.items-center:has(> .pd-motion-foot) > nav { justify-content: flex-start; }
}

/* Bottom sign-up bar stays off legal pages (it covered the policy text) */
body:has(details.toc) #mobileCta { display: none; }

/* ---------- 5. Home ---------- */

/* Hero: copy left, checkout mock right, vertically centred. The typing API panel and the floating
   webhook badge stacked a second 300px block under the phone (empty block beside the copy, panel cut
   off mid-word, blank panel on phones). The API demo lives on /cash-app-api and in "Three ways to connect". */
main > section:first-child #codePanel,
main > section:first-child .reveal-now.relative > .absolute.animate-float { display: none; }
main > section:first-child .reveal-now.relative p.sm\:text-right { text-align: center; padding-right: 0; }
@media (min-width: 1024px) {
  main > section:first-child .grid[class~="lg:grid-cols-[1.05fr_1fr]"] { align-items: center; }
}

/* Hero headline: longer value line, so one size down from the old three-word stack */
@media (min-width: 1024px) { main h1.pd-hero-h1 { font-size: 2.9rem; } }
@media (min-width: 1280px) { main h1.pd-hero-h1 { font-size: 3.35rem; } }

/* Hero method strip: what customers can pay with, split by plan, under the signup form */
.pd-hero-methods { margin-top: 1.5rem; display: grid; gap: .6rem; }
.pd-hero-methods__group { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: 0; }
.pd-hero-methods__tag { width: 6.5rem; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.5); }
.pd-hero-methods__chip { display: inline-flex; align-items: center; gap: .45rem; min-height: 34px; padding: 0 .85rem; border-radius: 9999px; border: 1px solid hsla(0,0%,100%,.12); background: hsla(0,0%,100%,.03); font-size: 13px; font-weight: 600; color: #fff; white-space: nowrap; }
.pd-hero-methods__chip .ic { font-size: 14px; color: #36d240; }
.pd-hero-methods__group:first-child .pd-hero-methods__chip { border-color: rgba(54,210,64,.45); background: rgba(54,210,64,.08); }
.pd-hero-methods__note { margin: .25rem 0 0; font-size: 13px; color: rgba(255,255,255,.55); }
@media (max-width: 639px) { .pd-hero-methods__tag { width: 100%; } }

/* Pricing band: dark surface like every other section (was a full-bleed bright green block) */
main > section#pricing { background: #0a0b0a; color: #fff; border-top: 1px solid hsla(0,0%,100%,.07); }
main > section#pricing > .pointer-events-none.absolute { display: none; }
#pricing .text-black { color: #fff; }
#pricing .bg-cash-green.text-black { color: #04180a; }
#pricing :is(.text-black\/75, .text-black\/70, .text-black\/65) { color: rgba(255,255,255,.7); }
#pricing :is(.border-black\/15, .border-black\/25) { border-color: hsla(0,0%,100%,.1); }
#pricing :is(.border-black\/80, .border-black\/40) { border-color: hsla(0,0%,100%,.25); }
#pricing .hover\:border-black:hover { border-color: hsla(0,0%,100%,.45); }
#pricing :is(.bg-black\/\[0\.04\], .bg-black\/\[\.06\], .bg-black\/\[0\.07\]) { background-color: hsla(0,0%,100%,.03); }
#pricing :is(.hover\:bg-black\/10, .hover\:bg-black\/\[\.11\]):hover { background-color: hsla(0,0%,100%,.06); }
#pricing .bg-black { border: 1px solid hsla(0,0%,100%,.1); }
#pricing a:not(.pill) { color: #36d240; }
/* ...on the site content edge, left-aligned like the sections around it (was a narrower centred column) */
main > section#pricing > .relative.mx-auto { max-width: 80rem; }
#pricing > .relative .text-center { text-align: left; }
#pricing > .relative .mx-auto { margin-left: 0; }
#pricing > .relative .justify-center { justify-content: flex-start; }
/* HOME_PLANS_GOOGLE_V1 (loop5 18): the Free card ends on the full-width Google button (left-aligned like Premium's) with the
   email + terms line under it, pinned to the card foot; the green link colour above is kept for "Or sign up with email" only. */
#pricing .pd-plan-free { display: flex; flex-direction: column; }
#pricing .pd-plan-free__cta { margin-top: auto; padding-top: 2rem; }
#pricing .pd-plan-free__cta .pd-lg { width: 100%; }
#pricing .pd-lg-note a:not(.pd-lg-mail):not(:hover) { color: inherit; }
/* Funds-availability note under it: same content edge (was a centred 56rem column), readable line length */
main > section[aria-labelledby="funds-availability-h"] > .mx-auto.max-w-4xl { max-width: 80rem; }
main > section[aria-labelledby="funds-availability-h"] > .mx-auto > p { max-width: 48rem; }

/* Signup steps: button at its own width beside the note (was stretched to half the page) */
@media (min-width: 640px) {
  #onboarding .reveal.flex:has(> a.pill) { justify-content: flex-start; gap: 1.5rem; }
  #onboarding .reveal.flex > a.pill { flex: none; width: auto; }
  #onboarding .reveal.flex > a.pill + p { flex: 0 1 34rem; text-align: left; }
}

/* Closing CTA (home + every landing page): the one green block on the page (was a dim card with a blurred blob and dot grid) */
.pd-closing { background: #36d240; color: #04180a; border-color: transparent; box-shadow: none; }
.pd-closing h2, .pd-closing .text-white { color: #04180a; }
body .pd-closing :is(.pd-closing__lede, [class*="text-white/"]) { color: rgba(4,24,10,.78); }
.pd-closing :is(.pd-closing__primary, .btn-green) { background: #04180a; color: #fff; box-shadow: none; transition: background .25s; }
.pd-closing :is(.pd-closing__primary, .btn-green):hover { background: #000; }
.pd-closing .btn-green::after { display: none; }
.pd-closing .btn-outline { border: 2px solid rgba(4,24,10,.8); color: #04180a; transition: background .25s; }
.pd-closing .btn-outline:hover { background: rgba(4,24,10,.1); }
.pd-closing .btn-outline::before { display: none; }
@media (min-width: 640px) { .pd-closing .flex > a.pill { width: auto; flex: none; } }
.pd-closing__facts { margin: 2.25rem 0 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 1.75rem; font-size: 14px; font-weight: 600; color: rgba(4,24,10,.85); }
.pd-closing__facts li::before { content: "✓"; margin-right: .45rem; font-weight: 800; }
@media (max-width: 639px) { .pd-closing__facts { flex-direction: column; align-items: flex-start; gap: .5rem; margin-left: auto; margin-right: auto; width: max-content; max-width: 100%; } }
/* LANDING_GOOGLE_V2 (loop5 07): the white "Start free with Google" hero button (LANDING_GOOGLE_V1, loop3 18) and its
   email/terms line, once here instead of the same <style> in 8 pages; now also the /pricing hero and closing card and the
   /agent-payment-links hero. The .pp selectors outweigh /pricing's `.pp a` and `body .pp a.pill` link colours. */
body a.pd-lg, body .pp a.pd-lg.pill { background: #fff; color: #0b0b0b; font-weight: 700; text-decoration: none; }
body a.pd-lg:hover, body .pp a.pd-lg.pill:hover { background: #e9ece9; color: #0b0b0b; }
.pd-lg svg { width: 19px; height: 19px; flex: none; }
.pd-lg-note { margin-top: .85rem; max-width: 34rem; color: rgba(255,255,255,.5); font-size: 12.5px; line-height: 1.55; }
.pp-final .pd-lg-note { margin-inline: auto; }
body .pd-lg-note a { color: inherit; font-weight: inherit; text-decoration: underline; text-underline-offset: 2px; }
body .pd-lg-note a:hover { color: #fff; }
body .pd-lg-note a.pd-lg-mail { color: #36d240; font-weight: 700; text-decoration: none; }
/* NOTE_FLOOR_V1 (loop5 14): the site's phone body-text floor (site css, <=767px, main :is(p,li,dd)[class]...) made this terms line
   16px under every Google button (3-4 heavy lines). Fine print stays fine print: 13px on phones. */
@media (max-width: 767px) { main p.pd-lg-note.pd-lg-note[class] { font-size: 13px; line-height: 1.55; } }
/* CLOSING_GOOGLE_V2 (loop5 05): the closing card on 12 product pages sent "Create free account" to /register, one page
   and one tap short of the Google sign-up the hero, the bottom bar and the homepage card start directly. It now starts
   Google there too, with email and the terms one line below. Dot and legal moved here from the homepage card. */
.pd-cg__dot { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9999px; background: #fff; flex: none; }
.pd-cg__dot svg { width: 18px; height: 18px; }
.pd-closing a.pd-cg__row-g { padding: 12.5px 28px 12.5px 12.5px; }
/* CLOSING_EVEN_V1 (loop5 21): the Google button is 55px (30px dot + padding); a solid dark button beside it was 50.5px */
.pd-closing .flex > a.pill { min-height: 55px; }
.pd-cg__legal { max-width: 22rem; font-size: 12px; line-height: 1.5; color: rgba(4,24,10,.7); }
:not(.pd-cg) > .pd-cg__legal { margin: 1rem auto 0; }
.pd-cg__legal a { text-decoration: underline; text-underline-offset: 2px; }
.pd-cg__legal a.pd-cg__mail { font-weight: 700; color: #04180a; }

/* ---------- 6. Other pages ---------- */

/* Fee calculator: site radii; phones get a 2-column plan picker instead of a clipped scroller */
body .pdc-section a.pdc-cta { border-radius: 9999px; }
body .pdc-plan { border-radius: 1.5rem; }
body .pdc-card, body .pdc-result { border-radius: 2rem; }
@media (max-width: 639px) {
  body .pdc-plans { display: block; overflow: visible; scroll-snap-type: none; margin: 0 0 1rem; padding: 0; }
  /* PLAN_LIST_V1 (loop3 46): the 2x2+1 card grid was ~470px tall and pushed the result below the fold; one radio list,
     a row per plan (dot, name, deposit, commission), ~280px, nothing hidden */
  body .pdc-plan { display: flex; align-items: center; gap: .75rem; border-radius: 0; margin-top: -1px; padding: .8rem 1rem; }
  body .pdc-plan:first-of-type { margin-top: 0; border-radius: 1.25rem 1.25rem 0 0; }
  body .pdc-plan:last-of-type { border-radius: 0 0 1.25rem 1.25rem; }
  body .pdc-plan:has(input:checked) { z-index: 1; }
  body .pdc-plan::before { content: ""; flex: none; width: 1.125rem; height: 1.125rem; border-radius: 50%; border: 2px solid rgba(255,255,255,.3); }
  body .pdc-plan:has(input:checked)::before { border-color: #36d240; background: #36d240; box-shadow: inset 0 0 0 3px #0a0b0a; }
  body .pdc-plan-n { flex: 1; min-width: 0; }
  body .pdc-plan-d { order: 1; margin: 0; white-space: nowrap; }
  body .pdc-plan-c { order: 2; margin: 0; min-width: 2.6em; text-align: right; font-size: 1.125rem; }
}
/* PLAN_LIST_V1: under 380px the name wrapped ("Platinum / Plan"); the deposit moves under the name there */
@media (max-width: 379.98px) {
  body .pdc-plan { display: grid; grid-template-columns: auto 1fr auto; gap: .1rem .75rem; padding-block: .7rem; }
  body .pdc-plan::before { grid-row: 1 / 3; }
  body .pdc-plan-n { grid-column: 2; }
  body .pdc-plan-d { grid-column: 2; grid-row: 2; }
  body .pdc-plan-c { grid-column: 3; grid-row: 1 / 3; }
}
/* 768-1023: all five plans on one row (auto-fit left Diamond alone on a second row) */
@media (min-width: 768px) and (max-width: 1023px) { body .pdc-plans { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* /pricing document view on the site type scale */
body .pp { padding-top: 3.5rem; }
body .pp h1 { font-size: clamp(2.1rem, 6vw, 3.4rem); font-weight: 900; letter-spacing: -.035em; line-height: 1.04; }
body .pp h2 { font-size: clamp(1.5rem, 3vw, 2rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.2; margin-top: 3.5rem; }
body .pp h2.pdc-h2 { margin-top: 1rem; }
body .pp .pp-card { border-radius: 1.5rem; background: linear-gradient(180deg, #121412, #0a0b0a); border-color: hsla(0,0%,100%,.08); }
body .pp .pp-table { border-radius: 1.5rem; }
body .pp details.pp-card > summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; min-height: 44px; }
body .pp details.pp-card > summary::-webkit-details-marker { display: none; }
body .pp details.pp-card > summary::after { content: "+"; color: #36d240; font-size: 1.4rem; font-weight: 400; line-height: 1; transition: transform .25s; }
body .pp details.pp-card[open] > summary::after { transform: rotate(45deg); }
body .pp-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
body .pp a.pill { color: inherit; text-decoration: none; }
body .pp a.pill.btn-green, body .pp a.pill.btn-green:hover { color: #04180a; }
body .pp a.pill.btn-outline, body .pp a.pill.btn-outline:hover { color: #fff; }
body .pp-final { margin-top: 4.5rem; text-align: center; border: 1px solid hsla(0,0%,100%,.1); border-radius: 2.5rem; background: #0a0b0a; padding: 3.5rem 1.5rem; }
body .pp .pp-final h2 { margin-top: 0; }
body .pp-final .pp-actions { justify-content: center; }
@media (max-width: 639px) {
  .pp-actions { flex-direction: column; }
  .pp-actions > a.pill { width: 100%; justify-content: center; }
}

/* Legal pages: hero aligned with the article column, TOC as a site label with an active state */
main:has(details.toc) > section:first-of-type { padding-top: 2rem; padding-bottom: 2.5rem; }
main:has(details.toc) > section:first-of-type > .max-w-4xl { text-align: left; }
@media (min-width: 640px) { main:has(details.toc) > section:first-of-type { padding-top: 3.5rem; padding-bottom: 4rem; } }
@media (min-width: 1024px) {
  main:has(details.toc) > section:first-of-type > .max-w-4xl { max-width: 80rem; padding-left: calc(2rem + 260px + 3.5rem); }
  aside:has(> details.toc) { top: calc(96px + var(--pd-eb, 0px)); max-height: calc(100vh - 120px - var(--pd-eb, 0px)); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .toc .toc-nav { max-height: none; overflow: visible; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .toc > summary { cursor: pointer; pointer-events: auto; min-height: 44px; }
}
.toc .toc-link { white-space: normal; overflow: visible; text-overflow: clip; border-radius: .6rem; padding-left: .75rem; box-shadow: inset 2px 0 0 transparent; transition: color .2s, box-shadow .2s, background-color .2s; }
.toc .toc-link[aria-current="true"] { color: #36d240; background: rgba(54,210,64,.06); box-shadow: inset 2px 0 0 #36d240; }
/* LEGAL_STAMP_V1 (loop5 38): the title flows straight into the document (no empty band, no seam), and the two date lines read
   as one version stamp: clock = last updated, calendar = effective. [class] outranks the responsive-fixes 15px/1rem rule. */
main:has(details.toc) > section:first-of-type[class] { padding-bottom: 0; }
main:has(details.toc) > section:first-of-type h1 { margin-top: 0; }
main:has(details.toc) > section:first-of-type + section[class] { border-top: 0; padding-top: 1.75rem; }
main:has(details.toc) article p.pd-meta[class] { position: relative; margin: 0; padding: .6rem 1rem .6rem 2.6rem; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.72); font-variant-numeric: tabular-nums; background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.09); }
main:has(details.toc) article p.pd-meta[class]:not(p.pd-meta + p.pd-meta) { border-radius: 1rem 1rem 0 0; }
main:has(details.toc) article p.pd-meta[class]:not(:first-child, p.pd-meta + p.pd-meta) { margin-top: 1rem; }
main:has(details.toc) article p.pd-meta[class] + p.pd-meta { border-top: 0; border-radius: 0 0 1rem 1rem; }
main:has(details.toc) article p.pd-meta[class]::before { content: ""; position: absolute; left: 1rem; top: calc(.6rem + 1.5em / 2 - 8px); width: 16px; height: 16px; background: #36d240; mask: center / contain no-repeat;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E"); }
main:has(details.toc) article p.pd-meta[class] + p.pd-meta::before { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2.5'/%3E%3Cpath d='M8 3v4M16 3v4M3.5 10h17M9 15l2 2 4-4'/%3E%3C/svg%3E"); }
main article .pd-callout { margin-top: 2.5rem; border: 1px solid rgba(54,210,64,.25); border-radius: 1.5rem; background: rgba(54,210,64,.05); padding: 1.5rem 1.6rem; }
main article .pd-callout > h2 { margin-top: 0; font-size: 1.15rem; }

/* iGaming diagrams: readable label size on phones (horizontal scroll) */
@media (max-width: 639px) {
  main .pdig-svg { min-width: 820px; }
  main .pdig-svg.pdig-svg-sm { min-width: 600px; }
}

/* WordPress plugin maintenance blocks: site gutter and radii */
@media (max-width: 639px) { main .wp-maintenance > .mx-auto { padding-left: 1.25rem; padding-right: 1.25rem; } }
main .wp-maintenance__evidence { border-radius: 1.5rem; }
main aside.wp-maintenance__update { border-radius: 1.5rem; border: 1px solid rgba(54,210,64,.25); }

/* Contact on phones: form starts sooner; safety note at note size */
@media (max-width: 639px) {
  main:has(#onboarding-form) > section:first-child { padding-bottom: 1.5rem; }
  main:has(#onboarding-form) > section:nth-child(2) { padding-top: 1.5rem; }
}
main #onboarding-form p.mt-4 { font-size: 14px; }
/* ...the pre-submit "confirm your email" warning is one line above the button (was a full amber panel); the post-submit panel keeps the full steps */
main .pd-email-line { display: flex; gap: .6rem; align-items: flex-start; margin: 0; font-size: 13px; line-height: 1.55; color: rgba(255,255,255,.65); }
main .pd-email-line strong { color: #fff; }
main .pd-email-line .ic { flex: none; margin-top: .2rem; font-size: 14px; color: #36d240; }

/* 404: the missing path is echoed, and the closest public routes are offered as cards above the generic chips */
main .pd-404-path { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; padding: 0 .4rem; border-radius: .4rem; background: rgba(255,255,255,.08); font-size: 14px; color: #fff; }
main .pd-404-guess { margin: 2.5rem 0 0; padding: 0; list-style: none; display: grid; gap: .75rem; text-align: left; }
main .pd-404-guess a { display: grid; gap: .25rem; padding: 1rem 1.25rem; border: 1px solid rgba(54,210,64,.35); border-radius: 1.25rem; background: rgba(54,210,64,.06); color: #fff; transition: border-color .2s, background .2s; }
main .pd-404-guess a:hover { border-color: #36d240; background: rgba(54,210,64,.12); }
main .pd-404-guess__title { font-size: 16px; font-weight: 700; }
main .pd-404-guess__desc { font-size: 14px; color: rgba(255,255,255,.65); }
main .pd-404-guess__path { font-size: 12px; color: #36d240; }
main .pd-404-guess + .mt-10 { margin-top: 1.5rem; }

/* Cash App checkout hero: the hosted checkout as the customer sees it (was a generic 4-step "Payment route" card) */
main .pd-phone { max-width: 360px; margin: 0 auto; padding: 1.25rem 1.25rem 1.5rem; border: 1px solid rgba(255,255,255,.12); border-radius: 2rem; background: #050705; color: #fff; }
main .pd-phone p { margin: 0; }
main .pd-phone__bar { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding-bottom: 1rem; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 13px; }
main .pd-phone__brand { display: flex; align-items: center; gap: .5rem; font-weight: 700; }
main .pd-phone__avatar { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #36d240; color: #04180a; font-size: 12px; }
main .pd-phone__lock { font-size: 11px; color: rgba(255,255,255,.5); }
main .pd-phone [class].pd-phone__ref { margin-top: 1.25rem !important; font-size: 12px; color: rgba(255,255,255,.5); }
main .pd-phone [class].pd-phone__amount { font-size: 2.4rem; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; }
main .pd-phone [class].pd-phone__label { margin-top: 1.25rem !important; font-size: 12px; color: rgba(255,255,255,.5); }
main .pd-phone__methods { margin: .5rem 0 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
main .pd-phone [class].pd-phone__methods li { display: flex; align-items: center; gap: .75rem; padding: .7rem .9rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1rem; font-size: 14px; font-weight: 600; }
main .pd-phone__methods li.is-on { border-color: #36d240; background: rgba(54,210,64,.08); }
main .pd-phone__methods .ic { flex: none; font-size: 18px; color: #36d240; }
main .pd-phone__methods small { display: block; font-size: 11px; font-weight: 400; color: rgba(255,255,255,.5); }
main .pd-phone__tick { margin-left: auto; color: #36d240; }
main .pd-phone [class].pd-phone__more { margin-top: .75rem !important; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.5); }
main .pd-phone__pay { display: block; margin-top: 1rem; padding: .85rem; border-radius: 999px; background: #36d240; color: #04180a; text-align: center; font-size: 15px; font-weight: 700; }
main .pd-phone [class].pd-phone__status { display: flex; align-items: flex-start; gap: .5rem; margin-top: .9rem !important; font-size: 12px; color: rgba(255,255,255,.6); }
main .pd-phone__dot { flex: none; margin-top: .3rem; width: 8px; height: 8px; border-radius: 50%; background: #36d240; }
/* ...WordPress plugin hero: the same mock as a WooCommerce checkout step (completed steps, radio methods, Place order) */
main .pd-phone--woo { max-width: 420px; }
main .pd-phone [class].pd-woo__done { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .35rem; }
main .pd-phone [class].pd-woo__done li { display: flex; align-items: center; gap: .5rem; font-size: 13px; color: rgba(255,255,255,.6); }
main .pd-phone [class].pd-woo__done .ic { font-size: 11px; color: #36d240; }
main .pd-woo__radio { flex: none; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.35); }
main .pd-phone__methods li.is-on .pd-woo__radio { border-color: #36d240; background: radial-gradient(circle, #36d240 40%, transparent 46%); }
/* ...IPTV hero: the same mock as a subscription renewal link (subscriber, territory, expiry on the record; access extended after paid) */
main .pd-phone--renew { max-width: 400px; }
main .pd-phone [class].pd-renew__meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: .75rem 0 1rem; padding: .7rem .8rem; border: 1px solid rgba(255,255,255,.08); border-radius: 1rem; background: rgba(255,255,255,.03); }
main .pd-renew__meta dt { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: rgba(255,255,255,.45); }
main .pd-renew__meta dd { margin: .15rem 0 0; font-size: 13px; font-weight: 600; color: #fff; }
main .pd-phone--renew [class].pd-phone__amount { font-size: 2rem; }
/* ...Digital goods hero: the order page after payment (paid banner, download, licence key unlocked by the webhook) */
main .pd-phone--unlock { max-width: 400px; }
main .pd-phone [class].pd-unlock__paid { display: flex; align-items: flex-start; gap: .6rem; margin-top: .75rem !important; padding: .7rem .85rem; border: 1px solid #36d240; border-radius: 1rem; background: rgba(54,210,64,.08); font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.7); }
main .pd-unlock__paid strong { color: #fff; }
main .pd-unlock__paid > .ic { flex: none; margin-top: .2rem; font-size: 16px; color: #36d240; }
main .pd-unlock__paid span .ic { display: inline-block; vertical-align: -.15em; font-size: 14px; color: #36d240; }
main .pd-unlock__file, main .pd-unlock__key { display: flex; align-items: center; gap: .75rem; margin-top: .5rem; padding: .7rem .9rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1rem; font-size: 14px; font-weight: 600; }
main .pd-unlock__file > .ic, main .pd-unlock__key > .ic { flex: none; font-size: 18px; color: #36d240; }
main .pd-unlock__name { min-width: 0; flex: 1; }
main .pd-unlock__name small { display: block; font-size: 11px; font-weight: 400; color: rgba(255,255,255,.5); }
main .pd-unlock__btn { flex: none; padding: .45rem .9rem; border-radius: 999px; background: #36d240; color: #04180a; font-size: 13px; font-weight: 700; }
main .pd-unlock__key code { flex: 1; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; letter-spacing: .04em; color: #fff; }
/* ...Done-for-you hero: the onboarding ticket (done / in progress / next steps, agent + handoff) */
main .pd-phone--ticket { max-width: 420px; }
main .pd-phone--ticket .pd-phone__avatar .ic { font-size: 13px; }
main .pd-phone [class].pd-ticket__steps { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
main .pd-phone [class].pd-ticket__steps li { display: flex; align-items: flex-start; gap: .7rem; padding: .6rem .75rem; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; font-size: 13px; line-height: 1.4; color: rgba(255,255,255,.55); }
main .pd-ticket__steps li.is-done { color: rgba(255,255,255,.75); }
main .pd-ticket__steps li.is-now { border-color: #36d240; background: rgba(54,210,64,.08); color: #fff; }
main .pd-ticket__steps .ic, main .pd-ticket__steps i { flex: none; width: 16px; height: 16px; margin-top: .1rem; font-size: 16px; color: #36d240; }
main .pd-ticket__steps i { display: block; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.3); }
main .pd-ticket__steps li.is-now i { border-color: #36d240; background: radial-gradient(circle, #36d240 40%, transparent 46%); }
main .pd-ticket__steps li > span { flex: 1; min-width: 0; }
main .pd-ticket__steps strong { display: block; font-weight: 600; color: inherit; }
main .pd-ticket__steps li.is-done strong { color: #fff; }
main .pd-ticket__steps small { display: block; margin-top: .1rem; font-size: 11.5px; color: rgba(255,255,255,.5); }
main .pd-ticket__steps time { flex: none; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 10px; text-transform: uppercase; color: rgba(255,255,255,.45); }
main .pd-ticket__steps li.is-now time { color: #36d240; }
/* ...Digital shop hero: the shop's order list (source, items, method, paid status per order) */
main .pd-phone--orders { max-width: 420px; }
main .pd-phone--orders .pd-phone__avatar .ic { font-size: 12px; }
main .pd-phone [class].pd-orders { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
main .pd-phone [class].pd-orders li { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; font-size: 13px; }
main .pd-orders__ref { min-width: 0; }
main .pd-orders__ref b { display: block; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 600; color: #fff; }
main .pd-orders__ref small { display: block; margin-top: .15rem; font-size: 11.5px; color: rgba(255,255,255,.5); }
main .pd-orders__st { flex: none; padding: .3rem .65rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.2); font-size: 11px; font-weight: 700; color: rgba(255,255,255,.6); white-space: nowrap; }
main .pd-orders__st.is-paid { border-color: #36d240; background: rgba(54,210,64,.12); color: #36d240; }
/* ...Third-party provider guide hero: the guide's four checks answered for PD CASH */
main .pd-phone--check { max-width: 440px; }
main .pd-phone--check .pd-phone__avatar .ic { font-size: 12px; }
main .pd-phone [class].pd-check { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
main .pd-phone [class].pd-check li { padding: .65rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; font-size: 13px; line-height: 1.45; }
main .pd-check__q { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.5); }
main .pd-check__a { display: flex; align-items: flex-start; gap: .5rem; margin-top: .3rem; color: rgba(255,255,255,.8); }
main .pd-check__a i { flex: none; font-style: normal; font-weight: 700; color: #36d240; }
main .pd-check__a a { color: #36d240; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
main .pd-check__a a:hover { color: #fff; }
/* ...Features hero: sample merchant dashboard (stats + activity rows for links, routing, alerts, tickets, team) */
main .pd-phone--dash { max-width: 440px; }
main .pd-phone--dash .pd-phone__avatar .ic { font-size: 12px; }
main .pd-phone [class].pd-dash__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 1rem 0 0; }
main .pd-dash__stats > div { padding: .65rem .75rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; }
main .pd-dash__stats dt { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.5); }
main .pd-dash__stats dd { margin: .2rem 0 0; font-size: 1.35rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; color: #fff; }
main .pd-dash__stats > div:last-child dd { color: #36d240; }
main .pd-phone [class].pd-dash { margin: .6rem 0 0; padding: 0; list-style: none; display: grid; gap: .4rem; }
main .pd-phone [class].pd-dash li { display: flex; align-items: center; gap: .7rem; padding: .6rem .75rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; font-size: 13px; }
main .pd-dash__ic { flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(54,210,64,.3); color: #36d240; font-size: 11px; }
main .pd-dash__t { min-width: 0; flex: 1; }
main .pd-dash__t b { display: block; font-weight: 600; color: #fff; }
main .pd-dash__t small { display: block; margin-top: .1rem; font-size: 11.5px; color: rgba(255,255,255,.5); }
main .pd-dash__st { flex: none; padding: .25rem .55rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.2); font-size: 11px; font-weight: 700; color: rgba(255,255,255,.6); white-space: nowrap; }
main .pd-dash__st.is-ok { border-color: #36d240; background: rgba(54,210,64,.12); color: #36d240; }
main .pd-dash__st .ic { font-size: 10px; }
@media (max-width: 400px) { main .pd-dash__stats dd { font-size: 1.15rem; } }
/* ...Footer trust band: four verified facts + the CTA, on every page above the link columns */
footer .pd-trust { border-bottom: 1px solid rgba(255,255,255,.07); background: #050705; }
footer .pd-trust__in { display: flex; align-items: center; justify-content: space-between; gap: 2rem; max-width: 80rem; margin: 0 auto; padding: 1.5rem 1.25rem; }
footer .pd-trust__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; margin: 0; padding: 0; list-style: none; flex: 1; min-width: 0; }
footer .pd-trust__list li { display: flex; align-items: flex-start; gap: .5rem; font-size: 12.5px; line-height: 1.45; color: rgba(255,255,255,.55); }
footer .pd-trust__list i { flex: none; font-style: normal; font-weight: 700; color: #36d240; }
footer .pd-trust__list b { display: block; font-size: 13.5px; font-weight: 700; color: #fff; }
/* TRUST_GOOGLE_V1 (loop5 13): the strip CTA is the white Google button with the email + terms line under it. */
footer .pd-trust__cta { flex: none; width: 18rem; text-align: center; }
footer .pd-trust__cta .pd-lg { width: 100%; }
footer .pd-trust__cta .pd-lg-note { margin: .6rem auto 0; font-size: 12px; }
@media (min-width: 640px) { footer .pd-trust__in { padding-left: 2rem; padding-right: 2rem; } }
@media (max-width: 1023px) { footer .pd-trust__in { flex-direction: column; align-items: stretch; gap: 1.25rem; } footer .pd-trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } footer .pd-trust__cta { width: auto; } }
@media (max-width: 639px) { footer .pd-trust__list { grid-template-columns: 1fr; gap: .9rem; } }
/* FOOTER_BAR_V1 (loop3 53): from 640 to 1279 the bottom bar squeezed three items into one row (copyright wrapped onto
   2 lines, legal links centred in 2 rows, Pause animations floating at the right). The legal links now get their own
   left-aligned row, with copyright and Pause sharing the row under it. From 640 to 1023 the link lists also drop the
   12px gaps on top of their 44px tap targets, as phones do. */
@media (min-width: 640px) and (max-width: 1279.98px) {
  footer .border-t.pt-8.sm\:flex-row { flex-wrap: wrap; row-gap: 1rem; }
  footer .border-t.pt-8.sm\:flex-row > nav { order: -1; flex: 1 0 100%; justify-content: flex-start; }
}
@media (max-width: 1023.98px) {
  footer nav .space-y-3 > :not([hidden]) ~ :not([hidden]) { margin-top: 0; }
}
/* FOOTER_DIET_V1 (loop3 47): the phone footer was 1,900-2,200px (2.5 screens). Trust points as a 2x2 of headlines
   (the detail lines stay for screen readers), link lists on the 44px tap-target rhythm without the extra 12px gaps,
   tighter section spacing. Same links, same legal text. */
@media (max-width: 639.98px) {
  footer .pd-trust__in { padding-block: 1.25rem; gap: 1rem; }
  footer .pd-trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; }
  footer .pd-trust__list span { font-size: 0; line-height: 0; }
  footer .pd-trust__list b { font-size: 13px; line-height: 1.35; }
  footer > .relative.mx-auto { padding-block: 3rem; }
  footer .grid.md\:grid-cols-5 { row-gap: 2rem; }
  footer nav ul.space-y-3 { margin-top: .5rem; }
  footer .mt-14.rounded-3xl { margin-top: 2.5rem; }
}
/* ...Checkout hero: looped pay → paid demo (CSS only, so "Pause animations" and reduced-motion stop it) */
main .pd-phone--demo { position: relative; overflow: hidden; }
main .pd-phone [class].pd-phone__done { position: absolute; inset: 0; display: grid; place-content: center; gap: .3rem; padding: 1.5rem; text-align: center; background: #050705; opacity: 0; pointer-events: none; }
main .pd-phone__done-ic { display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto .6rem; border-radius: 50%; background: #36d240; color: #04180a; font-size: 26px; font-weight: 800; }
main .pd-phone__done b { font-size: 1.7rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; color: #fff; }
main .pd-phone__done small { margin-top: .4rem; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.6); }
@media (prefers-reduced-motion: no-preference) {
  main .pd-phone [class].pd-phone__done { animation: pdDemoPaid 9s ease-in-out infinite; }
  main .pd-phone--demo .pd-phone__pay { animation: pdDemoTap 9s ease-in-out infinite; }
}
@keyframes pdDemoPaid { 0%, 50% { opacity: 0; } 56%, 90% { opacity: 1; } 96%, 100% { opacity: 0; } }
@keyframes pdDemoTap { 0%, 44% { transform: none; } 47% { transform: scale(.96); } 50%, 100% { transform: none; } }
/* ...Contact: wizard nav for the route-review form (steps toggled by pd-consistency js) */
main .pd-wiz { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: .5rem; }
main #reviewForm > [hidden], main .pd-wiz__next[hidden] { display: none !important; }
main .pd-wiz__back { align-self: stretch; padding: 0 1.3rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.75); transition: transform .2s cubic-bezier(.2,.8,.2,1), background-color .2s, border-color .2s, color .2s; -webkit-tap-highlight-color: transparent; }
main .pd-wiz__back:hover { color: #fff; border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.05); }
main .pd-wiz__back:active { transform: scale(.97); transition-duration: .08s; }
main .pd-wiz__back:disabled { visibility: hidden; }
main .pd-wiz__next { padding: .9rem 1.6rem; font-size: 15px; font-weight: 700; }
@media (max-width: 639px) { main .pd-wiz__next { flex: 1; } main .pd-wiz__back:disabled { display: none; } }
/* WIZ_STEPS_V1 (loop5 06): step progress bar; the step's own heading row and the "Step n of 3" line stay for screen readers only. */
main :is(.pd-wiz__where, #reviewForm.is-wiz > [data-step] > :first-child) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
main .pd-wiz__bar { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 0; padding: 0; list-style: none; scroll-margin-top: calc(110px + var(--pd-eb, 0px)); }
main .pd-wiz__seg { display: flex; flex-wrap: wrap; align-items: baseline; gap: .45rem .4rem; width: 100%; padding: 0 0 .25rem; text-align: left; font-size: 13px; font-weight: 600; line-height: 1.3; color: rgba(255,255,255,.4); transition: color .25s; -webkit-tap-highlight-color: transparent; }
main .pd-wiz__seg::before { content: ""; flex-basis: 100%; height: 4px; border-radius: 999px; background: rgba(255,255,255,.1) linear-gradient(#36d240, #36d240) no-repeat 0 0 / 0 100%; transition: background-size .45s cubic-bezier(.2,.8,.2,1); }
main .pd-wiz__n { font: 700 11px/1 'JetBrains Mono', ui-monospace, monospace; color: rgba(255,255,255,.3); }
@media (max-width: 639px) { main .pd-wiz__n { display: none; } }
main :is(.is-now, .is-done) > .pd-wiz__seg::before { background-size: 100% 100%; }
main :is(.is-now, .is-done) .pd-wiz__n { color: #36d240; }
main .is-now > .pd-wiz__seg { color: #fff; }
main .is-done > .pd-wiz__seg { color: rgba(255,255,255,.7); }
main .is-done > .pd-wiz__seg:hover { color: #fff; }
main .pd-wiz__seg:focus-visible { outline: 2px solid #36d240; outline-offset: 4px; border-radius: 6px; }
main #reviewForm[data-dir] > [data-step]:not([hidden]) { animation: pdWizNext .32s cubic-bezier(.2,.8,.2,1); }
main #reviewForm[data-dir="back"] > [data-step]:not([hidden]) { animation-name: pdWizBack; }
@keyframes pdWizNext { from { opacity: 0; transform: translateX(14px); } }
@keyframes pdWizBack { from { opacity: 0; transform: translateX(-14px); } }
@media (prefers-reduced-motion: reduce) { main #reviewForm[data-dir] > [data-step] { animation: none; } main .pd-wiz__seg::before { transition: none; } }
/* CONTACT_FIELDS_V1 (loop5 23): /contact fields were 16px-corner boxes under a pill invoice field, beside pill buttons; they take the
   pill shape used on sign-in and the homepage, and a filled field the browser accepts gets a green tick that grows in after you leave it. */
main :is(#reviewForm, #messageForm) :is(input, select).auth-input { min-height: 52px; border-radius: 9999px; padding-left: 1.25rem; }
main :is(#reviewForm, #messageForm) textarea.auth-input { border-radius: 22px; padding: .85rem 1.25rem; }
main :is(#reviewForm, #messageForm) .relative > .i-solid-chevron-down { right: 1.25rem; }
main :is(#reviewForm, #messageForm) input.auth-input { padding-right: 2.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%2336d240'/%3E%3Cpath d='M4.6 8.3l2.2 2.2 4.6-4.9' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 1.1rem center; background-size: 0; transition: border-color .2s, background-size .3s cubic-bezier(.3,1.6,.5,1); }
main :is(#reviewForm, #messageForm) input.auth-input:user-valid:not(:placeholder-shown, :focus, [aria-invalid="true"]) { background-size: 18px; border-color: rgba(54,210,64,.55); }
@media (prefers-reduced-motion: reduce) { main :is(#reviewForm, #messageForm) input.auth-input { transition: none; } }
/* Radio selectors: home product types and the how-to guide's method chooser. */
main .pd-who { position: relative; }
main .pd-who > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-who__tabs { display: flex; flex-wrap: wrap; gap: .5rem; }
main .pd-who__tabs label { cursor: pointer; padding: .55rem 1rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; font-size: 13.5px; font-weight: 700; color: rgba(255,255,255,.75); background: #050705; transition: border-color .15s, color .15s; }
main .pd-who__tabs label:hover { border-color: rgba(54,210,64,.6); color: #fff; }
main #pd-who-1:checked ~ .pd-who__tabs label:nth-child(1), main #pd-who-2:checked ~ .pd-who__tabs label:nth-child(2), main #pd-who-3:checked ~ .pd-who__tabs label:nth-child(3), main #pd-who-4:checked ~ .pd-who__tabs label:nth-child(4), main #pd-who-5:checked ~ .pd-who__tabs label:nth-child(5), main #pd-who-6:checked ~ .pd-who__tabs label:nth-child(6) { background: #36d240; border-color: #36d240; color: #04180a; }
main #pd-who-1:focus-visible ~ .pd-who__tabs label:nth-child(1), main #pd-who-2:focus-visible ~ .pd-who__tabs label:nth-child(2), main #pd-who-3:focus-visible ~ .pd-who__tabs label:nth-child(3), main #pd-who-4:focus-visible ~ .pd-who__tabs label:nth-child(4), main #pd-who-5:focus-visible ~ .pd-who__tabs label:nth-child(5), main #pd-who-6:focus-visible ~ .pd-who__tabs label:nth-child(6) { outline: 2px solid #fff; outline-offset: 2px; }
main .pd-who__panels { margin-top: 1.25rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; }
main .pd-who__panel { display: none; padding: 2rem; }
main #pd-who-1:checked ~ .pd-who__panels .pd-who__panel:nth-child(1), main #pd-who-2:checked ~ .pd-who__panels .pd-who__panel:nth-child(2), main #pd-who-3:checked ~ .pd-who__panels .pd-who__panel:nth-child(3), main #pd-who-4:checked ~ .pd-who__panels .pd-who__panel:nth-child(4), main #pd-who-5:checked ~ .pd-who__panels .pd-who__panel:nth-child(5), main #pd-who-6:checked ~ .pd-who__panels .pd-who__panel:nth-child(6) { display: block; }
main .pd-who__panel h3 { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; color: #fff; }
main .pd-who [class].pd-who__panel p:not(.pd-lg-note) { max-width: 46rem; margin-top: .75rem; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-who__panel [class].pd-who__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1.5rem; }
main .pd-who__cta .pill { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.4rem; font-size: 14px; }
/* Keep the terms line fine print inside guide panels (GUIDE_GOOGLE_V1). */
main .pd-who__note { margin-top: .9rem; }
main .pd-who__tabs label:active { transform: scale(.96); }
@media (prefers-reduced-motion: no-preference) {
  main .pd-who__tabs label { transition: border-color .15s, color .15s, background-color .2s, transform .12s; }
  main .pd-who__panel > * { animation: pdWhoIn .38s cubic-bezier(.2,.8,.2,1) both; }
  main .pd-who__panel > :nth-child(2) { animation-delay: .05s; }
  main .pd-who__panel > :nth-child(3) { animation-delay: .1s; }
  main .pd-who__panel > :nth-child(n+4) { animation-delay: .15s; }
  html.pd-motion-paused main .pd-who__panel > * { animation: none; }
}
@keyframes pdWhoIn { from { opacity: 0; transform: translateY(10px); } }
@media (max-width: 639px) {
  main .pd-who__cta .pill { flex: 1 1 100%; justify-content: center; }
  main .pd-who__panel { padding: 1.4rem 1.2rem; }
  main .pd-who__tabs label { padding: .5rem .85rem; font-size: 13px; }
}
/* FIT_PANEL_V1: keep the guide's choices beside the answer, not across its full width. */
main [aria-labelledby="pd-fit-h"] .pd-who__tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; }
main [aria-labelledby="pd-fit-h"] .pd-who__tabs label { display: flex; align-items: center; min-height: 52px; padding: .85rem 1rem; border-radius: 1rem; line-height: 1.4; }
@media (min-width: 1024px) {
  main [aria-labelledby="pd-fit-h"] .pd-who { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.5rem; align-items: start; }
  main [aria-labelledby="pd-fit-h"] .pd-who__tabs { grid-template-columns: minmax(0, 1fr); }
  main [aria-labelledby="pd-fit-h"] .pd-who__tabs label { justify-content: space-between; gap: 1rem; min-height: 64px; }
  main [aria-labelledby="pd-fit-h"] .pd-who__tabs label::after { content: "\2192"; flex: none; opacity: .5; pointer-events: none; }
  main [aria-labelledby="pd-fit-h"] .pd-who__panels { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
  main [aria-labelledby="pd-fit-h"] .pd-who__tabs label { transition: none; }
  main [aria-labelledby="pd-fit-h"] .pd-who__tabs label:active { transform: none; }
}

/* features: dashboard settings lab. Each row is one <label>, so the whole row flips its switch; the switches drive the hosted-page preview via :has() */
main .pd-set { border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; overflow: hidden; }
main .pd-set__bar { display: flex; justify-content: space-between; gap: 1rem; padding: .9rem 1.5rem; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 13px; font-weight: 700; color: #fff; }
main .pd-set__hint { font-weight: 500; color: rgba(255,255,255,.5); }
main .pd-set__list li { position: relative; }
main .pd-set__list li + li { border-top: 1px solid rgba(255,255,255,.07); }
main .pd-set__list label { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.5rem; cursor: pointer; transition: background-color .2s, border-color .2s; }
@media (hover: hover) { main .pd-set__list label:hover { background-color: rgba(255,255,255,.03); } }
main .pd-set input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-set__ic { display: grid; flex: none; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(54,210,64,.25); background: rgba(54,210,64,.12); color: #36d240; transition: opacity .2s; }
main .pd-set__ic .ic { width: 15px; height: 15px; }
main .pd-set__t { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: .15rem; }
main .pd-set__t b { font-size: 15px; font-weight: 700; color: #fff; }
main .pd-set__t small { font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.6); }
main .pd-set__sw { flex: none; position: relative; width: 36px; height: 20px; border-radius: 999px; background: #36d240; transition: background-color .2s; }
main .pd-set__sw::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #04180a; transform: translateX(16px); transition: transform .22s cubic-bezier(.2,.8,.2,1), background-color .2s; }
main .pd-set li:has(input:not(:checked)) .pd-set__sw { background: rgba(255,255,255,.18); }
main .pd-set li:has(input:not(:checked)) .pd-set__sw::after { transform: none; background: #fff; }
main .pd-set li:has(input:not(:checked)) .pd-set__ic { opacity: .4; }
main .pd-set li:has(input:focus-visible) .pd-set__sw { outline: 2px solid #fff; outline-offset: 2px; }

/* changelog: release timeline rail (loop33) */
main .pd-tl { position: relative; padding-left: 2.25rem; }
main .pd-tl::before { content: ""; position: absolute; top: 1.4rem; bottom: 1.4rem; left: 8px; width: 2px; background: rgba(255,255,255,.12); }
main .pd-tl > li, main .pd-tl__sub > li { position: relative; }
main .pd-tl > li + li, main .pd-tl__sub > li + li { margin-top: 1.25rem; }
main .pd-tl > li > :first-child::before, main .pd-tl__sub > li > :first-child::before { content: ""; z-index: 1; position: absolute; top: 1.55rem; left: -2.25rem; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #000; background: rgba(255,255,255,.35); box-shadow: 0 0 0 2px rgba(255,255,255,.12); }
main .pd-tl > li:first-child > :first-child::before { background: #36d240; box-shadow: 0 0 0 2px #36d240; }
main .pd-tl > li:first-child.card { border-color: rgba(54,210,64,.45); }
main .pd-tl > li:first-child h3::after { content: "Latest"; margin-left: .6rem; padding: .2rem .55rem; border-radius: 999px; background: #36d240; color: #04180a; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; vertical-align: middle; }
/* CL_EARLIER_V1 (loop5 36): older releases fold into one row; its dot is a hollow ring until opened */
main .pd-tl > li.pd-tl__more > details::before { content: none; }
main .pd-tl__more summary { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; min-height: 56px; padding: .9rem 1.5rem; border: 1px dashed rgba(255,255,255,.18); border-radius: 2rem; background: rgba(255,255,255,.02); list-style: none; cursor: pointer; transition: border-color .2s, background-color .2s; }
main .pd-tl__more summary::-webkit-details-marker { display: none; }
main .pd-tl__more summary::before { content: ""; z-index: 1; position: absolute; top: 19px; left: -2.25rem; width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); background: #000; }
main .pd-tl__more summary::after { content: "+"; width: 1rem; font-size: 20px; font-weight: 700; line-height: 1; text-align: center; color: #36d240; transition: transform .2s; }
main .pd-tl__more summary:hover { border-color: rgba(54,210,64,.45); background: rgba(54,210,64,.04); }
main .pd-tl__more summary:focus-visible { outline: 2px solid #36d240; outline-offset: 3px; }
main .pd-tl__more details[open] > summary { border-style: solid; border-color: rgba(54,210,64,.35); }
main .pd-tl__more details[open] > summary::before { border-color: #36d240; }
main .pd-tl__more details[open] > summary::after { transform: rotate(45deg); }
main .pd-tl__more-t { font-size: 15px; font-weight: 800; color: #fff; }
main .pd-tl__more-m { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; color: rgba(255,255,255,.5); }
main .pd-tl__more-n { display: grid; place-items: center; min-width: 26px; height: 26px; margin-left: auto; padding: 0 .45rem; border-radius: 999px; background: rgba(54,210,64,.12); font-size: 12px; font-weight: 800; color: #36d240; }
main .pd-tl__sub { margin: 1.25rem 0 0; padding: 0; list-style: none; }
@media (prefers-reduced-motion: no-preference) { main .pd-tl__more details[open] > .pd-tl__sub { animation: pd-ver-in .3s ease-out; } html.pd-motion-paused main .pd-tl__more details[open] > .pd-tl__sub { animation: none; } }
@media (prefers-reduced-motion: reduce) { main .pd-tl__more summary, main .pd-tl__more summary::after { transition: none; } }
@media (max-width: 639px) { main .pd-tl { padding-left: 1.6rem; } main .pd-tl::before { left: 5px; } main .pd-tl > li > :first-child::before, main .pd-tl__sub > li > :first-child::before { left: -1.6rem; width: 14px; height: 14px; top: 1.45rem; } main .pd-tl__more summary { padding: .9rem 1.1rem; } main .pd-tl__more-m { order: 3; flex-basis: 100%; } main .pd-tl__more summary::before { left: -1.6rem; width: 14px; height: 14px; top: 21px; } }

/* supported business routes include: review table (loop34, 5 pages) */
main .pd-routes { border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; overflow: hidden; }
main .pd-routes__head, main .pd-routes__row { display: grid; grid-template-columns: 1.1fr 1.3fr 1.5fr; gap: 1.5rem; padding: 1.25rem 1.75rem; }
main .pd-routes__head { padding-top: .9rem; padding-bottom: .9rem; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 12px; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-routes__row + .pd-routes__row { border-top: 1px solid rgba(255,255,255,.08); }
main .pd-routes__row h3 { font-size: 17px; font-weight: 700; line-height: 1.3; }
main .pd-routes__row h3 a { color: #fff; text-decoration: none; }
main .pd-routes__row h3 a:hover { color: #36d240; }
main .pd-routes__row h3 span { color: #36d240; }
main .pd-routes__row--here h3 { color: #fff; }
main .pd-routes__row--here { background: linear-gradient(90deg, rgba(54,210,64,.09), rgba(54,210,64,.02) 60%); box-shadow: inset 3px 0 0 #36d240; }
main .pd-routes__row--here h3 em { display: inline-block; margin-left: .45rem; padding: .15rem .55rem; border-radius: 9999px; background: #36d240; color: #04180a; font-size: 11px; font-weight: 700; line-height: 1.4; font-style: normal; vertical-align: .15em; }
main .pd-routes__row small { display: block; margin-top: .35rem; font-size: 12.5px; line-height: 1.45; color: rgba(255,255,255,.5); }
main .pd-routes [class].pd-routes__row p, main .pd-routes__row p { font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-routes__row ul { display: grid; gap: .35rem; }
main .pd-routes__row ul li { position: relative; padding-left: 1.1rem; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.75); }
main .pd-routes__row ul li::before { content: "\2713"; position: absolute; left: 0; color: #36d240; font-weight: 700; }
@media (max-width: 767px) {
  main .pd-routes__head { display: none; }
  main .pd-routes__row { grid-template-columns: 1fr; gap: 1rem; padding: 1.25rem 1.2rem; }
  main .pd-routes__row [data-l]::before { content: attr(data-l); display: block; margin-bottom: .35rem; font-size: 11.5px; font-weight: 700; color: rgba(255,255,255,.45); }
}

/* security: at-a-glance summary above the document (loop35) */
main .pd-glance { margin-top: 2rem; padding: 1.5rem 1.75rem; border: 1px solid rgba(54,210,64,.45); border-radius: 1.5rem; background: #050705; }
main .pd-callout + .pd-glance { border-color: rgba(255,255,255,.14); }
main .pd-glance [class].pd-glance__t, main .pd-glance__t { font-size: 13px; font-weight: 700; color: #36d240; }
main .pd-glance ul { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.5rem; margin-top: 1rem; }
main .pd-glance ul li { position: relative; padding-left: 1.4rem; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.65); }
main .pd-glance ul li::before { content: "\2713"; position: absolute; left: 0; top: 0; color: #36d240; font-weight: 700; }
main .pd-glance ul li b { display: block; font-size: 15px; font-weight: 700; color: #fff; }
main .pd-glance ul li a { color: rgba(255,255,255,.5); text-decoration: underline; text-underline-offset: 2px; }
main .pd-glance ul li a:hover { color: #36d240; }
main .pd-glance [class].pd-glance__n, main .pd-glance__n { margin-top: 1.25rem; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.5); }
@media (max-width: 639px) { main .pd-glance { padding: 1.25rem 1.2rem; } main .pd-glance ul { grid-template-columns: 1fr; } }

/* cash-app-checkout: "Make it yours" inputs under the hero mock (loop37) */
main .pd-try { display: grid; grid-template-columns: auto 1fr 1fr; gap: .75rem; align-items: end; max-width: 420px; margin: 1.25rem auto 0; }
main .pd-try [class].pd-try__t, main .pd-try__t { align-self: center; padding-bottom: .55rem; font-size: 13px; font-weight: 700; color: #36d240; white-space: nowrap; }
main .pd-try label { display: grid; gap: .3rem; font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,.55); }
main .pd-try input { width: 100%; min-width: 0; padding: .6rem .75rem; border: 1px solid rgba(255,255,255,.14); border-radius: .75rem; background: #050705; color: #fff; font-size: 14px; font-weight: 600; }
main .pd-try input:focus { outline: 2px solid #36d240; outline-offset: 1px; border-color: #36d240; }
main .pd-try__amt { position: relative; display: block; }
main .pd-try__amt i { position: absolute; left: .75rem; top: 50%; transform: translateY(-50%); font-style: normal; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-try__amt input { padding-left: 1.5rem; -moz-appearance: textfield; }
main .pd-try__amt input::-webkit-outer-spin-button, main .pd-try__amt input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
@media (max-width: 400px) { main .pd-try { grid-template-columns: 1fr 1fr; } main .pd-try__t { grid-column: 1 / -1; padding-bottom: 0; } }

/* /digital-shop-payments: orders mock loop — pending order flips to paid, summary updates (loop38) */
main .pd-flip { display: inline-grid; }
main .pd-flip > i { grid-area: 1 / 1; font-style: normal; white-space: nowrap; }
main .pd-flip > i:last-child { opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  main .pd-flip > i:first-child { animation: pdFlipA 9s ease-in-out infinite; }
  main .pd-flip > i:last-child { animation: pdFlipB 9s ease-in-out infinite; }
  main .pd-orders__st--live { animation: pdFlipPill 9s ease-in-out infinite; }
  main .pd-phone [class].pd-orders .pd-orders__live { animation: pdFlipRow 9s ease-in-out infinite; }
}
@keyframes pdFlipA { 0%, 48% { opacity: 1; } 52%, 92% { opacity: 0; } 96%, 100% { opacity: 1; } }
@keyframes pdFlipB { 0%, 48% { opacity: 0; } 52%, 92% { opacity: 1; } 96%, 100% { opacity: 0; } }
@keyframes pdFlipPill { 0%, 48% { border-color: rgba(255,255,255,.2); background: transparent; color: rgba(255,255,255,.6); } 52%, 92% { border-color: #36d240; background: rgba(54,210,64,.12); color: #36d240; } 96%, 100% { border-color: rgba(255,255,255,.2); background: transparent; color: rgba(255,255,255,.6); } }
@keyframes pdFlipRow { 0%, 48% { border-color: rgba(255,255,255,.1); } 51%, 60% { border-color: #36d240; } 70%, 100% { border-color: rgba(255,255,255,.1); } }
/* /agent-payment-links: link anatomy → record (loop39) */
main .pd-link { display: grid; grid-template-columns: 1.35fr auto 1fr; gap: 1rem; align-items: start; }
main .pd-link__box { padding: 1.25rem 1.35rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #050705; }
main .pd-link [class].pd-link__t { margin: 0 0 .9rem; font-size: 13px; font-weight: 700; color: #36d240; }
main .pd-link__code { display: flex; flex-wrap: wrap; align-items: flex-start; row-gap: .9rem; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.55); word-break: break-all; }
main .pd-link__code mark { display: inline-flex; flex-direction: column; padding: 0 .3rem; border-radius: .35rem .35rem 0 0; background: linear-gradient(rgba(54,210,64,.12), rgba(54,210,64,.12)) top / 100% 1.5em no-repeat; color: #fff; }
main .pd-link__code mark::after { content: attr(data-l); margin: 0 -.3rem 0; padding-top: .3rem; border-top: 2px solid #36d240; font-family: Inter, system-ui, sans-serif; font-size: 11px; font-weight: 600; line-height: 1.3; white-space: nowrap; color: #36d240; }
main .pd-link__arrow { display: grid; place-items: center; width: 40px; height: 40px; align-self: center; border-radius: 50%; border: 1px solid rgba(54,210,64,.4); color: #36d240; font-size: 14px; }
main .pd-link [class].pd-link__rec { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem 1rem; margin: 0; }
main .pd-link__rec dt { font-size: 11.5px; color: rgba(255,255,255,.5); }
main .pd-link__rec dd { margin: .1rem 0 0; font-size: 13.5px; font-weight: 600; color: #fff; }
main .pd-link__paid { display: inline-block; padding: .15rem .6rem; border-radius: 999px; border: 1px solid #36d240; background: rgba(54,210,64,.12); font-size: 12px; font-weight: 700; color: #36d240; }
main .pd-link [class].pd-link__n { margin: 1rem 0 0; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.5); }
@media (max-width: 767px) { main .pd-link { grid-template-columns: 1fr; } main .pd-link__arrow { transform: rotate(90deg); justify-self: center; } main .pd-link__code { font-size: 12.5px; } }
/* /cash-app-api: webhook verification code switcher (CSS radio tabs, loop40) */
main .pd-code { position: relative; }
main .pd-code > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-code p code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12.5px; color: #fff; }
main .pd-code__tabs { display: flex; gap: .4rem; margin-top: 1.25rem; }
main .pd-code__tabs label { cursor: pointer; padding: .5rem .95rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; font-size: 13px; font-weight: 700; color: rgba(255,255,255,.7); background: #050705; }
main .pd-code__tabs label:hover { border-color: rgba(54,210,64,.6); color: #fff; }
main #pd-code-1:checked ~ .pd-code__tabs label:nth-child(1), main #pd-code-2:checked ~ .pd-code__tabs label:nth-child(2), main #pd-code-3:checked ~ .pd-code__tabs label:nth-child(3) { border-color: #36d240; background: rgba(54,210,64,.12); color: #36d240; }
main .pd-code > input:focus-visible ~ .pd-code__tabs { outline: 2px solid #36d240; outline-offset: 4px; border-radius: 999px; }
main .pd-code__panes { margin-top: .9rem; }
main .pd-code__panes pre { display: none; font-variant-ligatures: none; white-space: pre; overflow-wrap: normal; margin: 0; padding: 1.1rem 1.25rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; background: #050705; overflow-x: auto; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12.5px; line-height: 1.65; color: rgba(255,255,255,.85); tab-size: 2; }
main #pd-code-1:checked ~ .pd-code__panes pre:nth-child(1), main #pd-code-2:checked ~ .pd-code__panes pre:nth-child(2), main #pd-code-3:checked ~ .pd-code__panes pre:nth-child(3) { display: block; }
/* /done-for-you: yourself vs with-your-agent ledger (loop41) */
main .pd-diy { border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; overflow: hidden; }
main .pd-diy__head, main .pd-diy__row { display: grid; grid-template-columns: 1fr 1.2fr 1.4fr; gap: 1.5rem; padding: 1.1rem 1.75rem; }
main .pd-diy__head { padding-top: .9rem; padding-bottom: .9rem; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 12px; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-diy__head span:last-child { color: #36d240; }
main .pd-diy__row + .pd-diy__row { border-top: 1px solid rgba(255,255,255,.08); }
main .pd-diy__row h3 { font-size: 15px; font-weight: 700; line-height: 1.4; color: #fff; }
main .pd-diy [class].pd-diy__row p, main .pd-diy__row p { margin: 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-diy__row p:last-child { position: relative; padding-left: 1.4rem; color: rgba(255,255,255,.85); }
main .pd-diy__row p:last-child::before { content: "✓"; position: absolute; left: 0; top: .05em; font-weight: 800; color: #36d240; }
main .pd-diy__row--cost { background: rgba(54,210,64,.05); }
main .pd-diy__row--cost p { font-weight: 600; color: #fff; }
@media (max-width: 767px) {
  main .pd-diy__head { display: none; }
  main .pd-diy__row { grid-template-columns: 1fr; gap: .75rem; padding: 1.1rem 1.25rem; }
  main .pd-diy__row p[data-l]::before { content: attr(data-l); display: block; margin-bottom: .2rem; font-size: 11.5px; font-weight: 700; color: rgba(255,255,255,.45); }
  main .pd-diy__row p:last-child { padding-left: 0; }
  main .pd-diy__row p:last-child::before { position: static; color: #36d240; }
}
/* .pd-flow step strip (loop43): /third-party-cash-app-provider, /how-to-accept-cash-app-payments, /aml-cft (--chain), /pricing (--dep).
   FLOW_RAIL_V1 (loop5 35): numbered steps joined by a rail; once the strip is in view a green pulse runs the rail 3 times */
main [class].pd-flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.25rem; margin-left: 0; margin-right: 0; padding: 0; list-style: none; counter-reset: pdf; }
main .pd-flow__n { position: relative; display: grid; grid-template-columns: auto 1fr; align-content: start; align-items: center; gap: .6rem .7rem; padding: 1.25rem 1.3rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #050705; counter-increment: pdf; }
main .pd-flow__n::before { content: counter(pdf); align-self: start; display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid rgba(54,210,64,.45); border-radius: 50%; font-size: 12px; font-weight: 800; color: #36d240; }
main .pd-flow__n > :not(b) { grid-column: 1 / -1; }
main .pd-flow__n--pd { border-color: #36d240; }
main .pd-flow__n--pd::before { border-color: #36d240; background: #36d240; color: #04180a; }
main .pd-flow__n b { font-size: 16px; font-weight: 800; letter-spacing: -.01em; color: #fff; }
main .pd-flow__n--pd b { color: #36d240; }
main .pd-flow [class].pd-flow__n p { margin: 0; font-size: 13.5px; line-height: 1.55; color: rgba(255,255,255,.65); }
main .pd-flow__n p a { color: #36d240; text-decoration: underline; text-underline-offset: 2px; }
main .pd-flow__tag { justify-self: start; margin-top: .1rem; padding: .3rem .7rem; border-radius: 999px; background: #36d240; font-size: 11.5px; font-weight: 800; color: #04180a; }
main .pd-flow__n:not(:last-child)::after { content: ""; position: absolute; top: calc(1.25rem + 14px); right: calc(-2.25rem - 1px); width: 2.25rem; height: 2px; margin-top: -1px; background: linear-gradient(90deg, transparent, #36d240 50%, transparent) -100% 0 / 50% 100% no-repeat, rgba(54,210,64,.35); }
main .pd-flow--chain .pd-flow__n:not(:last-child)::after { top: 100%; right: auto; left: calc(1.3rem + 13px); width: 2px; height: 2rem; margin: 1px 0 0; background: linear-gradient(transparent, #36d240 50%, transparent) 0 -100% / 100% 50% no-repeat, rgba(54,210,64,.35); }
@media (max-width: 767px) {
  main [class].pd-flow { grid-template-columns: 1fr; gap: 2rem; }
  main .pd-flow__n:not(:last-child)::after { top: 100%; right: auto; left: calc(1.3rem + 13px); width: 2px; height: 2rem; margin: 1px 0 0; background: linear-gradient(transparent, #36d240 50%, transparent) 0 -100% / 100% 50% no-repeat, rgba(54,210,64,.35); }
}
@keyframes pd-flow-x { 0% { background-position: -100% 0, 0 0; } 33%, 100% { background-position: 200% 0, 0 0; } }
@keyframes pd-flow-y { 0% { background-position: 0 -100%, 0 0; } 33%, 100% { background-position: 0 200%, 0 0; } }
@media (prefers-reduced-motion: no-preference) {
  main .pd-flow:is(.in, :not(.reveal)) .pd-flow__n::after { animation: pd-flow-x 2.4s linear .4s 3 backwards; }
  main .pd-flow:is(.in, :not(.reveal)) .pd-flow__n:nth-child(2)::after { animation-delay: 1.2s; }
  main .pd-flow:is(.in, :not(.reveal)) .pd-flow__n:nth-child(3)::after { animation-delay: 2s; }
  main .pd-flow--chain:is(.in, :not(.reveal)) .pd-flow__n::after { animation-name: pd-flow-y; }
  html.pd-motion-paused main .pd-flow[class] .pd-flow__n[class]::after { animation: none; }
}
@media (prefers-reduced-motion: no-preference) and (max-width: 767px) { main .pd-flow:is(.in, :not(.reveal)) .pd-flow__n::after { animation-name: pd-flow-y; } }
/* .pd-ready review checklist (CSS only, loop44): /iptv-payments, /igaming-premium, /digital-shop-payments, /third-party-cash-app-provider */
main .pd-ready { max-width: 52rem; }
main .pd-ready [class].pd-ready__list { margin: 0; padding: 0; list-style: none; display: grid; gap: .6rem; }
main .pd-ready__list li { position: relative; }
main .pd-ready__list input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-ready__list label { display: grid; grid-template-columns: 1.5rem 1fr; column-gap: .9rem; padding: 1rem 1.2rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1rem; background: #050705; cursor: pointer; transition: border-color .15s; }
main .pd-ready__list label:hover { border-color: rgba(54,210,64,.6); }
main .pd-ready__list label::before { content: ""; grid-row: 1 / 3; width: 1.5rem; height: 1.5rem; margin-top: .1rem; border: 2px solid rgba(255,255,255,.3); border-radius: .45rem; background: center / 70% no-repeat; }
main .pd-ready__list input:checked + label { border-color: #36d240; }
main .pd-ready__list input:checked + label::before { border-color: #36d240; background-color: #36d240; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%2304180a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='M3 8.5l3 3 7-7'/%3E%3C/svg%3E"); }
main .pd-ready__list input:focus-visible + label { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-ready__list label b { font-size: 15.5px; font-weight: 700; color: #fff; }
main .pd-ready__list label span { margin-top: .2rem; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.6); }
main .pd-ready__bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: .35rem; margin-top: 1.25rem; }
main .pd-ready__bar i { height: 6px; border-radius: 999px; background: rgba(255,255,255,.12); }
main .pd-ready:has(#pd-ready-1:checked) .pd-ready__bar i:nth-child(1), main .pd-ready:has(#pd-ready-2:checked) .pd-ready__bar i:nth-child(2), main .pd-ready:has(#pd-ready-3:checked) .pd-ready__bar i:nth-child(3), main .pd-ready:has(#pd-ready-4:checked) .pd-ready__bar i:nth-child(4) { background: #36d240; }
main .pd-ready [class].pd-ready__msg { margin: 1rem 0 0; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.7); }
main .pd-ready__msg--all { display: none; font-weight: 600; color: #fff; }
main .pd-ready:has(#pd-ready-1:checked):has(#pd-ready-2:checked):has(#pd-ready-3:checked):has(#pd-ready-4:checked) .pd-ready__msg--some { display: none; }
main .pd-ready:has(#pd-ready-1:checked):has(#pd-ready-2:checked):has(#pd-ready-3:checked):has(#pd-ready-4:checked) .pd-ready__msg--all { display: block; }
main .pd-ready [class].pd-ready__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 1.5rem; }
main .pd-ready__cta .pill { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.4rem; font-size: 14px; }
main .pd-ready__alt { font-size: 14px; font-weight: 700; color: #fff; text-decoration: underline; text-underline-offset: 3px; }
/* READY_PANEL_V1 (loop5 32): the review checklist on /digital-shop-payments, /iptv-payments, /igaming-premium and
   /third-party-cash-app-provider was a 52rem column with the right of the desktop row empty and an unlabelled bar.
   The bar now counts the ticks (N of 4 ticked, green at 4); from 1024px the bar, verdict and CTA sit in a panel beside the list,
   and with all four ticked the label and the panel edge turn green. */
main .pd-ready { counter-reset: ready; }
main .pd-ready__list input:checked { counter-increment: ready; }
main .pd-ready__bar::before { content: counter(ready) " of 4 ticked"; grid-column: 1 / -1; margin-bottom: .4rem; font-size: 15px; font-weight: 700; color: rgba(255,255,255,.8); font-variant-numeric: tabular-nums; }
main .pd-ready__bar i { transition: background-color .25s; }
main .pd-ready:has(#pd-ready-1:checked):has(#pd-ready-2:checked):has(#pd-ready-3:checked):has(#pd-ready-4:checked) .pd-ready__bar::before { color: #36d240; }
@media (min-width: 1024px) {
  main .pd-ready { max-width: none; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); grid-template-rows: auto auto auto 1fr; column-gap: 2.5rem; }
  main .pd-ready::before { content: ""; grid-column: 2; grid-row: 1 / -1; border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #0a0d0a; transition: border-color .3s; }
  main .pd-ready:has(#pd-ready-1:checked):has(#pd-ready-2:checked):has(#pd-ready-3:checked):has(#pd-ready-4:checked)::before { border-color: rgba(54,210,64,.55); }
  main .pd-ready > .pd-ready__list { grid-column: 1; grid-row: 1 / -1; }
  main .pd-ready > [class]:not(.pd-ready__list) { grid-column: 2; margin-inline: 1.75rem; }
  main .pd-ready > .pd-ready__bar { grid-row: 1; margin-top: 1.75rem; }
  main .pd-ready > .pd-ready__msg { grid-row: 2; }
  main .pd-ready > .pd-ready__cta { grid-row: 3; }
  main .pd-ready > p:last-child { grid-row: 4; align-self: end; margin-bottom: 1.75rem; }
}
@media (prefers-reduced-motion: reduce) {
  main .pd-ready__bar i, main .pd-ready::before { transition: none; }
}
/* ...Features settings lab (it45): real switches drive a hosted-page preview via :has() */
main .pd-setlab { display: grid; grid-template-columns: 1.25fr .85fr; gap: 1.5rem; align-items: start; }
main .pd-phone--live { position: sticky; top: calc(5.5rem + var(--pd-eb, 0px)); max-width: none; }
main .pd-live__b { display: none; }
main .pd-phone [class].pd-live__url { margin-bottom: .9rem; padding: .45rem .75rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; font: 500 11px/1.4 "JetBrains Mono", ui-monospace, monospace; color: rgba(255,255,255,.6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
main .pd-phone [class].pd-live__news { margin: 0 0 .9rem; padding: .4rem .75rem; border-radius: .6rem; background: rgba(54,210,64,.12); font-size: 11px; font-weight: 600; color: #36d240; }
main .pd-live__menu { display: flex; gap: 1rem; margin: .75rem 0 0; padding: 0; list-style: none; }
main .pd-phone [class].pd-live__menu li { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.6); }
main .pd-phone [class].pd-live__promo { margin: .9rem 0 0; padding: .45rem .75rem; border: 1px dashed rgba(54,210,64,.5); border-radius: .6rem; font-size: 12px; font-weight: 700; color: #fff; }
main .pd-phone [class].pd-live__amt { display: none; align-items: baseline; gap: .4rem; padding: .6rem .8rem; border: 1px solid rgba(255,255,255,.2); border-radius: .8rem; font-size: 1.2rem; font-weight: 700; color: rgba(255,255,255,.4); }
main .pd-phone [class].pd-live__amt span:first-child { color: #fff; }
main .pd-phone [class].pd-live__amt small { margin-left: auto; font-size: 11px; font-weight: 500; color: rgba(255,255,255,.45); }
main .pd-phone [class].pd-live__note { margin-top: .6rem !important; padding: .55rem .8rem; border: 1px solid rgba(255,255,255,.15); border-radius: .8rem; font-size: 12px; color: rgba(255,255,255,.4); }
main .pd-live__foot { display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0 0; padding: 0; list-style: none; }
main .pd-phone [class].pd-live__foot li { padding: .25rem .6rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; font-size: 11px; color: rgba(255,255,255,.6); }
main .pd-phone [class].pd-live__foot li::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 .4rem 1px 0; border-radius: 50%; background: #36d240; }
main .pd-setlab:has(#pd-set-1:not(:checked)) .pd-phone__brand .pd-live__a, main .pd-setlab:has(#pd-set-2:not(:checked)) .pd-live__url .pd-live__a, main .pd-setlab:has(#pd-set-9:checked) .pd-phone__amount { display: none; }
main .pd-setlab:has(#pd-set-1:not(:checked)) .pd-phone__brand .pd-live__b, main .pd-setlab:has(#pd-set-2:not(:checked)) .pd-live__url .pd-live__b { display: inline; }
main .pd-setlab:has(#pd-set-1:not(:checked)) .pd-live__avatar { background: rgba(255,255,255,.15); color: #fff; }
main .pd-setlab:has(#pd-set-1:not(:checked)) .pd-phone__pay { background: #fff; }
main .pd-setlab:has(#pd-set-9:checked) .pd-phone [class].pd-live__amt { display: flex; }
main .pd-setlab:has(#pd-set-3:not(:checked)) .pd-live__tg, main .pd-setlab:has(#pd-set-4:not(:checked)) .pd-live__menu, main .pd-setlab:has(#pd-set-5:not(:checked)) .pd-live__promo, main .pd-setlab:has(#pd-set-6:not(:checked)) .pd-live__px, main .pd-setlab:has(#pd-set-7:not(:checked)) .pd-live__news, main .pd-setlab:has(#pd-set-8:not(:checked)) .pd-live__note, main .pd-setlab:has(#pd-set-10:not(:checked)) .pd-live__help, main .pd-setlab:has(#pd-set-11:not(:checked)) .pd-live__sub { display: none; }
main .pd-setlab:has(#pd-set-3:not(:checked)):has(#pd-set-6:not(:checked)):has(#pd-set-10:not(:checked)):has(#pd-set-11:not(:checked)) .pd-live__foot { display: none; }
@media (max-width: 767.98px) { main .pd-setlab { grid-template-columns: 1fr; } main .pd-phone--live { position: static; max-width: 440px; margin: 0; } }
/* LAB_STRIP_V1 (loop5 02): on phones the preview sat above 1,354px of switch rows, so a flip changed a page that had
   scrolled away. The switches are now one swipeable strip of chips pinned under the header while the preview passes
   beneath it; descriptions stay for screen readers (desktop shows them in full). */
@media (max-width: 767.98px) {
  main .pd-set { position: sticky; top: calc(76px + var(--pd-eb, 0px)); z-index: 5; border-radius: 1rem; box-shadow: 0 14px 30px -14px #000; }
  main .pd-set__bar, main .pd-set__ic { display: none; }
  main .pd-set__list { display: flex; gap: .4rem; padding: .5rem 2.5rem .5rem .5rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scroll-padding-inline: .5rem; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); }
  main .pd-set__list::-webkit-scrollbar { display: none; }
  main .pd-set__list li { flex: none; scroll-snap-align: start; }
  main .pd-set__list li + li { border-top: 0; }
  main .pd-set__list label { gap: .55rem; min-height: 44px; padding: 0 .9rem 0 .6rem; border: 1px solid rgba(54,210,64,.35); border-radius: 999px; background-color: rgba(54,210,64,.08); white-space: nowrap; }
  main .pd-set li:has(input:not(:checked)) label { border-color: rgba(255,255,255,.12); background-color: transparent; }
  main .pd-set__t b { font-size: 13.5px; }
  main .pd-set__t small { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  main .pd-set__sw { order: -1; width: 28px; height: 16px; }
  main .pd-set__sw::after { width: 12px; height: 12px; transform: translateX(12px); }
}
/* LAB_SIDE_V1 (loop3 49): 768-1023 stacked the preview above eleven switches, so flipping one changed a page that had
   scrolled out of view (and left a 440px preview beside empty space). Switches left, preview sticky on the right. */
@media (min-width: 768px) and (max-width: 1023px) { main .pd-setlab { grid-template-columns: minmax(0, 1fr) 320px; gap: 1rem; } }
/* ...WordPress plugin setup (it46): step tabs drive an illustrative WP-admin screen */
main .pd-wp { display: grid; grid-template-columns: 1fr 1.15fr; gap: 1.5rem; align-items: start; margin-top: 2.5rem; }
main .pd-wp > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-wp__steps { margin: 0; padding: 0; list-style: none; display: grid; gap: .6rem; counter-reset: none; }
main .pd-wp__steps label { display: block; position: relative; padding: 1.1rem 1.25rem 1.1rem 3.4rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.1rem; background: #050705; cursor: pointer; transition: border-color .2s; }
main .pd-wp__steps label:hover { border-color: rgba(54,210,64,.5); }
main .pd-wp__n { position: absolute; left: 1.1rem; top: 1.15rem; font: 700 12px/1.6 "JetBrains Mono", ui-monospace, monospace; color: #36d240; }
main .pd-wp__steps h3 { margin: 0; font-size: 16px; font-weight: 700; color: #fff; }
main .pd-wp__steps [class] p, main .pd-wp__steps p { margin: .35rem 0 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.6); }
main #pd-wp-1:checked ~ .pd-wp__steps li:nth-child(1) label, main #pd-wp-2:checked ~ .pd-wp__steps li:nth-child(2) label, main #pd-wp-3:checked ~ .pd-wp__steps li:nth-child(3) label { border-color: #36d240; }
main #pd-wp-1:focus-visible ~ .pd-wp__steps li:nth-child(1) label, main #pd-wp-2:focus-visible ~ .pd-wp__steps li:nth-child(2) label, main #pd-wp-3:focus-visible ~ .pd-wp__steps li:nth-child(3) label { outline: 2px solid #fff; outline-offset: 2px; }
main .pd-wp__screen { display: grid; grid-template-columns: 150px 1fr; min-height: 300px; border: 1px solid rgba(255,255,255,.12); border-radius: 1.25rem; background: #050705; overflow: hidden; font-size: 13px; color: #fff; }
main .pd-wp__side { display: flex; flex-direction: column; gap: .2rem; padding: 1rem .75rem; border-right: 1px solid rgba(255,255,255,.08); }
main .pd-wp__side b { margin-bottom: .6rem; padding: 0 .5rem; font-size: 11px; color: rgba(255,255,255,.5); overflow: hidden; text-overflow: ellipsis; }
main .pd-wp__side span { padding: .4rem .6rem; border-radius: .5rem; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.55); }
main #pd-wp-1:checked ~ .pd-wp__screen .pd-wp__side span:nth-of-type(2), main #pd-wp-2:checked ~ .pd-wp__screen .pd-wp__side span:nth-of-type(3), main #pd-wp-3:checked ~ .pd-wp__screen .pd-wp__side span:nth-of-type(4) { background: rgba(54,210,64,.12); color: #36d240; }
main .pd-wp__panes { padding: 1.1rem 1.25rem; }
main .pd-wp__pane { display: none; }
main #pd-wp-1:checked ~ .pd-wp__screen .pd-wp__pane:nth-child(1), main #pd-wp-2:checked ~ .pd-wp__screen .pd-wp__pane:nth-child(2), main #pd-wp-3:checked ~ .pd-wp__screen .pd-wp__pane:nth-child(3) { display: block; }
main .pd-wp__pane [class], main .pd-wp__pane p { margin: 0; }
main .pd-wp__pane p + p, main .pd-wp__pane ul + p, main .pd-wp__pane p + ul { margin-top: .8rem; }
main .pd-wp__pane .pd-wp__crumb { display: flex; align-items: center; gap: .5rem; padding-bottom: .7rem; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 12px; color: rgba(255,255,255,.5); }
main .pd-wp__badge { padding: .1rem .5rem; border-radius: 999px; background: #36d240; font-size: 10px; font-weight: 700; color: #04180a; }
main .pd-wp__pane .pd-wp__drop { display: grid; gap: .15rem; padding: 1rem; border: 1px dashed rgba(255,255,255,.25); border-radius: .8rem; text-align: center; }
main .pd-wp__drop b { font-size: 13px; }
main .pd-wp__drop small { font-size: 11px; color: rgba(255,255,255,.5); }
main .pd-wp__pane .pd-wp__row { display: flex; align-items: center; gap: .5rem; }
main .pd-wp__pane .pd-wp__row--sw { justify-content: space-between; padding: .6rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: .7rem; font-weight: 600; }
main .pd-wp__btn { padding: .4rem .9rem; border: 1px solid rgba(255,255,255,.25); border-radius: .5rem; font-size: 12px; font-weight: 600; }
main .pd-wp__btn--g { border-color: #36d240; background: #36d240; color: #04180a; }
main .pd-wp__pane .pd-wp__ok { display: flex; gap: .5rem; align-items: flex-start; font-size: 12.5px; line-height: 1.5; color: rgba(255,255,255,.75); }
main .pd-wp__pane .pd-wp__ok::before { content: "✓"; flex: none; color: #36d240; font-weight: 700; }
main .pd-wp__list { padding: 0; list-style: none; display: grid; gap: .35rem; }
main .pd-wp__pane .pd-wp__list li { display: flex; align-items: center; gap: .75rem; padding: .5rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: .7rem; font-size: 12.5px; }
main .pd-wp__list i { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; color: #36d240; }
main .pd-wp__list i.pd-wp__dim { color: rgba(255,255,255,.45); }
main .pd-wp__pane .pd-wp__list li.pd-wp__hl { border-color: #36d240; background: rgba(54,210,64,.08); }
main .pd-wp__list--orders li b { font-weight: 600; color: rgba(255,255,255,.6); }
main .pd-wp__sw { position: relative; flex: none; width: 36px; height: 20px; border-radius: 999px; background: #36d240; }
main .pd-wp__sw::after { content: ""; position: absolute; top: 2px; right: 2px; width: 16px; height: 16px; border-radius: 50%; background: #04180a; }
@media (max-width: 767px) { main .pd-wp__pane .pd-wp__list li[class], main .pd-wp__pane .pd-wp__list li, main .pd-wp__pane p[class] { font-size: 12.5px; } main .pd-wp__pane p[class].pd-wp__crumb { font-size: 12px; } main .pd-wp__steps li[class] p, main .pd-wp__steps p[class] { font-size: 14px; } }
@media (max-width: 1023px) { main .pd-wp { grid-template-columns: 1fr; } main .pd-wp__screen { order: -1; } }
@media (max-width: 639px) { main .pd-wp__screen { grid-template-columns: 1fr; } main .pd-wp__side { flex-direction: row; flex-wrap: wrap; align-items: center; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); } main .pd-wp__side b { width: 100%; margin-bottom: .3rem; } }
/* ...Pricing: security-deposit lifecycle (it47) reuses .pd-flow inside the pp-* page */
main [class].pd-flow--dep { margin: 1.5rem 0 1rem; }
/* ...API page: create-invoice request in 5 languages (it49), same radio-tab trick as .pd-code */
main .pd-req { position: relative; }
main .pd-req > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-req__tabs { display: flex; flex-wrap: wrap; gap: .3rem; margin-left: auto; }
main .pd-req__tabs label { cursor: pointer; padding: .25rem .6rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; font: 700 11px/1.4 Inter, system-ui, sans-serif; color: rgba(255,255,255,.6); }
main .pd-req__tabs label:hover { border-color: rgba(54,210,64,.6); color: #fff; }
main #pd-req-1:checked ~ div .pd-req__tabs label:nth-child(1), main #pd-req-2:checked ~ div .pd-req__tabs label:nth-child(2), main #pd-req-3:checked ~ div .pd-req__tabs label:nth-child(3), main #pd-req-4:checked ~ div .pd-req__tabs label:nth-child(4), main #pd-req-5:checked ~ div .pd-req__tabs label:nth-child(5) { border-color: #36d240; background: #36d240; color: #04180a; }
main .pd-req > input:focus-visible ~ div .pd-req__tabs { outline: 2px solid #36d240; outline-offset: 3px; border-radius: 999px; }
main .pd-req__panes pre { display: none; font-variant-ligatures: none; white-space: pre; overflow-wrap: normal; }
main #pd-req-1:checked ~ .pd-req__panes pre:nth-child(1), main #pd-req-2:checked ~ .pd-req__panes pre:nth-child(2), main #pd-req-3:checked ~ .pd-req__panes pre:nth-child(3), main #pd-req-4:checked ~ .pd-req__panes pre:nth-child(4), main #pd-req-5:checked ~ .pd-req__panes pre:nth-child(5) { display: block; }
/* ...Home payouts (it51): rule tiles + an illustrative withdrawal-request mock */
main .pd-wd { display: grid; grid-template-columns: 1.4fr 1fr; gap: 2.5rem; align-items: center; }
main .pd-wd__facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: .6rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
main .pd-wd [class].pd-wd__facts li, main .pd-wd__facts li { display: grid; gap: .15rem; padding: .8rem .95rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; background: #050705; font-size: 12.5px; line-height: 1.45; color: rgba(255,255,255,.6); }
main .pd-wd__facts b { font-size: 15px; font-weight: 800; letter-spacing: -.01em; color: #fff; }
main .pd-phone--wd { max-width: 400px; margin: 0; }
main .pd-wd__rec { display: grid; gap: .45rem; margin: 1rem 0 0; }
main .pd-wd__rec div { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; font-size: 13px; }
main .pd-wd__rec div:nth-child(2) { padding: .6rem .8rem; border: 1px solid #36d240; border-radius: .8rem; background: rgba(54,210,64,.08); }
main .pd-wd__rec dt { color: rgba(255,255,255,.55); }
main .pd-wd [class].pd-wd__rec dd, main .pd-wd__rec dd { margin: 0; font-weight: 700; color: #fff; text-align: right; }
main .pd-wd__rec div:nth-child(2) dd { font-size: 1.15rem; }
main .pd-wd__rec div:nth-child(3) dd, main .pd-wd__rec div:nth-child(4) dd { font-weight: 500; font-size: 12px; color: rgba(255,255,255,.7); }
main .pd-wd__addr { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; }
main .pd-wd__addr small { font-family: Inter, system-ui, sans-serif; font-weight: 400; color: rgba(255,255,255,.45); }
main .pd-wd__steps { display: flex; gap: .4rem; margin: 1rem 0 0; padding: 0; list-style: none; counter-reset: wd; }
main .pd-wd [class].pd-wd__steps li, main .pd-wd__steps li { flex: 1; padding: .45rem .3rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; font-size: 11.5px; font-weight: 700; text-align: center; color: rgba(255,255,255,.45); }
main .pd-wd__steps li.is-on { border-color: #36d240; background: rgba(54,210,64,.12); color: #36d240; }
main .pd-wd__steps li.is-on::before { content: "✓ "; }
@media (max-width: 1023px) { main .pd-wd { grid-template-columns: 1fr; } main .pd-phone--wd { max-width: 440px; } }
@media (max-width: 767px) { main .pd-wd__rec div[class], main .pd-wd__rec dt, main .pd-wd__rec dd[class], main .pd-wd__rec div dd { font-size: 13px; } main .pd-wd__rec div:nth-child(2) dd { font-size: 1.1rem; } main .pd-wd__rec div:nth-child(3) dd, main .pd-wd__rec div:nth-child(4) dd { font-size: 12px; } main .pd-wd__addr, main .pd-wd__addr small { font-size: 12px; } main .pd-wd__steps li[class], main .pd-wd__steps li { font-size: 11px; white-space: nowrap; padding: .45rem .2rem; } main .pd-wd [class].pd-phone__status, main .pd-wd .pd-phone__status { font-size: 12px; } main .pd-phone--wd .pd-phone__lock { white-space: nowrap; } }
@media (max-width: 480px) { main .pd-wd__facts { grid-template-columns: 1fr; } }
/* ...Features hero dash (it54): 24h / 7d / 30d sample range switch, CSS-only */
main .pd-dash__range { display: inline-flex; gap: .15rem; padding: .15rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; }
main .pd-dash__range label { padding: .15rem .55rem; border-radius: 999px; font-size: 11px; font-weight: 700; color: rgba(255,255,255,.5); cursor: pointer; }
main .pd-phone--dash:has(#pd-dr-1:checked) label[for="pd-dr-1"], main .pd-phone--dash:has(#pd-dr-2:checked) label[for="pd-dr-2"], main .pd-phone--dash:has(#pd-dr-3:checked) label[for="pd-dr-3"] { background: #36d240; color: #050705; }
main .pd-phone--dash:not(:has(#pd-dr-1:checked)) .pd-dash__stats--r1, main .pd-phone--dash:not(:has(#pd-dr-2:checked)) .pd-dash__stats--r2, main .pd-phone--dash:not(:has(#pd-dr-3:checked)) .pd-dash__stats--r3 { display: none; }
main .pd-phone--dash .sr-only:focus-visible + .pd-phone__bar .pd-dash__range, main .pd-phone--dash:has(.sr-only:focus-visible) .pd-dash__range { outline: 2px solid #36d240; outline-offset: 2px; }
/* ...Pricing reserves (it55): illustrative balance breakdown — available / on hold / reserve / deposit */
main .pd-bal { display: grid; grid-template-columns: 1.1fr .9fr; gap: 2rem; align-items: center; margin: 1.25rem 0 1.5rem; }
main .pd-bal__key { display: grid; gap: .55rem; margin: 1rem 0 0; padding: 0; list-style: none; }
main .pd-bal [class].pd-bal__key li, main .pd-bal__key li { display: block; font-size: 13.5px; line-height: 1.45; color: rgba(255,255,255,.65); }
main .pd-bal__key b { color: #fff; margin-right: .25rem; }
main .pd-bal__key li > i { margin-right: .5rem; vertical-align: -1px; }
main .pd-bal i.is-av, main .pd-bal i.is-hold, main .pd-bal i.is-res, main .pd-bal i.is-dep { display: inline-block; flex: none; width: .65rem; height: .65rem; border-radius: 2px; background: #36d240; }
main .pd-bal i.is-hold { background: rgba(255,255,255,.55); }
main .pd-bal i.is-res { background: rgba(255,255,255,.22); }
main .pd-bal i.is-dep { background: transparent; border: 1.5px solid #36d240; }
main .pd-phone--bal { margin: 0; max-width: 400px; }
main .pd-bal__bar { display: flex; gap: 3px; height: .9rem; margin: 1rem 0 0; }
main .pd-bal__bar i { display: block; height: 100%; width: auto; border-radius: 3px; }
main .pd-bal__rows { display: grid; gap: .5rem; margin: 1rem 0 0; }
main .pd-bal__rows div { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; font-size: 13px; }
main .pd-bal__rows dt { display: flex; align-items: baseline; gap: .5rem; color: rgba(255,255,255,.75); }
main .pd-bal__rows dt small { font-size: 11px; color: rgba(255,255,255,.45); }
main .pd-bal [class].pd-bal__rows dd, main .pd-bal__rows dd { margin: 0; font-weight: 700; color: #fff; font-variant-numeric: tabular-nums; }
main .pd-bal__rows .pd-bal__dep { margin-top: .4rem; padding-top: .7rem; border-top: 1px dashed rgba(255,255,255,.15); }
main .pd-bal__rows .pd-bal__dep dd { color: #36d240; }
@media (max-width: 1023px) { main .pd-bal { grid-template-columns: 1fr; } main .pd-phone--bal { max-width: 440px; } }
@media (max-width: 767px) { main .pd-bal [class].pd-bal__key li, main .pd-bal__key li { font-size: 13.5px; } main .pd-bal__rows div[class], main .pd-bal__rows div, main .pd-bal__rows div dd { font-size: 13px; } main .pd-bal [class].pd-phone__status, main .pd-bal .pd-phone__status { font-size: 12px; } }
/* ...Changelog (it56): "which version are you on" picker, CSS-only */
/* VER_PILLS_V1 (loop5 27): the version picker was a squared tab strip with an empty "Select a version above." box under it.
   Versions are pills on a track (the picked one fills green with a tick), and the answer rises in when picked. Still radios + :has(). */
main .pd-ver { border: 1px solid rgba(255,255,255,.1); border-radius: 1.75rem; background: #050705; overflow: hidden; }
main .pd-ver__pick { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; padding: .6rem; border-bottom: 1px solid rgba(255,255,255,.08); }
main .pd-ver__pick label { display: flex; align-items: center; justify-content: center; gap: .45rem; min-height: 48px; padding: .6rem .9rem; border: 1px solid rgba(255,255,255,.1); border-radius: 9999px; background: rgba(255,255,255,.03); font-size: 14px; font-weight: 700; text-align: center; color: rgba(255,255,255,.7); cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, transform .15s, box-shadow .2s; }
main .pd-ver__pick label:hover { border-color: rgba(54,210,64,.45); color: #fff; }
main .pd-ver__pick label:active { transform: scale(.97); }
main .pd-ver__pick label::before { content: ""; width: 0; height: .5rem; margin-top: -.2rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0; transition: width .2s, opacity .2s; }
main .pd-ver:has(#pd-ver-1:checked) label[for="pd-ver-1"], main .pd-ver:has(#pd-ver-2:checked) label[for="pd-ver-2"], main .pd-ver:has(#pd-ver-3:checked) label[for="pd-ver-3"], main .pd-ver:has(#pd-ver-4:checked) label[for="pd-ver-4"] { border-color: #36d240; background: #36d240; color: #050705; box-shadow: 0 10px 26px -12px rgba(54,210,64,.75); }
main .pd-ver:has(#pd-ver-1:checked) label[for="pd-ver-1"]::before, main .pd-ver:has(#pd-ver-2:checked) label[for="pd-ver-2"]::before, main .pd-ver:has(#pd-ver-3:checked) label[for="pd-ver-3"]::before, main .pd-ver:has(#pd-ver-4:checked) label[for="pd-ver-4"]::before { width: .28rem; opacity: 1; }
main .pd-ver:has(#pd-ver-1:focus-visible) label[for="pd-ver-1"], main .pd-ver:has(#pd-ver-2:focus-visible) label[for="pd-ver-2"], main .pd-ver:has(#pd-ver-3:focus-visible) label[for="pd-ver-3"], main .pd-ver:has(#pd-ver-4:focus-visible) label[for="pd-ver-4"] { outline: 2px solid #36d240; outline-offset: 3px; }
main .pd-ver__out { padding: 1.5rem 1.75rem; }
main .pd-ver [class].pd-ver__hint, main .pd-ver__hint { margin: 0; font-size: 14px; color: rgba(255,255,255,.5); }
main .pd-ver:has(input:checked) .pd-ver__hint, main .pd-ver__a { display: none; }
main .pd-ver:has(#pd-ver-1:checked) .pd-ver__a--1, main .pd-ver:has(#pd-ver-2:checked) .pd-ver__a--2, main .pd-ver:has(#pd-ver-3:checked) .pd-ver__a--3, main .pd-ver:has(#pd-ver-4:checked) .pd-ver__a--4 { display: grid; gap: .75rem; justify-items: start; }
@media (prefers-reduced-motion: no-preference) { main .pd-ver:has(input:checked) .pd-ver__a { animation: pd-ver-in .3s ease-out; } }
@keyframes pd-ver-in { from { opacity: 0; transform: translateY(8px); } }
main .pd-ver__a b { font-size: 17px; color: #fff; }
main .pd-ver__a--2 b { color: #36d240; }
main .pd-ver__go { font-size: 14px; font-weight: 700; color: #36d240; text-decoration: underline; text-underline-offset: 3px; }
main .pd-ver__go:hover { color: #fff; }
main .pd-ver [class].pd-ver__a p, main .pd-ver__a p { margin: 0; max-width: 42rem; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.65); }
@media (max-width: 639px) { main .pd-ver__pick { grid-template-columns: 1fr 1fr; } main .pd-ver__out { padding: 1.25rem; } }
@media (prefers-reduced-motion: reduce) { main .pd-ver__pick label { transition: none; } main .pd-ver__pick label:active { transform: none; } }
/* ...Acceptable use (it57): three-lane map before section 1 */
main .pd-aup { margin-top: 2rem; }
main .pd-aup__t { margin: 0; font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; color: #fff; }
main .pd-aup [class].pd-aup__l, main .pd-aup__l { margin: .4rem 0 0; font-size: 13.5px; color: rgba(255,255,255,.55); }
main .pd-aup__lanes { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; margin-top: 1.1rem; }
main .pd-aup__lane { display: flex; flex-direction: column; padding: 1.2rem 1.25rem; border: 1px solid rgba(255,255,255,.12); border-top-width: 4px; border-radius: 1.25rem; background: #050705; }
main .pd-aup__lane.is-ok { border-top-color: #36d240; }
main .pd-aup__lane.is-rev { border-top-color: rgba(255,255,255,.55); }
main .pd-aup__lane.is-no { border-top-color: rgba(255,255,255,.2); }
main .pd-aup__lane h3 { margin: 0; font-size: 15px; font-weight: 800; color: #fff; }
main .pd-aup__lane.is-ok h3 { color: #36d240; }
main .pd-aup__lane.is-no h3 { text-decoration: line-through; text-decoration-color: rgba(255,255,255,.4); text-decoration-thickness: 2px; }
main .pd-aup [class].pd-aup__lane p, main .pd-aup__lane p { margin: .5rem 0 0; font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.6); }
main .pd-aup__lane ul { margin: .8rem 0 0; padding: 0; list-style: none; display: grid; gap: .35rem; }
main .pd-aup [class].pd-aup__lane li, main .pd-aup__lane li { position: relative; padding-left: 1rem; font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.8); }
main .pd-aup__lane li::before { content: ""; position: absolute; left: 0; top: .55em; width: .35rem; height: .35rem; border-radius: 50%; background: currentColor; opacity: .5; }
main .pd-aup__lane.is-ok li::before { background: #36d240; opacity: 1; }
main .pd-aup__lane.is-no li { color: rgba(255,255,255,.55); }
main .pd-aup__lane a { margin-top: auto; padding-top: .9rem; font-size: 13px; font-weight: 700; color: #36d240; }
main .pd-aup__lane a:hover { color: #fff; }
main .pd-aup [class].pd-aup__n, main .pd-aup__n { margin: 1rem 0 0; font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.5); }
main .pd-aup__n a { color: #36d240; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 767px) { main .pd-aup__lanes { grid-template-columns: 1fr; } }
main .pd-unlock__copy { flex: none; padding: .35rem .7rem; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; font-size: 12px; color: rgba(255,255,255,.75); }

/* API hero: the real exchange (create-invoice → payment_url → signed webhook) as a terminal pane, replacing the generic route card */
main .pd-term { max-width: 520px; margin: 0 auto; border: 1px solid rgba(255,255,255,.12); border-radius: 1.5rem; background: #050705; overflow: hidden; }
main .pd-term__bar { display: flex; align-items: center; gap: .75rem; padding: .7rem 1rem; border-bottom: 1px solid rgba(255,255,255,.08); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; color: rgba(255,255,255,.5); }
main .pd-term__dots { display: inline-flex; gap: 5px; }
main .pd-term__dots i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.18); }
main .pd-term__pre { margin: 0; padding: 1.1rem 1.1rem 1.25rem; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12.5px; line-height: 1.6; color: rgba(255,255,255,.85); white-space: pre-wrap; overflow-wrap: anywhere; }
main .pd-term__pre .pd-term__c { color: rgba(255,255,255,.45); }
main .pd-term__pre .pd-term__k { color: #36d240; font-weight: 700; }
@media (max-width: 639px) { main .pd-term__pre { font-size: 11px; padding: 1rem .9rem; white-space: pre; overflow-x: auto; } }

/* Agent links hero: a chat where the agent drops the link and the paid line comes back attributed (was the generic route card) */
main .pd-chat { max-width: 400px; margin: 0 auto; padding: 1rem 1rem 1.25rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1.5rem; background: #050705; color: #fff; }
main .pd-chat__bar { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding-bottom: .9rem; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 13px; font-weight: 700; }
main .pd-chat__who { display: flex; align-items: center; gap: .5rem; }
main .pd-chat__who small { font-size: 11px; font-weight: 400; color: rgba(255,255,255,.5); }
main .pd-chat__avatar { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #36d240; color: #04180a; font-size: 12px; }
main .pd-chat__tag { font-size: 11px; font-weight: 400; color: rgba(255,255,255,.5); }
main .pd-chat [class].pd-chat__log { margin: 1rem 0 0; padding: 0; list-style: none; display: grid; gap: .6rem; }
main .pd-chat [class].pd-chat__msg { max-width: 82%; padding: .6rem .85rem; border-radius: 1rem 1rem 1rem .25rem; background: rgba(255,255,255,.08); font-size: 14px; line-height: 1.5; }
main .pd-chat [class].pd-chat__msg.is-agent { justify-self: end; border-radius: 1rem 1rem .25rem 1rem; background: rgba(54,210,64,.14); }
main .pd-chat__link { display: block; margin-top: .5rem; padding: .55rem .7rem; border: 1px solid rgba(54,210,64,.4); border-radius: .75rem; background: #050705; }
main .pd-chat__url { display: block; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 500; color: #36d240; text-decoration: underline; text-underline-offset: 2px; }
main .pd-chat__link small { display: block; margin-top: .25rem; font-size: 11px; color: rgba(255,255,255,.55); }
main .pd-chat [class].pd-chat__sys { display: flex; gap: .6rem; align-items: flex-start; margin-top: .4rem; padding: .7rem .85rem; border: 1px solid #36d240; border-radius: 1rem; font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.7); }
main .pd-chat__sys strong { color: #fff; }
main .pd-chat__sys .ic { flex: none; margin-top: .15rem; font-size: 16px; color: #36d240; }
@media (max-width: 639px) { main .pd-chat [class].pd-chat__msg { max-width: 90%; } }

/* iGaming premium cost sheet: one table fed by the live plan data, Premium column highlighted */
main .pd-cost__h { font-size: 1.5rem; line-height: 1.2; }
@media (min-width: 640px) { main .pd-cost__h { font-size: 1.75rem; } }
main .pd-cost { margin-top: 1.5rem; overflow-x: auto; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #050705; -webkit-overflow-scrolling: touch; }
main .pd-cost__t { width: 100%; min-width: 760px; border-collapse: collapse; text-align: left; font-size: 14px; }
main .pd-cost__t th, main .pd-cost__t td { padding: .9rem 1rem; border-bottom: 1px solid rgba(255,255,255,.07); vertical-align: top; }
main .pd-cost__t tbody tr:last-child th, main .pd-cost__t tbody tr:last-child td { border-bottom: 0; }
main .pd-cost__t thead th { font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap; }
main .pd-cost__t thead th:first-child { color: rgba(255,255,255,.5); font-weight: 600; }
main .pd-cost__t thead th small { display: block; margin-top: .15rem; font-size: 11px; font-weight: 500; color: #36d240; }
main .pd-cost__t tbody th { font-weight: 600; color: rgba(255,255,255,.75); min-width: 200px; }
main .pd-cost__t tbody th small { display: block; margin-top: .15rem; font-size: 12px; font-weight: 400; color: rgba(255,255,255,.45); }
main .pd-cost__t tbody td { font-weight: 700; color: #fff; white-space: nowrap; }
main .pd-cost__t tbody td.is-all { font-weight: 500; color: rgba(255,255,255,.75); white-space: normal; }
main .pd-cost__t .is-on { background: rgba(54,210,64,.07); border-left: 1px solid rgba(54,210,64,.35); border-right: 1px solid rgba(54,210,64,.35); }
main .pd-cost__t thead .is-on { border-top: 1px solid rgba(54,210,64,.35); border-radius: .5rem .5rem 0 0; }
main .pd-fine { margin-top: 1.25rem; border-top: 1px solid rgba(255,255,255,.08); padding-top: 1rem; }
main .pd-fine summary { cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; color: #36d240; }
main .pd-fine summary::-webkit-details-marker { display: none; }
main .pd-fine summary::before { content: "+"; display: inline-block; width: 1.1rem; font-weight: 700; }
main .pd-fine[open] summary::before { content: "\2013"; }
main .pd-fine p { margin-top: 1rem; }
main .pd-cost__t tbody th, main .pd-cost__t thead th:first-child { position: sticky; left: 0; z-index: 1; background: #050705; box-shadow: 1px 0 0 rgba(255,255,255,.07); }
main :is(.card, .reveal-now) [class].pd-cost__hint { display: none; margin-top: .6rem; font-size: 12px; color: rgba(255,255,255,.45); }
@media (max-width: 767px) { main :is(.card, .reveal-now) [class].pd-cost__hint { display: block; } }
/* ...AML/CFT (it58): payment-chain flow + glance before section 1 */
main .pd-chain { margin-top: 2rem; }
main .pd-chain__t { margin: 0 0 1rem; font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; color: #fff; }
main [class].pd-flow--chain { grid-template-columns: 1fr; gap: 2rem; margin: 0; }
main .pd-flow--chain .pd-flow__n { grid-template-columns: auto 9.5rem 1fr; align-items: baseline; column-gap: 1rem; }
main .pd-flow--chain .pd-flow__n > :not(b) { grid-column: 3; }
main .pd-chain .pd-glance { margin-top: 1.25rem; }
@media (max-width: 639px) { main .pd-flow--chain .pd-flow__n { grid-template-columns: auto 1fr; column-gap: .7rem; } main .pd-flow--chain .pd-flow__n > :not(b) { grid-column: 1 / -1; } }
/* ...hero version (how-to guide): four ways side by side, PD CASH columns highlighted, fits the hero column */
main .pd-cost--hero { margin-top: 0; border-radius: 2rem; }
main .pd-cost--hero .pd-cost__t { min-width: 0; font-size: 12px; }
main .pd-cost--hero .pd-cost__t th, main .pd-cost--hero .pd-cost__t td { padding: .65rem .6rem; }
main .pd-cost--hero .pd-cost__t tbody th { min-width: 0; font-size: 12px; }
main .pd-cost--hero .pd-cost__t tbody td { font-weight: 600; white-space: normal; color: rgba(255,255,255,.8); }
main .pd-cost--hero .pd-cost__t tbody td.is-on { color: #fff; }
main .pd-cost--hero .pd-cost__t thead th { white-space: normal; }
main .pd-cost--hero .pd-cost__t thead th small { font-size: 10px; }
/* WAYS_PICK_V1: phones see the hero table one way at a time, picked with four radio buttons above it (pd-who pattern, no JS); Hosted link first */
main .pd-cost__r, main .pd-cost__pick { display: none; }
@keyframes pd-cost-in { from { opacity: 0; } }
@media (max-width: 639px) {
  main .pd-cost__r { display: block; position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
  main .pd-cost__pick { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; gap: .5rem; margin-bottom: .75rem; }
  main .pd-cost__pick label { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem .9rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; color: rgba(255,255,255,.72); font-size: 13px; font-weight: 600; line-height: 1.2; text-align: center; cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, transform .15s; }
  main .pd-cost__pick label.is-on { border-color: rgba(54,210,64,.4); }
  main .pd-cost__pick label:active { transform: scale(.97); }
  #pd-way-2:checked ~ .pd-cost__pick [for="pd-way-2"], #pd-way-3:checked ~ .pd-cost__pick [for="pd-way-3"] { background: #fff; border-color: #fff; color: #050705; }
  #pd-way-4:checked ~ .pd-cost__pick [for="pd-way-4"], #pd-way-5:checked ~ .pd-cost__pick [for="pd-way-5"] { background: #36d240; border-color: #36d240; color: #050705; }
  #pd-way-2:focus-visible ~ .pd-cost__pick [for="pd-way-2"], #pd-way-3:focus-visible ~ .pd-cost__pick [for="pd-way-3"], #pd-way-4:focus-visible ~ .pd-cost__pick [for="pd-way-4"], #pd-way-5:focus-visible ~ .pd-cost__pick [for="pd-way-5"] { outline: 2px solid #36d240; outline-offset: 2px; }
  main .pd-cost--hero .pd-cost__t { table-layout: fixed; font-size: 13px; }
  main .pd-cost--hero .pd-cost__t :is(th, td) { padding: .75rem .9rem; }
  main .pd-cost--hero .pd-cost__t th:first-child { width: 44%; }
  main .pd-cost--hero tr > :not(:first-child) { display: none; }
  #pd-way-2:checked ~ .pd-cost--hero tr > :nth-child(2), #pd-way-3:checked ~ .pd-cost--hero tr > :nth-child(3), #pd-way-4:checked ~ .pd-cost--hero tr > :nth-child(4), #pd-way-5:checked ~ .pd-cost--hero tr > :nth-child(5) { display: table-cell; animation: pd-cost-in .25s ease; }
}
@media (max-width: 639px) and (prefers-reduced-motion: reduce) { main .pd-cost--hero tr > * { animation: none; } }
@media (max-width: 639px) { main .pd-cost__t { font-size: 13px; } main .pd-cost__t th, main .pd-cost__t td { padding: .75rem .8rem; } main .pd-cost__t tbody th { min-width: 160px; } }

/* ---------- 7. Viewport fixes ---------- */

/* lg 1024-1279: hero copy column wider so the h1 does not wrap to 4 lines */
@media (min-width: 1024px) and (max-width: 1279px) {
  main .grid[class~="lg:grid-cols-[1.1fr_1fr]"] { grid-template-columns: 1.35fr 1fr; column-gap: 2.5rem; }
}

/* 320-359px: hero feature pills push the main button off the first screen */
@media (max-width: 359px) { main .reveal-now > .mt-7.flex.flex-wrap.gap-2 { display: none; } }

/* Phone landscape: header, breadcrumb and hero fit one short screen; no bottom bar */
@media (orientation: landscape) and (max-height: 500px) {
  #navShell { height: 52px; margin-top: 6px; }
  nav[aria-label="Breadcrumb"] > ol { padding-top: 4.25rem; padding-bottom: .5rem; }
  main > section:first-child { padding-top: 4.75rem; padding-bottom: 2.5rem; }
  nav[aria-label="Breadcrumb"] ~ main > section:first-child { padding-top: 1.5rem; }
  main > section:first-child h1.display { font-size: 2rem; }
  main > section:first-child h1.display + p { margin-top: 1rem; }
  main > section:first-child .mt-9 { margin-top: 1.5rem; }
  main > section.min-h-\[70vh\] { min-height: 0; }
  main .reveal-now > .mt-7.flex.flex-wrap.gap-2 { display: none; }
  body #mobileCta { display: none; }
}/* ...Disclaimer (it59): "is / is not" ledger before section 1 */
main .pd-isnt { margin-top: 2rem; }
main .pd-isnt__t { margin: 0 0 1rem; font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; color: #fff; }
main .pd-isnt__cols { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
main .pd-isnt__col { padding: 1.2rem 1.25rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1.25rem; background: #050705; }
main .pd-isnt__col.is-yes { border-color: rgba(54,210,64,.45); }
main .pd-isnt__col h3 { margin: 0; font-size: 15px; font-weight: 800; color: #fff; }
main .pd-isnt__col.is-yes h3 { color: #36d240; }
main .pd-isnt__col ul { margin: .8rem 0 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
main .pd-isnt [class].pd-isnt__col li, main .pd-isnt__col li { position: relative; padding-left: 1.4rem; font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.75); }
main .pd-isnt__col li::before { position: absolute; left: 0; top: 0; font-weight: 800; }
main .pd-isnt__col.is-yes li::before { content: "✓"; color: #36d240; }
main .pd-isnt__col.is-no li::before { content: "✕"; color: rgba(255,255,255,.4); }
main .pd-isnt__col a, main .pd-isnt__n a { color: #36d240; text-decoration: underline; text-underline-offset: 2px; }
main .pd-isnt [class].pd-isnt__n, main .pd-isnt__n { margin: 1rem 0 0; font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.5); }
@media (max-width: 639px) { main .pd-isnt__cols { grid-template-columns: 1fr; } }
/* ...Digital goods (it60): product-type picker → delivery mock, CSS-only */
main .pd-dg { display: grid; grid-template-columns: 1.25fr .85fr; gap: 2rem; align-items: start; }
main .pd-dg__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
main .pd-dg__card { cursor: pointer; border: 1px solid rgba(255,255,255,.1); transition: border-color .15s; }
main .pd-dg .sr-only:checked + .pd-dg__card { border-color: #36d240; }
main .pd-dg .sr-only:focus-visible + .pd-dg__card { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-dg__side { position: sticky; top: calc(5.5rem + var(--pd-eb, 0px)); }
main .pd-phone--dg { max-width: 400px; }
main .pd-dg__pane { display: none; }
main .pd-dg:has(#pd-dg-1:checked) .pd-dg__pane--1, main .pd-dg:has(#pd-dg-2:checked) .pd-dg__pane--2, main .pd-dg:has(#pd-dg-3:checked) .pd-dg__pane--3, main .pd-dg:has(#pd-dg-4:checked) .pd-dg__pane--4, main .pd-dg:has(#pd-dg-5:checked) .pd-dg__pane--5, main .pd-dg:has(#pd-dg-6:checked) .pd-dg__pane--6 { display: block; }
/* DG_PICK_V1 (loop5 34): below 1024px the delivery mock sat above the six cards, so a tap changed a screen that had
   scrolled out of view. The cards become pills (picked = green fill with a tick, like .pd-ask) with the mock right under
   them. Everywhere the hover edge works again (the .card hover reset beat it), the picked card's icon fills green and
   the mock rises in on switch. */
main .pd-dg__card.card:hover { border-color: rgba(54,210,64,.45); }
main .pd-dg__card > span { transition: background-color .2s, color .2s; }
main .pd-dg .sr-only:checked + .pd-dg__card { background: linear-gradient(180deg, #0f1a10, #0a0d0a); }
main .pd-dg .sr-only:checked + .pd-dg__card > span { background: #36d240; color: #050705; }
@media (prefers-reduced-motion: no-preference) { main .pd-dg__pane { animation: pd-ver-in .3s ease-out; } }
@media (max-width: 1023px) {
  main .pd-dg { grid-template-columns: 1fr; gap: 1.25rem; }
  main .pd-dg__side { position: static; }
  main .pd-phone--dg { margin: 0 auto; }
  main .pd-dg__grid { grid-template-columns: repeat(3, 1fr); gap: .5rem; }
  main .pd-dg [class].pd-dg__card { justify-content: center; min-height: 48px; padding: .55rem 1rem .55rem 1.6rem; border-radius: 9999px; background: rgba(255,255,255,.03); text-align: center; transition: background-color .2s, border-color .2s; }
  main .pd-dg__card > span, main .pd-dg [class].pd-dg__card p[class] { display: none; }
  main .pd-dg [class].pd-dg__card h3 { font-size: 14px; line-height: 1.25; color: rgba(255,255,255,.75); }
  main .pd-dg__card::before { content: ""; position: absolute; left: .85rem; top: 50%; width: 0; height: .5rem; margin-top: -.3rem; border: solid #050705; border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0; transition: width .2s, opacity .2s; }
  main .pd-dg .sr-only:checked + [class].pd-dg__card { background: #36d240; }
  main .pd-dg .sr-only:checked + .pd-dg__card::before { width: .28rem; opacity: 1; }
  main .pd-dg .sr-only:checked + .pd-dg__card h3[class] { color: #050705; }
}
@media (max-width: 639px) { main .pd-dg__grid { grid-template-columns: 1fr 1fr; } main .pd-dg [class].pd-dg__card h3 { font-size: 13px; } }
@media (prefers-reduced-motion: reduce) { main .pd-dg [class].pd-dg__card, main .pd-dg__card > span, main .pd-dg__card::before { transition: none; } }

/* ASK_PILLS_V1 (loop5 30): the "pick one" picker (6 pages) was a squared cell grid with a ring around the whole grid. The
   choices are pills on a track like .pd-ver: hover tints the border, a tap presses in, the picked one fills green with a tick
   (no reflow) and its ring, and the answer rises in with its verdict on a coloured edge (green yes, rose no). Still radios + :has(). */
main .pd-ask { border: 1px solid rgba(255,255,255,.1); border-radius: 1.75rem; background: #050705; overflow: hidden; }
main .pd-ask [class].pd-ask__t, main .pd-ask__t { margin: 0; padding: 1.1rem 1.5rem .9rem; font-size: 15px; font-weight: 700; color: #36d240; }
main .pd-ask__pick { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; padding: .6rem; border-block: 1px solid rgba(255,255,255,.08); }
main .pd-ask__pick label { position: relative; display: flex; align-items: center; justify-content: center; min-height: 48px; padding: .55rem 1.5rem; border: 1px solid rgba(255,255,255,.1); border-radius: 9999px; background: rgba(255,255,255,.03); font-size: 14px; font-weight: 700; line-height: 1.25; text-align: center; color: rgba(255,255,255,.7); cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, transform .15s, box-shadow .2s; }
main .pd-ask__pick label:hover { border-color: rgba(54,210,64,.45); color: #fff; }
main .pd-ask__pick label:active { transform: scale(.97); }
main .pd-ask__pick label::before { content: ""; position: absolute; left: .9rem; top: 50%; width: 0; height: .5rem; margin-top: -.3rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); opacity: 0; transition: width .2s, opacity .2s; }
main .pd-ask:has(#pd-ask-1:checked) label[for="pd-ask-1"], main .pd-ask:has(#pd-ask-2:checked) label[for="pd-ask-2"], main .pd-ask:has(#pd-ask-3:checked) label[for="pd-ask-3"], main .pd-ask:has(#pd-ask-4:checked) label[for="pd-ask-4"], main .pd-ask:has(#pd-ask-5:checked) label[for="pd-ask-5"], main .pd-ask:has(#pd-ask-6:checked) label[for="pd-ask-6"] { border-color: #36d240; background: #36d240; color: #050705; box-shadow: 0 10px 26px -12px rgba(54,210,64,.75); }
main .pd-ask:has(#pd-ask-1:checked) label[for="pd-ask-1"]::before, main .pd-ask:has(#pd-ask-2:checked) label[for="pd-ask-2"]::before, main .pd-ask:has(#pd-ask-3:checked) label[for="pd-ask-3"]::before, main .pd-ask:has(#pd-ask-4:checked) label[for="pd-ask-4"]::before, main .pd-ask:has(#pd-ask-5:checked) label[for="pd-ask-5"]::before, main .pd-ask:has(#pd-ask-6:checked) label[for="pd-ask-6"]::before { width: .28rem; opacity: 1; }
main .pd-ask:has(#pd-ask-1:focus-visible) label[for="pd-ask-1"], main .pd-ask:has(#pd-ask-2:focus-visible) label[for="pd-ask-2"], main .pd-ask:has(#pd-ask-3:focus-visible) label[for="pd-ask-3"], main .pd-ask:has(#pd-ask-4:focus-visible) label[for="pd-ask-4"], main .pd-ask:has(#pd-ask-5:focus-visible) label[for="pd-ask-5"], main .pd-ask:has(#pd-ask-6:focus-visible) label[for="pd-ask-6"] { outline: 2px solid #36d240; outline-offset: 3px; }
main .pd-ask__out { padding: 1.5rem 1.5rem 1.25rem; }
main .pd-ask [class].pd-ask__hint, main .pd-ask__hint { margin: 0; font-size: 14px; color: rgba(255,255,255,.5); }
main .pd-ask:has(input:checked) .pd-ask__hint, main .pd-ask__a { display: none; }
main .pd-ask:has(#pd-ask-1:checked) .pd-ask__a--1, main .pd-ask:has(#pd-ask-2:checked) .pd-ask__a--2, main .pd-ask:has(#pd-ask-3:checked) .pd-ask__a--3, main .pd-ask:has(#pd-ask-4:checked) .pd-ask__a--4, main .pd-ask:has(#pd-ask-5:checked) .pd-ask__a--5, main .pd-ask:has(#pd-ask-6:checked) .pd-ask__a--6 { display: grid; gap: .6rem; }
main .pd-ask__a { padding-left: 1rem; border-left: 3px solid rgba(255,255,255,.2); }
main .pd-ask__a.is-yes { border-left-color: #36d240; }
main .pd-ask__a.is-no { border-left-color: #fb7185; }
@media (prefers-reduced-motion: no-preference) { main .pd-ask:has(input:checked) .pd-ask__a { animation: pd-ver-in .3s ease-out; } }
main .pd-ask__a b { font-size: 18px; color: #fff; }
main .pd-ask__a.is-yes b { color: #36d240; }
main .pd-ask__a.is-no b { color: #fda4af; }
main .pd-ask__a.is-no b::before { content: "\2715\00a0"; font-size: 14px; }
main .pd-ask__a.is-yes b::before { content: "\2713\00a0"; font-size: 14px; }
main .pd-ask [class].pd-ask__a p, main .pd-ask__a p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-ask__a a { color: #36d240; text-decoration: underline; text-underline-offset: 3px; }
main .pd-ask__a a:hover { color: #fff; }
main .pd-ask [class].pd-ask__n, main .pd-ask__n { margin: 1.1rem 0 0; font-size: 12px; color: rgba(255,255,255,.4); }
@media (max-width: 639px) { main .pd-ask__pick { grid-template-columns: 1fr 1fr; } main .pd-ask__pick label { font-size: 13px; padding: .5rem 1.4rem; } main .pd-ask__out { padding: 1.25rem; } }
@media (prefers-reduced-motion: reduce) { main .pd-ask__pick label { transition: none; } main .pd-ask__pick label:active { transform: none; } }
main .pd-resp { border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; overflow: hidden; }
main .pd-resp [class].pd-resp__t, main .pd-resp__t { margin: 0; padding: 1.1rem 1.5rem .9rem; font-size: 15px; font-weight: 700; color: #36d240; }
main .pd-resp__head, main .pd-resp__row { display: grid; grid-template-columns: 1fr 5.5rem 7rem 4rem; align-items: center; border-top: 1px solid rgba(255,255,255,.08); }
main .pd-resp__head span { padding: .6rem 1.5rem; font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: rgba(255,255,255,.45); }
main .pd-resp__row span { padding: .7rem 1.5rem; font-size: 14.5px; line-height: 1.45; color: rgba(255,255,255,.75); }
main .pd-resp__head span + span, main .pd-resp__row span + span { padding-left: 0; padding-right: 0; text-align: center; }
main .pd-resp__row span + span { font-size: 15px; color: rgba(255,255,255,.2); }
main .pd-resp__row span.is-on { color: #36d240; font-weight: 700; }
main .pd-resp__row span a { color: rgba(255,255,255,.45); text-decoration: underline; text-underline-offset: 3px; }
main .pd-resp__row span a:hover { color: #36d240; }
main .pd-resp [class].pd-resp__n, main .pd-resp__n { margin: 0; padding: .9rem 1.5rem 1.1rem; border-top: 1px solid rgba(255,255,255,.08); font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.4); }
@media (max-width: 639px) { main .pd-resp__head, main .pd-resp__row { grid-template-columns: 1fr 3rem 3.6rem 2.6rem; } main .pd-resp__head span, main .pd-resp__row span, main .pd-resp__n { padding-left: 1rem; padding-right: 1rem; } main .pd-resp__head span + span, main .pd-resp__row span + span { padding-left: 0; padding-right: 0; } main .pd-resp__head span { font-size: 10px; letter-spacing: 0; } main .pd-resp__row span { font-size: 13px; } main .pd-resp [class].pd-resp__t { padding-left: 1rem; } }
main .pd-wprow { max-width: 640px; border: 1px solid rgba(255,255,255,.12); border-radius: 1.5rem; background: #050705; overflow: hidden; font-size: 13.5px; }
main .pd-wprow [class].pd-wprow__t, main .pd-wprow__t { display: flex; align-items: center; gap: .5rem; margin: 0; padding: .75rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.55); }
main .pd-wprow__t .ic { font-size: 15px; color: rgba(255,255,255,.7); }
main .pd-wprow__row { display: flex; gap: .9rem; padding: 1rem 1.25rem 1rem 1.1rem; }
main .pd-wprow__cb { flex: none; width: 15px; height: 15px; margin-top: .2rem; border: 1px solid rgba(255,255,255,.35); border-radius: 3px; }
main .pd-wprow__main { flex: 1; min-width: 0; }
main .pd-wprow [class].pd-wprow__main p, main .pd-wprow__main p { margin: 0; line-height: 1.5; color: rgba(255,255,255,.65); }
main .pd-wprow__name { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1rem; }
main .pd-wprow__name b { font-size: 14.5px; color: #fff; }
main .pd-wprow__acts, main .pd-wprow__meta u { color: #36d240; }
main .pd-wprow__main u { text-decoration: none; }
main .pd-wprow__acts u { text-decoration: none; }
main .pd-wprow [class].pd-wprow__desc { margin-top: .35rem; }
main .pd-wprow [class].pd-wprow__meta { margin-top: .5rem; font-size: 12.5px; color: rgba(255,255,255,.45); }
main .pd-wprow__ver { padding: .1rem .45rem; border: 1px solid #36d240; border-radius: .4rem; font-weight: 700; color: #fff; }
main .pd-wprow [class].pd-wprow__upd, main .pd-wprow__upd { display: flex; gap: .6rem; margin: 0 1.25rem 1rem 2.5rem; padding: .7rem .9rem; border-left: 3px solid #36d240; background: rgba(54,210,64,.08); line-height: 1.5; color: rgba(255,255,255,.8); }
main .pd-wprow__upd .ic { flex: none; margin-top: .2rem; font-size: 13px; color: #36d240; }
main .pd-wprow__upd u { color: #36d240; text-decoration: none; font-weight: 600; }
main .pd-wprow [class].pd-wprow__n, main .pd-wprow__n { margin: 0; padding: .7rem 1.25rem .9rem; border-top: 1px solid rgba(255,255,255,.08); font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.45); }
main .pd-wprow__n b { color: rgba(255,255,255,.8); }
@media (max-width: 767px) { main .pd-wprow [class].pd-wprow__main p[class], main .pd-wprow [class].pd-wprow__upd[class], main .pd-wprow [class].pd-wprow__desc[class] { font-size: 13px; line-height: 1.5; } main .pd-wprow [class].pd-wprow__meta[class] { font-size: 12.5px; } main .pd-wprow [class].pd-wprow__n[class] { font-size: 12px; } main .pd-wprow__acts { font-size: 13px; } }
@media (max-width: 639px) { main .pd-wprow { font-size: 13px; } main .pd-wprow__row { padding: .9rem 1rem; } main .pd-wprow [class].pd-wprow__upd { margin: 0 1rem .9rem 1rem; } main .pd-wprow__t, main .pd-wprow__n { padding-left: 1rem; padding-right: 1rem; } }
main .pd-compat { border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; overflow: hidden; text-align: left; }
main .pd-compat [class].pd-compat__t, main .pd-compat__t { margin: 0; padding: 1.1rem 1.5rem .9rem; font-size: 15px; font-weight: 700; color: #36d240; }
main .pd-compat__groups { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(255,255,255,.1); }
main .pd-compat__g { display: grid; gap: .4rem; align-content: start; padding: 1rem 1.25rem; border-right: 1px solid rgba(255,255,255,.08); }
main .pd-compat__g:last-child { border-right: 0; }
main .pd-compat__l { margin-bottom: .2rem; font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: rgba(255,255,255,.45); }
main .pd-compat__g label { padding: .55rem .8rem; border: 1px solid rgba(255,255,255,.14); border-radius: .75rem; font-size: 13.5px; font-weight: 600; color: rgba(255,255,255,.7); cursor: pointer; }
main .pd-compat__g label:hover { border-color: rgba(255,255,255,.4); color: #fff; }
main .pd-compat__g .sr-only:checked + label { background: #36d240; border-color: #36d240; color: #050705; }
main .pd-compat__g .sr-only:focus-visible + label { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-compat__out { display: grid; gap: .75rem; padding: 1.25rem 1.5rem; }
main .pd-compat [class].pd-compat__out p, main .pd-compat__out p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-compat [class].pd-compat__hint { color: rgba(255,255,255,.5); }
main .pd-compat__f, main .pd-compat__ok { display: none; }
main .pd-compat [class].pd-compat__f, main .pd-compat__ok p { gap: .6rem; align-items: flex-start; }
main .pd-compat__ok p { display: flex; }
main .pd-compat__f .ic, main .pd-compat__ok .ic { flex: none; margin-top: .3rem; font-size: 14px; }
main .pd-compat__f .ic { color: #ff6b6b; }
main .pd-compat__ok .ic { color: #36d240; }
main .pd-compat__f b, main .pd-compat__ok b { color: #fff; }
main .pd-compat:has(#pd-cp-wp-no:checked) .pd-compat__f--wp, main .pd-compat:has(#pd-cp-wc-no:checked) .pd-compat__f--wc, main .pd-compat:has(#pd-cp-php-no:checked) .pd-compat__f--php { display: flex; }
main .pd-compat:has(#pd-cp-wp-ok:checked):has(#pd-cp-wc-ok:checked):has(#pd-cp-php-ok:checked) .pd-compat__ok { display: grid; gap: 1rem; justify-items: start; }
main .pd-compat:has(#pd-cp-wp-ok:checked):has(#pd-cp-wc-ok:checked):has(#pd-cp-php-ok:checked) .pd-compat__hint, main .pd-compat:has(#pd-cp-wp-no:checked), main .pd-compat:has(#pd-cp-wc-no:checked), main .pd-compat:has(#pd-cp-php-no:checked) .pd-compat__hint { display: none; }
main .pd-compat [class].pd-compat__n, main .pd-compat__n { margin: 0; padding: .8rem 1.5rem 1rem; border-top: 1px solid rgba(255,255,255,.08); font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.45); }
main .pd-compat__n a { color: #36d240; text-decoration: underline; text-underline-offset: 3px; }
main .pd-compat__n a:hover { color: #fff; }
@media (max-width: 639px) { main .pd-compat__groups { grid-template-columns: 1fr; } main .pd-compat__g { grid-template-columns: 1fr 1fr; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); padding: .9rem 1rem; } main .pd-compat__g:last-child { border-bottom: 0; } main .pd-compat__l { grid-column: 1 / -1; margin: 0; } main .pd-compat__g label { text-align: center; font-size: 13px; padding: .5rem; } main .pd-compat [class].pd-compat__t, main .pd-compat__out, main .pd-compat [class].pd-compat__n { padding-left: 1rem; padding-right: 1rem; } main .pd-compat [class].pd-compat__out p[class], main .pd-compat [class].pd-compat__out p { font-size: 14px; } }

/* 2026-11-01 (loop 68): .pd-ask--2, two-column pick grid for narrow columns (contact aside) at every width */
main .pd-ask--2 .pd-ask__pick { grid-template-columns: 1fr 1fr; }
main .pd-ask--2 .pd-ask__pick label { font-size: 13px; padding: .5rem 1.4rem; }
main .pd-ask--2 .pd-ask__out { padding: 1.25rem 1.5rem 1.1rem; }
main .pd-ask--2 .pd-ask__a b { font-size: 16px; }
main .pd-ask--2 [class].pd-ask__a p, main .pd-ask--2 .pd-ask__a p { font-size: 13.5px; }
/* loop 73: a pill CTA inside a .pd-ask answer keeps its own dark label (the answer-link green rule made it green on green). */
main .pd-ask__a a.btn-green, main .pd-ask__a a.btn-green:hover { color: #04180a; text-decoration: none; }
/* loop 75: "Keep reading" on 10 landing pages — boxed cards with mono eyebrow labels → a flat editorial index (title · summary · arrow), whole row clickable. */
main .pd-next { border-top: 1px solid rgba(255,255,255,.12); }
main .pd-next__row { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr) auto; gap: 2.5rem; align-items: center; padding: 1.6rem .25rem; border-bottom: 1px solid rgba(255,255,255,.12); transition: background-color .2s; }
main .pd-next__row:hover { background: rgba(54,210,64,.04); }
main .pd-next__row h3 { margin: 0; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.25; }
main .pd-next__row h3 a:focus-visible { outline: none; }
main .pd-next__row:has(a:focus-visible) { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-next__row:hover h3 { color: #36d240; }
main .pd-next__row > p { margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* NEXT_GO_V1 (loop5 39): the "Read it →" label becomes a 44px arrow button that fills green and nudges on row hover; on phones it
   sits beside the title, so a row is ~half as tall. Decoration only: pointer-events none, or the transformed (hover) button paints
   over the row link overlay and swallows the click. */
main .pd-next__row > span[aria-hidden][class] { margin: 0; pointer-events: none; display: flex; align-items: center; justify-content: center; gap: 0; flex: none; width: 44px; height: 44px; border-radius: 9999px; border: 1px solid rgba(255,255,255,.16); font-size: 0; color: #36d240; transition: background-color .2s, border-color .2s, color .2s, transform .2s; }
main .pd-next__row > span[aria-hidden] svg { font-size: 13px; }
main .pd-next__row:is(:hover, :has(a:focus-visible)) > span[aria-hidden] { background: #36d240; border-color: #36d240; color: #04180a; }
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  main .pd-next__row:is(:hover, :has(a:focus-visible)) > span[aria-hidden] { transform: translateX(4px); }
  main .pd-next__row:active > span[aria-hidden] { transform: translateX(4px) scale(.94); }
}
@media (max-width: 767px) {
  main .pd-next__row { grid-template-columns: minmax(0,1fr) auto; column-gap: 1rem; row-gap: .4rem; padding: 1.1rem 0; }
  main .pd-next__row > h3 { grid-area: 1 / 1; }
  main .pd-next__row > p { grid-area: 2 / 1; }
  main .pd-next__row > span[aria-hidden] { grid-area: 1 / 2 / 3; }
}
/* loop 76: legal TOC label in plain sentence case; below the sidebar layout the TOC is a sticky reading bar naming the section in view. */
.toc .toc-summary { font-family: inherit; text-transform: none; letter-spacing: normal; font-size: 14px; font-weight: 600; color: #fff; }
.toc .toc-now { display: none; }
@media (max-width: 1023px) {
  aside:has(> details.toc) { position: sticky; top: calc(84px + var(--pd-eb, 0px)); z-index: 40; }
  details.toc { position: relative; background: #050705; border: 1px solid rgba(255,255,255,.12); border-radius: 1rem; padding: 0 1rem; }
  details.toc[open] { border-color: rgba(54,210,64,.35); border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
  .toc > summary.toc-summary { cursor: pointer; pointer-events: auto; min-height: 56px; border-bottom: 0; gap: .9rem; }
  .toc > summary .toc-chev { display: inline-block; }
  .toc .toc-lbl { flex: none; font-size: 12px; font-weight: 500; color: rgba(255,255,255,.55); }
  .toc .toc-now:not(:empty) { display: block; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #36d240; }
  .toc .toc-nav { position: absolute; left: -1px; right: -1px; top: 100%; margin-top: 0; max-height: 60vh; overflow-y: auto; overscroll-behavior: contain; padding: .5rem 1rem .75rem; background: #050705; border: 1px solid rgba(54,210,64,.35); border-top-color: rgba(255,255,255,.08); border-radius: 0 0 1rem 1rem; }
  main:has(details.toc) article [id] { scroll-margin-top: 156px; }
}
/* TOC_PROGRESS_V1 (loop5 37): the TOC links form one rail, green up to the section in view; from 1024px the sidebar (TOC block
   above) clears the floating header and fits the viewport; below it the sticky bar carries a page-progress line (scroll-driven, where supported). */
.toc .toc-nav > a.toc-link:not([hidden]) { margin-top: 0; border-radius: 0 .6rem .6rem 0; box-shadow: inset 2px 0 0 rgba(255,255,255,.1); }
.toc .toc-nav > a.toc-link:not(:hover):has(~ .toc-link[aria-current="true"]) { color: rgba(255,255,255,.8); box-shadow: inset 2px 0 0 rgba(54,210,64,.45); }
.toc .toc-nav > a.toc-link[aria-current="true"] { box-shadow: inset 2px 0 0 #36d240; }
@supports (animation-timeline: scroll()) {
  @keyframes pd-toc-read { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  @media (max-width: 1023px) {
    .toc > summary.toc-summary::after { content: ""; position: absolute; left: 1rem; right: 1rem; bottom: -1px; height: 2px; border-radius: 2px; background: #36d240; transform-origin: left; animation: pd-toc-read linear both; }
    /* own rule: the per-page minifier folds a same-rule timeline into the shorthand, which browsers reject */
    .toc > summary.toc-summary.toc-summary::after { animation-timeline: scroll(root); }
  }
}
/* loop 77: /features "Follow one payment" — numbered hairline rows: step · what happens · where to read more. */
main .pd-trail { list-style: none; margin-left: 0; margin-right: 0; padding: 0; counter-reset: pdtrail; border-top: 1px solid rgba(255,255,255,.12); }
main .pd-trail__s { --c: 50%; position: relative; counter-increment: pdtrail; display: grid; grid-template-columns: 3.5rem minmax(0,1fr) minmax(0,1.6fr) 14.5rem; gap: 2rem; align-items: center; padding: 1.6rem .25rem; border-bottom: 1px solid rgba(255,255,255,.12); }
main .pd-trail__s::before { content: counter(pdtrail, decimal-leading-zero); position: relative; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; border: 1.5px solid rgba(54,210,64,.45); border-radius: 50%; font: 700 13px/1 "JetBrains Mono", ui-monospace, monospace; color: #36d240; font-variant-numeric: tabular-nums; }
main .pd-trail__s h3 { margin: 0; font-size: clamp(18px, 1.6vw, 21px); line-height: 1.25; font-weight: 800; color: #fff; }
main .pd-trail__s p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-trail__s p .pd-flow__tag { display: table; margin: .6rem 0 0; }
main .pd-trail__s > a:not(.pill) { justify-self: end; display: inline-flex; align-items: center; gap: .5rem; font-size: 13.5px; font-weight: 700; color: #36d240; white-space: nowrap; transition: gap .2s; }
main .pd-trail__s > a:not(.pill):hover { gap: .75rem; }
main .pd-trail__s > a.pill { justify-self: end; display: inline-flex; align-items: center; gap: .6rem; padding: .8rem 1.3rem; font-size: 14px; font-weight: 700; white-space: nowrap; }
/* FEAT_GOOGLE_V1 (loop5 17): step 06 ends on the Google button (column widened to fit it); its email + terms line sits under
   the list, right-aligned beneath the button on desktop. */
main .pd-trail + .pd-trail__note { margin: .9rem 0 0 auto; text-align: right; }
@media (max-width: 767px) {
  main .pd-trail__s { --c: calc(1.4rem + 22px); grid-template-columns: 2.75rem minmax(0,1fr); gap: .5rem 1rem; align-items: start; padding: 1.4rem 0; }
  main .pd-trail__s::before { grid-row: span 3; }
  main .pd-trail__s > a:not(.pill), main .pd-trail__s > a.pill { justify-self: start; margin-top: .4rem; }
  main .pd-trail + .pd-trail__note { margin-left: 0; text-align: left; }
}
/* TRAIL_TRACK_V1 (loop5 42): the step numbers are stations on one rail that runs through all six rows; with scroll-driven
   animation a station lights as its row crosses 60% of the viewport and the rail fills down to the next one. */
main .pd-trail__s::after { content: ""; position: absolute; top: 0; bottom: -1px; left: calc(.25rem + 21px); width: 2px; background: rgba(255,255,255,.1); mask-image: linear-gradient(#000 calc(var(--c) - 26px), transparent 0 calc(var(--c) + 26px), #000 0); }
main .pd-trail__s:first-child::after { mask-image: linear-gradient(transparent calc(var(--c) + 26px), #000 0); }
main .pd-trail__s:last-child::after { mask-image: linear-gradient(#000 calc(var(--c) - 26px), transparent 0); }
@media (max-width: 767px) { main .pd-trail__s::after { left: 21px; } }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    main .pd-trail__s { view-timeline: --pd-trail; }
    main .pd-trail__s::before { animation: pd-trail-lit linear both; }
    main .pd-trail__s::after { background: linear-gradient(#36d240, #36d240) 0 0 / 100% 0 no-repeat rgba(255,255,255,.1); animation: pd-trail-fill linear both; }
    html.pd-motion-paused main .pd-trail__s::before, html.pd-motion-paused main .pd-trail__s::after { animation: none; }
  }
  @media (prefers-reduced-motion: no-preference) {
    main .pd-trail__s::before { animation-timeline: --pd-trail; animation-range: cover 40vh cover calc(40vh + 40px); }
    main .pd-trail__s::after { animation-timeline: --pd-trail; animation-range: cover 40vh cover calc(100% - 60vh); }
  }
}
@keyframes pd-trail-lit { to { border-color: #36d240; background: #36d240; color: #04180a; box-shadow: 0 0 0 6px rgba(54,210,64,.14); } }
@keyframes pd-trail-fill { to { background-size: 100% 100%; } }
/* loop 80: /iptv-payments swimlane — subscriber lane | numbered spine | your-system lane. */
main .pd-lanes__h, main .pd-lanes__s { display: grid; grid-template-columns: minmax(0,1fr) 4rem minmax(0,1fr); }
main .pd-lanes__h { margin-bottom: 1rem; font-size: 13px; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-lanes__h span:last-child { grid-column: 3; }
main [class].pd-lanes { list-style: none; margin: 0; padding: 0; counter-reset: pdlanes; }
main .pd-lanes__s { counter-increment: pdlanes; position: relative; padding-bottom: 1.5rem; align-items: stretch; }
main .pd-lanes__s::before { content: counter(pdlanes); grid-column: 2; grid-row: 1; justify-self: center; align-self: start; position: relative; z-index: 1; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; margin-top: .75rem; border: 1px solid rgba(54,210,64,.45); border-radius: 999px; background: #050705; font-size: 14px; font-weight: 800; color: #36d240; }
main .pd-lanes__s:last-child::before { background: #36d240; border-color: #36d240; color: #04180a; }
main .pd-lanes__s:not(:last-child)::after { content: ""; position: absolute; left: 50%; top: .75rem; bottom: 0; width: 1px; background: rgba(255,255,255,.14); }
main .pd-lanes__l, main .pd-lanes__r { grid-row: 1; padding: 1.1rem 1.25rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; background: #050705; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.68); }
main .pd-lanes__l { grid-column: 1; }
main .pd-lanes__r { grid-column: 3; border-color: rgba(54,210,64,.28); }
main .pd-lanes__l b, main .pd-lanes__r b { color: #fff; font-weight: 700; }
@media (max-width: 767px) {
  main .pd-lanes__h { display: none; }
  main .pd-lanes__s { grid-template-columns: 2.5rem minmax(0,1fr); column-gap: 1rem; row-gap: .6rem; }
  main .pd-lanes__s::before { grid-column: 1; grid-row: 1 / span 2; margin-top: 0; }
  main .pd-lanes__s:not(:last-child)::after { left: 1.25rem; top: 0; }
  main .pd-lanes__l { grid-column: 2; grid-row: 1; }
  main .pd-lanes__r { grid-column: 2; grid-row: 2; }
  main .pd-lanes [data-l]::before { content: attr(data-l); display: block; margin-bottom: .3rem; font-size: 11.5px; font-weight: 700; color: rgba(255,255,255,.45); }
}

/* 2026-11-01 (loop 81): .pd-where — the same payment link shown in four placements (bio, chat, invoice, QR) on /cash-app-checkout */
main [class].pd-where { list-style: none; margin: 3rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
main .pd-where__c { display: flex; flex-direction: column; }
main .pd-where__m { display: flex; flex-direction: column; gap: .55rem; min-height: 15.5rem; padding: 1.1rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #050705; font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.75); overflow: hidden; }
main .pd-where__m b { color: #fff; font-size: 14px; }
main .pd-where__m small { font-size: 12px; color: rgba(255,255,255,.5); }
main .pd-where__m code { font-size: 11.5px; color: #36d240; word-break: break-all; }
main .pd-where__btn { display: block; margin-top: auto; padding: .6rem .8rem; border-radius: 999px; background: #36d240; color: #04180a; font-weight: 800; font-size: 13px; text-align: center; }
main .pd-where__m--bio { align-items: center; text-align: center; }
main .pd-where__m--bio .pd-where__btn { align-self: stretch; margin-top: auto; }
main .pd-where__av { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; border-radius: 999px; border: 2px solid #36d240; color: #36d240; font-weight: 900; font-size: 20px; }
main .pd-where__in, main .pd-where__out { max-width: 88%; padding: .55rem .75rem; border-radius: 1rem; }
main .pd-where__in { align-self: flex-start; background: rgba(255,255,255,.08); border-bottom-left-radius: .3rem; }
main .pd-where__out { align-self: flex-end; background: rgba(54,210,64,.12); border: 1px solid rgba(54,210,64,.3); border-bottom-right-radius: .3rem; }
main .pd-where__sys { margin-top: auto; align-self: center; font-size: 12px; font-weight: 700; color: #36d240; }
main .pd-where__m--mail > b { font-size: 16px; }
main .pd-where__m--mail dl { margin: .25rem 0 0; padding-top: .6rem; border-top: 1px solid rgba(255,255,255,.1); }
main .pd-where__m--mail dl div { display: flex; justify-content: space-between; }
main .pd-where__m--mail dt { color: rgba(255,255,255,.5); }
main .pd-where__m--mail dd { margin: 0; color: #fff; font-weight: 800; }
main .pd-where__m--qr { align-items: center; justify-content: center; text-align: center; }
main .pd-where__qr { width: 8.5rem; height: 8.5rem; border-radius: .5rem; }
main .pd-where__c h3 { margin: 1.1rem 0 0; font-size: 16px; font-weight: 800; color: #fff; }
main .pd-where [class].pd-where__c p, main .pd-where__c p { margin: .4rem 0 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.6); }
@media (max-width: 1023px) { main [class].pd-where { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* WHERE_DECK_V1 (loop5 45): on phones the four placements stacked into ~1,500px with each label under its mock, so the CTA
   sat a long scroll away. They are a swipe deck now: one placement plus a peek of the next, snapping card by card. */
@media (max-width: 539px) {
  main [class].pd-where { display: flex; gap: .75rem; margin-inline: -1.25rem; padding: 0 1.25rem .25rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 1.25rem; overscroll-behavior-x: contain; scrollbar-width: none; }
  main .pd-where::-webkit-scrollbar { display: none; }
  main .pd-where__c { flex: 0 0 78%; scroll-snap-align: start; }
}

/* 2026-11-01 (loop 82): .pd-gate — CSS-only release gate on /digital-goods-payments: pick what just happened, the order shows Hold / Release / Reject */
main .pd-gate { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #050705; overflow: hidden; }
main .pd-gate__ask { margin: 0; padding: 1.25rem; border: 0; border-right: 1px solid rgba(255,255,255,.1); display: grid; gap: .5rem; align-content: start; }
main .pd-gate__ask legend { float: left; width: 100%; margin-bottom: .35rem; font-size: 15px; font-weight: 700; color: #36d240; }
main .pd-gate__ask label { position: relative; display: block; padding: .8rem 1rem .8rem 2.6rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; font-size: 14.5px; line-height: 1.45; color: rgba(255,255,255,.7); cursor: pointer; }
main .pd-gate__ask label::before { content: ""; position: absolute; left: 1rem; top: 1.05rem; width: .9rem; height: .9rem; border-radius: 999px; border: 2px solid rgba(255,255,255,.35); }
main .pd-gate__ask label:hover { color: #fff; border-color: rgba(255,255,255,.25); }
main .pd-gate__ask input:checked + label { color: #fff; border-color: #36d240; background: rgba(54,210,64,.07); }
main .pd-gate__ask input:checked + label::before { border-color: #36d240; background: #36d240; box-shadow: inset 0 0 0 2px #050705; }
main .pd-gate__ask input:focus-visible + label { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-gate__ask code, main .pd-gate__v code { font-size: 12.5px; color: #36d240; }
main .pd-gate__out { padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; }
main .pd-gate [class].pd-gate__order, main .pd-gate__order { margin: 0; display: flex; justify-content: space-between; gap: 1rem; padding-bottom: .9rem; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 13px; color: rgba(255,255,255,.55); }
main .pd-gate__order b { color: #fff; }
main .pd-gate__v { display: none; gap: .55rem; }
main .pd-gate:has(#pd-gate-1:checked) .pd-gate__v--1, main .pd-gate:has(#pd-gate-2:checked) .pd-gate__v--2, main .pd-gate:has(#pd-gate-3:checked) .pd-gate__v--3, main .pd-gate:has(#pd-gate-4:checked) .pd-gate__v--4, main .pd-gate:has(#pd-gate-5:checked) .pd-gate__v--5 { display: grid; }
main .pd-gate__tag { justify-self: start; padding: .3rem .8rem; border-radius: 999px; font-size: 12px; font-weight: 800; letter-spacing: .02em; border: 1px solid rgba(255,255,255,.3); color: #fff; }
main .pd-gate__tag::before { content: "\25CF\00a0"; }
main .pd-gate__v.is-go .pd-gate__tag { background: #36d240; border-color: #36d240; color: #04180a; }
main .pd-gate__v.is-go .pd-gate__tag::before { content: "\2713\00a0"; }
main .pd-gate__v.is-stop .pd-gate__tag { border-color: #ff6b6b; color: #ff6b6b; }
main .pd-gate__v.is-stop .pd-gate__tag::before { content: "\2715\00a0"; }
main .pd-gate__v b { font-size: 22px; color: #fff; }
main .pd-gate [class].pd-gate__v p, main .pd-gate__v p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-gate [class].pd-gate__dl, main .pd-gate__dl { margin: auto 0 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem .75rem .75rem 1rem; border: 1px dashed rgba(255,255,255,.2); border-radius: .9rem; font-size: 13px; color: rgba(255,255,255,.45); }
main .pd-gate__dl i { font-style: normal; flex-shrink: 0; white-space: nowrap; font-weight: 800; padding: .45rem .9rem; border-radius: 999px; background: rgba(255,255,255,.08); color: rgba(255,255,255,.5); }
main .pd-gate__dl .pd-gate__on, main .pd-gate:has(#pd-gate-4:checked) .pd-gate__off { display: none; }
main .pd-gate:has(#pd-gate-4:checked) .pd-gate__on { display: inline; background: #36d240; color: #04180a; }
main .pd-gate:has(#pd-gate-4:checked) .pd-gate__dl { border-style: solid; border-color: rgba(54,210,64,.4); color: #fff; }
main .pd-gate [class].pd-gate__n, main .pd-gate__n { margin: 0; font-size: 12px; color: rgba(255,255,255,.4); }
@media (max-width: 767px) { main .pd-gate { grid-template-columns: 1fr; } main .pd-gate__ask { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.1); } main .pd-gate__out { padding: 1.25rem; } main .pd-gate__v b { font-size: 19px; } }

/* 2026-11-01 (loop 83): .pd-metro — home "From signup to first payment" as a two-line route map: solid green Free line, dashed review branch off station 2 */
main .pd-metro { --cg: 1.5rem; --lg: 3rem; }
main .pd-metro [class].pd-metro__name, main .pd-metro__name { margin: 0 0 1.25rem; font-size: 14px; color: rgba(255,255,255,.55); }
main .pd-metro__name b { margin-right: .5rem; padding: .3rem .75rem; border-radius: 999px; background: #36d240; color: #04180a; font-size: 13px; }
main .pd-metro__line--rev .pd-metro__name b { display: table; margin: 0 0 .6rem; background: transparent; border: 1px dashed rgba(255,255,255,.4); color: #fff; }
main .pd-metro__line--rev { position: relative; margin-top: var(--lg); }
main .pd-metro .pd-metro__line--rev [class].pd-metro__name, main .pd-metro__line--rev .pd-metro__name { position: absolute; top: -.35rem; left: 0; width: calc((100% - 3 * var(--cg)) / 4 - 1rem); line-height: 1.6; }
main .pd-metro ol { position: relative; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 var(--cg); }
main .pd-metro ol::before { content: ""; position: absolute; top: .55rem; left: .6rem; right: 0; height: 3px; border-radius: 3px; background: #36d240; }
main .pd-metro__line--rev ol::before { left: calc((100% - 3 * var(--cg)) / 4 + var(--cg) + .6rem); height: 0; background: none; border-top: 2px dashed rgba(255,255,255,.35); top: .6rem; }
main .pd-metro__line--rev .pd-metro__st:first-child { grid-column: 2; }
main .pd-metro__st { position: relative; padding: 2.1rem 0 0 1.9rem; }
main .pd-metro__st::before { content: ""; position: absolute; top: 0; left: 0; width: 1.25rem; height: 1.25rem; border-radius: 999px; background: #050705; border: 3px solid #36d240; box-sizing: border-box; z-index: 1; }
main .pd-metro__line--free .pd-metro__st:last-child::before { background: #36d240; box-shadow: 0 0 0 4px rgba(54,210,64,.2); }
main .pd-metro__line--rev .pd-metro__st::before { border: 2px dashed rgba(255,255,255,.6); }
main .pd-metro__line--rev .pd-metro__st:last-child::before { border: 3px solid #36d240; }
/* branch: dashed connector from Free station 2 down to the review line */
main .pd-metro__line--free .pd-metro__st:nth-child(2)::after { content: ""; position: absolute; left: .55rem; top: 1.25rem; bottom: calc(-1 * var(--lg)); border-left: 2px dashed rgba(255,255,255,.35); }
main .pd-metro__st h3 { margin: 0; font-size: 17px; font-weight: 800; line-height: 1.3; color: #fff; }
main .pd-metro [class].pd-metro__st p, main .pd-metro__st p { margin: .5rem 0 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.6); }
@media (max-width: 767px) {
  main .pd-metro { --lg: 2.25rem; }
  main .pd-metro ol { grid-template-columns: 1fr; gap: 1.5rem; }
  main .pd-metro ol::before, main .pd-metro__line--rev ol::before { top: .6rem; bottom: 1rem; left: .55rem; right: auto; width: 3px; height: auto; }
  main .pd-metro__line--rev ol::before { width: 0; border-top: 0; border-left: 2px dashed rgba(255,255,255,.35); }
  main .pd-metro__line--rev .pd-metro__st:first-child { grid-column: auto; }
  main .pd-metro__st { padding: 0 0 0 2.25rem; }
  main .pd-metro__line--free .pd-metro__st:nth-child(2)::after { display: none; }
  main .pd-metro__name b { display: table; margin: 0 0 .5rem; }
  main .pd-metro .pd-metro__line--rev [class].pd-metro__name, main .pd-metro__line--rev .pd-metro__name { position: static; width: auto; margin-bottom: 1.25rem; }
}

/* 2026-11-01 (loop 84): .pd-thread — one order number threaded through shop → create-invoice → customer → signed webhook on /digital-shop-payments */
main [class].pd-thread { position: relative; list-style: none; margin: 3rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.25rem; }
main .pd-thread::before { content: ""; position: absolute; top: 1.05rem; left: 1rem; right: 1rem; border-top: 2px dashed rgba(54,210,64,.45); }
main .pd-thread__c { position: relative; display: flex; flex-direction: column; }
main .pd-thread [class].pd-thread__who, main .pd-thread__who { position: relative; z-index: 1; align-self: flex-start; margin: 0 0 .9rem; padding: .3rem .8rem; border: 1px solid rgba(54,210,64,.45); border-radius: 999px; background: #050705; font-size: 12.5px; font-weight: 700; color: #fff; }
main .pd-thread__m { display: flex; flex-direction: column; gap: .5rem; min-height: 10.5rem; padding: 1rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.1rem; background: #050705; font-size: 13px; color: rgba(255,255,255,.7); }
main .pd-thread__m mark { padding: .05rem .35rem; border-radius: .35rem; background: rgba(54,210,64,.16); color: #36d240; font-weight: 700; }
main .pd-thread__m code { font-size: 12px; line-height: 1.7; color: rgba(255,255,255,.75); word-break: break-word; }
main .pd-thread__m code mark { padding: 0 .15rem; }
main .pd-thread__m small { margin-top: auto; font-size: 12px; color: rgba(255,255,255,.45); }
main .pd-thread__m small.is-ok { color: #36d240; font-weight: 700; }
main .pd-thread__m dl { margin: 0; display: grid; gap: .55rem; }
main .pd-thread__m dl div { display: flex; justify-content: space-between; gap: .75rem; }
main .pd-thread__m dt { color: rgba(255,255,255,.5); }
main .pd-thread__m dd { margin: 0; color: #fff; font-weight: 700; }
main .pd-thread__wait { color: rgba(255,255,255,.6); }
main .pd-thread__mail { font-size: 12px; color: rgba(255,255,255,.45); }
main .pd-thread__m b { color: #fff; font-size: 14px; }
main .pd-thread__pay { margin-top: auto; padding: .55rem .8rem; border-radius: 999px; background: #36d240; color: #04180a; font-weight: 800; text-align: center; }
main .pd-thread__c h3 { margin: 1.1rem 0 0; font-size: 16px; font-weight: 800; color: #fff; }
main .pd-thread [class].pd-thread__c > p:last-child, main .pd-thread__c > p:last-child { margin: .4rem 0 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.6); }
@media (max-width: 1023px) { main [class].pd-thread { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 2rem; } main .pd-thread::before { display: none; } }
@media (max-width: 599px) { main [class].pd-thread { grid-template-columns: 1fr; } main .pd-thread__m { min-height: 0; } }

/* /agent-payment-links: "Try it with your team" roster builder (loop 85) — inputs left, one link per agent right. */
main [class].pd-roster { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); margin: 3rem 0 0; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; overflow: hidden; }
main .pd-roster__in { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; align-content: start; padding: 1.5rem; border-right: 1px solid rgba(255,255,255,.08); }
main .pd-roster__in label { display: grid; gap: .3rem; font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,.55); }
main .pd-roster__in label:first-of-type, main .pd-roster__in label:last-of-type { grid-column: 1 / -1; }
main .pd-roster input, main .pd-roster select { width: 100%; min-width: 0; padding: .6rem .75rem; border: 1px solid rgba(255,255,255,.14); border-radius: .75rem; background: #050705; color: #fff; font-size: 14px; font-weight: 600; }
main .pd-roster select { appearance: none; -webkit-appearance: none; padding-right: 2rem; background: #050705 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2336d240' stroke-width='2'/%3E%3C/svg%3E") no-repeat right .8rem center; }
main .pd-roster input:focus, main .pd-roster select:focus { outline: 2px solid #36d240; outline-offset: 1px; border-color: #36d240; }
main .pd-roster [class].pd-roster__t { grid-column: 1 / -1; margin: 0; font-size: 15px; font-weight: 700; line-height: 1.3; color: #fff; }
main .pd-roster__out { display: grid; gap: .85rem; align-content: start; padding: 1.5rem; }
main .pd-roster__out [class].pd-roster__t { font-size: 13px; color: #36d240; }
main [class].pd-roster__list { display: grid; gap: .6rem; margin: 0; padding: 0; list-style: none; }
main .pd-roster__list li { display: grid; gap: .3rem; padding: .8rem .95rem; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; background: #050705; font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.6); }
main .pd-roster__list b { font-size: 14px; color: #fff; }
main .pd-roster__list code { display: block; overflow-wrap: anywhere; font-size: 12.5px; color: rgba(255,255,255,.8); }
main .pd-roster__list code [data-pd-ros-code] { color: #36d240; font-weight: 700; }
main .pd-roster__list small { font-size: 12px; color: rgba(255,255,255,.5); }
main .pd-roster [class].pd-roster__n { margin: 0; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.45); }
@media (max-width: 767px) { main [class].pd-roster { grid-template-columns: minmax(0, 1fr); } main .pd-roster__in { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); padding: 1.15rem; } main .pd-roster__out { padding: 1.15rem; } }

/* BRIEF_STEPS_V1: three numbered fieldsets; their picks still feed the existing /contact handoff. */
main [class].pd-brief { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1.5rem; align-items: start; margin: 2.5rem 0 0; counter-reset: brief-picked; }
main .pd-brief__in { display: grid; gap: 1.25rem; counter-reset: brief-step; }
main .pd-brief__q { margin: 0; padding: .8rem 1.25rem 1.25rem; border: 1px solid rgba(255,255,255,.14); border-radius: 1.25rem; min-width: 0; counter-increment: brief-step; }
main .pd-brief__q legend { padding: 0 .5rem; margin-left: -.5rem; font-size: 15px; font-weight: 700; color: #fff; }
main .pd-brief__q legend::before { content: counter(brief-step, decimal-leading-zero); display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin-right: .6rem; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; color: rgba(255,255,255,.6); font: 12px ui-monospace, monospace; }
main .pd-brief__q:has(input:checked) { border-color: rgba(54,210,64,.4); counter-increment: brief-step brief-picked; }
main .pd-brief__q:has(input:checked) legend::before { background: #36d240; border-color: #36d240; color: #04180a; }
main .pd-brief__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
main .pd-brief__chips label { display: flex; cursor: pointer; }
main .pd-brief__chips span { display: flex; align-items: center; min-height: 44px; width: 100%; padding: .55rem .95rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: #050705; font-size: 14px; line-height: 1.4; font-weight: 600; color: rgba(255,255,255,.75); transition: border-color .15s, background-color .15s, color .15s; }
main .pd-brief__chips label:hover span { border-color: rgba(54,210,64,.55); color: #fff; }
main .pd-brief__chips input:checked + span { border-color: #36d240; background: #36d240; color: #04180a; }
main .pd-brief__chips input:focus-visible + span { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-brief__card { position: sticky; top: calc(6.5rem + var(--pd-eb, 0px)); display: grid; gap: 1rem; padding: 1.5rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; }
main .pd-brief [class].pd-brief__t { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; margin: 0; font-size: 13px; font-weight: 700; color: #36d240; }
main .pd-brief__t::after { content: counter(brief-picked) " of 3 picked"; padding: .3rem .6rem; border-radius: 999px; background: rgba(255,255,255,.06); color: rgba(255,255,255,.65); font-size: 12px; font-weight: 500; }
main .pd-brief:has([name="pdb-model"]:checked):has([name="pdb-volume"]:checked):has([name="pdb-integration"]:checked) .pd-brief__t::after { background: #36d240; color: #04180a; }
main .pd-brief__dl { display: grid; margin: 0; border-top: 1px solid rgba(255,255,255,.08); }
main .pd-brief__dl > div { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: .75rem; padding: .7rem 0; border-bottom: 1px solid rgba(255,255,255,.08); }
main .pd-brief__dl dt { font-size: 13px; color: rgba(255,255,255,.5); }
main .pd-brief__dl dd { margin: 0; font-size: 14px; font-weight: 700; color: #fff; }
main .pd-brief [class].pd-brief__note { margin: 0; font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.75); }
main .pd-brief [class].pd-brief__free { margin: 0; padding: .75rem .9rem; border-radius: .9rem; background: rgba(54,210,64,.08); font-size: 13px; line-height: 1.55; color: rgba(255,255,255,.7); }
main .pd-brief [class].pd-brief__n { margin: 0; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.45); }
@media (max-width: 1023px) { main [class].pd-brief { grid-template-columns: minmax(0, 1fr); } main .pd-brief__card { position: static; } }
@media (max-width: 639px) {
  main .pd-brief__q { padding: .75rem .8rem 1rem; }
  main .pd-brief__chips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 1fr; }
  main .pd-brief__chips span { padding: .6rem .75rem; border-radius: .9rem; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) { main .pd-brief__chips span { transition: none; } }

/* /cash-app-api: "Try to fool your own webhook" tamper lab (loop 87) — signed delivery left, your server's verdict right. */
main .pd-tamper { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; overflow: hidden; }
main .pd-tamper__req { display: grid; gap: .9rem; align-content: start; padding: 1.5rem; border-right: 1px solid rgba(255,255,255,.08); }
main .pd-tamper__srv { display: grid; gap: .9rem; align-content: start; padding: 1.5rem; background: #050705; }
main .pd-tamper [class].pd-tamper__t { margin: 0; font-size: 17px; font-weight: 800; line-height: 1.3; color: #fff; }
main .pd-tamper__srv [class].pd-tamper__t { font-size: 13px; font-weight: 700; color: #36d240; }
main .pd-tamper [class].pd-tamper__sub { margin: 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.6); }
main .pd-tamper code, main .pd-tamper textarea, main .pd-tamper input { font-family: "JetBrains Mono", ui-monospace, monospace; }
main .pd-tamper__head { margin: 0; padding: .8rem .95rem; border-radius: .9rem; background: #050705; border: 1px solid rgba(255,255,255,.08); font-size: 12.5px; line-height: 1.7; color: rgba(255,255,255,.75); white-space: pre-wrap; overflow-wrap: anywhere; }
main .pd-tamper__head [data-pdt-sent] { color: #36d240; }
main .pd-tamper__f { display: grid; gap: .3rem; font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,.55); }
main .pd-tamper textarea, main .pd-tamper input { width: 100%; min-width: 0; padding: .65rem .8rem; border: 1px solid rgba(255,255,255,.14); border-radius: 1rem; background: #050705; color: #fff; font-size: 13px; line-height: 1.55; resize: vertical; }
main .pd-tamper textarea:focus, main .pd-tamper input:focus { outline: 2px solid #36d240; outline-offset: 1px; border-color: #36d240; }
main .pd-tamper__btns:not([hidden]) { display: flex; flex-wrap: wrap; gap: .5rem; }
main .pd-tamper__btns button { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; padding: .5rem 1rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: transparent; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.8); cursor: pointer; transition: background-color .2s, border-color .2s, color .2s, opacity .2s, transform .15s; }
main .pd-tamper__btns button:hover { border-color: #36d240; color: #fff; }
main .pd-tamper__btns button:active { transform: scale(.96); }
main .pd-tamper__btns button:focus-visible { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-tamper__btns button[aria-pressed="true"] { border-color: rgba(255,107,107,.7); background: rgba(255,107,107,.12); color: #fff; }
main .pd-tamper__btns button[aria-pressed="true"]::before { content: "\2715"; color: #ff6b6b; font-weight: 800; }
main .pd-tamper__btns button[aria-disabled="true"] { opacity: .4; cursor: default; transform: none; border-color: rgba(255,255,255,.16); color: rgba(255,255,255,.8); }
main .pd-tamper__checks { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
main .pd-tamper__checks li { display: grid; gap: .2rem; padding: .7rem .85rem .7rem 2.3rem; position: relative; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; font-size: 13px; line-height: 1.5; color: rgba(255,255,255,.6); overflow-wrap: anywhere; }
main .pd-tamper__checks li::before { position: absolute; left: .85rem; top: .7rem; font-weight: 800; }
main .pd-tamper__checks li[data-state="ok"]::before { content: "\2713"; color: #36d240; }
main .pd-tamper__checks li[data-state="bad"] { border-color: rgba(255,107,107,.5); }
main .pd-tamper__checks li[data-state="bad"]::before { content: "\2715"; color: #ff6b6b; }
main .pd-tamper__checks b { font-size: 14px; color: #fff; }
main .pd-tamper__checks code { font-size: 12.5px; color: #fff; }
main .pd-tamper__v { scroll-margin: 6rem 0 6rem; display: grid; gap: .25rem; padding: .9rem 1rem; border-radius: .9rem; font-size: 14px; line-height: 1.5; transition: background-color .2s, border-color .2s; }
main .pd-tamper__v b { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 15px; }
main .pd-tamper__v.is-go { background: #36d240; color: #04180a; }
main .pd-tamper__v.is-stop { border: 1px solid #ff6b6b; color: rgba(255,255,255,.8); }
@keyframes pdt-go { 40% { transform: scale(1.03); } }
@keyframes pdt-stop { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }
@media (prefers-reduced-motion: no-preference) { main .pd-tamper__v.is-go { animation: pdt-go .35s ease-out; } main .pd-tamper__v.is-stop { animation: pdt-stop .4s ease-out; } }
@media (prefers-reduced-motion: reduce) { main .pd-tamper__btns button { transition: none; } main .pd-tamper__btns button:active { transform: none; } }
main .pd-tamper__v.is-stop b { color: #ff6b6b; }
main .pd-tamper [class].pd-tamper__n { margin: 0; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.45); }
@media (max-width: 1023px) { main .pd-tamper { grid-template-columns: minmax(0, 1fr); } main .pd-tamper__req { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); } }
main .pd-tamper textarea { min-height: 5.5rem; }
main .pd-tamper input { min-height: 46px; padding: .65rem 1.1rem; border-radius: 9999px; }
@media (max-width: 767px) { main .pd-tamper__req, main .pd-tamper__srv { padding: 1.15rem; } main .pd-tamper textarea { min-height: 9.5rem; } }

/* /cash-app-api: payment.completed field explorer (loop 88) — CSS-only: radios before the code pane, each key is a label; the picked field's card shows on the right. */
main .pd-fields { position: relative; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; overflow: hidden; }
main .pd-fields__r { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-fields__code { margin: 0; padding: 1.5rem; border-right: 1px solid rgba(255,255,255,.08); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13.5px; line-height: 2.05; color: rgba(255,255,255,.7); white-space: pre-wrap; overflow-wrap: anywhere; }
main .pd-fields__code label { padding: .1rem 0; border-radius: .25rem; color: #36d240; cursor: pointer; box-shadow: inset 0 -1px 0 rgba(54,210,64,.45); transition: background-color .15s, color .15s; }
main .pd-fields__code label:hover { background: rgba(54,210,64,.14); }
main #pdf-1:checked ~ .pd-fields__code label[for="pdf-1"], main #pdf-2:checked ~ .pd-fields__code label[for="pdf-2"], main #pdf-3:checked ~ .pd-fields__code label[for="pdf-3"], main #pdf-4:checked ~ .pd-fields__code label[for="pdf-4"], main #pdf-5:checked ~ .pd-fields__code label[for="pdf-5"], main #pdf-6:checked ~ .pd-fields__code label[for="pdf-6"], main #pdf-7:checked ~ .pd-fields__code label[for="pdf-7"], main #pdf-8:checked ~ .pd-fields__code label[for="pdf-8"], main #pdf-9:checked ~ .pd-fields__code label[for="pdf-9"], main #pdf-10:checked ~ .pd-fields__code label[for="pdf-10"] { background: #36d240; color: #04180a; box-shadow: 0 0 0 .22rem #36d240; }
main #pdf-1:focus-visible ~ .pd-fields__code label[for="pdf-1"], main #pdf-2:focus-visible ~ .pd-fields__code label[for="pdf-2"], main #pdf-3:focus-visible ~ .pd-fields__code label[for="pdf-3"], main #pdf-4:focus-visible ~ .pd-fields__code label[for="pdf-4"], main #pdf-5:focus-visible ~ .pd-fields__code label[for="pdf-5"], main #pdf-6:focus-visible ~ .pd-fields__code label[for="pdf-6"], main #pdf-7:focus-visible ~ .pd-fields__code label[for="pdf-7"], main #pdf-8:focus-visible ~ .pd-fields__code label[for="pdf-8"], main #pdf-9:focus-visible ~ .pd-fields__code label[for="pdf-9"], main #pdf-10:focus-visible ~ .pd-fields__code label[for="pdf-10"] { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-fields__out { display: grid; align-content: start; gap: 1rem; padding: 1.5rem; background: #050705; }
main .pd-fields__d { display: none; gap: .8rem; }
main #pdf-1:checked ~ .pd-fields__out .pd-fields__d--1, main #pdf-2:checked ~ .pd-fields__out .pd-fields__d--2, main #pdf-3:checked ~ .pd-fields__out .pd-fields__d--3, main #pdf-4:checked ~ .pd-fields__out .pd-fields__d--4, main #pdf-5:checked ~ .pd-fields__out .pd-fields__d--5, main #pdf-6:checked ~ .pd-fields__out .pd-fields__d--6, main #pdf-7:checked ~ .pd-fields__out .pd-fields__d--7, main #pdf-8:checked ~ .pd-fields__out .pd-fields__d--8, main #pdf-9:checked ~ .pd-fields__out .pd-fields__d--9, main #pdf-10:checked ~ .pd-fields__out .pd-fields__d--10 { display: grid; }
main .pd-fields [class].pd-fields__k { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 0; }
main .pd-fields__k code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 17px; font-weight: 700; color: #fff; overflow-wrap: anywhere; }
main .pd-fields__k span { padding: .15rem .55rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; font-size: 11.5px; font-weight: 600; color: rgba(255,255,255,.6); }
main .pd-fields [class].pd-fields__w { margin: 0; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.75); }
main .pd-fields [class].pd-fields__u { margin: 0; padding: .8rem .95rem; border-left: 2px solid #36d240; background: rgba(54,210,64,.08); border-radius: 0 .75rem .75rem 0; font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.8); }
main .pd-fields__u b { color: #36d240; }
main .pd-fields__d code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: .9em; color: #fff; }
main .pd-fields [class].pd-fields__n { margin: 0; font-size: 12px; line-height: 1.5; color: rgba(255,255,255,.45); }
@media (max-width: 1023px) { main .pd-fields { grid-template-columns: minmax(0, 1fr); } main .pd-fields__code { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); } }
@media (max-width: 767px) { main .pd-fields__code, main .pd-fields__out { padding: 1.15rem; } main .pd-fields__code { font-size: 12.5px; } }

/* /how-to-accept-cash-app-payments: "Same three payments, two inboxes" (loop 89) — $cashtag column (unmatched) vs hosted-link column (paid orders). */
main .pd-inbox { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
main .pd-inbox__col { display: grid; gap: 1rem; align-content: start; padding: 1.5rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #050705; }
main .pd-inbox__col.is-on { border-color: #36d240; background: #0a0f0a; }
main .pd-inbox [class].pd-inbox__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1rem; margin: 0; }
main .pd-inbox__h b { font-size: 17px; font-weight: 800; color: #fff; }
main .pd-inbox__h span { font-size: 12px; font-weight: 600; color: rgba(255,255,255,.5); }
main .pd-inbox__col.is-on .pd-inbox__h span { color: #36d240; }
main .pd-inbox__list { display: grid; gap: .6rem; margin: 0; padding: 0; list-style: none; }
main .pd-inbox__list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .2rem 1rem; padding: .8rem .95rem; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; background: rgba(255,255,255,.02); }
main .pd-inbox__who { font-size: 14px; color: rgba(255,255,255,.7); overflow-wrap: anywhere; }
main .pd-inbox__who b { margin-right: .35rem; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 14px; color: #fff; }
main .pd-inbox__what { grid-column: 1; font-size: 12.5px; color: rgba(255,255,255,.5); overflow-wrap: anywhere; }
main .pd-inbox__what code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11.5px; color: rgba(255,255,255,.7); }
main .pd-inbox__tag { grid-column: 2; grid-row: 1 / span 2; padding: .3rem .7rem; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
main .pd-inbox__tag.is-q { border: 1px dashed rgba(255,255,255,.3); color: rgba(255,255,255,.65); }
main .pd-inbox__tag.is-ok { background: #36d240; color: #04180a; }
main .pd-inbox__tag.is-ok::before { content: "\2713\00a0"; }
main .pd-inbox [class].pd-inbox__sum { margin: 0; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-inbox__sum b { font-size: 18px; font-weight: 800; color: #fff; margin-right: .2rem; }
main .pd-inbox__col.is-on .pd-inbox__sum b { color: #36d240; }
main section [class].pd-inbox__n { font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.5); }
@media (max-width: 767px) { main .pd-inbox { grid-template-columns: minmax(0, 1fr); } main .pd-inbox__col { padding: 1.15rem; } }

/* /cash-app-api: "Where are you starting from?" CSS-only path switcher (loop 90). Radios sit before .pd-start__opts/.pd-start__body; :checked ~ picks the label + panel. */
main .pd-start { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; overflow: hidden; }
main .pd-start__r { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
main .pd-start__opts { display: grid; gap: .6rem; align-content: start; padding: 1.25rem; border-right: 1px solid rgba(255,255,255,.08); }
main .pd-start__opts label { display: grid; gap: .2rem; padding: .95rem 1.1rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; cursor: pointer; transition: border-color .15s, background-color .15s; }
main .pd-start__opts label:hover { border-color: rgba(54,210,64,.5); }
main .pd-start__opts b { font-size: 15.5px; font-weight: 800; color: #fff; }
main .pd-start__opts span { font-size: 13px; line-height: 1.45; color: rgba(255,255,255,.55); }
main #pds-1:checked ~ .pd-start__opts [for=pds-1], main #pds-2:checked ~ .pd-start__opts [for=pds-2], main #pds-3:checked ~ .pd-start__opts [for=pds-3], main #pds-4:checked ~ .pd-start__opts [for=pds-4] { border-color: #36d240; background: #36d240; }
main #pds-1:checked ~ .pd-start__opts [for=pds-1] *, main #pds-2:checked ~ .pd-start__opts [for=pds-2] *, main #pds-3:checked ~ .pd-start__opts [for=pds-3] *, main #pds-4:checked ~ .pd-start__opts [for=pds-4] * { color: #04180a; }
main #pds-1:focus-visible ~ .pd-start__opts [for=pds-1], main #pds-2:focus-visible ~ .pd-start__opts [for=pds-2], main #pds-3:focus-visible ~ .pd-start__opts [for=pds-3], main #pds-4:focus-visible ~ .pd-start__opts [for=pds-4] { outline: 2px solid #fff; outline-offset: 2px; }
main .pd-start__body { padding: 1.75rem 1.75rem 1.5rem; }
main .pd-start__p { display: none; }
main #pds-1:checked ~ .pd-start__body .pd-start__p--1, main #pds-2:checked ~ .pd-start__body .pd-start__p--2, main #pds-3:checked ~ .pd-start__body .pd-start__p--3, main #pds-4:checked ~ .pd-start__body .pd-start__p--4 { display: block; }
main .pd-start__p ol { display: grid; gap: .75rem; margin: 1.25rem 0 0; padding: 0; list-style: none; }
main .pd-start__p li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .9rem; align-items: baseline; padding: .9rem 1rem; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; font-size: 15px; line-height: 1.55; color: rgba(255,255,255,.75); }
main .pd-start__p li > span:first-child { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 700; color: #36d240; }
main .pd-start__p code { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 13px; color: #fff; }
main .pd-start__cta { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1.5rem; margin-top: 1.5rem; }
main .pd-start__foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: 1rem 1.25rem; border-top: 1px solid rgba(255,255,255,.08); font-size: 12.5px; color: rgba(255,255,255,.6); }
main .pd-start__foot b { margin-right: .35rem; font-weight: 800; color: #fff; }
main .pd-start__foot span { padding: .25rem .65rem; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; }
/* START_GOOGLE_V1 (loop5 15): "Nothing set up yet" leads with the Google button + terms line; a picked path's heading, steps
   and buttons rise in one after another (pdWhoIn), static under reduced motion / "Pause animations". */
main .pd-start__p > .pd-lg-note { margin-top: .9rem; }
main .pd-start__opts label:active { transform: scale(.98); }
@media (prefers-reduced-motion: no-preference) {
  main .pd-start__opts label { transition: border-color .15s, background-color .15s, transform .12s; }
  main .pd-start__p > h3, main .pd-start__p li, main .pd-start__p > .pd-start__cta, main .pd-start__p > .pd-lg-note { animation: pdWhoIn .38s cubic-bezier(.2,.8,.2,1) both; }
  main .pd-start__p li:nth-child(1) { animation-delay: .05s; }
  main .pd-start__p li:nth-child(2) { animation-delay: .1s; }
  main .pd-start__p li:nth-child(3) { animation-delay: .15s; }
  main .pd-start__p > .pd-start__cta, main .pd-start__p > .pd-lg-note { animation-delay: .2s; }
  html.pd-motion-paused main .pd-start__p > h3, html.pd-motion-paused main .pd-start__p li, html.pd-motion-paused main .pd-start__p > .pd-start__cta, html.pd-motion-paused main .pd-start__p > .pd-lg-note { animation: none; }
}
@media (max-width: 767px) {
  main .pd-start { grid-template-columns: minmax(0, 1fr); }
  main .pd-start__opts { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); padding: 1rem; }
  main .pd-start__body { padding: 1.25rem 1rem; }
}

/* /third-party-cash-app-provider: "What is a third-party Cash App provider?" layer diagram + ranked reasons (loop 91). */
main .pd-stack { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1.25rem; }
main .pd-stack__col { display: grid; gap: 1.1rem; align-content: start; padding: 1.5rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; }
main .pd-stack__layers { display: grid; gap: 1.1rem; margin: 0; padding: 0; list-style: none; }
main .pd-stack__layers li { position: relative; display: grid; grid-template-columns: 4.75rem minmax(0, 1fr); gap: .15rem 1rem; padding: .95rem 1.1rem; border: 1px solid rgba(255,255,255,.1); border-radius: .9rem; background: #050705; }
main .pd-stack__layers li + li::before { content: ""; position: absolute; left: 50%; top: calc(-1.1rem - 1px); width: 1px; height: 1.1rem; background: rgba(54,210,64,.55); }
main .pd-stack__layers li.is-on { border-color: #36d240; background: rgba(54,210,64,.07); }
main .pd-stack__k { grid-row: 1 / span 2; align-self: center; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: rgba(255,255,255,.45); }
main .pd-stack__layers li.is-on .pd-stack__k { color: #36d240; }
main .pd-stack__layers b { font-size: 15.5px; font-weight: 800; color: #fff; }
main .pd-stack__d { font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.6); }
main .pd-stack__chips { grid-column: 2; display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .55rem; }
main .pd-stack__chips span { padding: .22rem .6rem; border-radius: 999px; background: #36d240; font-size: 12px; font-weight: 700; color: #04180a; }
main .pd-stack__x { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .9rem; padding: .85rem 1.1rem; border: 1px dashed rgba(255,255,255,.2); border-radius: .9rem; font-size: 13.5px; color: rgba(255,255,255,.5); }
main .pd-stack__x b { font-weight: 700; color: rgba(255,255,255,.8); }
main .pd-stack__x s { text-decoration-color: #ff6b6b; text-decoration-thickness: 2px; }
main .pd-stack__why { display: grid; gap: .75rem; margin: 0; padding: 0; list-style: none; counter-reset: pdw; }
main .pd-stack__why li { counter-increment: pdw; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .2rem .9rem; padding: .95rem 1.1rem; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; }
main .pd-stack__why li::before { content: counter(pdw, decimal-leading-zero); grid-row: 1 / span 2; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 700; line-height: 1.6; color: #36d240; }
main .pd-stack__why li:first-child { border-color: #36d240; }
main .pd-stack__why b { font-size: 15.5px; font-weight: 800; color: #fff; }
main .pd-stack__why em { margin-left: .4rem; padding: .12rem .5rem; border-radius: 999px; background: #36d240; font-size: 11px; font-style: normal; font-weight: 700; color: #04180a; vertical-align: .1em; }
main .pd-stack__why span { font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.62); }
@media (max-width: 1023px) { main .pd-stack { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) { main .pd-stack__col { padding: 1.1rem; } main .pd-stack__layers li { grid-template-columns: minmax(0, 1fr); } main .pd-stack__k { grid-row: auto; } main .pd-stack__chips { grid-column: 1; } }

/* /how-to-accept-cash-app-payments: "Can you accept Cash App payments on a website?" — "Yes." answer card + route variables + two-door fork (loop 92). */
main .pd-yes { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1.25rem; }
main .pd-yes__a, main .pd-yes__v { padding: 1.75rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; }
main .pd-yes__a { border-color: #36d240; }
main .pd-yes__big { display: block; margin-bottom: .75rem; font-family: inherit; font-size: clamp(3.5rem, 8vw, 5.5rem); font-weight: 900; line-height: .9; letter-spacing: -.04em; color: #36d240; }
main .pd-yes__v ol { display: grid; gap: .55rem; margin: 1rem 0 0; padding: 0; list-style: none; counter-reset: pdy; }
main .pd-yes__v li { counter-increment: pdy; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .1rem .8rem; padding: .7rem .9rem; border: 1px solid rgba(255,255,255,.08); border-radius: .8rem; }
main .pd-yes__v li::before { content: counter(pdy, decimal-leading-zero); grid-row: 1 / span 2; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 700; line-height: 1.7; color: #36d240; }
main .pd-yes__v b { font-size: 15px; font-weight: 800; color: #fff; }
main .pd-yes__v span { font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.58); }
main .pd-doors { padding: 1.75rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; }
main .pd-doors [class].pd-doors__lead { max-width: 48rem; margin: 0; }
main .pd-doors__row { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: stretch; gap: 1rem; margin-top: 1.5rem; }
main .pd-doors__or { align-self: center; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; font-weight: 700; text-transform: uppercase; color: rgba(255,255,255,.4); }
main .pd-doors__d { display: grid; gap: .35rem; align-content: start; padding: 1.35rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; background: #050705; }
main .pd-doors__d.is-on { border-color: #36d240; background: rgba(54,210,64,.06); }
main .pd-doors__n { font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: rgba(255,255,255,.45); }
main .pd-doors__d.is-on .pd-doors__n { color: #36d240; }
main .pd-doors__d > b { font-size: 19px; font-weight: 800; color: #fff; }
main .pd-doors__s { font-size: 13.5px; line-height: 1.5; color: rgba(255,255,255,.6); }
main .pd-doors__d ul { display: grid; gap: 0; margin: .65rem 0 0; padding: 0; list-style: none; }
main .pd-doors__d li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .2rem 1rem; padding: .6rem 0; border-top: 1px solid rgba(255,255,255,.08); font-size: 14px; }
main .pd-doors__d li span:first-child { color: rgba(255,255,255,.5); }
main .pd-doors__d li span:last-child { font-weight: 700; color: #fff; text-align: right; }
main .pd-doors__f { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1.25rem; margin-top: .9rem; }
@media (max-width: 1023px) { main .pd-yes { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
  main .pd-yes__a, main .pd-yes__v, main .pd-doors { padding: 1.15rem; }
  main .pd-doors__row { grid-template-columns: minmax(0, 1fr); }
  main .pd-doors__or { justify-self: center; }
  main .pd-doors__d li span:last-child { text-align: left; }
}
main .pd-yes__a { display: flex; flex-direction: column; justify-content: center; }

/* /igaming-premium: "What a premium plan includes" team-seat switcher reuses .pd-start (loop 93). */
main .pd-start__p li b { font-weight: 800; color: #fff; }
main .pd-start--seats .pd-start__opts label { grid-template-columns: 2.4rem minmax(0, 1fr); column-gap: .85rem; }
main .pd-start--seats .pd-start__opts label::before { content: attr(for); grid-row: 1 / span 2; align-self: center; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 999px; border: 1px solid rgba(54,210,64,.4); font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 0; color: #36d240; }
main .pd-start--seats [for=pds-1]::before { content: "OW"; font-size: 12px; }
main .pd-start--seats [for=pds-2]::before { content: "OP"; font-size: 12px; }
main .pd-start--seats [for=pds-3]::before { content: "FI"; font-size: 12px; }
main .pd-start--seats [for=pds-4]::before { content: "SU"; font-size: 12px; }
main #pds-1:checked ~ .pd-start__opts [for=pds-1]::before, main #pds-2:checked ~ .pd-start__opts [for=pds-2]::before, main #pds-3:checked ~ .pd-start__opts [for=pds-3]::before, main #pds-4:checked ~ .pd-start__opts [for=pds-4]::before { border-color: #04180a; background: #04180a; color: #36d240; }
main .pd-start--seats .pd-start__opts label[for]::before { font-size: 12px; font-weight: 700; }
main .pd-start--seats .pd-start__opts label[for=pds-1]::before { content: "OW"; }
main .pd-start--seats .pd-start__opts label[for=pds-2]::before { content: "OP"; }
main .pd-start--seats .pd-start__opts label[for=pds-3]::before { content: "FI"; }
main .pd-start--seats .pd-start__opts label[for=pds-4]::before { content: "SU"; }

/* /igaming-premium: "From application to first payment" step rail + read-only application preview (loop 94). */
main .pd-app { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 1.25rem; align-items: start; }
main .pd-app__rail { position: relative; display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
main .pd-app__rail::before { content: ""; position: absolute; left: 1.05rem; top: 1.5rem; bottom: 1.5rem; width: 1px; background: rgba(54,210,64,.35); }
main .pd-app__rail li { position: relative; display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); gap: 1rem; font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.6); }
main .pd-app__rail li > span:first-child { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; border: 1px solid rgba(54,210,64,.45); border-radius: 999px; background: #050705; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; font-weight: 700; color: #36d240; }
main .pd-app__rail li.is-on > span:first-child { background: #36d240; color: #04180a; border-color: #36d240; }
main .pd-app__rail li > span:last-child { padding: .9rem 1.05rem; border: 1px solid rgba(255,255,255,.08); border-radius: .9rem; background: #0a0f0a; }
main .pd-app__rail li.is-on > span:last-child { border-color: #36d240; }
main .pd-app__rail b { display: block; margin-bottom: .3rem; font-size: 15.5px; font-weight: 800; color: #fff; }
main .pd-app__form { display: grid; gap: 1rem; padding: 0 1.5rem 1.5rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1.25rem; background: #0a0f0a; overflow: hidden; }
main .pd-app__bar { display: flex; align-items: center; gap: .4rem; margin: 0 -1.5rem; padding: .8rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,.08); background: #050705; }
main .pd-app__bar > span { width: .6rem; height: .6rem; border-radius: 999px; background: rgba(255,255,255,.15); }
main .pd-app__bar b { margin-left: .6rem; font-size: 13.5px; font-weight: 700; color: rgba(255,255,255,.85); }
main .pd-app__bar em { margin-left: auto; padding: .15rem .55rem; border: 1px dashed rgba(255,255,255,.25); border-radius: 999px; font-size: 11px; font-style: normal; font-weight: 700; color: rgba(255,255,255,.6); }
main .pd-app__route { display: grid; gap: .5rem; }
main .pd-app__k, main .pd-app__rows li > span:first-child { font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,.7); }
main .pd-app__chips { display: flex; flex-wrap: wrap; gap: .45rem; }
main .pd-app__chips span { padding: .45rem .85rem; border: 1px solid rgba(255,255,255,.14); border-radius: .7rem; font-size: 13.5px; color: rgba(255,255,255,.6); }
main .pd-app__chips span.is-on { border-color: #36d240; background: #36d240; font-weight: 700; color: #04180a; }
main .pd-app__rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1rem; margin: 0; padding: 0; list-style: none; }
main .pd-app__rows li { display: grid; gap: .4rem; }
main .pd-app__v { padding: .6rem .8rem; border: 1px solid rgba(255,255,255,.1); border-radius: .7rem; background: #050705; font-size: 13.5px; color: rgba(255,255,255,.38); overflow-wrap: anywhere; }
main .pd-app__cta { display: flex; flex-wrap: wrap; align-items: center; gap: .9rem 1.5rem; margin-top: .25rem; }
main .pd-app__n { font-size: 12.5px; line-height: 1.55; color: rgba(255,255,255,.5); }
main .pd-app__n a { color: #36d240; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 1023px) { main .pd-app { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) { main .pd-app__form { padding: 0 1.1rem 1.1rem; } main .pd-app__bar { margin: 0 -1.1rem; } main .pd-app__rows { grid-template-columns: minmax(0, 1fr); } }

/* /igaming-premium: "Routing for gaming traffic" promise vs fine-print ledger (loop 95) — fine print at full size, never smaller. */
main .pd-fine[role=table] { border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: #0a0f0a; overflow: hidden; }
main .pd-fine__r { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 4fr) minmax(0, 5fr); gap: 1.5rem; padding: 1.35rem 1.5rem; border-top: 1px solid rgba(255,255,255,.08); }
main .pd-fine__hd { border-top: 0; padding-top: 1rem; padding-bottom: 1rem; background: #050705; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: rgba(255,255,255,.45); }
main .pd-fine__hd span:nth-child(2) { color: #36d240; }
main .pd-fine__r h3 { margin: 0; }
main .pd-fine__a { font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.82); }
main .pd-fine__b { position: relative; padding-left: 1rem; font-size: 15px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-fine__b::before { content: ""; position: absolute; left: 0; top: .3rem; bottom: .3rem; width: 2px; border-radius: 2px; background: rgba(255,255,255,.22); }
@media (max-width: 767px) {
  main .pd-fine__hd { display: none; }
  main .pd-fine__r { grid-template-columns: minmax(0, 1fr); gap: .65rem; padding: 1.15rem; }
  main .pd-fine__r:nth-child(2) { border-top: 0; }
  main .pd-fine__a::before, main .pd-fine__b::after { display: block; margin-bottom: .2rem; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
  main .pd-fine__a::before { content: "What you get"; color: #36d240; }
  main .pd-fine__b::after { content: none; }
  main .pd-fine__b::before { top: 0; bottom: 0; }
}
main section .pd-fine[role=table] { padding: 0; }

/* /cash-app-checkout: "What do you sell?" finder (loop 96). */
main .pd-sell { display: grid; gap: 1rem; }
main .pd-sell__bar { display: flex; align-items: center; gap: .75rem; padding: 0 1.25rem; border: 1px solid rgba(255,255,255,.16); border-radius: 1rem; background: #0a0f0a; color: rgba(255,255,255,.5); transition: border-color .15s; }
main .pd-sell__bar[hidden], main .pd-sell__eg[hidden], main .pd-sell__none[hidden], main .pd-sell__list li[hidden] { display: none; }
main .pd-sell__bar:focus-within { border-color: #36d240; color: #36d240; }
main .pd-sell__bar input { flex: 1; min-width: 0; height: 3.75rem; border: 0; outline: 0; background: transparent; font-size: 18px; font-weight: 600; color: #fff; }
main .pd-sell__bar input::placeholder { font-weight: 500; color: rgba(255,255,255,.35); }
main .pd-sell__eg { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; font-size: 13px; color: rgba(255,255,255,.5); }
main .pd-sell__eg span { margin-right: .25rem; }
main .pd-sell__eg button { padding: .35rem .8rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.75); transition: border-color .15s, color .15s; }
main .pd-sell__eg button:hover, main .pd-sell__eg button:focus-visible { border-color: #36d240; color: #36d240; }
main .pd-sell__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin: .5rem 0 0; padding: 0; list-style: none; }
main .pd-sell__it { display: grid; gap: .35rem; height: 100%; padding: 1.15rem 1.25rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1rem; background: #0a0f0a; transition: border-color .15s, background-color .15s; }
main .pd-sell__it:hover { border-color: rgba(54,210,64,.55); }
main .pd-sell__it b { font-size: 16px; font-weight: 800; color: #fff; }
main .pd-sell__d { font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.6); }
main .pd-sell__go { display: inline-flex; align-items: center; gap: .4rem; margin-top: .35rem; font-size: 13px; font-weight: 700; color: #36d240; }
main .pd-sell__list li.is-top .pd-sell__it { border-color: #36d240; background: #36d240; }
main .pd-sell__list li.is-top .pd-sell__it * { color: #04180a; }
main .pd-sell__none { padding: 1.1rem 1.25rem; border: 1px dashed rgba(255,255,255,.2); border-radius: 1rem; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.65); }
main .pd-sell__none b { color: #fff; }
main .pd-sell__none a { font-weight: 700; color: #36d240; text-decoration: underline; text-underline-offset: 2px; }
main .pd-sell__n { font-size: 12.5px; color: rgba(255,255,255,.45); }
@media (max-width: 1023px) { main .pd-sell__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 639px) { main .pd-sell__list { grid-template-columns: minmax(0, 1fr); } main .pd-sell__bar input { font-size: 16px; height: 3.4rem; } }

/* /digital-shop-payments: "Checkout built around your orders" start → carry → release rail (loop 97). */
main .pd-ol { position: relative; display: grid; gap: 1rem; margin: 3rem 0 0; padding: 0; list-style: none; }
main .pd-ol::before { content: ""; position: absolute; left: 21px; top: 22px; bottom: 22px; width: 2px; background: linear-gradient(#36d240, rgba(54,210,64,.15)); }
main .pd-ol > li { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 1.25rem; }
main .pd-ol__n { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 999px; background: #36d240; font-size: 17px; font-weight: 900; color: #04180a; }
main .pd-ol__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; align-items: center; padding: 1.5rem 1.75rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #0a0f0a; }
main .pd-ol > li:first-child .pd-ol__row { grid-template-columns: minmax(0, 1fr); }
main .pd-ol__k { display: block; margin-bottom: .6rem; font-size: 22px; font-weight: 900; letter-spacing: -.01em; color: #36d240; }
main .pd-ol h3 { font-size: 17px; font-weight: 800; color: #fff; }
main .pd-ol__t p { margin: .4rem 0 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,.62); }
main .pd-ol__t p + h3 { margin-top: 1.1rem; }
main .pd-ol__two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
main .pd-ol__two > div { padding: 1.15rem 1.25rem; border: 1px solid rgba(255,255,255,.08); border-radius: 1rem; }
main .pd-ol__a { display: inline-flex; align-items: center; gap: .4rem; margin-top: .75rem; font-size: 13.5px; font-weight: 700; color: #36d240; }
main .pd-ol__link { padding: 1.1rem 1.25rem; border: 1px solid rgba(54,210,64,.35); border-radius: 1rem; background: #050705; }
main .pd-ol__lh { display: block; margin-bottom: .75rem; font-size: 12px; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-ol__link dl { display: grid; gap: .5rem; margin: 0; }
main .pd-ol__link dl > div { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem .75rem; border-radius: .6rem; background: rgba(255,255,255,.04); font-size: 14px; }
main .pd-ol__link dt { color: rgba(255,255,255,.5); }
main .pd-ol__link dd { margin: 0; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }
main .pd-ol__link .is-tag { background: rgba(54,210,64,.12); }
main .pd-ol__link .is-tag dd { color: #36d240; }
main .pd-ol__hook { display: flex; align-items: center; gap: .75rem; }
main .pd-ol__ev, main .pd-ol__st { flex: 1; min-width: 0; display: grid; gap: .25rem; padding: .9rem 1rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1rem; background: #050705; font-size: 12.5px; color: rgba(255,255,255,.55); }
main .pd-ol__ev b { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; color: #fff; overflow-wrap: anywhere; }
main .pd-ol__st { border-color: #36d240; background: #36d240; color: #04180a; }
main .pd-ol__st b { font-size: 14px; color: #04180a; }
main .pd-ol__st span { font-weight: 700; }
main .pd-ol__arr { flex: none; color: #36d240; }
main .pd-ol__cat { display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 1rem; margin: 1rem 0 0 calc(44px + 1.25rem); padding: 1.1rem 1.5rem; border: 1px dashed rgba(255,255,255,.18); border-radius: 1rem; }
main .pd-ol__cat h3 { font-size: 15px; font-weight: 800; color: #fff; }
main .pd-ol__cat p { margin: 0; font-size: 14.5px; color: rgba(255,255,255,.65); }
@media (max-width: 1023px) { main .pd-ol__row { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 639px) {
  main .pd-ol::before { left: 15px; }
  main .pd-ol > li { grid-template-columns: 32px minmax(0, 1fr); gap: .75rem; }
  main .pd-ol__n { width: 32px; height: 32px; font-size: 14px; }
  main .pd-ol__row { padding: 1.15rem; gap: 1rem; }
  main .pd-ol__two { grid-template-columns: minmax(0, 1fr); }
  main .pd-ol__hook { flex-direction: column; align-items: stretch; }
  main .pd-ol__arr { align-self: center; transform: rotate(90deg); }
  main .pd-ol__cat { margin-left: 0; }
}

/* /wordpress-plugin: "Include these details" → support report builder (loop 99). */
main .pd-ticket__f { display: grid; gap: 1rem; }
main .pd-ticket fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
main .pd-ticket legend { margin-bottom: .6rem; padding: 0; font-size: 14px; line-height: 1.55; color: rgba(255,255,255,.7); }
main .pd-ticket legend code { color: #36d240; }
main .pd-ticket__g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
main .pd-ticket__g--v { grid-template-columns: repeat(4, minmax(0, 1fr)); }
main .pd-ticket__g--v > :first-child, main .pd-ticket__wide { grid-column: 1 / -1; }
main .pd-ticket__fl { display: grid; gap: .3rem; min-width: 0; }
main .pd-ticket__fl > span { font-size: 12px; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-ticket input:not([type=radio]), main .pd-ticket textarea { width: 100%; min-width: 0; padding: .6rem .75rem; border: 1px solid rgba(255,255,255,.14); border-radius: .65rem; background: #050705; font-size: 15px; color: #fff; color-scheme: dark; outline: 0; resize: vertical; }
main .pd-ticket input:not([type=radio]):focus, main .pd-ticket textarea:focus { border-color: #36d240; }
main .pd-ticket ::placeholder { color: rgba(255,255,255,.3); }
main .pd-ticket__seg { display: flex; flex-wrap: wrap; gap: .4rem; }
main .pd-ticket__seg label { position: relative; cursor: pointer; }
main .pd-ticket__seg input { position: absolute; opacity: 0; width: 1px; height: 1px; }
main .pd-ticket__seg span { display: inline-block; padding: .45rem .8rem; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; font-size: 13px; font-weight: 700; color: rgba(255,255,255,.75); }
main .pd-ticket__seg input:checked + span { border-color: #36d240; background: #36d240; color: #04180a; }
main .pd-ticket__seg input:focus-visible + span { outline: 2px solid #36d240; outline-offset: 2px; }
main .pd-ticket__out[hidden] { display: none; }
main .pd-ticket__out { margin-top: 1.25rem; padding: 1rem; border: 1px solid rgba(255,255,255,.12); border-radius: 1rem; background: #050705; }
main .pd-ticket.is-done .pd-ticket__out { border-color: #36d240; }
main .pd-ticket__oh { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; }
main .pd-ticket__oh b { font-size: 15px; color: #fff; }
main .pd-ticket__oh span { font-size: 12.5px; color: rgba(255,255,255,.5); }
main .pd-ticket.is-done .pd-ticket__oh span { color: #36d240; font-weight: 700; }
main .pd-ticket__oh .pill { margin-left: auto; padding: .5rem 1rem; font-size: 13px; font-weight: 800; }
main .pd-ticket pre { margin: .85rem 0 0; max-height: 15rem; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-family: "JetBrains Mono", ui-monospace, monospace; font-size: 12px; line-height: 1.6; color: rgba(255,255,255,.8); }
main .pd-ticket__go { display: inline-flex; align-items: center; gap: .4rem; margin-top: .75rem; font-size: 13.5px; font-weight: 700; color: #36d240; }
main .pd-ticket__n { display: block; margin-top: .75rem; font-size: 12.5px; color: rgba(255,255,255,.45); }
@media (max-width: 639px) { main .pd-ticket__g, main .pd-ticket__g--v { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
main .pd-ticket__g > .pd-ticket__seg { grid-column: 1 / -1; }
@media (min-width: 901px) { main .wp-maintenance--support .wp-maintenance__support-grid > div:first-child { position: sticky; top: calc(110px + var(--pd-eb, 0px)); } }
/* REPORT_DOCK_V1 (loop5 46): /wordpress-plugin "Checkout stopped?" — the report the fields build sat under the form, out of view
   while typing, and the sticky left column was empty below its buttons. The report now lives in that column: from 901px it sits
   under the intro, above "Open support tickets" (fill, copy, open a ticket, top to bottom); below 901px it follows the form card. */
@media (min-width: 901px) {
  main .wp-maintenance--support .wp-maintenance__support-grid > div:first-child { display: flex; flex-direction: column; }
  main .wp-maintenance--support .wp-maintenance__actions, main .wp-maintenance--support .wp-maintenance__small { order: 1; }
  main .wp-maintenance--support .pd-ticket__out { margin-top: 1.75rem; }
  main .wp-maintenance--support .pd-ticket__go { display: none; }
}
@media (max-width: 900px) {
  main .wp-maintenance--support .wp-maintenance__support-grid { display: flex; flex-direction: column; gap: 0; }
  main .wp-maintenance--support .wp-maintenance__support-grid > div:first-child { display: contents; }
  main .wp-maintenance--support .wp-maintenance__evidence { margin-top: 28px; }
  main .wp-maintenance--support .pd-ticket__out { order: 1; }
}
@media (max-width: 639px) { main .pd-ticket__g:not(.pd-ticket__g--v) { grid-template-columns: minmax(0, 1fr); } }

/* Home: "Risk screening and security" two text cards → checkout pipeline + never-stored / protected-by vault (loop 100). */
main .pd-vault__c { display: flex; flex-direction: column; padding: 1.75rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.5rem; background: #0a0f0a; }
main .pd-vault__c > p { margin: .75rem 0 0; font-size: 14.5px; line-height: 1.65; color: rgba(255,255,255,.62); }
main .pd-vault__pipe, main .pd-vault__cols { margin-top: auto; padding-top: 1.5rem; }
main .pd-vault__pipe { display: grid; gap: .6rem; }
main .pd-vault__in { justify-self: start; padding: .4rem .8rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; font-size: 13px; font-weight: 700; color: rgba(255,255,255,.75); }
main .pd-vault__rm { position: relative; display: grid; gap: .15rem; padding: .9rem 1.1rem; border-radius: 1rem; background: #36d240; color: #04180a; }
main .pd-vault__rm b { font-size: 16px; font-weight: 900; }
main .pd-vault__rm small { font-size: 12.5px; font-weight: 600; }
main .pd-vault__pipe ul { display: grid; gap: .4rem; margin: 0; padding: 0 0 0 1.1rem; border-left: 2px solid rgba(54,210,64,.4); list-style: none; }
main .pd-vault__pipe li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem .75rem; padding: .6rem .85rem; border: 1px solid rgba(255,255,255,.09); border-radius: .75rem; background: #050705; font-size: 13.5px; }
main .pd-vault__pipe li span { font-weight: 700; color: #fff; }
main .pd-vault__pipe li em { display: inline-flex; align-items: center; gap: .35rem; font-style: normal; font-size: 12.5px; font-weight: 700; color: #36d240; }
main .pd-vault__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
main .pd-vault__cols > div { padding: 1rem 1.1rem; border: 1px solid rgba(255,255,255,.09); border-radius: 1rem; background: #050705; }
main .pd-vault__k { display: block; margin-bottom: .6rem; font-size: 12px; font-weight: 700; color: rgba(255,255,255,.5); }
main .pd-vault__cols ul { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
main .pd-vault__cols li { display: flex; align-items: baseline; gap: .55rem; font-size: 14px; font-weight: 600; }
main .pd-vault__no li { color: rgba(255,255,255,.55); text-decoration: line-through; text-decoration-color: #ff6b6b; }
main .pd-vault__no li::before { content: "×"; font-weight: 900; color: #ff6b6b; text-decoration: none; display: inline-block; }
main .pd-vault__yes li { color: #fff; }
main .pd-vault__yes li::before { content: "✓"; font-size: 12px; font-weight: 900; color: #36d240; }
main .pd-vault__a { align-self: flex-start; }
@media (max-width: 639px) {
  main .pd-vault__c { padding: 1.25rem; }
  main .pd-vault__cols { grid-template-columns: minmax(0, 1fr); }
}

/* HERO_TABLET_V2 (loop3 07): between 820 and 1023px the landing heroes stacked, leaving the mock centred under
   left-aligned copy with the right half empty. Copy and mock now sit side by side, as from 1024px up. The cost
   table and the API terminal need the full width, so those two heroes stay stacked. */
@media (min-width: 820px) and (max-width: 1023.98px) {
  main section:first-of-type .grid.items-center.gap-12.lg\:grid-cols-\[1\.1fr_1fr\]:not(:has(.pd-cost--hero, .pd-term)) { grid-template-columns: minmax(0, 1fr) 340px; gap: 2.5rem; align-items: start; }
  main section:first-of-type .grid.items-center.gap-12.lg\:grid-cols-\[1\.1fr_1fr\]:not(:has(.pd-cost--hero, .pd-term)) h1 { font-size: 2.6rem; }
}

/* PD_CONTROLS_V1 (loop5 01): one feel for every public button and field.
   Buttons ease on one curve, lift on hover and press in on click; fields ease into their focus ring;
   phone fields are 16px so iOS Safari does not zoom the page on focus. */
:is(a, button).pill, .pd-closing :is(a, button).pill {
  transition-property: transform, background-color, border-color, color, box-shadow, opacity;
  transition-duration: .2s;
  transition-timing-function: cubic-bezier(.2, .8, .2, 1);
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) { :is(a, button).pill:hover { transform: translateY(-1px); } }
:is(a, button).pill:active { transform: translateY(0) scale(.97); transition-duration: .08s; }
:is(a, button).pill:is(:disabled, [aria-disabled="true"]) { opacity: .5; cursor: not-allowed; transform: none; }
:where(main, form) :where(input:not([type=checkbox], [type=radio], [type=range], [type=hidden]), select, textarea) {
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease, outline-offset .15s ease;
}
/* pd-responsive-fixes gives phone inputs 16px at (0,3,2), but `main select` / `main textarea` there lose to component rules
   such as `main .pd-tamper textarea` (13px) or `main .pd-roster select` (14px); :is() lifts them to the same weight. */
@media (max-width: 1023.98px) { main :is(input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea) { font-size: 16px; } }
@media (prefers-reduced-motion: reduce) {
  :is(a, button).pill:is(:hover, :active) { transform: none; }
}

/* PD_EB_OFFSET_V1 (loop5 02): the announcement bar (templates/engineer_bar.php) adds 40px to the fixed header and sets
   --pd-eb while it is shown; sticky tops above and anchor jumps add it so nothing tucks under the nav. */
section[id] { scroll-margin-top: calc(96px + var(--pd-eb, 0px)); }

/* CK_CLAIM_V1 (loop5 29): the homepage demo checkout. The phone body-text floor (site css, main :is(p,li,dd)[class], 0,2,4)
   shrank its display-size amounts ("$50.00 USD" due, paid, processing) to 16px; they keep their own size. The receipt ends
   on "Start free, get your own link" (or "Claim @name"), rising in when the payment completes. */
@media (max-width: 767px) {
  main p.display[class].text-\[1\.75rem\] { font-size: 1.75rem; line-height: .95; }
  main p.display[class].text-\[2rem\] { font-size: 2rem; line-height: .95; }
}
@media (prefers-reduced-motion: no-preference) {
  #ckDone .ck-claim { animation: ck-claim-in .5s .25s cubic-bezier(.2, .8, .2, 1) both; }
  @keyframes ck-claim-in { from { opacity: 0; transform: translateY(10px); } }
}

/* FAQ_SPLIT_V1 (loop5 31): the FAQ on 11 marketing pages was a 768px column of grey cards with the right
   ~40% of the desktop row empty, and an open card looked like a closed one apart from the chevron. From
   1024px the heading sits sticky on the left and the questions fill the right; questions are numbered,
   the open card turns green-edged and its answer lines up under the question text. */
main .max-w-7xl:has(> .space-y-3 > .faq-item) { counter-reset: faq; }
main .faq-item { counter-increment: faq; transition: border-color .2s; }
main .faq-q { justify-content: flex-start; gap: .75rem; }
main .faq-q::before { content: counter(faq, decimal-leading-zero); flex: none; min-width: 1.5rem; font: 700 12px/1 "JetBrains Mono", ui-monospace, monospace; color: rgba(54,210,64,.55); transition: color .2s; }
main .faq-q > .faq-chev { flex: none; margin-left: auto; }
main .faq-a > div { padding-left: 2.25rem; }
main .faq-item.card:hover { border-color: rgba(54,210,64,.3); }
main .faq-item.card.is-open { border-color: rgba(54,210,64,.5); background: linear-gradient(180deg, #0f1a10, #0a0d0a); }
main .faq-item.is-open .faq-q::before { color: #36d240; }
main .faq-q:focus-visible { outline: none; }
main .faq-item:has(.faq-q:focus-visible) { outline: 2px solid #36d240; outline-offset: 2px; }
@media (min-width: 1024px) {
  main .max-w-7xl:has(> .space-y-3 > .faq-item) { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 4rem; align-items: start; }
  main .max-w-7xl:has(> .space-y-3 > .faq-item) > :first-child { position: sticky; top: calc(6.5rem + var(--pd-eb, 0px)); max-width: none; margin: 0; text-align: left; }
  main .max-w-7xl:has(> .space-y-3 > .faq-item) > :first-child > h2 { margin-top: 0; }
  main .max-w-7xl > .space-y-3:has(> .faq-item) { max-width: none; margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
  main .faq-item, main .faq-q::before { transition: none; }
}
/* METHOD_LANES_V1 (loop5 43): /igaming-premium "Methods by plan" — two lanes (what the Free plan has, what Premium adds) in
   place of five tiles that each repeated their own badge and left a hole in a 3-column grid. */
main .pd-mlanes { display: grid; gap: 12px; }
main .pd-mlane { padding: 1.1rem 1.2rem 1.2rem; border: 1px solid rgba(255,255,255,.1); border-radius: 1.25rem; background: rgba(255,255,255,.02); }
main .pd-mlane--up { border-color: rgba(54,210,64,.4); background: linear-gradient(135deg, rgba(54,210,64,.09), rgba(54,210,64,.02) 70%); }
main .pd-mlane > p { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.55); }
main .pd-mlane--up > p { color: #36d240; }
main .pd-mlane--up > p::before { content: "+ "; }
main .pd-mlane ul { display: flex; flex-wrap: wrap; gap: 8px; margin: .85rem 0 0; padding: 0; list-style: none; }
main .pd-mlane li { display: inline-flex; align-items: center; gap: .6rem; padding: .35rem .95rem .35rem .35rem; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(0,0,0,.25); font-size: 14px; font-weight: 600; color: #fff; }
main .pd-mlane li > span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(54,210,64,.12); color: #36d240; font-size: 13px; }
main .pd-mlane--up li { border-color: rgba(54,210,64,.25); }
@media (min-width: 1024px) { main .pd-mlanes { grid-template-columns: minmax(0,2fr) minmax(0,3fr); } }
@media (max-width: 639px) {
  main .pd-mlane { padding: .95rem 1rem 1rem; }
  main .pd-mlane ul { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  main .pd-mlane li { gap: .45rem; padding: .3rem .6rem .3rem .3rem; font-size: 13px; white-space: nowrap; }
  main .pd-mlane li > span { width: 28px; height: 28px; }
}
/* ASK_SPLIT_V1 (loop5 44): a full-width .pd-ask--wide picker is a list + answer pane from 1024px. The picks stack on the left
   (the picked one points right), the answer fills the pane beside them and the empty pane says where to start. */
@media (min-width: 1024px) {
  main .pd-ask--wide { display: grid; grid-template-columns: minmax(0,5fr) minmax(0,7fr); grid-template-rows: auto 1fr; }
  main .pd-ask--wide .pd-ask__t { grid-area: 1 / 1; border-right: 1px solid rgba(255,255,255,.08); }
  main .pd-ask--wide .pd-ask__pick { grid-area: 2 / 1; grid-template-columns: 1fr; align-content: start; padding: .75rem; border-bottom: 0; border-right: 1px solid rgba(255,255,255,.08); }
  main .pd-ask--wide .pd-ask__pick label { justify-content: flex-start; padding: .55rem 2.75rem .55rem 2.4rem; text-align: left; }
  main .pd-ask--wide .pd-ask__pick label::after { content: "\2192"; position: absolute; right: 1.1rem; top: 50%; margin-top: -.6em; line-height: 1.2; opacity: 0; transform: translateX(-6px); transition: opacity .2s, transform .2s; }
  main .pd-ask--wide .pd-ask__pick label:hover::after { opacity: .5; transform: none; }
  main .pd-ask--wide .pd-ask__pick input:checked + label::after { opacity: 1; transform: none; }
  main .pd-ask--wide .pd-ask__out { grid-area: 1 / 2 / 3; display: flex; flex-direction: column; gap: 1rem; padding: 2rem 2.25rem 1.5rem; }
  main .pd-ask--wide .pd-ask__hint { flex: 1; display: flex; align-items: center; justify-content: center; padding: 2rem; border: 1px dashed rgba(255,255,255,.14); border-radius: 1.25rem; text-align: center; }
  main .pd-ask--wide .pd-ask__hint::before { content: "\2190\00a0"; color: #36d240; }
  main .pd-ask--wide .pd-ask__a { padding-left: 1.25rem; }
  main .pd-ask--wide .pd-ask__a b { font-size: 21px; }
  main .pd-ask--wide [class].pd-ask__a p, main .pd-ask--wide .pd-ask__a p { font-size: 15.5px; }
  main .pd-ask--wide [class].pd-ask__n, main .pd-ask--wide .pd-ask__n { margin-top: auto; }
}
@media (min-width: 1024px) and (prefers-reduced-motion: reduce) { main .pd-ask--wide .pd-ask__pick label::after { transition: none; transform: none; } }