@font-face{font-family:"Ma Shan Zheng";src:url("./assets/fonts/MaShanZheng-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"Fraunces";src:url("./assets/fonts/Fraunces-VF.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:block}
:root{--gold:#eac080;--cream:#fff9ea;--muted:#d5cfbf;--ink:#101713}
*{box-sizing:border-box}
html,body{margin:0}
body{min-height:100vh;display:grid;place-items:center;background:#6e716e;font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif}
.poster{position:relative;width:600px;height:900px;overflow:hidden;color:var(--cream);background:#111b16 url("./assets/充值海报-朋友欢聚背景.png") center top/100% 100% no-repeat;padding:30px 43px;isolation:isolate}
.poster:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,17,14,.7) 0%,rgba(8,17,14,.04) 14%,rgba(8,17,14,.08) 27%,rgba(11,21,17,.6) 36%,#111b16 51%,#111b16 100%);pointer-events:none}
.poster:after{content:"";position:absolute;inset:18px;border:1px solid rgba(234,192,128,.47);pointer-events:none}
.rim{position:absolute;left:44px;right:44px;top:308px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:.7}
.confetti{display:none}
.top,.heading,.tiers,footer{position:relative;z-index:1}
.top{height:295px;display:flex;align-items:flex-start;justify-content:space-between}
.logo{width:205px;height:74px;object-fit:contain;object-position:left top;filter:brightness(0) invert(.95) sepia(.17) saturate(.48) drop-shadow(0 2px 7px rgba(0,0,0,.7))}
.heading{text-align:center;height:158px}
.eyebrow{margin:0 0 4px;color:var(--gold);font:700 13px/1.2 "Avenir Next Condensed",Arial,sans-serif;letter-spacing:.24em}
h1{position:relative;margin:0;font-family:"Ma Shan Zheng","Songti SC",serif;font-size:85px;font-weight:400;line-height:1.03;letter-spacing:.07em;color:var(--cream);transform:rotate(-2deg)}
.title-shadow{position:absolute;left:3px;top:5px;width:100%;color:#382316;pointer-events:none}
.title-text{position:relative}
h1:before,h1:after{content:"✦";position:absolute;top:35px;font:400 19px/1 Georgia,serif;color:var(--gold);text-shadow:none}
h1:before{left:10px}h1:after{right:10px}
.subtitle{font-family:"Songti SC","STSong",serif;font-size:20px;font-weight:700;letter-spacing:.3em;text-indent:.3em;color:var(--gold);margin:4px 0 0}
.tiers{display:flex;flex-direction:column;gap:9px}
.tier{position:relative;height:102px;display:grid;grid-template-columns:34px 1fr 43px 1.1fr;align-items:center;padding:0 12px 0 15px;background:linear-gradient(105deg,rgba(42,58,44,.83),rgba(29,42,33,.72));border-top:1px solid rgba(234,192,128,.67);border-bottom:1px solid rgba(234,192,128,.35)}
.tier:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold)}
.tier:nth-child(2){background:linear-gradient(105deg,rgba(62,70,46,.86),rgba(36,49,35,.8))}
.tier-label{align-self:start;margin-top:16px;font:700 13px/1 "Avenir Next Condensed",Arial,sans-serif;color:var(--gold);letter-spacing:.08em}
.pay,.receive{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:4px}
.pay span,.receive span{width:100%;font-size:14px;letter-spacing:.13em;color:var(--muted);margin-bottom:1px}
.pay strong{font:700 42px/1.13 "Fraunces",Georgia,serif;font-variation-settings:"SOFT" 72,"WONK" 1,"opsz" 72;letter-spacing:-.05em;color:var(--cream)}
.receive strong{font:800 53px/1.02 "Fraunces",Georgia,serif;font-variation-settings:"SOFT" 72,"WONK" 1,"opsz" 72;letter-spacing:-.055em;color:var(--gold)}
.pay small,.receive small{font-size:14px}
.arrow{width:31px;height:31px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;font-family:"Ma Shan Zheng","Songti SC",serif;font-size:21px;color:var(--gold);transform:rotate(-12deg)}
footer{padding-top:13px;text-align:center}
.footer-rule{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
.note{font-size:13px;color:var(--cream);letter-spacing:.025em;margin:11px 0 10px}
.brand-line{font:700 12px/1 "Avenir Next Condensed",Arial,sans-serif;letter-spacing:.28em;color:var(--gold);margin:0}
@media print{@page{size:600mm 900mm;margin:0}html,body{width:600mm;height:900mm;background:transparent;display:block;overflow:hidden}.poster{zoom:3.779527559}}