/* Pricing page. Tokens from rf.css only. Prefix: pr-.
   Pieces: hero, rate sheet (ledger table), receipt + fee calculator, outcomes table, split table, FAQ. */

.pr-hero{position:relative;padding-block:clamp(40px,6vw,72px) clamp(32px,5vw,56px);border-bottom:1px solid var(--line);isolation:isolate}
.pr-hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(var(--line2) 1px,transparent 1px),linear-gradient(90deg,var(--line2) 1px,transparent 1px);background-size:32px 32px;-webkit-mask-image:linear-gradient(to bottom,#000 0,transparent 100%);mask-image:linear-gradient(to bottom,#000 0,transparent 100%)}
.pr-hero .wrap{display:grid;gap:20px}
.pr-hero h1{font-size:clamp(36px,6vw,64px);line-height:1.04;letter-spacing:-.035em;max-width:16ch}
:lang(zh) .pr-hero h1{line-height:1.15;max-width:none}
.pr-hero h1 em{font-style:normal;color:var(--acc)}
.pr-hero .lead{max-width:60ch}
.pr-hero-notes{display:grid;gap:16px;max-width:760px}
.pr-plain{padding:16px 18px;background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--ember);border-radius:var(--r)}
.pr-plain>div{min-width:0}
.pr-plain .eyebrow{display:block;margin-bottom:.6em}
.pr-plain ul{margin:0;padding-left:1.2em;display:grid;gap:.45em;font-size:14.5px}
.pr-hero-notes .pr-note{margin-top:0}
.pr-facts{display:flex;flex-wrap:wrap;gap:6px 22px;font:12.5px/1.5 var(--mono);color:var(--mute);list-style:none;padding:0;margin:0}
.pr-facts li::before{content:"\2022";color:var(--ember);margin-right:8px}
.pr-cta{display:flex;flex-wrap:wrap;gap:10px}

.pr-sec{padding-block:clamp(36px,5vw,64px)}
.pr-sec+.pr-sec{border-top:1px solid var(--line2)}
.pr-sec.alt{background:var(--side);border-block:1px solid var(--line)}
.pr-head{display:grid;gap:10px;max-width:720px;margin-bottom:24px}
.pr-head h2{font-size:clamp(24px,3.2vw,34px);line-height:1.12;letter-spacing:-.028em}
.pr-head p{color:var(--mute);max-width:62ch}
.pr-fine{font-size:13px;color:var(--mute);margin-top:12px;max-width:72ch}
.pr-note{margin-top:20px}
.note>div{min-width:0}
.note>div>*+*{margin-top:.5em}

/* ---------- rate sheet ---------- */
.pr-sheet{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);overflow:hidden}
.pr-sheet table{min-width:560px}
/* Header cells use the shared rf.css table style (12px, mute, hairline underneath); only the padding differs. */
.pr-sheet th{padding:10px 16px}
.pr-sheet td{padding:13px 16px;vertical-align:baseline}
.pr-sheet td:first-child{font-weight:500;width:34%}
.pr-sheet td.v{font:500 14px/1.4 var(--mono);white-space:nowrap;width:22%}
.pr-sheet td.v.zero{color:var(--good)}
.pr-sheet td.v.fee{color:var(--acc)}
.pr-sheet td:last-child{color:var(--mute);font-size:14px}
.pr-sheet tr.grp td{background:var(--panel2);font:500 12px/1.3 var(--sans);color:var(--mute);padding-block:8px}
.pr-sheet tr.grp:hover{background:none}

/* ---------- receipt + calculator ---------- */
.pr-split{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(20px,3vw,40px);align-items:start}
@media (max-width:900px){.pr-split{grid-template-columns:minmax(0,1fr)}}

.pr-receipt{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);box-shadow:var(--sh1);overflow:hidden;position:relative}
.pr-receipt .hd{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 14px;padding:12px 18px;border-bottom:1px dashed var(--line-strong);font:12.5px/1.4 var(--mono);color:var(--mute)}
.pr-receipt .hd b{color:var(--fg);font-weight:600}
.pr-receipt table{font:13.5px/1.5 var(--mono)}
.pr-receipt th{padding:10px 18px 6px;border:0}
.pr-receipt td{padding:7px 18px;border:0;vertical-align:baseline}
.pr-receipt td:last-child{text-align:right;white-space:nowrap}
.pr-receipt td:first-child{font-family:var(--sans);font-size:14px;font-weight:400}
.pr-receipt tbody tr:hover{background:none}
.pr-receipt tr.sum td{border-top:1px solid var(--line);padding-top:10px;font-weight:600}
.pr-receipt tr.sum td:first-child{font-weight:600}
.pr-receipt tr.fee td:last-child{color:var(--acc)}
.pr-receipt .sep th{padding-top:16px}
.pr-receipt tr.total td{border-top:1px dashed var(--line-strong);padding-block:10px 14px;font-weight:600}
.pr-bar{display:grid;grid-template-columns:99fr 1fr;gap:2px;height:10px;margin:2px 18px 6px;border-radius:5px;overflow:hidden}
.pr-bar i{display:block;background:var(--line-strong)}
.pr-bar i+i{background:var(--ember);min-width:6px}
.pr-bar-lg{display:flex;justify-content:space-between;gap:12px;margin:0 18px 16px;font:12px/1.4 var(--mono);color:var(--mute)}
.pr-bar-lg b{font-weight:500;color:var(--fg)}

.pr-calc{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--panel);padding:18px}
.pr-calc h3{font-size:16px;margin-bottom:12px}
.pr-money{display:flex;align-items:center;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--panel);padding-left:12px;transition:border-color .15s var(--ease),box-shadow .15s var(--ease)}
.pr-money:focus-within{border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in oklch,var(--acc) 22%,transparent)}
.pr-money span{font:500 15px var(--mono);color:var(--mute)}
.pr-money input:not([type=checkbox],[type=radio],[type=range],[type=file]){border:0;box-shadow:none;background:transparent;font:500 16px var(--mono);min-height:42px}
.pr-money input:focus{box-shadow:none}
.pr-calc dl{margin:16px 0 0;display:grid;gap:0}
.pr-calc dl>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 0;border-top:1px solid var(--line2)}
.pr-calc dt{color:var(--mute);font-size:14px}
.pr-calc dd{margin:0;font:600 15px var(--mono);text-align:right}
.pr-calc dl>div.fee dd{color:var(--acc)}
.pr-calc dl>div.net dd{color:var(--good)}
.pr-calc .help{margin-top:12px}
.pr-calc .err{min-height:1.2em}

/* ---------- other tables ---------- */
.pr-tbl{border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
.pr-tbl table{min-width:600px}
.pr-tbl td:first-child{font-weight:500}
.pr-tbl td.num,.pr-tbl th.num{font-weight:500}
.pr-tbl td .badge{margin-right:6px}
.pr-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,40px);align-items:start}
@media (max-width:900px){.pr-cols{grid-template-columns:minmax(0,1fr)}}
.pr-list{list-style:none;padding:0;display:grid;gap:12px}
.pr-list li{position:relative;padding-left:22px;color:var(--mute)}
.pr-list li::before{content:"";position:absolute;left:0;top:.7em;width:10px;height:1px;background:var(--acc)}
.pr-list strong{color:var(--fg);font-weight:600}

/* ---------- FAQ ---------- */
.pr-faq{max-width:760px;border-top:1px solid var(--line)}
.pr-faq details.disclosure>summary{min-height:44px;align-items:center}
.pr-faq details.disclosure>summary:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.pr-faq details.disclosure>div p+p{margin-top:.6em}

.pr-end{display:grid;gap:14px;justify-items:start}
.pr-end h2{font-size:clamp(24px,3.2vw,34px);letter-spacing:-.028em}
.pr-cols .pr-tbl table{min-width:0}
.pr-cols .pr-tbl caption{padding:12px 10px 4px;font-size:13px;color:var(--mute);font-weight:500}

.nb{white-space:nowrap}
:lang(zh) .pr-hero h1{font-size:clamp(30px,5.6vw,60px)}

/* ---------- narrow screens: multi-column sheets become stacked rows, nothing scrolls sideways ---------- */
@media (max-width:640px){
  .pr-stack.scroll{overflow-x:visible}
  .pr-stack table,.pr-stack tbody,.pr-stack tr,.pr-stack td{display:block;min-width:0}
  .pr-stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .pr-stack tbody tr{padding:12px 16px;border-bottom:1px solid var(--line2)}
  .pr-stack tbody tr:last-child{border-bottom:0}
  .pr-stack tbody tr:hover{background:none}
  .pr-stack td{padding:0;border:0}
  .pr-stack td[data-label]{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:6px;font-size:14px}
  .pr-stack td[data-label]::before{content:attr(data-label);flex:none;font-size:12px;color:var(--mute)}
  .pr-stack td[data-label]>*{text-align:right}
  /* rate sheet: item and cost on one line, the detail underneath */
  .pr-sheet tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 16px;align-items:baseline}
  .pr-sheet td:first-child{width:auto;grid-column:1}
  .pr-sheet td.v{width:auto;grid-column:2;grid-row:1;text-align:right}
  .pr-sheet td:last-child:not(.v){grid-column:1 / -1;font-size:13.5px}
  .pr-sheet tr.grp{display:block;padding:8px 16px}
  .pr-sheet tr.grp td{display:block;padding:0;background:none}
  .pr-sheet tr.grp{background:var(--panel2)}
  .pr-tbl td.num{white-space:normal}
}
