#main-container { max-width: 1080px; padding: 28px; }
.phone-account { max-width: 1040px; margin: 12px auto 28px; padding: 0; color: var(--text, #1e2433); font-size: 16px; }
.phone-account [hidden] { display: none !important; }
.phone-account h1 { margin: 0 0 10px; font-size: 30px; }
.phone-account h2 { margin: 0 0 16px; font-size: 21px; }
.phone-account p { line-height: 1.65; margin: 10px 0 18px; font-weight: 400; }
.phone-account a { color: #4f46e5; }
.account-heading, .account-profile, .account-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.account-heading { margin-bottom: 22px; }
.account-heading > a { white-space: nowrap; }
.account-panel { padding: 28px; margin-bottom: 24px; background: #fff; border: 1px solid #e1e5f0; border-radius: 16px; box-shadow: 0 5px 24px #25305806; }
#account-auth { max-width: 510px; margin: 0 auto; }
.account-tabs { display: flex; gap: 20px; margin-bottom: 26px; border-bottom: 1px solid #e1e5f0; }
.account-tabs a { padding: 8px 0 14px; text-decoration: none; color: #606a80; }
.account-tabs a[aria-current="page"] { color: #4f46e5; border-bottom: 3px solid #4f46e5; font-weight: 600; }
.phone-account label { display: block; font-size: 14px; font-weight: 600; margin: 18px 0 8px; }
.phone-account input { box-sizing: border-box; display: block; width: 100%; min-width: 0; height: 46px; border: 1px solid #cdd4e4; border-radius: 8px; padding: 10px 12px; background: #fff; color: #1e2433; font: inherit; }
.phone-account input:focus, .phone-account button:focus-visible, .phone-account a:focus-visible { outline: 3px solid #a9b6ff; outline-offset: 2px; }
.phone-account button { font: inherit; font-size: 14px; cursor: pointer; min-height: 44px; min-width: 0; width: auto; padding: 10px 16px; border-radius: 8px; border: 1px solid transparent; box-shadow: none; }
.phone-account button:disabled { cursor: not-allowed; opacity: .55; }
.account-primary { background: #4f46e5; color: #fff; margin-top: 20px; }
.account-primary:hover:enabled { background: #4338ca; }
.account-secondary { background: #f5f6fc; border-color: #dce1ef !important; color: #34415a; }
.phone-account .account-wide { width: 100%; }
.account-row { display: flex; gap: 10px; align-items: center; }
.account-row > input { flex: 1; }
.account-row > button { flex: 0 0 auto; }
.phone-account .captcha-button { padding: 0; background: #f1f4ff; overflow: hidden; width: 156px; height: 53px; }
.captcha-button img { display: block; width: 156px; height: 53px; }
.phone-account .account-hint { font-size: 14px; color: #657088; }
.account-hint a { margin: 0 4px; }
.account-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.account-actions { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.account-card-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.account-card-actions .account-primary { margin-top: 0; }
.phone-account .account-buy { display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 44px; padding: 10px 16px; border: 1px solid; border-radius: 8px; text-decoration: none; font-size: 14px; color: #34415a; }
.account-bind-dialog { position: fixed; top: 50%; left: 50%; right: auto; bottom: auto; transform: translate(-50%, -50%); margin: 0; box-sizing: border-box; width: min(480px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 28px; color: #1e2433; background: #fff; border: 1px solid #e1e5f0; border-radius: 16px; box-shadow: 0 12px 48px #25305833; }
.account-bind-dialog::backdrop { background: #17203388; }
#account-bind-offer-error { color: #a32633; }
#account-bind-offer-error:empty { display: none; }
.account-card-value { overflow-wrap: anywhere; font-family: ui-monospace, monospace; }
.account-bound-card-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.account-bound-card-row .account-card-value { margin: 0; }
.phone-account #account-copy-card { min-height: 36px; padding: 6px 12px; }
#account-unbind-error { color: #a32633; }
#account-unbind-error:empty { display: none; }
.account-balance { display: flex; flex-direction: column; gap: 8px; margin: 24px 0; }
.account-balance span { color: #657088; font-size: 14px; }
.account-balance strong { font-size: 38px; font-weight: 650; color: #4f46e5; }
.account-link { display: inline-block; margin-top: 16px; }
#account-message:empty { display: none; }
#account-message { padding: 14px 18px; border: 1px solid #b9dfd0; border-radius: 8px; background: #effaf4; color: #166346; }
#account-message[data-error="true"] { border-color: #ecc3c7; background: #fff3f3; color: #a32633; }
.account-table-wrap { overflow-x: auto; }
.phone-account table { width: 100%; border-collapse: collapse; font-size: 14px; }
.phone-account th, .phone-account td { text-align: left; padding: 15px 10px; border-bottom: 1px solid #e8ebf4; white-space: nowrap; }
.phone-account th { color: #657088; font-weight: 500; }
.account-pagination { display: flex; gap: 16px; justify-content: flex-end; align-items: center; margin-top: 20px; font-size: 14px; }
.account-pagination > * { white-space: nowrap; }
@media (max-width: 680px) {
 #main-container { padding: 18px 12px; }
 .phone-account { padding: 0; margin-top: 10px; }
 .account-panel { padding: 20px; }
 .account-grid { grid-template-columns: 1fr; gap: 0; }
 .account-heading, .account-profile, .account-section-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
 .account-tabs { gap: 16px; font-size: 14px; }
 .account-row { flex-wrap: wrap; }
 .account-row input { flex-basis: 140px; }
 .account-pagination { justify-content: center; gap: 8px; }
 .account-pagination button { padding: 10px; }
}