/* Purchase surfaces share the product's colors and sizing tokens. */
.credit-packs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-12)}
.credit-option{font:inherit;text-align:left;color:var(--ink);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r-lg);padding:var(--sp-20);cursor:pointer;display:flex;flex-direction:column;min-width:0;transition:transform var(--dur-3) var(--ease),filter var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease),background-color var(--dur-2) var(--ease),box-shadow var(--dur-3) var(--ease)}
.credit-option[aria-checked="true"]{border-color:var(--hot);background:var(--hot-ghost);box-shadow:inset 0 0 0 1px var(--hot)}
.credit-option:focus-visible{outline:2px solid var(--hot);outline-offset:4px}
.credit-option-top{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-8);min-height:24px;font-size:var(--t-base);color:var(--ink-2);margin-bottom:var(--sp-24)}
.credit-tag{background:var(--hot);color:var(--surface-0);border-radius:var(--r-full);padding:var(--sp-4) var(--sp-8);font-size:var(--t-sm);font-weight:700;white-space:nowrap}
.credit-radio{width:16px;height:16px;border:1px solid var(--ink-3);border-radius:50%}
[aria-checked="true"] .credit-radio{border:5px solid var(--hot)}
.credit-option .cr{font-size:var(--t-base);color:var(--ink-2)}
.credit-option .cr strong{font-size:var(--t-5xl);font-weight:700;letter-spacing:-.04em;color:var(--ink);font-variant-numeric:tabular-nums}
.credit-output{font-size:var(--t-lg);color:var(--ink-1);margin:var(--sp-8) 0 var(--sp-24)}
.credit-cost{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-8);font-size:var(--t-3xl);font-weight:700}
.credit-cost small,.credit-unit{font-size:var(--t-base);font-weight:400;color:var(--ink-2)}
.credit-unit{margin-top:var(--sp-6)}
.credit-order{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-24);padding:var(--sp-24);border:1px solid var(--line-2);background:var(--panel);border-radius:var(--r-lg);margin-top:var(--sp-16)}
.credit-order-item{display:grid;gap:var(--sp-6)}
.credit-order-item>span,.credit-order-action>div>span{font-size:var(--t-base);color:var(--ink-2)}
.credit-order-item>strong{font-size:var(--t-2xl)}
.credit-order-item>small{font-size:var(--t-md);color:var(--ink-2)}
.credit-order-action{display:flex;align-items:center;gap:var(--sp-32)}
.credit-order-action>div{display:grid;gap:var(--sp-4);text-align:right}
.credit-order-action strong{font-size:var(--t-4xl);letter-spacing:-.03em;white-space:nowrap}
.credit-order .credit-buy{height:var(--ctl-hero);min-width:200px;justify-content:space-between;border-radius:var(--r);font-size:var(--t-lg);padding:0 var(--sp-20)}
.credit-terms,.credit-mode{font-size:var(--t-base);line-height:1.7;color:var(--ink-2);margin:var(--sp-10) 0 0}
.credit-mode{color:var(--ink-1)}
.credit-basis{font-size:var(--t-base);color:var(--ink-2);line-height:1.7;margin:var(--sp-16) 0}
.bill-wallet-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:var(--sp-16);margin-bottom:var(--sp-32)}
.bill-wallet-grid>.box{border-radius:var(--r-lg);padding:var(--sp-24)}
.bill-wallet{border-color:var(--hot-dim);background:linear-gradient(125deg,var(--hot-ghost),var(--panel) 72%)}
.bill-wallet .box-head h3,.bill-subscription>h3{font-size:var(--t-md);font-family:var(--body);letter-spacing:0;text-transform:none;color:var(--ink-2)}
.bill-wallet .box-head .btn{height:var(--ctl-xl);font-size:var(--t-md)}
.bill-wallet .big{font-size:var(--t-6xl);letter-spacing:-.04em;font-weight:700;margin:var(--sp-12) 0}
.bill-wallet .big small{font-size:var(--t-md);font-weight:400;letter-spacing:0;color:var(--ink-2);margin-left:var(--sp-8)}
.bill-wallet>p{font-size:var(--t-base);color:var(--ink-2);line-height:1.7;margin:var(--sp-6) 0 0}
.bill-plan-name{display:block;font-size:var(--t-4xl);letter-spacing:-.025em;margin:var(--sp-16) 0 var(--sp-8)}
.bill-plan-copy{font-size:var(--t-md);color:var(--ink-1);line-height:1.7;margin:0 0 var(--sp-16)}
.bill-subscription #sub>.btn{height:var(--ctl-xl);font-size:var(--t-md)}
.bill-shop{scroll-margin-top:112px;margin:var(--sp-32) 0}
.bill-shop-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-20);margin-bottom:var(--sp-16)}
.bill-shop-head h3{font:700 var(--t-3xl) var(--body);letter-spacing:-.02em;margin:0}
.bill-shop-head p{font-size:var(--t-md);color:var(--ink-2);margin:var(--sp-8) 0 0;line-height:1.6}
.bill-shop-head>a{font-size:var(--t-md);color:var(--ink-1);white-space:nowrap;text-decoration:underline;text-underline-offset:4px}
.bill-stats>.sum-tile{grid-column:span 6}
.bill-stats .big{font-size:var(--t-4xl)}
.credit-order .credit-buy,.bill-wallet .btn,.bill-subscription .btn{transition:transform var(--dur-2) var(--ease),filter var(--dur-2) var(--ease),background-color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease),box-shadow var(--dur-2) var(--ease)}
.credit-buy>span{transition:transform var(--dur-2) var(--ease)}
/* Soft light on purchase controls; preserve each button's base color and state. */
.billing-surface .btn:not(:disabled){background-image:linear-gradient(120deg,rgba(255,255,255,.22),rgba(255,255,255,.045) 48%,rgba(0,0,0,.18));box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.16)}
.billing-surface .btn.primary:not(:disabled){background-color:var(--hot);background-image:linear-gradient(115deg,color-mix(in srgb,var(--hot) 52%,var(--ink)),var(--hot) 48%,color-mix(in srgb,var(--hot) 82%,var(--surface-0)));border-color:color-mix(in srgb,var(--hot) 75%,var(--ink));box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.12),0 4px 20px color-mix(in srgb,var(--hot) 12%,transparent)}
.billing-surface .btn:disabled{background-image:linear-gradient(120deg,rgba(255,255,255,.09),transparent 75%);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);filter:none}
.credit-option,.credit-order,.bill-subscription{background-image:linear-gradient(140deg,rgba(255,255,255,.075),rgba(255,255,255,.015) 48%,transparent 80%)}
.credit-option[aria-checked="true"]{background-image:linear-gradient(140deg,color-mix(in srgb,var(--hot) 18%,transparent),color-mix(in srgb,var(--hot) 5%,transparent) 48%,transparent 85%)}
.credit-tag{background-image:linear-gradient(115deg,color-mix(in srgb,var(--hot) 70%,var(--ink)),var(--hot));box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
@media(hover:hover) and (pointer:fine){
  .credit-option:not(:disabled):hover{filter:brightness(1.1);box-shadow:var(--e-1)}
  .credit-option:not(:disabled):not([aria-checked="true"]):hover{border-color:var(--ink-3);background-color:var(--panel-2)}
  .credit-option:not(:disabled)[aria-checked="true"]:hover{box-shadow:inset 0 0 0 1px var(--hot),var(--e-1)}
  .credit-order .credit-buy:not(:disabled):hover,.bill-wallet .btn:hover,.bill-subscription .btn:not(:disabled):hover{box-shadow:var(--e-1)}
  .billing-surface .btn:not(:disabled):hover{filter:brightness(1.1)}
  .billing-surface .btn.primary:not(:disabled):hover{filter:brightness(1.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(0,0,0,.1),0 6px 24px color-mix(in srgb,var(--hot) 20%,transparent)}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .credit-option:not(:disabled):hover{transform:translateY(-4px)}
  .credit-option:not(:disabled):active{transform:translateY(-1px)}
  .credit-order .credit-buy:not(:disabled):hover,.bill-wallet .btn:hover,.bill-subscription .btn:not(:disabled):hover{transform:translateY(-2px)}
  .credit-order .credit-buy:not(:disabled):active,.bill-wallet .btn:active,.bill-subscription .btn:not(:disabled):active{transform:translateY(0)}
  .credit-buy:not(:disabled):hover>span{transform:translateX(4px)}
}
@media(max-width:1000px){.credit-packs{grid-template-columns:repeat(2,minmax(0,1fr))}.credit-order-action{gap:var(--sp-16)}}
@media(max-width:760px){.bill-wallet-grid{grid-template-columns:1fr}.bill-wallet-grid>.box{padding:var(--sp-20)}.bill-shop-head{align-items:flex-start;flex-direction:column;gap:var(--sp-12)}.bill-stats>.sum-tile{grid-column:span 6}}
@media(max-width:600px){.credit-packs{grid-template-columns:minmax(0,1fr)}.credit-option{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--sp-6) var(--sp-12);padding:var(--sp-16)}.credit-option-top{grid-column:1/-1;margin:0 0 var(--sp-8)}.credit-option .cr{grid-column:1;grid-row:2}.credit-output{grid-column:1;margin:0;font-size:var(--t-md)}.credit-cost{grid-column:2;grid-row:2;justify-content:flex-end}.credit-cost small{display:none}.credit-unit{grid-column:2;grid-row:3;align-self:center;text-align:right;margin:0}.credit-order{align-items:stretch;flex-direction:column;padding:var(--sp-20);gap:var(--sp-16)}.credit-order-action{justify-content:space-between}.credit-order-action>div{text-align:left}.credit-order .credit-buy{min-width:0;flex:1;max-width:240px}.credit-option .cr strong{font-size:var(--t-4xl)}}