{{template "settings/_header.html" .}}
        <!-- 个人资料 -->
        <div class="settings-card">
            <div class="settings-card-header">
                <h2>个人资料</h2>
                <p class="settings-card-desc">你的公开信息和基本资料</p>
            </div>
            {{if .PendingTypes}}
            <div class="settings-audit-notice">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
                    <circle cx="12" cy="12" r="10"/><line x1="12" y1="8" x2="12" y2="12"/><line x1="12" y1="16" x2="12.01" y2="16"/>
                </svg>
                <span>
                    {{range $i, $t := .PendingTypes}}{{if $i}}、{{end}}{{index $.AuditTypes $t}}{{end}}审核中
                </span>
            </div>
            {{end}}
            <div class="settings-card-body">
                <div class="info-row">
                    <span class="info-label">用户名</span>
                    <span class="info-value">
                        <input type="text" id="usernameInput" class="settings-text-input" value="{{.User.Username}}" maxlength="16" autocomplete="off" data-has-completed-rename="{{.HasCompletedRename}}">
                        <span class="char-counter" id="usernameCounter"></span>
                    </span>
                </div>
                <div class="info-row">
                    <span class="info-label">头像</span>
                    <span class="info-value">
                        <div class="avatar-upload-wrap" id="avatarWrap">
                            {{if .User.Avatar}}
                            <img src="{{.User.Avatar}}?v={{.User.UpdatedAt.Unix}}" alt="avatar" class="avatar-preview" id="avatarPreview">
                            {{else}}
                            <div class="avatar-placeholder" id="avatarPreview">
                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" width="24" height="24"><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 4-7 8-7s8 3 8 7"/></svg>
                            </div>
                            {{end}}
                            <span class="avatar-hint">点击更换</span>
                        </div>
                        <input type="file" id="avatarInput" class="avatar-input-hidden" accept="image/jpeg,image/png,image/webp">
                    </span>
                </div>
                <div class="info-row">
                    <span class="info-label">个性签名</span>
                    <span class="info-value">
                        <textarea id="bioInput" class="settings-textarea" maxlength="128" placeholder="写一句话介绍自己...">{{.User.Bio}}</textarea>
                        <div class="char-counter" id="bioCounter"></div>
                    </span>
                </div>
                <div class="info-row">
                    <span class="info-label">角色</span>
                    <span class="info-value">
                        <span class="role-tag role-{{.User.Role}}">{{.RoleName}}</span>
                    </span>
                </div>
                <div class="settings-card-footer">
                    <button id="saveProfileBtn" class="settings-save-btn">保存</button>
                </div>
            </div>
        </div>
{{template "settings/_footer.html" .}}
<script src="/static/js/settings-profile.js?v={{assetV "/static/js/settings-profile.js"}}" nonce="{{.CSPNonce}}"></script>