/* Account and billing surfaces for the approved Lansheng shell. */
#dialog:has(.account-studio){position:fixed;width:min(570px,calc(100vw - 32px));max-width:none;max-height:calc(100dvh - 40px);padding:0;border:1px solid #e0e8f2;border-radius:22px;background:#fff;color:#182d47;box-shadow:0 28px 90px #132d5533;overflow:auto}
#dialog:has(.account-studio)::backdrop{background:#12263c66;backdrop-filter:blur(3px)}
#dialog:has(.account-studio) .dialog-head{height:0;margin:0;padding:0;border:0}
#dialog:has(.account-studio) #dialog-title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
#dialog:has(.account-studio) #dialog-close{position:absolute;right:14px;top:14px;z-index:2;width:36px;height:36px;min-height:36px;margin:0;padding:0;border:0;border-radius:10px;background:transparent;box-shadow:none;color:#8297b5;font-size:26px;line-height:1}
#dialog:has(.account-studio) #dialog-close:hover{background:#f0f5fa;color:#344f75}
#dialog:has(.account-studio) #dialog-body{max-height:none;overflow:visible}
.account-studio{padding:31px 34px 30px;font-family:"PingFang SC","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.account-studio *{box-sizing:border-box}.account-studio [hidden]{display:none!important}
.account-studio .account-hero{position:relative;min-height:124px;padding:4px 0 19px;display:flex;align-items:center;margin:0}
.account-studio .account-hero--illustrated{min-height:171px;padding-top:10px;padding-bottom:18px}
.account-hero-copy{position:relative;z-index:1;width:100%;min-width:0}.account-hero--illustrated .account-hero-copy{width:67%}
.account-studio .account-brand{display:flex;align-items:center;gap:7px;margin-bottom:15px;font-size:12px;font-weight:500;color:#778fac;letter-spacing:.4px}
.account-brand img{display:block;width:20px;height:25px;object-fit:contain;flex:none}
.account-studio .account-hero h3{margin:0 0 11px;font-size:27px;line-height:1.35;letter-spacing:-.7px;font-weight:700;color:#122b49}
.account-studio .account-hero p{margin:0;color:#6681a6;font-size:13px;line-height:1.7}
.account-hero-art{position:absolute;right:-18px;bottom:6px;width:220px;height:150px;object-fit:contain;pointer-events:none}
.account-studio .account-tabs{display:flex;gap:30px;margin:0 0 25px;padding:0;border-bottom:1px solid #e1e9f4}
.account-studio .account-tabs button{position:relative;flex:none;margin:0 0 -1px;min-height:47px;padding:10px 10px 13px;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;box-shadow:none;color:#5f7798;font-size:15px;font-weight:500}
.account-studio .account-tabs button[aria-selected=true]{border-bottom-color:#ec5d15;color:#e75810;font-weight:600}
.account-studio .account-tabs button:hover{color:#d8490b;background:transparent}
.account-studio .account-form{display:flex;flex-direction:column;gap:18px;margin:0}
.account-studio label{display:flex;flex-direction:column;gap:8px;min-width:0;margin:0;font-size:14px;color:#253f63}
.account-studio label>span{margin:0;font-size:14px;font-weight:500;color:#263f62}
.account-studio input{width:100%;min-width:0;height:49px;margin:0;padding:12px 14px;border:1px solid #dbe5f1;border-radius:11px;background:linear-gradient(135deg,#fff,#fafcff);box-shadow:inset 0 1px 3px #244b7610;color:#203957;font:inherit;font-size:14px;line-height:1.5;outline-offset:2px}
.account-studio input::placeholder{color:#94a7c2;opacity:1}.account-studio input:focus{border-color:#6b93c5;outline:2px solid #c6dafa80;box-shadow:0 0 0 3px #e5f0ff65}
.account-studio input[readonly]{background:#f4f7fb;color:#6b819e;box-shadow:none}
.account-studio input[aria-invalid=true]{border-color:#e38b7d;background:#fffafa}.account-studio .account-password-field{min-width:0}.account-studio .account-password-field>label{margin-bottom:8px}.account-password-control{position:relative;min-width:0}.account-studio .account-password-control input{padding-right:51px}.account-studio .account-password-control>button{position:absolute;right:5px;top:4px;display:grid;place-items:center;width:41px;height:41px;min-height:41px;margin:0;padding:10px;border:0;border-radius:8px;background:transparent;box-shadow:none;color:#839bbd}.account-studio .account-password-control>button:hover{color:#3f6ba2;background:#eff5fc}.account-password-control svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.account-studio .account-code-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}
.account-studio #account-send{min-width:124px;height:49px;min-height:49px;margin:0;padding:10px 15px;font-size:13px;border:1px solid #b9cce6;border-radius:11px;background:#fbfdff;box-shadow:none;color:#466b9f;white-space:nowrap}
.account-studio #account-send:hover:not(:disabled){background:#f0f6ff;border-color:#86a7d4}
.account-studio .primary{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:51px;margin:2px 0 0;padding:13px 18px;border:1px solid #e45910;border-radius:12px;background:linear-gradient(120deg,#f97012,#e8570d);box-shadow:inset 0 1px #ffb97666,0 2px 6px #c3571110;color:#fff;font-size:16px;font-weight:600;line-height:1.4}
.account-studio .primary:hover:not(:disabled){background:#d94d0b;box-shadow:0 4px 12px #c3571120}
.account-studio button:disabled{opacity:.6;cursor:default;box-shadow:none}
.account-studio button:focus-visible{outline:2px solid #638ebf;outline-offset:3px}
.account-studio button.account-link{display:block;align-self:center;min-height:40px;width:auto;max-width:100%;margin:-7px 0 -7px;padding:9px 12px;border:0;background:transparent;box-shadow:none;color:#4b72a7;font-size:13px;line-height:1.5}
.account-studio button.account-link:hover{background:#f2f7fd;color:#285c9e}
.account-studio .account-disclosure{margin:0;text-align:center;color:#7a91af;font-size:12px;line-height:1.8}
.account-studio .account-field-hint{margin:-10px 0 -1px;color:#8196b2;font-size:11px;line-height:1.8}
.account-studio .account-note{margin:0;padding:12px 14px;border:1px solid #e3edf8;border-radius:10px;background:#f3f8ff;color:#5e7ca3;font-size:12px;line-height:1.8}
.account-studio>.account-note{margin-bottom:20px}
.account-studio .account-success{margin:0 0 20px;padding:12px 14px;border:1px solid #dbece3;border-radius:10px;background:#eff9f3;color:#357e55;font-size:13px;line-height:1.7}
.account-studio .account-error{margin:-2px 0;padding:11px 13px;border:1px solid #f4d1ca;border-radius:10px;background:#fff4f1;color:#b54032;font-size:13px;line-height:1.7}
.account-studio .account-separator{display:flex;align-items:center;gap:14px;margin:2px 0 -1px;font-size:11px;color:#8da1bb}.account-separator:before,.account-separator:after{content:"";height:1px;background:#e3ebf5;flex:1}
.account-studio .account-formal-link{width:100%;min-height:47px;margin:0;padding:11px 14px;border:1px solid #bdcfe8;border-radius:11px;background:#fbfdff;box-shadow:none;color:#4f72a2;font-size:13px;line-height:1.5}
.account-studio .account-formal-link:hover{background:#f0f6ff}
.account-studio[data-account-mode=test] .account-hero p{font-size:11px;line-height:1.8}.account-studio[data-account-mode=test] .account-hero-copy{width:65%}

/* Existing balance/pack markup remains data driven; these selectors only style it. */
#dialog:has(.package),#dialog:has(.credits-studio){width:min(940px,calc(100vw - 40px));max-width:none;border:1px solid #dfe8f3;border-radius:21px;padding:27px;background:#fff;color:#1a3556;box-shadow:0 24px 80px #1337592e}
#dialog:has(.package)::backdrop,#dialog:has(.credits-studio)::backdrop{background:#12263c66;backdrop-filter:blur(3px)}
#dialog:has(.package) .dialog-head,#dialog:has(.credits-studio) .dialog-head{margin:0 0 19px;padding-bottom:13px;border-bottom:1px solid #e7edf5}
#dialog:has(.package) #dialog-title,#dialog:has(.credits-studio) #dialog-title{font-size:26px;color:#172f4c;letter-spacing:-.5px}
#dialog:has(.package) #dialog-body>.hint,.credits-notice{margin:0 0 19px;padding:12px 15px;border:1px solid #deebf9;border-radius:11px;background:#f2f7fe;color:#607ca0;font-size:12px;line-height:1.8}
#dialog:has(.package) .metrics,.credits-studio .metrics{display:grid;grid-template-columns:1fr 1fr;gap:0;margin:0 0 23px;padding:22px 24px;border:1px solid #e1eaf5;border-radius:15px;background:linear-gradient(120deg,#fff,#f8fbff)}
#dialog:has(.package) .metrics>div,.credits-studio .metrics>div{display:flex;flex-direction:column;gap:10px;border:0;border-radius:0;padding:0;background:transparent;box-shadow:none}
#dialog:has(.package) .metrics>div+div,.credits-studio .metrics>div+div{padding-left:30px;border-left:1px solid #dfe8f4}
#dialog:has(.package) .metrics span,.credits-studio .metrics span{font-size:14px;color:#536d90}
#dialog:has(.package) .metrics strong,.credits-studio .metrics strong{font-size:40px;line-height:1.15;font-weight:650;color:#173559;letter-spacing:-1px}
#dialog:has(.package) #dialog-body>.row,.credits-packages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:0 0 22px}
#dialog:has(.package) .package,.credits-studio .package{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0;padding:20px 18px;border:1px solid #dce7f3;border-radius:13px;background:linear-gradient(145deg,#fff,#fcfdff);box-shadow:0 3px 9px #26456904}
#dialog:has(.package) .package>span,.credits-studio .package>span{font-size:14px;font-weight:600;color:#25436a}
#dialog:has(.package) .package>strong,.credits-studio .package>strong{font-size:24px;font-weight:650;color:#173559;line-height:1.4}
#dialog:has(.package) .package button,.credits-studio .package button{width:100%;margin:4px 0 0;min-height:42px;padding:10px 9px;border:1px solid #f3c7ad;border-radius:10px;background:#fff4eb;color:#c44b12;font-size:12px;font-weight:500;line-height:1.5;box-shadow:none}
#dialog:has(.package) .package button:hover:not(:disabled),.credits-studio .package button:hover:not(:disabled){border-color:#e36523;background:#ffecdf}
#dialog:has(.package) .package button:disabled,.credits-studio .package button:disabled{background:#edf1f6;border-color:#e0e7ef;color:#8e9db1;opacity:.85}
#dialog:has(.package) #dialog-body>h3,.credits-studio h3{margin:22px 0 13px;font-size:19px;color:#1d3a60}
#dialog:has(.package) #dialog-body>p.muted,.credits-ledger-row{margin:0;padding:13px 14px;border-bottom:1px solid #e8eff6;color:#5d7697;font-size:13px;line-height:1.7;overflow-wrap:anywhere}
.credits-studio .credits-caption{font-size:12px;line-height:1.8;color:#8195ae}.credits-studio .credits-empty{padding:30px 18px;border:1px dashed #dbe6f2;border-radius:12px;background:#fbfdff;text-align:center;color:#859bb6;font-size:13px}
@media(max-width:600px){#dialog:has(.account-studio){width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:18px}.account-studio{padding:23px 23px 25px}.account-studio .account-hero{min-height:118px}.account-studio .account-hero--illustrated{min-height:164px;padding-top:16px}.account-studio .account-hero h3{font-size:24px;letter-spacing:-.7px}.account-studio .account-hero p{font-size:12px}.account-studio .account-brand{font-size:10px;gap:6px;margin-bottom:15px}.account-brand img{width:18px;height:22px}.account-hero--illustrated .account-hero-copy{width:72%}.account-hero-art{width:155px;height:120px;right:-18px;bottom:11px;opacity:.9}.account-studio .account-tabs{margin-bottom:22px;gap:21px}.account-studio .account-tabs button{font-size:14px}.account-studio .account-form{gap:17px}.account-studio label,.account-studio label>span{font-size:13px}.account-studio input{font-size:14px;height:48px}.account-studio #account-send{min-width:104px;padding-inline:11px;height:48px;min-height:48px;font-size:12px}.account-studio .account-code-row{gap:10px}.account-studio .primary{font-size:15px;min-height:50px}.account-studio .account-note{font-size:11px;padding:11px 12px}.account-studio .account-disclosure{font-size:11px}.account-studio .account-field-hint{font-size:10px}.account-studio[data-account-mode=test] .account-hero-copy{width:71%}.account-studio[data-account-mode=test] .account-hero p{max-width:188px;font-size:10px}#dialog:has(.package),#dialog:has(.credits-studio){width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:20px 18px;border-radius:17px}#dialog:has(.package) #dialog-title,#dialog:has(.credits-studio) #dialog-title{font-size:23px}#dialog:has(.package) .metrics,.credits-studio .metrics{padding:18px;gap:0}#dialog:has(.package) .metrics strong,.credits-studio .metrics strong{font-size:34px}#dialog:has(.package) .metrics>div+div,.credits-studio .metrics>div+div{padding-left:21px}#dialog:has(.package) #dialog-body>.row,.credits-packages{grid-template-columns:1fr;gap:10px}#dialog:has(.package) .package,.credits-studio .package{display:grid;grid-template-columns:1fr auto;gap:7px 12px;align-items:center;padding:15px}#dialog:has(.package) .package>strong,.credits-studio .package>strong{font-size:21px;grid-column:1;grid-row:2}#dialog:has(.package) .package button,.credits-studio .package button{grid-column:2;grid-row:1/3;margin:0;width:auto;max-width:160px;padding-inline:12px}#dialog:has(.package) #dialog-body>p.muted,.credits-ledger-row{font-size:12px;padding:12px 7px}}
@media(max-width:360px){.account-studio{padding-inline:19px}.account-studio .account-hero h3{font-size:22px}.account-hero-art{width:140px;right:-15px}.account-studio .account-hero--illustrated .account-hero-copy{width:73%}.account-studio #account-send{min-width:99px;padding-inline:8px}}
/* Account and balance actions retain their meaning at touch sizes. */
.account-studio[data-account-mode=test-account] .account-formal-link{margin-top:12px}
.account-studio .account-field-hint,.account-studio .account-disclosure,.account-studio .account-note{font-size:13px;color:#5d718b}
.account-studio .account-error{scroll-margin-block:24px}
.account-studio #account-form[aria-busy=true] .primary{cursor:progress}
#dialog:has(.package),#dialog:has(.credits-studio){max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain}
.credit-ledger-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;padding:15px 2px;border-bottom:1px solid #e5ebf1;font-size:14px;line-height:1.6;color:#334a65}
.credit-ledger-row strong{font-size:14px;font-weight:600;color:#20364f}
.credit-ledger-secondary{font-size:13px;color:#64758a}
.credit-ledger-row time{margin-left:auto;font-size:12px;color:#64758a;font-variant-numeric:tabular-nums}
#recharge-error:not([hidden]){padding:12px 14px;border-radius:10px;background:#fff4f1;border:1px solid #f4d1ca;color:#a54032;font-size:13px;line-height:1.6}
@media(max-width:600px){
 .account-studio .account-hero--illustrated{min-height:140px;padding-top:6px}
 .account-studio input{font-size:16px}
 .account-studio .account-field-hint,.account-studio .account-disclosure,.account-studio .account-note{font-size:12px}
 .credit-ledger-row{gap:5px 12px;padding-block:14px}
 .credit-ledger-row time{flex-basis:100%;margin-left:0}
 #dialog:has(.package) .metrics strong,.credits-studio .metrics strong{font-size:30px;overflow-wrap:anywhere}
}
