/* 账号设置:等级、选项卡、资料字段和社交账号入口。 */ /* 导入方:app/pages/account/index.vue。 */ .acct[data-v-8ca4eb3d] { gap: 16px; width: 100%; max-width: 64rem; margin: 0 auto; position: relative; } .acct[data-v-8ca4eb3d], .warn-list[data-v-8ca4eb3d] { flex-direction: column; display: flex; } .warn-list[data-v-8ca4eb3d] { gap: 12px; } .warn-row[data-v-8ca4eb3d] { flex-wrap: wrap; align-items: center; gap: 14px; display: flex; } .warn-name[data-v-8ca4eb3d] { width: 80px; font-size: 0.9375rem; font-weight: 500; } .warn-select[data-v-8ca4eb3d] { width: 150px; } .warn-err[data-v-8ca4eb3d] { min-width: 160px; color: var(--p-red-500, #ef4444); flex: 1; font-size: 0.875rem; } .sk[data-v-8ca4eb3d] { padding: 4px 0; } .page-head[data-v-8ca4eb3d] { align-items: center; gap: 10px; display: flex; } .page-head h2[data-v-8ca4eb3d] { margin: 0; font-size: 1.375rem; } .level-badge[data-v-8ca4eb3d] { font: inherit; cursor: pointer; background: 0 0; border: 1px solid; border-radius: 999px; padding: 2px 10px; font-size: 0.875rem; } .tabs[data-v-8ca4eb3d] { border-bottom: 1px solid var(--p-content-border-color, #e2e8f0); gap: 0; padding-top: 4px; display: flex; overflow: auto hidden; } .tab[data-v-8ca4eb3d] { white-space: nowrap; min-height: 50px; color: var(--p-text-muted-color, #64748b); cursor: pointer; background: 0 0; border: none; border-bottom: 2px solid #0000; flex-shrink: 0; margin-bottom: -1px; padding: 14px; font-size: 1rem; transition: color 0.15s, border-color 0.15s; } .tab[data-v-8ca4eb3d]:hover { color: var(--p-text-color, #334155); } .tab.active[data-v-8ca4eb3d] { color: var(--p-primary-color, #3b82f6); border-bottom-color: var(--p-primary-color, #3b82f6); font-weight: 500; } .panel[data-v-8ca4eb3d] { background: 0 0; border: 0; border-radius: 0; padding: 14px 0; } .sec-title[data-v-8ca4eb3d] { margin: 0 0 28px; font-size: 1.5rem; font-weight: 400; } .sec-desc[data-v-8ca4eb3d] { color: var(--p-text-muted-color, #64748b); margin: 0 0 16px; font-size: 0.9375rem; line-height: 1.7; } .divider[data-v-8ca4eb3d] { background: var(--p-content-border-color, #e2e8f0); height: 1px; margin-bottom: 20px; } .field[data-v-8ca4eb3d] { flex-direction: column; gap: 8px; margin-bottom: 21px; display: flex; } .field > .field-label[data-v-8ca4eb3d], .field > label[data-v-8ca4eb3d] { color: var(--p-text-color, #334155); font-size: 0.9375rem; } .sr-only[data-v-8ca4eb3d] { clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; width: 1px; height: 1px; margin: -1px; padding: 0; position: absolute; overflow: hidden; } .inline[data-v-8ca4eb3d] { flex-wrap: wrap; align-items: center; gap: 10px; display: flex; } .inline[data-v-8ca4eb3d] > :first-child { flex: 1; min-width: 180px; } .code-select[data-v-8ca4eb3d] { flex: 0 0 160px; } .actions[data-v-8ca4eb3d] { border-top: 1px solid var(--p-content-border-color, #e2e8f0); justify-content: flex-end; gap: 10px; margin-top: 4px; padding-top: 18px; display: flex; } /* 视口条件 (width<=768px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */ @media (width<=768px) { .tabs[data-v-8ca4eb3d] { gap: 0; } .tab[data-v-8ca4eb3d] { padding-inline: 10px; } .panel[data-v-8ca4eb3d] { padding: 14px 0; } } .page-head[data-v-8ca4eb3d] { justify-content: flex-end; position: absolute; top: -5px; right: 0; transform: translateY(-100%); } .tabs[data-v-8ca4eb3d] { scrollbar-width: thin; } /* 键盘操作的可见焦点:不要只保留鼠标 hover 效果而移除此反馈。 */ .tab[data-v-8ca4eb3d]:focus-visible { outline: 2px solid var(--p-primary-color); outline-offset: -3px; } .account-shortcuts[data-v-8ca4eb3d] { flex-wrap: wrap; align-items: center; gap: 10px; display: flex; } .social-field .sec-desc[data-v-8ca4eb3d] { margin: 7px 0; } /* 视口条件 (width<=640px) 下的响应式覆盖;保留相对基础规则的层叠顺序。 */ @media (width<=640px) { .acct[data-v-8ca4eb3d] { gap: 14px; } .page-head[data-v-8ca4eb3d] { position: static; transform: none; } .inline[data-v-8ca4eb3d] > :first-child { min-width: 0; } }