/* Compact recharge dialog, intentionally without an outer border or gold rim. */
body .recharge-panel { color-scheme:light; box-sizing:border-box; width:calc(100% - 48px); max-width:360px; max-height:calc(100vh - 32px); max-height:calc(var(--recharge-vh,100dvh) - 32px); padding:0; border:0; border-radius:22px; color:#542b13; background:#fffaf0; box-shadow:0 16px 48px #061b2540; overflow:auto; overscroll-behavior:contain; font:16px/1.4 Arial,"Microsoft YaHei",sans-serif; }
.recharge-panel:not(.recharge-standalone):not([open]) { display:none; }
body .recharge-panel:not(.recharge-standalone)[open] { position:fixed; inset:auto 0; top:calc(var(--recharge-vv-top,0px) + var(--recharge-vh,100dvh) / 2); margin:0 auto; transform:translateY(-50%); }
.recharge-panel::backdrop { background:rgba(4,16,28,.52); }
.recharge-panel *, .recharge-panel *::before, .recharge-panel *::after { box-sizing:border-box; }
body .recharge-panel [hidden] { display:none!important; }
body .recharge-panel { padding-top:12px; background:transparent; border-radius:0; box-shadow:none; }
.recharge-panel-content { position:relative; padding:18px 20px 20px; border-radius:22px; background:#fffaf0; }
/* Reuse the wallet illustration; clip just its upper leaf cluster, without the wooden bar. */
.recharge-leaves { position:absolute; top:-12px; left:10px; width:36px; height:28px; pointer-events:none; background:url('../images/farm/home-wallet-v1.webp') -52px 0 / 600px 109px no-repeat; clip-path:polygon(29% 0,42% 3%,52% 24%,74% 27%,99% 49%,91% 57%,70% 64%,67% 94%,54% 98%,35% 89%,22% 72%,9% 68%,10% 40%,20% 13%); }
body .recharge-panel-header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 17px; padding:0 0 12px; border-bottom:1px solid #dfcdb4; }
body .recharge-panel-header h2 { margin:0; font:900 27px/1.2 Arial,"Microsoft YaHei",sans-serif; color:#4d260e; overflow-wrap:anywhere; }
body .recharge-panel .recharge-close { flex:0 0 40px; display:grid; place-items:center; width:40px; height:40px; padding:0; border:1px solid #d4b48a; border-radius:11px; color:#69401f; background:#fff0d3; font:32px/1 Arial,sans-serif; text-decoration:none; cursor:pointer; }
body .recharge-panel form { margin:0; }
body .recharge-panel label { display:block; margin:0 0 7px; font-size:15px; font-weight:700; line-height:1.4; color:#59361f; }
body .recharge-panel .recharge-amount-label { margin-top:16px; }
.recharge-select-shell { position:relative; }
body .recharge-panel :is(input,select) { display:block; width:100%; min-width:0; height:48px; margin:0; padding:10px 12px; border:1px solid #d9cfc1; border-radius:10px; outline:none; background:#fffcf6; color:#53321b; font:16px/1.4 Arial,"Microsoft YaHei",sans-serif; box-shadow:none; }
body .recharge-panel select { padding-right:36px; appearance:none; -webkit-appearance:none; text-overflow:ellipsis; }
.recharge-select-shell svg { position:absolute; right:12px; top:16px; width:17px; height:17px; fill:none; stroke:#6d452b; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; }
body .recharge-panel :is(input,select):focus { border-color:#598c50; box-shadow:0 0 0 2px #518b4020; }
body .recharge-panel [aria-invalid="true"] { border-color:#b54030; }
.recharge-amount-shell { position:relative; display:flex; align-items:center; border:1px solid #d9cfc1; border-radius:10px; background:#fffcf6; }
.recharge-amount-shell:focus-within { border-color:#598c50; box-shadow:0 0 0 2px #518b4020; }
.recharge-amount-shell > span { flex:0 0 auto; max-width:32%; padding:0 12px; color:#289342; font-size:17px; font-weight:700; overflow-wrap:anywhere; }
#recharge-panel #amount { flex:1 1 0; width:0; min-height:48px; height:48px; margin:0; border:0; border-radius:0; outline:0; background:transparent; color:#53321b; font:700 20px/1.4 Arial,"Microsoft YaHei",sans-serif; padding:10px 12px 10px 0; box-shadow:none; }
#recharge-panel #amount::placeholder { color:#918c80; font-size:12px; font-weight:400; opacity:1; }
.recharge-amount-shell input::-webkit-inner-spin-button, .recharge-amount-shell input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.recharge-amount-shell input[type="number"] { -moz-appearance:textfield; }
.recharge-amount-shell.is-symbol-after > span { order:2; }
#recharge-panel .recharge-amount-shell.is-symbol-after #amount { padding-left:12px; padding-right:0; }
.recharge-quick-picks { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-top:12px; }
body .recharge-panel .recharge-quick-picks button { min-width:0; min-height:44px; padding:8px 2px; border:1px solid #cead85; border-radius:10px; background:#fffaf1; color:#623d22; font:700 14px/1.3 Arial,sans-serif; cursor:pointer; }
body .recharge-panel .recharge-quick-picks .is-selected { border-color:#f09a18; background:#ffedb3; box-shadow:inset 0 0 0 1px #f09a18; }
body .recharge-panel .recharge-submit { display:block; width:100%; min-height:48px; margin:18px 0 0; padding:11px 8px; border:0; border-radius:13px; background:linear-gradient(#ff951f,#f57916); box-shadow:0 3px 0 #cb5e13; color:white; font:800 17px/1.4 Arial,"Microsoft YaHei",sans-serif; cursor:pointer; overflow-wrap:anywhere; }
body .recharge-panel .recharge-form-status { margin:10px 0 0; color:#9c4130; font-size:13px; overflow-wrap:anywhere; }
body .recharge-panel .recharge-form-status:empty { display:none; }
body .recharge-panel :is(button,select):disabled { opacity:.55; cursor:default; }
body .recharge-panel :is(button,a):focus-visible { outline:2px solid #478d44; outline-offset:2px; }
/* Only the close control: keyboard focus and form-field feedback stay visible. */
body.is-pointer-input .recharge-panel .recharge-close:focus { outline:none; }
.recharge-sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
body .recharge-panel .recharge-method-retry { display:block; min-height:44px; margin:4px 0 0 auto; padding:8px 12px; border:0; background:transparent; color:#864619; font:700 14px/1.4 Arial,"Microsoft YaHei",sans-serif; text-decoration:underline; cursor:pointer; }
body.recharge-page { background:#228949 url('../images/farm/orchard-world-bg-v3.webp') center top/cover fixed no-repeat; }
html[data-home-theme="night"] body.recharge-page { background:#073c35 url('../images/farm/home-night-bg-v1.webp') center top/cover fixed no-repeat; }
.recharge-page-shell { min-height:100vh; min-height:100dvh; display:flex; align-items:center; justify-content:center; padding:32px 0; background:#04101c52; }
body .recharge-standalone { margin:0 auto; max-height:none; }
@media(max-width:350px) { body .recharge-panel { width:calc(100% - 32px); } .recharge-panel-content { padding:18px 16px; } body .recharge-panel-header h2 { font-size:25px; } }
