/* Signature and monthly ranking. Theme colors are explicit, including user names. */
html.site-pearl body.public-ui #homeSignature {
  --hs-panel:#fcfbf8; --hs-ink:#75552b; --hs-muted:#756d62; --hs-line:#e7e0d4; --hs-glow:#c79b4d; --hs-blue:#45668c;
  position:relative; isolation:isolate; overflow:hidden; margin:18px 0 0; padding:19px 25px 15px; border:1px solid var(--hs-line); border-radius:22px;
  color:var(--hs-ink); background:radial-gradient(ellipse at 10% 0%,#e6d2aa22,transparent 45%),radial-gradient(ellipse at 95% 100%,#96b8df1a,transparent 45%),var(--hs-panel);
  box-shadow:0 7px 30px #3d332107,inset 0 1px #ffffff50;
}
html.site-pearl.site-dark body.public-ui #homeSignature { --hs-panel:#151e28; --hs-ink:#e7c894; --hs-muted:#9dabae; --hs-line:#3c4246; --hs-glow:#deb675; --hs-blue:#a9c8ed; box-shadow:0 10px 35px #00000016,inset 0 1px #ffffff06; }
html.site-pearl body.public-ui #homeSignature::before { content:''; position:absolute; inset:7px; z-index:-1; border:1px solid color-mix(in srgb,var(--hs-line) 55%,transparent); border-radius:16px; pointer-events:none; }
html.site-pearl body.public-ui #homeSignature::after { content:''; position:absolute; inset:-50% auto -50% -60%; width:35%; transform:rotate(20deg); pointer-events:none; background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--hs-glow) 8%,transparent),transparent); opacity:0; }
html.site-pearl body.public-ui #homeSignature.is-visible::after { animation:hs-light-pass 2s ease-out both; }
html.site-pearl body.public-ui #homeSignature .hs-topline,html.site-pearl body.public-ui #homeSignature .hs-bottomline { position:relative; display:flex; align-items:center; justify-content:space-between; gap:16px; }
html.site-pearl body.public-ui #homeSignature .hs-label { font-size:9px; font-weight:650; letter-spacing:2px; color:var(--hs-muted); }
html.site-pearl body.public-ui #homeSignature .hs-edition { display:flex; align-items:center; gap:9px; font-size:8px; letter-spacing:1.5px; color:var(--hs-muted); }
html.site-pearl body.public-ui #homeSignature .hs-edition i { width:3px; height:3px; border-radius:50%; background:var(--hs-glow); }
html.site-pearl body.public-ui #homeSignature .hs-stage { display:grid; grid-template-columns:92px minmax(0,1fr) 92px; align-items:center; gap:20px; min-height:163px; }
html.site-pearl body.public-ui #homeSignature .hs-wordmark { min-width:0; padding-top:14px; text-align:center; }
html.site-pearl body.public-ui #homeSignature .hs-name { position:relative; display:inline-block; margin:0; padding:0 10px; font-family:'Great Vibes','Segoe Script','Brush Script MT',cursive!important; font-size:clamp(54px,6.8vw,94px)!important; line-height:1.25; font-weight:400!important; font-style:normal; letter-spacing:0; white-space:nowrap; color:var(--hs-ink)!important; text-shadow:none!important; -webkit-text-fill-color:currentColor!important; }
@supports(background-clip:text) { html.site-pearl body.public-ui #homeSignature .hs-name { background:linear-gradient(115deg,var(--hs-ink) 10%,var(--hs-blue) 52%,var(--hs-ink) 85%); background-clip:text; -webkit-text-fill-color:transparent!important; } }
html.site-pearl body.public-ui #homeSignature .hs-flourish { display:block; width:min(100%,420px); height:36px; margin:-7px auto 0; overflow:visible; stroke:var(--hs-glow); stroke-width:1.2; stroke-linecap:round; }
html.site-pearl body.public-ui #homeSignature .hs-flourish-fine { stroke-width:.65; opacity:.55; }
html.site-pearl body.public-ui #homeSignature.is-visible .hs-flourish path { animation:hs-ink 1.7s cubic-bezier(.25,.65,.3,1) both; }
html.site-pearl body.public-ui #homeSignature.is-visible .hs-flourish-fine { animation-delay:.2s; }
html.site-pearl body.public-ui #homeSignature .hs-seal { position:relative; width:74px; height:74px; display:grid; place-items:center; margin-left:8px; border:1px solid var(--hs-line); border-radius:20px; background:color-mix(in srgb,var(--hs-glow) 4%,var(--hs-panel)); color:var(--hs-ink); }
html.site-pearl body.public-ui #homeSignature .hs-seal > span { font:italic 28px/1 'Cormorant Garamond',Georgia,serif; letter-spacing:-3px; padding-right:3px; }
html.site-pearl body.public-ui #homeSignature .hs-seal > span > span { font-size:16px; letter-spacing:-1px; }
html.site-pearl body.public-ui #homeSignature .hs-seal > svg { position:absolute; inset:-8px; width:88px; height:88px; stroke:var(--hs-glow); stroke-width:.65; opacity:.5; }
html.site-pearl body.public-ui #homeSignature .hs-pen { justify-self:center; display:flex; flex-direction:column; align-items:center; gap:8px; color:var(--hs-ink); opacity:.7; }
html.site-pearl body.public-ui #homeSignature .hs-pen svg { width:38px; height:38px; stroke:currentColor; stroke-width:1.1; stroke-linecap:round; stroke-linejoin:round; }
html.site-pearl body.public-ui #homeSignature .hs-pen > span { font-size:8px; letter-spacing:2px; }
html.site-pearl body.public-ui #homeSignature .hs-bottomline { padding-top:12px; border-top:1px solid var(--hs-line); color:var(--hs-muted); font-size:10px; line-height:1.6; }
html.site-pearl body.public-ui #homeSignature .hs-bottomline > span:first-child { display:flex; align-items:center; gap:8px; }
html.site-pearl body.public-ui #homeSignature .hs-bottomline i { width:4px; height:4px; border-radius:50%; background:var(--hs-glow); }
html.site-pearl body.public-ui #homeSignature .hs-bottom-caption { font-size:9px; letter-spacing:.2px; }
html.site-pearl body.public-ui #homeSignature .hs-ambient { position:absolute; inset:0; pointer-events:none; z-index:-1; }
html.site-pearl body.public-ui #homeSignature .hs-ambient span { position:absolute; width:6px; height:6px; background:var(--hs-glow); opacity:.4; clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%); }
html.site-pearl body.public-ui #homeSignature .hs-ambient span:first-child { left:26%; top:31%; }
html.site-pearl body.public-ui #homeSignature .hs-ambient span:last-child { right:23%; top:68%; width:4px; height:4px; }
html.site-pearl body.public-ui #homeSignature.is-visible .hs-ambient span { animation:hs-glint 1.8s ease-in-out 2; }
html.site-pearl body.public-ui #homeSignature.is-visible .hs-ambient span:last-child { animation-delay:.5s; }
@keyframes hs-ink { from { stroke-dasharray:1; stroke-dashoffset:1; } to { stroke-dasharray:1; stroke-dashoffset:0; } }
@keyframes hs-light-pass { 0% { transform:translateX(0) rotate(20deg); opacity:0; } 20% { opacity:1; } 100% { transform:translateX(500%) rotate(20deg); opacity:0; } }
@keyframes hs-glint { 0%,100% { opacity:.2; transform:scale(.7); } 50% { opacity:.8; transform:scale(1.2); } }

html.site-pearl body.public-ui #homeMonthlyTopup.hmt-card--modern { --hm-panel:#fff; --hm-soft:#f6f8fc; --hm-line:#e2e8f2; --hm-ink:#283f5e; --hm-muted:#65778f; --hm-gold:#916222; --hm-first:#fcf7ed; width:100%!important; border:1px solid var(--hm-line)!important; border-radius:19px!important; background:var(--hm-panel)!important; box-shadow:0 5px 23px #1e3c6008!important; animation:none; }
html.site-pearl.site-dark body.public-ui #homeMonthlyTopup.hmt-card--modern { --hm-panel:#172330; --hm-soft:#1c2c3c; --hm-line:#2d4157; --hm-ink:#dbe8f8; --hm-muted:#a2b6cf; --hm-gold:#e2be7d; --hm-first:#2b2c29; }
html.site-pearl body.public-ui #homeMonthlyTopup::before,html.site-pearl body.public-ui #homeMonthlyTopup::after { content:none!important; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-head { display:flex; align-items:center; gap:10px; padding:15px 14px 13px!important; border-bottom:1px solid var(--hm-line); background:transparent!important; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-trophy { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; border:1px solid color-mix(in srgb,var(--hm-gold) 22%,transparent); border-radius:12px; color:var(--hm-gold); background:color-mix(in srgb,var(--hm-gold) 8%,var(--hm-panel)); }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-heading { min-width:0; flex:1; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-title { display:block; margin:0; color:var(--hm-ink)!important; font-size:11px!important; line-height:1.5; font-weight:750; letter-spacing:.6px; white-space:normal; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-subtitle { margin:2px 0 0; color:var(--hm-muted); font-size:9px; line-height:1.5; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-period { display:flex; flex-direction:column; align-items:center; gap:3px; flex-shrink:0; padding-left:10px; border-left:1px solid var(--hm-line); color:var(--hm-gold); font-size:9px; font-weight:750; white-space:nowrap; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-period small { color:var(--hm-muted); font-size:8px; font-weight:450; letter-spacing:2px; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-list { display:grid; gap:5px; list-style:none; margin:0; padding:10px; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-item { --hm-rank:#426da6; display:grid; grid-template-columns:23px 34px minmax(0,1fr); grid-template-rows:auto auto; align-items:center; gap:1px 10px!important; position:relative; min-height:55px; padding:8px 9px!important; border:1px solid transparent; border-radius:12px; background:var(--hm-soft)!important; transition:transform .18s ease,border-color .18s ease; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-item.rank-1 { --hm-rank:var(--hm-gold); background:linear-gradient(110deg,var(--hm-first),var(--hm-panel))!important; border-color:color-mix(in srgb,var(--hm-gold) 24%,var(--hm-line)); }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-item.rank-2 { --hm-rank:#4f6c8e; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-item.rank-3 { --hm-rank:#9b6243; }
html.site-pearl.site-dark body.public-ui #homeMonthlyTopup .hmt-item { --hm-rank:#a3c4ef; }
html.site-pearl.site-dark body.public-ui #homeMonthlyTopup .hmt-item.rank-1 { --hm-rank:#e2be7d; }
html.site-pearl.site-dark body.public-ui #homeMonthlyTopup .hmt-item.rank-2 { --hm-rank:#bbcee5; }
html.site-pearl.site-dark body.public-ui #homeMonthlyTopup .hmt-item.rank-3 { --hm-rank:#e6ac87; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-rank { grid-row:1 / 3; color:var(--hm-rank); font-size:11px; font-weight:700; text-shadow:none; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-rank-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-avatar { grid-column:2; grid-row:1 / 3; position:relative; display:grid; place-items:center; width:33px; height:33px; padding:2px; border:1px solid color-mix(in srgb,var(--hm-rank) 30%,transparent); border-radius:12px; color:var(--hm-rank); background:color-mix(in srgb,var(--hm-rank) 11%,var(--hm-panel)); box-shadow:none; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-avatar > span { display:grid; place-items:center; width:100%; height:100%; border-radius:9px; background:transparent; color:inherit; font-size:12px; font-weight:650; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-crown { position:absolute; top:-7px; right:-5px; width:14px; height:14px; color:var(--hm-gold); transform:rotate(16deg); }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-user { grid-column:3; grid-row:1; display:flex; align-items:baseline; flex-direction:row; flex-wrap:wrap; gap:2px 8px; min-width:0; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-user .hmt-name { display:block; min-width:0; max-width:100%; color:var(--hm-rank)!important; -webkit-text-fill-color:currentColor!important; font-size:12px; font-weight:650; line-height:1.5; white-space:normal; overflow:visible; text-overflow:clip; overflow-wrap:anywhere; text-shadow:none; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-user small { display:block; color:var(--hm-muted); font-size:9px; white-space:nowrap; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-amount { grid-column:3; grid-row:2; min-width:0; color:var(--hm-ink)!important; font-size:12px; font-weight:700; line-height:1.55; letter-spacing:.1px; white-space:normal; overflow-wrap:anywhere; text-shadow:none; font-variant-numeric:tabular-nums; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-amount > span { color:var(--hm-muted); font-size:10px; font-weight:500; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-foot { display:flex; align-items:center; justify-content:center; gap:7px; padding:10px 12px!important; border-top:1px solid var(--hm-line); background:transparent!important; color:var(--hm-muted)!important; font-size:9px!important; line-height:1.6; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-foot > span { color:var(--hm-muted)!important; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-foot svg { color:var(--hm-gold); flex-shrink:0; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-empty { display:flex; justify-content:flex-start; gap:12px; min-height:115px!important; padding:22px 18px!important; color:var(--hm-muted)!important; background:transparent!important; text-align:left; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-empty-icon { display:grid; place-items:center; flex:0 0 36px; height:36px; border-radius:12px; background:var(--hm-soft); color:var(--hm-gold); font-size:22px; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-empty strong { display:block; color:var(--hm-ink); font-size:12px; font-weight:650; }
html.site-pearl body.public-ui #homeMonthlyTopup .hmt-empty p { margin:5px 0 0; font-size:10px; line-height:1.6; }
@media(hover:hover) { html.site-pearl body.public-ui #homeMonthlyTopup .hmt-item:hover { transform:translateX(2px); border-color:color-mix(in srgb,var(--hm-rank) 25%,var(--hm-line)); } }
@media(max-width:700px) {
  html.site-pearl body.public-ui #homeSignature { padding:17px 18px 14px; border-radius:18px; }
  html.site-pearl body.public-ui #homeSignature .hs-stage { grid-template-columns:48px minmax(0,1fr) 40px; gap:6px; min-height:136px; }
  html.site-pearl body.public-ui #homeSignature .hs-name { font-size:clamp(42px,7.7vw,64px)!important; padding-inline:0; }
  html.site-pearl body.public-ui #homeSignature .hs-seal { width:40px; height:40px; margin:0; border-radius:12px; }
  html.site-pearl body.public-ui #homeSignature .hs-seal > span { font-size:20px; }
  html.site-pearl body.public-ui #homeSignature .hs-seal > span > span { font-size:10px; }
  html.site-pearl body.public-ui #homeSignature .hs-seal > svg { inset:-5px; width:48px; height:48px; }
  html.site-pearl body.public-ui #homeSignature .hs-pen svg { width:26px; height:26px; }
  html.site-pearl body.public-ui #homeSignature .hs-pen > span { font-size:6px; letter-spacing:1px; }
  html.site-pearl body.public-ui #homeSignature .hs-flourish { height:24px; margin-top:0; }
  html.site-pearl body.public-ui #homeSignature .hs-label { font-size:8px; letter-spacing:1.2px; }
  html.site-pearl body.public-ui #homeSignature .hs-edition { font-size:7px; letter-spacing:.8px; gap:6px; }
  html.site-pearl body.public-ui #homeSignature .hs-bottomline { gap:6px; flex-wrap:wrap; font-size:9px; }
  html.site-pearl body.public-ui #homeSignature .hs-bottom-caption { font-size:8px; }
}
@media(max-width:480px) {
  html.site-pearl body.public-ui #homeSignature .hs-stage { grid-template-columns:minmax(0,1fr); min-height:138px; }
  html.site-pearl body.public-ui #homeSignature .hs-seal,html.site-pearl body.public-ui #homeSignature .hs-pen { display:none; }
  html.site-pearl body.public-ui #homeSignature .hs-name { font-size:clamp(36px,12.6vw,56px)!important; }
  html.site-pearl body.public-ui #homeSignature .hs-bottomline { justify-content:center; }
  html.site-pearl body.public-ui #homeSignature .hs-bottom-caption { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  html.site-pearl body.public-ui #homeSignature::after,html.site-pearl body.public-ui #homeSignature *,html.site-pearl body.public-ui #homeMonthlyTopup * { animation:none!important; transition:none!important; }
}
