.payg-page{max-width:1180px;color:var(--ink);margin:auto;padding:64px 32px 72px}.payg-heading{grid-template-columns:1.1fr 1fr;align-items:end;gap:64px;margin-bottom:56px;display:grid}.payg-heading h1{letter-spacing:-.035em;margin:0;font-size:clamp(32px,3.5vw,44px);line-height:1.18}.payg-heading p{max-width:42ch;color:var(--muted);margin:0 0 20px;line-height:1.75}.payg-usage{border-block:1px solid var(--line)}.payg-flow{background:var(--surface);border-radius:16px;margin-bottom:44px;padding:28px 32px 20px}.payg-flow-top{justify-content:space-between;align-items:center;gap:24px;display:flex}.payg-flow-top h2{letter-spacing:-.025em;max-width:30ch;margin:0;font-size:22px;line-height:1.4}.payg-play{border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit;cursor:pointer;border-radius:24px;flex-shrink:0;align-items:center;gap:7px;padding:9px 12px;font-size:12px;display:inline-flex}.payg-play:disabled{cursor:default;color:var(--muted)}.payg-page .payg-play svg{width:15px;height:15px}.payg-flow button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}.payg-flow-art{max-width:800px;margin:22px auto 28px}.payg-page .payg-flow-canvas{stroke-width:1.5px;width:100%;height:auto;display:block;overflow:visible}.payg-flow-wallet,.payg-flow-request,.payg-flow-record{fill:var(--paper);stroke:var(--ink);transition:opacity .4s}.payg-flow-request,.payg-flow-record{opacity:.35}.payg-flow[data-step="1"] .payg-flow-request,.payg-flow[data-step="2"] .payg-flow-request,.payg-flow[data-step="2"] .payg-flow-record{opacity:1}.payg-wallet-pocket{fill:var(--surface)}.payg-credit-blocks{fill:var(--ink);stroke:none}.payg-flow-track{stroke:var(--muted);stroke-dasharray:3 7;opacity:.4}.payg-flow-return{stroke:var(--blue);stroke-dasharray:5 7;opacity:0;transition:opacity .4s}.payg-flow[data-step="2"] .payg-flow-return{opacity:.7}.payg-record-check{stroke:var(--blue);stroke-width:3px;stroke-dasharray:60;stroke-dashoffset:60px;transition:stroke-dashoffset .65s cubic-bezier(.16,1,.3,1)}.payg-flow[data-step="2"] .payg-record-check{stroke-dashoffset:0}.payg-flow-packet{fill:var(--ink);stroke:none;animation:1.2s cubic-bezier(.16,1,.3,1) both payg-transfer}.payg-flow[data-step="0"] .payg-flow-packet{opacity:0;animation:none}.payg-flow[data-playing=false] .payg-flow-packet{animation-play-state:paused}.payg-flow-labels{text-align:center;color:var(--muted);grid-template-columns:repeat(3,1fr);gap:12px;font-size:12px;display:grid}.payg-flow-bottom{border-top:1px solid var(--line);grid-template-columns:1fr 1.1fr;gap:48px;padding-top:24px;display:grid}.payg-flow-steps{flex-direction:column;align-items:flex-start;gap:6px;display:flex}.payg-flow-steps button{min-height:40px;color:var(--muted);font:inherit;cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:12px;padding:4px 0;font-size:13px;display:flex}.payg-flow-steps button span{border:1px solid var(--line);font-variant-numeric:tabular-nums;border-radius:50%;place-items:center;width:24px;height:24px;font-size:11px;display:grid}.payg-flow-steps button[aria-pressed=true]{color:var(--ink);font-weight:600}.payg-flow-steps button[aria-pressed=true] span{color:var(--paper);background:var(--ink);border-color:var(--ink)}.payg-flow-steps button:hover{color:var(--ink)}.payg-flow-explanation h3{letter-spacing:-.02em;margin:7px 0 10px;font-size:18px}.payg-flow-explanation p{color:var(--muted);max-width:48ch;min-height:100px;margin:0;font-size:14px;line-height:1.8}.payg-flow-caption{color:var(--muted);margin:24px 0 0;font-size:11px;line-height:1.6}@keyframes payg-transfer{0%{transform:translate(0)}to{transform:translate(60px)}}@media (max-width:700px){.payg-flow{margin-bottom:30px;padding:22px 18px 18px}.payg-flow-top{align-items:flex-start;gap:12px}.payg-flow-top h2{font-size:19px}.payg-play{padding:8px;font-size:11px}.payg-flow-art{margin:24px -6px}.payg-flow-labels{gap:4px;font-size:10px}.payg-flow-bottom{grid-template-columns:1fr;gap:20px}.payg-flow-steps{flex-direction:row;justify-content:space-between;gap:12px}.payg-flow-steps button{flex-direction:column;flex:1;align-items:flex-start;gap:8px;font-size:11px}.payg-flow-explanation p{min-height:100px;font-size:13px}}@media (prefers-reduced-motion:reduce){.payg-flow-packet{animation:none}.payg-flow-wallet,.payg-flow-request,.payg-flow-record,.payg-flow-return,.payg-record-check{transition:none}}.payg-workloads{border-bottom:1px solid var(--line);gap:8px;padding:20px 0;display:flex}.payg-workloads button{color:var(--muted);box-shadow:none;font:inherit;cursor:pointer;background:0 0;border:0;border-radius:28px;justify-content:center;align-items:center;gap:10px;padding:12px 22px;font-size:14px;display:flex}.payg-workloads button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.payg-workloads button:hover:not([aria-pressed=true]){background:var(--surface);color:var(--ink)}.payg-page svg{stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;fill:none;flex-shrink:0;width:24px;height:24px}.payg-usage-body{grid-template-columns:1fr 1.15fr;align-items:center;gap:72px;padding:48px 0;display:grid}.payg-usage-copy h2{letter-spacing:-.025em;max-width:18ch;margin:0 0 16px;font-size:clamp(25px,2.5vw,32px);line-height:1.3}.payg-usage-copy p{color:var(--muted);max-width:44ch;margin:0 0 24px;font-size:15px;line-height:1.8}.payg-usage-copy a{color:var(--ink);text-underline-offset:5px;align-items:center;gap:12px;font-size:14px;font-weight:600;display:inline-flex}.payg-usage-copy .payg-rate-note{margin-top:36px;margin-bottom:0;font-size:12px}.payg-receipt{background:var(--surface);border-radius:16px;min-width:0;padding:28px}.payg-receipt header{border-bottom:1px solid var(--line);align-items:center;gap:14px;padding-bottom:24px;display:flex}.payg-receipt header>svg{width:36px;height:36px;color:var(--blue)}.payg-receipt h3{margin:0 0 5px;font-size:17px}.payg-receipt header span{color:var(--muted);font-size:12px}.payg-receipt ul{margin:0;padding:12px 0;list-style:none}.payg-receipt li{justify-content:space-between;align-items:center;gap:16px;padding:13px 0;font-size:13px;line-height:1.6;animation:.45s ease-out both payg-line;display:flex}.payg-receipt li svg{width:18px;height:18px;color:var(--blue)}.payg-equation{color:var(--muted);border-block:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:10px;padding:15px 0;font-size:12px;display:flex}.payg-settled{flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px;font-size:13px;display:flex}.payg-settled strong{color:var(--blue);font-weight:600}.payg-receipt>p{color:var(--muted);margin:20px 0 0;font-size:11px;line-height:1.7}.payg-lifecycle{grid-template-columns:1fr 1.15fr;gap:72px;padding:64px 0;display:grid}.payg-lifecycle h2,.payg-next h2{letter-spacing:-.025em;margin:0;font-size:26px;line-height:1.35}.payg-lifecycle ol{margin:0;padding-left:24px;list-style:decimal}.payg-lifecycle li{padding-bottom:28px;padding-left:12px}.payg-lifecycle li:last-child{padding-bottom:0}.payg-lifecycle li::marker{color:var(--blue);font-variant-numeric:tabular-nums;font-size:13px}.payg-lifecycle h3{margin:0 0 10px;font-size:16px}.payg-lifecycle p{color:var(--muted);margin:0;font-size:14px;line-height:1.8}.payg-next{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:32px;padding-top:40px;display:flex}.payg-next p{color:var(--muted);margin:12px 0 0;font-size:14px;line-height:1.6}.payg-next>div:last-child{flex-wrap:wrap;align-items:center;gap:20px;display:flex}.payg-next>div>a:not(.button){color:var(--ink);text-underline-offset:5px;font-size:13px}@keyframes payg-line{0%{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}@media (max-width:700px){.payg-page{padding:36px 20px 48px}.payg-heading,.payg-usage-body,.payg-lifecycle{grid-template-columns:minmax(0,1fr);gap:28px}.payg-heading{margin-bottom:32px}.payg-workloads{justify-content:space-between;gap:4px}.payg-workloads button{border-radius:12px;flex-direction:column;gap:6px;min-width:0;padding:10px 12px;font-size:12px}.payg-usage-body{padding:28px 0}.payg-usage-copy h2{max-width:none}.payg-usage-copy .payg-rate-note{margin-top:20px}.payg-receipt{padding:22px}.payg-lifecycle{padding:40px 0}.payg-next{flex-direction:column;align-items:start}}@media (prefers-reduced-motion:reduce){.payg-receipt li{animation:none}}
