:root { color-scheme: dark; font-family: "Microsoft YaHei", "PingFang SC", sans-serif; color: #f5ead2; background: #07130e; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at 50% 0, #244633, #07130e 64%); }
a { color: #f0c879; }
button, input { font: inherit; }
[hidden] { display: none !important; }
.account-shell { width: min(960px, calc(100% - 32px)); margin: 0 auto; padding: 68px 0 80px; }
.account-heading { margin-bottom: 32px; text-align: center; }
.account-heading p, .eyebrow { color: #d9ac63; font-size: 12px; letter-spacing: 3px; }
.account-heading h1 { margin: 12px 0; color: #ffdf9a; font: 700 clamp(30px, 4vw, 48px)/1.25 "STKaiti", "KaiTi", serif; }
.account-heading span, .account-card p, .account-help { color: #b7c0af; font-size: 13px; line-height: 1.8; }
.account-options { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.account-card { padding: 26px; border: 1px solid #9d773d; border-radius: 10px; background: linear-gradient(150deg, #21362b, #0e1b16); box-shadow: 0 18px 40px #0008; }
.account-card h2 { margin: 7px 0 10px; color: #ffe4a6; font-size: 23px; }
.account-card h3 { margin: 24px 0 10px; color: #e9d197; font-size: 17px; }
.account-card form { display: grid; gap: 13px; margin-top: 23px; }
.account-card form > label:not(.consent) { display: grid; gap: 7px; color: #eee0c1; font-size: 13px; }
.account-card input:not([type="checkbox"]) { width: 100%; min-height: 43px; padding: 8px 12px; border: 1px solid #80683f; border-radius: 4px; background: #0d1712; color: #fff1d5; }
.account-card .consent { display: flex; align-items: start; gap: 8px; color: #c8d0bf; font-size: 12px; line-height: 1.7; }
.account-card .consent input { margin-top: 3px; accent-color: #c18b40; }
.account-card button, .account-action { display: block; min-height: 44px; padding: 10px 16px; border: 1px solid #f7d28a; border-radius: 5px; background: linear-gradient(#e6a64d, #9d4e22); color: #fff4da; font-weight: 700; text-align: center; text-decoration: none; cursor: pointer; }
.account-card button:disabled { opacity: .5; cursor: wait; }
#tap-pending { margin-top: 20px; text-align: center; }
#tap-pending details { margin-top: 14px; padding: 12px; border: 1px solid #746e47; border-radius: 5px; }
#tap-pending summary { color: #f0c879; cursor: pointer; }
#tap-open-hint { margin: 0 0 10px; }
#tap-qr img { width: 190px; max-width: 100%; padding: 10px; background: white; image-rendering: pixelated; }
#tap-pending a, #tap-pending button { margin-top: 10px; }
#tap-pending a { display: block; padding: 10px; border: 1px solid #f0c879; border-radius: 5px; text-decoration: none; }
#tap-open { background: linear-gradient(#e6a64d, #9d4e22); color: #fff4da; font-weight: 700; }
#tap-check, #tap-retry { width: 100%; }
#tap-retry { background: #344735; }
#account-roles { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 24px; color: #d8dccb; font-size: 13px; }
#account-roles span { border: 1px solid #746e47; padding: 7px 10px; border-radius: 4px; }
#account-error { min-height: 20px; margin: 20px 0 0; color: #ffb5a4; text-align: center; }
.account-help { margin-top: 15px; text-align: center; }
@media (max-width: 680px) { .account-shell { padding-top: 42px; } .account-options { grid-template-columns: 1fr; } .account-card { padding: 20px; } }