.display-name-card{--name-surface: #F1F5F9;--name-input: #FFFFFF;--name-ink: #0F172A;--name-accent: #2563EB;box-sizing:border-box;width:310px;max-width:100%;padding:18px;background:var(--name-surface);color:var(--name-ink);border:1px solid #D9E2EC;border-radius:18px;box-shadow:0 8px 22px #0f172a14;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;animation:display-name-arrive .42s cubic-bezier(.22,1,.36,1) both}.display-name-card .profile-head{display:flex;align-items:center;gap:12px}.display-name-card .user-mark{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:13px;background:#dbeafe;color:var(--name-accent)}.display-name-card .form-fields{min-width:0;flex:1}.display-name-card .field-label{display:block;margin:0 0 6px;font-size:13px;font-weight:600;line-height:1.35;color:#334155}.display-name-card .name-input{box-sizing:border-box;width:100%;height:44px;padding:0 12px;border:1px solid #CBD5E1;border-radius:10px;background:var(--name-input);color:var(--name-ink);font:500 15px/1.4 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;box-shadow:0 1px 2px #0f172a0a;outline:none;transition:border-color .18s ease,box-shadow .18s ease}.display-name-card .name-input:focus{border-color:var(--name-accent);box-shadow:0 0 0 3px #2563eb29}.display-name-card .actions{display:flex;gap:9px;margin-top:15px;padding-left:54px}.display-name-card .action{box-sizing:border-box;min-height:39px;flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 12px;border:1px solid transparent;border-radius:10px;font:600 13px/1 system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .12s ease}.display-name-card .save{background:var(--name-accent);color:var(--name-input);box-shadow:0 2px 5px #2563eb33}.display-name-card .save:hover{background:#1d4ed8;box-shadow:0 3px 9px #2563eb3d}.display-name-card .save:active,.display-name-card .cancel:active{transform:scale(.98)}.display-name-card .cancel{background:var(--name-input);border-color:#cbd5e1;color:#334155}.display-name-card .cancel:hover{background:#f8fafc;border-color:#94a3b8}.display-name-card .action:focus-visible{outline:3px solid rgba(37,99,235,.25);outline-offset:2px}.display-name-card .action svg{width:15px;height:15px;flex:none}.display-name-card .action:disabled{opacity:.5;pointer-events:none}.display-name-card .display-value{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:500;line-height:1.4}.display-name-card .edit-action{flex:none;padding:0;width:39px}@keyframes display-name-arrive{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}