/* one-wallet-v1 (rules: UI_STANDARD.md, numbers: UI_SPEC.md). The member's only balance is the wallet.
   Colours: the account-centre theme tokens (black / white / grey) and the brand lime only for the tile outline and the
   small tag. Radii 20 / 12 / 999. Buttons 48 (primary form key) / 40 (tile keys). Glass values are never written here:
   the glass skin reads the --glass-* tokens in bigbit-theme-colors.css; .account-trading-card / .account-button already
   follow it, the few new controls below only point at those tokens. */

/* 1 · wallet tile in the assets card (account-center.js walletTile) */
.account-wallet-cards{padding:4px}
.account-wallet-card{flex:1 1 300px;min-width:260px;max-width:460px;gap:6px;outline:2px solid var(--bb-theme-accent,#b8ff3d);outline-offset:-2px}
.account-wallet-head{display:flex;align-items:center;gap:8px;min-width:0}
.account-wallet-head b{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-tag{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:var(--ac-inner);color:var(--ac-muted);font-size:12px;font-weight:500;line-height:1;white-space:nowrap;flex:none}
.account-tag-lime{background:color-mix(in srgb,var(--bb-theme-accent,#b8ff3d) 40%,transparent);color:#111}
html[data-bigbit-theme="dark"] .account-tag-lime{color:#f2f2f2}
.account-wallet-card .account-actions{width:100%;margin-top:4px;flex-wrap:nowrap}
.account-wallet-card .account-actions .account-button{flex:1;min-height:40px;padding:0 10px}
/* the three tile keys are one row of equal 40 keys (the page-level primary rule would make 入金 48) */
html body [data-account-center] .account-wallet-card .account-actions .account-button.account-button-primary{min-height:40px!important;height:40px!important}
.account-wallet-card small [data-account-money]{font-variant-numeric:tabular-nums}
@media(max-width:680px){.account-wallet-card{flex:1 1 100%;max-width:none;min-width:0}}

/* 2 · deposit sheet: the target is the wallet, one fixed row (deposit-panel.js paintAccounts) */
.dp-acct.dp-acct-wallet{align-items:center;gap:10px;min-height:56px;padding:10px 12px;border:1px solid var(--dp-edge);border-radius:12px;background:var(--dp-inner);color:var(--dp-ink)}
.dp-acct-dot{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--dp-accent);color:var(--dp-accent-ink)}
.dp-acct-dot .dp-ico{width:16px;height:16px;fill:currentColor}
.dp-acct-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;line-height:1.3}
.dp-acct-text>span{font-size:11px;color:var(--dp-muted)}
.dp-acct-text>b{font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-acct-text>small{font-size:12px;color:var(--dp-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dp-tag-fixed{background:color-mix(in srgb,var(--dp-accent) 40%,transparent);color:var(--dp-accent-ink)}
html[data-bigbit-skin=glass] .dp-acct.dp-acct-wallet{background:var(--glass-bg-soft);border-color:var(--glass-edge-soft)}

/* 3 · transfer / withdrawal drawn in the funds card from the wallet (account-funds-host.js openWalletForm) */
.account-funds-card[data-state="wallet"]{min-height:0;overflow:visible}
/* the phone layout starts its sections at content width; the wallet form card spans the column like the deposit panel does */
.account-center-content>.account-section-only:has(.ow-form){align-self:stretch;justify-self:stretch;width:100%;min-width:0}
.ow-form{display:flex;flex-direction:column;gap:16px;max-width:520px;padding:24px;color:var(--fh-text)}
.ow-form *{box-sizing:border-box}
.ow-form [hidden]{display:none!important}
.ow-pair{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);gap:8px;align-items:center}
.ow-target{display:flex;flex-direction:column;gap:2px;min-width:0;min-height:72px;padding:12px 14px;border:1px solid var(--fh-line);border-radius:12px;background:var(--fh-inner)}
.ow-target>small{font-size:12px;color:var(--fh-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ow-target>b{font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ow-swap{display:grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--fh-line);border-radius:50%;background:var(--fh-card);color:var(--fh-text);cursor:pointer;transition:transform .15s ease,background-color .15s ease}
.ow-swap svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ow-swap:hover{background:var(--fh-inner)}
.ow-swap:active{transform:scale(.96)}
.ow-swap:focus-visible,.ow-input:focus-visible,.ow-select:focus-visible{outline:2px solid var(--fh-text);outline-offset:2px}
.ow-field{display:flex;flex-direction:column;gap:8px;font-size:14px}
.ow-field>span{color:var(--fh-muted);font-size:12px}
.ow-form .ow-input,.ow-form .ow-select{width:100%;height:48px;padding:0 14px;border:1px solid var(--fh-line);border-radius:12px;background:var(--fh-inner);color:var(--fh-text);font:inherit;font-size:16px;margin:0;-webkit-appearance:none;appearance:none}
.ow-form .ow-target .ow-select{height:40px;padding:0 10px;margin-top:2px;font-size:15px;font-weight:600;background:var(--fh-card)}
.ow-input::placeholder{color:var(--fh-muted);opacity:.6}
.ow-msg{margin:0;min-height:20px;font-size:13px;line-height:20px;color:var(--fh-muted);overflow-wrap:anywhere}
.ow-msg:empty{display:none}
.ow-msg.ow-bad{color:var(--bb-theme-down,#d64545)}
html body [data-account-center] .ow-form .ow-submit{width:100%;min-height:48px;height:48px;border-radius:12px;font-size:15px}
.ow-submit[aria-busy="true"]{opacity:.7}
@media(max-width:760px){.ow-form{padding:20px}.ow-pair{grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);gap:6px}.ow-target{padding:10px 10px}}
@media(max-width:400px){.ow-pair{grid-template-columns:1fr;gap:8px}.ow-pair .ow-swap{justify-self:center}}
/* glass skin: the sheet is one piece of glass; the small controls get the raise / press relief from the tokens */
html[data-bigbit-skin=glass] .ow-target,html[data-bigbit-skin=glass] .ow-form .ow-input,html[data-bigbit-skin=glass] .ow-form .ow-select{background:var(--glass-bg-soft);border-color:var(--glass-edge-soft)}
html[data-bigbit-skin=glass] .ow-swap{background:var(--glass-bg-soft);border-color:var(--glass-edge-soft);box-shadow:var(--glass-raise)}
html[data-bigbit-skin=glass] .ow-swap:active{box-shadow:var(--glass-press)}
html[data-bigbit-skin=glass] .account-tag{box-shadow:var(--glass-raise)}
@media (prefers-reduced-motion:reduce){.ow-swap{transition:none}}