/* 职责：共享导航、表单原语和账号容器；登录专属排版由 auth.css 拥有。 */
:root {
    color-scheme:light;
    --ink:#192236;
    --muted:#768197;
    --blue:#3e61f4;
    --line:#e5e9f1;
    --surface:#fff;
    --canvas:#f3f5f9;
    --danger:#b43346;
    font-family:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
    font-size:14px;
    line-height:1.6;
    color:var(--ink);
    background:var(--canvas);
    font-synthesis:none;
}
* {
    box-sizing:border-box;
}
body {
    margin:0;
}
button,input,textarea,select {
    font:inherit;
}
button,a,input,textarea,select {
    -webkit-tap-highlight-color:transparent;
}
button {
    cursor:pointer;
}
a {
    color:var(--blue);
    text-decoration:none;
}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible {
    outline:3px solid #8fa5ff;
    outline-offset:3px;
}
[hidden] {
    display:none!important;
}
h1,h2,h3,p {
    margin:0;
}
svg {
    display:block;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}
button:disabled {
    cursor:wait;
}
input::placeholder,textarea::placeholder {
    color:#a1a9b9;
    opacity:1;
}
.site-header,.site-footer {
    width:min(1120px,calc(100% - 80px));
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.site-header {
    height:100px;
}
.brand {
    display:inline-flex;
    align-items:center;
    gap:12px;
    color:var(--ink);
    font-size:23px;
    font-weight:750;
    letter-spacing:-.8px;
}
.brand-light {
    font-weight:400;
}
.brand-mark {
    width:35px;
    height:35px;
    border-radius:10px;
    background:var(--blue);
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:19px;
    font-weight:800;
    letter-spacing:-4px;
    padding-right:4px;
}
.brand-mark span {
    font-size:14px;
    margin-top:6px;
}
.header-caption {
    font-size:12px;
    letter-spacing:2px;
    color:#7a8498;
}
.site-footer {
    padding:26px 0 30px;
    font-size:11px;
    color:#8a93a4;
}
.site-footer span:last-child {
    letter-spacing:1px;
}
.field {
    min-width:0;
}
.field>label,.label-row>label {
    display:block;
    font-size:13px;
    font-weight:600;
    color:#3c475d;
    margin-bottom:7px;
}
.field input,.manage-form input,.manage-form textarea {
    width:100%;
    border:1px solid #dce2ed;
    border-radius:8px;
    background:white;
    padding:12px 14px;
    min-height:46px;
    color:var(--ink);
    font-size:14px;
    transition:border-color .15s,box-shadow .15s;
}
.field input:hover,.manage-form input:hover {
    border-color:#acb9d1;
}
.field input:focus,.manage-form input:focus,.manage-form textarea:focus {
    outline:none;
    border-color:#6984ff;
    box-shadow:0 0 0 3px #3e61f411;
}
.field input[aria-invalid=true] {
    border-color:#cf7884;
    background:#fffcfc;
}
.button {
    min-height:45px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:15px;
    border-radius:8px;
    padding:11px 18px;
    font-size:13px;
    font-weight:600;
    border:1px solid transparent;
    transition:background .15s,transform .15s;
}
.button-primary {
    background:var(--blue);
    color:#fff;
    box-shadow:0 4px 10px #3e61f419;
}
.button-primary:hover {
    background:#3252dc;
}
.button-primary:active {
    transform:translateY(1px);
}
.button-primary:disabled {
    opacity:.65;
}
.button-secondary {
    background:#f4f6fa;
    border-color:#dce3ef;
    color:#4a5872;
}
.button-danger {
    background:#fff5f6;
    border-color:#efd4d9;
    color:#b44355;
}
.button-arrow {
    font-size:18px;
    font-weight:400;
    line-height:1;
}
.button-spinner {
    height:15px;
    width:15px;
    border:2px solid #ffffff70;
    border-right-color:#fff;
    border-radius:50%;
    animation:spin .7s linear infinite;
}
.form-notice {
    padding:11px 13px;
    font-size:11px;
    line-height:1.85;
    border:1px solid #dce4ff;
    background:#f4f6ff;
    color:#53638b;
    border-radius:8px;
    overflow-wrap:anywhere;
}
.form-notice[data-tone=error] {
    background:#fff7f8;
    border-color:#f1dce1;
    color:#a23c4e;
}
.account-page .site-header {
    border-bottom:1px solid var(--line);
    height:87px;
}
/* 导航属于共享外壳，账号与登录页不能依赖官网专属样式才能正常显示。 */
.platform-brand {display:flex;align-items:center;gap:11px;color:#243549;font-size:22px;font-weight:650;white-space:nowrap;letter-spacing:-.5px}
.platform-brand img {flex:none;filter:drop-shadow(0 3px 5px #3d8ac51c)}
.platform-brand strong {font-weight:400;color:#8193a8}
.header-actions {display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.primary-navigation a {color:#738198;font-size:13px;transition:color .15s}
.primary-navigation a:hover,.primary-navigation a[aria-current=page] {color:var(--blue)}
.section-kicker {font-size:10px;letter-spacing:2px;font-weight:700;color:#8293a9}
.product-identity {display:flex;align-items:center;gap:18px;min-width:0}
.product-identity img {flex:none;border-radius:13px;object-fit:contain}
.product-identity h2 {font-size:22px;font-weight:650;letter-spacing:-.4px}
.product-identity p {color:#8591a5;font-size:13px;margin-top:5px}
.quiet-link {color:#647998;font-size:13px;display:inline-flex;align-items:center;gap:14px}
.quiet-link:hover {color:var(--blue)}
.back-link {margin-bottom:28px}
.empty-state {padding:36px 24px;text-align:center;color:#8692a5;font-size:13px}
@media(max-width:760px) {
    .site-header,.account-page .site-header {height:auto;min-height:88px;gap:16px;flex-wrap:wrap;padding:18px 0}
    .primary-navigation {order:3;width:100%;justify-content:space-between;gap:10px}
    .platform-brand {font-size:20px}
    .product-identity {gap:14px}
}
.header-actions .button {
    font-size:11px;
    min-height:34px;
    padding:6px 13px;
}
.account-label {
    color:#8792a7;
    font-size:11px;
}
.account-main {
    width:min(1120px,calc(100% - 80px));
    margin:36px auto 0;
}
.account-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:25px;
}
.account-heading h1 {
    font-size:27px;
    font-weight:650;
    margin-top:3px;
}
.account-heading p {
    font-size:12px;
    color:#8591a6;
    margin-top:7px;
}
.status-pill {
    padding:5px 11px;
    border:1px solid #cce3d8;
    color:#46826b;
    background:#eef8f3;
    border-radius:20px;
    font-size:10px;
}
.status-pill.is-expired {
    background:#fff4ed;
    border-color:#f0d7bf;
    color:#a46d40;
}
.account-metrics {
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr;
    gap:16px;
    margin-bottom:24px;
}
.metric-card {
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:14px;
    padding:22px 25px;
    min-width:0;
}
.metric-card>span {
    color:#8a96aa;
    font-size:11px;
}
.metric-card strong {
    display:block;
    margin:8px 0 5px;
    font-size:19px;
    font-weight:600;
    overflow-wrap:anywhere;
}
.metric-card small {
    font-size:10px;
    color:#9aa3b3;
}
.account-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}
.account-card {
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:14px;
    overflow:hidden;
    min-width:0;
}
.card-heading {
    padding:23px 26px 18px;
    display:flex;
    gap:12px;
    align-items:flex-start;
    border-bottom:1px solid #eff2f7;
}
.card-icon {
    width:32px;
    height:32px;
    flex:none;
    background:#edf1ff;
    color:#5773db;
    border-radius:8px;
    display:grid;
    place-items:center;
    font-size:17px;
}
.card-heading h2 {
    font-size:15px;
    font-weight:600;
}
.card-heading p {
    font-size:10px;
    color:#8d98aa;
    margin-top:5px;
}
.manage-form {
    padding:22px 26px;
    display:flex;
    flex-direction:column;
    gap:16px;
}
.manage-form label {
    display:flex;
    flex-direction:column;
    gap:7px;
    font-size:11px;
    font-weight:600;
    color:#506078;
}
.manage-form .field-hint {
    font-weight:400;
    margin-top:0;
}
.manage-form .button {
    align-self:flex-start;
    min-width:130px;
}
.manage-form .form-notice {
    font-weight:400;
}
.form-pair {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px;
}
.account-section-title {
    margin:32px 0 17px;
    font-size:17px;
    font-weight:600;
}
.security-warning {
    color:#977146;
    background:#fbf7ef;
    border:1px solid #eee4d0;
    padding:12px 14px;
    border-radius:8px;
    font-size:11px;
    line-height:1.9;
}
.generated-cards {
    padding:0 26px 24px;
}
.generated-cards h3 {
    font-size:13px;
    margin-bottom:7px;
}
.generated-cards p {
    font-size:10px;
    color:#8a95a8;
    margin-bottom:10px;
}
.generated-cards textarea {
    width:100%;
    min-height:150px;
    border-radius:8px;
    border:1px solid var(--line);
    background:#f6f8fc;
    padding:12px;
    font-size:11px;
    font-family:monospace;
    resize:vertical;
}
.account-page .site-footer {
    margin-top:10px;
}
.account-footer-note {
    font-size:11px;
    color:#96a0b2;
    margin-top:22px;
}
.account-top-form {
    margin:0;
}
@keyframes spin {to {transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce) {* {animation:none!important;transition:none!important}}
@media(max-width:1000px) {.site-header,.site-footer,.account-main {width:calc(100% - 48px)}}
@media(max-width:760px) {
    .site-header,.site-footer,.account-main {width:calc(100% - 40px)}
    .site-header,.account-page .site-header {height:auto;min-height:88px;gap:16px;flex-wrap:wrap;padding:18px 0}
    .primary-navigation {order:3;width:100%;justify-content:space-between;gap:10px}
    .account-grid {grid-template-columns:1fr;gap:16px}
    .card-heading,.manage-form {padding:20px}
    .manage-form input,.manage-form textarea {font-size:16px}
    .generated-cards {padding:0 20px 20px}
    .site-footer {font-size:10px}
}
@media(max-width:380px) {.form-pair {grid-template-columns:1fr}}